@mucsi96/react-ui 0.5.0 → 0.7.0

package/dist/index.js

@@ -1,8 +1,8 @@
 "use client";
 import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
-import { Button as r, Checkbox as i, ComboBox as a, Dialog as o, DialogTrigger as s, FieldError as c, Group as l, Heading as u, Input as d, Label as f, Link as p, ListBox as m, ListBoxItem as h, Menu as g, MenuItem as _, MenuTrigger as v, MenuTrigger as y, Modal as b, ModalOverlay as x, Popover as S, ProgressBar as C, Radio as w, RadioGroup as T, Select as E, SelectValue as D, Separator as O, SubmenuTrigger as k, Switch as A, Text as j, TextArea as M, TextField as N, Tooltip as ee, TooltipTrigger as te } from "react-aria-components";
-import { createContext as ne, useCallback as P, useContext as re, useEffect as ie, useId as ae, useMemo as oe, useRef as F, useState as I } from "react";
-import { createPortal as se } from "react-dom";
+import { Button as r, Checkbox as i, CheckboxGroup as a, ComboBox as o, Dialog as s, DialogTrigger as c, FieldError as l, Group as u, Heading as d, Input as f, Label as p, Link as m, ListBox as h, ListBoxItem as g, Menu as _, MenuItem as v, MenuTrigger as y, MenuTrigger as b, Modal as x, ModalOverlay as S, NumberField as C, Popover as w, ProgressBar as T, Radio as E, RadioGroup as D, Select as O, SelectValue as k, Separator as A, SubmenuTrigger as ee, Switch as j, Tab as te, TabList as ne, TabPanel as re, Tabs as ie, Text as M, TextArea as ae, TextField as oe, Tooltip as se, TooltipTrigger as ce } from "react-aria-components";
+import { createContext as le, useCallback as N, useContext as ue, useEffect as de, useId as P, useMemo as fe, useRef as F, useState as I } from "react";
+import { createPortal as pe } from "react-dom";
 //#region src/internal/classes.ts
 function L(...e) {
 	return e.filter(Boolean).join(" ");
@@ -15,7 +15,7 @@ var R = {
 };
 //#endregion
 //#region src/components/app-layout/app-layout.tsx
-function ce({ children: e, className: n, ...r }) {
+function me({ children: e, className: n, ...r }) {
 	return /* @__PURE__ */ t("header", {
 		...r,
 		className: L(R.header, n),
@@ -25,13 +25,13 @@ function ce({ children: e, className: n, ...r }) {
 		})
 	});
 }
-function le({ className: e, ...n }) {
+function he({ className: e, ...n }) {
 	return /* @__PURE__ */ t("div", {
 		...n,
 		className: L(R.actions, e)
 	});
 }
-function ue({ className: e, ...n }) {
+function ge({ className: e, ...n }) {
 	return /* @__PURE__ */ t("main", {
 		...n,
 		className: L(R.main, e)
@@ -54,8 +54,8 @@ function B({ variant: e = "filled", tone: n = "primary", background: i, classNam
 		children: s
 	});
 }
-function de({ variant: e = "filled", tone: n = "primary", background: r, className: i, style: a, children: o, ref: s, ...c }) {
-	return /* @__PURE__ */ t(p, {
+function _e({ variant: e = "filled", tone: n = "primary", background: r, className: i, style: a, children: o, ref: s, ...c }) {
+	return /* @__PURE__ */ t(m, {
 		...c,
 		ref: s,
 		className: L(z.button, i),
@@ -69,65 +69,114 @@ function de({ variant: e = "filled", tone: n = "primary", background: r, classNa
 	});
 }
 var V = {
-	field: "_field_b8e40_1",
-	label: "_label_b8e40_10",
-	surface: "_surface_b8e40_14",
-	floatingLabel: "_floatingLabel_b8e40_23",
-	selectButton: "_selectButton_b8e40_24",
-	input: "_input_b8e40_25",
-	description: "_description_b8e40_94",
-	error: "_error_b8e40_100",
-	combo: "_combo_b8e40_122",
-	comboButton: "_comboButton_b8e40_128",
-	popover: "_popover_b8e40_146",
-	list: "_list_b8e40_156",
-	option: "_option_b8e40_163",
-	control: "_control_b8e40_181",
-	check: "_check_b8e40_195",
-	radio: "_radio_b8e40_196",
-	track: "_track_b8e40_232",
-	thumb: "_thumb_b8e40_243"
+	field: "_field_n6ey2_1",
+	label: "_label_n6ey2_10",
+	surface: "_surface_n6ey2_14",
+	floatingLabel: "_floatingLabel_n6ey2_23",
+	selectButton: "_selectButton_n6ey2_24",
+	input: "_input_n6ey2_25",
+	selectSurface: "_selectSurface_n6ey2_60",
+	selectValue: "_selectValue_n6ey2_76",
+	number: "_number_n6ey2_107",
+	stepper: "_stepper_n6ey2_117",
+	description: "_description_n6ey2_150",
+	error: "_error_n6ey2_157",
+	combo: "_combo_n6ey2_180",
+	comboButton: "_comboButton_n6ey2_186",
+	popover: "_popover_n6ey2_204",
+	list: "_list_n6ey2_214",
+	option: "_option_n6ey2_221",
+	control: "_control_n6ey2_239",
+	check: "_check_n6ey2_254",
+	radio: "_radio_n6ey2_255",
+	track: "_track_n6ey2_291",
+	thumb: "_thumb_n6ey2_302"
 };
 //#endregion
 //#region src/components/forms/text-field.tsx
-function fe({ label: e, description: r, error: i, placeholder: a, multiline: o = !1, rows: s = 3, appearance: l = "filled", className: u, ref: p, ...m }) {
-	return /* @__PURE__ */ n(N, {
+function ve({ label: e, description: r, error: i, placeholder: a, multiline: o = !1, rows: s = 3, appearance: c = "filled", className: u, ref: d, ...m }) {
+	return /* @__PURE__ */ n(oe, {
 		...m,
-		ref: p,
+		ref: d,
 		isInvalid: !!i || m.isInvalid,
 		className: L(V.field, u),
-		"data-appearance": l,
+		"data-appearance": c,
 		children: [
 			/* @__PURE__ */ n("div", {
 				className: V.surface,
-				children: [/* @__PURE__ */ n(f, {
+				children: [/* @__PURE__ */ n(p, {
 					className: V.floatingLabel,
 					children: [e, m.isRequired && /* @__PURE__ */ t("span", {
 						"aria-hidden": "true",
 						children: " *"
 					})]
-				}), o ? /* @__PURE__ */ t(M, {
+				}), o ? /* @__PURE__ */ t(ae, {
 					className: V.input,
 					placeholder: a,
 					rows: s
-				}) : /* @__PURE__ */ t(d, {
+				}) : /* @__PURE__ */ t(f, {
 					className: V.input,
 					placeholder: a
 				})]
 			}),
-			r && /* @__PURE__ */ t(j, {
+			r && /* @__PURE__ */ t(M, {
 				slot: "description",
 				className: V.description,
 				children: r
 			}),
-			/* @__PURE__ */ t(c, {
+			/* @__PURE__ */ t(l, {
 				className: V.error,
 				children: i
 			})
 		]
 	});
 }
-var pe = { icon: "_icon_1xold_1" }, me = {
+//#endregion
+//#region src/components/forms/number-field.tsx
+function ye({ label: e, description: i, error: a, appearance: o = "filled", className: s, ref: c, ...d }) {
+	return /* @__PURE__ */ n(C, {
+		...d,
+		ref: c,
+		isInvalid: !!a || d.isInvalid,
+		className: L(V.field, s),
+		"data-appearance": o,
+		children: [
+			/* @__PURE__ */ n(u, {
+				className: L(V.surface, V.number),
+				children: [
+					/* @__PURE__ */ n(p, {
+						className: V.floatingLabel,
+						children: [e, d.isRequired && /* @__PURE__ */ t("span", {
+							"aria-hidden": "true",
+							children: " *"
+						})]
+					}),
+					/* @__PURE__ */ t(f, { className: V.input }),
+					/* @__PURE__ */ t(r, {
+						slot: "decrement",
+						className: V.stepper,
+						children: "−"
+					}),
+					/* @__PURE__ */ t(r, {
+						slot: "increment",
+						className: V.stepper,
+						children: "+"
+					})
+				]
+			}),
+			i && /* @__PURE__ */ t(M, {
+				slot: "description",
+				className: V.description,
+				children: i
+			}),
+			/* @__PURE__ */ t(l, {
+				className: V.error,
+				children: a
+			})
+		]
+	});
+}
+var be = { icon: "_icon_1xold_1" }, xe = {
 	"chevron-down": "m6 9 6 6 6-6",
 	"chevron-right": "m9 6 6 6-6 6",
 	"arrow-left": "m12 19-7-7 7-7M5 12h14",
@@ -148,25 +197,25 @@ function H({ name: e, className: n, ...r }) {
 		strokeWidth: "2",
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
-		className: L(pe.icon, n),
+		className: L(be.icon, n),
 		"aria-hidden": "true",
 		focusable: "false",
-		children: /* @__PURE__ */ t("path", { d: me[e] })
+		children: /* @__PURE__ */ t("path", { d: xe[e] })
 	});
 }
 //#endregion
 //#region src/components/forms/select.tsx
-function he({ label: e, options: i, description: a, error: o, placeholder: s = "Select an option", appearance: l = "filled", className: u, ...d }) {
-	return /* @__PURE__ */ n(E, {
+function Se({ label: e, options: i, description: a, error: o, placeholder: s = "Select an option", appearance: c = "filled", className: u, ...d }) {
+	return /* @__PURE__ */ n(O, {
 		...d,
 		isInvalid: !!o || d.isInvalid,
 		className: L(V.field, u),
 		placeholder: s,
-		"data-appearance": l,
+		"data-appearance": c,
 		children: [
 			/* @__PURE__ */ n("div", {
-				className: V.surface,
-				children: [/* @__PURE__ */ n(f, {
+				className: L(V.surface, V.selectSurface),
+				children: [/* @__PURE__ */ n(p, {
 					className: V.floatingLabel,
 					children: [e, d.isRequired && /* @__PURE__ */ t("span", {
 						"aria-hidden": "true",
@@ -174,24 +223,24 @@ function he({ label: e, options: i, description: a, error: o, placeholder: s = "
 					})]
 				}), /* @__PURE__ */ n(r, {
 					className: V.selectButton,
-					children: [/* @__PURE__ */ t(D, {}), /* @__PURE__ */ t(H, { name: "chevron-down" })]
+					children: [/* @__PURE__ */ t(k, { className: V.selectValue }), /* @__PURE__ */ t(H, { name: "chevron-down" })]
 				})]
 			}),
-			a && /* @__PURE__ */ t(j, {
+			a && /* @__PURE__ */ t(M, {
 				slot: "description",
 				className: V.description,
 				children: a
 			}),
-			/* @__PURE__ */ t(c, {
+			/* @__PURE__ */ t(l, {
 				className: V.error,
 				children: o
 			}),
-			/* @__PURE__ */ t(S, {
+			/* @__PURE__ */ t(w, {
 				className: V.popover,
-				children: /* @__PURE__ */ t(m, {
+				children: /* @__PURE__ */ t(h, {
 					items: i,
 					className: V.list,
-					children: (e) => /* @__PURE__ */ t(h, {
+					children: (e) => /* @__PURE__ */ t(g, {
 						id: e.id,
 						textValue: e.label,
 						isDisabled: e.isDisabled,
@@ -203,27 +252,33 @@ function he({ label: e, options: i, description: a, error: o, placeholder: s = "
 		]
 	});
 }
-function ge({ label: e, options: i, description: o, error: s, placeholder: u = "Search…", appearance: p = "filled", className: g, ..._ }) {
-	return /* @__PURE__ */ n(a, {
+function Ce(e) {
+	return /* @__PURE__ */ t(Se, {
+		...e,
+		selectionMode: "multiple"
+	});
+}
+function we({ label: e, options: i, description: a, error: s, placeholder: c = "Search…", appearance: d = "filled", className: m, ..._ }) {
+	return /* @__PURE__ */ n(o, {
 		..._,
 		defaultItems: i,
 		isInvalid: !!s || _.isInvalid,
-		className: L(V.field, g),
-		"data-appearance": p,
+		className: L(V.field, m),
+		"data-appearance": d,
 		children: [
 			/* @__PURE__ */ n("div", {
 				className: V.surface,
-				children: [/* @__PURE__ */ n(f, {
+				children: [/* @__PURE__ */ n(p, {
 					className: V.floatingLabel,
 					children: [e, _.isRequired && /* @__PURE__ */ t("span", {
 						"aria-hidden": "true",
 						children: " *"
 					})]
-				}), /* @__PURE__ */ n(l, {
+				}), /* @__PURE__ */ n(u, {
 					className: V.combo,
-					children: [/* @__PURE__ */ t(d, {
+					children: [/* @__PURE__ */ t(f, {
 						className: V.input,
-						placeholder: u
+						placeholder: c
 					}), /* @__PURE__ */ t(r, {
 						className: V.comboButton,
 						"aria-label": `Show ${e.toLowerCase()} options`,
@@ -231,21 +286,21 @@ function ge({ label: e, options: i, description: o, error: s, placeholder: u = "
 					})]
 				})]
 			}),
-			o && /* @__PURE__ */ t(j, {
+			a && /* @__PURE__ */ t(M, {
 				slot: "description",
 				className: V.description,
-				children: o
+				children: a
 			}),
-			/* @__PURE__ */ t(c, {
+			/* @__PURE__ */ t(l, {
 				className: V.error,
 				children: s
 			}),
-			/* @__PURE__ */ t(S, {
+			/* @__PURE__ */ t(w, {
 				className: V.popover,
-				children: /* @__PURE__ */ t(m, {
+				children: /* @__PURE__ */ t(h, {
 					className: V.list,
 					renderEmptyState: () => "No results",
-					children: (e) => /* @__PURE__ */ t(h, {
+					children: (e) => /* @__PURE__ */ t(g, {
 						id: e.id,
 						textValue: e.label,
 						isDisabled: e.isDisabled,
@@ -259,7 +314,7 @@ function ge({ label: e, options: i, description: o, error: s, placeholder: u = "
 }
 //#endregion
 //#region src/components/forms/controls.tsx
-function _e({ children: r, className: a, ...o }) {
+function Te({ children: r, className: a, ...o }) {
 	return /* @__PURE__ */ t(i, {
 		...o,
 		className: L(V.control, a),
@@ -277,18 +332,44 @@ function _e({ children: r, className: a, ...o }) {
 		}), r] })
 	});
 }
-function ve({ label: e, children: r, className: i, ...a }) {
-	return /* @__PURE__ */ n(T, {
+function Ee({ label: e, children: r, description: i, error: o, className: s, ...c }) {
+	return /* @__PURE__ */ n(a, {
+		...c,
+		isInvalid: !!o || c.isInvalid,
+		className: L(V.field, s),
+		children: [
+			/* @__PURE__ */ n(p, {
+				className: V.label,
+				children: [e, c.isRequired && /* @__PURE__ */ t("span", {
+					"aria-hidden": "true",
+					children: " *"
+				})]
+			}),
+			r,
+			i && /* @__PURE__ */ t(M, {
+				slot: "description",
+				className: V.description,
+				children: i
+			}),
+			/* @__PURE__ */ t(l, {
+				className: V.error,
+				children: o
+			})
+		]
+	});
+}
+function De({ label: e, children: r, className: i, ...a }) {
+	return /* @__PURE__ */ n(D, {
 		...a,
 		className: L(V.field, i),
-		children: [/* @__PURE__ */ t(f, {
+		children: [/* @__PURE__ */ t(p, {
 			className: V.label,
 			children: e
 		}), r]
 	});
 }
-function ye({ children: e, className: r, ...i }) {
-	return /* @__PURE__ */ n(w, {
+function Oe({ children: e, className: r, ...i }) {
+	return /* @__PURE__ */ n(E, {
 		...i,
 		className: L(V.control, r),
 		children: [/* @__PURE__ */ t("span", {
@@ -297,8 +378,8 @@ function ye({ children: e, className: r, ...i }) {
 		}), e]
 	});
 }
-function be({ children: r, className: i, ...a }) {
-	return /* @__PURE__ */ t(A, {
+function ke({ children: r, className: i, ...a }) {
+	return /* @__PURE__ */ t(j, {
 		...a,
 		className: L(V.control, i),
 		children: ({ isSelected: i }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("span", {
@@ -331,43 +412,43 @@ var U = {
 };
 //#endregion
 //#region src/components/donut-slider/donut-slider.tsx
-function W(e, t, n, r) {
+function Ae(e, t, n, r) {
 	let i = Number((Math.round(e / t) * t).toFixed(12));
 	return Math.min(r ?? Infinity, Math.max(n ?? -Infinity, i));
 }
-function G(e) {
+function je(e) {
 	let t = e.currentTarget.getBoundingClientRect();
 	return (Math.atan2(e.clientX - t.left - t.width / 2, -(e.clientY - t.top - t.height / 2)) * 180 / Math.PI + 360) % 360;
 }
-function xe({ label: e, value: r, defaultValue: i = 0, onChange: a, valuePerTurn: o = 100, step: s = 1, min: c, max: l, unit: u = "", size: d = 220, displayDecimals: f = 0, isDisabled: p = !1, className: m }) {
+function Me({ label: e, value: r, defaultValue: i = 0, onChange: a, valuePerTurn: o = 100, step: s = 1, min: c, max: l, unit: u = "", size: d = 220, displayDecimals: f = 0, isDisabled: p = !1, className: m }) {
 	let [h, g] = I(i), [_, v] = I(!1), y = F(null), b = F(null);
 	if (!Number.isFinite(o) || o <= 0 || !Number.isFinite(s) || s <= 0) throw RangeError("DonutSlider requires positive, finite step and valuePerTurn values.");
 	if (c !== void 0 && l !== void 0 && c > l) throw RangeError("DonutSlider min must not exceed max.");
 	if (!Number.isFinite(d) || d < 16) throw RangeError("DonutSlider requires a finite size of at least 16 pixels.");
-	let x = W(r ?? h, s, c, l), S = (x / o % 1 + 1) % 1, C = (S * 360 - 90) * Math.PI / 180, w = Math.round(d * .14), T = d / 2, E = T - w / 2 - 4, D = 2 * Math.PI * E, O = x.toFixed(Math.min(20, Math.max(0, Math.trunc(f))));
+	let x = Ae(r ?? h, s, c, l), S = (x / o % 1 + 1) % 1, C = (S * 360 - 90) * Math.PI / 180, w = Math.round(d * .14), T = d / 2, E = T - w / 2 - 4, D = 2 * Math.PI * E, O = x.toFixed(Math.min(20, Math.max(0, Math.trunc(f))));
 	function k(e) {
-		let t = W(e, s, c, l);
+		let t = Ae(e, s, c, l);
 		t !== x && (r === void 0 && g(t), a?.(t));
 	}
 	function A(e) {
 		if (p || e.button !== 0 || y.current) return;
-		let t = G(e), n = Math.round(x / o - t / 360);
+		let t = je(e), n = Math.round(x / o - t / 360);
 		y.current = {
 			pointerId: e.pointerId,
 			lastAngle: t,
 			turn: n
 		}, e.currentTarget.setPointerCapture(e.pointerId), b.current?.focus(), v(!0), k((n + t / 360) * o), e.preventDefault();
 	}
-	function j(e) {
+	function ee(e) {
 		let t = y.current;
 		if (p || !t || e.pointerId !== t.pointerId) return;
-		let n = G(e);
+		let n = je(e);
 		t.lastAngle > 270 && n < 90 ? t.turn += 1 : t.lastAngle < 90 && n > 270 && --t.turn, t.lastAngle = n, k((t.turn + n / 360) * o), e.preventDefault();
 	}
-	function M(e) {
+	function j(e) {
 		e.pointerId === y.current?.pointerId && (y.current = null, v(!1), e.currentTarget.hasPointerCapture(e.pointerId) && e.currentTarget.releasePointerCapture(e.pointerId));
 	}
-	function N(e) {
+	function te(e) {
 		if (p) return;
 		let t;
 		switch (e.key) {
@@ -411,16 +492,16 @@ function xe({ label: e, value: r, defaultValue: i = 0, onChange: a, valuePerTurn
 		"data-dragging": _ || void 0,
 		"data-disabled": p || void 0,
 		style: { "--dial-size": `${d}px` },
-		onKeyDown: N,
+		onKeyDown: te,
 		children: [/* @__PURE__ */ n("svg", {
 			viewBox: `0 0 ${d} ${d}`,
 			className: U.svg,
 			"aria-hidden": "true",
 			onPointerDown: A,
-			onPointerMove: j,
-			onPointerUp: M,
-			onPointerCancel: M,
-			onLostPointerCapture: M,
+			onPointerMove: ee,
+			onPointerUp: j,
+			onPointerCancel: j,
+			onLostPointerCapture: j,
 			children: [
 				/* @__PURE__ */ t("circle", {
 					cx: T,
@@ -461,100 +542,105 @@ function xe({ label: e, value: r, defaultValue: i = 0, onChange: a, valuePerTurn
 		})]
 	});
 }
-var K = {
-	popover: "_popover_3pd1a_1",
-	menu: "_menu_3pd1a_14",
-	item: "_item_3pd1a_22",
-	submenuIcon: "_submenuIcon_3pd1a_45",
-	separator: "_separator_3pd1a_48"
+var W = {
+	popover: "_popover_1065i_1",
+	menu: "_menu_1065i_14",
+	item: "_item_1065i_22",
+	submenuIcon: "_submenuIcon_1065i_47",
+	separator: "_separator_1065i_50"
 };
 //#endregion
 //#region src/components/menu/menu.tsx
-function q({ className: e, ...n }) {
-	return /* @__PURE__ */ t(g, {
+function Ne({ className: e, ...n }) {
+	return /* @__PURE__ */ t(_, {
 		...n,
-		className: L(K.menu, e)
+		className: L(W.menu, e)
 	});
 }
-function Se({ className: r, tone: i = "default", children: a, ...o }) {
-	return /* @__PURE__ */ t(_, {
+function Pe({ className: r, tone: i = "default", children: a, ...o }) {
+	return /* @__PURE__ */ t(v, {
 		...o,
 		textValue: o.textValue ?? (typeof a == "string" ? a : void 0),
-		className: L(K.item, r),
+		className: L(W.item, r),
 		"data-tone": i,
 		children: ({ hasSubmenu: r }) => /* @__PURE__ */ n(e, { children: [a, r && /* @__PURE__ */ t(H, {
 			name: "chevron-right",
-			className: K.submenuIcon
+			className: W.submenuIcon
 		})] })
 	});
 }
-function Ce({ className: e, ...n }) {
-	return /* @__PURE__ */ t(S, {
+function Fe({ className: e, ...n }) {
+	return /* @__PURE__ */ t(w, {
 		...n,
-		className: L(K.popover, e)
+		className: L(W.popover, e)
 	});
 }
-function we() {
-	return /* @__PURE__ */ t(O, { className: K.separator });
+function Ie() {
+	return /* @__PURE__ */ t(A, { className: W.separator });
 }
-var J = {
+var G = {
 	group: "_group_zvomd_1",
 	primary: "_primary_zvomd_6",
 	trigger: "_trigger_zvomd_10"
 };
 //#endregion
 //#region src/components/split-button/split-button.tsx
-function Te({ label: e, icon: r, menuLabel: i = "More actions", children: a, className: o, ...s }) {
+function Le({ label: e, icon: r, menuLabel: i = "More actions", children: a, className: o, ...s }) {
 	return /* @__PURE__ */ n("div", {
-		className: L(J.group, o),
+		className: L(G.group, o),
 		children: [/* @__PURE__ */ n(B, {
 			...s,
-			className: J.primary,
+			className: G.primary,
 			children: [r, e]
-		}), /* @__PURE__ */ n(y, { children: [/* @__PURE__ */ t(B, {
+		}), /* @__PURE__ */ n(b, { children: [/* @__PURE__ */ t(B, {
 			tone: s.tone,
 			background: s.background,
 			isDisabled: s.isDisabled,
-			className: J.trigger,
+			className: G.trigger,
 			"aria-label": i,
 			children: /* @__PURE__ */ t(H, { name: "chevron-down" })
-		}), /* @__PURE__ */ t(Ce, {
+		}), /* @__PURE__ */ t(Fe, {
 			placement: "bottom end",
-			children: /* @__PURE__ */ t(q, {
+			children: /* @__PURE__ */ t(Ne, {
 				"aria-label": i,
 				children: a
 			})
 		})] })]
 	});
 }
-var Y = {
-	overlay: "_overlay_18rq5_1",
-	modal: "_modal_18rq5_11",
-	dialog: "_dialog_18rq5_22",
-	header: "_header_18rq5_27",
-	title: "_title_18rq5_34",
-	description: "_description_18rq5_39"
+var K = {
+	overlay: "_overlay_1i4r0_1",
+	modal: "_modal_1i4r0_14",
+	dialog: "_dialog_1i4r0_35",
+	body: "_body_1i4r0_44",
+	header: "_header_1i4r0_51",
+	footer: "_footer_1i4r0_52",
+	title: "_title_1i4r0_74",
+	description: "_description_1i4r0_79"
 };
 //#endregion
 //#region src/components/dialog/dialog.tsx
-function Ee({ title: r, description: i, children: a, role: s = "dialog", className: c, isDismissable: l = !0, ...d }) {
-	let f = ae();
-	return /* @__PURE__ */ t(x, {
-		...d,
-		isDismissable: l,
-		className: Y.overlay,
-		children: /* @__PURE__ */ t(b, {
-			className: Y.modal,
-			children: /* @__PURE__ */ t(o, {
-				role: s,
-				"aria-describedby": i ? f : void 0,
-				className: L(Y.dialog, c),
+function Re({ title: r, description: i, children: a, role: o = "dialog", className: c, size: l = "medium", maxWidth: u, footer: f, isDismissable: p = !0, ...m }) {
+	let h = P();
+	return /* @__PURE__ */ t(S, {
+		...m,
+		isDismissable: p,
+		className: K.overlay,
+		children: /* @__PURE__ */ t(x, {
+			className: K.modal,
+			"data-size": l,
+			style: { maxWidth: u },
+			children: /* @__PURE__ */ t(s, {
+				role: o,
+				"aria-describedby": i ? h : void 0,
+				className: L(K.dialog, c),
+				"data-layout": f ? "fixed-footer" : void 0,
 				children: ({ close: o }) => /* @__PURE__ */ n(e, { children: [
 					/* @__PURE__ */ n("header", {
-						className: Y.header,
-						children: [/* @__PURE__ */ t(u, {
+						className: K.header,
+						children: [/* @__PURE__ */ t(d, {
 							slot: "title",
-							className: Y.title,
+							className: K.title,
 							children: r
 						}), /* @__PURE__ */ t(B, {
 							variant: "icon",
@@ -563,31 +649,37 @@ function Ee({ title: r, description: i, children: a, role: s = "dialog", classNa
 							children: /* @__PURE__ */ t(H, { name: "close" })
 						})]
 					}),
-					i && /* @__PURE__ */ t("p", {
-						id: f,
-						className: Y.description,
-						children: i
+					/* @__PURE__ */ n("div", {
+						className: K.body,
+						children: [i && /* @__PURE__ */ t("p", {
+							id: h,
+							className: K.description,
+							children: i
+						}), typeof a == "function" ? a({ close: o }) : a]
 					}),
-					typeof a == "function" ? a({ close: o }) : a
+					f && /* @__PURE__ */ t("footer", {
+						className: K.footer,
+						children: typeof f == "function" ? f({ close: o }) : f
+					})
 				] })
 			})
 		})
 	});
 }
-var De = { tooltip: "_tooltip_trnx2_1" };
+var ze = { tooltip: "_tooltip_trnx2_1" };
 //#endregion
 //#region src/components/tooltip/tooltip.tsx
-function Oe({ children: e, content: r, placement: i = "top", delay: a = 500 }) {
-	return /* @__PURE__ */ n(te, {
+function Be({ children: e, content: r, placement: i = "top", delay: a = 500 }) {
+	return /* @__PURE__ */ n(ce, {
 		delay: a,
-		children: [e, /* @__PURE__ */ t(ee, {
-			className: De.tooltip,
+		children: [e, /* @__PURE__ */ t(se, {
+			className: ze.tooltip,
 			placement: i,
 			children: r
 		})]
 	});
 }
-var X = {
+var q = {
 	container: "_container_kj4bs_1",
 	scroll: "_scroll_kj4bs_12",
 	table: "_table_kj4bs_15",
@@ -600,8 +692,8 @@ var X = {
 };
 //#endregion
 //#region src/components/table/data-table.tsx
-function ke({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, selectedKey: s = null, onSelectionChange: c, getRowLabel: l, emptyMessage: u = "No results found.", className: d }) {
-	let [f, p] = I(null), [m, h] = I(0), g = ae(), _ = Math.max(1, Math.trunc(o)), v = Math.max(1, Math.ceil(r.length / _)), y = Math.min(m, v - 1), b = i.find((e) => e.id === f?.column)?.compare, x = (b && f ? [...r].sort((e, t) => b(e, t) * (f.direction === "ascending" ? 1 : -1)) : r).slice(y * _, (y + 1) * _);
+function Ve({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, selectedKey: s = null, onSelectionChange: c, getRowLabel: l, emptyMessage: u = "No results found.", className: d }) {
+	let [f, p] = I(null), [m, h] = I(0), g = P(), _ = Math.max(1, Math.trunc(o)), v = Math.max(1, Math.ceil(r.length / _)), y = Math.min(m, v - 1), b = i.find((e) => e.id === f?.column)?.compare, x = (b && f ? [...r].sort((e, t) => b(e, t) * (f.direction === "ascending" ? 1 : -1)) : r).slice(y * _, (y + 1) * _);
 	function S(e) {
 		p((t) => t?.column === e ? t.direction === "ascending" ? {
 			column: e,
@@ -612,25 +704,25 @@ function ke({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, s
 		}), h(0);
 	}
 	return /* @__PURE__ */ n("div", {
-		className: L(X.container, d),
+		className: L(q.container, d),
 		children: [
 			/* @__PURE__ */ t("div", {
-				className: X.scroll,
+				className: q.scroll,
 				children: /* @__PURE__ */ n("table", {
-					className: X.table,
+					className: q.table,
 					"aria-describedby": x.length === 0 ? g : void 0,
 					children: [
 						/* @__PURE__ */ t("caption", {
-							className: X.caption,
+							className: q.caption,
 							children: /* @__PURE__ */ t("span", {
-								className: X.captionText,
+								className: q.captionText,
 								children: e
 							})
 						}),
 						/* @__PURE__ */ t("thead", { children: /* @__PURE__ */ n("tr", { children: [c && /* @__PURE__ */ t("th", {
 							scope: "col",
 							children: /* @__PURE__ */ t("span", {
-								className: X.srOnly,
+								className: q.srOnly,
 								children: "Selection"
 							})
 						}), i.map((e) => /* @__PURE__ */ t("th", {
@@ -638,7 +730,7 @@ function ke({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, s
 							"data-align": e.align,
 							"aria-sort": e.compare ? f?.column === e.id ? f.direction : "none" : void 0,
 							children: e.compare ? /* @__PURE__ */ n("button", {
-								className: X.sort,
+								className: q.sort,
 								onClick: () => S(e.id),
 								children: [e.label, /* @__PURE__ */ t(H, { name: f?.column === e.id ? f.direction === "ascending" ? "arrow-up" : "arrow-down" : "sort" })]
 							}) : e.label
@@ -664,12 +756,12 @@ function ke({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, s
 			}),
 			x.length === 0 && /* @__PURE__ */ t("p", {
 				id: g,
-				className: X.empty,
+				className: q.empty,
 				children: u
 			}),
 			/* @__PURE__ */ n("nav", {
 				"aria-label": `${e} pagination`,
-				className: X.pagination,
+				className: q.pagination,
 				children: [
 					/* @__PURE__ */ n("span", { children: [
 						r.length === 0 ? 0 : y * _ + 1,
@@ -703,7 +795,7 @@ function ke({ caption: e, rows: r, columns: i, getRowKey: a, pageSize: o = 10, s
 		]
 	});
 }
-var Z = {
+var J = {
 	alert: "_alert_1b9pw_1",
 	title: "_title_1b9pw_30",
 	region: "_region_1b9pw_34",
@@ -711,22 +803,22 @@ var Z = {
 };
 //#endregion
 //#region src/components/notifications/notifications.tsx
-function Ae({ tone: e = "info", title: r, children: i, className: a, role: o, ...s }) {
+function He({ tone: e = "info", title: r, children: i, className: a, role: o, ...s }) {
 	return /* @__PURE__ */ t("div", {
 		...s,
 		role: o ?? (e === "error" ? "alert" : "status"),
-		className: L(Z.alert, a),
+		className: L(J.alert, a),
 		"data-tone": e,
 		children: /* @__PURE__ */ n("div", { children: [r && /* @__PURE__ */ t("strong", {
-			className: Z.title,
+			className: J.title,
 			children: r
 		}), i] })
 	});
 }
-var je = ne(null);
-function Me({ notification: e, dismiss: r }) {
+var Ue = le(null);
+function We({ notification: e, dismiss: r }) {
 	let [i, a] = I(!1), [o, s] = I(!1), c = F(e.duration);
-	return ie(() => {
+	return de(() => {
 		if (i || o || e.duration <= 0) return;
 		let t = Date.now(), n = setTimeout(() => r(e.id), Math.max(0, c.current));
 		return () => {
@@ -739,7 +831,7 @@ function Me({ notification: e, dismiss: r }) {
 		e.id,
 		r
 	]), /* @__PURE__ */ n("div", {
-		className: Z.alert,
+		className: J.alert,
 		"data-tone": e.tone,
 		role: e.tone === "error" ? "alert" : "status",
 		onMouseEnter: () => a(!0),
@@ -749,18 +841,18 @@ function Me({ notification: e, dismiss: r }) {
 			e.currentTarget.contains(e.relatedTarget) || s(!1);
 		},
 		children: [/* @__PURE__ */ n("div", { children: [e.title && /* @__PURE__ */ t("strong", {
-			className: Z.title,
+			className: J.title,
 			children: e.title
 		}), e.message] }), /* @__PURE__ */ t("button", {
-			className: Z.dismiss,
+			className: J.dismiss,
 			onClick: () => r(e.id),
 			"aria-label": "Dismiss notification",
 			children: /* @__PURE__ */ t(H, { name: "close" })
 		})]
 	});
 }
-function Ne({ children: e, defaultDuration: r = 4e3 }) {
-	let [i, a] = I([]), o = F(0), s = P((e) => a((t) => t.filter((t) => t.id !== e)), []), c = P(() => a([]), []), l = P((e, t, n = {}) => {
+function Ge({ children: e, defaultDuration: r = 4e3 }) {
+	let [i, a] = I([]), o = F(0), s = N((e) => a((t) => t.filter((t) => t.id !== e)), []), c = N(() => a([]), []), l = N((e, t, n = {}) => {
 		let i = ++o.current;
 		return a((a) => [...a, {
 			...n,
@@ -769,7 +861,7 @@ function Ne({ children: e, defaultDuration: r = 4e3 }) {
 			message: t,
 			duration: n.duration ?? r
 		}]), i;
-	}, [r]), u = oe(() => ({
+	}, [r]), u = fe(() => ({
 		info: (e, t) => l("info", e, t),
 		success: (e, t) => l("success", e, t),
 		warn: (e, t) => l("warn", e, t),
@@ -781,25 +873,25 @@ function Ne({ children: e, defaultDuration: r = 4e3 }) {
 		s,
 		c
 	]);
-	return /* @__PURE__ */ n(je, {
+	return /* @__PURE__ */ n(Ue, {
 		value: u,
-		children: [e, i.length > 0 && typeof document < "u" && se(/* @__PURE__ */ t("section", {
-			className: Z.region,
+		children: [e, i.length > 0 && typeof document < "u" && pe(/* @__PURE__ */ t("section", {
+			className: J.region,
 			"aria-label": "Notifications",
 			"data-react-aria-top-layer": !0,
-			children: i.map((e) => /* @__PURE__ */ t(Me, {
+			children: i.map((e) => /* @__PURE__ */ t(We, {
 				notification: e,
 				dismiss: s
 			}, e.id))
 		}), document.body)]
 	});
 }
-function Pe() {
-	let e = re(je);
+function Ke() {
+	let e = ue(Ue);
 	if (!e) throw Error("useNotifications must be used within NotificationsProvider.");
 	return e;
 }
-var Q = {
+var Y = {
 	bars: "_bars_10i45_1",
 	stretch: "_stretch_10i45_1",
 	spinner: "_spinner_10i45_26",
@@ -811,12 +903,12 @@ var Q = {
 };
 //#endregion
 //#region src/components/loader/loader.tsx
-function Fe({ label: e = "Loading", color: n, className: r }) {
+function qe({ label: e = "Loading", color: n, className: r }) {
 	return /* @__PURE__ */ t("div", {
 		role: "progressbar",
 		"aria-label": e,
 		"aria-busy": "true",
-		className: L(Q.bars, r),
+		className: L(Y.bars, r),
 		style: { "--bt-bar-loader-color": n },
 		children: [
 			0,
@@ -827,29 +919,29 @@ function Fe({ label: e = "Loading", color: n, className: r }) {
 		].map((e) => /* @__PURE__ */ t("span", { "aria-hidden": "true" }, e))
 	});
 }
-function Ie({ label: e = "Loading", className: n }) {
+function Je({ label: e = "Loading", className: n }) {
 	return /* @__PURE__ */ t("div", {
 		role: "progressbar",
 		"aria-label": e,
 		"aria-busy": "true",
-		className: L(Q.spinner, n)
+		className: L(Y.spinner, n)
 	});
 }
-function Le({ label: r, className: i, ...a }) {
-	return /* @__PURE__ */ t(C, {
+function Ye({ label: r, className: i, ...a }) {
+	return /* @__PURE__ */ t(T, {
 		...a,
-		className: L(Q.progress, i),
-		children: ({ percentage: i, isIndeterminate: a }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(f, { children: r }), /* @__PURE__ */ t("div", {
-			className: Q.track,
+		className: L(Y.progress, i),
+		children: ({ percentage: i, isIndeterminate: a }) => /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t(p, { children: r }), /* @__PURE__ */ t("div", {
+			className: Y.track,
 			children: /* @__PURE__ */ t("div", {
-				className: Q.fill,
+				className: Y.fill,
 				"data-indeterminate": a || void 0,
 				style: { width: a ? "35%" : `${i}%` }
 			})
 		})] })
 	});
 }
-var $ = {
+var X = {
 	card: "_card_n4hcj_1",
 	badge: "_badge_n4hcj_15",
 	heading: "_heading_n4hcj_49",
@@ -860,41 +952,139 @@ var $ = {
 };
 //#endregion
 //#region src/components/surface/surface.tsx
-function Re({ variant: e = "outlined", className: n, ...r }) {
+function Xe({ variant: e = "outlined", className: n, ...r }) {
 	return /* @__PURE__ */ t("section", {
 		...r,
-		className: L($.card, n),
+		className: L(X.card, n),
 		"data-variant": e
 	});
 }
-function ze({ tone: e = "neutral", className: n, ...r }) {
+function Ze({ tone: e = "neutral", className: n, ...r }) {
 	return /* @__PURE__ */ t("span", {
 		...r,
-		className: L($.badge, n),
+		className: L(X.badge, n),
 		"data-tone": e
 	});
 }
-function Be({ level: e = 2, className: n, ...r }) {
+function Qe({ level: e = 2, className: n, ...r }) {
 	let i = `h${e}`;
 	return /* @__PURE__ */ t(i, {
 		...r,
-		className: L($.heading, n)
+		className: L(X.heading, n)
 	});
 }
-function Ve({ muted: e = !1, className: n, ...r }) {
+function $e({ muted: e = !1, className: n, ...r }) {
 	return /* @__PURE__ */ t("p", {
 		...r,
-		className: L($.text, e && $.muted, n)
+		className: L(X.text, e && X.muted, n)
 	});
 }
-function He({ children: e }) {
+function et({ children: e }) {
 	return /* @__PURE__ */ t("code", {
-		className: $.code,
+		className: X.code,
 		children: e
 	});
 }
-function Ue() {
-	return /* @__PURE__ */ t("hr", { className: $.divider });
+function tt() {
+	return /* @__PURE__ */ t("hr", { className: X.divider });
+}
+var Z = {
+	tabs: "_tabs_1mv8v_1",
+	list: "_list_1mv8v_6",
+	tab: "_tab_1mv8v_1",
+	panel: "_panel_1mv8v_30"
+};
+//#endregion
+//#region src/components/tabs/tabs.tsx
+function nt({ className: e, ...n }) {
+	return /* @__PURE__ */ t(ie, {
+		...n,
+		className: L(Z.tabs, e)
+	});
+}
+function rt({ className: e, ...n }) {
+	return /* @__PURE__ */ t(ne, {
+		...n,
+		className: L(Z.list, e)
+	});
+}
+function it({ className: e, ...n }) {
+	return /* @__PURE__ */ t(te, {
+		...n,
+		className: L(Z.tab, e)
+	});
+}
+function at({ className: e, ...n }) {
+	return /* @__PURE__ */ t(re, {
+		...n,
+		className: L(Z.panel, e)
+	});
+}
+var Q = {
+	group: "_group_1rh6o_1",
+	skeleton: "_skeleton_1rh6o_4",
+	pulse: "_pulse_1rh6o_1",
+	status: "_status_1rh6o_20"
+};
+//#endregion
+//#region src/components/skeleton/skeleton.tsx
+function ot({ variant: e = "text", width: n, height: r, className: i, style: a, ...o }) {
+	return /* @__PURE__ */ t("div", {
+		...o,
+		"aria-hidden": "true",
+		className: L(Q.skeleton, i),
+		"data-variant": e,
+		style: {
+			width: n,
+			height: r,
+			...a
+		}
+	});
+}
+function st({ label: e, children: r, className: i, ...a }) {
+	return /* @__PURE__ */ n("div", {
+		...a,
+		className: L(Q.group, i),
+		children: [/* @__PURE__ */ t("span", {
+			role: "status",
+			className: Q.status,
+			children: e
+		}), /* @__PURE__ */ t("div", {
+			"aria-hidden": "true",
+			children: r
+		})]
+	});
+}
+var $ = {
+	empty: "_empty_14d8y_1",
+	description: "_description_14d8y_11",
+	action: "_action_14d8y_15"
+};
+//#endregion
+//#region src/components/empty-state/empty-state.tsx
+function ct({ title: e, description: r, action: i, headingLevel: a = 2, children: o, className: s, ...c }) {
+	let l = P();
+	return /* @__PURE__ */ n("section", {
+		...c,
+		"aria-labelledby": l,
+		className: L($.empty, s),
+		children: [
+			/* @__PURE__ */ t(Qe, {
+				id: l,
+				level: a,
+				children: e
+			}),
+			r && /* @__PURE__ */ t("div", {
+				className: $.description,
+				children: r
+			}),
+			o,
+			i && /* @__PURE__ */ t("div", {
+				className: $.action,
+				children: i
+			})
+		]
+	});
 }
 //#endregion
-export { Ae as Alert, ce as AppHeader, le as AppHeaderActions, ue as AppMain, ze as Badge, Fe as BarLoader, B as Button, Re as Card, _e as Checkbox, He as Code, ge as ComboBox, ke as DataTable, Ee as Dialog, s as DialogTrigger, Ue as Divider, xe as DonutSlider, Be as Heading, de as LinkButton, q as Menu, Se as MenuItem, Ce as MenuPopover, we as MenuSeparator, v as MenuTrigger, Ne as NotificationsProvider, Le as ProgressBar, ye as Radio, ve as RadioGroup, he as Select, Ie as Spinner, Te as SplitButton, k as SubmenuTrigger, be as Switch, Ve as Text, fe as TextField, Oe as Tooltip, Pe as useNotifications };
+export { He as Alert, me as AppHeader, he as AppHeaderActions, ge as AppMain, Ze as Badge, qe as BarLoader, B as Button, Xe as Card, Te as Checkbox, Ee as CheckboxGroup, et as Code, we as ComboBox, Ve as DataTable, Re as Dialog, c as DialogTrigger, tt as Divider, Me as DonutSlider, ct as EmptyState, Qe as Heading, _e as LinkButton, Ne as Menu, Pe as MenuItem, Fe as MenuPopover, Ie as MenuSeparator, y as MenuTrigger, Ce as MultiSelect, Ge as NotificationsProvider, ye as NumberField, Ye as ProgressBar, Oe as Radio, De as RadioGroup, Se as Select, ot as Skeleton, st as SkeletonGroup, Je as Spinner, Le as SplitButton, ee as SubmenuTrigger, ke as Switch, it as Tab, rt as TabList, at as TabPanel, nt as Tabs, $e as Text, ve as TextField, Be as Tooltip, Ke as useNotifications };