increase default depth 3 -> 5

Author: tanhauhau

site/content/docs/06-accessibility-warnings.md

@@ -190,7 +190,7 @@ export default {
 				'label-has-associated-control': {
 					labelComponents: ['CustomInputLabel'],
       		controlComponents: ['CustomInput'],
-      		depth: 3,
+      		depth: 5,
 				}
 			}
 		}
@@ -200,7 +200,7 @@ export default {
 
 - `labelComponents` is a list of Svelte component names that should be checked for an associated control.
 - `controlComponents` is a list of Svelte component names that will output an input element.
-- `depth` (default 3, max 25) is an integer that determines how deep within the label element the rule should look for an element to determine if the label element has associated control.
+- `depth` (default 5, max 25) is an integer that determines how deep within the label element the rule should look for an element to determine if the label element has associated control.
 
 ---
 

src/compiler/compile/utils/a11y.ts

@@ -179,7 +179,7 @@ export function contains_input_child(
 	rule_options: CompileOptions['a11y']['rules']['label-has-associated-control']
 ): boolean {
 	// magic number inspired from https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/main/src/rules/label-has-associated-control.js
-	const max_depth = Math.min(rule_options?.depth ?? 3, 25);
+	const max_depth = Math.min(rule_options?.depth ?? 5, 25);
 	const additional_component_names = rule_options?.controlComponents;
 
 	function traverse_children(