suus-component-library 0.1.5 → 0.1.9

package/dist/suus-component-library.js

@@ -1,5 +1,6 @@
 import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
-var r = {
+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",
@@ -11,31 +12,889 @@ var r = {
 	loaderSecondary: "_loaderSecondary_1q9to_182"
 };
 //#endregion
-//#region src/components/form/buttons/input-button/InputButton.tsx
-function i({ label: i, onClick: a, type: o = "button", disabled: s = !1, loading: c = !1, variant: l = "primary", colorToken: u = "--colors-juice-sugarcane", icon: d, ...f }) {
+//#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 }) {
 	return /* @__PURE__ */ t("button", {
-		type: o,
-		onClick: a,
-		disabled: s || c,
+		type: a,
+		onClick: i,
+		disabled: o || s,
 		style: { "--button-background-color": `var(${u})` },
 		className: [
-			r.suusButton,
-			r[l],
-			c ? r.loading : ""
+			c.suusButton,
+			c[l],
+			s ? c.loading : ""
 		].filter(Boolean).join(" "),
-		"aria-busy": c,
+		"aria-busy": s,
 		...f,
-		children: c ? /* @__PURE__ */ t("span", {
-			className: `${r.loader} ${l === "primary" ? "" : r.loaderSecondary}`,
+		children: s ? /* @__PURE__ */ t("span", {
+			className: `${c.loader} ${l === "primary" ? "" : c.loaderSecondary}`,
 			"aria-hidden": "true"
 		}) : /* @__PURE__ */ n(e, { children: [d ? /* @__PURE__ */ t("span", {
-			className: r.icon,
+			className: c.icon,
 			children: d
 		}) : null, /* @__PURE__ */ t("span", {
-			className: r.label,
-			children: i
+			className: c.label,
+			children: r
 		})] })
 	});
 }
+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"
+};
+//#endregion
+//#region src/components/form/checkbox/Checkbox.tsx
+function d({ label: e, name: r, id: i, error: a, variant: o = "default", className: s, disabled: c, ...l }) {
+	let d = i ?? `${r}-checkbox`;
+	return /* @__PURE__ */ n("div", {
+		className: [
+			u.checkboxWrapper,
+			o === "glassy" ? u.checkboxWrapperGlassy : "",
+			a ? u.checkboxWrapperError : "",
+			c ? u.checkboxWrapperDisabled : "",
+			s ?? ""
+		].filter(Boolean).join(" "),
+		children: [
+			/* @__PURE__ */ t("input", {
+				type: "checkbox",
+				id: d,
+				name: r,
+				disabled: c,
+				className: u.checkboxInput,
+				"aria-invalid": !!a,
+				"aria-describedby": a ? `${r}-error` : void 0,
+				...l
+			}),
+			/* @__PURE__ */ n("label", {
+				htmlFor: d,
+				className: u.checkboxLabel,
+				children: [/* @__PURE__ */ t("span", {
+					className: u.customCheckbox,
+					"aria-hidden": "true",
+					children: /* @__PURE__ */ t("svg", {
+						className: u.checkIcon,
+						viewBox: "0 0 24 24",
+						focusable: "false",
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ t("path", { d: "M20 6L9 17L4 12" })
+					})
+				}), /* @__PURE__ */ t("span", {
+					className: u.checkboxText,
+					children: e
+				})]
+			}),
+			a && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: u.errorMessage,
+				children: a
+			})
+		]
+	});
+}
+var f = {
+	chip: "_chip_9t0x4_1",
+	chipGlassy: "_chipGlassy_9t0x4_19"
+};
+//#endregion
+//#region src/components/form/chip/Chip.tsx
+function p({ children: e, variant: n = "default", className: r, ...i }) {
+	return /* @__PURE__ */ t("span", {
+		className: [
+			f.chip,
+			n === "glassy" ? f.chipGlassy : "",
+			r ?? ""
+		].filter(Boolean).join(" "),
+		...i,
+		children: e
+	});
+}
+var m = {
+	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"
+};
+//#endregion
+//#region src/components/form/date-picker/DatePicker.tsx
+function h({ label: e, name: r, id: i, value: a = null, maxDate: s, minDate: c, error: l, variant: u = "default", className: d, ref: f, onDateChange: p, onBlur: h, disabled: y, ...b }) {
+	let x = i ?? r, S = o(null), C = s ?? /* @__PURE__ */ new Date();
+	function w(e) {
+		S.current = e, typeof f == "function" ? f(e) : f && (f.current = e);
+	}
+	function T(e) {
+		let t = e.target.value;
+		if (!t) {
+			p?.(null);
+			return;
+		}
+		p?.(_(t));
+	}
+	function E() {
+		y || (S.current?.showPicker?.(), S.current?.focus());
+	}
+	return /* @__PURE__ */ n("div", {
+		className: m.inputBlockVertical,
+		children: [
+			/* @__PURE__ */ t("label", {
+				htmlFor: x,
+				className: [m.inputLabel, u === "glassy" ? m.inputLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ n("div", {
+				className: m.dateInputWrapper,
+				children: [/* @__PURE__ */ t("input", {
+					id: x,
+					name: r,
+					ref: w,
+					type: "date",
+					value: g(a),
+					max: g(C),
+					min: c ? g(c) : void 0,
+					disabled: y,
+					onChange: T,
+					onBlur: h,
+					className: [
+						m.inputDateField,
+						u === "glassy" ? m.inputDateFieldGlassy : "",
+						l ? m.inputError : "",
+						d ?? ""
+					].filter(Boolean).join(" "),
+					"aria-invalid": !!l,
+					"aria-describedby": l ? `${r}-error` : void 0,
+					...b
+				}), /* @__PURE__ */ t("button", {
+					type: "button",
+					className: m.calendarIconButton,
+					onClick: E,
+					disabled: y,
+					"aria-label": "Datum auswählen",
+					tabIndex: -1,
+					children: /* @__PURE__ */ t(v, {})
+				})]
+			}),
+			l && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: m.errorMessage,
+				children: l
+			})
+		]
+	});
+}
+function g(e) {
+	return e ? `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}` : "";
+}
+function _(e) {
+	let [t, n, r] = e.split("-").map(Number);
+	return new Date(t, n - 1, r);
+}
+function v() {
+	return /* @__PURE__ */ n("svg", {
+		className: m.icon,
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ t("path", { d: "M8 2V5" }),
+			/* @__PURE__ */ t("path", { d: "M16 2V5" }),
+			/* @__PURE__ */ t("path", { d: "M3.5 9.09H20.5" }),
+			/* @__PURE__ */ t("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 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"
+};
+//#endregion
+//#region src/components/form/dropdown/Dropdown.tsx
+function b({ label: e, name: r, options: i, placeholder: a, error: o, variant: s = "default", className: c, disabled: l, ...u }) {
+	return /* @__PURE__ */ n("div", {
+		className: y.inputBlockVertical,
+		children: [
+			/* @__PURE__ */ t("label", {
+				htmlFor: r,
+				className: [y.inputLabel, s === "glassy" ? y.inputLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ n("select", {
+				id: r,
+				name: r,
+				disabled: l,
+				className: [
+					y.inputSelectField,
+					s === "glassy" ? y.inputSelectFieldGlassy : "",
+					o ? y.inputError : "",
+					c ?? ""
+				].filter(Boolean).join(" "),
+				"aria-invalid": !!o,
+				"aria-describedby": o ? `${r}-error` : void 0,
+				...u,
+				children: [a && /* @__PURE__ */ t("option", {
+					value: "",
+					disabled: !0,
+					children: a
+				}), i.map((e) => /* @__PURE__ */ t("option", {
+					value: e.value,
+					children: e.label
+				}, e.value))]
+			}),
+			o && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: y.errorMessage,
+				children: o
+			})
+		]
+	});
+}
+var x = {
+	appLink: "_appLink_18ja7_1",
+	appLinkGlassy: "_appLinkGlassy_18ja7_27",
+	label: "_label_18ja7_35",
+	icon: "_icon_18ja7_40",
+	arrowIcon: "_arrowIcon_18ja7_51"
+};
+//#endregion
+//#region src/components/form/link/Link.tsx
+function S({ children: e, href: r, onClick: i, newTab: a = !1, showArrow: o = !0, variant: s = "default", className: c, ...l }) {
+	function u(e) {
+		r || e.preventDefault(), i?.(e);
+	}
+	return /* @__PURE__ */ n("a", {
+		href: r ?? "#",
+		onClick: u,
+		target: r && a ? "_blank" : void 0,
+		rel: r && a ? "noopener noreferrer" : void 0,
+		className: [
+			x.appLink,
+			s === "glassy" ? x.appLinkGlassy : "",
+			c ?? ""
+		].filter(Boolean).join(" "),
+		...l,
+		children: [/* @__PURE__ */ t("span", {
+			className: x.label,
+			children: e
+		}), o && /* @__PURE__ */ t("span", {
+			className: x.icon,
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ t(C, {})
+		})]
+	});
+}
+function C() {
+	return /* @__PURE__ */ n("svg", {
+		className: x.arrowIcon,
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ t("path", { d: "M5 12H19" }), /* @__PURE__ */ t("path", { d: "M13 6L19 12L13 18" })]
+	});
+}
+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"
+};
+//#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);
+	}
+	return /* @__PURE__ */ n("div", {
+		className: w.inputBlockVertical,
+		style: _,
+		children: [
+			e && /* @__PURE__ */ t("label", {
+				htmlFor: g,
+				className: [w.inputLabel, o === "glassy" ? w.inputLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ n("div", {
+				className: w.passwordInputWrapper,
+				children: [/* @__PURE__ */ t("input", {
+					id: g,
+					name: r,
+					ref: d,
+					type: m ? "text" : "password",
+					disabled: u,
+					autoComplete: f,
+					className: [
+						w.inputTextField,
+						o === "glassy" ? w.inputTextFieldGlassy : "",
+						a ? w.inputError : "",
+						l ?? ""
+					].filter(Boolean).join(" "),
+					"aria-invalid": !!a,
+					"aria-describedby": a ? `${r}-error` : void 0,
+					...p
+				}), /* @__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, {})
+				})]
+			}),
+			a && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: w.errorMessage,
+				children: a
+			})
+		]
+	});
+}
+function E() {
+	return /* @__PURE__ */ n("svg", {
+		className: w.icon,
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ t("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), /* @__PURE__ */ t("circle", {
+			cx: "12",
+			cy: "12",
+			r: "3"
+		})]
+	});
+}
+function D() {
+	return /* @__PURE__ */ t("svg", {
+		className: w.icon,
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("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 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"
+};
+//#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();
+		if (e.length < 2) {
+			E([]), j(!1);
+			return;
+		}
+		let t = new AbortController();
+		async function n() {
+			k(!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 t = `${e.postalCode} ${e.name}`;
+					return [t, {
+						label: t,
+						postalCode: e.postalCode,
+						locality: e.name
+					}];
+				})).values()).slice(0, 10)), j(!0);
+			} catch (e) {
+				if (t.signal.aborted) return;
+				console.error(e), E([]), j(!0);
+			} finally {
+				t.signal.aborted || k(!1);
+			}
+		}
+		let r = window.setTimeout(n, 300);
+		return () => {
+			window.clearTimeout(r), t.abort();
+		};
+	}, [C]);
+	function I(e) {
+		S.current = e, typeof m == "function" ? m(e) : m && (m.current = e);
+	}
+	function L(e) {
+		let t = e.target.value;
+		w(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 })));
+	}
+	return /* @__PURE__ */ n("div", {
+		className: O.inputBlockVertical,
+		children: [
+			/* @__PURE__ */ t("label", {
+				htmlFor: x,
+				className: [O.inputLabel, u === "glassy" ? O.inputLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ n("div", {
+				className: O.inputWrapper,
+				children: [
+					/* @__PURE__ */ t("input", {
+						id: x,
+						name: a,
+						ref: I,
+						type: "text",
+						inputMode: "search",
+						autoComplete: "postal-code",
+						disabled: f,
+						placeholder: p,
+						value: C,
+						onChange: L,
+						onBlur: g,
+						className: [
+							O.inputTextField,
+							u === "glassy" ? O.inputTextFieldGlassy : "",
+							P ? O.inputValid : "",
+							F || l ? O.inputError : "",
+							d ?? ""
+						].filter(Boolean).join(" "),
+						"aria-invalid": !!l || F,
+						"aria-describedby": l ? `${a}-error` : void 0,
+						...y
+					}),
+					D && /* @__PURE__ */ t("span", {
+						className: O.loading,
+						children: "Lädt…"
+					}),
+					T.length > 0 && /* @__PURE__ */ t("ul", {
+						className: O.suggestionList,
+						children: T.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", {
+								className: O.locality,
+								children: e.locality
+							})]
+						}) }, e.label))
+					}),
+					A && C.trim().length >= 2 && T.length === 0 && !D && /* @__PURE__ */ t("div", {
+						className: O.emptyState,
+						children: "Keine Schweizer PLZ oder Ortschaft gefunden."
+					})
+				]
+			}),
+			P && /* @__PURE__ */ t("span", {
+				className: O.successMessage,
+				children: "Gültige Schweizer Postleitzahl"
+			}),
+			F && /* @__PURE__ */ t("span", {
+				className: O.errorMessage,
+				children: "Diese Schweizer Postleitzahl wurde nicht gefunden."
+			}),
+			l && /* @__PURE__ */ t("span", {
+				id: `${a}-error`,
+				className: O.errorMessage,
+				children: l
+			})
+		]
+	});
+}
+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"
+};
+//#endregion
+//#region src/components/form/radiobutton/RadioButton.tsx
+function j({ label: e, name: r, options: i, error: a, variant: o = "default", className: s, disabled: c, value: l, defaultValue: u, onChange: d, ...f }) {
+	let p = l !== void 0;
+	return /* @__PURE__ */ n("fieldset", {
+		className: [
+			A.radioGroup,
+			o === "glassy" ? A.radioGroupGlassy : "",
+			s ?? ""
+		].filter(Boolean).join(" "),
+		"aria-invalid": !!a,
+		"aria-describedby": a ? `${r}-error` : void 0,
+		children: [
+			e && /* @__PURE__ */ t("legend", {
+				className: [A.radioLabel, o === "glassy" ? A.radioLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ t("div", {
+				className: A.optionGroup,
+				children: i.map((e) => {
+					let i = p ? { checked: l === e.value } : { defaultChecked: u === e.value };
+					return /* @__PURE__ */ n("label", {
+						className: [A.optionWrapper, c ? A.optionWrapperDisabled : ""].filter(Boolean).join(" "),
+						children: [/* @__PURE__ */ t("input", {
+							type: "radio",
+							name: r,
+							value: e.value,
+							disabled: c,
+							className: A.radioInput,
+							onChange: d,
+							...i,
+							...f
+						}), /* @__PURE__ */ n("span", {
+							className: [
+								A.optionButton,
+								o === "glassy" ? A.optionButtonGlassy : "",
+								a ? A.optionButtonError : ""
+							].filter(Boolean).join(" "),
+							children: [/* @__PURE__ */ t("span", {
+								className: A.optionTitle,
+								children: e.label
+							}), e.description && /* @__PURE__ */ t("span", {
+								className: A.optionDescription,
+								children: e.description
+							})]
+						})]
+					}, e.value);
+				})
+			}),
+			a && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: A.errorMessage,
+				children: a
+			})
+		]
+	});
+}
+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"
+};
+//#endregion
+//#region src/components/form/switch/Switch.tsx
+function N({ name: e, id: r, label: i, error: a, variant: o = "default", className: s, disabled: c, ...l }) {
+	let u = r ?? `${e}-switch`;
+	return /* @__PURE__ */ n("div", {
+		className: [M.switchWrapper, s ?? ""].filter(Boolean).join(" "),
+		children: [
+			/* @__PURE__ */ t("input", {
+				id: u,
+				name: e,
+				type: "checkbox",
+				disabled: c,
+				className: M.switchCheckbox,
+				"aria-invalid": !!a,
+				"aria-describedby": a ? `${e}-error` : void 0,
+				...l
+			}),
+			/* @__PURE__ */ n("label", {
+				htmlFor: u,
+				className: [M.switchLabel, o === "glassy" ? M.switchLabelGlassy : ""].filter(Boolean).join(" "),
+				children: [/* @__PURE__ */ t("span", {
+					className: M.switchBackground,
+					children: /* @__PURE__ */ n("span", {
+						className: M.switchButton,
+						"aria-hidden": "true",
+						children: [/* @__PURE__ */ t("span", {
+							className: M.iconChecked,
+							children: /* @__PURE__ */ t(P, {})
+						}), /* @__PURE__ */ t("span", {
+							className: M.iconUnchecked,
+							children: /* @__PURE__ */ t(F, {})
+						})]
+					})
+				}), i && /* @__PURE__ */ t("span", {
+					className: M.switchText,
+					children: i
+				})]
+			}),
+			a && /* @__PURE__ */ t("span", {
+				id: `${e}-error`,
+				className: M.errorMessage,
+				children: a
+			})
+		]
+	});
+}
+function P() {
+	return /* @__PURE__ */ t("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 12 12",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M3 6.5L5.5 9L9 3",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function F() {
+	return /* @__PURE__ */ t("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 12 12",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M3 3L9 9M9 3L3 9",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			strokeLinecap: "round"
+		})
+	});
+}
+var I = {
+	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"
+};
+//#endregion
+//#region src/components/form/textfield/TextField.tsx
+function L({ label: e, name: r, error: i, placeholder: a, variant: o = "default", className: s, ref: c, ...l }) {
+	return /* @__PURE__ */ n("div", {
+		className: I.inputBlockVertical,
+		children: [
+			/* @__PURE__ */ t("label", {
+				htmlFor: r,
+				className: [I.inputLabel, o === "glassy" ? I.inputLabelGlassy : ""].filter(Boolean).join(" "),
+				children: e
+			}),
+			/* @__PURE__ */ t("input", {
+				id: r,
+				name: r,
+				ref: c,
+				placeholder: a,
+				className: [
+					I.inputTextField,
+					o === "glassy" ? I.inputTextFieldGlassy : "",
+					i ? I.inputError : "",
+					s ?? ""
+				].filter(Boolean).join(" "),
+				"aria-invalid": !!i,
+				"aria-describedby": i ? `${r}-error` : void 0,
+				...l
+			}),
+			i && /* @__PURE__ */ t("span", {
+				id: `${r}-error`,
+				className: I.errorMessage,
+				children: i
+			})
+		]
+	});
+}
+var R = {
+	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"
+};
+//#endregion
+//#region src/components/form/upload/Upload.tsx
+function z({ label: e, name: o, id: c, file: l, error: u, variant: d = "default", accept: f = "image/*", maxSizeBytes: p = 5 * 1024 * 1024, disabled: m, className: h, onChange: g, onFileChange: _, ...v }) {
+	let y = i(), b = c ?? `${o}-${y}`, [x, S] = s(!1), [C, w] = s(l ?? null), T = l !== void 0, E = T ? l : C, D = a(() => !E || !E.type.startsWith("image/") ? null : URL.createObjectURL(E), [E]);
+	r(() => {
+		T && w(l ?? null);
+	}, [l, T]), r(() => () => {
+		D && URL.revokeObjectURL(D);
+	}, [D]);
+	function O(e) {
+		return !e || (f === "image/*" || f.startsWith("image/")) && !e.type.startsWith("image/") || p && e.size > p ? null : e;
+	}
+	function k(e) {
+		let t = O(e);
+		T || w(t), _?.(t);
+	}
+	function A(e) {
+		k(e.target.files?.[0] ?? null), g?.(e);
+	}
+	function j(e) {
+		e.preventDefault(), e.stopPropagation(), m || S(!0);
+	}
+	function M(e) {
+		e.preventDefault(), e.stopPropagation(), !e.currentTarget.contains(e.relatedTarget) && S(!1);
+	}
+	function N(e) {
+		e.preventDefault(), e.stopPropagation(), S(!1), !m && k(e.dataTransfer.files?.[0] ?? null);
+	}
+	function P() {
+		T || w(null), _?.(null);
+	}
+	let F = Math.round(p / (1024 * 1024));
+	return /* @__PURE__ */ n("div", {
+		className: [R.wrapper, h ?? ""].filter(Boolean).join(" "),
+		children: [
+			/* @__PURE__ */ t("label", {
+				className: [R.label, d === "glassy" ? R.labelGlassy : ""].filter(Boolean).join(" "),
+				htmlFor: b,
+				children: e
+			}),
+			/* @__PURE__ */ n("div", {
+				className: [
+					R.dropzone,
+					d === "glassy" ? R.dropzoneGlassy : "",
+					x ? R.dragOver : "",
+					u ? R.errorState : "",
+					m ? R.disabled : ""
+				].filter(Boolean).join(" "),
+				onDragOver: j,
+				onDragLeave: M,
+				onDrop: N,
+				children: [
+					/* @__PURE__ */ t("input", {
+						id: b,
+						name: o,
+						className: R.hiddenInput,
+						type: "file",
+						accept: f,
+						disabled: m,
+						onChange: A,
+						"aria-invalid": !!u,
+						"aria-describedby": u ? `${o}-error` : void 0,
+						...v
+					}),
+					/* @__PURE__ */ t("label", {
+						htmlFor: b,
+						className: R.dropzoneContent,
+						children: E ? /* @__PURE__ */ n("span", {
+							className: R.selected,
+							children: [D && /* @__PURE__ */ t("img", {
+								className: R.preview,
+								src: D,
+								alt: `Vorschau von ${E.name}`
+							}), /* @__PURE__ */ n("span", {
+								className: R.fileMeta,
+								children: [/* @__PURE__ */ t("span", {
+									className: R.fileName,
+									children: E.name
+								}), /* @__PURE__ */ n("span", {
+									className: R.fileSize,
+									children: [
+										(E.size / 1024).toFixed(0),
+										" KB ·",
+										" ",
+										E.type || "unknown"
+									]
+								})]
+							})]
+						}) : /* @__PURE__ */ n("span", {
+							className: R.placeholder,
+							children: [
+								/* @__PURE__ */ t("span", {
+									className: R.big,
+									children: "Datei hier reinziehen"
+								}),
+								/* @__PURE__ */ t("span", {
+									className: R.small,
+									children: "…oder klicken, um auszuwählen"
+								}),
+								/* @__PURE__ */ n("span", {
+									className: R.hint,
+									children: [
+										"Erlaubt: ",
+										f,
+										" · max. ",
+										F,
+										" MB"
+									]
+								})
+							]
+						})
+					}),
+					E && /* @__PURE__ */ t("button", {
+						type: "button",
+						className: R.remove,
+						onClick: P,
+						disabled: m,
+						children: "Entfernen"
+					})
+				]
+			}),
+			u && /* @__PURE__ */ t("span", {
+				id: `${o}-error`,
+				className: R.errorMessage,
+				children: u
+			})
+		]
+	});
+}
 //#endregion
-export { i as InputButton };
+export { l as Button, d as Checkbox, p as Chip, h as DatePicker, b as Dropdown, S as Link, T as Password, k as PostalCode, j as RadioButton, N as Switch, L as TextField, z as Upload };