@ahrowe/ui 0.1.2 → 0.1.4

package/dist/index.mjs

@@ -4,9 +4,9 @@ import { FontAwesomeIcon as p } from "@fortawesome/react-fontawesome";
 import { faCheck as m, faChevronDown as h, faChevronLeft as g, faChevronRight as _, faDoorOpen as v, faDownload as y, faDrawPolygon as b, faEnvelope as x, faEye as S, faEyeSlash as C, faHandPointer as w, faMagnifyingGlassMinus as T, faMagnifyingGlassPlus as E, faPen as ee, faPhone as D, faPlus as O, faSearch as te, faSquare as ne, faTrash as re, faUpload as k, faXmark as A, faXmarkCircle as j } from "@fortawesome/free-solid-svg-icons";
 import { Fragment as ie, jsx as M, jsxs as N } from "react/jsx-runtime";
 import { createPortal as P } from "react-dom";
-import F from "prop-types";
-import I from "downshift";
-import ae from "@mona-health/react-input-mask";
+import ae from "downshift";
+import F from "@mona-health/react-input-mask";
+import I from "prop-types";
 import { DndContext as oe, DragOverlay as se, PointerSensor as ce, closestCorners as L, useDroppable as le, useSensor as ue, useSensors as de } from "@dnd-kit/core";
 import { SortableContext as fe, arrayMove as pe, useSortable as R, verticalListSortingStrategy as me } from "@dnd-kit/sortable";
 import { CSS as he } from "@dnd-kit/utilities";
@@ -830,7 +830,7 @@ var K = {
 }({});
 //#endregion
 //#region package/common/input/input.tsx
-function $e({ name: t = "", label: n = "", errorMessage: r = "", isValid: o = !0, className: s = "", style: c, value: l = "", icon: m = null, onChange: h = () => {}, onFocus: g = null, onBlur: _ = null, onMouseEnter: v = null, onMouseLeave: y = null, isUppercase: b = !1, isRequired: w = !1, tabIndex: T = 0, type: E = void 0, isRow: O = !1, onIconClick: ne = null, parse: re = null, formValidator: k = null, autoFocus: j = !1, suffix: ie = null, upperRightLabel: P = null, labelInBorder: F = !1, showCancel: I = !1, onClearClicked: ae, min: oe = null, max: se = null, placeholder: ce = "", useMatLabelStyle: L = !0, autoComplete: le = null, onClick: ue = () => null, readOnly: de = !1, customInput: fe, alwaysShowCancel: pe = !1, multiline: R = !1, rows: me, autoResize: he = !1, classNames: z, styles: B }) {
+function $e({ name: t = "", label: n = "", errorMessage: r = "", isValid: o = !0, className: s = "", style: c, value: l = "", icon: m = null, onChange: h = () => {}, onFocus: g = null, onBlur: _ = null, onMouseEnter: v = null, onMouseLeave: y = null, isUppercase: b = !1, isRequired: w = !1, tabIndex: T = 0, type: E = void 0, isRow: O = !1, onIconClick: ne = null, parse: re = null, formValidator: k = null, autoFocus: j = !1, suffix: ie = null, upperRightLabel: P = null, labelInBorder: ae = !1, showCancel: F = !1, onClearClicked: I, min: oe = null, max: se = null, placeholder: ce = "", useMatLabelStyle: L = !0, autoComplete: le = null, onClick: ue = () => null, readOnly: de = !1, customInput: fe, alwaysShowCancel: pe = !1, multiline: R = !1, rows: me, autoResize: he = !1, classNames: z, styles: B }) {
 	let [ge, _e] = d(!1), [ve, ye] = d(!1), [be, xe] = d(!1), [, V] = d(0), Se = u(null), Ce = u(k), H = i(() => {
 		let e = Se.current;
 		!e || !he || (e.style.height = "auto", e.style.height = `${e.scrollHeight}px`);
@@ -886,7 +886,7 @@ function $e({ name: t = "", label: n = "", errorMessage: r = "", isValid: o = !0
 				htmlFor: t,
 				className: f(K.inputLabel, z?.label, {
 					[K.inputLabelColumn]: !O,
-					[K.inputLabelInBorder]: F
+					[K.inputLabelInBorder]: ae
 				}),
 				style: B?.label,
 				children: [
@@ -996,10 +996,10 @@ function $e({ name: t = "", label: n = "", errorMessage: r = "", isValid: o = !0
 				icon: be ? C : S,
 				...Ne
 			}),
-			(I && l && (ge || ve) || pe) && /* @__PURE__ */ M(p, {
+			(F && l && (ge || ve) || pe) && /* @__PURE__ */ M(p, {
 				icon: A,
 				className: K.inputFieldIcon,
-				onClick: ae ?? void 0,
+				onClick: I ?? void 0,
 				onMouseEnter: () => ye(!0),
 				onMouseLeave: () => ye(!1)
 			})
@@ -1480,81 +1480,61 @@ function Nt({ className: e = "", month: t = (/* @__PURE__ */ new Date()).getMont
 		})
 	});
 }
-var Pt = { infiniteBlock: "infiniteBlock_dFv-h" }, Ft = class extends n {
-	static propTypes = {
-		children: F.node,
-		onScroll: F.func.isRequired,
-		className: F.string,
-		isDataLoading: F.bool,
-		setHighlightedIndex: F.func
-	};
-	static defaultProps = {
-		className: "",
-		children: null,
-		isDataLoading: !1,
-		setHighlightedIndex: () => null
-	};
-	state = {
-		isLoadingOnScroll: !1,
-		index: -1
-	};
-	componentDidMount() {
-		document.addEventListener("keydown", this.respondToUserInput);
-	}
-	componentWillUnmount() {
-		document.removeEventListener("keydown", this.respondToUserInput);
+var Pt = { infiniteBlock: "infiniteBlock_dFv-h" };
+//#endregion
+//#region package/common/infiniteBlock/infiniteBlock.tsx
+function Ft(e, t) {
+	let n = e;
+	for (; n.props.children !== null && typeof n.props.children == "object" && !Array.isArray(n.props.children);) n = n.props.children;
+	let r = n.props.children;
+	if (Array.isArray(r)) {
+		let e = r;
+		if (!e[0]?.props?.children) {
+			for (let n of e) if (typeof n == "string" && n.trim().length > 0) return n.toLowerCase().startsWith(t);
+		}
+		return String(e[0].props.children).toLowerCase().startsWith(t);
 	}
-	onScroll = () => {
-		let { isLoadingOnScroll: e } = this.state, { scrollTop: t, offsetHeight: n, scrollHeight: r } = this.tableBody;
-		Math.abs(t + n - r) <= 5 && (e || (this.setState({ isLoadingOnScroll: !0 }), this.props.onScroll().then(() => this.setState({ isLoadingOnScroll: !1 }))));
-	};
-	respondToUserInput = (e) => {
-		let { children: t, setHighlightedIndex: n } = this.props, { scrollHeight: r, childElementCount: i } = this.tableBody, { key: a } = this.state, { index: o } = this.state, s = r / i;
-		switch (e.key) {
+	return String(r).toLowerCase().startsWith(t);
+}
+function It(e, t, n) {
+	let r = e + t;
+	return r === n ? 0 : r < -1 ? n - 1 : r;
+}
+function Lt({ children: t, onScroll: n, className: r = "", isDataLoading: o = !1, setHighlightedIndex: s = () => null }) {
+	let c = u(null), l = u(!1), [p, m] = d(!1), h = u(-1), g = u(null), _ = i(() => {
+		let e = c.current;
+		if (!e) return;
+		let { scrollTop: t, offsetHeight: r, scrollHeight: i } = e;
+		Math.abs(t + r - i) > 5 || l.current || (l.current = !0, m(!0), n().then(() => {
+			l.current = !1, m(!1);
+		}));
+	}, [n]), v = i((n) => {
+		let r = c.current;
+		if (!r) return;
+		let i = e.Children.toArray(t), { scrollHeight: a, childElementCount: o } = r, l = a / o, u = h.current;
+		switch (n.key) {
 			case "ArrowDown":
-				o = this.addToIndex(1, o);
+				u = It(u, 1, i.length);
 				break;
 			case "ArrowUp":
-				o = this.addToIndex(-1, o);
+				u = It(u, -1, i.length);
 				break;
-			default: for (let n = 0; n < t.length; n += 1) if (this.childStartsWithKey(t[n], e.key)) {
-				if (o >= n && a === e.key) continue;
-				o = n;
+			default: for (let e = 0; e < i.length; e++) if (Ft(i[e], n.key)) {
+				if (u >= e && g.current === n.key) continue;
+				u = e;
 				break;
 			}
 		}
-		this.setState({
-			index: o,
-			key: e.key
-		}), o >= 0 && (this.tableBody.scrollTop = o * s, n(o));
-	};
-	childStartsWithKey = (e, t) => {
-		let n = e;
-		for (; typeof n.props.children == "object" && (n = n.props.children, !Array.isArray(n)););
-		if (Array.isArray(n)) {
-			if (!n[0].props.children) {
-				for (let e = 0; e < n.length; e += 1) if (typeof n[e] == "string" && n[e].trim().length > 0) return n[e].toLowerCase().startsWith(t);
-			}
-			return n[0].props.children.toString().toLowerCase().startsWith(t);
-		}
-		return n.props.children.toString().toLowerCase().startsWith(t);
-	};
-	addToIndex(e, t) {
-		let { children: n } = this.props, r = t + e;
-		return r === n.length ? 0 : r < -1 ? n.length - 1 : r;
-	}
-	render() {
-		let { isLoadingOnScroll: e } = this.state, { children: t, className: n, isDataLoading: r } = this.props;
-		return /* @__PURE__ */ N("div", {
-			className: f(Pt.infiniteBlock, n),
-			onScroll: this.onScroll,
-			ref: (e) => {
-				this.tableBody = e;
-			},
-			children: [r ? /* @__PURE__ */ M(H, {}) : t, e && /* @__PURE__ */ M(H, { isScroll: !0 })]
-		});
-	}
-}, Y = {
+		h.current = u, g.current = n.key, u >= 0 && (r.scrollTop = u * l, s(u));
+	}, [t, s]);
+	return a(() => (document.addEventListener("keydown", v), () => document.removeEventListener("keydown", v)), [v]), /* @__PURE__ */ N("div", {
+		className: f(Pt.infiniteBlock, r),
+		onScroll: _,
+		ref: c,
+		children: [o ? /* @__PURE__ */ M(H, {}) : t, p && /* @__PURE__ */ M(H, {})]
+	});
+}
+var Y = {
 	"required-mark": "required-mark_fy7Fm",
 	requiredMark: "required-mark_fy7Fm",
 	dropdown: "dropdown_XTshY",
@@ -1622,8 +1602,8 @@ var Pt = { infiniteBlock: "infiniteBlock_dFv-h" }, Ft = class extends n {
 };
 //#endregion
 //#region package/common/dropdown/dropdown.tsx
-function It({ errorMessage: e = "", className: t = "", label: n = "", value: r = "", isValid: i = !0, tabIndex: o = 0, isRequired: s = !1, customProps: c = {}, isRow: l = !1, disabled: m = !1, onScroll: g = () => Promise.resolve(), isListOnTop: _ = !1, onClick: v, onChange: y, onFocus: b = null, onBlur: x = null, onMouseEnter: S = null, onMouseLeave: C = null, dropdownLabel: w, isDropdownListWider: T = !1, inputClassName: E = "", dropDownIconClassName: ee = "", dropDownClassName: D = "", formValidator: O = null, labelClassName: te = "", dropDownInputClassName: ne = "", items: re = [], useMatLabelStyle: k = !0, placeholder: A = "", plainStyle: j = !1, scrollToSelected: ie = !1, reactRef: P }) {
-	let [F, ae] = d(!1), [oe, se] = d(!1), [, ce] = d(0), L = u(O);
+function Rt({ errorMessage: e = "", className: t = "", label: n = "", value: r = "", isValid: i = !0, tabIndex: o = 0, isRequired: s = !1, customProps: c = {}, isRow: l = !1, disabled: m = !1, onScroll: g = () => Promise.resolve(), isListOnTop: _ = !1, onClick: v, onChange: y, onFocus: b = null, onBlur: x = null, onMouseEnter: S = null, onMouseLeave: C = null, dropdownLabel: w, isDropdownListWider: T = !1, inputClassName: E = "", dropDownIconClassName: ee = "", dropDownClassName: D = "", formValidator: O = null, labelClassName: te = "", dropDownInputClassName: ne = "", items: re = [], useMatLabelStyle: k = !0, placeholder: A = "", plainStyle: j = !1, scrollToSelected: ie = !1, reactRef: P }) {
+	let [F, I] = d(!1), [oe, se] = d(!1), [, ce] = d(0), L = u(O);
 	a(() => {
 		if (L.current = O, !L.current) return;
 		L.current.label = n ?? "", L.current.validate();
@@ -1635,9 +1615,9 @@ function It({ errorMessage: e = "", className: t = "", label: n = "", value: r =
 	}, ue = (e) => {
 		se(!1), C?.(e);
 	}, de = (e) => {
-		ae(!0), b?.(e);
+		I(!0), b?.(e);
 	}, fe = (e) => {
-		L.current && (L.current.touched = !0), ae(!1), x?.(e);
+		L.current && (L.current.touched = !0), I(!1), x?.(e);
 	}, pe = () => O ? O.touched && O.hasError() : !i || !!e, R = () => !!(s || O?.validators.find((e) => e.validatorId === "required")), me = (e) => {
 		O ? (O.set(e), y?.(O.value, c)) : y?.(e, c);
 	}, he = w, z = O ? O.value : r, B = pe();
@@ -1648,7 +1628,7 @@ function It({ errorMessage: e = "", className: t = "", label: n = "", value: r =
 		onMouseEnter: le,
 		onMouseLeave: ue,
 		children: [
-			/* @__PURE__ */ M(I, {
+			/* @__PURE__ */ M(ae, {
 				onChange: (e) => me((e || { key: "" }).key),
 				itemToString: (e) => e ? String(e.key) : "",
 				selectedItem: re.find((e) => e.key === z) ?? null,
@@ -1692,14 +1672,13 @@ function It({ errorMessage: e = "", className: t = "", label: n = "", value: r =
 								className: f(Y.dropdownInputButtonIconArrow, { [Y.dropdownInputButtonIconArrowOpen]: r })
 							})
 						}),
-						!m && r ? /* @__PURE__ */ M(Ft, {
+						!m && r ? /* @__PURE__ */ M(Lt, {
 							onScroll: g,
 							className: f(Y.dropdownInputList, {
 								[Y.dropdownInputListOnTop]: _,
 								[Y.dropdownInputListWider]: T
 							}),
 							setHighlightedIndex: s,
-							highlightedIndex: a,
 							children: re.map((t, n) => /* @__PURE__ */ M("div", {
 								...e({
 									index: n,
@@ -1751,7 +1730,7 @@ function It({ errorMessage: e = "", className: t = "", label: n = "", value: r =
 		]
 	});
 }
-var Lt = {
+var zt = {
 	datePicker: "datePicker_ZohTp",
 	"datePicker-header": "datePicker-header_YmSWE",
 	datePickerHeader: "datePicker-header_YmSWE",
@@ -1768,8 +1747,8 @@ var Lt = {
 };
 //#endregion
 //#region package/common/datePicker/datePicker.tsx
-function Rt({ className: e = "", selected: t, onSelect: n = () => null, formValidator: r = null, noInput: i = !1, noHeader: o = !1, isModal: s = !1, isInline: c = !1, onChange: l = () => null, minDate: p = null, maxDate: m = null, children: h = null, showClearButton: v = !1, label: y = "", isValid: b = !0, errorMessage: x = "", isRequired: S = !1, startDate: C, endDate: w }) {
-	let T = () => r ? r.value : t, E = T() ?? /* @__PURE__ */ new Date(), [ee, D] = d(E.getMonth() + 1), [O, te] = d(E.getFullYear()), [ne, re] = d(!1), [k, A] = d(() => T() ? Ot(E) : ""), [j, P] = d(!1), [F, I] = d(!1), [, oe] = d(0), [se, ce] = d(t), L = u(r);
+function Bt({ className: e = "", selected: t, onSelect: n = () => null, formValidator: r = null, noInput: i = !1, noHeader: o = !1, isModal: s = !1, isInline: c = !1, onChange: l = () => null, minDate: p = null, maxDate: m = null, children: h = null, showClearButton: v = !1, label: y = "", isValid: b = !0, errorMessage: x = "", isRequired: S = !1, startDate: C, endDate: w }) {
+	let T = () => r ? r.value : t, E = T() ?? /* @__PURE__ */ new Date(), [ee, D] = d(E.getMonth() + 1), [O, te] = d(E.getFullYear()), [ne, re] = d(!1), [k, A] = d(() => T() ? Ot(E) : ""), [j, P] = d(!1), [ae, I] = d(!1), [, oe] = d(0), [se, ce] = d(t), L = u(r);
 	if (se !== t) {
 		ce(t);
 		let e = t ?? /* @__PURE__ */ new Date();
@@ -1810,31 +1789,31 @@ function Rt({ className: e = "", selected: t, onSelect: n = () => null, formVali
 		}));
 	}, z = T(), B = le(), ge = /* @__PURE__ */ N(ie, { children: [
 		o ? null : /* @__PURE__ */ N("div", {
-			className: Lt.datePickerHeader,
+			className: zt.datePickerHeader,
 			children: [
 				/* @__PURE__ */ M(Fe, {
 					icon: g,
 					onClick: () => pe(-1)
 				}),
 				/* @__PURE__ */ M("div", {
-					className: Lt.datePickerHeaderMonthAndYearContainer,
+					className: zt.datePickerHeaderMonthAndYearContainer,
 					children: /* @__PURE__ */ N("div", {
-						className: Lt.datePickerHeaderMonthAndYear,
-						children: [/* @__PURE__ */ M(It, {
+						className: zt.datePickerHeaderMonthAndYear,
+						children: [/* @__PURE__ */ M(Rt, {
 							plainStyle: !0,
 							scrollToSelected: !0,
 							onChange: (e) => D(e),
-							className: Lt.datePickerHeaderMonth,
+							className: zt.datePickerHeaderMonth,
 							value: Ct(bt("-"), O, ee, 1),
 							items: wt().map((e, t) => ({
 								key: t + 1,
 								label: e
 							}))
-						}), /* @__PURE__ */ M(It, {
+						}), /* @__PURE__ */ M(Rt, {
 							plainStyle: !0,
 							scrollToSelected: !0,
 							useMatLabelStyle: !1,
-							className: Lt.datePickerHeaderYear,
+							className: zt.datePickerHeaderYear,
 							onChange: (e) => te(e),
 							value: O,
 							items: he()
@@ -1848,7 +1827,7 @@ function Rt({ className: e = "", selected: t, onSelect: n = () => null, formVali
 			]
 		}),
 		/* @__PURE__ */ M(Nt, {
-			className: Lt.datePickerMonth,
+			className: zt.datePickerMonth,
 			month: ee,
 			year: O,
 			onSelect: fe,
@@ -1868,7 +1847,7 @@ function Rt({ className: e = "", selected: t, onSelect: n = () => null, formVali
 		value: k,
 		onChange: (e) => A(e),
 		onClick: () => re(!0),
-		customInput: /* @__PURE__ */ M(ae, {
+		customInput: /* @__PURE__ */ M(F, {
 			mask: "99.99.9999",
 			maskPlaceholder: "_",
 			beforeMaskedStateChange: me
@@ -1894,29 +1873,29 @@ function Rt({ className: e = "", selected: t, onSelect: n = () => null, formVali
 		children: _e
 	});
 	return /* @__PURE__ */ N("div", {
-		className: f(Lt.datePicker, e),
+		className: f(zt.datePicker, e),
 		children: [
 			(s || c) && _e,
 			ve,
 			/* @__PURE__ */ M(Qe, {
 				variant: "error",
 				message: r ? r.getCurrentErrorMessage() : x || "",
-				isVisible: B && (j || F)
+				isVisible: B && (j || ae)
 			})
 		]
 	});
 }
-var zt = { emptyState: "emptyState_KXOIx" };
+var Vt = { emptyState: "emptyState_KXOIx" };
 //#endregion
 //#region package/common/emptyState/emptyState.tsx
-function Bt({ className: e, icon: t, children: n, ...r }) {
+function Ht({ className: e, icon: t, children: n, ...r }) {
 	return /* @__PURE__ */ N("div", {
 		...r,
-		className: f(zt.emptyState, e),
+		className: f(Vt.emptyState, e),
 		children: [t && /* @__PURE__ */ M(p, { icon: t }), /* @__PURE__ */ M("div", { children: n ?? "No entries available" })]
 	});
 }
-var Vt = {
+var Ut = {
 	fab: "fab_hyAAa",
 	"fab-content": "fab-content_IBiXm",
 	fabContent: "fab-content_IBiXm",
@@ -1924,19 +1903,19 @@ var Vt = {
 	fabContentContainer: "fab-content-container_FQD1x",
 	"fab-size-mini": "fab-size-mini_KP9BD",
 	fabSizeMini: "fab-size-mini_KP9BD"
-}, Ht = {
+}, Wt = {
 	default: null,
-	mini: Vt.fabSizeMini
+	mini: Ut.fabSizeMini
 };
-function Ut({ children: e = null, size: t = "default", className: n = "", styleType: r = U.Primary, onClick: i = () => {} }) {
+function Gt({ children: e = null, size: t = "default", className: n = "", styleType: r = U.Primary, onClick: i = () => {} }) {
 	return /* @__PURE__ */ M(W, {
 		styleType: r,
-		className: f(Vt.fab, Ht[t], n),
+		className: f(Ut.fab, Wt[t], n),
 		onClick: i,
 		children: /* @__PURE__ */ M("div", {
-			className: Vt.fabContentContainer,
+			className: Ut.fabContentContainer,
 			children: /* @__PURE__ */ M("div", {
-				className: Vt.fabContent,
+				className: Ut.fabContent,
 				children: e
 			})
 		})
@@ -1972,7 +1951,7 @@ var X = {
 };
 //#endregion
 //#region package/common/fab/fab.tsx
-function Wt({ children: e = null, size: t = "default", menuEntries: n = [], onMenuEntryClicked: r = () => {}, onClick: i = () => {}, closeMenuOnEntryClicked: a = !0, ...o }) {
+function Kt({ children: e = null, size: t = "default", menuEntries: n = [], onMenuEntryClicked: r = () => {}, onClick: i = () => {}, closeMenuOnEntryClicked: a = !0, ...o }) {
 	let [s, c] = d(!1);
 	function l() {
 		n.length > 0 && c((e) => !e), i();
@@ -1992,7 +1971,7 @@ function Wt({ children: e = null, size: t = "default", menuEntries: n = [], onMe
 			}),
 			/* @__PURE__ */ M("div", {
 				onClick: (e) => e.stopPropagation(),
-				children: /* @__PURE__ */ M(Ut, {
+				children: /* @__PURE__ */ M(Gt, {
 					className: X.fab,
 					size: t,
 					onClick: l,
@@ -2019,7 +1998,7 @@ function Wt({ children: e = null, size: t = "default", menuEntries: n = [], onMe
 							className: X.fabMenuEntryLabel,
 							children: t
 						})
-					}), /* @__PURE__ */ M(Ut, {
+					}), /* @__PURE__ */ M(Gt, {
 						size: "mini",
 						children: /* @__PURE__ */ M(p, { icon: n })
 					})]
@@ -2030,7 +2009,7 @@ function Wt({ children: e = null, size: t = "default", menuEntries: n = [], onMe
 }
 //#endregion
 //#region package/common/icon/svg/can.jsx
-var Gt = (e) => /* @__PURE__ */ M("svg", {
+var qt = (e) => /* @__PURE__ */ M("svg", {
 	xmlns: "http://www.w3.org/2000/svg",
 	viewBox: "-1.02083 -3.15 21.04 17.65",
 	...e,
@@ -2039,57 +2018,39 @@ var Gt = (e) => /* @__PURE__ */ M("svg", {
 		strokeWidth: "1",
 		fill: "none"
 	})
-}), Kt = ({ type: e, ...t }) => {
+}), Jt = ({ type: e, ...t }) => {
 	switch (e) {
-		case "can": return /* @__PURE__ */ M(Gt, { ...t });
+		case "can": return /* @__PURE__ */ M(qt, { ...t });
 		default: return null;
 	}
 };
-Kt.propTypes = { type: F.string.isRequired };
+Jt.propTypes = { type: I.string.isRequired };
 //#endregion
 //#region package/common/icon/index.js
-var qt = Kt, Jt = class extends t {
-	static propTypes = {
-		children: F.node,
-		idleAfterSeconds: F.number,
-		renderCondition: F.bool
-	};
-	static defaultProps = {
-		children: null,
-		idleAfterSeconds: 600,
-		renderCondition: !0
-	};
-	constructor(e) {
-		super(e);
-	}
-	state = { isIdleContentShown: !1 };
-	#e;
-	componentDidMount() {
-		this.resetIdleTimeout(), this.registerHandlers();
-	}
-	componentDidUpdate(e) {
-		e.idleAfterSeconds !== this.props.idleAfterSeconds && this.resetIdleTimeout();
-	}
-	componentWillUnmount() {
-		this.unregisterhandlers();
-	}
-	registerHandlers() {
-		document.addEventListener("click", this.resetIdleTimeout), document.addEventListener("mousemove", this.resetIdleTimeout), document.addEventListener("mousemove", this.resetIdleTimeout), document.addEventListener("keydown", this.resetIdleTimeout), document.addEventListener("scroll", this.resetIdleTimeout), document.addEventListener("touchstart", this.resetIdleTimeout);
-	}
-	unregisterhandlers() {
-		document.removeEventListener("click", this.resetIdleTimeout), document.removeEventListener("mousemove", this.resetIdleTimeout), document.removeEventListener("keydown", this.resetIdleTimeout), document.removeEventListener("scroll", this.resetIdleTimeout), document.addEventListener("touchstart", this.resetIdleTimeout);
-	}
-	resetIdleTimeout = () => {
-		let { idleAfterSeconds: e } = this.props, { isIdleContentShown: t } = this.state;
-		this.#e && clearTimeout(this.#e), t && this.setState({ isIdleContentShown: !1 }), this.#e = setTimeout(() => {
-			this.setState({ isIdleContentShown: !0 });
-		}, e * 1e3);
-	};
-	render() {
-		let { children: e, renderCondition: t } = this.props, { isIdleContentShown: n } = this.state;
-		return /* @__PURE__ */ M(ie, { children: t && n && e });
-	}
-}, Yt = {
+var Yt = Jt, Xt = [
+	"click",
+	"mousemove",
+	"keydown",
+	"scroll",
+	"touchstart"
+];
+function Zt({ children: e = null, idleAfterSeconds: t = 600, renderCondition: n = !0 }) {
+	let [r, o] = d(!1), s = u(null), c = i(() => {
+		s.current !== null && clearTimeout(s.current), o(!1), s.current = setTimeout(() => {
+			o(!0);
+		}, t * 1e3);
+	}, [t]);
+	return a(() => {
+		c();
+	}, [c]), a(() => {
+		for (let e of Xt) document.addEventListener(e, c);
+		return () => {
+			for (let e of Xt) document.removeEventListener(e, c);
+			s.current !== null && clearTimeout(s.current);
+		};
+	}, [c]), /* @__PURE__ */ M(ie, { children: n && r && e });
+}
+var Qt = {
 	board: "board_6KRdw",
 	column: "column_NrNeF",
 	"column-empty": "column-empty_5KYsJ",
@@ -2107,7 +2068,7 @@ var qt = Kt, Jt = class extends t {
 };
 //#endregion
 //#region package/common/kanbanBoard/KanbanItem.tsx
-function Xt({ id: e, children: t }) {
+function $t({ id: e, children: t }) {
 	let { attributes: n, listeners: r, setNodeRef: i, transform: a, transition: o, isDragging: s } = R({ id: e });
 	return /* @__PURE__ */ M("div", {
 		ref: i,
@@ -2115,7 +2076,7 @@ function Xt({ id: e, children: t }) {
 			transform: he.Transform.toString(a),
 			transition: o
 		},
-		className: f(Yt.item, s && Yt.itemDragging),
+		className: f(Qt.item, s && Qt.itemDragging),
 		...n,
 		...r,
 		children: t
@@ -2123,12 +2084,12 @@ function Xt({ id: e, children: t }) {
 }
 //#endregion
 //#region package/common/kanbanBoard/KanbanColumn.tsx
-function Zt({ id: e, title: t, itemIds: n, items: r, renderItem: i, className: a, classNames: o, styles: s }) {
+function en({ id: e, title: t, itemIds: n, items: r, renderItem: i, className: a, classNames: o, styles: s }) {
 	let { setNodeRef: c, isOver: l } = le({ id: `column-${e}` });
 	return /* @__PURE__ */ N("div", {
-		className: f(Yt.column, l && Yt.columnOver, n.length === 0 && Yt.columnEmpty, a),
+		className: f(Qt.column, l && Qt.columnOver, n.length === 0 && Qt.columnEmpty, a),
 		children: [/* @__PURE__ */ M("div", {
-			className: f(Yt.columnHeader, o?.header),
+			className: f(Qt.columnHeader, o?.header),
 			style: s?.header,
 			children: t
 		}), /* @__PURE__ */ M(fe, {
@@ -2136,9 +2097,9 @@ function Zt({ id: e, title: t, itemIds: n, items: r, renderItem: i, className: a
 			strategy: me,
 			children: /* @__PURE__ */ M("div", {
 				ref: c,
-				className: f(Yt.columnItems, o?.items),
+				className: f(Qt.columnItems, o?.items),
 				style: s?.items,
-				children: n.map((e) => /* @__PURE__ */ M(Xt, {
+				children: n.map((e) => /* @__PURE__ */ M($t, {
 					id: e,
 					children: r[e] === void 0 ? null : i(r[e], e)
 				}, e))
@@ -2148,7 +2109,7 @@ function Zt({ id: e, title: t, itemIds: n, items: r, renderItem: i, className: a
 }
 //#endregion
 //#region package/common/kanbanBoard/KanbanBoard.tsx
-function Qt({ columns: e, items: t, renderItem: n, onChange: r, className: i, style: a, classNames: o, styles: s }) {
+function tn({ columns: e, items: t, renderItem: n, onChange: r, className: i, style: a, classNames: o, styles: s }) {
 	let [c, l] = d(null), [u, p] = d(null), m = de(ue(ce, { activationConstraint: { distance: 8 } })), h = u ?? e;
 	function g(e, t) {
 		return e.findIndex((e) => e.itemIds.includes(t));
@@ -2205,9 +2166,9 @@ function Qt({ columns: e, items: t, renderItem: n, onChange: r, className: i, st
 		onDragOver: v,
 		onDragEnd: y,
 		children: [/* @__PURE__ */ M("div", {
-			className: f(Yt.board, i),
+			className: f(Qt.board, i),
 			style: a,
-			children: h.map((e) => /* @__PURE__ */ M(Zt, {
+			children: h.map((e) => /* @__PURE__ */ M(en, {
 				id: e.id,
 				title: e.title,
 				itemIds: e.itemIds,
@@ -2215,13 +2176,13 @@ function Qt({ columns: e, items: t, renderItem: n, onChange: r, className: i, st
 				renderItem: n
 			}, e.id))
 		}), /* @__PURE__ */ M(se, { children: c && t[c] !== void 0 ? /* @__PURE__ */ M("div", {
-			className: f(Yt.dragOverlay, o?.dragOverlay),
+			className: f(Qt.dragOverlay, o?.dragOverlay),
 			style: s?.dragOverlay,
 			children: n(t[c], c)
 		}) : null })]
 	});
 }
-var $t = {
+var nn = {
 	iconLoading: "iconLoading_wovj4",
 	"spin-to-oblivion": "spin-to-oblivion_0tZtm",
 	spinToOblivion: "spin-to-oblivion_0tZtm",
@@ -2236,39 +2197,39 @@ var $t = {
 };
 //#endregion
 //#region package/common/loading/iconLoading/iconLoading.tsx
-function en({ className: e = "" }) {
+function rn({ className: e = "" }) {
 	return /* @__PURE__ */ M("div", {
-		className: f($t.iconLoading, e),
+		className: f(nn.iconLoading, e),
 		children: /* @__PURE__ */ N("svg", {
 			xmlns: "http://www.w3.org/2000/svg",
 			viewBox: "-8 -1 16 14",
 			children: [
 				/* @__PURE__ */ M("path", {
-					className: $t.iconLoadingFirst,
+					className: nn.iconLoadingFirst,
 					d: "M 0 0 C 3 5 6 5 6 12",
 					strokeWidth: "1.7",
 					fill: "none"
 				}),
 				/* @__PURE__ */ M("path", {
-					className: $t.iconLoadingFirst,
+					className: nn.iconLoadingFirst,
 					d: "M 0 0 C -3 5 -6 5 -6 12",
 					strokeWidth: "1.7",
 					fill: "none"
 				}),
 				/* @__PURE__ */ M("path", {
-					className: $t.iconLoadingFirst,
+					className: nn.iconLoadingFirst,
 					d: "M 0 0 L 0 10",
 					strokeWidth: "1.7",
 					fill: "none"
 				}),
 				/* @__PURE__ */ M("path", {
-					className: $t.iconLoadingSecond,
+					className: nn.iconLoadingSecond,
 					d: "M 0.1 10 C -3 10 -4 10 -6 12",
 					strokeWidth: "1.7",
 					fill: "none"
 				}),
 				/* @__PURE__ */ M("path", {
-					className: $t.iconLoadingSecond,
+					className: nn.iconLoadingSecond,
 					d: "M -0.1 10 C 3 10 4 10 6 12",
 					strokeWidth: "1.7",
 					fill: "none"
@@ -2279,10 +2240,10 @@ function en({ className: e = "" }) {
 }
 //#endregion
 //#region package/common/loading/iconLoading/index.ts
-var tn = en, nn = { numberInput: "numberInput_7p2O3" };
+var an = rn, on = { numberInput: "numberInput_7p2O3" };
 //#endregion
 //#region package/common/numberInput/numberInput.tsx
-function rn({ value: e, onChange: t, formValidator: n, label: r, error: i, className: a, allowNegative: o = !1, decimalSeparator: s, thousandSeparator: c, prefix: l, suffix: u, decimalScale: d, placeholder: p, sign: m, ...h }) {
+function sn({ value: e, onChange: t, formValidator: n, label: r, error: i, className: a, allowNegative: o = !1, decimalSeparator: s, thousandSeparator: c, prefix: l, suffix: u, decimalScale: d, placeholder: p, sign: m, ...h }) {
 	let g = n == null ? e : n.value, _ = m != null && g != null ? Math.abs(Number(g)) : g, v = _ == null ? "" : String(_);
 	function y(e) {
 		let r = e;
@@ -2291,7 +2252,7 @@ function rn({ value: e, onChange: t, formValidator: n, label: r, error: i, class
 	let b = m === "-" ? "-" : m === "+" ? "+" : l;
 	return /* @__PURE__ */ M($e, {
 		label: r,
-		className: f(nn.numberInput, a),
+		className: f(on.numberInput, a),
 		value: v,
 		onChange: () => {},
 		formValidator: null,
@@ -2313,29 +2274,31 @@ function rn({ value: e, onChange: t, formValidator: n, label: r, error: i, class
 }
 //#endregion
 //#region package/common/numberInput/index.ts
-var an = rn, on = {
+var cn = sn, ln = {
 	optionPicker: "optionPicker_Yx82s",
 	"optionPicker-chip": "optionPicker-chip_ywtvr",
 	optionPickerChip: "optionPicker-chip_ywtvr",
 	"optionPicker-option": "optionPicker-option_uq0vK",
-	optionPickerOption: "optionPicker-option_uq0vK"
+	optionPickerOption: "optionPicker-option_uq0vK",
+	"optionPicker-option-active": "optionPicker-option-active_yUECW",
+	optionPickerOptionActive: "optionPicker-option-active_yUECW"
 };
 //#endregion
 //#region package/common/optionPicker/optionPicker.tsx
-function sn({ className: e = void 0, options: t, onChange: n, value: r, ...i }) {
+function un({ className: e = void 0, options: t, onChange: n, value: r, ...i }) {
 	let a = t.findIndex((e) => e.key === r) * 100 / t.length;
 	return /* @__PURE__ */ N("div", {
 		...i,
-		className: f(on.optionPicker, e),
+		className: f(ln.optionPicker, e),
 		children: [/* @__PURE__ */ M("div", {
-			className: on.optionPickerChip,
+			className: ln.optionPickerChip,
 			style: {
 				left: `${a}%`,
 				width: `${100 / t.length}%`
 			}
 		}), t.map((e) => /* @__PURE__ */ M(Ne, {
 			onClick: (t) => n(e.key, t),
-			className: f(on.optionPickerOption),
+			className: f(ln.optionPickerOption, e.key === r && ln.optionPickerOptionActive),
 			tabIndex: e.key === r ? -1 : 0,
 			children: e.label
 		}, e.key))]
@@ -2343,25 +2306,25 @@ function sn({ className: e = void 0, options: t, onChange: n, value: r, ...i })
 }
 //#endregion
 //#region package/hooks/useWindowSize.ts
-var cn = 768;
-function ln() {
+var dn = 768;
+function fn() {
 	let [e, t] = d(() => ({
 		width: window.innerWidth,
 		height: window.innerHeight,
-		isMobileSize: window.innerWidth < cn
+		isMobileSize: window.innerWidth < dn
 	}));
 	return a(() => {
 		function e() {
 			t({
 				width: window.innerWidth,
 				height: window.innerHeight,
-				isMobileSize: window.innerWidth < cn
+				isMobileSize: window.innerWidth < dn
 			});
 		}
 		return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
 	}, []), e;
 }
-var un = {
+var pn = {
 	overscroll: "overscroll_Ij750",
 	"overscroll-header": "overscroll-header_S6vYc",
 	overscrollHeader: "overscroll-header_S6vYc",
@@ -2372,8 +2335,8 @@ var un = {
 };
 //#endregion
 //#region package/common/overscroll/overscroll.tsx
-function dn({ children: e = null, overscrollContent: t = null, overscrollContentDesktop: n = null, centerHeader: r = !0, min: o = 10, max: s = 80, start: c = 30, unit: l = "%", mobileOnly: d = !0, onScrollChange: p = () => {}, scrollDisabled: m = !1 }) {
-	let { isMobileSize: h, height: g } = ln(), _ = u(null), v = u(null), y = u(null), b = u(!1), x = u(null), S = u(p);
+function mn({ children: e = null, overscrollContent: t = null, overscrollContentDesktop: n = null, centerHeader: r = !0, min: o = 10, max: s = 80, start: c = 30, unit: l = "%", mobileOnly: d = !0, onScrollChange: p = () => {}, scrollDisabled: m = !1 }) {
+	let { isMobileSize: h, height: g } = fn(), _ = u(null), v = u(null), y = u(null), b = u(!1), x = u(null), S = u(p);
 	S.current = p;
 	let C = i((e) => {
 		let t;
@@ -2431,15 +2394,15 @@ function dn({ children: e = null, overscrollContent: t = null, overscrollContent
 	if (d && !h) return n ? /* @__PURE__ */ N("div", { children: [n, e] }) : /* @__PURE__ */ M(ie, { children: e });
 	let O = l === "%" ? `${100 - o}%` : `calc(100% - ${o}px)`;
 	return /* @__PURE__ */ N("div", {
-		className: un.overscroll,
+		className: pn.overscroll,
 		ref: _,
 		onScroll: D,
 		children: [/* @__PURE__ */ M("div", {
-			className: un.overscrollHeaderContainer,
+			className: pn.overscrollHeaderContainer,
 			style: { height: `${s}${l}` },
 			ref: y,
 			children: /* @__PURE__ */ M("div", {
-				className: f(un.overscrollHeader, r && un.overscrollHeaderCentered),
+				className: f(pn.overscrollHeader, r && pn.overscrollHeaderCentered),
 				ref: v,
 				children: t
 			})
@@ -2449,7 +2412,7 @@ function dn({ children: e = null, overscrollContent: t = null, overscrollContent
 		})]
 	});
 }
-var fn = {
+var hn = {
 	progressBar: "progressBar_LO0sX",
 	"progressBar-fill": "progressBar-fill_rt32j",
 	progressBarFill: "progressBar-fill_rt32j",
@@ -2462,17 +2425,17 @@ var fn = {
 };
 //#endregion
 //#region package/common/progressBar/progressBar.tsx
-function pn(e) {
+function gn(e) {
 	let t = e.replace("#", ""), n = parseInt(t.substring(0, 2), 16), r = parseInt(t.substring(2, 4), 16), i = parseInt(t.substring(4, 6), 16);
 	return (.299 * n + .587 * r + .114 * i) / 255 > .5 ? "#000000" : "#ffffff";
 }
-function mn({ className: e = void 0, total: t = 100, progress: n = 0, style: r = void 0, ...i }) {
+function _n({ className: e = void 0, total: t = 100, progress: n = 0, style: r = void 0, ...i }) {
 	function a() {
 		let e = [];
 		return Array.isArray(n) ? e.push(...n) : typeof n == "object" ? e.push(n) : e.push({ amount: n }), e.map((n, i) => {
 			let a = t ? n.amount / t * 100 : 0;
 			return /* @__PURE__ */ M("div", {
-				className: f(fn.progressBarFill, i === e.length - 1 && fn.progressBarFillEnd, n.class),
+				className: f(hn.progressBarFill, i === e.length - 1 && hn.progressBarFillEnd, n.class),
 				style: {
 					width: `${a}%`,
 					background: n.color || void 0,
@@ -2480,8 +2443,8 @@ function mn({ className: e = void 0, total: t = 100, progress: n = 0, style: r =
 				},
 				title: n.label ? `${n.label}: ${n.amount}` : void 0,
 				children: n.label && /* @__PURE__ */ M("div", {
-					className: fn.progressBarLabel,
-					style: n.color ? { color: pn(n.color) } : {},
+					className: hn.progressBarLabel,
+					style: n.color ? { color: gn(n.color) } : {},
 					children: n.label
 				})
 			}, i);
@@ -2489,21 +2452,21 @@ function mn({ className: e = void 0, total: t = 100, progress: n = 0, style: r =
 	}
 	return /* @__PURE__ */ M("div", {
 		...i,
-		className: f(fn.progressBar, e),
+		className: f(hn.progressBar, e),
 		style: r,
 		children: a()
 	});
 }
-function hn(e) {
+function vn(e) {
 	return Math.round(e / 5) * 5;
 }
-function gn(e) {
+function yn(e) {
 	return {
-		x: hn(e.x),
-		y: hn(e.y)
+		x: vn(e.x),
+		y: vn(e.y)
 	};
 }
-function _n(e, t, n) {
+function bn(e, t, n) {
 	let r = n.createSVGPoint();
 	r.x = e, r.y = t;
 	let i = n.getScreenCTM();
@@ -2512,18 +2475,18 @@ function _n(e, t, n) {
 		y: 0
 	};
 	let a = r.matrixTransform(i.inverse());
-	return gn({
+	return yn({
 		x: a.x,
 		y: a.y
 	});
 }
-function vn(e, t) {
+function xn(e, t) {
 	return Math.sqrt((e.x - t.x) ** 2 + (e.y - t.y) ** 2);
 }
-function yn(e, t, n) {
+function Sn(e, t, n) {
 	let r = n.x - t.x, i = n.y - t.y, a = r * r + i * i;
 	if (a === 0) return {
-		dist: vn(e, t),
+		dist: xn(e, t),
 		t: 0
 	};
 	let o = Math.max(0, Math.min(1, ((e.x - t.x) * r + (e.y - t.y) * i) / a)), s = t.x + o * r, c = t.y + o * i;
@@ -2532,12 +2495,12 @@ function yn(e, t, n) {
 		t: o
 	};
 }
-function bn(e, t) {
+function Cn(e, t) {
 	let n = null;
 	for (let r of t) {
 		let t = r.points;
 		for (let i = 0; i < t.length; i++) {
-			let a = t[i], o = t[(i + 1) % t.length], { dist: s, t: c } = yn(e, a, o);
+			let a = t[i], o = t[(i + 1) % t.length], { dist: s, t: c } = Sn(e, a, o);
 			s <= 8 && (!n || s < n.dist) && (n = {
 				roomId: r.id,
 				wallIndex: i,
@@ -2548,7 +2511,7 @@ function bn(e, t) {
 	}
 	return n;
 }
-function xn(e, t) {
+function wn(e, t) {
 	let n = !1;
 	for (let r = 0, i = t.length - 1; r < t.length; i = r++) {
 		let a = t[r].x, o = t[r].y, s = t[i].x, c = t[i].y;
@@ -2556,13 +2519,13 @@ function xn(e, t) {
 	}
 	return n;
 }
-function Sn(e) {
+function Tn(e) {
 	return {
 		x: e.reduce((e, t) => e + t.x, 0) / e.length,
 		y: e.reduce((e, t) => e + t.y, 0) / e.length
 	};
 }
-function Cn(e, t, n, r) {
+function En(e, t, n, r) {
 	return [
 		{
 			x: e,
@@ -2582,7 +2545,7 @@ function Cn(e, t, n, r) {
 		}
 	];
 }
-function wn(e, t, n, r) {
+function Dn(e, t, n, r) {
 	let i = t.x - e.x, a = t.y - e.y, o = Math.sqrt(i * i + a * a);
 	if (o < .001) return null;
 	let s = i / o, c = a / o, l = e.x + i * n, u = e.y + a * n, d = Math.min(r / 2, o / 2 - .001);
@@ -2601,13 +2564,13 @@ function wn(e, t, n, r) {
 		}
 	};
 }
-function Tn(e) {
+function On(e) {
 	return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
-function En(e) {
+function kn(e) {
 	return e.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x.toFixed(2)},${e.y.toFixed(2)}`).join(" ") + " Z";
 }
-function Dn(e, t) {
+function An(e, t) {
 	if (e.length < 2) return [];
 	if (t.length === 0) return [e.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x.toFixed(2)},${e.y.toFixed(2)}`).join(" ") + " Z"];
 	let n = e.length, r = [], i = [`M ${e[0].x.toFixed(2)},${e[0].y.toFixed(2)}`];
@@ -2630,8 +2593,8 @@ function Dn(e, t) {
 	}
 	return r[0] = [...i, ...r[0].slice(1)], r.map((e) => e.join(" "));
 }
-function On(e, t, n) {
-	let r = wn(e, t, n.t, n.width);
+function jn(e, t, n) {
+	let r = Dn(e, t, n.t, n.width);
 	if (!r) return "";
 	let { p1: i, p2: a, perp: o } = r, s = {
 		x: i.x + o.x * n.width,
@@ -2639,7 +2602,7 @@ function On(e, t, n) {
 	};
 	return [`M ${i.x.toFixed(2)},${i.y.toFixed(2)} L ${a.x.toFixed(2)},${a.y.toFixed(2)}`, `M ${i.x.toFixed(2)},${i.y.toFixed(2)} A ${n.width},${n.width} 0 0,1 ${s.x.toFixed(2)},${s.y.toFixed(2)}`].join(" ");
 }
-function kn(e, t) {
+function Mn(e, t) {
 	let n = Infinity, r = Infinity, i = -Infinity, a = -Infinity;
 	for (let t of e) for (let e of t.points) e.x < n && (n = e.x), e.y < r && (r = e.y), e.x > i && (i = e.x), e.y > a && (a = e.y);
 	isFinite(n) || (n = 0, r = 0, i = 400, a = 300);
@@ -2649,10 +2612,10 @@ function kn(e, t) {
 		(i - n + 10).toFixed(2),
 		(a - r + 10).toFixed(2)
 	].join(" "), s = e.map((e) => {
-		let n = t.filter((t) => t.roomId === e.id), r = Dn(e.points, n), i = En(e.points), a = Sn(e.points), o = r.map((e) => `    <path d="${e}" />`).join("\n"), s = n.map((t) => {
-			let n = e.points[t.wallIndex], r = e.points[(t.wallIndex + 1) % e.points.length], i = On(n, r, t);
+		let n = t.filter((t) => t.roomId === e.id), r = An(e.points, n), i = kn(e.points), a = Tn(e.points), o = r.map((e) => `    <path d="${e}" />`).join("\n"), s = n.map((t) => {
+			let n = e.points[t.wallIndex], r = e.points[(t.wallIndex + 1) % e.points.length], i = jn(n, r, t);
 			return i ? `    <path d="${i}" fill="none" />` : "";
-		}).filter(Boolean).join("\n"), c = e.name ? `    <text fontSize="5" x="${a.x.toFixed(1)}" y="${a.y.toFixed(1)}">${Tn(e.name)}</text>` : "";
+		}).filter(Boolean).join("\n"), c = e.name ? `    <text fontSize="5" x="${a.x.toFixed(1)}" y="${a.y.toFixed(1)}">${On(e.name)}</text>` : "";
 		return [
 			`  <g id="${e.id}">`,
 			o,
@@ -2671,7 +2634,7 @@ function kn(e, t) {
 		"</svg>"
 	].join("\n");
 }
-function An(e) {
+function Nn(e) {
 	let t = [];
 	for (let n of e.matchAll(/[ML]\s*([-\d.]+)[,\s]+([-\d.]+)/gi)) t.push({
 		x: parseFloat(n[1]),
@@ -2679,14 +2642,14 @@ function An(e) {
 	});
 	return t;
 }
-function jn(e) {
+function Pn(e) {
 	let t = new DOMParser().parseFromString(e, "image/svg+xml"), n = [];
 	return t.querySelectorAll("[id^=\"room\"]").forEach((e) => {
 		let t = e.querySelector("[id=\"background\"]");
 		if (!t) return;
 		let r = t.getAttribute("d");
 		if (!r) return;
-		let i = An(r);
+		let i = Nn(r);
 		if (i.length < 3) return;
 		let a = e.querySelector("text")?.textContent?.trim() ?? "";
 		n.push({
@@ -2696,8 +2659,8 @@ function jn(e) {
 		});
 	}), n;
 }
-function Mn(e, t) {
-	let n = kn(e, t), r = new Blob([n], { type: "image/svg+xml" }), i = URL.createObjectURL(r), a = document.createElement("a");
+function Fn(e, t) {
+	let n = Mn(e, t), r = new Blob([n], { type: "image/svg+xml" }), i = URL.createObjectURL(r), a = document.createElement("a");
 	a.href = i, a.download = "room-plan.svg", a.click(), URL.revokeObjectURL(i);
 }
 var Z = {
@@ -2772,20 +2735,20 @@ var Z = {
 	polyCloseTarget: "polyCloseTarget_snjYx",
 	polyVertex: "polyVertex_fw0nX",
 	vertexHandle: "vertexHandle_-z7g5"
-}, Nn = 6, Pn = 5, Fn = 1.25, In = .25, Ln = 12, Rn = 0;
-function zn(e) {
-	return Rn += 1, `${e}${Rn}`;
+}, In = 6, Ln = 5, Rn = 1.25, zn = .25, Bn = 12, Vn = 0;
+function Hn(e) {
+	return Vn += 1, `${e}${Vn}`;
 }
-var Bn = {
+var Un = {
 	select: "Drag inside to move · Drag corner to reshape · Click wall to add corner · Dbl-click corner to remove · Delete to erase",
 	rect: "Drag to draw a rectangular room",
 	polygon: "Click to place corners · Click first point or Enter to close · Esc to cancel"
 };
-function Vn({ className: e }) {
-	let [t, n] = d([]), [r, i] = d([]), [o, c] = d("rect"), [l, h] = d(null), [g, _] = d(null), [x, S] = d(null), [C, ee] = d(null), [D, O] = d([]), [te, A] = d(null), [j, P] = d(1), [F, I] = d({
+function Wn({ className: e }) {
+	let [t, n] = d([]), [r, i] = d([]), [o, c] = d("rect"), [l, h] = d(null), [g, _] = d(null), [x, S] = d(null), [C, ee] = d(null), [D, O] = d([]), [te, A] = d(null), [j, P] = d(1), [ae, F] = d({
 		x: 0,
 		y: 0
-	}), ae = u(null), oe = u(null), se = u(null), ce = u(null), L = u(null), le = u({
+	}), I = u(null), oe = u(null), se = u(null), ce = u(null), L = u(null), le = u({
 		rooms: t,
 		doors: r,
 		tool: o,
@@ -2793,7 +2756,7 @@ function Vn({ className: e }) {
 		editingDoorsForRoomId: g,
 		polyPoints: D,
 		zoom: j,
-		pan: F
+		pan: ae
 	});
 	s(() => {
 		le.current = {
@@ -2804,12 +2767,12 @@ function Vn({ className: e }) {
 			editingDoorsForRoomId: g,
 			polyPoints: D,
 			zoom: j,
-			pan: F
+			pan: ae
 		};
 	});
 	function ue(e) {
 		e.length < 3 || (n((t) => [...t, {
-			id: zn("room"),
+			id: Hn("room"),
 			name: `Room ${t.length + 1}`,
 			points: e
 		}]), O([]), A(null));
@@ -2819,10 +2782,10 @@ function Vn({ className: e }) {
 		if (!e) return;
 		function t(e) {
 			e.preventDefault();
-			let { zoom: t, pan: n } = le.current, r = _n(e.clientX, e.clientY, ce.current);
+			let { zoom: t, pan: n } = le.current, r = bn(e.clientX, e.clientY, ce.current);
 			if (!r) return;
-			let i = e.deltaY < 0 ? Fn : 1 / Fn, a = Math.max(In, Math.min(Ln, t * i));
-			I({
+			let i = e.deltaY < 0 ? Rn : 1 / Rn, a = Math.max(zn, Math.min(Bn, t * i));
+			F({
 				x: r.x - (r.x - n.x) * (t / a),
 				y: r.y - (r.y - n.y) * (t / a)
 			}), P(a);
@@ -2844,23 +2807,23 @@ function Vn({ className: e }) {
 				return;
 			}
 			if ((e.key === "+" || e.key === "=") && !(e.target instanceof HTMLInputElement)) {
-				let e = Math.max(In, Math.min(Ln, s * Fn)), t = c.x + 400 / s / 2, n = c.y + 300 / s / 2;
-				P(e), I({
+				let e = Math.max(zn, Math.min(Bn, s * Rn)), t = c.x + 400 / s / 2, n = c.y + 300 / s / 2;
+				P(e), F({
 					x: t - 400 / e / 2,
 					y: n - 300 / e / 2
 				});
 				return;
 			}
 			if (e.key === "-" && !(e.target instanceof HTMLInputElement)) {
-				let e = Math.max(In, Math.min(Ln, s / Fn)), t = c.x + 400 / s / 2, n = c.y + 300 / s / 2;
-				P(e), I({
+				let e = Math.max(zn, Math.min(Bn, s / Rn)), t = c.x + 400 / s / 2, n = c.y + 300 / s / 2;
+				P(e), F({
 					x: t - 400 / e / 2,
 					y: n - 300 / e / 2
 				});
 				return;
 			}
 			if (e.key === "0" && !(e.target instanceof HTMLInputElement)) {
-				P(1), I({
+				P(1), F({
 					x: 0,
 					y: 0
 				});
@@ -2870,21 +2833,21 @@ function Vn({ className: e }) {
 		}
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
 	}, []);
-	function de(e, t = j, n = F) {
-		let r = Math.max(In, Math.min(Ln, t * e)), i = n.x + 400 / t / 2, a = n.y + 300 / t / 2;
-		I({
+	function de(e, t = j, n = ae) {
+		let r = Math.max(zn, Math.min(Bn, t * e)), i = n.x + 400 / t / 2, a = n.y + 300 / t / 2;
+		F({
 			x: i - 400 / r / 2,
 			y: a - 300 / r / 2
 		}), P(r);
 	}
 	function fe(e) {
-		return ce.current ? _n(e.clientX, e.clientY, ce.current) : null;
+		return ce.current ? bn(e.clientX, e.clientY, ce.current) : null;
 	}
 	function pe(e, t) {
 		let n = null;
 		for (let r = 0; r < t.points.length; r++) {
-			let i = vn(e, t.points[r]);
-			i <= Nn && (!n || i < n.d) && (n = {
+			let i = xn(e, t.points[r]);
+			i <= In && (!n || i < n.d) && (n = {
 				index: r,
 				d: i
 			});
@@ -2894,8 +2857,8 @@ function Vn({ className: e }) {
 	function R(e, t) {
 		let n = null;
 		for (let r = 0; r < t.points.length; r++) {
-			let i = t.points[r], a = t.points[(r + 1) % t.points.length], { dist: o, t: s } = yn(e, i, a);
-			o <= Pn && (!n || o < n.d) && (n = {
+			let i = t.points[r], a = t.points[(r + 1) % t.points.length], { dist: o, t: s } = Sn(e, i, a);
+			o <= Ln && (!n || o < n.d) && (n = {
 				index: r,
 				t: s,
 				d: o
@@ -2953,7 +2916,7 @@ function Vn({ className: e }) {
 						x: e.clientX,
 						y: e.clientY
 					},
-					origPan: { ...F },
+					origPan: { ...ae },
 					scaleX: 400 / j / n.width,
 					scaleY: 300 / j / n.height
 				};
@@ -2967,9 +2930,9 @@ function Vn({ className: e }) {
 			if (g) {
 				let e = t.find((e) => e.id === g);
 				if (e) {
-					let t = bn(n, [e]);
+					let t = Cn(n, [e]);
 					t && i((e) => [...e, {
-						id: zn("door"),
+						id: Hn("door"),
 						roomId: t.roomId,
 						wallIndex: t.wallIndex,
 						t: t.t,
@@ -2983,7 +2946,7 @@ function Vn({ className: e }) {
 				return;
 			}
 			if (o === "polygon") {
-				D.length >= 3 && vn(n, D[0]) <= 8 ? ue(D) : O((e) => [...e, n]);
+				D.length >= 3 && xn(n, D[0]) <= 8 ? ue(D) : O((e) => [...e, n]);
 				return;
 			}
 			if (o === "select") {
@@ -2991,7 +2954,7 @@ function Vn({ className: e }) {
 				if (e) {
 					let t = pe(n, e);
 					if (t) {
-						ae.current = {
+						I.current = {
 							type: "vertex",
 							roomId: e.id,
 							index: t.index,
@@ -3004,11 +2967,11 @@ function Vn({ className: e }) {
 				if (e) {
 					let t = R(n, e);
 					if (t) {
-						let r = e.points[t.index], i = e.points[(t.index + 1) % e.points.length], a = gn({
+						let r = e.points[t.index], i = e.points[(t.index + 1) % e.points.length], a = yn({
 							x: r.x + (i.x - r.x) * t.t,
 							y: r.y + (i.y - r.y) * t.t
 						}), o = me(e.id, t.index, t.t, a);
-						ae.current = {
+						I.current = {
 							type: "vertex",
 							roomId: e.id,
 							index: o,
@@ -3018,9 +2981,9 @@ function Vn({ className: e }) {
 						return;
 					}
 				}
-				let r = t.find((e) => xn(n, e.points));
+				let r = t.find((e) => wn(n, e.points));
 				if (r) {
-					h(r.id), ae.current = {
+					h(r.id), I.current = {
 						type: "room",
 						roomId: r.id,
 						start: n,
@@ -3044,7 +3007,7 @@ function Vn({ className: e }) {
 	function ge(e) {
 		if (se.current) {
 			let { startClient: t, origPan: n, scaleX: r, scaleY: i } = se.current;
-			I({
+			F({
 				x: n.x - (e.clientX - t.x) * r,
 				y: n.y - (e.clientY - t.y) * i
 			});
@@ -3055,7 +3018,7 @@ function Vn({ className: e }) {
 			if (oe.current && g) {
 				let e = t.find((e) => e.id === g);
 				if (e) {
-					let t = bn(r, [e]);
+					let t = Cn(r, [e]);
 					t && i((e) => e.map((e) => e.id === oe.current ? {
 						...e,
 						wallIndex: t.wallIndex,
@@ -3072,10 +3035,10 @@ function Vn({ className: e }) {
 				A(r);
 				return;
 			}
-			if (o === "select" && !g && ae.current) {
-				let e = ae.current;
+			if (o === "select" && !g && I.current) {
+				let e = I.current;
 				if (e.type === "vertex") {
-					let t = r.x - e.start.x, i = r.y - e.start.y, a = gn({
+					let t = r.x - e.start.x, i = r.y - e.start.y, a = yn({
 						x: e.origPt.x + t,
 						y: e.origPt.y + i
 					});
@@ -3110,12 +3073,12 @@ function Vn({ className: e }) {
 			if (o === "rect" && x) {
 				let e = Math.min(x.x, t.x), r = Math.min(x.y, t.y), i = Math.abs(t.x - x.x), a = Math.abs(t.y - x.y);
 				i >= 10 && a >= 10 && n((t) => [...t, {
-					id: zn("room"),
+					id: Hn("room"),
 					name: `Room ${t.length + 1}`,
-					points: Cn(e, r, i, a)
+					points: En(e, r, i, a)
 				}]), S(null), ee(null);
 			}
-			oe.current = null, ae.current = null;
+			oe.current = null, I.current = null;
 		}
 	}
 	function ve(e) {
@@ -3148,11 +3111,11 @@ function Vn({ className: e }) {
 		r.onload = (e) => {
 			let t = e.target?.result;
 			if (typeof t != "string") return;
-			let r = jn(t);
+			let r = Pn(t);
 			r.length !== 0 && (n(r.map((e) => ({
 				...e,
-				id: zn("room")
-			}))), i([]), h(null), _(null), P(1), I({
+				id: Hn("room")
+			}))), i([]), h(null), _(null), P(1), F({
 				x: 0,
 				y: 0
 			}));
@@ -3196,15 +3159,15 @@ function Vn({ className: e }) {
 					/* @__PURE__ */ M("button", {
 						title: "Zoom in (+)",
 						className: Z.roomDrawerToolbarBtn,
-						onClick: () => de(Fn),
-						disabled: j >= Ln,
+						onClick: () => de(Rn),
+						disabled: j >= Bn,
 						children: /* @__PURE__ */ M(p, { icon: E })
 					}),
 					/* @__PURE__ */ N("button", {
 						title: `Reset zoom (0) — ${Math.round(j * 100)}%`,
 						className: Z.roomDrawerToolbarZoomLabel,
 						onClick: () => {
-							P(1), I({
+							P(1), F({
 								x: 0,
 								y: 0
 							});
@@ -3214,8 +3177,8 @@ function Vn({ className: e }) {
 					/* @__PURE__ */ M("button", {
 						title: "Zoom out (−)",
 						className: Z.roomDrawerToolbarBtn,
-						onClick: () => de(1 / Fn),
-						disabled: j <= In,
+						onClick: () => de(1 / Rn),
+						disabled: j <= zn,
 						children: /* @__PURE__ */ M(p, { icon: T })
 					}),
 					/* @__PURE__ */ M("div", { className: Z.roomDrawerToolbarSep }),
@@ -3228,7 +3191,7 @@ function Vn({ className: e }) {
 					/* @__PURE__ */ M("button", {
 						title: "Download SVG",
 						className: Z.roomDrawerToolbarBtn,
-						onClick: () => Mn(t, r),
+						onClick: () => Fn(t, r),
 						disabled: t.length === 0,
 						children: /* @__PURE__ */ M(p, { icon: y })
 					}),
@@ -3244,7 +3207,7 @@ function Vn({ className: e }) {
 			/* @__PURE__ */ N("svg", {
 				ref: ce,
 				className: f(Z.roomDrawerCanvas, Oe),
-				viewBox: `${F.x} ${F.y} ${Ee} ${De}`,
+				viewBox: `${ae.x} ${ae.y} ${Ee} ${De}`,
 				onMouseDown: z,
 				onMouseMove: ge,
 				onMouseUp: _e,
@@ -3262,14 +3225,14 @@ function Vn({ className: e }) {
 						})
 					}) }),
 					/* @__PURE__ */ M("rect", {
-						x: F.x,
-						y: F.y,
+						x: ae.x,
+						y: ae.y,
 						width: Ee,
 						height: De,
 						fill: "url(#rd-grid)"
 					}),
 					t.map((e) => {
-						let t = e.points, n = t.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x},${e.y}`).join(" ") + " Z", i = Dn(t, r.filter((t) => t.roomId === e.id)), a = Sn(t), o = l === e.id, s = g === e.id;
+						let t = e.points, n = t.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x},${e.y}`).join(" ") + " Z", i = An(t, r.filter((t) => t.roomId === e.id)), a = Tn(t), o = l === e.id, s = g === e.id;
 						return /* @__PURE__ */ N("g", { children: [
 							/* @__PURE__ */ M("path", {
 								d: n,
@@ -3292,7 +3255,7 @@ function Vn({ className: e }) {
 					r.map((e) => {
 						let n = t.find((t) => t.id === e.roomId);
 						if (!n) return null;
-						let r = n.points[e.wallIndex], i = n.points[(e.wallIndex + 1) % n.points.length], a = wn(r, i, e.t, e.width);
+						let r = n.points[e.wallIndex], i = n.points[(e.wallIndex + 1) % n.points.length], a = Dn(r, i, e.t, e.width);
 						return a ? /* @__PURE__ */ M("line", {
 							x1: a.p1.x,
 							y1: a.p1.y,
@@ -3304,7 +3267,7 @@ function Vn({ className: e }) {
 					g && we.map((e) => {
 						let n = t.find((t) => t.id === e.roomId);
 						if (!n) return null;
-						let r = n.points[e.wallIndex], i = n.points[(e.wallIndex + 1) % n.points.length], a = wn(r, i, e.t, e.width);
+						let r = n.points[e.wallIndex], i = n.points[(e.wallIndex + 1) % n.points.length], a = Dn(r, i, e.t, e.width);
 						if (!a) return null;
 						let o = {
 							x: (a.p1.x + a.p2.x) / 2,
@@ -3435,26 +3398,26 @@ function Vn({ className: e }) {
 			}),
 			/* @__PURE__ */ M("div", {
 				className: Z.roomDrawerHint,
-				children: g ? "Click a wall to add a door · Adjust width or delete from the list · Done or Esc to finish" : `${Bn[o]} · Scroll to zoom · Middle-drag to pan · 0 to reset`
+				children: g ? "Click a wall to add a door · Adjust width or delete from the list · Done or Esc to finish" : `${Un[o]} · Scroll to zoom · Middle-drag to pan · 0 to reset`
 			})
 		]
 	});
 }
-var Hn = { scrollbarProvider: "scrollbarProvider_IMBFu" };
+var Gn = { scrollbarProvider: "scrollbarProvider_IMBFu" };
 //#endregion
 //#region package/common/scrollbarProvider/scrollbarProvider.tsx
-function Un({ className: e = void 0, children: t = void 0 }) {
+function Kn({ className: e = void 0, children: t = void 0 }) {
 	return /* @__PURE__ */ M("div", {
-		className: f(Hn.scrollbarProvider, e),
+		className: f(Gn.scrollbarProvider, e),
 		children: t
 	});
 }
 //#endregion
 //#region package/common/scrollbarProvider/index.ts
-var Wn = Un, Gn = { resultCount: "resultCount_Sn48Q" };
+var qn = Kn, Jn = { resultCount: "resultCount_Sn48Q" };
 //#endregion
 //#region package/common/searchInput/searchInput.tsx
-function Kn({ value: e, onChange: t, onDebounce: n, placeholder: r, label: i, debounceMs: o = 500, totalAmount: s, showAmount: c = !0, className: l, width: d, ...f }) {
+function Yn({ value: e, onChange: t, onDebounce: n, placeholder: r, label: i, debounceMs: o = 500, totalAmount: s, showAmount: c = !0, className: l, width: d, ...f }) {
 	let p = u(null);
 	a(() => () => {
 		p.current !== null && clearTimeout(p.current);
@@ -3477,7 +3440,7 @@ function Kn({ value: e, onChange: t, onDebounce: n, placeholder: r, label: i, de
 			value: e,
 			onChange: m
 		}), h && /* @__PURE__ */ N("p", {
-			className: Gn.resultCount,
+			className: Jn.resultCount,
 			children: [
 				s,
 				" ",
@@ -3513,16 +3476,16 @@ var Q = {
 	stepperEntryLabel: "stepper-entry-label_b94eg",
 	"stepper-entry-label-vertical": "stepper-entry-label-vertical_Zm8i4",
 	stepperEntryLabelVertical: "stepper-entry-label-vertical_Zm8i4"
-}, qn = class e extends t {
+}, Xn = class e extends t {
 	static alignments = {
 		VERTICAL: "vertical",
 		HORIZONTAL: "horizontal"
 	};
 	static propTypes = {
-		steps: F.arrayOf(F.shape({})),
-		currentStep: F.number,
-		alignment: F.oneOf([e.alignments.HORIZONTAL, e.alignments.VERTICAL]),
-		onStepClicked: F.func
+		steps: I.arrayOf(I.shape({})),
+		currentStep: I.number,
+		alignment: I.oneOf([e.alignments.HORIZONTAL, e.alignments.VERTICAL]),
+		onStepClicked: I.func
 	};
 	static defaultProps = {
 		steps: [],
@@ -3576,7 +3539,7 @@ var Q = {
 			children: t.map(this.renderStep)
 		});
 	}
-}, Jn = "https://tenor.googleapis.com/v2", Yn = class {
+}, Zn = "https://tenor.googleapis.com/v2", Qn = class {
 	constructor(e) {
 		this.key = e;
 	}
@@ -3585,14 +3548,14 @@ var Q = {
 			q: e,
 			key: this.key
 		});
-		return t.limit != null && n.set("limit", String(t.limit)), t.contentfilter != null && n.set("contentfilter", t.contentfilter), t.pos != null && n.set("pos", t.pos), (await fetch(`${Jn}/search?${n}`)).json();
+		return t.limit != null && n.set("limit", String(t.limit)), t.contentfilter != null && n.set("contentfilter", t.contentfilter), t.pos != null && n.set("pos", t.pos), (await fetch(`${Zn}/search?${n}`)).json();
 	}
 	async searchSuggestions(e) {
 		let t = new URLSearchParams({
 			q: e,
 			key: this.key
 		});
-		return (await fetch(`${Jn}/search_suggestions?${t}`)).json();
+		return (await fetch(`${Zn}/search_suggestions?${t}`)).json();
 	}
 	registerShare(e, t) {
 		let n = new URLSearchParams({
@@ -3600,91 +3563,58 @@ var Q = {
 			q: e,
 			key: this.key
 		});
-		fetch(`${Jn}/registershare?${n}`).catch(() => null);
+		fetch(`${Zn}/registershare?${n}`).catch(() => null);
 	}
-}, Xn = {
+}, $n = {
 	gifPreview: "gifPreview_-ECUZ",
 	"gifPreview-image": "gifPreview-image_Aq7-a",
 	gifPreviewImage: "gifPreview-image_Aq7-a",
 	"gifPreview-image-container": "gifPreview-image-container_ycypL",
 	gifPreviewImageContainer: "gifPreview-image-container_ycypL",
 	gradientBottomLeftToTopRight: "gradientBottomLeftToTopRight_wo6HB"
-}, Zn = class extends t {
-	static propTypes = {
-		className: F.string,
-		previewItems: F.arrayOf(F.shape({})),
-		onSelect: F.func,
-		onLoadAdditional: F.func
-	};
-	static defaultProps = {
-		className: "",
-		previewItems: [],
-		onSelect: () => null,
-		onLoadAdditional: () => null
-	};
-	constructor(e) {
-		super(e);
-	}
-	state = {};
-	onScroll = (e) => {
-		let { onLoadAdditional: t } = this.props, n = e.target.scrollHeight - e.target.clientHeight * 1.5;
-		e.target.scrollTop >= n && t();
-	};
-	render() {
-		let { className: e, previewItems: t, onSelect: n } = this.props;
-		return /* @__PURE__ */ M(ie, { children: t.length > 0 && /* @__PURE__ */ M("div", {
-			className: f(Xn.gifPreview, e),
-			onScroll: this.onScroll,
-			children: t.map((e, t) => /* @__PURE__ */ M(Ne, {
-				className: Xn.gifPreviewImageContainer,
-				onClick: () => n(e),
-				children: /* @__PURE__ */ M("div", {
-					className: Xn.gifPreviewImage,
-					style: { backgroundImage: `url(${e.media_formats.tinygif.url})` }
-				})
-			}, `${e.id}_${t}`))
-		}) });
-	}
-}, Qn = {
+};
+//#endregion
+//#region package/common/tenorPicker/components/gifPreview/gifPreview.tsx
+function er({ className: e, previewItems: t = [], onSelect: n, onLoadAdditional: r }) {
+	function i(e) {
+		let t = e.currentTarget, n = t.scrollHeight - t.clientHeight * 1.5;
+		t.scrollTop >= n && r?.();
+	}
+	return /* @__PURE__ */ M(ie, { children: t.length > 0 && /* @__PURE__ */ M("div", {
+		className: f($n.gifPreview, e),
+		onScroll: i,
+		children: t.map((e, t) => /* @__PURE__ */ M(Ne, {
+			className: $n.gifPreviewImageContainer,
+			onClick: () => n?.(e),
+			children: /* @__PURE__ */ M("div", {
+				className: $n.gifPreviewImage,
+				style: { backgroundImage: `url(${e.media_formats.tinygif.url})` }
+			})
+		}, `${e.id}_${t}`))
+	}) });
+}
+var tr = {
 	gifView: "gifView_Fa2zj",
 	"gifView-loading": "gifView-loading_LfNJr",
 	gifViewLoading: "gifView-loading_LfNJr",
 	gradientBottomLeftToTopRight: "gradientBottomLeftToTopRight_JR6aS"
-}, $n = class extends t {
-	static propTypes = {
-		className: F.string,
-		src: F.string
-	};
-	static defaultProps = {
-		className: "",
-		src: ""
-	};
-	constructor(e) {
-		super(e);
-	}
-	state = { isLoading: !0 };
-	onLoaded = () => {
-		console.log(">>onLoaded"), this.setState({ isLoading: !1 });
-	};
-	componentDidUpdate(e) {
-		let { src: t } = e, { src: n } = this.props;
-		console.log(">>SRC", {
-			src: n,
-			prevSrc: t
-		}), n !== t && this.setState({ isLoading: !0 });
-	}
-	render() {
-		let { className: e, src: t } = this.props, { isLoading: n } = this.state;
-		return console.log(">>RENDER", t), /* @__PURE__ */ N("div", {
-			className: f(Qn.gifView, e),
-			children: [/* @__PURE__ */ M("img", {
-				className: Qn.tenorPickerSelected,
-				src: t,
-				onLoad: this.onLoaded
-			}), n && /* @__PURE__ */ M("div", { className: Qn.gifViewLoading })]
-		});
-	}
-}, er = {
+};
+//#endregion
+//#region package/common/tenorPicker/components/gifView/gifView.tsx
+function nr({ className: e, src: t = "" }) {
+	let [n, r] = d(!0);
+	return a(() => {
+		r(!0);
+	}, [t]), /* @__PURE__ */ N("div", {
+		className: f(tr.gifView, e),
+		children: [/* @__PURE__ */ M("img", {
+			className: tr.tenorPickerSelected,
+			src: t,
+			onLoad: () => r(!1)
+		}), n && /* @__PURE__ */ M("div", { className: tr.gifViewLoading })]
+	});
+}
+var rr = {
 	"tenorPicker-selected": "tenorPicker-selected_IfR2z",
 	tenorPickerSelected: "tenorPicker-selected_IfR2z",
 	"tenorPicker-modal-content": "tenorPicker-modal-content_Vkolf",
@@ -3696,8 +3626,8 @@ var Q = {
 };
 //#endregion
 //#region package/common/tenorPicker/tenorPicker.tsx
-function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () => void 0, selected: i = null }) {
-	let a = c(() => new Yn(t), [t]), [o, s] = d(""), [l, u] = d([]), [p, m] = d([]), [h, g] = d(null), [_, v] = d(!1);
+function ir({ className: e, token: t = "", isModal: n = !1, onSelect: r = () => void 0, selected: i = null }) {
+	let a = c(() => new Qn(t), [t]), [o, s] = d(""), [l, u] = d([]), [p, m] = d([]), [h, g] = d(null), [_, v] = d(!1);
 	async function y(e) {
 		if (s(e), !e.trim()) {
 			u([]), m([]), g(null);
@@ -3723,23 +3653,23 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 	function S() {
 		return /* @__PURE__ */ M(Ke, {
 			inline: !0,
-			className: er.tenorPickerSuggestionsContainer,
+			className: rr.tenorPickerSuggestionsContainer,
 			children: p.map((e) => /* @__PURE__ */ M(Ge, {
-				className: er.tenorPickerSuggestionsItem,
+				className: rr.tenorPickerSuggestionsItem,
 				text: e,
 				onClick: () => y(e)
 			}, e))
 		});
 	}
 	function C() {
-		return /* @__PURE__ */ M(Zn, {
+		return /* @__PURE__ */ M(er, {
 			previewItems: l,
 			onSelect: x,
 			onLoadAdditional: b
 		});
 	}
 	function w() {
-		return /* @__PURE__ */ M(Kn, {
+		return /* @__PURE__ */ M(Yn, {
 			label: "Pick gif",
 			value: o,
 			onDebounce: y,
@@ -3747,7 +3677,7 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 		});
 	}
 	return n ? /* @__PURE__ */ N("div", {
-		className: f(er.tenorPicker, e),
+		className: f(rr.tenorPicker, e),
 		children: [
 			/* @__PURE__ */ N("div", {
 				className: xe.actionButtons,
@@ -3760,15 +3690,15 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 					children: "Remove gif"
 				})]
 			}),
-			i && /* @__PURE__ */ M($n, {
-				className: er.tenorPickerSelected,
+			i && /* @__PURE__ */ M(nr, {
+				className: rr.tenorPickerSelected,
 				src: i
 			}),
 			/* @__PURE__ */ M(ft, {
 				isOpen: _,
 				onClose: () => v(!1),
 				children: /* @__PURE__ */ N("div", {
-					className: er.tenorPickerModalContent,
+					className: rr.tenorPickerModalContent,
 					children: [
 						w(),
 						S(),
@@ -3778,7 +3708,7 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 			})
 		]
 	}) : /* @__PURE__ */ N("div", {
-		className: f(er.tenorPicker, e),
+		className: f(rr.tenorPicker, e),
 		children: [
 			/* @__PURE__ */ M(Xe, {
 				align: Je.Left,
@@ -3792,8 +3722,8 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 				onClick: () => x(null),
 				children: "Remove gif"
 			}),
-			i && /* @__PURE__ */ M($n, {
-				className: er.tenorPickerSelected,
+			i && /* @__PURE__ */ M(nr, {
+				className: rr.tenorPickerSelected,
 				src: i
 			})
 		]
@@ -3801,20 +3731,82 @@ function tr({ className: e, token: t = "", isModal: n = !1, onSelect: r = () =>
 }
 //#endregion
 //#region package/common/textarea/textarea.tsx
-function nr(e) {
+function ar(e) {
 	return /* @__PURE__ */ M($e, {
 		...e,
 		multiline: !0
 	});
 }
-var rr = { colorFade: "colorFade_eLv2g" }, ir = class extends t {
+//#endregion
+//#region package/common/themeProvider/defaultTheme.ts
+var or = {
+	id: "default",
+	variables: {
+		"--grey": "#8A8A8A",
+		"--lightgrey": "#e0e0e0",
+		"--lightergrey": "#B1B1B1",
+		"--white": "#FFFFFF",
+		"--red": "#D6002A",
+		"--lighter-red": "#ffeae9",
+		"--green": "#287626",
+		"--lighter-green": "#C4FFC9",
+		"--blue": "#5873d5",
+		"--lighter-blue": "#C6DBFF",
+		"--black": "black",
+		"--orange": "#ff7f50",
+		"--lighter-orange": "#ffe5d9",
+		"--primary-color": "#8184d6",
+		"--primary-accent": "#90CAF9",
+		"--primary-lighter": "#9a9ce4",
+		"--accent-color": "var(--grey)",
+		"--accent-color-light": "var(--lightgrey)",
+		"--text-color": "var(--white)",
+		"--text-dark": "var(--lightergrey)",
+		"--text-light": "var(--lightergrey)",
+		"--text-on-primary": "var(--white)",
+		"--text-on-delete": "var(--white)",
+		"--border-color": "#656574",
+		"--background": "#393945",
+		"--background-accent": "#33333c",
+		"--background-accent-dark": "var(--grey)",
+		"--background-accent-light": "#484856",
+		"--background-modal": "#484856",
+		"--success-color": "var(--green)",
+		"--success-lighter": "var(--lighter-green)",
+		"--error-color": "var(--red)",
+		"--error-lighter": "var(--lighter-red)",
+		"--info-color": "var(--blue)",
+		"--info-lighter": "var(--lighter-blue)",
+		"--warn-color": "var(--orange)",
+		"--warn-lighter": "var(--lighter-orange)",
+		"--default-font-size": "14px",
+		"--text-small-font-size": "12px",
+		"--header-font-size": "24px",
+		"--header-medium-font-size": "18px",
+		"--header-small-font-size": "16px",
+		"--default-font-weight": "400",
+		"--header-font-weight": "600",
+		"--input-background": "transparent",
+		"--input-icon-color": "var(--text-color)",
+		"--error-border-color": "var(--red)",
+		"--default-border-radius": "8px",
+		"--padding-sides": "15px",
+		"--margin-top": "10px",
+		"--default-font": "'Inter', sans-serif",
+		"--themed-font": "'Inter', sans-serif",
+		"--card-shadow": "0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)",
+		"--spacing-s": "4px",
+		"--spacing-m": "8px",
+		"--spacing-l": "16px"
+	}
+}, sr = { colorFade: "colorFade_eLv2g" }, cr = class extends t {
 	constructor(...t) {
 		super(...t), this.state = {
 			resolvedVariables: {},
 			colorFadeActive: !1,
 			currentThemeColor: null
 		}, this.colorFadeTimeout = null, this.wrapperRef = e.createRef(), this.themeColorMeta = null, this.createdThemeColorMeta = !1, this.applyTheme = (e) => {
-			let { themes: t } = this.props, n = t.find((e) => !e.baseThemeId) ?? t[0], r = n ? n.variables : {}, i = t.find((t) => t.id === e), a = i ? this.resolveChain(i.id) : [], o = Object.assign({}, r, ...a);
+			let t = this.props.themes ?? [or], n = t.find((e) => !e.baseThemeId) ?? t[0], r = n ? n.variables : {}, i = t.find((t) => t.id === e), a = i ? this.resolveChain(i.id) : [], o = Object.assign({}, r, ...a);
 			this.setState({
 				resolvedVariables: o,
 				colorFadeActive: !0
@@ -3848,15 +3840,15 @@ var rr = { colorFade: "colorFade_eLv2g" }, ir = class extends t {
 		}
 	}
 	resolveChain(e) {
-		let { themes: t } = this.props, n = t.find((t) => t.id === e);
-		return n ? [...n.baseThemeId ? this.resolveChain(n.baseThemeId) : [], n.variables] : [];
+		let t = (this.props.themes ?? [or]).find((t) => t.id === e);
+		return t ? [...t.baseThemeId ? this.resolveChain(t.baseThemeId) : [], t.variables] : [];
 	}
 	render() {
 		let { children: e } = this.props, { resolvedVariables: t, colorFadeActive: n } = this.state;
 		return /* @__PURE__ */ M("div", {
 			ref: this.wrapperRef,
 			id: "themeProvider",
-			className: n ? rr.colorFade : void 0,
+			className: n ? sr.colorFade : void 0,
 			style: t,
 			children: e
 		});
@@ -3864,7 +3856,7 @@ var rr = { colorFade: "colorFade_eLv2g" }, ir = class extends t {
 };
 //#endregion
 //#region package/common/themeProvider/useTheme.ts
-function ar(e = "default") {
+function lr(e = "default") {
 	let [t, n] = d(localStorage.getItem("theme") || e);
 	return {
 		currentThemeId: t,
@@ -3873,7 +3865,7 @@ function ar(e = "default") {
 		}
 	};
 }
-var or = {
+var ur = {
 	wizard: "wizard_uRBAN",
 	"wizard-content": "wizard-content_lcl4C",
 	wizardContent: "wizard-content_lcl4C",
@@ -3881,12 +3873,12 @@ var or = {
 	wizardContentOutOfFrame: "wizard-content-outOfFrame_Eks4Y",
 	"wizard-content-container": "wizard-content-container_yxbCJ",
 	wizardContentContainer: "wizard-content-container_yxbCJ"
-}, sr = class extends t {
+}, dr = class extends t {
 	static propTypes = {
-		currentStep: F.number,
-		stepCount: F.number,
-		renderStep: F.func,
-		className: F.string
+		currentStep: I.number,
+		stepCount: I.number,
+		renderStep: I.func,
+		className: I.string
 	};
 	static defaultProps = {
 		currentStep: 0,
@@ -3916,23 +3908,23 @@ var or = {
 	render() {
 		let { renderStep: e, currentStep: t, stepCount: n, className: r } = this.props, { height: i, showOtherContent: a } = this.state, o = i === void 0 ? {} : { height: `${i}px` };
 		return /* @__PURE__ */ M("div", {
-			className: f(f(or.wizard, r)),
+			className: f(f(ur.wizard, r)),
 			style: o,
 			children: /* @__PURE__ */ M("div", {
-				className: or.wizardContentContainer,
+				className: ur.wizardContentContainer,
 				style: {
 					width: `${n * 100}%`,
 					marginLeft: `-${t * 100}%`
 				},
 				children: Array.from(Array(n), () => null).map((r, i) => /* @__PURE__ */ M("div", {
 					ref: (e) => this.updateCurrentRef(e, i),
-					className: or.wizardContent,
+					className: ur.wizardContent,
 					style: {
 						width: `${100 / n}%`,
 						marginLeft: `${100 / n * i}%`
 					},
 					children: /* @__PURE__ */ M("div", {
-						className: f({ [or.wizardContentOutOfFrame]: t !== i && !a }),
+						className: f({ [ur.wizardContentOutOfFrame]: t !== i && !a }),
 						children: e(i)
 					})
 				}, `wizardContent${i}`))
@@ -3942,20 +3934,20 @@ var or = {
 };
 //#endregion
 //#region package/services/formValidation/formValidatorGroup.ts
-function cr(e) {
+function fr(e) {
 	let t = e;
 	return t?.errors && Array.isArray(t.errors) ? t.errors.flatMap((e) => Object.entries(e).map(([e, t]) => ({
 		id: e,
 		message: t
 	}))) : [];
 }
-var lr = class {
+var pr = class {
 	#e;
 	#t;
 	#n;
 	#r;
 	#i;
-	constructor(e, t = null, { initialValues: n, onSubmit: r = () => void 0, onValidate: i = () => void 0, errorParser: a = cr } = {}) {
+	constructor(e, t = null, { initialValues: n, onSubmit: r = () => void 0, onValidate: i = () => void 0, errorParser: a = fr } = {}) {
 		this.#t = !1, this.#i = [], this.getFormError = () => {
 			let e = Object.keys(this.group);
 			for (let t = 0; t < e.length; t += 1) {
@@ -4039,7 +4031,7 @@ var lr = class {
 };
 //#endregion
 //#region package/services/formValidation/FormValidatorGroupForm.tsx
-function ur(e) {
+function mr(e) {
 	return function({ children: t, ...n }) {
 		return /* @__PURE__ */ M("form", {
 			onSubmit: e.submit,
@@ -4051,11 +4043,11 @@ function ur(e) {
 }
 //#endregion
 //#region package/services/formValidation/FormValidatorGroupWithForm.tsx
-var dr = class extends lr {
+var hr = class extends pr {
 	constructor(e, t = null, n) {
-		super(e, t, n), this.Form = ur(this);
+		super(e, t, n), this.Form = mr(this);
 	}
-}, fr = class {
+}, gr = class {
 	#e;
 	#t;
 	#n;
@@ -4109,40 +4101,40 @@ var dr = class extends lr {
 		return this.#r;
 	}
 };
-fr.prototype.toString = function() {
+gr.prototype.toString = function() {
 	return `${this.value}`;
 };
 //#endregion
 //#region package/services/regexp.ts
-function pr(e) {
+function _r(e) {
 	return /^[0-9]+$/.test(e);
 }
-function mr(e) {
+function vr(e) {
 	return /^[0-9]{2}.[0-9]{2}.[0-9]{4}$/.test(e);
 }
-function hr(e) {
+function yr(e) {
 	return /^[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}:[0-9]{2}.[0-9]{3}Z$/.test(e);
 }
-function gr(e) {
+function br(e) {
 	return /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-ZöäüÜÖÄß\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(e);
 }
-function _r(e) {
+function xr(e) {
 	return /^[A-Z]{6}[A-Z\d]{2}([A-Z\d]{3})?$/.test(e);
 }
-function vr(e) {
+function Sr(e) {
 	return /[-a-zA-Z0-9@:%._+~#=]{2,256}\.[a-z]{2,63}(\/[-a-zA-Z0-9@:%_+.~#?&//=]*)?$/.test(e);
 }
-function yr(e) {
+function Cr(e) {
 	return /^[\w!@#$%^&*?±§~`'"/\\[\]{}\-,.();:><+=|öäüÖÄÜß €μ]{8,}$/.test(e);
 }
-function br(e) {
+function wr(e) {
 	return /^(?=.*[a-zöäüA-ZÖÄÜß])/.test(e);
 }
-function xr(e) {
+function Tr(e) {
 	return /^(?=.*\d)/.test(e);
 }
-function Sr(e) {
-	return yr(e) && br(e) && xr(e);
+function Er(e) {
+	return Cr(e) && wr(e) && Tr(e);
 }
 //#endregion
 //#region package/services/formValidation/validators.ts
@@ -4161,7 +4153,7 @@ var $ = { t: (e, t) => ({
 	"garages.errors.bic": "Must be a valid BIC",
 	"formValidators.minLetters": `Must contain at least ${t?.smart_count} letters`,
 	"formValidators.minDigits": `Must contain at least ${t?.smart_count} digits`
-})[e] || e }, Cr = class e {
+})[e] || e }, Dr = class e {
 	static {
 		this.minLength = (e, t) => (n) => !n || n.length < e ? {
 			id: "minLength",
@@ -4175,7 +4167,7 @@ var $ = { t: (e, t) => ({
 		} : null;
 	}
 	static {
-		this.email = (e) => (t) => t && !gr(t) ? {
+		this.email = (e) => (t) => t && !br(t) ? {
 			id: "email",
 			message: e || $.t("formValidators.email")
 		} : null;
@@ -4218,7 +4210,7 @@ var $ = { t: (e, t) => ({
 		this.multiEmail = (e) => (t) => {
 			if (t) {
 				let n = t.replace(/ /g, "").replace(/,/g, ";").split(";");
-				for (let t = 0; t < n.length; t += 1) if (!gr(n[t])) return {
+				for (let t = 0; t < n.length; t += 1) if (!br(n[t])) return {
 					id: "multiEmail",
 					message: e || $.t("formValidators.multiEmail")
 				};
@@ -4227,7 +4219,7 @@ var $ = { t: (e, t) => ({
 		};
 	}
 	static {
-		this.date = (e) => (t) => t && !mr(t) && !hr(t) ? {
+		this.date = (e) => (t) => t && !vr(t) && !yr(t) ? {
 			id: "date",
 			message: e || $.t("formValidators.date")
 		} : null;
@@ -4239,13 +4231,13 @@ var $ = { t: (e, t) => ({
 		} : null;
 	}
 	static {
-		this.website = (e) => (t) => t && !vr(t) ? {
+		this.website = (e) => (t) => t && !Sr(t) ? {
 			id: "website",
 			message: e || $.t("garages.errors.website")
 		} : null;
 	}
 	static {
-		this.bic = (e) => (t) => t && !_r(t) ? {
+		this.bic = (e) => (t) => t && !xr(t) ? {
 			id: "bic",
 			message: e || $.t("garages.errors.bic")
 		} : null;
@@ -4271,7 +4263,7 @@ var $ = { t: (e, t) => ({
 			} : r : null;
 		};
 	}
-}, wr = class extends n {
+}, Or = class extends n {
 	static {
 		this.defaultProps = {
 			formValidator: null,
@@ -4351,7 +4343,7 @@ var $ = { t: (e, t) => ({
 };
 //#endregion
 //#region package/services/formValidation/useFormValidator.ts
-function Tr(e) {
+function kr(e) {
 	let [, t] = l((e) => e + 1, 0);
 	return a(() => {
 		if (e) return e.registerOnUpdateListener(t), () => e.removeOnUpdateListener(t);
@@ -4359,9 +4351,9 @@ function Tr(e) {
 }
 //#endregion
 //#region package/services/formValidation/useFormValidatorGroup.ts
-function Er(e, { initialValues: t, onSubmit: n, onValidate: r, errorParser: i } = {}) {
+function Ar(e, { initialValues: t, onSubmit: n, onValidate: r, errorParser: i } = {}) {
 	let [, o] = l((e) => e + 1, 0), s = u(null);
-	s.current ||= new dr(e, null, {
+	s.current ||= new hr(e, null, {
 		initialValues: t,
 		errorParser: i
 	});
@@ -4369,6 +4361,6 @@ function Er(e, { initialValues: t, onSubmit: n, onValidate: r, errorParser: i }
 	return d.current = n, f.current = r, a(() => (n !== void 0 && (c.onSubmitCallback = (...e) => d.current?.(...e)), r !== void 0 && (c.onValidateCallback = (...e) => f.current?.(...e)), c.registerOnUpdateListener(o), () => c.removeOnUpdateListener(o)), []), c;
 }
 //#endregion
-export { be as Accordion, B as AccordionStyleType, Ae as ActionButtons, Fe as ActionIcon, Je as Align, Ie as BodyEnd, W as Button, we as ButtonSize, U as ButtonStyleType, Te as ButtonType, Le as Card, Ve as CardActions, Be as CardContent, Re as CardHeader, ze as CardMedia, Ue as Checkbox, Ge as Chip, Ke as ChipContainer, ut as ColorPicker, pt as ConfirmModal, Rt as DatePicker, It as Dropdown, Bt as EmptyState, Wt as Fab, Xe as FloatingMenu, fr as FormValidator, dr as FormValidatorGroup, qt as Icon, tn as IconLoading, Jt as IdleManager, Ft as InfiniteBlock, $e as Input, q as InputType, Ne as InteractableDiv, Qt as KanbanBoard, Zt as KanbanColumn, ft as Modal, an as NumberInput, sn as OptionPicker, dn as Overscroll, mn as ProgressBar, De as Ripple, Vn as RoomDrawer, Wn as ScrollbarProvider, Kn as SearchInput, H as SpinnerLoading, qn as Stepper, tr as TenorPicker, nr as Textarea, ir as ThemeProvider, Qe as Tooltip, wr as ValidatableComponent, Cr as Validators, sr as Wizard, bt as getLocale, yr as hasEightPasswordChars, xr as hasOnePasswordDigit, br as hasOnePasswordLetter, _r as isBic, mr as isDate, gr as isEmail, hr as isISODate, pr as isNumber, Sr as isPassword, vr as isURL, _t as mapLocale, yt as setLocale, Tr as useFormValidator, Er as useFormValidatorGroup, ar as useTheme };
+export { be as Accordion, B as AccordionStyleType, Ae as ActionButtons, Fe as ActionIcon, Je as Align, Ie as BodyEnd, W as Button, we as ButtonSize, U as ButtonStyleType, Te as ButtonType, Le as Card, Ve as CardActions, Be as CardContent, Re as CardHeader, ze as CardMedia, Ue as Checkbox, Ge as Chip, Ke as ChipContainer, ut as ColorPicker, pt as ConfirmModal, Bt as DatePicker, Rt as Dropdown, Ht as EmptyState, Kt as Fab, Xe as FloatingMenu, gr as FormValidator, hr as FormValidatorGroup, Yt as Icon, an as IconLoading, Zt as IdleManager, Lt as InfiniteBlock, $e as Input, q as InputType, Ne as InteractableDiv, tn as KanbanBoard, en as KanbanColumn, ft as Modal, cn as NumberInput, un as OptionPicker, mn as Overscroll, _n as ProgressBar, De as Ripple, Wn as RoomDrawer, qn as ScrollbarProvider, Yn as SearchInput, H as SpinnerLoading, Xn as Stepper, ir as TenorPicker, ar as Textarea, cr as ThemeProvider, Qe as Tooltip, Or as ValidatableComponent, Dr as Validators, dr as Wizard, bt as getLocale, Cr as hasEightPasswordChars, Tr as hasOnePasswordDigit, wr as hasOnePasswordLetter, xr as isBic, vr as isDate, br as isEmail, yr as isISODate, _r as isNumber, Er as isPassword, Sr as isURL, _t as mapLocale, yt as setLocale, kr as useFormValidator, Ar as useFormValidatorGroup, lr as useTheme };
 
 //# sourceMappingURL=index.mjs.map