handy-fluentui 0.1.0

package/dist/index.js

@@ -0,0 +1,1571 @@
+import { Body1 as e, Body1Strong as t, Button as n, Caption1 as r, Carousel as i, CarouselCard as a, CarouselNav as o, CarouselNavButton as s, CarouselNavContainer as c, CarouselSlider as l, CarouselViewport as u, Checkbox as d, DataGrid as f, DataGridBody as p, DataGridCell as m, DataGridHeader as h, DataGridHeaderCell as g, DataGridRow as _, Dialog as v, DialogActions as y, DialogBody as b, DialogContent as x, DialogSurface as S, DialogTitle as C, Divider as w, DrawerBody as T, DrawerHeader as E, DrawerHeaderTitle as D, Dropdown as ee, FluentProvider as te, Image as ne, InfoLabel as re, Input as O, Label as ie, Link as ae, Listbox as oe, Option as se, OptionGroup as ce, OverlayDrawer as k, RadioGroup as le, SpinButton as ue, Spinner as de, Switch as fe, Tab as pe, TabList as me, Textarea as he, Toast as ge, ToastBody as _e, ToastTitle as ve, ToastTrigger as ye, Toaster as be, Tooltip as A, createTableColumn as xe, makeStyles as j, mergeClasses as M, teamsDarkV21Theme as Se, teamsLightV21Theme as Ce, tokens as N, useId as we, useToastController as Te, webDarkTheme as Ee, webLightTheme as De } from "@fluentui/react-components";
+import P, { createContext as F, createElement as Oe, useCallback as I, useContext as L, useEffect as R, useMemo as z, useRef as B, useState as V } from "react";
+import { useMediaQuery as ke } from "usehooks-ts";
+import { Fragment as H, jsx as U, jsxs as W } from "react/jsx-runtime";
+import { CalendarRegular as Ae, ChevronDoubleLeftRegular as je, ChevronDoubleRightRegular as Me, ChevronDownRegular as G, ChevronLeftRegular as Ne, ChevronRightRegular as Pe, ChevronUpRegular as Fe, DismissRegular as K, EraserRegular as Ie, EyeOffRegular as Le, EyeRegular as Re, TranslateRegular as ze } from "@fluentui/react-icons";
+import { Calendar as Be } from "@fluentui/react-calendar-compat";
+import { DatePicker as Ve } from "@fluentui/react-datepicker-compat";
+//#region src/contexts/handy-fluent-ui-context.ts
+var q = F(void 0), He = F(void 0), Ue = ({ children: e }) => {
+	let [t, n] = V([]);
+	return /* @__PURE__ */ U(He.Provider, {
+		value: {
+			items: t,
+			setItems: n
+		},
+		children: e
+	});
+}, We = F({ openDialog: () => {} }), Ge = ({ title: e, content: t, buttons: r, visible: i }) => /* @__PURE__ */ U(v, {
+	modalType: "alert",
+	open: i,
+	children: /* @__PURE__ */ U(S, { children: /* @__PURE__ */ W(b, { children: [
+		/* @__PURE__ */ U(C, { children: e }),
+		/* @__PURE__ */ U(x, { children: t }),
+		/* @__PURE__ */ U(y, { children: r.map((e, t) => /* @__PURE__ */ U(n, {
+			appearance: r.length > 1 && (e.cta ?? !1) ? "primary" : "secondary",
+			disabled: e.disabled,
+			icon: e.icon,
+			onClick: e.action,
+			children: e.label
+		}, t)) })
+	] }) })
+}), Ke = ({ title: e, content: t, primaryButton: n, secondaryButton: r, tertiaryButton: i }, a) => {
+	let o = [{
+		...n,
+		cta: !0
+	}];
+	return r && o.push({
+		...r,
+		cta: !1
+	}), i && o.push({
+		...i,
+		cta: !1
+	}), /* @__PURE__ */ U(Ge, {
+		buttons: o.reverse().map(({ action: e, ...t }) => ({
+			...t,
+			action: () => {
+				a(), e && e();
+			}
+		})),
+		content: t,
+		title: e,
+		visible: !0
+	});
+}, qe = ({ children: e }) => {
+	let [t, n] = V({
+		dialogProps: void 0,
+		openTime: 0,
+		closeTime: 0
+	}), r = I((e) => {
+		n((t) => ({
+			...t,
+			dialogProps: e,
+			openTime: Date.now()
+		}));
+	}, []), i = t.dialogProps && t.openTime > t.closeTime ? Ke(t.dialogProps, () => n((e) => ({
+		...e,
+		closeTime: Date.now()
+	}))) : /* @__PURE__ */ U(H, {});
+	return /* @__PURE__ */ W(We.Provider, {
+		value: { openDialog: r },
+		children: [e, i]
+	});
+}, Je = F({
+	show: () => {},
+	hide: () => {}
+}), Ye = j({ overlay: {
+	position: "fixed",
+	inset: 0,
+	backgroundColor: "rgba(0, 0, 0, 0.5)",
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "center",
+	zIndex: 9999
+} }), Xe = ({ children: e, config: t }) => {
+	let n = Ye(), { initialDelay: r, label: i } = t ?? {}, a = B(null), [o, s] = V(0), [c, l] = V();
+	R(() => () => {
+		a.current !== null && clearTimeout(a.current);
+	}, []);
+	let u = I((e) => {
+		l(e || i?.loading), a.current = setTimeout(() => {
+			s((e) => e + 1), a.current = null;
+		}, r ?? 300);
+	}, [t]), d = I(() => {
+		a.current === null ? s((e) => Math.max(0, e - 1)) : (clearTimeout(a.current), a.current = null), l(void 0);
+	}, []), f = z(() => ({
+		show: u,
+		hide: d
+	}), [u, d]);
+	return /* @__PURE__ */ W(Je.Provider, {
+		value: f,
+		children: [e, o > 0 && /* @__PURE__ */ U("div", {
+			className: n.overlay,
+			children: /* @__PURE__ */ U(de, { label: c })
+		})]
+	});
+}, Ze = F({ show: () => {} }), Qe = ({ config: e, children: t }) => {
+	let { dismissTimeout: n, position: r, toastCreator: i } = e ?? {}, { dispatchToast: a, updateToast: o } = Te(), s = I((e, t, s, c) => {
+		if (i) {
+			a(i(t, e), {
+				intent: e,
+				position: r,
+				timeout: e === "error" ? -1 : n
+			});
+			return;
+		}
+		let l = s ? /* @__PURE__ */ U(ye, { children: /* @__PURE__ */ U(ae, { children: s }) }) : /* @__PURE__ */ U(ye, { children: /* @__PURE__ */ U(K, {}) }), u = c ?? e.charAt(0).toUpperCase() + e.slice(1), d = (e) => /* @__PURE__ */ W(ge, {
+			appearance: "inverted",
+			children: [/* @__PURE__ */ U(ve, {
+				action: e,
+				children: u
+			}), /* @__PURE__ */ U(_e, { children: t })]
+		});
+		if (e === "error") if (n && n > 0) {
+			let t = `fui-toast-${Date.now()}-${Math.random()}`;
+			a(d(void 0), {
+				intent: e,
+				position: r,
+				timeout: -1,
+				toastId: t
+			}), setTimeout(() => {
+				o({
+					content: d(l),
+					timeout: -1,
+					toastId: t
+				});
+			}, n);
+		} else a(d(l), {
+			intent: e,
+			position: r,
+			timeout: -1
+		});
+		else a(d(l), {
+			intent: e,
+			position: r,
+			timeout: n
+		});
+	}, [
+		e,
+		a,
+		o
+	]), c = z(() => ({ show: s }), [s]);
+	return /* @__PURE__ */ W(Ze.Provider, {
+		value: c,
+		children: [t, /* @__PURE__ */ U(be, {})]
+	});
+}, $e = {
+	light: De,
+	dark: Ee
+}, et = {
+	light: Ce,
+	dark: Se
+}, tt = (e, t) => ({
+	light: e?.light ?? t.light,
+	dark: e?.dark ?? t.dark,
+	custom: e?.custom ?? t.custom
+}), nt = (e) => ({
+	web: tt(e?.web, {
+		...$e,
+		custom: e?.mobile?.custom
+	}),
+	mobile: tt(e?.mobile, {
+		...et,
+		custom: e?.web?.custom
+	}),
+	default: e?.default
+}), rt = (e, t) => {
+	let n = "light";
+	return e === void 0 || e === "custom" && !t?.includes("custom") ? typeof window > "u" ? n : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : e ?? n;
+}, it = {
+	mobileBreakpoint: 600,
+	supportedLanguage: {
+		iso: "en",
+		name: "English"
+	},
+	supportedTheme: {
+		web: $e,
+		mobile: et
+	}
+}, at = ({ mobileBreakpoint: e, component: t, supportedTheme: n, loggerConfig: r, children: i }) => {
+	let a = nt(n), o = a.web.custom || a.mobile.custom ? [
+		"light",
+		"dark",
+		"custom"
+	] : ["light", "dark"], [s, c] = V(rt(n?.default, o)), l = e ?? it.mobileBreakpoint, u = ke(`(max-width: ${l}px)`) ? a.mobile[s] : a.web[s], d = I((e) => {
+		c(e);
+	}, []), f = Intl.DateTimeFormat().resolvedOptions().timeZone, p = I((e, t = "info") => {
+		r?.logMessage ? r.logMessage(e, t) : console.log(`[${t.toUpperCase()}] ${e}`);
+	}, [r]);
+	return /* @__PURE__ */ U(q.Provider, {
+		value: {
+			logMessage: p,
+			mobileBreakpoint: l,
+			selectedTheme: s,
+			supportedThemeType: o,
+			switchTheme: d,
+			timeZone: f
+		},
+		children: /* @__PURE__ */ U(te, {
+			theme: u,
+			children: /* @__PURE__ */ U(Xe, {
+				config: t?.spinner,
+				children: /* @__PURE__ */ U(qe, { children: /* @__PURE__ */ U(Qe, {
+					config: t?.toast,
+					children: /* @__PURE__ */ U(Ue, { children: i })
+				}) })
+			})
+		})
+	});
+}, J = () => {
+	let e = L(q);
+	if (!e) throw Error("useLogger must be used within HandyFluentUiProvider");
+	let t = e.logMessage;
+	return {
+		debug: (e) => t(e, "debug"),
+		error: (e) => t(e, "error"),
+		info: (e) => t(e, "info"),
+		warn: (e) => t(e, "warn")
+	};
+}, ot = () => {
+	let e = L(He);
+	if (!e) throw Error("useBreadcrumb must be used within FuiBreadcrumbContextProvider");
+	let t = J();
+	return {
+		items: [...e.items],
+		start: (n) => {
+			t.debug(`[useBreadcrumb] start() with tag ${n.tag}`);
+			let r = n.action, i = {
+				...n,
+				action: r ? () => {
+					r(), e.setItems([i]);
+				} : void 0
+			};
+			e.setItems([i]);
+		},
+		append: (n) => {
+			t.debug(`[useBreadcrumb] append() with tag ${n.tag}, action = ${n.action === void 0}`);
+			let r = n.action, i = {
+				...n,
+				action: r ? () => {
+					r(), e.setItems((e) => {
+						let t = e.findIndex((e) => e === i);
+						return e.slice(0, t + 1);
+					});
+				} : void 0
+			};
+			e.setItems((e) => {
+				let r = e[e.length - 1];
+				return n.tag !== void 0 && r?.tag === n.tag ? (t.warn(`[useBreadcrumb] append(), the tag of last item is ${n.tag}, ignored append`), e) : [...e, i];
+			});
+		},
+		peek: () => e.items[e.items.length - 1],
+		popTill: (n) => {
+			t.debug(`[useBreadcrumb] popTill(), no of items = ${e.items.length}`), e.setItems((e) => {
+				if (n) {
+					let r = e.findIndex((e) => e.tag === n);
+					return r === -1 ? (t.warn(`[useBreadcrumb] popTill(), tag "${n}" not found, trail unchanged`), e) : e.slice(0, r);
+				}
+				if (e.length === 0) return e;
+				let r = e.slice(0, -1);
+				return t.debug(`[useBreadcrumb] popTill(), no of items after pop = ${r.length}`), r;
+			});
+		}
+	};
+}, st = () => L(We), Y = () => {
+	let e = L(q);
+	if (!e) throw Error("useIsMobile must be used within HandyFluentUiProvider");
+	return ke(`(max-width: ${e.mobileBreakpoint}px)`);
+}, ct = () => L(Je), lt = () => {
+	let e = L(q);
+	if (!e) throw Error("useTheme must be used within HandyFluentUiProvider");
+	let { selectedTheme: t, supportedThemeType: n, switchTheme: r } = e;
+	return {
+		currentTheme: t,
+		switchTheme: (e) => {
+			n.includes(e) && r(e);
+		}
+	};
+}, ut = () => {
+	let e = L(q);
+	if (!e) throw Error("useTimezone must be used within HandyFluentUiProvider");
+	let t = (t) => {
+		try {
+			return Intl.DateTimeFormat(void 0, { timeZone: t }), !0;
+		} catch {
+			return e.logMessage(`Invalid timeZone = ${t}`, "warn"), !1;
+		}
+	};
+	return {
+		timeZone: e.timeZone,
+		setTimeZone: (n) => {
+			t(n) && (e.timeZone = n);
+		},
+		zonedDate2LocalDate: (n, r) => {
+			if (r && !t(r)) return {
+				year: n.getFullYear(),
+				month: n.getMonth(),
+				day: n.getDate(),
+				hour: n.getHours(),
+				minute: n.getMinutes(),
+				second: n.getSeconds()
+			};
+			let i = new Intl.DateTimeFormat(void 0, {
+				timeZone: r ?? e.timeZone,
+				year: "numeric",
+				month: "2-digit",
+				day: "2-digit",
+				hour: "2-digit",
+				minute: "2-digit",
+				second: "2-digit",
+				hourCycle: "h23"
+			}).formatToParts(n), { year: a, month: o, day: s, hour: c, minute: l, second: u } = Object.fromEntries(i.filter((e) => e.type !== "literal").map((e) => [e.type, Number(e.value)]));
+			return {
+				year: a,
+				month: o,
+				day: s,
+				hour: c,
+				minute: l,
+				second: u
+			};
+		}
+	};
+}, dt = () => {
+	let { show: e } = L(Ze);
+	return {
+		success: (t, n, r) => e("success", t, n, r),
+		error: (t, n, r) => e("error", t, n, r),
+		warning: (t, n, r) => e("warning", t, n, r),
+		info: (t, n, r) => e("info", t, n, r)
+	};
+}, ft = j({
+	root: {
+		display: "flex",
+		gap: N.spacingHorizontalM
+	},
+	row: { flexDirection: "row" },
+	column: {
+		flexDirection: "column",
+		alignItems: "stretch"
+	},
+	left: { justifyContent: "flex-start" },
+	right: { justifyContent: "flex-end" }
+}), pt = ({ className: e, alignItems: t = "right", children: n }) => {
+	let r = ft(), i = Y();
+	return /* @__PURE__ */ U("div", {
+		className: M(r.root, i ? r.column : r.row, t === "left" ? r.left : r.right, e),
+		children: n
+	});
+}, mt = j({
+	root: {
+		display: "flex",
+		flexDirection: "column",
+		width: "100%"
+	},
+	rootVertical: { flexDirection: "row" },
+	tabList: { width: "max-content" },
+	tabListVertical: {
+		borderBottom: "none",
+		borderRight: `1px solid ${N.colorNeutralStroke2}`,
+		minWidth: "0",
+		width: "auto"
+	},
+	scrollWrapper: {
+		width: "100%",
+		overflowX: "auto",
+		WebkitOverflowScrolling: "touch",
+		"::-webkit-scrollbar": { display: "none" },
+		msOverflowStyle: "none",
+		scrollbarWidth: "none"
+	},
+	content: {
+		paddingTop: N.spacingVerticalM,
+		flexGrow: 1
+	},
+	contentVertical: {
+		paddingTop: "0",
+		paddingLeft: N.spacingHorizontalM
+	},
+	tabTextSelected: { color: N.colorBrandForeground1 }
+}), ht = Symbol.for("FuiTab"), gt = Object.assign((e) => null, { _marker: ht }), _t = (e) => {
+	let { children: t, vertical: n, selectedValue: r, onTabSelect: i, ...a } = e, o = Y(), s = mt(), c = !o && n, l = P.Children.toArray(t).filter((e) => P.isValidElement(e) && e.type?._marker === ht).map((e) => ({
+		props: e.props,
+		value: e.props.value ?? e.props.name
+	})), u = (e, t) => {
+		i?.(t);
+	}, d = /* @__PURE__ */ U(me, {
+		...a,
+		className: c ? s.tabListVertical : s.tabList,
+		onTabSelect: u,
+		selectedValue: r,
+		vertical: c,
+		children: l.map((e) => /* @__PURE__ */ U(pe, {
+			...e.props,
+			value: e.value,
+			children: /* @__PURE__ */ U("span", {
+				className: e.value === r ? s.tabTextSelected : void 0,
+				children: e.props.name
+			})
+		}, String(e.value)))
+	}), f = l.find((e) => e.value === r);
+	return /* @__PURE__ */ W("div", {
+		className: M(s.root, c && s.rootVertical),
+		children: [o ? /* @__PURE__ */ U("div", {
+			className: s.scrollWrapper,
+			children: d
+		}) : d, f && /* @__PURE__ */ U("div", {
+			className: M(s.content, c && s.contentVertical),
+			children: f.props.children
+		})]
+	});
+}, X = (e, t) => e.replace(/{{\s*([\w.]+)\s*}}/g, (e, n) => {
+	let r = n.split(".").reduce((e, t) => {
+		if (e && typeof e == "object" && t in e) return e[t];
+	}, t);
+	return r == null ? "" : String(r);
+}), vt = j({
+	rootVertical: {
+		display: "flex",
+		flexDirection: "column",
+		gap: "2px"
+	},
+	rootHorizontal: {
+		display: "flex",
+		alignItems: "flex-start",
+		gap: N.spacingHorizontalM
+	},
+	rootHorizontalRow: { flexDirection: "row" },
+	rootHorizontalColumn: {
+		flexDirection: "column",
+		gap: "2px"
+	},
+	labelContainer: {
+		display: "flex",
+		flexDirection: "row",
+		alignItems: "center",
+		gap: "4px",
+		overflow: "hidden",
+		flexShrink: 1
+	},
+	eraserIcon: {
+		cursor: "pointer",
+		color: N.colorNeutralForeground3,
+		fontSize: "16px",
+		flexShrink: 0,
+		":hover": { color: N.colorNeutralForeground2 }
+	},
+	labelHorizontal: {
+		minHeight: "32px",
+		display: "flex",
+		alignItems: "center",
+		flexShrink: 0
+	},
+	labelHorizontalColumn: {
+		width: "100% !important",
+		minHeight: "auto"
+	},
+	labelSmall: { width: "10%" },
+	labelMedium: { width: "20%" },
+	labelLarge: { width: "30%" },
+	labelNone: { width: "auto" },
+	labelComponent: {
+		display: "inline-flex",
+		alignItems: "center",
+		whiteSpace: "nowrap",
+		overflow: "hidden",
+		minWidth: 0,
+		flexShrink: 1
+	},
+	labelText: {
+		overflow: "hidden",
+		textOverflow: "ellipsis",
+		whiteSpace: "nowrap"
+	},
+	fieldGroup: {
+		display: "flex",
+		flexDirection: "column",
+		flexGrow: 1,
+		width: "100%"
+	},
+	messageContainer: {
+		display: "flex",
+		flexDirection: "row",
+		justifyContent: "space-between",
+		alignItems: "center",
+		gap: N.spacingHorizontalM
+	},
+	message: {
+		lineHeight: N.spacingVerticalL,
+		paddingLeft: N.spacingHorizontalM
+	},
+	messagePlaceholder: { visibility: "hidden" },
+	additionalMessage: {
+		flexShrink: 0,
+		color: N.colorNeutralForeground3
+	},
+	errorMessage: { color: N.colorPaletteRedForeground1 },
+	infoMessage: { color: N.colorPaletteGreenForeground1 }
+}), Z = (e) => (t) => {
+	let { label: n = "", required: i, hint: a, errorMessage: o, infoMessage: s, noMessage: c = !1, direction: l = "vertical", labelWidth: u = "medium", additionalMessage: d, clearable: f = !0, onClear: p, ...m } = t, h = vt(), g = Y(), _ = we("input-field"), v = l === "horizontal", y = M(v && h.labelHorizontal, v && g && h.labelHorizontalColumn, v && u === "small" && h.labelSmall, v && u === "medium" && h.labelMedium, v && u === "large" && h.labelLarge, v && u === "none" && h.labelNone), b = n !== null, x = n === void 0 || n === "" ? "\xA0" : n, S = /* @__PURE__ */ U("span", {
+		className: h.labelText,
+		children: x
+	});
+	return /* @__PURE__ */ W("div", {
+		className: v && b ? M(h.rootHorizontal, g ? h.rootHorizontalColumn : h.rootHorizontalRow) : h.rootVertical,
+		children: [b && /* @__PURE__ */ W("div", {
+			className: M(h.labelContainer, y),
+			children: [a ? /* @__PURE__ */ U(re, {
+				className: h.labelComponent,
+				"data-testid": "info-label",
+				htmlFor: _,
+				info: a,
+				required: i,
+				children: S
+			}) : /* @__PURE__ */ U(ie, {
+				className: h.labelComponent,
+				"data-testid": "label",
+				htmlFor: _,
+				required: i,
+				children: S
+			}), f !== !1 && p && m.readOnly !== !0 && m.disabled !== !0 && /* @__PURE__ */ U(Ie, {
+				className: h.eraserIcon,
+				"data-testid": "eraser-icon",
+				onClick: p
+			})]
+		}), /* @__PURE__ */ W("div", {
+			className: h.fieldGroup,
+			children: [/* @__PURE__ */ U(e, {
+				...m,
+				id: _
+			}), !c && /* @__PURE__ */ W("div", {
+				className: h.messageContainer,
+				children: [/* @__PURE__ */ U(r, {
+					className: M(h.message, o ? h.errorMessage : s ? h.infoMessage : h.messagePlaceholder),
+					children: o ?? s ?? "\xA0"
+				}), d && /* @__PURE__ */ U(r, {
+					className: h.additionalMessage,
+					children: d
+				})]
+			})]
+		})]
+	});
+}, yt = j({
+	drawer: {
+		height: "auto",
+		maxHeight: "60vh",
+		overflowY: "auto"
+	},
+	drawerHeader: { paddingBottom: N.spacingVerticalM },
+	listboxWrapper: { padding: N.spacingVerticalM }
+}), bt = (e, t, n) => n ? e == null ? t : t.includes(e) ? t.filter((t) => t !== e) : [...t, e] : e, Q = ({ groups: e, ungrouped: t }) => {
+	let n = (e) => /* @__PURE__ */ U(se, {
+		disabled: e.disabled,
+		text: e.text,
+		value: e.value,
+		children: e.render ? e.render() : e.text
+	}, e.value);
+	return /* @__PURE__ */ W(H, { children: [t.map(n), Object.entries(e).map(([e, t]) => /* @__PURE__ */ U(ce, {
+		label: e,
+		children: t.map(n)
+	}, e))] });
+}, xt = (e, t) => {
+	let n = z(() => e == null ? [] : Array.isArray(e) ? e : [e], [e]);
+	return {
+		selectedValues: n,
+		displayValue: z(() => t.filter((e) => n.includes(e.value)).map((e) => e.text).join(", "), [t, n]),
+		groupedOptions: z(() => {
+			let e = {}, n = [];
+			return t.forEach((t) => {
+				t.group ? (e[t.group] ??= []).push(t) : n.push(t);
+			}), {
+				groups: e,
+				ungrouped: n
+			};
+		}, [t])
+	};
+}, St = (e) => {
+	let { value: t, onChange: r, options: i, placeholder: a, multiselect: o = !1, className: s, style: c, disabled: l, readOnly: u = !1, drawerTitle: d, id: f } = e, p = yt(), [m, h] = V(!1), { selectedValues: g, displayValue: _, groupedOptions: v } = xt(t, i), y = (e) => {
+		r(bt(e, g, o)), o || h(!1);
+	};
+	return /* @__PURE__ */ W(H, { children: [/* @__PURE__ */ U(O, {
+		autoComplete: "off",
+		className: s,
+		contentAfter: /* @__PURE__ */ U(G, {
+			onClick: () => h(!0),
+			style: { cursor: "pointer" }
+		}, `${f}-chevron`),
+		disabled: l,
+		id: f,
+		onClick: () => h(!0),
+		onKeyDown: (e) => e.preventDefault(),
+		placeholder: a,
+		readOnly: !0,
+		style: c,
+		type: "text",
+		value: _
+	}), /* @__PURE__ */ W(k, {
+		className: p.drawer,
+		onOpenChange: (e, { open: t }) => h(t),
+		open: m,
+		position: "bottom",
+		children: [/* @__PURE__ */ U(E, {
+			className: p.drawerHeader,
+			children: /* @__PURE__ */ U(D, {
+				action: /* @__PURE__ */ U(n, {
+					appearance: "subtle",
+					"aria-label": "Close",
+					icon: /* @__PURE__ */ U(K, {}),
+					onClick: () => h(!1)
+				}),
+				children: d
+			})
+		}), /* @__PURE__ */ U(T, { children: /* @__PURE__ */ U("div", {
+			className: p.listboxWrapper,
+			children: /* @__PURE__ */ U(oe, {
+				multiselect: o,
+				onOptionSelect: u ? void 0 : (e, t) => y(t.optionValue ?? null),
+				selectedOptions: g,
+				children: Q(v)
+			})
+		}) })]
+	})] });
+}, Ct = Z((e) => {
+	let { value: t, onChange: n, options: r, multiselect: i = !1, style: a, readOnly: o = !1, ...s } = e, c = Y(), { selectedValues: l, displayValue: u, groupedOptions: d } = xt(t, r);
+	if (c) return /* @__PURE__ */ U(St, { ...e });
+	let f = (e) => {
+		n(bt(e, l, i));
+	};
+	return /* @__PURE__ */ U(ee, {
+		...s,
+		"aria-labelledby": s.id,
+		multiselect: i,
+		onOptionSelect: (e, t) => {
+			o || f(t.optionValue ?? null);
+		},
+		selectedOptions: l,
+		style: {
+			width: "100%",
+			...a
+		},
+		value: u,
+		children: Q(d)
+	});
+}), wt = (e) => {
+	let { value: t, onChange: n, ...r } = e, i = (Array.isArray(t) ? t.length > 0 : t !== null && t !== "") ? () => n(e.multiselect === !0 ? [] : null) : void 0;
+	return /* @__PURE__ */ U(Ct, {
+		...r,
+		drawerTitle: e.label ?? e.placeholder,
+		onChange: n,
+		onClear: i,
+		value: t
+	});
+}, Tt = j({
+	headerRow: {
+		backgroundColor: N.colorNeutralBackground3,
+		"& > *": { color: N.colorNeutralForeground1 },
+		width: "100%"
+	},
+	row: { width: "100%" },
+	headerCell: {
+		backgroundColor: N.colorNeutralBackground3,
+		display: "flex",
+		flexDirection: "column",
+		justifyContent: "center"
+	},
+	ellipsis: {
+		overflow: "hidden",
+		textOverflow: "ellipsis",
+		whiteSpace: "nowrap"
+	},
+	sortableHeader: { cursor: "pointer" },
+	cell: { paddingLeft: N.spacingHorizontalS },
+	outerWrapper: { width: "100%" },
+	scrollContainer: {
+		width: "100%",
+		overflowX: "auto",
+		WebkitOverflowScrolling: "touch"
+	},
+	paginationBar: {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "flex-end",
+		gap: N.spacingHorizontalS,
+		padding: `${N.spacingVerticalS} ${N.spacingHorizontalM}`,
+		backgroundColor: N.colorNeutralBackground2
+	},
+	paginationBarMobile: {
+		flexDirection: "column",
+		alignItems: "flex-end",
+		padding: `${N.spacingVerticalXXS} ${N.spacingHorizontalXXS}`,
+		gap: N.spacingHorizontalXS
+	},
+	navRow: {
+		display: "flex",
+		alignItems: "center",
+		gap: N.spacingHorizontalS,
+		order: 1
+	},
+	navRowMobile: { justifyContent: "center" },
+	sizeRow: {
+		display: "flex",
+		alignItems: "center",
+		gap: N.spacingHorizontalS,
+		order: 2
+	},
+	sizeRowMobile: {
+		justifyContent: "center",
+		paddingRight: N.spacingHorizontalM
+	},
+	listbox: {
+		minWidth: 0,
+		width: "80px"
+	},
+	range: {
+		fontSize: N.fontSizeBase200,
+		color: N.colorNeutralForeground3,
+		fontVariantNumeric: "tabular-nums",
+		minWidth: "90px",
+		textAlign: "center"
+	}
+}), Et = Symbol.for("FuiColumn"), Dt = Object.assign(() => null, { _marker: Et }), Ot = (e, t) => t.split(".").reduce((e, t) => {
+	if (typeof e == "object" && e) return e[t];
+}, e), kt = (e) => P.Children.toArray(e).filter((e) => P.isValidElement(e) && e.type?._marker === Et).map((e) => e.props), At = (t, n) => {
+	let r = Ot(n, t.field);
+	return t.builder ? t.builder(r, n) : t.formatter ? /* @__PURE__ */ U(e, { children: t.formatter(r, n) }) : /* @__PURE__ */ U(e, { children: r == null ? "" : String(r) });
+}, jt = ({ offset: t, pageSize: r, fastForwardPage: i = 5, pageSizeOption: a, totalRecord: o, visibleCount: s, onPageChange: c, langLabel: l }) => {
+	let u = Tt(), d = l?.paginationBar, f = o === 0 ? 0 : t + 1, p = o === 0 ? 0 : t + s, m = t > 0, h = t + r < o, g = Y(), _ = String(r), v = o === 0 ? l?.noData || "No data" : l?.pageRange ? X(l.pageRange, {
+		from: f,
+		to: p,
+		total: o
+	}) : `${f} to ${p} of ${o}`, y = l?.pageSize ?? "Rows :", b = d?.next ?? "Next page", x = d?.nextN ? X(d.nextN, { n: i }) : `Next ${i} pages`, S = d?.previous ?? "Previous page", C = d?.previousN ? X(d.previousN, { n: i }) : `Previous ${i} pages`;
+	return /* @__PURE__ */ W("div", {
+		className: M(u.paginationBar, g && u.paginationBarMobile),
+		children: [/* @__PURE__ */ W("div", {
+			className: M(u.navRow, g && u.navRowMobile),
+			children: [
+				/* @__PURE__ */ U(A, {
+					content: C,
+					relationship: "label",
+					children: /* @__PURE__ */ U(n, {
+						appearance: "subtle",
+						"aria-label": C,
+						disabled: !m,
+						icon: /* @__PURE__ */ U(je, {}),
+						onClick: () => c(Math.max(0, t - i * r), r)
+					})
+				}),
+				/* @__PURE__ */ U(A, {
+					content: S,
+					relationship: "label",
+					children: /* @__PURE__ */ U(n, {
+						appearance: "subtle",
+						"aria-label": S,
+						disabled: !m,
+						icon: /* @__PURE__ */ U(Ne, {}),
+						onClick: () => c(Math.max(0, t - r), r)
+					})
+				}),
+				/* @__PURE__ */ U("span", {
+					className: u.range,
+					children: /* @__PURE__ */ U(e, { children: v })
+				}),
+				/* @__PURE__ */ U(A, {
+					content: b,
+					relationship: "label",
+					children: /* @__PURE__ */ U(n, {
+						appearance: "subtle",
+						"aria-label": b,
+						disabled: !h,
+						icon: /* @__PURE__ */ U(Pe, {}),
+						onClick: () => c(t + r, r)
+					})
+				}),
+				/* @__PURE__ */ U(A, {
+					content: x,
+					relationship: "label",
+					children: /* @__PURE__ */ U(n, {
+						appearance: "subtle",
+						"aria-label": x,
+						disabled: !h,
+						icon: /* @__PURE__ */ U(Me, {}),
+						onClick: () => c(t + i * r, r)
+					})
+				}),
+				" ",
+				!g && /* @__PURE__ */ U(w, { vertical: !0 })
+			]
+		}), /* @__PURE__ */ W("div", {
+			className: M(u.sizeRow, g && u.sizeRowMobile),
+			children: [/* @__PURE__ */ U(e, { children: y }), g ? /* @__PURE__ */ U(St, {
+				className: u.listbox,
+				onChange: (e) => {
+					e && !Array.isArray(e) && c(t, Number(e));
+				},
+				options: a.map((e) => String(e)).map((e) => ({
+					value: e,
+					text: e
+				})),
+				value: _
+			}) : /* @__PURE__ */ U(ee, {
+				className: u.listbox,
+				listbox: { className: u.listbox },
+				onOptionSelect: (e, n) => {
+					n.optionValue && c(t, Number(n.optionValue));
+				},
+				selectedOptions: [_],
+				value: _,
+				children: a.map((e) => String(e)).map((e) => /* @__PURE__ */ U(se, {
+					text: e,
+					value: e,
+					children: e
+				}, e))
+			})]
+		})]
+	});
+}, Mt = ({ data: e, onPageOrSort: n, pagination: r, width: i, langLabel: a, children: o }) => {
+	let [s, c] = V(null), [l, u] = V("asc"), d = Tt(), v = J(), y = kt(o), b = (e) => {
+		let t = e.style?.width;
+		return t == null ? e.style ?? {} : {
+			...e.style,
+			boxSizing: "border-box",
+			flex: `0 0 ${t}`,
+			minWidth: 0,
+			overflow: "hidden"
+		};
+	}, x = y.map((e, t) => xe({
+		columnId: `${e.field}_${t}`,
+		renderHeaderCell: () => e.header,
+		renderCell: (t) => At(e, t)
+	})), S = (e) => {
+		if (n || v.warn("Sorting is not performed because onSort handler is not provided"), s === e) {
+			let t = l === "asc" ? "desc" : "asc";
+			u(t), n?.(r, {
+				field: e,
+				direction: t
+			});
+		} else c(e), u("asc"), n?.(r, {
+			field: e,
+			direction: "asc"
+		});
+	}, C = r && /* @__PURE__ */ U(jt, {
+		onPageChange: (e, t) => {
+			n?.({
+				offset: e,
+				pageSize: t
+			}, s ? {
+				field: s,
+				direction: l
+			} : void 0);
+		},
+		...r,
+		langLabel: a,
+		visibleCount: e.length
+	}), w = s ? x.find((e) => String(e.columnId).startsWith(`${s}_`))?.columnId : void 0, T = r ? Math.max(0, r.pageSize - e.length) : 0, E = [...e, ...Array.from({ length: T }).map((e, t) => ({
+		_isFiller: !0,
+		id: `filler-${t}`
+	}))];
+	return /* @__PURE__ */ W("div", {
+		className: d.outerWrapper,
+		children: [
+			r?.position === "top" && C,
+			/* @__PURE__ */ U("div", {
+				className: d.scrollContainer,
+				children: /* @__PURE__ */ W(f, {
+					columns: x,
+					items: E,
+					sortState: {
+						sortColumn: w,
+						sortDirection: l === "asc" ? "ascending" : "descending"
+					},
+					style: {
+						minWidth: i?.minWidth ?? i?.width,
+						whiteSpace: "nowrap",
+						width: "100%"
+					},
+					children: [/* @__PURE__ */ U(h, { children: /* @__PURE__ */ U(_, {
+						className: d.headerRow,
+						children: ({ renderHeaderCell: e, columnId: n }) => {
+							let r = y[parseInt(String(n).split("_").pop() || "0")];
+							return /* @__PURE__ */ U(g, {
+								className: M(d.headerCell, r.sortable && d.sortableHeader),
+								onClick: r.sortable ? () => S(r.field) : void 0,
+								sortDirection: r.sortable && s === r.field ? l === "asc" ? "ascending" : "descending" : void 0,
+								style: {
+									...b(r),
+									...r.headerStyle,
+									textAlign: r.align
+								},
+								children: /* @__PURE__ */ U(t, {
+									className: d.ellipsis,
+									children: e()
+								})
+							}, n);
+						}
+					}) }), /* @__PURE__ */ U(p, { children: ({ item: e, rowId: t }) => /* @__PURE__ */ U(_, {
+						className: d.row,
+						children: ({ renderCell: t, columnId: n }) => {
+							let r = y[parseInt(String(n).split("_").pop() || "0")];
+							return /* @__PURE__ */ U(m, {
+								className: d.cell,
+								style: {
+									...b(r),
+									textAlign: r.align
+								},
+								children: e._isFiller ? null : t(e)
+							}, n);
+						}
+					}, t) })]
+				})
+			}),
+			(r?.position === "bottom" || !r?.position) && C
+		]
+	});
+}, Nt = (e, t) => `Carousel slide ${e + 1} of ${t}`, Pt = ({ images: e, langLabel: t }) => /* @__PURE__ */ U("div", {
+	style: { width: "100%" },
+	children: /* @__PURE__ */ W(i, {
+		announcement: Nt,
+		circular: !0,
+		groupSize: 1,
+		children: [/* @__PURE__ */ U(u, {
+			style: {
+				width: "100%",
+				overflow: "hidden"
+			},
+			children: /* @__PURE__ */ U(l, {
+				style: {
+					display: "flex",
+					flexWrap: "nowrap",
+					width: "100%"
+				},
+				children: e.map((t, n) => /* @__PURE__ */ U(a, {
+					"aria-label": `${n + 1} of ${e.length}`,
+					id: `carousel-image-${n}`,
+					style: {
+						aspectRatio: "5/2",
+						flexShrink: 0,
+						overflow: "hidden",
+						width: "100%"
+					},
+					children: /* @__PURE__ */ U(ne, {
+						fit: "cover",
+						role: "presentation",
+						src: t,
+						style: {
+							display: "block",
+							height: "100%",
+							objectFit: "cover",
+							width: "100%"
+						}
+					})
+				}, `image-${n}`))
+			})
+		}), /* @__PURE__ */ U(c, {
+			autoplayTooltip: {
+				content: t?.autoplay ?? "Autoplay",
+				relationship: "label"
+			},
+			layout: "inline",
+			nextTooltip: {
+				content: t?.next ?? "Next image",
+				relationship: "label"
+			},
+			prevTooltip: {
+				content: t?.previous ?? "Previous image",
+				relationship: "label"
+			},
+			children: /* @__PURE__ */ U(o, { children: (e) => /* @__PURE__ */ U(s, { "aria-label": `Carousel Nav Button ${e}` }) })
+		})]
+	})
+}), Ft = (e) => {
+	let { readOnly: t = !1, onChange: n, className: r, style: i, ...a } = e, o = (e, r) => {
+		t || n?.(r);
+	};
+	return /* @__PURE__ */ U(d, {
+		...a,
+		className: r,
+		onChange: o,
+		style: i
+	});
+}, It = j({
+	drawer: {
+		height: "auto",
+		maxHeight: "80vh"
+	},
+	drawerHeader: { paddingBottom: N.spacingVerticalM },
+	calendarWrapper: {
+		display: "flex",
+		justifyContent: "center",
+		padding: N.spacingVerticalM
+	}
+}), Lt = (e) => e ? e.toLocaleDateString() : "", Rt = (e) => {
+	let { value: t, onChange: n, formatter: r = Lt, className: i, style: a, readOnly: o, ...s } = e;
+	return Y() ? /* @__PURE__ */ U(zt, { ...e }) : o ? /* @__PURE__ */ U(O, {
+		className: i,
+		id: s.id,
+		placeholder: s.placeholder,
+		readOnly: !0,
+		style: {
+			width: "100%",
+			...a
+		},
+		type: "text",
+		value: r(t)
+	}) : /* @__PURE__ */ Oe(Ve, {
+		...s,
+		key: `${s.id}-${t ? "defined" : "undefined"}`,
+		className: i,
+		formatDate: (e) => r(e ?? null),
+		onSelectDate: n,
+		style: {
+			width: "100%",
+			...a
+		},
+		value: t ?? void 0
+	});
+}, zt = (e) => {
+	let { value: t, onChange: n, formatter: r = Lt, className: i, style: a, drawerTitle: o, readOnly: s, ...c } = e, l = It(), [u, d] = V(!1), f = () => {
+		s || d(!0);
+	}, p = (e) => {
+		n(e), d(!1);
+	}, m = s ? void 0 : /* @__PURE__ */ U(Ae, {
+		onClick: f,
+		style: { cursor: "pointer" }
+	}, `${c.id}-calendar`), h = r(t);
+	return /* @__PURE__ */ W(H, { children: [/* @__PURE__ */ U(O, {
+		...c,
+		autoComplete: "off",
+		className: i,
+		contentAfter: m,
+		onClick: f,
+		onKeyDown: (e) => e.preventDefault(),
+		readOnly: !0,
+		style: a,
+		type: "text",
+		value: h
+	}), /* @__PURE__ */ W(k, {
+		className: l.drawer,
+		onOpenChange: (e, { open: t }) => d(t),
+		open: u,
+		position: "bottom",
+		children: [o && /* @__PURE__ */ U(E, {
+			className: l.drawerHeader,
+			children: /* @__PURE__ */ U(D, { children: o })
+		}), /* @__PURE__ */ U(T, { children: /* @__PURE__ */ U("div", {
+			className: l.calendarWrapper,
+			children: /* @__PURE__ */ U(Be, {
+				onSelectDate: p,
+				value: t ?? void 0
+			}, `${c.id}-${t ? "defined" : "undefined"}`)
+		}) })]
+	})] });
+}, Bt = Z(Rt), Vt = (e) => {
+	let { value: t, onChange: n, ...r } = e, i = t !== null && !e.readOnly && !e.disabled ? () => n(null) : void 0;
+	return /* @__PURE__ */ U(Bt, {
+		...r,
+		drawerTitle: e.label ?? e.placeholder,
+		onChange: n,
+		onClear: i,
+		value: t
+	});
+}, Ht = j({
+	arrows: {
+		display: "flex",
+		flexDirection: "column"
+	},
+	arrowsRow: { flexDirection: "row" },
+	arrowIcon: { cursor: "pointer" },
+	arrowIconMobile: {
+		fontSize: N.fontSizeBase500,
+		height: N.fontSizeBase500,
+		width: N.fontSizeBase500
+	},
+	arrowIconDisabled: {
+		cursor: "default",
+		opacity: .4
+	},
+	amPm: {
+		cursor: "pointer",
+		fontWeight: N.fontWeightSemibold,
+		paddingRight: N.spacingHorizontalXS,
+		userSelect: "none"
+	},
+	amPmDisabled: {
+		cursor: "default",
+		opacity: .4
+	}
+}), Ut = {
+	hour: 0,
+	minute: 0,
+	second: 0
+}, Wt = (e, t, n) => {
+	if (e === null) return "";
+	let r = n ? e.hour : e.hour % 12 || 12, i = String(r).padStart(2, "0"), a = String(e.minute).padStart(2, "0"), o = String(e.second).padStart(2, "0");
+	return t ? `${i}:${a}:${o}` : `${i}:${a}`;
+}, Gt = (e, t) => e == null ? t ? "s" : "m" : e < 3 ? "h" : e < 6 ? "m" : "s", $ = (e, t, n, r) => {
+	let i = e ?? Ut;
+	if (t === "s") {
+		let e = i.second + n;
+		return r && e < 0 ? $({
+			...i,
+			second: 59
+		}, "m", -1, r) : r && e >= 60 ? $({
+			...i,
+			second: 0
+		}, "m", 1, r) : {
+			...i,
+			second: (e + 60) % 60
+		};
+	}
+	if (t === "m") {
+		let e = i.minute + n;
+		return r && e < 0 ? $({
+			...i,
+			minute: 59
+		}, "h", -1, r) : r && e >= 60 ? $({
+			...i,
+			minute: 0
+		}, "h", 1, r) : {
+			...i,
+			minute: (e + 60) % 60
+		};
+	}
+	return {
+		...i,
+		hour: (i.hour + n + 24) % 24
+	};
+}, Kt = Z((e) => {
+	let { value: t, onChange: n, in24HourFormat: r = !0, withSeconds: i = !1, cascadeCarry: a = !1, readOnly: o = !1, disabled: s, className: c, style: l, id: u, ...d } = e, f = Ht(), p = Y(), m = B(null), [h, g] = V(null), _ = B(null), v = !o && !s, y = t !== null && t.hour >= 12;
+	R(() => {
+		_.current !== null && m.current && (m.current.setSelectionRange(_.current, _.current), _.current = null);
+	});
+	let b = () => {
+		g(Gt(m.current?.selectionStart, i));
+	}, x = () => {
+		g(Gt(m.current?.selectionStart, i));
+	}, S = () => g(null), C = (e) => {
+		if (!v) return;
+		let r = h ?? (i ? "s" : "m");
+		_.current = m.current?.selectionStart ?? null, n($(t, r, e, a));
+	}, w = () => {
+		if (!v) return;
+		let e = t ?? Ut;
+		n({
+			...e,
+			hour: e.hour >= 12 ? e.hour - 12 : e.hour + 12
+		});
+	}, T = M(f.arrowIcon, p && f.arrowIconMobile, !v && f.arrowIconDisabled), E = /* @__PURE__ */ W("div", {
+		className: M(f.arrows, p && f.arrowsRow),
+		children: [/* @__PURE__ */ U(Fe, {
+			className: T,
+			onClick: () => C(1),
+			onMouseDown: (e) => e.preventDefault()
+		}), /* @__PURE__ */ U(G, {
+			className: T,
+			onClick: () => C(-1),
+			onMouseDown: (e) => e.preventDefault()
+		})]
+	}), D = !r && t !== null ? /* @__PURE__ */ U("span", {
+		className: v ? f.amPm : M(f.amPm, f.amPmDisabled),
+		onClick: v ? w : void 0,
+		onMouseDown: v ? (e) => e.preventDefault() : void 0,
+		children: y ? "PM" : "AM"
+	}) : void 0;
+	return /* @__PURE__ */ U(O, {
+		...d,
+		autoComplete: "off",
+		className: c,
+		contentAfter: E,
+		contentBefore: D,
+		disabled: s,
+		id: u,
+		input: {
+			ref: m,
+			style: { minWidth: i ? "8ch" : "5ch" }
+		},
+		onBlur: S,
+		onClick: b,
+		onFocus: x,
+		onKeyDown: (e) => {
+			e.key !== "Tab" && e.preventDefault();
+		},
+		readOnly: o,
+		style: {
+			width: "100%",
+			...l
+		},
+		type: "text",
+		value: Wt(t, i, r)
+	});
+}), qt = (e) => {
+	let { value: t, onChange: n, ...r } = e, i = t !== null && !e.readOnly && !e.disabled ? () => n(null) : void 0;
+	return /* @__PURE__ */ U(Kt, {
+		...r,
+		onChange: n,
+		onClear: i,
+		value: t
+	});
+}, Jt = j({
+	groupRow: {
+		display: "flex",
+		flexDirection: "row",
+		gap: N.spacingHorizontalM,
+		width: "100%"
+	},
+	groupColumn: {
+		display: "flex",
+		flexDirection: "column",
+		gap: N.spacingVerticalXXS,
+		width: "100%"
+	}
+}), Yt = Z(({ items: e, className: t, style: n }) => {
+	let r = Y(), i = Jt();
+	return /* @__PURE__ */ U("div", {
+		className: `${r ? i.groupColumn : i.groupRow} ${t ?? ""}`,
+		style: n,
+		children: e.map(({ element: e, weight: t = 1 }, n) => {
+			let { label: i, placeholder: a } = e.props, o = a ?? i;
+			return /* @__PURE__ */ U("div", {
+				style: r ? { flex: "1 1 auto" } : {
+					flex: `${t} 1 0px`,
+					minWidth: 0
+				},
+				children: P.cloneElement(e, {
+					label: null,
+					placeholder: o,
+					noMessage: !1
+				})
+			}, n);
+		})
+	});
+}), Xt = (e) => {
+	let t = Y(), { items: n, className: r, style: i } = e, a = n.some(({ element: e }) => {
+		let t = e.props.value;
+		return t != null && t !== "";
+	}) ? () => n.forEach(({ element: e }) => e.props.onChange(null)) : void 0;
+	return /* @__PURE__ */ U(Yt, {
+		...e,
+		className: r,
+		direction: t ? "vertical" : e.direction,
+		noMessage: !0,
+		onClear: a,
+		style: i
+	});
+}, Zt = Z((e) => {
+	let { type: t = "text", onChange: r, onKeyDown: i, className: a, style: o, ...s } = e, [c, l] = V(!1), u = t === "email" ? (t) => {
+		t.key === "@" && e.value?.includes("@") && t.preventDefault(), i?.(t);
+	} : i, d = (e) => {
+		r(e ?? null);
+	}, f = () => {
+		l(!c);
+	}, p = t === "password" && c ? "text" : t;
+	return /* @__PURE__ */ U(O, {
+		...s,
+		className: a,
+		contentAfter: t === "password" ? /* @__PURE__ */ U(n, {
+			appearance: "subtle",
+			icon: U(c ? Le : Re, {}),
+			onClick: f,
+			size: "small",
+			type: "button"
+		}) : s.contentAfter,
+		onChange: (e, t) => d(t.value),
+		onKeyDown: u,
+		style: o,
+		type: p,
+		value: e.value ?? ""
+	});
+}), Qt = (e) => {
+	let { value: t, onChange: n, ...r } = e, i = t !== null && t !== "" ? () => n(null) : void 0;
+	return /* @__PURE__ */ U(Zt, {
+		...r,
+		onChange: n,
+		onClear: i,
+		value: t
+	});
+}, $t = j({
+	drawerBase: { height: "auto" },
+	drawerMobile: {
+		height: "40vh",
+		maxHeight: "60vh"
+	},
+	drawerDesktop: {
+		width: "40vw",
+		maxWidth: "60vw",
+		maxHeight: "100vh"
+	},
+	drawerBody: {
+		display: "flex",
+		flexDirection: "column",
+		gap: N.spacingVerticalL,
+		padding: N.spacingVerticalL,
+		overflowY: "auto"
+	}
+}), en = Z((e) => {
+	let { value: t, onChange: r, disabled: i, drawerTitle: a, className: o, readOnly: s, style: c, langLabel: l, textComponent: u = Qt, ...d } = e, f = Y(), p = (l?.languages ?? []).slice(0, 3), m = $t(), [h, g] = V(!1), _ = t ? t.valueInLangOne ?? t.valueInLangTwo ?? t.valueInLangThree ?? "" : "", v = (e) => {
+		if (!t) {
+			r({
+				valueInLangOne: e || null,
+				valueInLangTwo: null,
+				valueInLangThree: null
+			});
+			return;
+		}
+		t.valueInLangOne === null ? t.valueInLangTwo === null ? t.valueInLangThree === null ? r({
+			...t,
+			valueInLangOne: e || null
+		}) : r({
+			...t,
+			valueInLangThree: e || null
+		}) : r({
+			...t,
+			valueInLangTwo: e || null
+		}) : r({
+			...t,
+			valueInLangOne: e || null
+		});
+	}, y = (e, n) => {
+		r({
+			valueInLangOne: t?.valueInLangOne ?? null,
+			valueInLangTwo: t?.valueInLangTwo ?? null,
+			valueInLangThree: t?.valueInLangThree ?? null,
+			[e]: n
+		});
+	}, b = /* @__PURE__ */ U(ze, {
+		onClick: () => g(!0),
+		style: { cursor: "pointer" }
+	}), x = /* @__PURE__ */ W(k, {
+		className: M(m.drawerBase, f ? m.drawerMobile : m.drawerDesktop),
+		onOpenChange: (e, { open: t }) => g(t),
+		open: h,
+		position: f ? "bottom" : "end",
+		children: [/* @__PURE__ */ U(E, { children: /* @__PURE__ */ U(D, {
+			action: /* @__PURE__ */ U(n, {
+				appearance: "subtle",
+				"aria-label": "Close",
+				icon: /* @__PURE__ */ U(K, {}),
+				onClick: () => g(!1)
+			}),
+			children: a
+		}) }), /* @__PURE__ */ W(T, {
+			className: m.drawerBody,
+			children: [
+				/* @__PURE__ */ U(u, {
+					disabled: i,
+					label: p[0] || "Lang One",
+					onChange: (e) => y("valueInLangOne", e),
+					readOnly: s,
+					value: t?.valueInLangOne ?? null
+				}),
+				p[1] && /* @__PURE__ */ U(u, {
+					disabled: i,
+					label: p[1],
+					onChange: (e) => y("valueInLangTwo", e),
+					readOnly: s,
+					value: t?.valueInLangTwo ?? null
+				}),
+				p[2] && /* @__PURE__ */ U(u, {
+					disabled: i,
+					label: p[2],
+					onChange: (e) => y("valueInLangThree", e),
+					readOnly: s,
+					value: t?.valueInLangThree ?? null
+				})
+			]
+		})]
+	});
+	return /* @__PURE__ */ W(H, { children: [/* @__PURE__ */ U(u, {
+		...d,
+		className: o,
+		clearable: !1,
+		contentAfter: p.length > 1 ? b : void 0,
+		disabled: i,
+		label: null,
+		noMessage: !0,
+		onChange: (e) => v(e),
+		readOnly: s,
+		style: c,
+		value: _
+	}), p.length > 1 && x] });
+}), tn = (e) => {
+	let { value: t, onChange: n } = e, r = t && (t.valueInLangOne || t.valueInLangTwo || t.valueInLangThree) ? () => n(null) : void 0;
+	return /* @__PURE__ */ U(en, {
+		...e,
+		drawerTitle: e.label ?? e.placeholder,
+		onClear: r
+	});
+}, nn = j({
+	arrows: {
+		display: "flex",
+		flexDirection: "row",
+		gap: N.spacingHorizontalXS
+	},
+	arrowIcon: {
+		cursor: "pointer",
+		fontSize: N.fontSizeBase500,
+		height: N.fontSizeBase500,
+		width: N.fontSizeBase500
+	}
+}), rn = Z((e) => {
+	let { value: t, onChange: n, precision: r = 0, allowNegative: i = !0, formatter: a, onFocus: o, onBlur: s, step: c, min: l, max: u, className: d, style: f, ...p } = e, m = Y(), h = nn(), [g, _] = V(!1), [v, y] = V(t === null ? "" : t.toString());
+	R(() => {
+		g || y(t === null ? "" : t.toString());
+	}, [t, g]);
+	let b = (e) => {
+		let t = e.key;
+		if (![
+			"Backspace",
+			"Delete",
+			"ArrowLeft",
+			"ArrowRight",
+			"Tab",
+			"Enter",
+			"Escape"
+		].includes(t)) {
+			if (t === "-") {
+				(!i || e.currentTarget.selectionStart !== 0 || v.includes("-")) && e.preventDefault();
+				return;
+			}
+			if (t === ".") {
+				(r <= 0 || v.includes(".")) && e.preventDefault();
+				return;
+			}
+			if (/^[0-9]$/.test(t)) {
+				let t = v.indexOf(".");
+				if (t !== -1) {
+					let n = v.split(".")[1] || "";
+					e.currentTarget.selectionStart > t && n.length >= r && e.preventDefault();
+				}
+				return;
+			}
+			e.preventDefault();
+		}
+	}, x = (e) => {
+		let t = e.target.value;
+		if (t === "" || t === "-" || t === ".") {
+			y(t), n(null);
+			return;
+		}
+		let r = parseFloat(t);
+		isNaN(r) || (y(t), n(r));
+	}, S = (e) => {
+		_(!0), o?.(e);
+	}, C = (e) => {
+		_(!1), v === "-" || v === "." ? (y(""), n(null)) : v.endsWith(".") && y(v.slice(0, -1)), s?.(e);
+	};
+	if (c) {
+		let { appearance: e, size: r, ...i } = p, o = t, s = !g && o !== null ? a ? a(o) : o.toString() : v, _ = (e, t) => {
+			n(t.value ?? null);
+		};
+		if (m) {
+			let e = !i.disabled && !i.readOnly, t = () => {
+				if (!e) return;
+				let t = (o ?? 0) + c;
+				u !== void 0 && t > u || n(t);
+			}, r = () => {
+				if (!e) return;
+				let t = (o ?? 0) - c;
+				l !== void 0 && t < l || n(t);
+			};
+			return /* @__PURE__ */ U(O, {
+				...i,
+				className: d,
+				contentAfter: /* @__PURE__ */ W("div", {
+					className: h.arrows,
+					children: [/* @__PURE__ */ U(Fe, {
+						className: h.arrowIcon,
+						onClick: t,
+						onMouseDown: (e) => e.preventDefault()
+					}), /* @__PURE__ */ U(G, {
+						className: h.arrowIcon,
+						onClick: r,
+						onMouseDown: (e) => e.preventDefault()
+					})]
+				}),
+				onKeyDown: (e) => {
+					e.key !== "Tab" && e.preventDefault();
+				},
+				style: f,
+				type: "text",
+				value: s
+			});
+		}
+		return /* @__PURE__ */ U(ue, {
+			...i,
+			appearance: e === "filled-darker-shadow" ? "filled-darker" : e === "filled-lighter-shadow" ? "filled-lighter" : e,
+			className: d,
+			displayValue: s,
+			max: u,
+			min: l,
+			onChange: _,
+			onKeyDown: (e) => e.preventDefault(),
+			size: r === "large" ? "medium" : r,
+			step: c,
+			style: f,
+			value: o
+		});
+	}
+	let w = !g && t !== null ? a ? a(t) : t.toString() : v;
+	return /* @__PURE__ */ U(O, {
+		...p,
+		className: d,
+		onBlur: C,
+		onChange: x,
+		onFocus: S,
+		onKeyDown: b,
+		style: f,
+		type: "text",
+		value: w
+	});
+}), an = (e) => {
+	let { value: t, onChange: n, ...r } = e, i = t === null ? void 0 : () => n(null);
+	return /* @__PURE__ */ U(rn, {
+		...r,
+		onChange: n,
+		onClear: i,
+		value: t
+	});
+}, on = Z((e) => {
+	let { onChange: t, className: n, style: r, readOnly: i = !1, ...a } = e, o = (e, n) => {
+		i || t?.(n);
+	};
+	return /* @__PURE__ */ U(le, {
+		...a,
+		className: n,
+		onChange: o,
+		style: r
+	});
+}), sn = (e) => {
+	let { readOnly: t = !1, onChange: n, className: r, style: i, ...a } = e, o = (e, r) => {
+		t || n(r.checked);
+	};
+	return /* @__PURE__ */ U(fe, {
+		...a,
+		className: r,
+		onChange: o,
+		style: i
+	});
+}, cn = Z((e) => {
+	let { value: t, onChange: n, className: r, style: i, readOnly: a = !1, ...o } = e;
+	return /* @__PURE__ */ U(he, {
+		...o,
+		className: r,
+		onChange: (e, t) => {
+			a || n(t.value ?? null);
+		},
+		style: i,
+		value: t ?? ""
+	});
+}), ln = (e) => {
+	let { value: t, maxLength: n, additionalMessage: r, onChange: i, ...a } = e, o = n === void 0 ? void 0 : `${(t ?? "").length}/${n}`, s = t !== null && t !== "" ? () => i(null) : void 0;
+	return /* @__PURE__ */ U(cn, {
+		...a,
+		additionalMessage: r ?? o,
+		maxLength: n,
+		onChange: i,
+		onClear: s,
+		value: t
+	});
+};
+//#endregion
+export { pt as FuiButtonPanel, Dt as FuiColumn, Pt as FuiImageCarousel, Ft as FuiInputCheckbox, Vt as FuiInputDate, wt as FuiInputDropdown, Xt as FuiInputGroup, tn as FuiInputMultiLangText, an as FuiInputNumber, on as FuiInputRadio, sn as FuiInputSwitch, Qt as FuiInputText, ln as FuiInputTextArea, qt as FuiInputTime, gt as FuiTab, _t as FuiTabList, Mt as FuiTable, at as HandyFluentUiProvider, ot as useBreadcrumb, st as useDialog, Y as useIsMobile, J as useLogger, ct as useSpinner, lt as useTheme, ut as useTimeZone, dt as useToast, Z as withInputField };
+
+//# sourceMappingURL=index.js.map