qc-trousse-sdg 1.4.3 → 1.4.4

package/public/js/qc-doc-sdg.js

@@ -33,6 +33,9 @@
 
 	const UNINITIALIZED = Symbol();
 
+	// Dev-time component properties
+	const FILENAME = Symbol('filename');
+
 	const NAMESPACE_HTML = 'http://www.w3.org/1999/xhtml';
 	const NAMESPACE_SVG = 'http://www.w3.org/2000/svg';
 
@@ -41,6 +44,16 @@
 	/* This file is generated by scripts/process-messages/index.js. Do not edit! */
 
 
+	/**
+	 * A snippet function was passed invalid arguments. Snippets should only be instantiated via `{@render ...}`
+	 * @returns {never}
+	 */
+	function invalid_snippet_arguments() {
+		{
+			throw new Error(`https://svelte.dev/e/invalid_snippet_arguments`);
+		}
+	}
+
 	/**
 	 * `%name%(...)` can only be used during component initialisation
 	 * @param {string} name
@@ -52,6 +65,26 @@
 		}
 	}
 
+	/**
+	 * Attempted to render a snippet without a `{@render}` block. This would cause the snippet code to be stringified instead of its content being rendered to the DOM. To fix this, change `{snippet}` to `{@render snippet()}`.
+	 * @returns {never}
+	 */
+	function snippet_without_render_tag() {
+		{
+			throw new Error(`https://svelte.dev/e/snippet_without_render_tag`);
+		}
+	}
+
+	/**
+	 * The `this` prop on `<svelte:element>` must be a string, if defined
+	 * @returns {never}
+	 */
+	function svelte_element_invalid_this_value() {
+		{
+			throw new Error(`https://svelte.dev/e/svelte_element_invalid_this_value`);
+		}
+	}
+
 	// Store the references to globals in case someone tries to monkey patch these, causing the below
 	// to de-opt (this occurs often when using popular extensions).
 	var is_array = Array.isArray;
@@ -112,6 +145,7 @@
 	const EFFECT_RAN = 1 << 15;
 	/** 'Transparent' effects do not create a transition boundary */
 	const EFFECT_TRANSPARENT = 1 << 16;
+	const INSPECT_EFFECT = 1 << 18;
 	const HEAD_EFFECT = 1 << 19;
 	const EFFECT_HAS_DERIVED = 1 << 20;
 	const EFFECT_IS_UPDATING = 1 << 21;
@@ -123,6 +157,43 @@
 	/* This file is generated by scripts/process-messages/index.js. Do not edit! */
 
 
+	/**
+	 * Calling `%method%` on a component instance (of %component%) is no longer valid in Svelte 5
+	 * @param {string} method
+	 * @param {string} component
+	 * @returns {never}
+	 */
+	function component_api_changed(method, component) {
+		{
+			throw new Error(`https://svelte.dev/e/component_api_changed`);
+		}
+	}
+
+	/**
+	 * Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working.
+	 * @param {string} component
+	 * @param {string} name
+	 * @returns {never}
+	 */
+	function component_api_invalid_new(component, name) {
+		{
+			throw new Error(`https://svelte.dev/e/component_api_invalid_new`);
+		}
+	}
+
+	/**
+	 * Keyed each block has duplicate key `%value%` at indexes %a% and %b%
+	 * @param {string} a
+	 * @param {string} b
+	 * @param {string | undefined | null} [value]
+	 * @returns {never}
+	 */
+	function each_key_duplicate(a, b, value) {
+		{
+			throw new Error(`https://svelte.dev/e/each_key_duplicate`);
+		}
+	}
+
 	/**
 	 * `%rune%` cannot be used inside an effect cleanup function
 	 * @param {string} rune
@@ -219,6 +290,49 @@
 	/* This file is generated by scripts/process-messages/index.js. Do not edit! */
 
 
+	/**
+	 * Assignment to `%property%` property (%location%) will evaluate to the right-hand side, not the value of `%property%` following the assignment. This may result in unexpected behaviour.
+	 * @param {string} property
+	 * @param {string} location
+	 */
+	function assignment_value_stale(property, location) {
+		{
+			console.warn(`https://svelte.dev/e/assignment_value_stale`);
+		}
+	}
+
+	/**
+	 * `%binding%` (%location%) is binding to a non-reactive property
+	 * @param {string} binding
+	 * @param {string | undefined | null} [location]
+	 */
+	function binding_property_non_reactive(binding, location) {
+		{
+			console.warn(`https://svelte.dev/e/binding_property_non_reactive`);
+		}
+	}
+
+	/**
+	 * Your `console.%method%` contained `$state` proxies. Consider using `$inspect(...)` or `$state.snapshot(...)` instead
+	 * @param {string} method
+	 */
+	function console_log_state(method) {
+		{
+			console.warn(`https://svelte.dev/e/console_log_state`);
+		}
+	}
+
+	/**
+	 * %handler% should be a function. Did you mean to %suggestion%?
+	 * @param {string} handler
+	 * @param {string} suggestion
+	 */
+	function event_handler_invalid(handler, suggestion) {
+		{
+			console.warn(`https://svelte.dev/e/event_handler_invalid`);
+		}
+	}
+
 	/**
 	 * Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near %location%
 	 * @param {string | undefined | null} [location]
@@ -229,6 +343,42 @@
 		}
 	}
 
+	/**
+	 * %parent% passed property `%prop%` to %child% with `bind:`, but its parent component %owner% did not declare `%prop%` as a binding. Consider creating a binding between %owner% and %parent% (e.g. `bind:%prop%={...}` instead of `%prop%={...}`)
+	 * @param {string} parent
+	 * @param {string} prop
+	 * @param {string} child
+	 * @param {string} owner
+	 */
+	function ownership_invalid_binding(parent, prop, child, owner) {
+		{
+			console.warn(`https://svelte.dev/e/ownership_invalid_binding`);
+		}
+	}
+
+	/**
+	 * Mutating unbound props (`%name%`, at %location%) is strongly discouraged. Consider using `bind:%prop%={...}` in %parent% (or using a callback) instead
+	 * @param {string} name
+	 * @param {string} location
+	 * @param {string} prop
+	 * @param {string} parent
+	 */
+	function ownership_invalid_mutation(name, location, prop, parent) {
+		{
+			console.warn(`https://svelte.dev/e/ownership_invalid_mutation`);
+		}
+	}
+
+	/**
+	 * Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results
+	 * @param {string} operator
+	 */
+	function state_proxy_equality_mismatch(operator) {
+		{
+			console.warn(`https://svelte.dev/e/state_proxy_equality_mismatch`);
+		}
+	}
+
 	/** @import { TemplateNode } from '#client' */
 
 
@@ -317,6 +467,19 @@
 		}
 	}
 
+	/* This file is generated by scripts/process-messages/index.js. Do not edit! */
+
+
+	/**
+	 * `<svelte:element this="%tag%">` is a void element — it cannot have content
+	 * @param {string} tag
+	 */
+	function dynamic_void_element_content(tag) {
+		{
+			console.warn(`https://svelte.dev/e/dynamic_void_element_content`);
+		}
+	}
+
 	/** @import { Snapshot } from './types' */
 
 	/**
@@ -725,6 +888,24 @@
 		return Object.is(get_proxied_value(a), get_proxied_value(b));
 	}
 
+	/**
+	 * @param {any} a
+	 * @param {any} b
+	 * @param {boolean} equal
+	 * @returns {boolean}
+	 */
+	function strict_equals(a, b, equal = true) {
+		// try-catch needed because this tries to read properties of `a` and `b`,
+		// which could be disallowed for example in a secure context
+		try {
+			if ((a === b) !== (get_proxied_value(a) === get_proxied_value(b))) {
+				state_proxy_equality_mismatch(equal ? '===' : '!==');
+			}
+		} catch {}
+
+		return (a === b) === equal;
+	}
+
 	/** @import { TemplateNode } from '#client' */
 
 	// export these for reference in the compiled code, making global name deduplication unnecessary
@@ -1218,6 +1399,11 @@
 		}
 	}
 
+	/** @param {() => void | (() => void)} fn */
+	function inspect_effect(fn) {
+		return create_effect(INSPECT_EFFECT, fn, true);
+	}
+
 	/**
 	 * Internal representation of `$effect.root(...)`
 	 * @param {() => void | (() => void)} fn
@@ -2565,6 +2751,23 @@
 		component_context = context;
 	}
 
+	/**
+	 * The current component function. Different from current component context:
+	 * ```html
+	 * <!-- App.svelte -->
+	 * <Foo>
+	 *   <Bar /> <!-- context == Foo.svelte, function == App.svelte -->
+	 * </Foo>
+	 * ```
+	 * @type {ComponentContext['function']}
+	 */
+	let dev_current_component_function = null;
+
+	/** @param {ComponentContext['function']} fn */
+	function set_dev_current_component_function(fn) {
+		dev_current_component_function = fn;
+	}
+
 	/**
 	 * Retrieves the context that belongs to the closest parent component with the specified `key`.
 	 * Must be called during component initialisation.
@@ -2671,6 +2874,33 @@
 		return null;
 	}
 
+	const VOID_ELEMENT_NAMES = [
+		'area',
+		'base',
+		'br',
+		'col',
+		'command',
+		'embed',
+		'hr',
+		'img',
+		'input',
+		'keygen',
+		'link',
+		'meta',
+		'param',
+		'source',
+		'track',
+		'wbr'
+	];
+
+	/**
+	 * Returns `true` if `name` is of a void element
+	 * @param {string} name
+	 */
+	function is_void(name) {
+		return VOID_ELEMENT_NAMES.includes(name) || name.toLowerCase() === '!doctype';
+	}
+
 	/**
 	 * @param {string} name
 	 */
@@ -2770,6 +3000,105 @@
 		return RAW_TEXT_ELEMENTS.includes(/** @type {RAW_TEXT_ELEMENTS[number]} */ (name));
 	}
 
+	/**
+	 * Prevent devtools trying to make `location` a clickable link by inserting a zero-width space
+	 * @template {string | undefined} T
+	 * @param {T} location
+	 * @returns {T};
+	 */
+	function sanitize_location(location) {
+		return /** @type {T} */ (location?.replace(/\//g, '/\u200b'));
+	}
+
+	/**
+	 *
+	 * @param {any} a
+	 * @param {any} b
+	 * @param {string} property
+	 * @param {string} location
+	 */
+	function compare(a, b, property, location) {
+		if (a !== b) {
+			assignment_value_stale(property, /** @type {string} */ (sanitize_location(location)));
+		}
+
+		return a;
+	}
+
+	/**
+	 * @param {any} object
+	 * @param {string} property
+	 * @param {any} value
+	 * @param {string} location
+	 */
+	function assign(object, property, value, location) {
+		return compare(
+			(object[property] = value),
+			untrack(() => object[property]),
+			property,
+			location
+		);
+	}
+
+	/** @import { SourceLocation } from '#shared' */
+
+	/**
+	 * @param {any} fn
+	 * @param {string} filename
+	 * @param {SourceLocation[]} locations
+	 * @returns {any}
+	 */
+	function add_locations(fn, filename, locations) {
+		return (/** @type {any[]} */ ...args) => {
+			const dom = fn(...args);
+
+			var node = hydrating ? dom : dom.nodeType === 11 ? dom.firstChild : dom;
+			assign_locations(node, filename, locations);
+
+			return dom;
+		};
+	}
+
+	/**
+	 * @param {Element} element
+	 * @param {string} filename
+	 * @param {SourceLocation} location
+	 */
+	function assign_location(element, filename, location) {
+		// @ts-expect-error
+		element.__svelte_meta = {
+			loc: { file: filename, line: location[0], column: location[1] }
+		};
+
+		if (location[2]) {
+			assign_locations(element.firstChild, filename, location[2]);
+		}
+	}
+
+	/**
+	 * @param {Node | null} node
+	 * @param {string} filename
+	 * @param {SourceLocation[]} locations
+	 */
+	function assign_locations(node, filename, locations) {
+		var i = 0;
+		var depth = 0;
+
+		while (node && i < locations.length) {
+			if (hydrating && node.nodeType === 8) {
+				var comment = /** @type {Comment} */ (node);
+				if (comment.data === HYDRATION_START || comment.data === HYDRATION_START_ELSE) depth += 1;
+				else if (comment.data[0] === HYDRATION_END) depth -= 1;
+			}
+
+			if (depth === 0 && node.nodeType === 1) {
+				assign_location(/** @type {Element} */ (node), filename, locations[i++]);
+			}
+
+			node = node.nextSibling;
+		}
+	}
+
 	/**
 	 * @param {HTMLElement} dom
 	 * @param {boolean} value
@@ -3082,6 +3411,48 @@
 		}
 	}
 
+	/**
+	 * In dev, warn if an event handler is not a function, as it means the
+	 * user probably called the handler or forgot to add a `() =>`
+	 * @param {() => (event: Event, ...args: any) => void} thunk
+	 * @param {EventTarget} element
+	 * @param {[Event, ...any]} args
+	 * @param {any} component
+	 * @param {[number, number]} [loc]
+	 * @param {boolean} [remove_parens]
+	 */
+	function apply(
+		thunk,
+		element,
+		args,
+		component,
+		loc,
+		has_side_effects = false,
+		remove_parens = false
+	) {
+		let handler;
+		let error;
+
+		try {
+			handler = thunk();
+		} catch (e) {
+			error = e;
+		}
+
+		if (typeof handler !== 'function' && (has_side_effects || handler != null || error)) {
+			component?.[FILENAME];
+			const phase = args[0]?.eventPhase < Event.BUBBLING_PHASE ? 'capture' : '';
+			args[0]?.type + phase;
+
+			event_handler_invalid();
+
+			if (error) {
+				throw error;
+			}
+		}
+		handler?.apply(element, args);
+	}
+
 	/** @param {string} html */
 	function create_fragment_from_html(html) {
 		var elem = document.createElement('template');
@@ -3445,6 +3816,152 @@
 		return Promise.resolve();
 	}
 
+	/** @typedef {{ file: string, line: number, column: number }} Location */
+
+
+	/**
+	 * Sets up a validator that
+	 * - traverses the path of a prop to find out if it is allowed to be mutated
+	 * - checks that the binding chain is not interrupted
+	 * @param {Record<string, any>} props
+	 */
+	function create_ownership_validator(props) {
+		const component = component_context?.function;
+		const parent = component_context?.p?.function;
+
+		return {
+			/**
+			 * @param {string} prop
+			 * @param {any[]} path
+			 * @param {any} result
+			 * @param {number} line
+			 * @param {number} column
+			 */
+			mutation: (prop, path, result, line, column) => {
+				const name = path[0];
+				if (is_bound_or_unset(props, name) || !parent) {
+					return result;
+				}
+
+				/** @type {any} */
+				let value = props;
+
+				for (let i = 0; i < path.length - 1; i++) {
+					value = value[path[i]];
+					if (!value?.[STATE_SYMBOL]) {
+						return result;
+					}
+				}
+
+				const location = sanitize_location(`${component[FILENAME]}:${line}:${column}`);
+
+				ownership_invalid_mutation(name, location, prop, parent[FILENAME]);
+
+				return result;
+			},
+			/**
+			 * @param {any} key
+			 * @param {any} child_component
+			 * @param {() => any} value
+			 */
+			binding: (key, child_component, value) => {
+				if (!is_bound_or_unset(props, key) && parent && value()?.[STATE_SYMBOL]) {
+					ownership_invalid_binding(
+						component[FILENAME],
+						key,
+						child_component[FILENAME],
+						parent[FILENAME]
+					);
+				}
+			}
+		};
+	}
+
+	/**
+	 * @param {Record<string, any>} props
+	 * @param {string} prop_name
+	 */
+	function is_bound_or_unset(props, prop_name) {
+		// Can be the case when someone does `mount(Component, props)` with `let props = $state({...})`
+		// or `createClassComponent(Component, props)`
+		const is_entry_props = STATE_SYMBOL in props || LEGACY_PROPS in props;
+		return (
+			!!get_descriptor(props, prop_name)?.set ||
+			(is_entry_props && prop_name in props) ||
+			!(prop_name in props)
+		);
+	}
+
+	/** @param {Function & { [FILENAME]: string }} target */
+	function check_target(target) {
+		if (target) {
+			component_api_invalid_new(target[FILENAME] ?? 'a component', target.name);
+		}
+	}
+
+	function legacy_api() {
+		const component = component_context?.function;
+
+		/** @param {string} method */
+		function error(method) {
+			component_api_changed(method, component[FILENAME]);
+		}
+
+		return {
+			$destroy: () => error('$destroy()'),
+			$on: () => error('$on(...)'),
+			$set: () => error('$set(...)')
+		};
+	}
+
+	/**
+	 * @param {() => any[]} get_value
+	 * @param {Function} [inspector]
+	 */
+	// eslint-disable-next-line no-console
+	function inspect(get_value, inspector = console.log) {
+		validate_effect();
+
+		let initial = true;
+
+		inspect_effect(() => {
+			/** @type {any} */
+			var value = UNINITIALIZED;
+
+			// Capturing the value might result in an exception due to the inspect effect being
+			// sync and thus operating on stale data. In the case we encounter an exception we
+			// can bail-out of reporting the value. Instead we simply console.error the error
+			// so at least it's known that an error occured, but we don't stop execution
+			try {
+				value = get_value();
+			} catch (error) {
+				// eslint-disable-next-line no-console
+				console.error(error);
+			}
+
+			if (value !== UNINITIALIZED) {
+				inspector(initial ? 'init' : 'update', ...snapshot(value, true));
+			}
+
+			initial = false;
+		});
+	}
+
+	/**
+	 * @param {Node} anchor
+	 * @param {...(()=>any)[]} args
+	 */
+	function validate_snippet_args(anchor, ...args) {
+		if (typeof anchor !== 'object' || !(anchor instanceof Node)) {
+			invalid_snippet_arguments();
+		}
+		for (let arg of args) {
+			if (typeof arg !== 'function') {
+				invalid_snippet_arguments();
+			}
+		}
+	}
+
 	/** @import { Effect, Source, TemplateNode } from '#client' */
 
 	const PENDING = 0;
@@ -4390,6 +4907,41 @@
 		});
 	}
 
+	/** @import { TemplateNode } from '#client' */
+	/** @import { Getters } from '#shared' */
+
+	/**
+	 * @param {() => string} tag_fn
+	 * @returns {void}
+	 */
+	function validate_void_dynamic_element(tag_fn) {
+		const tag = tag_fn();
+		if (tag && is_void(tag)) {
+			dynamic_void_element_content();
+		}
+	}
+
+	/** @param {() => unknown} tag_fn */
+	function validate_dynamic_element_tag(tag_fn) {
+		const tag = tag_fn();
+		const is_string = typeof tag === 'string';
+		if (tag && !is_string) {
+			svelte_element_invalid_this_value();
+		}
+	}
+
+	/**
+	 * @template {() => unknown} T
+	 * @param {T} fn
+	 */
+	function prevent_snippet_stringification(fn) {
+		fn.toString = () => {
+			snippet_without_render_tag();
+			return '';
+		};
+		return fn;
+	}
+
 	/** @import { Snippet } from 'svelte' */
 	/** @import { Effect, TemplateNode } from '#client' */
 	/** @import { Getters } from '#shared' */
@@ -4427,6 +4979,29 @@
 		}
 	}
 
+	/**
+	 * In development, wrap the snippet function so that it passes validation, and so that the
+	 * correct component context is set for ownership checks
+	 * @param {any} component
+	 * @param {(node: TemplateNode, ...args: any[]) => void} fn
+	 */
+	function wrap_snippet(component, fn) {
+		const snippet = (/** @type {TemplateNode} */ node, /** @type {any[]} */ ...args) => {
+			var previous_component_function = dev_current_component_function;
+			set_dev_current_component_function(component);
+
+			try {
+				return fn(node, ...args);
+			} finally {
+				set_dev_current_component_function(previous_component_function);
+			}
+		};
+
+		prevent_snippet_stringification(snippet);
+
+		return snippet;
+	}
+
 	/** @import { Effect, TemplateNode } from '#client' */
 
 	/**
@@ -5849,6 +6424,80 @@
 		};
 	}
 
+	/**
+	 * @param {() => any} collection
+	 * @param {(item: any, index: number) => string} key_fn
+	 * @returns {void}
+	 */
+	function validate_each_keys(collection, key_fn) {
+		render_effect(() => {
+			const keys = new Map();
+			const maybe_array = collection();
+			const array = is_array(maybe_array)
+				? maybe_array
+				: maybe_array == null
+					? []
+					: Array.from(maybe_array);
+			const length = array.length;
+			for (let i = 0; i < length; i++) {
+				const key = key_fn(array[i], i);
+				if (keys.has(key)) {
+					String(keys.get(key));
+
+					/** @type {string | null} */
+					let k = String(key);
+					if (k.startsWith('[object ')) k = null;
+
+					each_key_duplicate();
+				}
+				keys.set(key, i);
+			}
+		});
+	}
+
+	/**
+	 * @param {string} binding
+	 * @param {() => Record<string, any>} get_object
+	 * @param {() => string} get_property
+	 * @param {number} line
+	 * @param {number} column
+	 */
+	function validate_binding(binding, get_object, get_property, line, column) {
+		var warned = false;
+
+		dev_current_component_function?.[FILENAME];
+
+		render_effect(() => {
+			if (warned) return;
+
+			var [object, is_store_sub] = capture_store_binding(get_object);
+
+			if (is_store_sub) return;
+
+			var property = get_property();
+
+			var ran = false;
+
+			// by making the (possibly false, but it would be an extreme edge case) assumption
+			// that a getter has a corresponding setter, we can determine if a property is
+			// reactive by seeing if this effect has dependencies
+			var effect = render_effect(() => {
+				if (ran) return;
+
+				// eslint-disable-next-line @typescript-eslint/no-unused-expressions
+				object[property];
+			});
+
+			ran = true;
+
+			if (effect.deps === null) {
+				binding_property_non_reactive();
+
+				warned = true;
+			}
+		});
+	}
+
 	/** @import { ComponentConstructorOptions, ComponentType, SvelteComponent, Component } from 'svelte' */
 
 	/**
@@ -6319,6 +6968,37 @@
 		return Class;
 	}
 
+	/**
+	 * @param {string} method
+	 * @param  {...any} objects
+	 */
+	function log_if_contains_state(method, ...objects) {
+		untrack(() => {
+			try {
+				let has_state = false;
+				const transformed = [];
+
+				for (const obj of objects) {
+					if (obj && typeof obj === 'object' && STATE_SYMBOL in obj) {
+						transformed.push(snapshot(obj, true));
+						has_state = true;
+					} else {
+						transformed.push(obj);
+					}
+				}
+
+				if (has_state) {
+					console_log_state(method);
+
+					// eslint-disable-next-line no-console
+					console.log('%c[snapshot]', 'color: grey', ...transformed);
+				}
+			} catch {}
+		});
+
+		return objects;
+	}
+
 	function getDefaultExportFromCjs (x) {
 		return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 	}
@@ -74244,6 +74924,8 @@
 	var jsExports = requireJs();
 	var jsBeautify = /*@__PURE__*/getDefaultExportFromCjs(jsExports);
 
+	Code[FILENAME] = 'src/doc/components/Code.svelte';
+
 	function copy(_, prettyCode) {
 		navigator.clipboard.writeText(get(prettyCode));
 		this.classList.add('copied');
@@ -74256,17 +74938,34 @@
 		);
 	}
 
-	var root$f = template(`<pre class="qc-hash-1fxiy4n"><code class="hljs"><button class="qc-button qc-compact qc-primary">
+	var root$f = add_locations(
+		template(`<pre class="qc-hash-1fxiy4n"><code class="hljs"><button class="qc-button qc-compact qc-primary">
             <span class="copy">copier</span>
             <span class="copied">copié !</span>
-        </button><!></code></pre>`);
+        </button><!></code></pre>`),
+		Code[FILENAME],
+		[
+			[
+				54,
+				0,
+				[
+					[
+						55,
+						5,
+						[[56, 9, [[58, 12], [59, 12]]]]
+					]
+				]
+			]
+		]
+	);
 
 	const $$css$5 = {
 		hash: 'qc-hash-1fxiy4n',
-		code: 'pre.qc-hash-1fxiy4n {max-inline-size:var(--qc-max-content-width);}'
+		code: 'pre.qc-hash-1fxiy4n {\n  max-inline-size: var(--qc-max-content-width);\n}'
 	};
 
 	function Code($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css$5);
 
@@ -74285,7 +74984,7 @@
 
 			rawCode.replace('class="mounted"', '').replace('/qc-hash-.*/g', '').replace('/is-external=""/g', 'is-external');
 			// prettyCode = pretty(rawCode, prettyOptions);
-			set(prettyCode, language() === 'javascript' ? jsBeautify(rawCode) : pretty(rawCode, { wrap_attributes: 'force-aligned' }), true);
+			set(prettyCode, strict_equals(language(), 'javascript') ? jsBeautify(rawCode) : pretty(rawCode, { wrap_attributes: 'force-aligned' }), true);
 			set(hlCode, HighlightJS.highlight(get(prettyCode), { language: language() }).value, true);
 		}
 
@@ -74332,7 +75031,8 @@
 			set outerHTML($$value = false) {
 				outerHTML($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -74351,14 +75051,30 @@
 		false
 	));
 
-	var root$e = template(`<div class="color-details qc-hash-1we8qc0"><div></div> <div class="color-description qc-hash-1we8qc0"><strong> </strong><br> <code> </code></div></div>`);
+	Color_doc[FILENAME] = 'src/doc/components/color-doc.svelte';
+
+	var root$e = add_locations(template(`<div class="color-details qc-hash-1we8qc0"><div></div> <div class="color-description qc-hash-1we8qc0"><strong> </strong><br> <code> </code></div></div>`), Color_doc[FILENAME], [
+		[
+			16,
+			0,
+			[
+				[17, 4],
+				[
+					19,
+					4,
+					[[20, 8], [20, 32], [21, 8]]
+				]
+			]
+		]
+	]);
 
 	const $$css$4 = {
 		hash: 'qc-hash-1we8qc0',
-		code: '.qc-bg-color-white.qc-hash-1we8qc0 {background-color:var(--qc-color-white);}.qc-bg-color-blue-extra-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-extra-pale);}.qc-bg-color-blue-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-pale);}.qc-bg-color-blue-light.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-light);}.qc-bg-color-blue-regular_light.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-regular_light);}.qc-bg-color-blue-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-regular);}.qc-bg-color-blue-piv.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-piv);}.qc-bg-color-blue-medium.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-medium);}.qc-bg-color-blue-dark.qc-hash-1we8qc0 {background-color:var(--qc-color-blue-dark);}.qc-bg-color-purple.qc-hash-1we8qc0 {background-color:var(--qc-color-purple);}.qc-bg-color-grey-extra-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-extra-pale);}.qc-bg-color-grey-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-pale);}.qc-bg-color-grey-light.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-light);}.qc-bg-color-grey-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-regular);}.qc-bg-color-grey-medium.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-medium);}.qc-bg-color-grey-dark.qc-hash-1we8qc0 {background-color:var(--qc-color-grey-dark);}.qc-bg-color-pink-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-pink-pale);}.qc-bg-color-pink-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-pink-regular);}.qc-bg-color-red-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-red-pale);}.qc-bg-color-red-light.qc-hash-1we8qc0 {background-color:var(--qc-color-red-light);}.qc-bg-color-red-regular_light.qc-hash-1we8qc0 {background-color:var(--qc-color-red-regular_light);}.qc-bg-color-red-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-red-regular);}.qc-bg-color-red-medium.qc-hash-1we8qc0 {background-color:var(--qc-color-red-medium);}.qc-bg-color-red-dark.qc-hash-1we8qc0 {background-color:var(--qc-color-red-dark);}.qc-bg-color-green-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-green-pale);}.qc-bg-color-green-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-green-regular);}.qc-bg-color-green-dark.qc-hash-1we8qc0 {background-color:var(--qc-color-green-dark);}.qc-bg-color-yellow-pale.qc-hash-1we8qc0 {background-color:var(--qc-color-yellow-pale);}.qc-bg-color-yellow-regular.qc-hash-1we8qc0 {background-color:var(--qc-color-yellow-regular);}.qc-bg-color-yellow-dark.qc-hash-1we8qc0 {background-color:var(--qc-color-yellow-dark);}.qc-bg-color-background.qc-hash-1we8qc0 {background-color:var(--qc-color-background);}.qc-bg-color-text-primary.qc-hash-1we8qc0 {background-color:var(--qc-color-text-primary);}.qc-bg-color-accent.qc-hash-1we8qc0 {background-color:var(--qc-color-accent);}.qc-bg-color-success.qc-hash-1we8qc0 {background-color:var(--qc-color-success);}.qc-bg-color-error.qc-hash-1we8qc0 {background-color:var(--qc-color-error);}.qc-bg-color-danger.qc-hash-1we8qc0 {background-color:var(--qc-color-danger);}.qc-bg-color-link-text.qc-hash-1we8qc0 {background-color:var(--qc-color-link-text);}.qc-bg-color-link-hover.qc-hash-1we8qc0 {background-color:var(--qc-color-link-hover);}.qc-bg-color-link-visited.qc-hash-1we8qc0 {background-color:var(--qc-color-link-visited);}.qc-bg-color-link-active.qc-hash-1we8qc0 {background-color:var(--qc-color-link-active);}.qc-bg-color-link-focus-outline.qc-hash-1we8qc0 {background-color:var(--qc-color-link-focus-outline);}.qc-bg-color-formfield-border.qc-hash-1we8qc0 {background-color:var(--qc-color-formfield-border);}.qc-bg-color-formfield-focus-border.qc-hash-1we8qc0 {background-color:var(--qc-color-formfield-focus-border);}.qc-bg-color-formfield-focus-outline.qc-hash-1we8qc0 {background-color:var(--qc-color-formfield-focus-outline);}.qc-bg-color-searchinput-icon.qc-hash-1we8qc0 {background-color:var(--qc-color-searchinput-icon);}.qc-bg-color-box_shadow.qc-hash-1we8qc0 {background-color:var(--qc-color-box_shadow);}.color-details.qc-hash-1we8qc0 {display:flex;justify-content:flex-start;align-items:center;}.color-details.qc-hash-1we8qc0 > div:where(.qc-hash-1we8qc0) + div:where(.qc-hash-1we8qc0) {margin-left:var(--qc-spacer-md);}.color-sample.qc-hash-1we8qc0 {width:4.8rem;height:4.8rem;border-radius:50%;flex-shrink:0;}.border.qc-hash-1we8qc0 {border:1px solid var(--qc-color-grey-light);}'
+		code: '.qc-bg-color-white.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-white);\n}\n\n.qc-bg-color-blue-extra-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-extra-pale);\n}\n\n.qc-bg-color-blue-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-pale);\n}\n\n.qc-bg-color-blue-light.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-light);\n}\n\n.qc-bg-color-blue-regular_light.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-regular_light);\n}\n\n.qc-bg-color-blue-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-regular);\n}\n\n.qc-bg-color-blue-piv.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-piv);\n}\n\n.qc-bg-color-blue-medium.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-medium);\n}\n\n.qc-bg-color-blue-dark.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-blue-dark);\n}\n\n.qc-bg-color-purple.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-purple);\n}\n\n.qc-bg-color-grey-extra-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-extra-pale);\n}\n\n.qc-bg-color-grey-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-pale);\n}\n\n.qc-bg-color-grey-light.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-light);\n}\n\n.qc-bg-color-grey-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-regular);\n}\n\n.qc-bg-color-grey-medium.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-medium);\n}\n\n.qc-bg-color-grey-dark.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-grey-dark);\n}\n\n.qc-bg-color-pink-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-pink-pale);\n}\n\n.qc-bg-color-pink-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-pink-regular);\n}\n\n.qc-bg-color-red-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-pale);\n}\n\n.qc-bg-color-red-light.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-light);\n}\n\n.qc-bg-color-red-regular_light.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-regular_light);\n}\n\n.qc-bg-color-red-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-regular);\n}\n\n.qc-bg-color-red-medium.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-medium);\n}\n\n.qc-bg-color-red-dark.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-red-dark);\n}\n\n.qc-bg-color-green-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-green-pale);\n}\n\n.qc-bg-color-green-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-green-regular);\n}\n\n.qc-bg-color-green-dark.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-green-dark);\n}\n\n.qc-bg-color-yellow-pale.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-yellow-pale);\n}\n\n.qc-bg-color-yellow-regular.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-yellow-regular);\n}\n\n.qc-bg-color-yellow-dark.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-yellow-dark);\n}\n\n.qc-bg-color-background.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-background);\n}\n\n.qc-bg-color-text-primary.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-text-primary);\n}\n\n.qc-bg-color-accent.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-accent);\n}\n\n.qc-bg-color-success.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-success);\n}\n\n.qc-bg-color-error.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-error);\n}\n\n.qc-bg-color-danger.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-danger);\n}\n\n.qc-bg-color-link-text.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-link-text);\n}\n\n.qc-bg-color-link-hover.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-link-hover);\n}\n\n.qc-bg-color-link-visited.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-link-visited);\n}\n\n.qc-bg-color-link-active.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-link-active);\n}\n\n.qc-bg-color-link-focus-outline.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-link-focus-outline);\n}\n\n.qc-bg-color-formfield-border.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-formfield-border);\n}\n\n.qc-bg-color-formfield-focus-border.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-formfield-focus-border);\n}\n\n.qc-bg-color-formfield-focus-outline.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-formfield-focus-outline);\n}\n\n.qc-bg-color-searchinput-icon.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-searchinput-icon);\n}\n\n.qc-bg-color-box_shadow.qc-hash-1we8qc0 {\n  background-color: var(--qc-color-box_shadow);\n}\n\n.color-details.qc-hash-1we8qc0 {\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n}\n.color-details.qc-hash-1we8qc0 > div:where(.qc-hash-1we8qc0) + div:where(.qc-hash-1we8qc0) {\n  margin-left: var(--qc-spacer-md);\n}\n\n.color-sample.qc-hash-1we8qc0 {\n  width: 4.8rem;\n  height: 4.8rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.border.qc-hash-1we8qc0 {\n  border: 1px solid var(--qc-color-grey-light);\n}'
 	};
 
 	function Color_doc($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css$4);
 
@@ -74418,7 +75134,8 @@
 			set border($$value = null) {
 				border($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -74436,9 +75153,18 @@
 		true
 	));
 
-	var root$d = template(`<label><input type="checkbox" role="switch"> <span><!></span> <span class="qc-switch-slider"></span></label>`);
+	ToggleSwitch[FILENAME] = 'src/sdg/components/ToggleSwitch/ToggleSwitch.svelte';
+
+	var root$d = add_locations(template(`<label><input type="checkbox" role="switch"> <span><!></span> <span class="qc-switch-slider"></span></label>`), ToggleSwitch[FILENAME], [
+		[
+			17,
+			0,
+			[[20, 4], [28, 4], [33, 4]]
+		]
+	]);
 
 	function ToggleSwitch($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let label = prop($$props, 'label', 7),
@@ -74449,7 +75175,7 @@
 			textAlign = prop($$props, 'textAlign', 7);
 
 		const usedId = "toggle-switch-" + (id() ? id() : Math.random().toString(36));
-		let usedLabelTextAlignment = textAlign()?.toLowerCase() === "end" ? "end" : "start";
+		let usedLabelTextAlignment = strict_equals(textAlign()?.toLowerCase(), "end") ? "end" : "start";
 		var label_1 = root$d();
 
 		set_attribute(label_1, 'for', usedId);
@@ -74463,7 +75189,7 @@
 
 		set_class(span, 1, clsx([
 			"qc-switch-label",
-			usedLabelTextAlignment === "end" && "qc-switch-label-end"
+			strict_equals(usedLabelTextAlignment, "end") && "qc-switch-label-end"
 		]));
 
 		var node = child(span);
@@ -74527,7 +75253,8 @@
 			set textAlign($$value) {
 				textAlign($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -74546,18 +75273,23 @@
 		true
 	);
 
-	var root$c = template(`<div role="complementary" class="qc-hash-ogsj9p"><div class="qc-container top-nav qc-hash-ogsj9p"><div class="switch-control qc-hash-ogsj9p"><!></div></div></div>`);
+	TopNav[FILENAME] = 'src/doc/components/TopNav.svelte';
+
+	var root$c = add_locations(template(`<div role="complementary" class="qc-hash-ogsj9p"><div class="qc-container top-nav qc-hash-ogsj9p"><div class="switch-control qc-hash-ogsj9p"><!></div></div></div>`), TopNav[FILENAME], [
+		[17, 0, [[18, 4, [[19, 8]]]]]
+	]);
 
 	const $$css$3 = {
 		hash: 'qc-hash-ogsj9p',
-		code: '[role=complementary].qc-hash-ogsj9p {position:sticky;z-index:100;top:0;background-color:var(--qc-color-background);min-height:7.2rem;height:7.2rem;border-bottom:solid 0.1rem var(--qc-color-grey-light);}.top-nav.qc-hash-ogsj9p {position:absolute;inset:0;display:flex;align-items:end;padding-bottom:var(--qc-spacer-sm);}.top-nav.qc-hash-ogsj9p .switch-control:where(.qc-hash-ogsj9p) {margin-left:auto;margin-right:0;display:flex;align-items:center;}'
+		code: '[role=complementary].qc-hash-ogsj9p {\n  position: sticky;\n  z-index: 100;\n  top: 0;\n  background-color: var(--qc-color-background);\n  min-height: 7.2rem;\n  height: 7.2rem;\n  border-bottom: solid 0.1rem var(--qc-color-grey-light);\n}\n\n.top-nav.qc-hash-ogsj9p {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: end;\n  padding-bottom: var(--qc-spacer-sm);\n}\n.top-nav.qc-hash-ogsj9p .switch-control:where(.qc-hash-ogsj9p) {\n  margin-left: auto;\n  margin-right: 0;\n  display: flex;\n  align-items: center;\n}\n/* (unused) .top-nav .switch-control label:first-child {\n  margin-right: 1.6rem;\n}*/'
 	};
 
 	function TopNav($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css$3);
 
-		let value = state(localStorage.getItem('dark-theme') === "true");
+		let value = state(proxy(strict_equals(localStorage.getItem('dark-theme'), "true")));
 
 		user_effect(() => {
 			document.documentElement.classList.toggle('qc-dark-theme', get(value));
@@ -74583,19 +75315,22 @@
 		reset(div_1);
 		reset(div);
 		append($$anchor, div);
-		pop();
+		return pop({ ...legacy_api() });
 	}
 
 	customElements.define('qc-doc-top-nav', create_custom_element(TopNav, {}, [], [], false));
 
-	var root$b = template(`<div class="switch qc-hash-qsg5d6"><input> <span class="slider round qc-hash-qsg5d6"></span></div>`);
+	Switch[FILENAME] = 'src/doc/components/Switch.svelte';
+
+	var root$b = add_locations(template(`<div class="switch qc-hash-qsg5d6"><input> <span class="slider round qc-hash-qsg5d6"></span></div>`), Switch[FILENAME], [[18, 0, [[24, 4], [31, 4]]]]);
 
 	const $$css$2 = {
 		hash: 'qc-hash-qsg5d6',
-		code: '/* The switch - the box around the slider */.switch.qc-hash-qsg5d6 {position:relative;display:inline-block;width:5.6rem;height:3.2rem;}\n\n/* Hide default HTML checkbox */input.qc-hash-qsg5d6 {z-index:10;opacity:0;position:absolute;cursor:pointer;margin:0;padding:0;inset:0;height:auto;width:auto;}\n\n/* The slider */.slider.qc-hash-qsg5d6 {z-index:5;position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--unchecked-bg-color);-webkit-transition:0.4s;transition:0.4s;}.slider.qc-hash-qsg5d6::before {position:absolute;content:"";height:2.8rem;width:2.8rem;left:0.2rem;bottom:0.2rem;background-color:var(--slider-color);-webkit-transition:0.4s;transition:0.4s;}input.qc-hash-qsg5d6:checked + .slider:where(.qc-hash-qsg5d6) {background-color:var(--checked-bg-color);}input.qc-hash-qsg5d6:focus + .slider:where(.qc-hash-qsg5d6) {box-shadow:0 0 1px var(--qc-bok-shadow-color);}input.qc-hash-qsg5d6:checked + .slider:where(.qc-hash-qsg5d6)::before {transform:translateX(2.4rem);}.slider.round.qc-hash-qsg5d6, input.qc-hash-qsg5d6 {border-radius:3.2rem;}.slider.round.qc-hash-qsg5d6::before {border-radius:50%;}'
+		code: '/* The switch - the box around the slider */\n.switch.qc-hash-qsg5d6 {\n  position: relative;\n  display: inline-block;\n  width: 5.6rem;\n  height: 3.2rem;\n}\n\n/* Hide default HTML checkbox */\ninput.qc-hash-qsg5d6 {\n  z-index: 10;\n  opacity: 0;\n  position: absolute;\n  cursor: pointer;\n  margin: 0;\n  padding: 0;\n  inset: 0;\n  height: auto;\n  width: auto;\n}\n\n/* The slider */\n.slider.qc-hash-qsg5d6 {\n  z-index: 5;\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: var(--unchecked-bg-color);\n  -webkit-transition: 0.4s;\n  transition: 0.4s;\n}\n\n.slider.qc-hash-qsg5d6::before {\n  position: absolute;\n  content: "";\n  height: 2.8rem;\n  width: 2.8rem;\n  left: 0.2rem;\n  bottom: 0.2rem;\n  background-color: var(--slider-color);\n  -webkit-transition: 0.4s;\n  transition: 0.4s;\n}\n\ninput.qc-hash-qsg5d6:checked + .slider:where(.qc-hash-qsg5d6) {\n  background-color: var(--checked-bg-color);\n}\n\ninput.qc-hash-qsg5d6:focus + .slider:where(.qc-hash-qsg5d6) {\n  box-shadow: 0 0 1px var(--qc-bok-shadow-color);\n}\n\ninput.qc-hash-qsg5d6:checked + .slider:where(.qc-hash-qsg5d6)::before {\n  transform: translateX(2.4rem);\n}\n\n.slider.round.qc-hash-qsg5d6, input.qc-hash-qsg5d6 {\n  border-radius: 3.2rem;\n}\n\n.slider.round.qc-hash-qsg5d6::before {\n  border-radius: 50%;\n}'
 	};
 
 	function Switch($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css$2);
 
@@ -74606,15 +75341,17 @@
 				checked: 'blue-regular',
 				slider: 'background'
 			})),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'value',
-				'name',
-				'color'
-			]);
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'value',
+					'name',
+					'color'
+				]);
 
 		var div = root$b();
 		var input = child(div);
@@ -74676,20 +75413,30 @@
 			) {
 				color($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
 	customElements.define('qc-switch', create_custom_element(Switch, { value: {}, name: {}, color: {} }, [], [], false));
 
-	var root$a = template(`<div class="exemple-area"><figure><div class="exemple qc-hash-1u5h5rs"></div> <figcaption><!></figcaption></figure> <!></div>`);
+	Exemple[FILENAME] = 'src/doc/components/Exemple.svelte';
+
+	var root$a = add_locations(template(`<div class="exemple-area"><figure><div class="exemple qc-hash-1u5h5rs"></div> <figcaption><!></figcaption></figure> <!></div>`), Exemple[FILENAME], [
+		[
+			45,
+			0,
+			[[48, 4, [[51, 8], [54, 8]]]]
+		]
+	]);
 
 	const $$css$1 = {
 		hash: 'qc-hash-1u5h5rs',
-		code: 'figure.qc-hash-1u5h5rs {max-width:var(--qc-max-content-width);width:100%;border:1px solid var(--qc-box_shadow-0-color);margin-bottom:var(--qc-spacer-content-block-mb);}figure.qc-hash-1u5h5rs .exemple:where(.qc-hash-1u5h5rs) {padding:var(--qc-spacer-sm) var(--qc-spacer-sm) 0 var(--qc-spacer-sm);margin-bottom:var(--qc-spacer-sm);}'
+		code: 'figure.qc-hash-1u5h5rs {\n  max-width: var(--qc-max-content-width);\n  width: 100%;\n  border: 1px solid var(--qc-box_shadow-0-color);\n  margin-bottom: var(--qc-spacer-content-block-mb);\n}\nfigure.qc-hash-1u5h5rs .exemple:where(.qc-hash-1u5h5rs) {\n  padding: var(--qc-spacer-sm) var(--qc-spacer-sm) 0 var(--qc-spacer-sm);\n  margin-bottom: var(--qc-spacer-sm);\n}'
 	};
 
 	function Exemple($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css$1);
 
@@ -74697,16 +75444,18 @@
 			codeTargetId = prop($$props, 'codeTargetId', 7),
 			hideCode = prop($$props, 'hideCode', 7, false),
 			rawCode = prop($$props, 'rawCode', 7),
-			restProps = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'caption',
-				'codeTargetId',
-				'hideCode',
-				'rawCode'
-			]);
+			restProps = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'caption',
+					'codeTargetId',
+					'hideCode',
+					'rawCode'
+				]);
 
 		let exempleCode = state(void 0);
 		let figure = state(void 0);
@@ -74716,11 +75465,11 @@
 
 		onMount(() => {
 			get(rootElement).parentElement.childNodes.forEach((node) => {
-				if (node.nodeType === 3) {
+				if (strict_equals(node.nodeType, 3)) {
 					return;
 				}
 
-				if (node !== get(rootElement)) {
+				if (strict_equals(node, get(rootElement), false)) {
 					get(exempleArea).appendChild(node);
 				}
 
@@ -74793,7 +75542,8 @@
 			set rawCode($$value) {
 				rawCode($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -74949,10 +75699,13 @@
 	    }
 	}
 
-	var root_1$6 = template(`<span class="qc-required" aria-hidden="true">*</span>`);
-	var root$9 = template(`<!><!>`, 1);
+	LabelText[FILENAME] = 'src/sdg/components/Label/LabelText.svelte';
+
+	var root_1$6 = add_locations(template(`<span class="qc-required" aria-hidden="true">*</span>`), LabelText[FILENAME], [[4, 26]]);
+	var root$9 = add_locations(template(`<!><!>`, 1), LabelText[FILENAME], []);
 
 	function LabelText($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let text = prop($$props, 'text', 7),
@@ -74993,15 +75746,19 @@
 			set required($$value) {
 				required($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
 	create_custom_element(LabelText, { text: {}, required: {} }, [], [], true);
 
-	var root$8 = template(`<label><!></label>`);
+	Label[FILENAME] = 'src/sdg/components/Label/Label.svelte';
+
+	var root$8 = add_locations(template(`<label><!></label>`), Label[FILENAME], [[16, 0]]);
 
 	function Label($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let forId = prop($$props, 'forId', 7),
@@ -75011,19 +75768,21 @@
 			bold = prop($$props, 'bold', 7, false),
 			disabled = prop($$props, 'disabled', 7, false),
 			rootElement = prop($$props, 'rootElement', 15),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'forId',
-				'text',
-				'required',
-				'compact',
-				'bold',
-				'disabled',
-				'rootElement'
-			]);
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'forId',
+					'text',
+					'required',
+					'compact',
+					'bold',
+					'disabled',
+					'rootElement'
+				]);
 
 		var label = root$8();
 		let attributes;
@@ -75103,7 +75862,8 @@
 			set rootElement($$value) {
 				rootElement($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -75123,9 +75883,12 @@
 		true
 	);
 
-	var root$7 = template(`<div></div>`);
+	Icon[FILENAME] = 'src/sdg/bases/Icon/Icon.svelte';
+
+	var root$7 = add_locations(template(`<div></div>`), Icon[FILENAME], [[16, 0]]);
 
 	function Icon($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let type = prop($$props, 'type', 7),
@@ -75136,22 +75899,24 @@
 			height = prop($$props, 'height', 7, 'auto'),
 			src = prop($$props, 'src', 7, ''),
 			rotate = prop($$props, 'rotate', 7, 0),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'type',
-				'label',
-				'size',
-				'color',
-				'width',
-				'height',
-				'src',
-				'rotate'
-			]);
-
-		let attributes = user_derived(() => width() === 'auto' ? { 'data-img-size': size() } : {});
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'type',
+					'label',
+					'size',
+					'color',
+					'width',
+					'height',
+					'src',
+					'rotate'
+				]);
+
+		let attributes = user_derived(() => strict_equals(width(), 'auto') ? { 'data-img-size': size() } : {});
 		var div = root$7();
 		let attributes_1;
 
@@ -75231,7 +75996,8 @@
 			set rotate($$value = 0) {
 				rotate($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -75252,10 +76018,13 @@
 		true
 	);
 
-	var root_2$7 = template(`<!> <span><!></span>`, 1);
-	var root_1$5 = template(`<div role="alert"><!></div>`);
+	FormError[FILENAME] = 'src/sdg/components/FormError/FormError.svelte';
+
+	var root_2$7 = add_locations(template(`<!> <span><!></span>`, 1), FormError[FILENAME], [[48, 8]]);
+	var root_1$5 = add_locations(template(`<div role="alert"><!></div>`), FormError[FILENAME], [[35, 0]]);
 
 	function FormError($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		const lang = Utils.getPageLanguage();
@@ -75268,7 +76037,7 @@
 			rootElement = prop($$props, 'rootElement', 15);
 
 		let cleanLabel = user_derived(() => label().replace(/:\s*$/, '')),
-			defaultInvalidText = user_derived(() => label() ? lang === 'fr' ? `Le champ ${get(cleanLabel)} est obligatoire.` : `${get(cleanLabel)} field is required.` : lang === 'fr' ? `Ce champ est obligatoire.` : `This field is required.`);
+			defaultInvalidText = user_derived(() => label() ? strict_equals(lang, 'fr') ? `Le champ ${get(cleanLabel)} est obligatoire.` : `${get(cleanLabel)} field is required.` : strict_equals(lang, 'fr') ? `Ce champ est obligatoire.` : `This field is required.`);
 
 		onMount(() => {
 			if (id()) return;
@@ -75367,7 +76136,8 @@
 			set rootElement($$value) {
 				rootElement($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -75404,15 +76174,22 @@
 	    setTextFieldRow(input.closest('.qc-formfield-row'));
 	}
 
-	var root_3$2 = template(`<div class="qc-description"><!></div>`);
-	var root_4$3 = template(`<div aria-live="polite"><!></div>`);
-	var root_1$4 = template(`<!> <!> <!> <!> <!>`, 1);
-	var root_6$1 = template(`<div class="qc-textfield"><!></div>`);
+	TextField[FILENAME] = 'src/sdg/components/TextField/TextField.svelte';
+
+	var root_3$2 = add_locations(template(`<div class="qc-description"><!></div>`), TextField[FILENAME], [[131, 8]]);
+	var root_4$3 = add_locations(template(`<div aria-live="polite"><!></div>`), TextField[FILENAME], [[142, 8]]);
+	var root_1$4 = add_locations(template(`<!> <!> <!> <!> <!>`, 1), TextField[FILENAME], []);
+	var root_6$1 = add_locations(template(`<div class="qc-textfield"><!></div>`), TextField[FILENAME], [[166, 4]]);
 
 	function TextField($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
-		const textfield = ($$anchor) => {
+		var $$ownership_validator = create_ownership_validator($$props);
+
+		const textfield = wrap_snippet(TextField, function ($$anchor) {
+			validate_snippet_args(...arguments);
+
 			var fragment = root_1$4();
 			var node = first_child(fragment);
 
@@ -75421,26 +76198,30 @@
 					const expression = user_derived(() => input()?.disabled);
 					const expression_1 = user_derived(() => input()?.id);
 
-					Label($$anchor, {
-						get required() {
-							return required();
-						},
-						get disabled() {
-							return get(expression);
-						},
-						get text() {
-							return label();
-						},
-						get forId() {
-							return get(expression_1);
-						},
-						get rootElement() {
-							return labelElement();
-						},
-						set rootElement($$value) {
-							labelElement($$value);
-						}
-					});
+					{
+						$$ownership_validator.binding('labelElement', Label, labelElement);
+
+						Label($$anchor, {
+							get required() {
+								return required();
+							},
+							get disabled() {
+								return get(expression);
+							},
+							get text() {
+								return label();
+							},
+							get forId() {
+								return get(expression_1);
+							},
+							get rootElement() {
+								return labelElement();
+							},
+							set rootElement($$value) {
+								labelElement($$value);
+							}
+						});
+					}
 				};
 
 				if_block(node, ($$render) => {
@@ -75496,7 +76277,7 @@
 				};
 
 				if_block(node_4, ($$render) => {
-					if (maxlength() !== null) $$render(consequent_2);
+					if (strict_equals(maxlength(), null, false)) $$render(consequent_2);
 				});
 			}
 
@@ -75504,33 +76285,37 @@
 			const expression_2 = user_derived(() => invalidText() ? invalidText() : get(defaultInvalidText));
 			const expression_3 = user_derived(() => label() ? label() : input()?.getAttribute("aria-label"));
 
-			FormError(node_6, {
-				get invalid() {
-					return invalid();
-				},
-				get invalidText() {
-					return get(expression_2);
-				},
-				get label() {
-					return get(expression_3);
-				},
-				extraClasses: ['qc-xs-mt'],
-				get id() {
-					return get(errorId);
-				},
-				set id($$value) {
-					set(errorId, $$value, true);
-				},
-				get rootElement() {
-					return formErrorElement();
-				},
-				set rootElement($$value) {
-					formErrorElement($$value);
-				}
-			});
+			{
+				$$ownership_validator.binding('formErrorElement', FormError, formErrorElement);
+
+				FormError(node_6, {
+					get invalid() {
+						return invalid();
+					},
+					get invalidText() {
+						return get(expression_2);
+					},
+					get label() {
+						return get(expression_3);
+					},
+					extraClasses: ['qc-xs-mt'],
+					get id() {
+						return get(errorId);
+					},
+					set id($$value) {
+						set(errorId, $$value, true);
+					},
+					get rootElement() {
+						return formErrorElement();
+					},
+					set rootElement($$value) {
+						formErrorElement($$value);
+					}
+				});
+			}
 
 			append($$anchor, fragment);
-		};
+		});
 
 		const lang = Utils.getPageLanguage();
 
@@ -75560,7 +76345,7 @@
 			textFieldRow = state(void 0),
 			defaultInvalidText = user_derived(() => {
 				if (!maxlengthReached()) return '';
-				return lang === 'fr' ? `La limite de caractères du champ ${label()} est dépassée.` : `The character limit for the ${label()} field has been exceeded.`;
+				return strict_equals(lang, 'fr') ? `La limite de caractères du champ ${label()} est dépassée.` : `The character limit for the ${label()} field has been exceeded.`;
 			});
 
 		onMount(() => {
@@ -75603,7 +76388,7 @@
 
 			const s = over > 1 ? 's' : '';
 
-			set(charCountText, remaining >= 0 ? lang === 'fr' ? `${remaining} caractère${s} restant${s}` : `${remaining} character${s} remaining` : lang === 'fr' ? `${over} caractère${s} en trop` : `${over} character${s} over the limit`, true);
+			set(charCountText, remaining >= 0 ? strict_equals(lang, 'fr') ? `${remaining} caractère${s} restant${s}` : `${remaining} character${s} remaining` : strict_equals(lang, 'fr') ? `${over} caractère${s} en trop` : `${over} character${s} over the limit`, true);
 		});
 
 		// Génération des ID pour le aria-describedby
@@ -75773,7 +76558,8 @@
 			set children($$value) {
 				children($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -75815,7 +76601,7 @@
 		name
 	) {
 		if (!input) return;
-		if (input.role === "switch") return;
+		if (strict_equals(input.role, "switch")) return;
 
 		let label = input.closest('label');
 
@@ -75837,13 +76623,18 @@
 		input.addEventListener('change', () => setInvalid(false));
 	}
 
-	var root_2$6 = template(`<span class="qc-required" aria-hidden="true">*</span>`);
-	var root$6 = template(`<div><!> <!> <!></div>`);
+	Checkbox[FILENAME] = 'src/sdg/components/Checkbox/Checkbox.svelte';
+
+	var root_2$6 = add_locations(template(`<span class="qc-required" aria-hidden="true">*</span>`), Checkbox[FILENAME], [[56, 4]]);
+	var root$6 = add_locations(template(`<div><!> <!> <!></div>`), Checkbox[FILENAME], [[64, 4]]);
 
 	function Checkbox($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
-		const requiredSpanSnippet = ($$anchor) => {
+		const requiredSpanSnippet = wrap_snippet(Checkbox, function ($$anchor) {
+			validate_snippet_args(...arguments);
+
 			var fragment = comment();
 			var node = first_child(fragment);
 
@@ -75861,7 +76652,7 @@
 			}
 
 			append($$anchor, fragment);
-		};
+		});
 
 		Utils.getPageLanguage();
 			const qcCheckoxContext = getContext("qc-checkbox");
@@ -76040,7 +76831,8 @@
 			set input($$value) {
 				input($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -76067,9 +76859,12 @@
 		true
 	);
 
-	var root$5 = template(`<button><!></button>`);
+	IconButton[FILENAME] = 'src/sdg/components/IconButton/IconButton.svelte';
+
+	var root$5 = add_locations(template(`<button><!></button>`), IconButton[FILENAME], [[16, 0]]);
 
 	function IconButton($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		const size = prop($$props, 'size', 7, 'xl'),
@@ -76078,18 +76873,20 @@
 			iconSize = prop($$props, 'iconSize', 7),
 			iconColor = prop($$props, 'iconColor', 7),
 			className = prop($$props, 'class', 7, ''),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'size',
-				'label',
-				'icon',
-				'iconSize',
-				'iconColor',
-				'class'
-			]);
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'size',
+					'label',
+					'icon',
+					'iconSize',
+					'iconColor',
+					'class'
+				]);
 
 		var button = root$5();
 		let attributes;
@@ -76171,7 +76968,8 @@
 			set class($$value = '') {
 				className($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -76190,33 +76988,38 @@
 		true
 	);
 
-	var root$4 = template(`<div><!> <input> <!></div>`);
+	SearchInput[FILENAME] = 'src/sdg/components/SearchInput/SearchInput.svelte';
+
+	var root$4 = add_locations(template(`<div><!> <input> <!></div>`), SearchInput[FILENAME], [[28, 0, [[39, 4]]]]);
 
 	function SearchInput($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		const lang = Utils.getPageLanguage();
 
 		let value = prop($$props, 'value', 15, ''),
-			ariaLabel = prop($$props, 'ariaLabel', 7, lang === "fr" ? "Rechercher..." : "Search..."),
-			clearAriaLabel = prop($$props, 'clearAriaLabel', 7, lang === "fr" ? "Effacer le texte" : "Clear text"),
+			ariaLabel = prop($$props, 'ariaLabel', 23, () => strict_equals(lang, "fr") ? "Rechercher..." : "Search..."),
+			clearAriaLabel = prop($$props, 'clearAriaLabel', 23, () => strict_equals(lang, "fr") ? "Effacer le texte" : "Clear text"),
 			leftIcon = prop($$props, 'leftIcon', 7, false),
 			id = prop($$props, 'id', 23, () => `qc-search-input-${Math.random().toString(36).slice(2, 11)}`),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'value',
-				'ariaLabel',
-				'clearAriaLabel',
-				'leftIcon',
-				'id'
-			]);
-
-		leftIcon(leftIcon() === true || leftIcon() === "true" || leftIcon() === "");
-
-		const isDisabled = $$props.disabled === true || $$props.disabled === "true" || $$props.disabled === "";
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'value',
+					'ariaLabel',
+					'clearAriaLabel',
+					'leftIcon',
+					'id'
+				]);
+
+		leftIcon(strict_equals(leftIcon(), true) || strict_equals(leftIcon(), "true") || strict_equals(leftIcon(), ""));
+
+		const isDisabled = strict_equals($$props.disabled, true) || strict_equals($$props.disabled, "true") || strict_equals($$props.disabled, "");
 		let searchInput;
 
 		function focus() {
@@ -76296,7 +77099,9 @@
 		append($$anchor, div);
 
 		return pop({
-			focus,
+			get focus() {
+				return focus;
+			},
 			get value() {
 				return value();
 			},
@@ -76337,7 +77142,8 @@
 			) {
 				id($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -76355,12 +77161,15 @@
 		true
 	);
 
+	DropdownListItemsSingle[FILENAME] = 'src/sdg/components/DropdownList/DropdownListItems/DropdownListItemsSingle/DropdownListItemsSingle.svelte';
+
 	var on_click$1 = (event, handleMouseUp, item) => handleMouseUp(event, get(item));
-	var root_3$1 = template(`<span class="qc-sr-only"><!></span>`);
-	var root_2$5 = template(`<li tabindex="0" role="option"><!></li>`);
-	var root_1$3 = template(`<ul></ul>`);
+	var root_3$1 = add_locations(template(`<span class="qc-sr-only"><!></span>`), DropdownListItemsSingle[FILENAME], [[129, 20]]);
+	var root_2$5 = add_locations(template(`<li tabindex="0" role="option"><!></li>`), DropdownListItemsSingle[FILENAME], [[113, 12]]);
+	var root_1$3 = add_locations(template(`<ul></ul>`), DropdownListItemsSingle[FILENAME], [[111, 4]]);
 
 	function DropdownListItemsSingle($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		const selectedElementCLass = "qc-dropdown-list-single-selected";
@@ -76389,7 +77198,7 @@
 
 		function focusOnFirstMatchingElement(passedValue) {
 			if (get(displayedItemsElements) && get(displayedItemsElements).length > 0) {
-				const foundElement = get(displayedItemsElements).find((el) => el.dataset.itemValue.toString() === passedValue.toString());
+				const foundElement = get(displayedItemsElements).find((el) => strict_equals(el.dataset.itemValue.toString(), passedValue.toString()));
 
 				if (foundElement) {
 					foundElement.focus();
@@ -76401,8 +77210,8 @@
 			event.preventDefault();
 
 			if (!item.disabled) {
-				items().forEach((item) => item.checked = false);
-				items().find((option) => option.value === item.value).checked = true;
+				items().forEach((item) => assign(item, 'checked', false, 'src/​sdg/​components/​DropdownList/​DropdownListItems/​DropdownListItemsSingle/​DropdownListItemsSingle.svelte:45:34'));
+				items().find((option) => strict_equals(option.value, item.value)).checked = true;
 				selectionCallback()();
 			}
 		}
@@ -76412,7 +77221,7 @@
 		}
 
 		function handleComboKey(event, index, item) {
-			if (event.key === "ArrowDown") {
+			if (strict_equals(event.key, "ArrowDown")) {
 				event.preventDefault();
 				event.stopPropagation();
 
@@ -76421,7 +77230,7 @@
 				}
 			}
 
-			if (event.key === "ArrowUp") {
+			if (strict_equals(event.key, "ArrowUp")) {
 				event.preventDefault();
 				event.stopPropagation();
 
@@ -76432,7 +77241,7 @@
 				}
 			}
 
-			if (event.key === "Enter" || event.key === " ") {
+			if (strict_equals(event.key, "Enter") || strict_equals(event.key, " ")) {
 				handleSelection(event, item);
 			}
 
@@ -76452,7 +77261,7 @@
 		}
 
 		function canExit(event, index) {
-			return event.key === "Escape" || !event.shiftKey && event.key === "Tab" && index === displayedItems().length - 1;
+			return strict_equals(event.key, "Escape") || !event.shiftKey && strict_equals(event.key, "Tab") && strict_equals(index, displayedItems().length - 1);
 		}
 
 		function itemsHaveIds() {
@@ -76474,6 +77283,8 @@
 			var consequent_1 = ($$anchor) => {
 				var ul = root_1$3();
 
+				validate_each_keys(displayedItems, (item) => item.id);
+
 				each(ul, 23, displayedItems, (item) => item.id, ($$anchor, item, index) => {
 					var li = root_2$5();
 
@@ -76506,6 +77317,7 @@
 					}
 
 					reset(li);
+					validate_binding('bind:this={displayedItemsElements[index]}', () => get(displayedItemsElements), () => get(index));
 					bind_this(li, ($$value, index) => get(displayedItemsElements)[index] = $$value, (index) => get(displayedItemsElements)?.[index], () => [get(index)]);
 
 					template_effect(() => {
@@ -76536,9 +77348,15 @@
 		append($$anchor, fragment);
 
 		return pop({
-			focusOnFirstElement,
-			focusOnLastElement,
-			focusOnFirstMatchingElement,
+			get focusOnFirstElement() {
+				return focusOnFirstElement;
+			},
+			get focusOnLastElement() {
+				return focusOnLastElement;
+			},
+			get focusOnFirstMatchingElement() {
+				return focusOnFirstMatchingElement;
+			},
 			get items() {
 				return items();
 			},
@@ -76587,7 +77405,8 @@
 			set handlePrintableCharacter($$value = () => {}) {
 				handlePrintableCharacter($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -76613,17 +77432,32 @@
 		true
 	);
 
+	DropdownListItemsMultiple[FILENAME] = 'src/sdg/components/DropdownList/DropdownListItems/DropdownListItemsMultiple/DropdownListItemsMultiple.svelte';
+
 	function handleChange(_, selectionCallback) {
 		selectionCallback()();
 	}
 
 	var on_click = (e, handleLiClick, item) => handleLiClick(e, get(item));
-	var root_2$4 = template(`<li><label class="qc-choicefield-label" compact=""><input type="checkbox" class="qc-choicefield qc-compact"> <span> </span></label></li>`);
-	var root_1$2 = template(`<ul></ul>`);
+
+	var root_2$4 = add_locations(template(`<li><label class="qc-choicefield-label" compact=""><input type="checkbox" class="qc-choicefield qc-compact"> <span> </span></label></li>`), DropdownListItemsMultiple[FILENAME], [
+		[
+			153,
+			12,
+			[
+				[163, 16, [[168, 20], [180, 20]]]
+			]
+		]
+	]);
+
+	var root_1$2 = add_locations(template(`<ul></ul>`), DropdownListItemsMultiple[FILENAME], [[147, 4]]);
 
 	function DropdownListItemsMultiple($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
+		var $$ownership_validator = create_ownership_validator($$props);
+
 		let displayedItems = prop($$props, 'displayedItems', 7),
 			handleExit = prop($$props, 'handleExit', 7, () => {}),
 			selectionCallback = prop($$props, 'selectionCallback', 7, () => {}),
@@ -76668,7 +77502,7 @@
 		}
 
 		function handleComboKey(event, index) {
-			if (event.key === "ArrowDown") {
+			if (strict_equals(event.key, "ArrowDown")) {
 				event.preventDefault();
 				event.stopPropagation();
 
@@ -76681,7 +77515,7 @@
 				}
 			}
 
-			if (event.key === "ArrowUp") {
+			if (strict_equals(event.key, "ArrowUp")) {
 				event.preventDefault();
 				event.stopPropagation();
 
@@ -76696,13 +77530,13 @@
 				}
 			}
 
-			if (event.key === "Enter") {
+			if (strict_equals(event.key, "Enter")) {
 				event.preventDefault();
 				event.stopPropagation();
 
 				if (displayedItems().length > 0 && !displayedItems()[index].disabled) {
 					event.target.checked = !event.target.checked;
-					displayedItems()[index].checked = event.target.checked;
+					$$ownership_validator.mutation('displayedItems', ['displayedItems', index, 'checked'], displayedItems()[index].checked = event.target.checked, 86, 16);
 				}
 			}
 
@@ -76722,10 +77556,10 @@
 		}
 
 		function handleLiKeyDown(event, index) {
-			if (event.target.tagName !== "INPUT") {
+			if (strict_equals(event.target.tagName, "INPUT", false)) {
 				handleKeyDown(event, index);
 
-				if (event.key !== "Tab") {
+				if (strict_equals(event.key, "Tab", false)) {
 					event.preventDefault();
 					event.stopPropagation();
 				}
@@ -76733,7 +77567,7 @@
 		}
 
 		function handleLiClick(event, item) {
-			if (event.target.tagName !== "INPUT") {
+			if (strict_equals(event.target.tagName, "INPUT", false)) {
 				event.preventDefault();
 				event.stopPropagation();
 
@@ -76744,7 +77578,7 @@
 		}
 
 		function canExit(event, index) {
-			return event.key === "Escape" || !event.shiftKey && event.key === "Tab" && index === displayedItems().length - 1;
+			return strict_equals(event.key, "Escape") || !event.shiftKey && strict_equals(event.key, "Tab") && strict_equals(index, displayedItems().length - 1);
 		}
 
 		function itemsHaveIds() {
@@ -76766,6 +77600,8 @@
 			var consequent = ($$anchor) => {
 				var ul = root_1$2();
 
+				validate_each_keys(displayedItems, (item) => item.id);
+
 				each(ul, 23, displayedItems, (item) => item.id, ($$anchor, item, index) => {
 					var li = root_2$4();
 
@@ -76782,6 +77618,8 @@
 					set_attribute(input, 'name', name);
 					input.__change = [handleChange, selectionCallback];
 					input.__keydown = (e) => handleKeyDown(e, get(index));
+					validate_binding('bind:checked={item.checked}', () => get(item), () => 'checked');
+					validate_binding('bind:this={displayedItemsElements[index]}', () => get(displayedItemsElements), () => get(index));
 					bind_this(input, ($$value, index) => get(displayedItemsElements)[index] = $$value, (index) => get(displayedItemsElements)?.[index], () => [get(index)]);
 
 					var span = sibling(input, 2);
@@ -76825,9 +77663,15 @@
 		append($$anchor, fragment);
 
 		return pop({
-			focusOnFirstElement,
-			focusOnLastElement,
-			focusOnFirstMatchingElement,
+			get focusOnFirstElement() {
+				return focusOnFirstElement;
+			},
+			get focusOnLastElement() {
+				return focusOnLastElement;
+			},
+			get focusOnFirstMatchingElement() {
+				return focusOnFirstMatchingElement;
+			},
 			get displayedItems() {
 				return displayedItems();
 			},
@@ -76862,7 +77706,8 @@
 			set handlePrintableCharacter($$value = () => {}) {
 				handlePrintableCharacter($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -76886,10 +77731,13 @@
 		true
 	);
 
-	var root_4$2 = template(`<span class="qc-dropdown-list-no-options"><!></span>`);
-	var root$3 = template(`<div class="qc-dropdown-list-items" tabindex="-1"><!> <div class="qc-dropdown-list-no-options-container" role="status"><!></div></div>`);
+	DropdownListItems[FILENAME] = 'src/sdg/components/DropdownList/DropdownListItems/DropdownListItems.svelte';
+
+	var root_4$2 = add_locations(template(`<span class="qc-dropdown-list-no-options"><!></span>`), DropdownListItems[FILENAME], [[105, 16]]);
+	var root$3 = add_locations(template(`<div class="qc-dropdown-list-items" tabindex="-1"><!> <div class="qc-dropdown-list-no-options-container" role="status"><!></div></div>`), DropdownListItems[FILENAME], [[67, 0, [[102, 4]]]]);
 
 	function DropdownListItems($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let id = prop($$props, 'id', 7),
@@ -77054,9 +77902,15 @@
 		append($$anchor, div);
 
 		return pop({
-			focus,
-			focusOnLastElement,
-			focusOnFirstMatchingElement,
+			get focus() {
+				return focus;
+			},
+			get focusOnLastElement() {
+				return focusOnLastElement;
+			},
+			get focusOnFirstMatchingElement() {
+				return focusOnFirstMatchingElement;
+			},
 			get id() {
 				return id();
 			},
@@ -77147,7 +78001,8 @@
 			set placeholder($$value) {
 				placeholder($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -77177,11 +78032,14 @@
 		true
 	);
 
-	var root_1$1 = template(`<span class="qc-dropdown-choice"><!></span>`);
-	var root_2$3 = template(`<span class="qc-dropdown-placeholder"><!></span>`);
-	var root$2 = template(`<button><!> <span><!></span></button>`);
+	DropdownListButton[FILENAME] = 'src/sdg/components/DropdownList/DropdownListButton/DropdownListButton.svelte';
+
+	var root_1$1 = add_locations(template(`<span class="qc-dropdown-choice"><!></span>`), DropdownListButton[FILENAME], [[29, 8]]);
+	var root_2$3 = add_locations(template(`<span class="qc-dropdown-placeholder"><!></span>`), DropdownListButton[FILENAME], [[31, 8]]);
+	var root$2 = add_locations(template(`<button><!> <span><!></span></button>`), DropdownListButton[FILENAME], [[19, 0, [[34, 4]]]]);
 
 	function DropdownListButton($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
 		let inputId = prop($$props, 'inputId', 7),
@@ -77189,17 +78047,19 @@
 			disabled = prop($$props, 'disabled', 7),
 			selectedOptionsText = prop($$props, 'selectedOptionsText', 7, ""),
 			placeholder = prop($$props, 'placeholder', 7),
-			rest = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'inputId',
-				'expanded',
-				'disabled',
-				'selectedOptionsText',
-				'placeholder'
-			]);
+			rest = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'inputId',
+					'expanded',
+					'disabled',
+					'selectedOptionsText',
+					'placeholder'
+				]);
 
 		let button;
 
@@ -77270,7 +78130,9 @@
 		append($$anchor, button_1);
 
 		return pop({
-			focus,
+			get focus() {
+				return focus;
+			},
 			get inputId() {
 				return inputId();
 			},
@@ -77305,7 +78167,8 @@
 			set placeholder($$value) {
 				placeholder($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -77323,13 +78186,36 @@
 		true
 	);
 
-	var root_2$2 = template(`<div class="qc-dropdown-list-search"><!></div>`);
-	var root_3 = template(`<span> </span>`);
-	var root$1 = template(`<div><div><!> <div tabindex="-1"><!> <div class="qc-dropdown-list-expanded" tabindex="-1" role="listbox"><!> <!> <div role="status" class="qc-sr-only"><!></div></div></div></div> <!></div>`);
+	DropdownList[FILENAME] = 'src/sdg/components/DropdownList/DropdownList.svelte';
+
+	var root_2$2 = add_locations(template(`<div class="qc-dropdown-list-search"><!></div>`), DropdownList[FILENAME], [[337, 20]]);
+	var root_3 = add_locations(template(`<span> </span>`), DropdownList[FILENAME], [[379, 24]]);
+
+	var root$1 = add_locations(template(`<div><div><!> <div tabindex="-1"><!> <div class="qc-dropdown-list-expanded" tabindex="-1" role="listbox"><!> <!> <div role="status" class="qc-sr-only"><!></div></div></div></div> <!></div>`), DropdownList[FILENAME], [
+		[
+			274,
+			0,
+			[
+				[
+					281,
+					4,
+					[
+						[
+							301,
+							8,
+							[[328, 12, [[377, 16]]]]
+						]
+					]
+				]
+			]
+		]
+	]);
 
 	function DropdownList($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
+		var $$ownership_validator = create_ownership_validator($$props);
 		const lang = Utils.getPageLanguage();
 
 		let id = prop($$props, 'id', 23, () => Math.random().toString(36).substring(2, 15)),
@@ -77339,7 +78225,7 @@
 			items = prop($$props, 'items', 23, () => []),
 			value = prop($$props, 'value', 31, () => proxy([])),
 			placeholder = prop($$props, 'placeholder', 7),
-			noOptionsMessage = prop($$props, 'noOptionsMessage', 7, lang === "fr" ? "Aucun élément" : "No item"),
+			noOptionsMessage = prop($$props, 'noOptionsMessage', 23, () => strict_equals(lang, "fr") ? "Aucun élément" : "No item"),
 			enableSearch = prop($$props, 'enableSearch', 7, false),
 			required = prop($$props, 'required', 7, false),
 			disabled = prop($$props, 'disabled', 7, false),
@@ -77352,7 +78238,7 @@
 			webComponentMode = prop($$props, 'webComponentMode', 7, false),
 			webComponentParentRow = prop($$props, 'webComponentParentRow', 7);
 
-		const defaultPlaceholder = lang === "fr" ? "Faire une sélection" : "Select an option",
+		const defaultPlaceholder = strict_equals(lang, "fr") ? "Faire une sélection" : "Select an option",
 			inputId = `${id()}-input`,
 			popupId = `${id()}-popup`,
 			itemsId = `${id()}-items`,
@@ -77368,7 +78254,7 @@
 			selectedItems = user_derived(() => items().filter((item) => item.checked) ?? []),
 			selectedOptionsText = user_derived(() => {
 				if (get(selectedItems).length >= 3) {
-					if (lang === "fr") {
+					if (strict_equals(lang, "fr")) {
 						return `${get(selectedItems).length} options sélectionnées`;
 					}
 
@@ -77411,7 +78297,7 @@
 				const s = get(displayedItems).length > 1 ? "s" : "";
 
 				if (get(displayedItems).length > 0) {
-					return lang === "fr" ? `${get(displayedItems).length} résultat${s} disponible${s}. Utilisez les flèches directionnelles haut et bas pour vous déplacer dans la liste.` : `${get(displayedItems).length} result${s} available. Use up and down arrow keys to navigate through the list.`;
+					return strict_equals(lang, "fr") ? `${get(displayedItems).length} résultat${s} disponible${s}. Utilisez les flèches directionnelles haut et bas pour vous déplacer dans la liste.` : `${get(displayedItems).length} result${s} available. Use up and down arrow keys to navigate through the list.`;
 				}
 
 				return "";
@@ -77442,27 +78328,27 @@
 			// Le changement de focus a lieu après le lancement de l'événement clavier.
 			// Il faut donc faire un court sleep pour avoir le nouvel élément en focus.
 			Utils.sleep(5).then(() => {
-				if (event.key === "Tab" && !Utils.componentIsActive(get(instance))) {
+				if (strict_equals(event.key, "Tab") && !Utils.componentIsActive(get(instance))) {
 					set(expanded, false);
 				}
 			}).catch(console.error);
 		}
 
 		function handleEscape(event) {
-			if (event.key === "Escape") {
+			if (strict_equals(event.key, "Escape")) {
 				set(expanded, false);
 			}
 		}
 
 		function handleArrowUp(event, targetComponent) {
-			if (event.key === "ArrowUp" && targetComponent) {
+			if (strict_equals(event.key, "ArrowUp") && targetComponent) {
 				event.preventDefault();
 				targetComponent.focus();
 			}
 		}
 
 		function handleArrowDown(event, targetComponent) {
-			if (event.key === "ArrowDown" && targetComponent) {
+			if (strict_equals(event.key, "ArrowDown") && targetComponent) {
 				event.preventDefault();
 				set(expanded, true);
 				targetComponent.focus();
@@ -77473,7 +78359,7 @@
 			handleEscape(event);
 			handleTab(event);
 
-			if (event.key === "ArrowDown") {
+			if (strict_equals(event.key, "ArrowDown")) {
 				event.preventDefault();
 
 				if (get(expanded)) {
@@ -77484,7 +78370,7 @@
 				}
 			}
 
-			if (event.key === "ArrowUp") {
+			if (strict_equals(event.key, "ArrowUp")) {
 				event.preventDefault();
 
 				if (get(expanded)) {
@@ -77517,7 +78403,7 @@
 			set(expanded, false);
 			set(hiddenSearchText, "");
 
-			if (key === "Escape" && get(button)) {
+			if (strict_equals(key, "Escape") && get(button)) {
 				get(button).focus();
 			}
 		}
@@ -77539,7 +78425,7 @@
 		});
 
 		user_effect(() => {
-			if (get(previousValue)?.toString() !== value()?.toString()) {
+			if (strict_equals(get(previousValue)?.toString(), value()?.toString(), false)) {
 				invalid(false);
 			}
 		});
@@ -77554,7 +78440,7 @@
 		user_effect(() => {
 			const tempValue = get(selectedItems)?.map((item) => item.value);
 
-			if (tempValue?.toString() !== "") {
+			if (strict_equals(tempValue?.toString(), "", false)) {
 				value(tempValue);
 			} else {
 				value([]);
@@ -77581,11 +78467,11 @@
 			const optionWithEmptyValue = findOptionWithEmptyValue();
 
 			if (!optionWithEmptyValue) return;
-			placeholder(optionWithEmptyValue.label !== "" ? optionWithEmptyValue.label : defaultPlaceholder);
+			placeholder(strict_equals(optionWithEmptyValue.label, "", false) ? optionWithEmptyValue.label : defaultPlaceholder);
 		});
 
 		function findOptionWithEmptyValue() {
-			return items()?.find((item) => item.value === "" || item.value === null || item.value === undefined);
+			return items()?.find((item) => strict_equals(item.value, "") || strict_equals(item.value, null) || strict_equals(item.value, undefined));
 		}
 
 		var div = root$1();
@@ -77690,7 +78576,7 @@
 							handleArrowDown(e, get(dropdownItems));
 							handleArrowUp(e, get(button));
 
-							if (e.key === "Enter") {
+							if (strict_equals(e.key, "Enter")) {
 								e.preventDefault();
 							}
 						},
@@ -77716,45 +78602,49 @@
 
 		var node_4 = sibling(node_2, 2);
 
-		bind_this(
-			DropdownListItems(node_4, {
-				id: itemsId,
-				get enableSearch() {
-					return enableSearch();
-				},
-				get placeholder() {
-					return placeholder();
-				},
-				get multiple() {
-					return multiple();
-				},
-				get items() {
-					return items();
-				},
-				get displayedItems() {
-					return get(displayedItems);
-				},
-				get noOptionsMessage() {
-					return noOptionsMessage();
-				},
-				selectionCallbackSingle: () => {
-					closeDropdown("");
-					get(button)?.focus();
-				},
-				handleExitSingle: (key) => closeDropdown(key),
-				handleExitMultiple: (key) => closeDropdown(key),
-				focusOnOuterElement: () => enableSearch() ? get(searchInput)?.focus() : get(button)?.focus(),
-				handlePrintableCharacter,
-				get value() {
-					return value();
-				},
-				set value($$value) {
-					value($$value);
-				}
-			}),
-			($$value) => set(dropdownItems, $$value, true),
-			() => get(dropdownItems)
-		);
+		{
+			$$ownership_validator.binding('value', DropdownListItems, value);
+
+			bind_this(
+				DropdownListItems(node_4, {
+					id: itemsId,
+					get enableSearch() {
+						return enableSearch();
+					},
+					get placeholder() {
+						return placeholder();
+					},
+					get multiple() {
+						return multiple();
+					},
+					get items() {
+						return items();
+					},
+					get displayedItems() {
+						return get(displayedItems);
+					},
+					get noOptionsMessage() {
+						return noOptionsMessage();
+					},
+					selectionCallbackSingle: () => {
+						closeDropdown("");
+						get(button)?.focus();
+					},
+					handleExitSingle: (key) => closeDropdown(key),
+					handleExitMultiple: (key) => closeDropdown(key),
+					focusOnOuterElement: () => enableSearch() ? get(searchInput)?.focus() : get(button)?.focus(),
+					handlePrintableCharacter,
+					get value() {
+						return value();
+					},
+					set value($$value) {
+						value($$value);
+					}
+				}),
+				($$value) => set(dropdownItems, $$value, true),
+				() => get(dropdownItems)
+			);
+		}
 
 		var div_5 = sibling(node_4, 2);
 		var node_5 = child(div_5);
@@ -77777,25 +78667,29 @@
 		var node_6 = sibling(div_1, 2);
 		const expression_1 = user_derived(() => label() ?? ariaLabel());
 
-		FormError(node_6, {
-			id: errorId,
-			get invalid() {
-				return invalid();
-			},
-			get invalidText() {
-				return invalidText();
-			},
-			extraClasses: ["qc-xs-mt"],
-			get label() {
-				return get(expression_1);
-			},
-			get rootElement() {
-				return errorElement();
-			},
-			set rootElement($$value) {
-				errorElement($$value);
-			}
-		});
+		{
+			$$ownership_validator.binding('errorElement', FormError, errorElement);
+
+			FormError(node_6, {
+				id: errorId,
+				get invalid() {
+					return invalid();
+				},
+				get invalidText() {
+					return invalidText();
+				},
+				extraClasses: ["qc-xs-mt"],
+				get label() {
+					return get(expression_1);
+				},
+				get rootElement() {
+					return errorElement();
+				},
+				set rootElement($$value) {
+					errorElement($$value);
+				}
+			});
+		}
 
 		reset(div);
 		bind_this(div, ($$value) => rootElement($$value), () => rootElement());
@@ -77959,7 +78853,8 @@
 			set webComponentParentRow($$value) {
 				webComponentParentRow($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -77991,20 +78886,25 @@
 		true
 	);
 
-	var root_2$1 = template(`<legend><!></legend>`);
-	var root_1 = template(`<fieldset><!> <div><!></div> <!></fieldset>`);
-	var root_4$1 = template(`<div class="qc-fieldset-invalid"><!></div>`);
+	Fieldset[FILENAME] = 'src/sdg/components/Fieldset/Fieldset.svelte';
+
+	var root_2$1 = add_locations(template(`<legend><!></legend>`), Fieldset[FILENAME], [[43, 4]]);
+	var root_1 = add_locations(template(`<fieldset><!> <div><!></div> <!></fieldset>`), Fieldset[FILENAME], [[31, 0, [[47, 4]]]]);
+	var root_4$1 = add_locations(template(`<div class="qc-fieldset-invalid"><!></div>`), Fieldset[FILENAME], [[70, 4]]);
 
 	function Fieldset($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
-		const fieldset = ($$anchor) => {
+		const fieldset = wrap_snippet(Fieldset, function ($$anchor) {
+			validate_snippet_args(...arguments);
+
 			var fieldset_1 = root_1();
 
 			set_attribute(fieldset_1, 'aria-describedby', legendId);
 
 			fieldset_1.__change = function (...$$args) {
-				onchange()?.apply(this, $$args);
+				apply(onchange, this, $$args, Fieldset, [38, 11]);
 			};
 
 			var node = child(fieldset_1);
@@ -78084,7 +78984,7 @@
 			});
 
 			append($$anchor, fieldset_1);
-		};
+		});
 
 		let legend = prop($$props, 'legend', 7),
 			name = prop($$props, 'name', 7),
@@ -78234,7 +79134,8 @@
 			set rootElement($$value) {
 				rootElement($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -78264,9 +79165,14 @@
 		true
 	);
 
+	ChoiceGroup[FILENAME] = 'src/sdg/components/ChoiceGroup/ChoiceGroup.svelte';
+
 	function ChoiceGroup($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 
+		var $$ownership_validator = create_ownership_validator($$props);
+
 		let invalid = prop($$props, 'invalid', 15, false),
 			invalidText = prop($$props, 'invalidText', 7),
 			children = prop($$props, 'children', 7),
@@ -78276,21 +79182,23 @@
 			host = prop($$props, 'host', 7),
 			name = prop($$props, 'name', 7),
 			required = prop($$props, 'required', 7),
-			restProps = rest_props($$props, [
-				'$$slots',
-				'$$events',
-				'$$legacy',
-				'$$host',
-				'invalid',
-				'invalidText',
-				'children',
-				'compact',
-				'selectionButton',
-				'inline',
-				'host',
-				'name',
-				'required'
-			]);
+			restProps = rest_props(
+				$$props,
+				[
+					'$$slots',
+					'$$events',
+					'$$legacy',
+					'$$host',
+					'invalid',
+					'invalidText',
+					'children',
+					'compact',
+					'selectionButton',
+					'inline',
+					'host',
+					'name',
+					'required'
+				]);
 
 		let fieldsetElement = state(void 0);
 
@@ -78304,49 +79212,53 @@
 			(host() ? host() : get(fieldsetElement)).querySelectorAll('input, .qc-choicefield').forEach((input) => updateInput(input, required(), invalid(), compact(), selectionButton(), inline(), name()));
 		});
 
-		Fieldset($$anchor, spread_props(
-			{
-				get required() {
-					return required();
-				},
-				get compact() {
-					return compact();
-				},
-				get selectionButton() {
-					return selectionButton();
-				},
-				get inline() {
-					return inline();
-				},
-				get invalidText() {
-					return invalidText();
-				},
-				onchange
-			},
-			() => restProps,
-			{
-				get invalid() {
-					return invalid();
-				},
-				set invalid($$value) {
-					invalid($$value);
-				},
-				get rootElement() {
-					return get(fieldsetElement);
-				},
-				set rootElement($$value) {
-					set(fieldsetElement, $$value, true);
-				},
-				children: ($$anchor, $$slotProps) => {
-					var fragment_1 = comment();
-					var node = first_child(fragment_1);
+		{
+			$$ownership_validator.binding('invalid', Fieldset, invalid);
 
-					snippet(node, children);
-					append($$anchor, fragment_1);
+			Fieldset($$anchor, spread_props(
+				{
+					get required() {
+						return required();
+					},
+					get compact() {
+						return compact();
+					},
+					get selectionButton() {
+						return selectionButton();
+					},
+					get inline() {
+						return inline();
+					},
+					get invalidText() {
+						return invalidText();
+					},
+					onchange
 				},
-				$$slots: { default: true }
-			}
-		));
+				() => restProps,
+				{
+					get invalid() {
+						return invalid();
+					},
+					set invalid($$value) {
+						invalid($$value);
+					},
+					get rootElement() {
+						return get(fieldsetElement);
+					},
+					set rootElement($$value) {
+						set(fieldsetElement, $$value, true);
+					},
+					children: wrap_snippet(ChoiceGroup, ($$anchor, $$slotProps) => {
+						var fragment_1 = comment();
+						var node = first_child(fragment_1);
+
+						snippet(node, children);
+						append($$anchor, fragment_1);
+					}),
+					$$slots: { default: true }
+				}
+			));
+		}
 
 		return pop({
 			get invalid() {
@@ -78411,7 +79323,8 @@
 			set required($$value) {
 				required($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -78433,24 +79346,27 @@
 		true
 	);
 
-	var root_2 = template(`<label><input type="checkbox"> Multiligne</label>`);
-	var root_4 = template(`<label><input type="radio" name="size"> </label>`);
-	var root_5 = template(`<label><input type="checkbox"> Required</label>`);
-	var root_6 = template(`<label><input type="checkbox"> Invalid</label>`);
-	var root_7 = template(`<input type="text">`);
-	var root_8 = template(`<input type="text">`);
-	var root_9 = template(`<input type="text">`);
-	var root_11 = template(`<input type="text">`);
-	var root_12 = template(`<input type="number">`);
-	var root_10 = template(`<!> <!>`, 1);
-	var root = template(`<!> <div class="attributes qc-hash-f0iu2z"><!> <!> <!> <!> <!> <!> <!> <!></div> <link rel="stylesheet">`, 1);
+	TextFieldDemo[FILENAME] = 'src/sdg/components/TextField/Doc/TextFieldDemo.svelte';
+
+	var root_2 = add_locations(template(`<label><input type="checkbox"> Multiligne</label>`), TextFieldDemo[FILENAME], [[70, 8, [[71, 12]]]]);
+	var root_4 = add_locations(template(`<label><input type="radio" name="size"> </label>`), TextFieldDemo[FILENAME], [[78, 12, [[79, 16]]]]);
+	var root_5 = add_locations(template(`<label><input type="checkbox"> Required</label>`), TextFieldDemo[FILENAME], [[89, 8, [[90, 12]]]]);
+	var root_6 = add_locations(template(`<label><input type="checkbox"> Invalid</label>`), TextFieldDemo[FILENAME], [[96, 8, [[97, 12]]]]);
+	var root_7 = add_locations(template(`<input type="text">`), TextFieldDemo[FILENAME], [[103, 8]]);
+	var root_8 = add_locations(template(`<input type="text">`), TextFieldDemo[FILENAME], [[107, 8]]);
+	var root_9 = add_locations(template(`<input type="text">`), TextFieldDemo[FILENAME], [[112, 8]]);
+	var root_11 = add_locations(template(`<input type="text">`), TextFieldDemo[FILENAME], [[120, 12]]);
+	var root_12 = add_locations(template(`<input type="number">`), TextFieldDemo[FILENAME], [[127, 12]]);
+	var root_10 = add_locations(template(`<!> <!>`, 1), TextFieldDemo[FILENAME], []);
+	var root = add_locations(template(`<!> <div class="attributes qc-hash-f0iu2z"><!> <!> <!> <!> <!> <!> <!> <!></div> <link rel="stylesheet">`, 1), TextFieldDemo[FILENAME], [[68, 0], [142, 0]]);
 
 	const $$css = {
 		hash: 'qc-hash-f0iu2z',
-		code: '.attributes.qc-hash-f0iu2z {display:flex;flex-direction:column;flex-wrap:wrap;gap:0 24px;max-height:352px;}'
+		code: '\n    .attributes.qc-hash-f0iu2z {\n        display: flex;\n        flex-direction: column;\n        flex-wrap: wrap;\n        gap: 0 24px;\n        max-height: 352px;\n    }\n'
 	};
 
 	function TextFieldDemo($$anchor, $$props) {
+		check_target(new.target);
 		push($$props, true);
 		append_styles$1($$anchor, $$css);
 
@@ -78472,8 +79388,14 @@
 			inputType = state("text"),
 			multiligne = state(false);
 
+		inspect(() => [
+			get(multiligne),
+			get(inputTag),
+			get(inputType)
+		]);
+
 		user_effect(() => {
-			console.log(get(multiligne), get(inputTag), get(inputType));
+			console.log(...log_if_contains_state('log', get(multiligne), get(inputTag), get(inputType)));
 
 			if (get(multiligne)) {
 				set(inputTag, "textarea");
@@ -78511,23 +79433,33 @@
 			get maxlength() {
 				return get(expression_1);
 			},
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var fragment_1 = comment();
 				var node_1 = first_child(fragment_1);
 
-				element(node_1, () => get(inputTag), false, ($$element, $$anchor) => {
-					let attributes;
-
-					template_effect(() => attributes = set_attributes($$element, attributes, {
-						inputType: get(inputType),
-						value: value(),
-						name: 'textfield-demo',
-						placeholder: placeholder()
-					}));
-				});
+				validate_void_dynamic_element(() => get(inputTag));
+				validate_dynamic_element_tag(() => get(inputTag));
+
+				element(
+					node_1,
+					() => get(inputTag),
+					false,
+					($$element, $$anchor) => {
+						let attributes;
+
+						template_effect(() => attributes = set_attributes($$element, attributes, {
+							inputType: get(inputType),
+							value: value(),
+							name: 'textfield-demo',
+							placeholder: placeholder()
+						}));
+					},
+					undefined,
+					[58, 4]
+				);
 
 				append($$anchor, fragment_1);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78536,7 +79468,7 @@
 
 		Checkbox(node_2, {
 			compact: true,
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var label_1 = root_2();
 				var input = child(label_1);
 
@@ -78545,7 +79477,7 @@
 				reset(label_1);
 				bind_checked(input, () => get(multiligne), ($$value) => set(multiligne, $$value));
 				append($$anchor, label_1);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78555,7 +79487,7 @@
 			legend: 'Size',
 			selectionButton: true,
 			inline: true,
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var fragment_2 = comment();
 				var node_4 = first_child(fragment_2);
 
@@ -78583,6 +79515,7 @@
 						[],
 						input_1,
 						() => {
+							_size;
 							return size();
 						},
 						size
@@ -78592,7 +79525,7 @@
 				});
 
 				append($$anchor, fragment_2);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78600,7 +79533,7 @@
 
 		Checkbox(node_5, {
 			compact: true,
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var label_3 = root_5();
 				var input_2 = child(label_3);
 
@@ -78609,7 +79542,7 @@
 				reset(label_3);
 				bind_checked(input_2, required);
 				append($$anchor, label_3);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78617,7 +79550,7 @@
 
 		Checkbox(node_6, {
 			compact: true,
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var label_4 = root_6();
 				var input_3 = child(label_4);
 
@@ -78626,7 +79559,7 @@
 				reset(label_4);
 				bind_checked(input_3, invalid);
 				append($$anchor, label_4);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78634,13 +79567,13 @@
 
 		TextField(node_7, {
 			label: 'placeholder',
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var input_4 = root_7();
 
 				remove_input_defaults(input_4);
 				bind_value(input_4, placeholder);
 				append($$anchor, input_4);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78648,13 +79581,13 @@
 
 		TextField(node_8, {
 			label: 'Libellé du champ',
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var input_5 = root_8();
 
 				remove_input_defaults(input_5);
 				bind_value(input_5, label);
 				append($$anchor, input_5);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78662,13 +79595,13 @@
 
 		TextField(node_9, {
 			label: 'Message d\'erreur',
-			children: ($$anchor, $$slotProps) => {
+			children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 				var input_6 = root_9();
 
 				remove_input_defaults(input_6);
 				bind_value(input_6, invalidText);
 				append($$anchor, input_6);
-			},
+			}),
 			$$slots: { default: true }
 		});
 
@@ -78682,13 +79615,13 @@
 				TextField(node_11, {
 					label: 'Description',
 					size: 'lg',
-					children: ($$anchor, $$slotProps) => {
+					children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 						var input_7 = root_11();
 
 						remove_input_defaults(input_7);
 						bind_value(input_7, description);
 						append($$anchor, input_7);
-					},
+					}),
 					$$slots: { default: true }
 				});
 
@@ -78697,13 +79630,13 @@
 				TextField(node_12, {
 					label: 'Maxlength',
 					size: 'xs',
-					children: ($$anchor, $$slotProps) => {
+					children: wrap_snippet(TextFieldDemo, ($$anchor, $$slotProps) => {
 						var input_8 = root_12();
 
 						remove_input_defaults(input_8);
 						bind_value(input_8, maxlength);
 						append($$anchor, input_8);
-					},
+					}),
 					$$slots: { default: true }
 				});
 
@@ -78804,7 +79737,8 @@
 			set invalidAtSubmit($$value = false) {
 				invalidAtSubmit($$value);
 				flushSync();
-			}
+			},
+			...legacy_api()
 		});
 	}
 
@@ -78833,7 +79767,7 @@
 	));
 
 	if (document.getElementById("version")) {
-	    document.getElementById("version").textContent = `v1.4.3`;
+	    document.getElementById("version").textContent = `v1.4.4`;
 	}
 
 	// Show maskable "general alert" component