suus-component-library 0.1.9 → 0.1.10

package/dist/suus-component-library.js

@@ -1,19 +1,19 @@
 import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
 import { useEffect as r, useId as i, useMemo as a, useRef as o, useState as s } from "react";
 var c = {
-	suusButton: "_suusButton_1q9to_1",
-	icon: "_icon_1q9to_45",
-	label: "_label_1q9to_62",
-	primary: "_primary_1q9to_69",
-	secondary: "_secondary_1q9to_113",
-	loading: "_loading_1q9to_169",
-	loader: "_loader_1q9to_173",
-	"btn-spin": "_btn-spin_1q9to_1",
-	loaderSecondary: "_loaderSecondary_1q9to_182"
+	suusButton: "_suusButton_1ucmz_1",
+	icon: "_icon_1ucmz_45",
+	label: "_label_1ucmz_62",
+	primary: "_primary_1ucmz_69",
+	secondary: "_secondary_1ucmz_113",
+	loading: "_loading_1ucmz_169",
+	loader: "_loader_1ucmz_173",
+	"btn-spin": "_btn-spin_1ucmz_1",
+	loaderSecondary: "_loaderSecondary_1ucmz_182"
 };
 //#endregion
 //#region src/components/form/button/Button.tsx
-function l({ label: r, onClick: i, type: a = "button", disabled: o = !1, loading: s = !1, variant: l = "primary", colorToken: u = "--colors-juice-sugarcane", icon: d, ...f }) {
+function l({ label: r, onClick: i, type: a = "button", disabled: o = !1, loading: s = !1, variant: l = "primary", colorToken: u = "--color-juice-sugarcane", icon: d, ...f }) {
 	return /* @__PURE__ */ t("button", {
 		type: a,
 		onClick: i,
@@ -39,16 +39,16 @@ function l({ label: r, onClick: i, type: a = "button", disabled: o = !1, loading
 	});
 }
 var u = {
-	checkboxWrapper: "_checkboxWrapper_137qc_1",
-	checkboxInput: "_checkboxInput_137qc_15",
-	checkboxLabel: "_checkboxLabel_137qc_24",
-	customCheckbox: "_customCheckbox_137qc_34",
-	checkIcon: "_checkIcon_137qc_57",
-	checkboxText: "_checkboxText_137qc_76",
-	checkboxWrapperDisabled: "_checkboxWrapperDisabled_137qc_107",
-	checkboxWrapperError: "_checkboxWrapperError_137qc_133",
-	errorMessage: "_errorMessage_137qc_147",
-	checkboxWrapperGlassy: "_checkboxWrapperGlassy_137qc_157"
+	checkboxWrapper: "_checkboxWrapper_6w8h4_1",
+	checkboxInput: "_checkboxInput_6w8h4_15",
+	checkboxLabel: "_checkboxLabel_6w8h4_24",
+	customCheckbox: "_customCheckbox_6w8h4_34",
+	checkIcon: "_checkIcon_6w8h4_57",
+	checkboxText: "_checkboxText_6w8h4_76",
+	checkboxWrapperDisabled: "_checkboxWrapperDisabled_6w8h4_107",
+	checkboxWrapperError: "_checkboxWrapperError_6w8h4_133",
+	errorMessage: "_errorMessage_6w8h4_147",
+	checkboxWrapperGlassy: "_checkboxWrapperGlassy_6w8h4_154"
 };
 //#endregion
 //#region src/components/form/checkbox/Checkbox.tsx
@@ -100,19 +100,42 @@ function d({ label: e, name: r, id: i, error: a, variant: o = "default", classNa
 	});
 }
 var f = {
-	chip: "_chip_9t0x4_1",
-	chipGlassy: "_chipGlassy_9t0x4_19"
+	chip: "_chip_1kgh7_1",
+	chipDefault: "_chipDefault_1kgh7_21",
+	chipGlassy: "_chipGlassy_1kgh7_36",
+	chipChecked: "_chipChecked_1kgh7_49",
+	chipDisabled: "_chipDisabled_1kgh7_56"
 };
 //#endregion
 //#region src/components/form/chip/Chip.tsx
-function p({ children: e, variant: n = "default", className: r, ...i }) {
-	return /* @__PURE__ */ t("span", {
+function p({ children: e, variant: n = "default", clickable: r = !0, checked: i, defaultChecked: a = !1, onCheckedChange: o, className: c, ...l }) {
+	let [u, d] = s(a), p = typeof i == "boolean", m = p ? i : u;
+	function h(e) {
+		if (!r) return;
+		let t = !m;
+		p || d(t), o?.(t), l.onClick?.(e);
+	}
+	let g = n === "glassy" ? f.chipGlassy : f.chipDefault, _ = m ? f.chipChecked : "", v = r ? "" : f.chipDisabled;
+	return r ? /* @__PURE__ */ t("button", {
+		type: "button",
+		"aria-pressed": m,
+		className: [
+			f.chip,
+			g,
+			_,
+			c ?? ""
+		].filter(Boolean).join(" "),
+		onClick: h,
+		...l,
+		children: e
+	}) : /* @__PURE__ */ t("span", {
 		className: [
 			f.chip,
-			n === "glassy" ? f.chipGlassy : "",
-			r ?? ""
+			g,
+			_,
+			v,
+			c ?? ""
 		].filter(Boolean).join(" "),
-		...i,
 		children: e
 	});
 }
@@ -217,13 +240,13 @@ function v() {
 	});
 }
 var y = {
-	inputBlockVertical: "_inputBlockVertical_1eq2l_1",
-	inputLabel: "_inputLabel_1eq2l_7",
-	inputLabelGlassy: "_inputLabelGlassy_1eq2l_13",
-	inputSelectField: "_inputSelectField_1eq2l_17",
-	inputSelectFieldGlassy: "_inputSelectFieldGlassy_1eq2l_27",
-	inputError: "_inputError_1eq2l_40",
-	errorMessage: "_errorMessage_1eq2l_44"
+	inputBlockVertical: "_inputBlockVertical_1yqyz_1",
+	inputLabel: "_inputLabel_1yqyz_7",
+	inputLabelGlassy: "_inputLabelGlassy_1yqyz_13",
+	inputSelectField: "_inputSelectField_1yqyz_17",
+	inputSelectFieldGlassy: "_inputSelectFieldGlassy_1yqyz_27",
+	inputError: "_inputError_1yqyz_40",
+	errorMessage: "_errorMessage_1yqyz_44"
 };
 //#endregion
 //#region src/components/form/dropdown/Dropdown.tsx
@@ -267,11 +290,12 @@ function b({ label: e, name: r, options: i, placeholder: a, error: o, variant: s
 	});
 }
 var x = {
-	appLink: "_appLink_18ja7_1",
-	appLinkGlassy: "_appLinkGlassy_18ja7_27",
-	label: "_label_18ja7_35",
-	icon: "_icon_18ja7_40",
-	arrowIcon: "_arrowIcon_18ja7_51"
+	appLink: "_appLink_b53rv_1",
+	appLinkDefault: "_appLinkDefault_b53rv_19",
+	appLinkGlassy: "_appLinkGlassy_b53rv_30",
+	label: "_label_b53rv_38",
+	icon: "_icon_b53rv_43",
+	arrowIcon: "_arrowIcon_b53rv_54"
 };
 //#endregion
 //#region src/components/form/link/Link.tsx
@@ -286,7 +310,7 @@ function S({ children: e, href: r, onClick: i, newTab: a = !1, showArrow: o = !0
 		rel: r && a ? "noopener noreferrer" : void 0,
 		className: [
 			x.appLink,
-			s === "glassy" ? x.appLinkGlassy : "",
+			s === "glassy" ? x.appLinkGlassy : x.appLinkDefault,
 			c ?? ""
 		].filter(Boolean).join(" "),
 		...l,
@@ -311,59 +335,58 @@ function C() {
 	});
 }
 var w = {
-	inputBlockVertical: "_inputBlockVertical_1x5ym_1",
-	inputLabel: "_inputLabel_1x5ym_7",
-	inputLabelGlassy: "_inputLabelGlassy_1x5ym_13",
-	passwordInputWrapper: "_passwordInputWrapper_1x5ym_17",
-	inputTextField: "_inputTextField_1x5ym_22",
-	inputTextFieldGlassy: "_inputTextFieldGlassy_1x5ym_34",
-	inputError: "_inputError_1x5ym_52",
-	togglePasswordButton: "_togglePasswordButton_1x5ym_56",
-	icon: "_icon_1x5ym_88",
-	errorMessage: "_errorMessage_1x5ym_97"
+	inputBlockVertical: "_inputBlockVertical_u3s35_1",
+	inputLabel: "_inputLabel_u3s35_7",
+	inputLabelGlassy: "_inputLabelGlassy_u3s35_13",
+	passwordInputWrapper: "_passwordInputWrapper_u3s35_17",
+	inputTextField: "_inputTextField_u3s35_22",
+	inputTextFieldGlassy: "_inputTextFieldGlassy_u3s35_34",
+	inputError: "_inputError_u3s35_56",
+	togglePasswordButton: "_togglePasswordButton_u3s35_60",
+	icon: "_icon_u3s35_92",
+	errorMessage: "_errorMessage_u3s35_101"
 };
 //#endregion
 //#region src/components/form/password/Password.tsx
-function T({ label: e, name: r, id: i, error: a, variant: o = "default", colorToken: c = "--colors-juice-sugarcane", className: l, disabled: u, ref: d, autoComplete: f = "current-password", ...p }) {
-	let [m, h] = s(!1), g = i ?? r, _ = { "--password-accent-color": `var(${c})` };
-	function v() {
-		h((e) => !e);
+function T({ label: e, name: r, id: i, error: a, variant: o = "default", className: c, disabled: l, ref: u, autoComplete: d = "current-password", ...f }) {
+	let [p, m] = s(!1), h = i ?? r;
+	function g() {
+		m((e) => !e);
 	}
 	return /* @__PURE__ */ n("div", {
 		className: w.inputBlockVertical,
-		style: _,
 		children: [
 			e && /* @__PURE__ */ t("label", {
-				htmlFor: g,
+				htmlFor: h,
 				className: [w.inputLabel, o === "glassy" ? w.inputLabelGlassy : ""].filter(Boolean).join(" "),
 				children: e
 			}),
 			/* @__PURE__ */ n("div", {
 				className: w.passwordInputWrapper,
 				children: [/* @__PURE__ */ t("input", {
-					id: g,
+					id: h,
 					name: r,
-					ref: d,
-					type: m ? "text" : "password",
-					disabled: u,
-					autoComplete: f,
+					ref: u,
+					type: p ? "text" : "password",
+					disabled: l,
+					autoComplete: d,
 					className: [
 						w.inputTextField,
 						o === "glassy" ? w.inputTextFieldGlassy : "",
 						a ? w.inputError : "",
-						l ?? ""
+						c ?? ""
 					].filter(Boolean).join(" "),
 					"aria-invalid": !!a,
 					"aria-describedby": a ? `${r}-error` : void 0,
-					...p
+					...f
 				}), /* @__PURE__ */ t("button", {
 					type: "button",
 					className: w.togglePasswordButton,
-					onClick: v,
-					disabled: u,
-					"aria-label": m ? "Passwort ausblenden" : "Passwort anzeigen",
-					"aria-pressed": m,
-					children: t(m ? D : E, {})
+					onClick: g,
+					disabled: l,
+					"aria-label": p ? "Passwort ausblenden" : "Passwort anzeigen",
+					"aria-pressed": p,
+					children: t(p ? D : E, {})
 				})]
 			}),
 			a && /* @__PURE__ */ t("span", {
@@ -399,69 +422,71 @@ function D() {
 	});
 }
 var O = {
-	inputBlockVertical: "_inputBlockVertical_n4fz9_1",
-	inputLabel: "_inputLabel_n4fz9_7",
-	inputLabelGlassy: "_inputLabelGlassy_n4fz9_13",
-	inputWrapper: "_inputWrapper_n4fz9_17",
-	inputTextField: "_inputTextField_n4fz9_22",
-	inputTextFieldGlassy: "_inputTextFieldGlassy_n4fz9_34",
-	inputValid: "_inputValid_n4fz9_60",
-	inputError: "_inputError_n4fz9_64",
-	loading: "_loading_n4fz9_68",
-	suggestionList: "_suggestionList_n4fz9_77",
-	suggestionItem: "_suggestionItem_n4fz9_94",
-	postalCode: "_postalCode_n4fz9_114",
-	locality: "_locality_n4fz9_119",
-	emptyState: "_emptyState_n4fz9_123",
-	successMessage: "_successMessage_n4fz9_138",
-	errorMessage: "_errorMessage_n4fz9_144"
+	inputBlockVertical: "_inputBlockVertical_1xe0h_1",
+	inputLabel: "_inputLabel_1xe0h_7",
+	inputLabelGlassy: "_inputLabelGlassy_1xe0h_13",
+	inputWrapper: "_inputWrapper_1xe0h_17",
+	inputTextField: "_inputTextField_1xe0h_22",
+	inputTextFieldGlassy: "_inputTextFieldGlassy_1xe0h_34",
+	inputError: "_inputError_1xe0h_64",
+	loading: "_loading_1xe0h_68",
+	suggestionList: "_suggestionList_1xe0h_77",
+	suggestionItem: "_suggestionItem_1xe0h_94",
+	locality: "_locality_1xe0h_114",
+	emptyState: "_emptyState_1xe0h_118",
+	successMessage: "_successMessage_1xe0h_129",
+	errorMessage: "_errorMessage_1xe0h_135"
 };
 //#endregion
 //#region src/components/form/postal-code/PostalCode.tsx
 function k({ label: e, name: a, id: c, error: l, variant: u = "default", className: d, disabled: f, placeholder: p = "z.B. 8001 oder Zürich", ref: m, onChange: h, onBlur: g, onValueChange: _, onSuggestionSelect: v, ...y }) {
-	let b = i(), x = c ?? `${a}-${b}`, S = o(null), [C, w] = s(""), [T, E] = s([]), [D, k] = s(!1), [A, j] = s(!1), M = /^\d+$/.test(C.trim()), N = C.trim().length >= 4 && M && !D, P = N && T.some((e) => e.postalCode === C.trim()), F = N && !P;
-	r(() => {
-		let e = C.trim();
+	let b = i(), x = c ?? `${a}-${b}`, S = o(null), C = o(!1), [w, T] = s(""), [E, D] = s([]), [k, A] = s(!1), [j, M] = s(!1), N = w.trim().match(/^(\d+)\s+(.+)$/), P = !!N, F = N?.[1], I = N?.[2], L = P && E.some((e) => e.postalCode === F && e.locality === I), R = /^\d+$/.test(w.trim()), z = w.trim().length >= 4 && R && !k, B = z && E.some((e) => e.postalCode === w.trim()), V = z && !B;
+	j && w.trim().length >= 4 && E.length, r(() => {
+		let e = w.trim();
 		if (e.length < 2) {
-			E([]), j(!1);
+			D([]), M(!1);
+			return;
+		}
+		if (C.current) {
+			C.current = !1;
 			return;
 		}
 		let t = new AbortController();
 		async function n() {
-			k(!0);
+			A(!0);
 			try {
-				let n = /^\d+$/.test(e) ? `https://openplzapi.org/ch/Localities?postalCode=${e}` : `https://openplzapi.org/ch/Localities?locality=${encodeURIComponent(e)}`, r = await fetch(n, { signal: t.signal });
-				if (!r.ok) throw Error("Postal-Code-Suche fehlgeschlagen");
-				let i = await r.json();
-				E(Array.from(new Map(i.map((e) => {
+				let n = e.match(/^(\d+)\s/), r = n ? n[1] : e, i = /^\d+$/.test(r) ? `https://openplzapi.org/ch/Localities?postalCode=${r}` : `https://openplzapi.org/ch/Localities?locality=${encodeURIComponent(r)}`, a = await fetch(i, { signal: t.signal });
+				if (!a.ok) throw Error("Postal-Code-Suche fehlgeschlagen");
+				let o = await a.json();
+				D(Array.from(new Map(o.map((e) => {
 					let t = `${e.postalCode} ${e.name}`;
 					return [t, {
 						label: t,
 						postalCode: e.postalCode,
 						locality: e.name
 					}];
-				})).values()).slice(0, 10)), j(!0);
+				})).values()).slice(0, 10)), M(!0);
 			} catch (e) {
 				if (t.signal.aborted) return;
-				console.error(e), E([]), j(!0);
+				console.error(e), D([]), M(!0);
 			} finally {
-				t.signal.aborted || k(!1);
+				t.signal.aborted || A(!1);
 			}
 		}
 		let r = window.setTimeout(n, 300);
 		return () => {
 			window.clearTimeout(r), t.abort();
 		};
-	}, [C]);
-	function I(e) {
+	}, [w]);
+	function H(e) {
 		S.current = e, typeof m == "function" ? m(e) : m && (m.current = e);
 	}
-	function L(e) {
+	function U(e) {
 		let t = e.target.value;
-		w(t), _?.(t), h?.(e);
+		T(t), _?.(t), h?.(e);
 	}
-	function R(e) {
-		w(e.label), E([]), _?.(e.label), v?.(e), S.current && (S.current.value = e.label, S.current.dispatchEvent(new Event("input", { bubbles: !0 })));
+	function W(e) {
+		C.current = !0, T(e.label), D([]), M(!1), _?.(e.label), v?.(e), S.current && (S.current.value = e.label, S.current.dispatchEvent(new Event("input", { bubbles: !0 })));
 	}
 	return /* @__PURE__ */ n("div", {
 		className: O.inputBlockVertical,
@@ -477,57 +502,58 @@ function k({ label: e, name: a, id: c, error: l, variant: u = "default", classNa
 					/* @__PURE__ */ t("input", {
 						id: x,
 						name: a,
-						ref: I,
+						ref: H,
 						type: "text",
 						inputMode: "search",
 						autoComplete: "postal-code",
 						disabled: f,
 						placeholder: p,
-						value: C,
-						onChange: L,
+						value: w,
+						onChange: U,
 						onBlur: g,
 						className: [
 							O.inputTextField,
 							u === "glassy" ? O.inputTextFieldGlassy : "",
-							P ? O.inputValid : "",
-							F || l ? O.inputError : "",
+							B || L ? O.inputValid : "",
+							V || l ? O.inputError : "",
 							d ?? ""
 						].filter(Boolean).join(" "),
-						"aria-invalid": !!l || F,
+						"aria-invalid": !!l || V,
 						"aria-describedby": l ? `${a}-error` : void 0,
 						...y
 					}),
-					D && /* @__PURE__ */ t("span", {
+					k && /* @__PURE__ */ t("span", {
 						className: O.loading,
 						children: "Lädt…"
 					}),
-					T.length > 0 && /* @__PURE__ */ t("ul", {
+					E.length > 0 && /* @__PURE__ */ t("ul", {
 						className: O.suggestionList,
-						children: T.map((e) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ n("button", {
+						children: E.map((e) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ n("button", {
 							type: "button",
 							className: O.suggestionItem,
 							onMouseDown: (e) => e.preventDefault(),
-							onClick: () => R(e),
-							children: [/* @__PURE__ */ t("span", {
-								className: O.postalCode,
-								children: e.postalCode
-							}), /* @__PURE__ */ t("span", {
+							onClick: () => W(e),
+							children: [/* @__PURE__ */ t("span", { children: e.postalCode }), /* @__PURE__ */ t("span", {
 								className: O.locality,
 								children: e.locality
 							})]
 						}) }, e.label))
 					}),
-					A && C.trim().length >= 2 && T.length === 0 && !D && /* @__PURE__ */ t("div", {
+					j && w.trim().length >= 2 && E.length === 0 && !k && !L && !V && /* @__PURE__ */ t("div", {
 						className: O.emptyState,
 						children: "Keine Schweizer PLZ oder Ortschaft gefunden."
 					})
 				]
 			}),
-			P && /* @__PURE__ */ t("span", {
+			B && /* @__PURE__ */ t("span", {
+				className: O.successMessage,
+				children: "Gültige Schweizer Postleitzahl"
+			}),
+			L && /* @__PURE__ */ t("span", {
 				className: O.successMessage,
 				children: "Gültige Schweizer Postleitzahl"
 			}),
-			F && /* @__PURE__ */ t("span", {
+			V && /* @__PURE__ */ t("span", {
 				className: O.errorMessage,
 				children: "Diese Schweizer Postleitzahl wurde nicht gefunden."
 			}),
@@ -540,20 +566,21 @@ function k({ label: e, name: a, id: c, error: l, variant: u = "default", classNa
 	});
 }
 var A = {
-	radioGroup: "_radioGroup_tmet2_1",
-	radioGroupGlassy: "_radioGroupGlassy_tmet2_11",
-	radioLabel: "_radioLabel_tmet2_15",
-	radioLabelGlassy: "_radioLabelGlassy_tmet2_20",
-	optionGroup: "_optionGroup_tmet2_24",
-	optionWrapper: "_optionWrapper_tmet2_31",
-	optionWrapperDisabled: "_optionWrapperDisabled_tmet2_37",
-	radioInput: "_radioInput_tmet2_41",
-	optionButton: "_optionButton_tmet2_53",
-	optionTitle: "_optionTitle_tmet2_77",
-	optionDescription: "_optionDescription_tmet2_83",
-	optionButtonError: "_optionButtonError_tmet2_117",
-	optionButtonGlassy: "_optionButtonGlassy_tmet2_122",
-	errorMessage: "_errorMessage_tmet2_144"
+	radioGroup: "_radioGroup_cqfjf_1",
+	radioGroupGlassy: "_radioGroupGlassy_cqfjf_11",
+	radioLabel: "_radioLabel_cqfjf_15",
+	radioLabelGlassy: "_radioLabelGlassy_cqfjf_20",
+	optionGroup: "_optionGroup_cqfjf_24",
+	optionWrapper: "_optionWrapper_cqfjf_31",
+	optionWrapperDisabled: "_optionWrapperDisabled_cqfjf_37",
+	radioInput: "_radioInput_cqfjf_41",
+	optionButton: "_optionButton_cqfjf_58",
+	optionTitle: "_optionTitle_cqfjf_81",
+	optionDescription: "_optionDescription_cqfjf_87",
+	optionButtonDefault: "_optionButtonDefault_cqfjf_95",
+	optionButtonGlassy: "_optionButtonGlassy_cqfjf_120",
+	optionButtonError: "_optionButtonError_cqfjf_165",
+	errorMessage: "_errorMessage_cqfjf_169"
 };
 //#endregion
 //#region src/components/form/radiobutton/RadioButton.tsx
@@ -590,7 +617,7 @@ function j({ label: e, name: r, options: i, error: a, variant: o = "default", cl
 						}), /* @__PURE__ */ n("span", {
 							className: [
 								A.optionButton,
-								o === "glassy" ? A.optionButtonGlassy : "",
+								o === "glassy" ? A.optionButtonGlassy : A.optionButtonDefault,
 								a ? A.optionButtonError : ""
 							].filter(Boolean).join(" "),
 							children: [/* @__PURE__ */ t("span", {
@@ -613,16 +640,19 @@ function j({ label: e, name: r, options: i, error: a, variant: o = "default", cl
 	});
 }
 var M = {
-	switchWrapper: "_switchWrapper_f34wd_1",
-	switchCheckbox: "_switchCheckbox_f34wd_7",
-	switchLabel: "_switchLabel_f34wd_15",
-	switchLabelGlassy: "_switchLabelGlassy_f34wd_24",
-	switchBackground: "_switchBackground_f34wd_28",
-	switchButton: "_switchButton_f34wd_42",
-	iconChecked: "_iconChecked_f34wd_86",
-	iconUnchecked: "_iconUnchecked_f34wd_87",
-	switchText: "_switchText_f34wd_119",
-	errorMessage: "_errorMessage_f34wd_129"
+	switchWrapper: "_switchWrapper_14rch_1",
+	switchCheckbox: "_switchCheckbox_14rch_7",
+	switchLabel: "_switchLabel_14rch_15",
+	switchLabelDefault: "_switchLabelDefault_14rch_24",
+	switchLabelGlassy: "_switchLabelGlassy_14rch_28",
+	switchBackground: "_switchBackground_14rch_37",
+	switchBackgroundDefault: "_switchBackgroundDefault_14rch_56",
+	switchBackgroundGlassy: "_switchBackgroundGlassy_14rch_66",
+	switchButton: "_switchButton_14rch_77",
+	iconChecked: "_iconChecked_14rch_163",
+	iconUnchecked: "_iconUnchecked_14rch_164",
+	switchText: "_switchText_14rch_200",
+	errorMessage: "_errorMessage_14rch_206"
 };
 //#endregion
 //#region src/components/form/switch/Switch.tsx
@@ -643,9 +673,9 @@ function N({ name: e, id: r, label: i, error: a, variant: o = "default", classNa
 			}),
 			/* @__PURE__ */ n("label", {
 				htmlFor: u,
-				className: [M.switchLabel, o === "glassy" ? M.switchLabelGlassy : ""].filter(Boolean).join(" "),
+				className: [M.switchLabel, o === "glassy" ? M.switchLabelGlassy : M.switchLabelDefault].filter(Boolean).join(" "),
 				children: [/* @__PURE__ */ t("span", {
-					className: M.switchBackground,
+					className: [M.switchBackground, o === "glassy" ? M.switchBackgroundGlassy : M.switchBackgroundDefault].filter(Boolean).join(" "),
 					children: /* @__PURE__ */ n("span", {
 						className: M.switchButton,
 						"aria-hidden": "true",

package/dist/suus-component-library.umd.cjs

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react/jsx-runtime`),require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react/jsx-runtime`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`SUUS Component Library`]={},e.jsxRuntime,e.React))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r={suusButton:`_suusButton_1q9to_1`,icon:`_icon_1q9to_45`,label:`_label_1q9to_62`,primary:`_primary_1q9to_69`,secondary:`_secondary_1q9to_113`,loading:`_loading_1q9to_169`,loader:`_loader_1q9to_173`,"btn-spin":`_btn-spin_1q9to_1`,loaderSecondary:`_loaderSecondary_1q9to_182`};function i({label:e,onClick:n,type:i=`button`,disabled:a=!1,loading:o=!1,variant:s=`primary`,colorToken:c=`--colors-juice-sugarcane`,icon:l,...u}){return(0,t.jsx)(`button`,{type:i,onClick:n,disabled:a||o,style:{"--button-background-color":`var(${c})`},className:[r.suusButton,r[s],o?r.loading:``].filter(Boolean).join(` `),"aria-busy":o,...u,children:o?(0,t.jsx)(`span`,{className:`${r.loader} ${s===`primary`?``:r.loaderSecondary}`,"aria-hidden":`true`}):(0,t.jsxs)(t.Fragment,{children:[l?(0,t.jsx)(`span`,{className:r.icon,children:l}):null,(0,t.jsx)(`span`,{className:r.label,children:e})]})})}var a={checkboxWrapper:`_checkboxWrapper_137qc_1`,checkboxInput:`_checkboxInput_137qc_15`,checkboxLabel:`_checkboxLabel_137qc_24`,customCheckbox:`_customCheckbox_137qc_34`,checkIcon:`_checkIcon_137qc_57`,checkboxText:`_checkboxText_137qc_76`,checkboxWrapperDisabled:`_checkboxWrapperDisabled_137qc_107`,checkboxWrapperError:`_checkboxWrapperError_137qc_133`,errorMessage:`_errorMessage_137qc_147`,checkboxWrapperGlassy:`_checkboxWrapperGlassy_137qc_157`};function o({label:e,name:n,id:r,error:i,variant:o=`default`,className:s,disabled:c,...l}){let u=r??`${n}-checkbox`;return(0,t.jsxs)(`div`,{className:[a.checkboxWrapper,o===`glassy`?a.checkboxWrapperGlassy:``,i?a.checkboxWrapperError:``,c?a.checkboxWrapperDisabled:``,s??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{type:`checkbox`,id:u,name:n,disabled:c,className:a.checkboxInput,"aria-invalid":!!i,"aria-describedby":i?`${n}-error`:void 0,...l}),(0,t.jsxs)(`label`,{htmlFor:u,className:a.checkboxLabel,children:[(0,t.jsx)(`span`,{className:a.customCheckbox,"aria-hidden":`true`,children:(0,t.jsx)(`svg`,{className:a.checkIcon,viewBox:`0 0 24 24`,focusable:`false`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M20 6L9 17L4 12`})})}),(0,t.jsx)(`span`,{className:a.checkboxText,children:e})]}),i&&(0,t.jsx)(`span`,{id:`${n}-error`,className:a.errorMessage,children:i})]})}var s={chip:`_chip_9t0x4_1`,chipGlassy:`_chipGlassy_9t0x4_19`};function c({children:e,variant:n=`default`,className:r,...i}){return(0,t.jsx)(`span`,{className:[s.chip,n===`glassy`?s.chipGlassy:``,r??``].filter(Boolean).join(` `),...i,children:e})}var l={inputBlockVertical:`_inputBlockVertical_1vqyb_1`,inputLabel:`_inputLabel_1vqyb_7`,inputLabelGlassy:`_inputLabelGlassy_1vqyb_13`,dateInputWrapper:`_dateInputWrapper_1vqyb_17`,inputDateField:`_inputDateField_1vqyb_22`,inputDateFieldGlassy:`_inputDateFieldGlassy_1vqyb_54`,inputError:`_inputError_1vqyb_72`,calendarIconButton:`_calendarIconButton_1vqyb_76`,icon:`_icon_1vqyb_104`,errorMessage:`_errorMessage_1vqyb_113`};function u({label:e,name:r,id:i,value:a=null,maxDate:o,minDate:s,error:c,variant:u=`default`,className:m,ref:h,onDateChange:g,onBlur:_,disabled:v,...y}){let b=i??r,x=(0,n.useRef)(null),S=o??new Date;function C(e){x.current=e,typeof h==`function`?h(e):h&&(h.current=e)}function w(e){let t=e.target.value;if(!t){g?.(null);return}g?.(f(t))}function T(){v||(x.current?.showPicker?.(),x.current?.focus())}return(0,t.jsxs)(`div`,{className:l.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:b,className:[l.inputLabel,u===`glassy`?l.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:l.dateInputWrapper,children:[(0,t.jsx)(`input`,{id:b,name:r,ref:C,type:`date`,value:d(a),max:d(S),min:s?d(s):void 0,disabled:v,onChange:w,onBlur:_,className:[l.inputDateField,u===`glassy`?l.inputDateFieldGlassy:``,c?l.inputError:``,m??``].filter(Boolean).join(` `),"aria-invalid":!!c,"aria-describedby":c?`${r}-error`:void 0,...y}),(0,t.jsx)(`button`,{type:`button`,className:l.calendarIconButton,onClick:T,disabled:v,"aria-label":`Datum auswählen`,tabIndex:-1,children:(0,t.jsx)(p,{})})]}),c&&(0,t.jsx)(`span`,{id:`${r}-error`,className:l.errorMessage,children:c})]})}function d(e){return e?`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,`0`)}-${String(e.getDate()).padStart(2,`0`)}`:``}function f(e){let[t,n,r]=e.split(`-`).map(Number);return new Date(t,n-1,r)}function p(){return(0,t.jsxs)(`svg`,{className:l.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M8 2V5`}),(0,t.jsx)(`path`,{d:`M16 2V5`}),(0,t.jsx)(`path`,{d:`M3.5 9.09H20.5`}),(0,t.jsx)(`path`,{d:`M21 8.5V17.5C21 20 19.75 21.5 16.75 21.5H7.25C4.25 21.5 3 20 3 17.5V8.5C3 6 4.25 4.5 7.25 4.5H16.75C19.75 4.5 21 6 21 8.5Z`})]})}var m={inputBlockVertical:`_inputBlockVertical_1eq2l_1`,inputLabel:`_inputLabel_1eq2l_7`,inputLabelGlassy:`_inputLabelGlassy_1eq2l_13`,inputSelectField:`_inputSelectField_1eq2l_17`,inputSelectFieldGlassy:`_inputSelectFieldGlassy_1eq2l_27`,inputError:`_inputError_1eq2l_40`,errorMessage:`_errorMessage_1eq2l_44`};function h({label:e,name:n,options:r,placeholder:i,error:a,variant:o=`default`,className:s,disabled:c,...l}){return(0,t.jsxs)(`div`,{className:m.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:n,className:[m.inputLabel,o===`glassy`?m.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`select`,{id:n,name:n,disabled:c,className:[m.inputSelectField,o===`glassy`?m.inputSelectFieldGlassy:``,a?m.inputError:``,s??``].filter(Boolean).join(` `),"aria-invalid":!!a,"aria-describedby":a?`${n}-error`:void 0,...l,children:[i&&(0,t.jsx)(`option`,{value:``,disabled:!0,children:i}),r.map(e=>(0,t.jsx)(`option`,{value:e.value,children:e.label},e.value))]}),a&&(0,t.jsx)(`span`,{id:`${n}-error`,className:m.errorMessage,children:a})]})}var g={appLink:`_appLink_18ja7_1`,appLinkGlassy:`_appLinkGlassy_18ja7_27`,label:`_label_18ja7_35`,icon:`_icon_18ja7_40`,arrowIcon:`_arrowIcon_18ja7_51`};function _({children:e,href:n,onClick:r,newTab:i=!1,showArrow:a=!0,variant:o=`default`,className:s,...c}){function l(e){n||e.preventDefault(),r?.(e)}return(0,t.jsxs)(`a`,{href:n??`#`,onClick:l,target:n&&i?`_blank`:void 0,rel:n&&i?`noopener noreferrer`:void 0,className:[g.appLink,o===`glassy`?g.appLinkGlassy:``,s??``].filter(Boolean).join(` `),...c,children:[(0,t.jsx)(`span`,{className:g.label,children:e}),a&&(0,t.jsx)(`span`,{className:g.icon,"aria-hidden":`true`,children:(0,t.jsx)(v,{})})]})}function v(){return(0,t.jsxs)(`svg`,{className:g.arrowIcon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M5 12H19`}),(0,t.jsx)(`path`,{d:`M13 6L19 12L13 18`})]})}var y={inputBlockVertical:`_inputBlockVertical_1x5ym_1`,inputLabel:`_inputLabel_1x5ym_7`,inputLabelGlassy:`_inputLabelGlassy_1x5ym_13`,passwordInputWrapper:`_passwordInputWrapper_1x5ym_17`,inputTextField:`_inputTextField_1x5ym_22`,inputTextFieldGlassy:`_inputTextFieldGlassy_1x5ym_34`,inputError:`_inputError_1x5ym_52`,togglePasswordButton:`_togglePasswordButton_1x5ym_56`,icon:`_icon_1x5ym_88`,errorMessage:`_errorMessage_1x5ym_97`};function b({label:e,name:r,id:i,error:a,variant:o=`default`,colorToken:s=`--colors-juice-sugarcane`,className:c,disabled:l,ref:u,autoComplete:d=`current-password`,...f}){let[p,m]=(0,n.useState)(!1),h=i??r,g={"--password-accent-color":`var(${s})`};function _(){m(e=>!e)}return(0,t.jsxs)(`div`,{className:y.inputBlockVertical,style:g,children:[e&&(0,t.jsx)(`label`,{htmlFor:h,className:[y.inputLabel,o===`glassy`?y.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:y.passwordInputWrapper,children:[(0,t.jsx)(`input`,{id:h,name:r,ref:u,type:p?`text`:`password`,disabled:l,autoComplete:d,className:[y.inputTextField,o===`glassy`?y.inputTextFieldGlassy:``,a?y.inputError:``,c??``].filter(Boolean).join(` `),"aria-invalid":!!a,"aria-describedby":a?`${r}-error`:void 0,...f}),(0,t.jsx)(`button`,{type:`button`,className:y.togglePasswordButton,onClick:_,disabled:l,"aria-label":p?`Passwort ausblenden`:`Passwort anzeigen`,"aria-pressed":p,children:p?(0,t.jsx)(S,{}):(0,t.jsx)(x,{})})]}),a&&(0,t.jsx)(`span`,{id:`${r}-error`,className:y.errorMessage,children:a})]})}function x(){return(0,t.jsxs)(`svg`,{className:y.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z`}),(0,t.jsx)(`circle`,{cx:`12`,cy:`12`,r:`3`})]})}function S(){return(0,t.jsx)(`svg`,{className:y.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M17.94 17.94A10.94 10.94 0 0 1 12 20C7 20 2.73 16.11 1 12c.74-1.64 1.82-3.06 3.11-4.24m3.52-2.42A10.94 10.94 0 0 1 12 4c5 0 9.27 3.89 11 8-1.1 2.42-2.91 4.5-5.06 5.94M1 1l22 22`})})}var C={inputBlockVertical:`_inputBlockVertical_n4fz9_1`,inputLabel:`_inputLabel_n4fz9_7`,inputLabelGlassy:`_inputLabelGlassy_n4fz9_13`,inputWrapper:`_inputWrapper_n4fz9_17`,inputTextField:`_inputTextField_n4fz9_22`,inputTextFieldGlassy:`_inputTextFieldGlassy_n4fz9_34`,inputValid:`_inputValid_n4fz9_60`,inputError:`_inputError_n4fz9_64`,loading:`_loading_n4fz9_68`,suggestionList:`_suggestionList_n4fz9_77`,suggestionItem:`_suggestionItem_n4fz9_94`,postalCode:`_postalCode_n4fz9_114`,locality:`_locality_n4fz9_119`,emptyState:`_emptyState_n4fz9_123`,successMessage:`_successMessage_n4fz9_138`,errorMessage:`_errorMessage_n4fz9_144`};function w({label:e,name:r,id:i,error:a,variant:o=`default`,className:s,disabled:c,placeholder:l=`z.B. 8001 oder Zürich`,ref:u,onChange:d,onBlur:f,onValueChange:p,onSuggestionSelect:m,...h}){let g=(0,n.useId)(),_=i??`${r}-${g}`,v=(0,n.useRef)(null),[y,b]=(0,n.useState)(``),[x,S]=(0,n.useState)([]),[w,T]=(0,n.useState)(!1),[E,D]=(0,n.useState)(!1),O=/^\d+$/.test(y.trim()),k=y.trim().length>=4&&O&&!w,A=k&&x.some(e=>e.postalCode===y.trim()),j=k&&!A;(0,n.useEffect)(()=>{let e=y.trim();if(e.length<2){S([]),D(!1);return}let t=new AbortController;async function n(){T(!0);try{let n=/^\d+$/.test(e)?`https://openplzapi.org/ch/Localities?postalCode=${e}`:`https://openplzapi.org/ch/Localities?locality=${encodeURIComponent(e)}`,r=await fetch(n,{signal:t.signal});if(!r.ok)throw Error(`Postal-Code-Suche fehlgeschlagen`);let i=await r.json();S(Array.from(new Map(i.map(e=>{let t=`${e.postalCode} ${e.name}`;return[t,{label:t,postalCode:e.postalCode,locality:e.name}]})).values()).slice(0,10)),D(!0)}catch(e){if(t.signal.aborted)return;console.error(e),S([]),D(!0)}finally{t.signal.aborted||T(!1)}}let r=window.setTimeout(n,300);return()=>{window.clearTimeout(r),t.abort()}},[y]);function M(e){v.current=e,typeof u==`function`?u(e):u&&(u.current=e)}function N(e){let t=e.target.value;b(t),p?.(t),d?.(e)}function P(e){b(e.label),S([]),p?.(e.label),m?.(e),v.current&&(v.current.value=e.label,v.current.dispatchEvent(new Event(`input`,{bubbles:!0})))}return(0,t.jsxs)(`div`,{className:C.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:_,className:[C.inputLabel,o===`glassy`?C.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:C.inputWrapper,children:[(0,t.jsx)(`input`,{id:_,name:r,ref:M,type:`text`,inputMode:`search`,autoComplete:`postal-code`,disabled:c,placeholder:l,value:y,onChange:N,onBlur:f,className:[C.inputTextField,o===`glassy`?C.inputTextFieldGlassy:``,A?C.inputValid:``,j||a?C.inputError:``,s??``].filter(Boolean).join(` `),"aria-invalid":!!a||j,"aria-describedby":a?`${r}-error`:void 0,...h}),w&&(0,t.jsx)(`span`,{className:C.loading,children:`Lädt…`}),x.length>0&&(0,t.jsx)(`ul`,{className:C.suggestionList,children:x.map(e=>(0,t.jsx)(`li`,{children:(0,t.jsxs)(`button`,{type:`button`,className:C.suggestionItem,onMouseDown:e=>e.preventDefault(),onClick:()=>P(e),children:[(0,t.jsx)(`span`,{className:C.postalCode,children:e.postalCode}),(0,t.jsx)(`span`,{className:C.locality,children:e.locality})]})},e.label))}),E&&y.trim().length>=2&&x.length===0&&!w&&(0,t.jsx)(`div`,{className:C.emptyState,children:`Keine Schweizer PLZ oder Ortschaft gefunden.`})]}),A&&(0,t.jsx)(`span`,{className:C.successMessage,children:`Gültige Schweizer Postleitzahl`}),j&&(0,t.jsx)(`span`,{className:C.errorMessage,children:`Diese Schweizer Postleitzahl wurde nicht gefunden.`}),a&&(0,t.jsx)(`span`,{id:`${r}-error`,className:C.errorMessage,children:a})]})}var T={radioGroup:`_radioGroup_tmet2_1`,radioGroupGlassy:`_radioGroupGlassy_tmet2_11`,radioLabel:`_radioLabel_tmet2_15`,radioLabelGlassy:`_radioLabelGlassy_tmet2_20`,optionGroup:`_optionGroup_tmet2_24`,optionWrapper:`_optionWrapper_tmet2_31`,optionWrapperDisabled:`_optionWrapperDisabled_tmet2_37`,radioInput:`_radioInput_tmet2_41`,optionButton:`_optionButton_tmet2_53`,optionTitle:`_optionTitle_tmet2_77`,optionDescription:`_optionDescription_tmet2_83`,optionButtonError:`_optionButtonError_tmet2_117`,optionButtonGlassy:`_optionButtonGlassy_tmet2_122`,errorMessage:`_errorMessage_tmet2_144`};function E({label:e,name:n,options:r,error:i,variant:a=`default`,className:o,disabled:s,value:c,defaultValue:l,onChange:u,...d}){let f=c!==void 0;return(0,t.jsxs)(`fieldset`,{className:[T.radioGroup,a===`glassy`?T.radioGroupGlassy:``,o??``].filter(Boolean).join(` `),"aria-invalid":!!i,"aria-describedby":i?`${n}-error`:void 0,children:[e&&(0,t.jsx)(`legend`,{className:[T.radioLabel,a===`glassy`?T.radioLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsx)(`div`,{className:T.optionGroup,children:r.map(e=>{let r=f?{checked:c===e.value}:{defaultChecked:l===e.value};return(0,t.jsxs)(`label`,{className:[T.optionWrapper,s?T.optionWrapperDisabled:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{type:`radio`,name:n,value:e.value,disabled:s,className:T.radioInput,onChange:u,...r,...d}),(0,t.jsxs)(`span`,{className:[T.optionButton,a===`glassy`?T.optionButtonGlassy:``,i?T.optionButtonError:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`span`,{className:T.optionTitle,children:e.label}),e.description&&(0,t.jsx)(`span`,{className:T.optionDescription,children:e.description})]})]},e.value)})}),i&&(0,t.jsx)(`span`,{id:`${n}-error`,className:T.errorMessage,children:i})]})}var D={switchWrapper:`_switchWrapper_f34wd_1`,switchCheckbox:`_switchCheckbox_f34wd_7`,switchLabel:`_switchLabel_f34wd_15`,switchLabelGlassy:`_switchLabelGlassy_f34wd_24`,switchBackground:`_switchBackground_f34wd_28`,switchButton:`_switchButton_f34wd_42`,iconChecked:`_iconChecked_f34wd_86`,iconUnchecked:`_iconUnchecked_f34wd_87`,switchText:`_switchText_f34wd_119`,errorMessage:`_errorMessage_f34wd_129`};function O({name:e,id:n,label:r,error:i,variant:a=`default`,className:o,disabled:s,...c}){let l=n??`${e}-switch`;return(0,t.jsxs)(`div`,{className:[D.switchWrapper,o??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{id:l,name:e,type:`checkbox`,disabled:s,className:D.switchCheckbox,"aria-invalid":!!i,"aria-describedby":i?`${e}-error`:void 0,...c}),(0,t.jsxs)(`label`,{htmlFor:l,className:[D.switchLabel,a===`glassy`?D.switchLabelGlassy:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`span`,{className:D.switchBackground,children:(0,t.jsxs)(`span`,{className:D.switchButton,"aria-hidden":`true`,children:[(0,t.jsx)(`span`,{className:D.iconChecked,children:(0,t.jsx)(k,{})}),(0,t.jsx)(`span`,{className:D.iconUnchecked,children:(0,t.jsx)(A,{})})]})}),r&&(0,t.jsx)(`span`,{className:D.switchText,children:r})]}),i&&(0,t.jsx)(`span`,{id:`${e}-error`,className:D.errorMessage,children:i})]})}function k(){return(0,t.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M3 6.5L5.5 9L9 3`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`})})}function A(){return(0,t.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M3 3L9 9M9 3L3 9`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`})})}var j={inputBlockVertical:`_inputBlockVertical_1khad_1`,inputLabel:`_inputLabel_1khad_8`,inputLabelGlassy:`_inputLabelGlassy_1khad_14`,inputTextField:`_inputTextField_1khad_20`,inputTextFieldGlassy:`_inputTextFieldGlassy_1khad_37`,inputError:`_inputError_1khad_59`,errorMessage:`_errorMessage_1khad_63`};function M({label:e,name:n,error:r,placeholder:i,variant:a=`default`,className:o,ref:s,...c}){return(0,t.jsxs)(`div`,{className:j.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:n,className:[j.inputLabel,a===`glassy`?j.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsx)(`input`,{id:n,name:n,ref:s,placeholder:i,className:[j.inputTextField,a===`glassy`?j.inputTextFieldGlassy:``,r?j.inputError:``,o??``].filter(Boolean).join(` `),"aria-invalid":!!r,"aria-describedby":r?`${n}-error`:void 0,...c}),r&&(0,t.jsx)(`span`,{id:`${n}-error`,className:j.errorMessage,children:r})]})}var N={wrapper:`_wrapper_1jqlw_1`,label:`_label_1jqlw_7`,labelGlassy:`_labelGlassy_1jqlw_13`,dropzone:`_dropzone_1jqlw_17`,dropzoneGlassy:`_dropzoneGlassy_1jqlw_32`,dragOver:`_dragOver_1jqlw_39`,errorState:`_errorState_1jqlw_48`,disabled:`_disabled_1jqlw_52`,hiddenInput:`_hiddenInput_1jqlw_57`,dropzoneContent:`_dropzoneContent_1jqlw_65`,placeholder:`_placeholder_1jqlw_74`,big:`_big_1jqlw_80`,small:`_small_1jqlw_86`,hint:`_hint_1jqlw_91`,selected:`_selected_1jqlw_111`,preview:`_preview_1jqlw_118`,fileMeta:`_fileMeta_1jqlw_127`,fileName:`_fileName_1jqlw_134`,fileSize:`_fileSize_1jqlw_142`,remove:`_remove_1jqlw_156`,errorMessage:`_errorMessage_1jqlw_198`};function P({label:e,name:r,id:i,file:a,error:o,variant:s=`default`,accept:c=`image/*`,maxSizeBytes:l=5*1024*1024,disabled:u,className:d,onChange:f,onFileChange:p,...m}){let h=(0,n.useId)(),g=i??`${r}-${h}`,[_,v]=(0,n.useState)(!1),[y,b]=(0,n.useState)(a??null),x=a!==void 0,S=x?a:y,C=(0,n.useMemo)(()=>!S||!S.type.startsWith(`image/`)?null:URL.createObjectURL(S),[S]);(0,n.useEffect)(()=>{x&&b(a??null)},[a,x]),(0,n.useEffect)(()=>()=>{C&&URL.revokeObjectURL(C)},[C]);function w(e){return!e||(c===`image/*`||c.startsWith(`image/`))&&!e.type.startsWith(`image/`)||l&&e.size>l?null:e}function T(e){let t=w(e);x||b(t),p?.(t)}function E(e){T(e.target.files?.[0]??null),f?.(e)}function D(e){e.preventDefault(),e.stopPropagation(),u||v(!0)}function O(e){e.preventDefault(),e.stopPropagation(),!e.currentTarget.contains(e.relatedTarget)&&v(!1)}function k(e){e.preventDefault(),e.stopPropagation(),v(!1),!u&&T(e.dataTransfer.files?.[0]??null)}function A(){x||b(null),p?.(null)}let j=Math.round(l/(1024*1024));return(0,t.jsxs)(`div`,{className:[N.wrapper,d??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`label`,{className:[N.label,s===`glassy`?N.labelGlassy:``].filter(Boolean).join(` `),htmlFor:g,children:e}),(0,t.jsxs)(`div`,{className:[N.dropzone,s===`glassy`?N.dropzoneGlassy:``,_?N.dragOver:``,o?N.errorState:``,u?N.disabled:``].filter(Boolean).join(` `),onDragOver:D,onDragLeave:O,onDrop:k,children:[(0,t.jsx)(`input`,{id:g,name:r,className:N.hiddenInput,type:`file`,accept:c,disabled:u,onChange:E,"aria-invalid":!!o,"aria-describedby":o?`${r}-error`:void 0,...m}),(0,t.jsx)(`label`,{htmlFor:g,className:N.dropzoneContent,children:S?(0,t.jsxs)(`span`,{className:N.selected,children:[C&&(0,t.jsx)(`img`,{className:N.preview,src:C,alt:`Vorschau von ${S.name}`}),(0,t.jsxs)(`span`,{className:N.fileMeta,children:[(0,t.jsx)(`span`,{className:N.fileName,children:S.name}),(0,t.jsxs)(`span`,{className:N.fileSize,children:[(S.size/1024).toFixed(0),` KB ·`,` `,S.type||`unknown`]})]})]}):(0,t.jsxs)(`span`,{className:N.placeholder,children:[(0,t.jsx)(`span`,{className:N.big,children:`Datei hier reinziehen`}),(0,t.jsx)(`span`,{className:N.small,children:`…oder klicken, um auszuwählen`}),(0,t.jsxs)(`span`,{className:N.hint,children:[`Erlaubt: `,c,` · max. `,j,` MB`]})]})}),S&&(0,t.jsx)(`button`,{type:`button`,className:N.remove,onClick:A,disabled:u,children:`Entfernen`})]}),o&&(0,t.jsx)(`span`,{id:`${r}-error`,className:N.errorMessage,children:o})]})}e.Button=i,e.Checkbox=o,e.Chip=c,e.DatePicker=u,e.Dropdown=h,e.Link=_,e.Password=b,e.PostalCode=w,e.RadioButton=E,e.Switch=O,e.TextField=M,e.Upload=P});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react/jsx-runtime`),require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react/jsx-runtime`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`SUUS Component Library`]={},e.jsxRuntime,e.React))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r={suusButton:`_suusButton_1ucmz_1`,icon:`_icon_1ucmz_45`,label:`_label_1ucmz_62`,primary:`_primary_1ucmz_69`,secondary:`_secondary_1ucmz_113`,loading:`_loading_1ucmz_169`,loader:`_loader_1ucmz_173`,"btn-spin":`_btn-spin_1ucmz_1`,loaderSecondary:`_loaderSecondary_1ucmz_182`};function i({label:e,onClick:n,type:i=`button`,disabled:a=!1,loading:o=!1,variant:s=`primary`,colorToken:c=`--color-juice-sugarcane`,icon:l,...u}){return(0,t.jsx)(`button`,{type:i,onClick:n,disabled:a||o,style:{"--button-background-color":`var(${c})`},className:[r.suusButton,r[s],o?r.loading:``].filter(Boolean).join(` `),"aria-busy":o,...u,children:o?(0,t.jsx)(`span`,{className:`${r.loader} ${s===`primary`?``:r.loaderSecondary}`,"aria-hidden":`true`}):(0,t.jsxs)(t.Fragment,{children:[l?(0,t.jsx)(`span`,{className:r.icon,children:l}):null,(0,t.jsx)(`span`,{className:r.label,children:e})]})})}var a={checkboxWrapper:`_checkboxWrapper_6w8h4_1`,checkboxInput:`_checkboxInput_6w8h4_15`,checkboxLabel:`_checkboxLabel_6w8h4_24`,customCheckbox:`_customCheckbox_6w8h4_34`,checkIcon:`_checkIcon_6w8h4_57`,checkboxText:`_checkboxText_6w8h4_76`,checkboxWrapperDisabled:`_checkboxWrapperDisabled_6w8h4_107`,checkboxWrapperError:`_checkboxWrapperError_6w8h4_133`,errorMessage:`_errorMessage_6w8h4_147`,checkboxWrapperGlassy:`_checkboxWrapperGlassy_6w8h4_154`};function o({label:e,name:n,id:r,error:i,variant:o=`default`,className:s,disabled:c,...l}){let u=r??`${n}-checkbox`;return(0,t.jsxs)(`div`,{className:[a.checkboxWrapper,o===`glassy`?a.checkboxWrapperGlassy:``,i?a.checkboxWrapperError:``,c?a.checkboxWrapperDisabled:``,s??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{type:`checkbox`,id:u,name:n,disabled:c,className:a.checkboxInput,"aria-invalid":!!i,"aria-describedby":i?`${n}-error`:void 0,...l}),(0,t.jsxs)(`label`,{htmlFor:u,className:a.checkboxLabel,children:[(0,t.jsx)(`span`,{className:a.customCheckbox,"aria-hidden":`true`,children:(0,t.jsx)(`svg`,{className:a.checkIcon,viewBox:`0 0 24 24`,focusable:`false`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M20 6L9 17L4 12`})})}),(0,t.jsx)(`span`,{className:a.checkboxText,children:e})]}),i&&(0,t.jsx)(`span`,{id:`${n}-error`,className:a.errorMessage,children:i})]})}var s={chip:`_chip_1kgh7_1`,chipDefault:`_chipDefault_1kgh7_21`,chipGlassy:`_chipGlassy_1kgh7_36`,chipChecked:`_chipChecked_1kgh7_49`,chipDisabled:`_chipDisabled_1kgh7_56`};function c({children:e,variant:r=`default`,clickable:i=!0,checked:a,defaultChecked:o=!1,onCheckedChange:c,className:l,...u}){let[d,f]=(0,n.useState)(o),p=typeof a==`boolean`,m=p?a:d;function h(e){if(!i)return;let t=!m;p||f(t),c?.(t),u.onClick?.(e)}let g=r===`glassy`?s.chipGlassy:s.chipDefault,_=m?s.chipChecked:``,v=i?``:s.chipDisabled;return i?(0,t.jsx)(`button`,{type:`button`,"aria-pressed":m,className:[s.chip,g,_,l??``].filter(Boolean).join(` `),onClick:h,...u,children:e}):(0,t.jsx)(`span`,{className:[s.chip,g,_,v,l??``].filter(Boolean).join(` `),children:e})}var l={inputBlockVertical:`_inputBlockVertical_1vqyb_1`,inputLabel:`_inputLabel_1vqyb_7`,inputLabelGlassy:`_inputLabelGlassy_1vqyb_13`,dateInputWrapper:`_dateInputWrapper_1vqyb_17`,inputDateField:`_inputDateField_1vqyb_22`,inputDateFieldGlassy:`_inputDateFieldGlassy_1vqyb_54`,inputError:`_inputError_1vqyb_72`,calendarIconButton:`_calendarIconButton_1vqyb_76`,icon:`_icon_1vqyb_104`,errorMessage:`_errorMessage_1vqyb_113`};function u({label:e,name:r,id:i,value:a=null,maxDate:o,minDate:s,error:c,variant:u=`default`,className:m,ref:h,onDateChange:g,onBlur:_,disabled:v,...y}){let b=i??r,x=(0,n.useRef)(null),S=o??new Date;function C(e){x.current=e,typeof h==`function`?h(e):h&&(h.current=e)}function w(e){let t=e.target.value;if(!t){g?.(null);return}g?.(f(t))}function T(){v||(x.current?.showPicker?.(),x.current?.focus())}return(0,t.jsxs)(`div`,{className:l.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:b,className:[l.inputLabel,u===`glassy`?l.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:l.dateInputWrapper,children:[(0,t.jsx)(`input`,{id:b,name:r,ref:C,type:`date`,value:d(a),max:d(S),min:s?d(s):void 0,disabled:v,onChange:w,onBlur:_,className:[l.inputDateField,u===`glassy`?l.inputDateFieldGlassy:``,c?l.inputError:``,m??``].filter(Boolean).join(` `),"aria-invalid":!!c,"aria-describedby":c?`${r}-error`:void 0,...y}),(0,t.jsx)(`button`,{type:`button`,className:l.calendarIconButton,onClick:T,disabled:v,"aria-label":`Datum auswählen`,tabIndex:-1,children:(0,t.jsx)(p,{})})]}),c&&(0,t.jsx)(`span`,{id:`${r}-error`,className:l.errorMessage,children:c})]})}function d(e){return e?`${e.getFullYear()}-${String(e.getMonth()+1).padStart(2,`0`)}-${String(e.getDate()).padStart(2,`0`)}`:``}function f(e){let[t,n,r]=e.split(`-`).map(Number);return new Date(t,n-1,r)}function p(){return(0,t.jsxs)(`svg`,{className:l.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M8 2V5`}),(0,t.jsx)(`path`,{d:`M16 2V5`}),(0,t.jsx)(`path`,{d:`M3.5 9.09H20.5`}),(0,t.jsx)(`path`,{d:`M21 8.5V17.5C21 20 19.75 21.5 16.75 21.5H7.25C4.25 21.5 3 20 3 17.5V8.5C3 6 4.25 4.5 7.25 4.5H16.75C19.75 4.5 21 6 21 8.5Z`})]})}var m={inputBlockVertical:`_inputBlockVertical_1yqyz_1`,inputLabel:`_inputLabel_1yqyz_7`,inputLabelGlassy:`_inputLabelGlassy_1yqyz_13`,inputSelectField:`_inputSelectField_1yqyz_17`,inputSelectFieldGlassy:`_inputSelectFieldGlassy_1yqyz_27`,inputError:`_inputError_1yqyz_40`,errorMessage:`_errorMessage_1yqyz_44`};function h({label:e,name:n,options:r,placeholder:i,error:a,variant:o=`default`,className:s,disabled:c,...l}){return(0,t.jsxs)(`div`,{className:m.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:n,className:[m.inputLabel,o===`glassy`?m.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`select`,{id:n,name:n,disabled:c,className:[m.inputSelectField,o===`glassy`?m.inputSelectFieldGlassy:``,a?m.inputError:``,s??``].filter(Boolean).join(` `),"aria-invalid":!!a,"aria-describedby":a?`${n}-error`:void 0,...l,children:[i&&(0,t.jsx)(`option`,{value:``,disabled:!0,children:i}),r.map(e=>(0,t.jsx)(`option`,{value:e.value,children:e.label},e.value))]}),a&&(0,t.jsx)(`span`,{id:`${n}-error`,className:m.errorMessage,children:a})]})}var g={appLink:`_appLink_b53rv_1`,appLinkDefault:`_appLinkDefault_b53rv_19`,appLinkGlassy:`_appLinkGlassy_b53rv_30`,label:`_label_b53rv_38`,icon:`_icon_b53rv_43`,arrowIcon:`_arrowIcon_b53rv_54`};function _({children:e,href:n,onClick:r,newTab:i=!1,showArrow:a=!0,variant:o=`default`,className:s,...c}){function l(e){n||e.preventDefault(),r?.(e)}return(0,t.jsxs)(`a`,{href:n??`#`,onClick:l,target:n&&i?`_blank`:void 0,rel:n&&i?`noopener noreferrer`:void 0,className:[g.appLink,o===`glassy`?g.appLinkGlassy:g.appLinkDefault,s??``].filter(Boolean).join(` `),...c,children:[(0,t.jsx)(`span`,{className:g.label,children:e}),a&&(0,t.jsx)(`span`,{className:g.icon,"aria-hidden":`true`,children:(0,t.jsx)(v,{})})]})}function v(){return(0,t.jsxs)(`svg`,{className:g.arrowIcon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M5 12H19`}),(0,t.jsx)(`path`,{d:`M13 6L19 12L13 18`})]})}var y={inputBlockVertical:`_inputBlockVertical_u3s35_1`,inputLabel:`_inputLabel_u3s35_7`,inputLabelGlassy:`_inputLabelGlassy_u3s35_13`,passwordInputWrapper:`_passwordInputWrapper_u3s35_17`,inputTextField:`_inputTextField_u3s35_22`,inputTextFieldGlassy:`_inputTextFieldGlassy_u3s35_34`,inputError:`_inputError_u3s35_56`,togglePasswordButton:`_togglePasswordButton_u3s35_60`,icon:`_icon_u3s35_92`,errorMessage:`_errorMessage_u3s35_101`};function b({label:e,name:r,id:i,error:a,variant:o=`default`,className:s,disabled:c,ref:l,autoComplete:u=`current-password`,...d}){let[f,p]=(0,n.useState)(!1),m=i??r;function h(){p(e=>!e)}return(0,t.jsxs)(`div`,{className:y.inputBlockVertical,children:[e&&(0,t.jsx)(`label`,{htmlFor:m,className:[y.inputLabel,o===`glassy`?y.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:y.passwordInputWrapper,children:[(0,t.jsx)(`input`,{id:m,name:r,ref:l,type:f?`text`:`password`,disabled:c,autoComplete:u,className:[y.inputTextField,o===`glassy`?y.inputTextFieldGlassy:``,a?y.inputError:``,s??``].filter(Boolean).join(` `),"aria-invalid":!!a,"aria-describedby":a?`${r}-error`:void 0,...d}),(0,t.jsx)(`button`,{type:`button`,className:y.togglePasswordButton,onClick:h,disabled:c,"aria-label":f?`Passwort ausblenden`:`Passwort anzeigen`,"aria-pressed":f,children:f?(0,t.jsx)(S,{}):(0,t.jsx)(x,{})})]}),a&&(0,t.jsx)(`span`,{id:`${r}-error`,className:y.errorMessage,children:a})]})}function x(){return(0,t.jsxs)(`svg`,{className:y.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`path`,{d:`M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z`}),(0,t.jsx)(`circle`,{cx:`12`,cy:`12`,r:`3`})]})}function S(){return(0,t.jsx)(`svg`,{className:y.icon,xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M17.94 17.94A10.94 10.94 0 0 1 12 20C7 20 2.73 16.11 1 12c.74-1.64 1.82-3.06 3.11-4.24m3.52-2.42A10.94 10.94 0 0 1 12 4c5 0 9.27 3.89 11 8-1.1 2.42-2.91 4.5-5.06 5.94M1 1l22 22`})})}var C={inputBlockVertical:`_inputBlockVertical_1xe0h_1`,inputLabel:`_inputLabel_1xe0h_7`,inputLabelGlassy:`_inputLabelGlassy_1xe0h_13`,inputWrapper:`_inputWrapper_1xe0h_17`,inputTextField:`_inputTextField_1xe0h_22`,inputTextFieldGlassy:`_inputTextFieldGlassy_1xe0h_34`,inputError:`_inputError_1xe0h_64`,loading:`_loading_1xe0h_68`,suggestionList:`_suggestionList_1xe0h_77`,suggestionItem:`_suggestionItem_1xe0h_94`,locality:`_locality_1xe0h_114`,emptyState:`_emptyState_1xe0h_118`,successMessage:`_successMessage_1xe0h_129`,errorMessage:`_errorMessage_1xe0h_135`};function w({label:e,name:r,id:i,error:a,variant:o=`default`,className:s,disabled:c,placeholder:l=`z.B. 8001 oder Zürich`,ref:u,onChange:d,onBlur:f,onValueChange:p,onSuggestionSelect:m,...h}){let g=(0,n.useId)(),_=i??`${r}-${g}`,v=(0,n.useRef)(null),y=(0,n.useRef)(!1),[b,x]=(0,n.useState)(``),[S,w]=(0,n.useState)([]),[T,E]=(0,n.useState)(!1),[D,O]=(0,n.useState)(!1),k=b.trim().match(/^(\d+)\s+(.+)$/),A=!!k,j=k?.[1],M=k?.[2],N=A&&S.some(e=>e.postalCode===j&&e.locality===M),P=/^\d+$/.test(b.trim()),F=b.trim().length>=4&&P&&!T,I=F&&S.some(e=>e.postalCode===b.trim()),L=F&&!I;D&&b.trim().length>=4&&S.length,(0,n.useEffect)(()=>{let e=b.trim();if(e.length<2){w([]),O(!1);return}if(y.current){y.current=!1;return}let t=new AbortController;async function n(){E(!0);try{let n=e.match(/^(\d+)\s/),r=n?n[1]:e,i=/^\d+$/.test(r)?`https://openplzapi.org/ch/Localities?postalCode=${r}`:`https://openplzapi.org/ch/Localities?locality=${encodeURIComponent(r)}`,a=await fetch(i,{signal:t.signal});if(!a.ok)throw Error(`Postal-Code-Suche fehlgeschlagen`);let o=await a.json();w(Array.from(new Map(o.map(e=>{let t=`${e.postalCode} ${e.name}`;return[t,{label:t,postalCode:e.postalCode,locality:e.name}]})).values()).slice(0,10)),O(!0)}catch(e){if(t.signal.aborted)return;console.error(e),w([]),O(!0)}finally{t.signal.aborted||E(!1)}}let r=window.setTimeout(n,300);return()=>{window.clearTimeout(r),t.abort()}},[b]);function R(e){v.current=e,typeof u==`function`?u(e):u&&(u.current=e)}function z(e){let t=e.target.value;x(t),p?.(t),d?.(e)}function B(e){y.current=!0,x(e.label),w([]),O(!1),p?.(e.label),m?.(e),v.current&&(v.current.value=e.label,v.current.dispatchEvent(new Event(`input`,{bubbles:!0})))}return(0,t.jsxs)(`div`,{className:C.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:_,className:[C.inputLabel,o===`glassy`?C.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsxs)(`div`,{className:C.inputWrapper,children:[(0,t.jsx)(`input`,{id:_,name:r,ref:R,type:`text`,inputMode:`search`,autoComplete:`postal-code`,disabled:c,placeholder:l,value:b,onChange:z,onBlur:f,className:[C.inputTextField,o===`glassy`?C.inputTextFieldGlassy:``,I||N?C.inputValid:``,L||a?C.inputError:``,s??``].filter(Boolean).join(` `),"aria-invalid":!!a||L,"aria-describedby":a?`${r}-error`:void 0,...h}),T&&(0,t.jsx)(`span`,{className:C.loading,children:`Lädt…`}),S.length>0&&(0,t.jsx)(`ul`,{className:C.suggestionList,children:S.map(e=>(0,t.jsx)(`li`,{children:(0,t.jsxs)(`button`,{type:`button`,className:C.suggestionItem,onMouseDown:e=>e.preventDefault(),onClick:()=>B(e),children:[(0,t.jsx)(`span`,{children:e.postalCode}),(0,t.jsx)(`span`,{className:C.locality,children:e.locality})]})},e.label))}),D&&b.trim().length>=2&&S.length===0&&!T&&!N&&!L&&(0,t.jsx)(`div`,{className:C.emptyState,children:`Keine Schweizer PLZ oder Ortschaft gefunden.`})]}),I&&(0,t.jsx)(`span`,{className:C.successMessage,children:`Gültige Schweizer Postleitzahl`}),N&&(0,t.jsx)(`span`,{className:C.successMessage,children:`Gültige Schweizer Postleitzahl`}),L&&(0,t.jsx)(`span`,{className:C.errorMessage,children:`Diese Schweizer Postleitzahl wurde nicht gefunden.`}),a&&(0,t.jsx)(`span`,{id:`${r}-error`,className:C.errorMessage,children:a})]})}var T={radioGroup:`_radioGroup_cqfjf_1`,radioGroupGlassy:`_radioGroupGlassy_cqfjf_11`,radioLabel:`_radioLabel_cqfjf_15`,radioLabelGlassy:`_radioLabelGlassy_cqfjf_20`,optionGroup:`_optionGroup_cqfjf_24`,optionWrapper:`_optionWrapper_cqfjf_31`,optionWrapperDisabled:`_optionWrapperDisabled_cqfjf_37`,radioInput:`_radioInput_cqfjf_41`,optionButton:`_optionButton_cqfjf_58`,optionTitle:`_optionTitle_cqfjf_81`,optionDescription:`_optionDescription_cqfjf_87`,optionButtonDefault:`_optionButtonDefault_cqfjf_95`,optionButtonGlassy:`_optionButtonGlassy_cqfjf_120`,optionButtonError:`_optionButtonError_cqfjf_165`,errorMessage:`_errorMessage_cqfjf_169`};function E({label:e,name:n,options:r,error:i,variant:a=`default`,className:o,disabled:s,value:c,defaultValue:l,onChange:u,...d}){let f=c!==void 0;return(0,t.jsxs)(`fieldset`,{className:[T.radioGroup,a===`glassy`?T.radioGroupGlassy:``,o??``].filter(Boolean).join(` `),"aria-invalid":!!i,"aria-describedby":i?`${n}-error`:void 0,children:[e&&(0,t.jsx)(`legend`,{className:[T.radioLabel,a===`glassy`?T.radioLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsx)(`div`,{className:T.optionGroup,children:r.map(e=>{let r=f?{checked:c===e.value}:{defaultChecked:l===e.value};return(0,t.jsxs)(`label`,{className:[T.optionWrapper,s?T.optionWrapperDisabled:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{type:`radio`,name:n,value:e.value,disabled:s,className:T.radioInput,onChange:u,...r,...d}),(0,t.jsxs)(`span`,{className:[T.optionButton,a===`glassy`?T.optionButtonGlassy:T.optionButtonDefault,i?T.optionButtonError:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`span`,{className:T.optionTitle,children:e.label}),e.description&&(0,t.jsx)(`span`,{className:T.optionDescription,children:e.description})]})]},e.value)})}),i&&(0,t.jsx)(`span`,{id:`${n}-error`,className:T.errorMessage,children:i})]})}var D={switchWrapper:`_switchWrapper_14rch_1`,switchCheckbox:`_switchCheckbox_14rch_7`,switchLabel:`_switchLabel_14rch_15`,switchLabelDefault:`_switchLabelDefault_14rch_24`,switchLabelGlassy:`_switchLabelGlassy_14rch_28`,switchBackground:`_switchBackground_14rch_37`,switchBackgroundDefault:`_switchBackgroundDefault_14rch_56`,switchBackgroundGlassy:`_switchBackgroundGlassy_14rch_66`,switchButton:`_switchButton_14rch_77`,iconChecked:`_iconChecked_14rch_163`,iconUnchecked:`_iconUnchecked_14rch_164`,switchText:`_switchText_14rch_200`,errorMessage:`_errorMessage_14rch_206`};function O({name:e,id:n,label:r,error:i,variant:a=`default`,className:o,disabled:s,...c}){let l=n??`${e}-switch`;return(0,t.jsxs)(`div`,{className:[D.switchWrapper,o??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`input`,{id:l,name:e,type:`checkbox`,disabled:s,className:D.switchCheckbox,"aria-invalid":!!i,"aria-describedby":i?`${e}-error`:void 0,...c}),(0,t.jsxs)(`label`,{htmlFor:l,className:[D.switchLabel,a===`glassy`?D.switchLabelGlassy:D.switchLabelDefault].filter(Boolean).join(` `),children:[(0,t.jsx)(`span`,{className:[D.switchBackground,a===`glassy`?D.switchBackgroundGlassy:D.switchBackgroundDefault].filter(Boolean).join(` `),children:(0,t.jsxs)(`span`,{className:D.switchButton,"aria-hidden":`true`,children:[(0,t.jsx)(`span`,{className:D.iconChecked,children:(0,t.jsx)(k,{})}),(0,t.jsx)(`span`,{className:D.iconUnchecked,children:(0,t.jsx)(A,{})})]})}),r&&(0,t.jsx)(`span`,{className:D.switchText,children:r})]}),i&&(0,t.jsx)(`span`,{id:`${e}-error`,className:D.errorMessage,children:i})]})}function k(){return(0,t.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M3 6.5L5.5 9L9 3`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`})})}function A(){return(0,t.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,t.jsx)(`path`,{d:`M3 3L9 9M9 3L3 9`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`})})}var j={inputBlockVertical:`_inputBlockVertical_1khad_1`,inputLabel:`_inputLabel_1khad_8`,inputLabelGlassy:`_inputLabelGlassy_1khad_14`,inputTextField:`_inputTextField_1khad_20`,inputTextFieldGlassy:`_inputTextFieldGlassy_1khad_37`,inputError:`_inputError_1khad_59`,errorMessage:`_errorMessage_1khad_63`};function M({label:e,name:n,error:r,placeholder:i,variant:a=`default`,className:o,ref:s,...c}){return(0,t.jsxs)(`div`,{className:j.inputBlockVertical,children:[(0,t.jsx)(`label`,{htmlFor:n,className:[j.inputLabel,a===`glassy`?j.inputLabelGlassy:``].filter(Boolean).join(` `),children:e}),(0,t.jsx)(`input`,{id:n,name:n,ref:s,placeholder:i,className:[j.inputTextField,a===`glassy`?j.inputTextFieldGlassy:``,r?j.inputError:``,o??``].filter(Boolean).join(` `),"aria-invalid":!!r,"aria-describedby":r?`${n}-error`:void 0,...c}),r&&(0,t.jsx)(`span`,{id:`${n}-error`,className:j.errorMessage,children:r})]})}var N={wrapper:`_wrapper_1jqlw_1`,label:`_label_1jqlw_7`,labelGlassy:`_labelGlassy_1jqlw_13`,dropzone:`_dropzone_1jqlw_17`,dropzoneGlassy:`_dropzoneGlassy_1jqlw_32`,dragOver:`_dragOver_1jqlw_39`,errorState:`_errorState_1jqlw_48`,disabled:`_disabled_1jqlw_52`,hiddenInput:`_hiddenInput_1jqlw_57`,dropzoneContent:`_dropzoneContent_1jqlw_65`,placeholder:`_placeholder_1jqlw_74`,big:`_big_1jqlw_80`,small:`_small_1jqlw_86`,hint:`_hint_1jqlw_91`,selected:`_selected_1jqlw_111`,preview:`_preview_1jqlw_118`,fileMeta:`_fileMeta_1jqlw_127`,fileName:`_fileName_1jqlw_134`,fileSize:`_fileSize_1jqlw_142`,remove:`_remove_1jqlw_156`,errorMessage:`_errorMessage_1jqlw_198`};function P({label:e,name:r,id:i,file:a,error:o,variant:s=`default`,accept:c=`image/*`,maxSizeBytes:l=5*1024*1024,disabled:u,className:d,onChange:f,onFileChange:p,...m}){let h=(0,n.useId)(),g=i??`${r}-${h}`,[_,v]=(0,n.useState)(!1),[y,b]=(0,n.useState)(a??null),x=a!==void 0,S=x?a:y,C=(0,n.useMemo)(()=>!S||!S.type.startsWith(`image/`)?null:URL.createObjectURL(S),[S]);(0,n.useEffect)(()=>{x&&b(a??null)},[a,x]),(0,n.useEffect)(()=>()=>{C&&URL.revokeObjectURL(C)},[C]);function w(e){return!e||(c===`image/*`||c.startsWith(`image/`))&&!e.type.startsWith(`image/`)||l&&e.size>l?null:e}function T(e){let t=w(e);x||b(t),p?.(t)}function E(e){T(e.target.files?.[0]??null),f?.(e)}function D(e){e.preventDefault(),e.stopPropagation(),u||v(!0)}function O(e){e.preventDefault(),e.stopPropagation(),!e.currentTarget.contains(e.relatedTarget)&&v(!1)}function k(e){e.preventDefault(),e.stopPropagation(),v(!1),!u&&T(e.dataTransfer.files?.[0]??null)}function A(){x||b(null),p?.(null)}let j=Math.round(l/(1024*1024));return(0,t.jsxs)(`div`,{className:[N.wrapper,d??``].filter(Boolean).join(` `),children:[(0,t.jsx)(`label`,{className:[N.label,s===`glassy`?N.labelGlassy:``].filter(Boolean).join(` `),htmlFor:g,children:e}),(0,t.jsxs)(`div`,{className:[N.dropzone,s===`glassy`?N.dropzoneGlassy:``,_?N.dragOver:``,o?N.errorState:``,u?N.disabled:``].filter(Boolean).join(` `),onDragOver:D,onDragLeave:O,onDrop:k,children:[(0,t.jsx)(`input`,{id:g,name:r,className:N.hiddenInput,type:`file`,accept:c,disabled:u,onChange:E,"aria-invalid":!!o,"aria-describedby":o?`${r}-error`:void 0,...m}),(0,t.jsx)(`label`,{htmlFor:g,className:N.dropzoneContent,children:S?(0,t.jsxs)(`span`,{className:N.selected,children:[C&&(0,t.jsx)(`img`,{className:N.preview,src:C,alt:`Vorschau von ${S.name}`}),(0,t.jsxs)(`span`,{className:N.fileMeta,children:[(0,t.jsx)(`span`,{className:N.fileName,children:S.name}),(0,t.jsxs)(`span`,{className:N.fileSize,children:[(S.size/1024).toFixed(0),` KB ·`,` `,S.type||`unknown`]})]})]}):(0,t.jsxs)(`span`,{className:N.placeholder,children:[(0,t.jsx)(`span`,{className:N.big,children:`Datei hier reinziehen`}),(0,t.jsx)(`span`,{className:N.small,children:`…oder klicken, um auszuwählen`}),(0,t.jsxs)(`span`,{className:N.hint,children:[`Erlaubt: `,c,` · max. `,j,` MB`]})]})}),S&&(0,t.jsx)(`button`,{type:`button`,className:N.remove,onClick:A,disabled:u,children:`Entfernen`})]}),o&&(0,t.jsx)(`span`,{id:`${r}-error`,className:N.errorMessage,children:o})]})}e.Button=i,e.Checkbox=o,e.Chip=c,e.DatePicker=u,e.Dropdown=h,e.Link=_,e.Password=b,e.PostalCode=w,e.RadioButton=E,e.Switch=O,e.TextField=M,e.Upload=P});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "suus-component-library",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "type": "module",
   "main": "./dist/suus-component-library.umd.cjs",
   "module": "./dist/suus-component-library.js",
@@ -32,6 +32,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
+    "@storybook/addon-docs": "^10.4.1",
     "@storybook/react-vite": "^10.3.6",
     "@types/react": "latest",
     "@types/react-dom": "latest",
@@ -50,6 +51,6 @@
   },
   "dependencies": {
     "msw": "^2.14.6",
-    "suus-design-tokens": "^1.0.13"
+    "suus-design-tokens": "^1.0.18"
   }
 }