@motech-development/breeze-ui 4.4.0 → 4.5.0

package/lib/index.js

@@ -5,24 +5,33 @@ import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
 import { Button as g } from "react-aria-components/Button";
 import { ProgressBarContext as _ } from "react-aria-components/ProgressBar";
 import { useSlottedContext as v } from "react-aria-components/slots";
-import { Dialog as y } from "react-aria-components/Dialog";
-import { Modal as b, ModalOverlay as x } from "react-aria-components/Modal";
-import { Popover as S } from "react-aria-components/Popover";
-import { UNSAFE_PortalProvider as C } from "react-aria/PortalProvider";
-import { I18nProvider as w, useLocale as T } from "react-aria-components/I18nProvider";
-import { ArrowDownLeft as E, ArrowUpRight as D, Bell as ee, Building2 as te, CalendarDays as ne, Camera as re, Check as O, ChevronDown as k, ChevronLeft as A, ChevronRight as j, Clock3 as ie, Download as M, Ellipsis as ae, FileText as oe, House as se, List as N, LockKeyhole as P, LogOut as F, Plus as I, Settings as ce, Trash2 as le, TriangleAlert as L, Upload as R, Users as ue, X as z } from "lucide-react";
-import { createPortal as B } from "react-dom";
-import { parseDate as V } from "@internationalized/date";
+import { useObjectRef as y } from "react-aria/useObjectRef";
+import { CheckboxButton as b, CheckboxField as x } from "react-aria-components/Checkbox";
+import { FieldError as S } from "react-aria-components/FieldError";
+import { Label as C } from "react-aria-components/Label";
+import { Text as w } from "react-aria-components/Text";
+import { Dialog as T } from "react-aria-components/Dialog";
+import { Modal as E, ModalOverlay as D } from "react-aria-components/Modal";
+import { Popover as ee } from "react-aria-components/Popover";
+import { UNSAFE_PortalProvider as te } from "react-aria/PortalProvider";
+import { I18nProvider as ne, useLocale as re } from "react-aria-components/I18nProvider";
+import { ArrowDownLeft as O, ArrowUpRight as k, Bell as A, Building2 as j, CalendarDays as ie, Camera as ae, Check as oe, ChevronDown as se, ChevronLeft as ce, ChevronRight as M, Clock3 as N, Download as P, Ellipsis as F, FileText as le, House as ue, List as I, LockKeyhole as L, LogOut as de, Plus as fe, Settings as R, Trash2 as z, TriangleAlert as B, Upload as pe, Users as me, X as he } from "lucide-react";
+import { Group as ge } from "react-aria-components/Group";
+import { Input as _e } from "react-aria-components/Input";
+import { NumberField as ve } from "react-aria-components/NumberField";
+import { TextField as ye } from "react-aria-components/TextField";
+import { createPortal as be } from "react-dom";
+import { parseDate as xe } from "@internationalized/date";
 //#region src/provider/BreezeContext.ts
-var H = n(null);
-function U() {
-	let e = a(H);
+var Se = n(null);
+function V() {
+	let e = a(Se);
 	if (e === null) throw Error("Breeze components must be rendered within BreezeProvider.");
 	return e;
 }
 //#endregion
 //#region src/patterns/AppearanceControl/AppearanceControl.tsx
-var W = {
+var H = {
 	base: {
 		control: "breeze:flex breeze:items-center breeze:gap-breeze-2 breeze:font-breeze-sans",
 		group: "breeze:flex breeze:items-center breeze:gap-breeze-2",
@@ -33,7 +42,7 @@ var W = {
 	size: {},
 	state: { selected: "breeze:data-[selected]:border-breeze-brand breeze:data-[selected]:bg-breeze-brand-soft breeze:data-[selected]:text-breeze-brand-text breeze:forced-colors:data-[selected]:outline-2 breeze:forced-colors:data-[selected]:outline-offset-2" },
 	variant: {}
-}, de = [
+}, Ce = [
 	{
 		message: "appearanceLight",
 		value: "light"
@@ -47,30 +56,30 @@ var W = {
 		value: "dark"
 	}
 ];
-function fe(e) {
-	return de.some((t) => t.value === e);
+function we(e) {
+	return Ce.some((t) => t.value === e);
 }
-function pe() {
-	let { appearance: n, getMessageLocale: r, messages: i, setAppearance: a } = U();
+function Te() {
+	let { appearance: n, getMessageLocale: r, messages: i, setAppearance: a } = V();
 	return /* @__PURE__ */ h("div", {
-		className: W.base.control,
+		className: H.base.control,
 		children: [/* @__PURE__ */ m("span", {
-			className: W.base.label,
+			className: H.base.label,
 			lang: r("appearance"),
 			children: i.appearance
 		}), /* @__PURE__ */ m(t, {
 			"aria-label": i.appearance,
-			className: W.base.group,
+			className: H.base.group,
 			disallowEmptySelection: !0,
 			lang: r("appearance"),
 			onSelectionChange: (e) => {
 				let [t] = e;
-				fe(t) && a(t);
+				we(t) && a(t);
 			},
 			selectedKeys: [n],
 			selectionMode: "single",
-			children: de.map((t) => /* @__PURE__ */ m(e, {
-				className: [W.base.option, W.state.selected].join(" "),
+			children: Ce.map((t) => /* @__PURE__ */ m(e, {
+				className: [H.base.option, H.state.selected].join(" "),
 				id: t.value,
 				lang: r(t.message),
 				children: i[t.message]
@@ -80,7 +89,7 @@ function pe() {
 }
 //#endregion
 //#region src/primitives/Skeleton/Skeleton.tsx
-var G = {
+var Ee = {
 	base: { skeleton: "breeze:block breeze:animate-pulse breeze:appearance-none breeze:bg-breeze-ink-3 breeze:pointer-events-none breeze:forced-colors:outline breeze:forced-colors:outline-1 breeze:forced-colors:outline-[CanvasText]" },
 	compound: {},
 	size: {},
@@ -91,37 +100,37 @@ var G = {
 		text: "breeze:block-size-breeze-3 breeze:inline-size-full breeze:rounded-breeze-xs"
 	}
 };
-function me({ blockSize: e, inlineSize: t, label: n, shape: r = "text" }) {
-	let { getMessageLocale: i, messages: a } = U(), o = n?.trim() || void 0, s = e ?? t ?? "0.75rem", c = {
+function U({ blockSize: e, inlineSize: t, label: n, shape: r = "text" }) {
+	let { getMessageLocale: i, messages: a } = V(), o = n?.trim() || void 0, s = e ?? t ?? "0.75rem", c = {
 		blockSize: r === "circle" ? s : e,
 		inlineSize: r === "circle" ? s : t
 	};
 	return /* @__PURE__ */ m("progress", {
 		"aria-hidden": o === void 0 || void 0,
 		"aria-label": o,
-		className: [G.base.skeleton, G.variant[r]].join(" "),
+		className: [Ee.base.skeleton, Ee.variant[r]].join(" "),
 		lang: o === a.loading.trim() ? i("loading") : void 0,
 		style: c
 	});
 }
 //#endregion
 //#region src/primitives/VisuallyHidden/VisuallyHidden.tsx
-var he = {
+var De = {
 	base: { hidden: "breeze:sr-only" },
 	compound: {},
 	size: {},
 	state: {},
 	variant: {}
 };
-function ge({ children: e }) {
+function Oe({ children: e }) {
 	return /* @__PURE__ */ m("span", {
-		className: he.base.hidden,
+		className: De.base.hidden,
 		children: e
 	});
 }
 //#endregion
 //#region src/primitives/Badge/Badge.tsx
-var K = {
+var W = {
 	base: {
 		badge: "breeze:inline-grid breeze:shrink-0 breeze:items-center breeze:whitespace-nowrap breeze:rounded-breeze-chip breeze:ps-breeze-2 breeze:pe-breeze-2 breeze:py-breeze-px breeze:text-breeze-2xs breeze:font-bold breeze:leading-breeze-snug breeze:tracking-breeze-wide",
 		content: "breeze:[grid-area:1/1]",
@@ -138,29 +147,29 @@ var K = {
 		warning: "breeze:bg-breeze-warn-soft breeze:text-breeze-warn"
 	}
 };
-function _e({ "aria-label": e, children: t, loading: n = !1, variant: r = "neutral" }) {
-	let { messages: i } = U(), a = e?.trim() || void 0, o;
+function ke({ "aria-label": e, children: t, loading: n = !1, variant: r = "neutral" }) {
+	let { messages: i } = V(), a = e?.trim() || void 0, o;
 	return n ? o = /* @__PURE__ */ m("span", {
-		className: K.base.skeleton,
-		children: /* @__PURE__ */ m(me, {
+		className: W.base.skeleton,
+		children: /* @__PURE__ */ m(U, {
 			blockSize: 8,
 			inlineSize: "100%",
 			label: i.loading,
 			shape: "rectangle"
 		})
-	}) : a !== void 0 && (o = /* @__PURE__ */ m(ge, { children: a })), /* @__PURE__ */ h("span", {
+	}) : a !== void 0 && (o = /* @__PURE__ */ m(Oe, { children: a })), /* @__PURE__ */ h("span", {
 		"aria-busy": n || void 0,
-		className: [K.base.badge, K.variant[r]].join(" "),
+		className: [W.base.badge, W.variant[r]].join(" "),
 		children: [/* @__PURE__ */ m("span", {
 			"aria-hidden": n || a !== void 0 ? !0 : void 0,
-			className: [K.base.content, n && K.state.contentLoading].filter(Boolean).join(" "),
+			className: [W.base.content, n && W.state.contentLoading].filter(Boolean).join(" "),
 			children: t
 		}), o]
 	});
 }
 //#endregion
 //#region src/primitives/Button/Button.tsx
-var q = {
+var G = {
 	base: {
 		button: "breeze:relative breeze:inline-grid breeze:items-center breeze:justify-center breeze:gap-breeze-2 breeze:border breeze:border-solid breeze:rounded-breeze-ctl breeze:font-breeze-sans breeze:text-breeze-sm breeze:leading-breeze-snug breeze:cursor-pointer breeze:select-none breeze:[text-align:center] breeze:outline-offset-2 breeze:data-[focus-visible]:outline-2 breeze:data-[focus-visible]:outline-solid breeze:data-[focus-visible]:outline-breeze-brand breeze:any-pointer-coarse:min-block-breeze-tap breeze:any-pointer-coarse:min-inline-breeze-tap",
 		label: "breeze:[grid-area:1/1]",
@@ -190,23 +199,23 @@ var q = {
 		secondary: "breeze:border-breeze-line-strong breeze:bg-breeze-surface breeze:text-breeze-ink breeze:data-[hovered]:bg-breeze-sunken breeze:data-[pressed]:bg-breeze-sunken"
 	}
 };
-function ve() {
-	let e = v(_), { getMessageLocale: t, messages: n } = U();
+function Ae() {
+	let e = v(_), { getMessageLocale: t, messages: n } = V();
 	return /* @__PURE__ */ m("progress", {
 		"aria-label": n.loading,
-		className: q.state.loadingStatus,
+		className: G.state.loadingStatus,
 		id: e?.id,
 		lang: t("loading")
 	});
 }
-function ye({ "aria-controls": e, "aria-describedby": t, "aria-expanded": n, "aria-haspopup": i, "aria-label": a, "aria-labelledby": o, children: s, disabled: c = !1, form: l, id: u, loading: d = !1, name: f, onAction: _, ref: v, size: y = "md", type: b = "button", value: x, variant: S = "primary" }) {
-	U();
+function je({ "aria-controls": e, "aria-describedby": t, "aria-expanded": n, "aria-haspopup": i, "aria-label": a, "aria-labelledby": o, children: s, disabled: c = !1, form: l, id: u, loading: d = !1, name: f, onAction: _, ref: v, size: y = "md", type: b = "button", value: x, variant: S = "primary" }) {
+	V();
 	let C = [
-		q.base.button,
-		q.variant[S],
-		q.size[y],
-		c && q.state.disabled,
-		d && q.state.loading
+		G.base.button,
+		G.variant[S],
+		G.size[y],
+		c && G.state.disabled,
+		d && G.state.loading
 	].filter(Boolean).join(" ");
 	return /* @__PURE__ */ h(g, {
 		"aria-controls": e,
@@ -232,18 +241,18 @@ function ye({ "aria-controls": e, "aria-describedby": t, "aria-expanded": n, "ar
 		type: b,
 		value: x,
 		children: [/* @__PURE__ */ m("span", {
-			className: [q.base.label, d && q.state.loadingLabel].filter(Boolean).join(" "),
+			className: [G.base.label, d && G.state.loadingLabel].filter(Boolean).join(" "),
 			children: s
-		}), d && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(ve, {}), /* @__PURE__ */ m("span", {
+		}), d && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(Ae, {}), /* @__PURE__ */ m("span", {
 			"aria-hidden": "true",
-			className: [q.base.skeleton, q.compound.loading[S]].join(" "),
+			className: [G.base.skeleton, G.compound.loading[S]].join(" "),
 			"data-breeze-skeleton": ""
 		})] })]
 	});
 }
 //#endregion
 //#region src/primitives/layout.accessibility.ts
-function J(e, t) {
+function K(e, t) {
 	let n = e?.trim() || void 0;
 	return {
 		accessibleLabel: n,
@@ -252,7 +261,7 @@ function J(e, t) {
 }
 //#endregion
 //#region src/primitives/Card/Card.tsx
-var be = {
+var Me = {
 	base: { card: "breeze:min-inline-size-0 breeze:rounded-breeze-panel breeze:border breeze:border-solid breeze:border-breeze-line breeze:shadow-breeze-panel" },
 	compound: {},
 	size: {
@@ -272,22 +281,144 @@ var be = {
 		surface: "breeze:bg-breeze-surface"
 	}
 };
-function xe({ "aria-label": e, children: t, clipped: n = !0, element: i = "div", padding: a = 4, variant: o = "surface" }) {
-	let { accessibleLabel: s, role: c } = J(e, i);
+function Ne({ "aria-label": e, children: t, clipped: n = !0, element: i = "div", padding: a = 4, variant: o = "surface" }) {
+	let { accessibleLabel: s, role: c } = K(e, i);
 	return r(i, {
 		"aria-label": s,
 		className: [
-			be.base.card,
-			be.variant[o],
-			be.size[a],
-			n && be.state.clipped
+			Me.base.card,
+			Me.variant[o],
+			Me.size[a],
+			n && Me.state.clipped
 		].filter(Boolean).join(" "),
 		role: c
 	}, t);
 }
 //#endregion
+//#region src/primitives/Field/field.styles.ts
+var q = {
+	base: {
+		control: "breeze:relative breeze:inline-grid breeze:min-inline-size-0 breeze:inline-size-full",
+		description: "breeze:m-0 breeze:text-breeze-xs breeze:font-normal breeze:leading-breeze-snug breeze:text-breeze-ink-3",
+		error: "breeze:m-0 breeze:text-breeze-xs breeze:font-medium breeze:leading-breeze-snug breeze:text-breeze-danger",
+		input: "breeze:min-block-breeze-md breeze:any-pointer-coarse:min-block-breeze-tap breeze:min-inline-size-0 breeze:inline-size-full breeze:rounded-breeze-ctl breeze:border breeze:border-solid breeze:border-breeze-line-strong breeze:bg-breeze-surface breeze:ps-breeze-3 breeze:pe-breeze-3 breeze:py-breeze-2 breeze:font-breeze-sans breeze:text-breeze-sm breeze:leading-breeze-snug breeze:text-breeze-ink breeze:outline-offset-2 breeze:placeholder:text-breeze-ink-3 breeze:data-[hovered]:border-breeze-brand breeze:data-[focus-visible]:outline-2 breeze:data-[focus-visible]:outline-solid breeze:data-[focus-visible]:outline-breeze-brand breeze:data-[invalid]:border-breeze-danger breeze:disabled:cursor-not-allowed breeze:disabled:bg-breeze-sunken breeze:disabled:opacity-60 breeze:read-only:cursor-default breeze:read-only:bg-breeze-sunken",
+		label: "breeze:m-0 breeze:text-breeze-xs breeze:font-medium breeze:leading-breeze-snug breeze:text-breeze-ink",
+		root: "breeze:flex breeze:min-inline-size-0 breeze:flex-col breeze:gap-breeze-2",
+		skeleton: "breeze:pointer-events-none breeze:absolute breeze:[inset-block:0] breeze:[inset-inline:0]"
+	},
+	compound: {},
+	size: {},
+	state: { loadingInput: "breeze:!opacity-0" },
+	variant: {}
+};
+function J(...e) {
+	return e.filter(Boolean).join(" ");
+}
+//#endregion
+//#region src/primitives/Field/field.presentation.tsx
+function Pe({ label: e, loading: t }) {
+	return /* @__PURE__ */ m(C, {
+		className: q.base.label,
+		children: t ? /* @__PURE__ */ m(U, {
+			blockSize: "1lh",
+			inlineSize: "12em",
+			shape: "rectangle"
+		}) : e
+	});
+}
+function Fe({ description: e, error: t, loading: n }) {
+	return /* @__PURE__ */ h(p, { children: [e && /* @__PURE__ */ m(w, {
+		className: q.base.description,
+		slot: "description",
+		children: n ? /* @__PURE__ */ m(U, {
+			blockSize: "1lh",
+			inlineSize: "12em",
+			shape: "rectangle"
+		}) : e
+	}), t && (n ? /* @__PURE__ */ m("span", {
+		"aria-hidden": "true",
+		className: q.base.error,
+		children: /* @__PURE__ */ m(U, {
+			blockSize: "1lh",
+			inlineSize: "12em",
+			shape: "rectangle"
+		})
+	}) : /* @__PURE__ */ m(S, {
+		className: q.base.error,
+		children: t
+	}))] });
+}
+//#endregion
+//#region src/primitives/Checkbox/Checkbox.tsx
+var Y = {
+	base: {
+		control: "breeze:relative breeze:inline-grid breeze:min-block-breeze-tap breeze:grid-flow-col breeze:items-center breeze:gap-breeze-2 breeze:cursor-pointer breeze:select-none breeze:font-breeze-sans breeze:text-breeze-sm breeze:font-medium breeze:leading-breeze-snug breeze:text-breeze-ink breeze:data-[disabled]:cursor-not-allowed breeze:data-[disabled]:opacity-60",
+		indicator: "breeze:inline-grid breeze:block-size-breeze-5 breeze:inline-size-breeze-5 breeze:shrink-0 breeze:place-items-center breeze:rounded-breeze-chip breeze:border breeze:border-solid breeze:border-breeze-ink-3 breeze:bg-breeze-surface breeze:text-breeze-on-brand breeze:transition-colors breeze:data-[selected]:border-breeze-brand breeze:data-[selected]:bg-breeze-brand breeze:data-[focus-visible]:outline-2 breeze:data-[focus-visible]:outline-solid breeze:data-[focus-visible]:outline-breeze-brand",
+		label: "breeze:[grid-area:1/2]",
+		skeleton: "breeze:pointer-events-none breeze:[grid-area:1/2]",
+		skeletonIndicator: "breeze:pointer-events-none breeze:[grid-area:1/1] breeze:block-size-breeze-5 breeze:inline-size-breeze-5"
+	},
+	compound: {},
+	size: {},
+	state: {},
+	variant: {}
+};
+function Ie({ defaultSelected: e, description: t, disabled: n = !1, error: r, form: i, id: a, label: o, loading: s = !1, name: c, onChange: l, readOnly: u = !1, ref: d, required: f = !1, selected: g, value: _ }) {
+	let { messages: v } = V(), S = y(d), C = t?.trim() || void 0, w = r?.trim() || void 0, T = n || s;
+	return /* @__PURE__ */ h(x, {
+		className: q.base.root,
+		defaultSelected: e,
+		form: i,
+		id: a,
+		inputRef: S,
+		"aria-label": s ? o : void 0,
+		isDisabled: T,
+		isInvalid: !s && w !== void 0,
+		isReadOnly: u,
+		isRequired: f,
+		isSelected: g,
+		name: c,
+		onChange: l,
+		value: _,
+		validationBehavior: "aria",
+		children: [/* @__PURE__ */ m(b, {
+			className: Y.base.control,
+			children: ({ isFocusVisible: e, isSelected: t }) => /* @__PURE__ */ h(p, { children: [s && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
+				"aria-hidden": "true",
+				className: Y.base.skeletonIndicator,
+				children: /* @__PURE__ */ m(U, {
+					blockSize: "100%",
+					inlineSize: "100%",
+					shape: "rectangle"
+				})
+			}), /* @__PURE__ */ m("span", {
+				className: Y.base.skeleton,
+				children: /* @__PURE__ */ m(U, {
+					blockSize: "1lh",
+					inlineSize: "12em",
+					label: v.loading,
+					shape: "rectangle"
+				})
+			})] }), !s && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
+				"aria-hidden": "true",
+				className: Y.base.indicator,
+				"data-focus-visible": e || void 0,
+				"data-selected": t || void 0,
+				children: t ? "✓" : ""
+			}), /* @__PURE__ */ m("span", {
+				className: Y.base.label,
+				children: o
+			})] })] })
+		}), /* @__PURE__ */ m(Fe, {
+			description: C,
+			error: w,
+			loading: s
+		})]
+	});
+}
+//#endregion
 //#region src/primitives/Container/Container.tsx
-var Se = {
+var Le = {
 	base: { container: "breeze:mx-auto breeze:inline-size-full breeze:min-inline-size-0" },
 	compound: {},
 	size: {
@@ -298,21 +429,21 @@ var Se = {
 	state: { padded: "breeze:ps-breeze-4 breeze:pe-breeze-4 breeze:breeze-md:ps-breeze-7 breeze:breeze-md:pe-breeze-7" },
 	variant: {}
 };
-function Ce({ "aria-label": e, children: t, element: n = "div", padded: i = !0, width: a = "page" }) {
-	let { accessibleLabel: o, role: s } = J(e, n);
+function Re({ "aria-label": e, children: t, element: n = "div", padded: i = !0, width: a = "page" }) {
+	let { accessibleLabel: o, role: s } = K(e, n);
 	return r(n, {
 		"aria-label": o,
 		className: [
-			Se.base.container,
-			Se.size[a],
-			i && Se.state.padded
+			Le.base.container,
+			Le.size[a],
+			i && Le.state.padded
 		].filter(Boolean).join(" "),
 		role: s
 	}, t);
 }
 //#endregion
 //#region src/overlays/OverlayStack.ts
-function we() {
+function ze() {
 	let e = [], t = /* @__PURE__ */ new Set(), n = () => t.forEach((e) => e());
 	return {
 		getSnapshot: () => e,
@@ -328,15 +459,15 @@ function we() {
 		})
 	};
 }
-var Te = n(null);
-function Ee() {
-	let e = a(Te);
+var Be = n(null);
+function Ve() {
+	let e = a(Be);
 	if (!e) throw Error("Breeze components must be rendered within BreezeProvider.");
 	return 100 + f(e.subscribe, e.getSnapshot, e.getSnapshot).length * 2;
 }
-var De = n(null);
-function Oe(e, t, n) {
-	let r = a(Te), i = a(De), o = s();
+var He = n(null);
+function Ue(e, t, n) {
+	let r = a(Be), i = a(He), o = s();
 	if (!r) throw Error("Breeze components must be rendered within BreezeProvider.");
 	let l = f(r.subscribe, r.getSnapshot, r.getSnapshot), u = i?.id;
 	c(() => () => r.remove(o), [o, r]), c(() => {
@@ -375,12 +506,12 @@ function Oe(e, t, n) {
 }
 //#endregion
 //#region src/overlays/OverlayProvider.tsx
-var ke = n(null), Ae = "BreezeProvider portalContainer must belong to the current document and light DOM.";
-function je({ children: e, portalContainer: t, locale: n }) {
-	let { direction: r } = T(), [i] = d(we), [a, o] = d(null);
+var We = n(null), Ge = "BreezeProvider portalContainer must belong to the current document and light DOM.";
+function Ke({ children: e, portalContainer: t, locale: n }) {
+	let { direction: r } = re(), [i] = d(ze), [a, o] = d(null);
 	return c(() => {
 		let e = t ?? document.body;
-		if (e.ownerDocument !== document || e.getRootNode() !== document) throw Error(Ae);
+		if (e.ownerDocument !== document || e.getRootNode() !== document) throw Error(Ge);
 		let n = e.ownerDocument.createElement("div");
 		return n.dataset.breezeRoot = "", n.dataset.breezePortal = "", e.append(n), o(n), () => n.remove();
 	}, [t]), c(() => {
@@ -389,23 +520,23 @@ function je({ children: e, portalContainer: t, locale: n }) {
 		r,
 		a,
 		n
-	]), /* @__PURE__ */ m(C, {
+	]), /* @__PURE__ */ m(te, {
 		getContainer: () => a,
-		children: /* @__PURE__ */ m(Te, {
+		children: /* @__PURE__ */ m(Be, {
 			value: i,
-			children: /* @__PURE__ */ m(ke, {
+			children: /* @__PURE__ */ m(We, {
 				value: a,
 				children: e
 			})
 		})
 	});
 }
-function Me() {
-	return a(ke);
+function qe() {
+	return a(We);
 }
 //#endregion
 //#region src/overlays/OverlaySurface.tsx
-var Y = {
+var X = {
 	base: {
 		content: "breeze-overlay-content",
 		header: "breeze-overlay-header",
@@ -420,24 +551,24 @@ var Y = {
 		fullscreen: "breeze-fullscreen",
 		popover: "breeze-popover"
 	}
-}, Ne = "Breeze overlay triggers and portal containers must belong to the current document and light DOM.";
-function X(e) {
+}, Je = "Breeze overlay triggers and portal containers must belong to the current document and light DOM.";
+function Ye(e) {
 	return typeof e == "object" && !!e && "nodeType" in e && typeof e.contains == "function";
 }
-function Pe(e) {
+function Xe(e) {
 	return e.dataset?.breezeOverlay !== void 0;
 }
-function Fe({ children: e, defaultOpen: t = !1, dismissible: n = !0, kind: r, onOpenChange: s, open: f, placement: g = "bottom", title: _, trigger: v }) {
-	let { getMessageLocale: C, messages: w } = U(), T = r === "popover" || r === "fullscreen", E = Me(), D = a(De), [ee, te] = d(D === null);
+function Ze({ children: e, defaultOpen: t = !1, dismissible: n = !0, kind: r, onOpenChange: s, open: f, placement: g = "bottom", title: _, trigger: v }) {
+	let { getMessageLocale: y, messages: b } = V(), x = r === "popover" || r === "fullscreen", S = qe(), C = a(He), [w, te] = d(C === null);
 	o(() => te(!0), []);
-	let [ne, re] = d(t), O = f ?? ne, k = D?.open ?? !0, A = O && k, j = u(null), ie = u(null), M = u(null), [ae, oe] = d(!1), se = u(!1), N = u(null), P = u(null), F = u(null), I = u(null), ce = u(!1);
+	let [ne, re] = d(t), O = f ?? ne, k = C?.open ?? !0, A = O && k, j = u(null), ie = u(null), ae = u(null), [oe, se] = d(!1), ce = u(!1), M = u(null), N = u(null), P = u(null), F = u(null), le = u(!1);
 	c(() => {
-		if (E && j.current && (j.current.ownerDocument !== document || j.current.getRootNode() !== document || E.ownerDocument !== document || E.getRootNode() !== document)) throw Error(Ne);
-	}, [E]);
-	let le = l(() => r === "fullscreen" ? { current: E } : j, [E, r]), L = Oe(r, A && ee && E !== null, A || ae), R = i((e) => {
+		if (S && j.current && (j.current.ownerDocument !== document || j.current.getRootNode() !== document || S.ownerDocument !== document || S.getRootNode() !== document)) throw Error(Je);
+	}, [S]);
+	let ue = l(() => r === "fullscreen" ? { current: S } : j, [S, r]), I = Ue(r, A && w && S !== null, A || oe), L = i((e) => {
 		if (!e && !k) {
-			if (ce.current) return;
-			O && (ce.current = !0);
+			if (le.current) return;
+			O && (le.current = !0);
 		}
 		f === void 0 && re(e), s?.(e);
 	}, [
@@ -447,187 +578,187 @@ function Fe({ children: e, defaultOpen: t = !1, dismissible: n = !0, kind: r, on
 		O
 	]);
 	o(() => {
-		k ? ce.current = !1 : O && R(!1);
+		k ? le.current = !1 : O && L(!1);
 	}, [
-		R,
+		L,
 		k,
 		O
 	]), o(() => {
-		if (r !== "popover" || !A || !n || !L.topmost || !E) return;
+		if (r !== "popover" || !A || !n || !I.topmost || !S) return;
 		let e = () => {
-			P.current !== null && (clearTimeout(P.current), P.current = null);
-		}, t = (e, t) => !!e && !!t && (e === t || e.contains(t) || t.contains(e)), i = (e) => e.button === 0, a = (e) => X(e) && !ie.current?.contains(e) && !j.current?.contains(e), o = (t) => {
-			i(t) && (e(), I.current = null, F.current = X(t.target) ? t.target : null);
+			N.current !== null && (clearTimeout(N.current), N.current = null);
+		}, t = (e, t) => !!e && !!t && (e === t || e.contains(t) || t.contains(e)), i = (e) => e.button === 0, a = (e) => Ye(e) && !ie.current?.contains(e) && !j.current?.contains(e), o = (t) => {
+			i(t) && (e(), F.current = null, P.current = Ye(t.target) ? t.target : null);
 		}, s = (n) => {
 			if (!i(n)) return;
-			let r = F.current, o = X(n.target) ? n.target : null;
-			!a(r) || !a(o) || (e(), P.current = setTimeout(() => {
-				P.current = null;
-				let e = I.current, n = F.current;
-				I.current = null, F.current = null, !(t(e, o) && t(e, n)) && R(!1);
+			let r = P.current, o = Ye(n.target) ? n.target : null;
+			!a(r) || !a(o) || (e(), N.current = setTimeout(() => {
+				N.current = null;
+				let e = F.current, n = P.current;
+				F.current = null, P.current = null, !(t(e, o) && t(e, n)) && L(!1);
 			}, 0));
 		}, c = () => {
-			e(), I.current = null, F.current = null;
+			e(), F.current = null, P.current = null;
 		}, l = (n) => {
-			let r = X(n.target) ? n.target : null;
+			let r = Ye(n.target) ? n.target : null;
 			if (e(), a(r)) {
-				let e = I.current, n = F.current;
-				if (I.current = null, F.current = null, t(e, r) && t(e, n)) return;
-				R(!1);
+				let e = F.current, n = P.current;
+				if (F.current = null, P.current = null, t(e, r) && t(e, n)) return;
+				L(!1);
 			}
 		};
-		return E.ownerDocument.addEventListener("pointerdown", o, !0), E.ownerDocument.addEventListener("pointerup", s, !0), E.ownerDocument.addEventListener("pointercancel", c, !0), E.ownerDocument.addEventListener("click", l, !0), () => {
-			e(), E.ownerDocument.removeEventListener("pointerdown", o, !0), E.ownerDocument.removeEventListener("pointerup", s, !0), E.ownerDocument.removeEventListener("pointercancel", c, !0), E.ownerDocument.removeEventListener("click", l, !0), I.current = null, F.current = null;
+		return S.ownerDocument.addEventListener("pointerdown", o, !0), S.ownerDocument.addEventListener("pointerup", s, !0), S.ownerDocument.addEventListener("pointercancel", c, !0), S.ownerDocument.addEventListener("click", l, !0), () => {
+			e(), S.ownerDocument.removeEventListener("pointerdown", o, !0), S.ownerDocument.removeEventListener("pointerup", s, !0), S.ownerDocument.removeEventListener("pointercancel", c, !0), S.ownerDocument.removeEventListener("click", l, !0), F.current = null, P.current = null;
 		};
 	}, [
-		R,
+		L,
 		n,
-		E,
+		S,
 		r,
-		L.topmost,
+		I.topmost,
 		A
 	]);
-	let ue = D?.restoreFocus, z = D?.id, B = i(() => {
-		let e = j.current, t = E?.ownerDocument, n = t?.activeElement;
-		if (!t || !E) return;
-		let r = z ? t.getElementById(z) : null;
+	let de = C?.restoreFocus, fe = C?.id, R = i(() => {
+		let e = j.current, t = S?.ownerDocument, n = t?.activeElement;
+		if (!t || !S) return;
+		let r = fe ? t.getElementById(fe) : null;
 		if (!(n === t.body || n === r || n?.closest("[data-exiting]"))) return;
 		if (!e?.isConnected) {
-			ue?.();
+			de?.();
 			return;
 		}
-		let i = E.querySelector("[data-breeze-topmost=\"true\"]");
+		let i = S.querySelector("[data-breeze-topmost=\"true\"]");
 		(!i || i.contains(e)) && !e.closest("[inert], [aria-hidden=\"true\"]") && e.focus({ preventScroll: !0 });
 	}, [
-		E,
-		z,
-		ue
-	]), V = i(() => {
-		N.current !== null && (clearTimeout(N.current), N.current = null);
-	}, []), H = i((e) => {
+		S,
+		fe,
+		de
+	]), z = i(() => {
+		M.current !== null && (clearTimeout(M.current), M.current = null);
+	}, []), B = i((e) => {
 		queueMicrotask(() => {
-			!e.isConnected || e.closest("[inert], [data-exiting]") || (V(), e.focus({ preventScroll: !0 }), N.current = setTimeout(() => {
+			!e.isConnected || e.closest("[inert], [data-exiting]") || (z(), e.focus({ preventScroll: !0 }), M.current = setTimeout(() => {
 				let { ownerDocument: t } = e, { activeElement: n } = t;
-				e.isConnected && !e.closest("[inert], [data-exiting]") && (n === e || n === t.body) && (se.current = !0, e.blur(), e.focus({ preventScroll: !0 }), se.current = !1), N.current = null;
+				e.isConnected && !e.closest("[inert], [data-exiting]") && (n === e || n === t.body) && (ce.current = !0, e.blur(), e.focus({ preventScroll: !0 }), ce.current = !1), M.current = null;
 			}, 500));
 		});
-	}, [V]), W = u(A);
+	}, [z]), pe = u(A);
 	o(() => {
-		let e = W.current;
-		W.current = A, !(!T || !A || e || !M.current) && H(M.current);
+		let e = pe.current;
+		pe.current = A, !(!x || !A || e || !ae.current) && B(ae.current);
 	}, [
-		H,
-		T,
+		B,
+		x,
 		A
 	]);
-	let de = i((e) => {
-		M.current = e;
+	let me = i((e) => {
+		ae.current = e;
 		let t = () => {
-			V(), M.current = null, oe(!1), requestAnimationFrame(B);
+			z(), ae.current = null, se(!1), requestAnimationFrame(R);
 		};
 		if (!e) {
 			t();
 			return;
 		}
-		return oe(!0), T && H(e), t;
+		return se(!0), x && B(e), t;
 	}, [
-		V,
-		H,
-		T,
-		B
-	]), fe = l(() => ({
-		id: L.id,
+		z,
+		B,
+		x,
+		R
+	]), he = l(() => ({
+		id: I.id,
 		open: A,
-		restoreFocus: B
+		restoreFocus: R
 	}), [
-		L.id,
+		I.id,
 		A,
-		B
-	]), pe = /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ h("div", {
-		className: Y.base.header,
+		R
+	]), ge = /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ h("div", {
+		className: X.base.header,
 		children: [/* @__PURE__ */ m("h2", {
-			className: Y.base.title,
+			className: X.base.title,
 			children: _
 		}), /* @__PURE__ */ m("span", {
-			lang: C("close"),
-			children: /* @__PURE__ */ m(ye, {
-				onAction: () => R(!1),
+			lang: y("close"),
+			children: /* @__PURE__ */ m(je, {
+				onAction: () => L(!1),
 				variant: "quiet",
-				children: w.close
+				children: b.close
 			})
 		})]
-	}), e] }), G = /* @__PURE__ */ m(De, {
-		value: fe,
-		children: T ? /* @__PURE__ */ m("section", {
+	}), e] }), _e = /* @__PURE__ */ m(He, {
+		value: he,
+		children: x ? /* @__PURE__ */ m("section", {
 			"aria-label": _,
-			className: Y.base.content,
-			id: L.id,
+			className: X.base.content,
+			id: I.id,
 			onBlur: (e) => {
-				if (se.current) {
+				if (ce.current) {
 					e.stopPropagation();
 					return;
 				}
 				let { relatedTarget: t } = e;
-				r === "popover" && n && L.topmost && X(t) && !e.currentTarget.contains(t) && !j.current?.contains(t) && (I.current = t);
+				r === "popover" && n && I.topmost && Ye(t) && !e.currentTarget.contains(t) && !j.current?.contains(t) && (F.current = t);
 			},
-			ref: de,
+			ref: me,
 			role: "dialog",
 			tabIndex: -1,
-			children: pe
-		}) : /* @__PURE__ */ m(y, {
+			children: ge
+		}) : /* @__PURE__ */ m(T, {
 			"aria-label": _,
-			className: Y.base.content,
-			id: L.id,
-			ref: de,
-			children: pe
+			className: X.base.content,
+			id: I.id,
+			ref: me,
+			children: ge
 		})
 	});
-	return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(ye, {
-		"aria-controls": A ? L.id : void 0,
+	return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(je, {
+		"aria-controls": A ? I.id : void 0,
 		"aria-expanded": A,
 		"aria-haspopup": "dialog",
-		onAction: () => R(!T || !A),
+		onAction: () => L(!x || !A),
 		ref: j,
 		children: v
-	}), E && ee && (T ? /* @__PURE__ */ m(S, {
-		className: Y.variant[r],
+	}), S && w && (x ? /* @__PURE__ */ m(ee, {
+		className: X.variant[r],
 		"data-breeze-overlay": r,
-		"data-breeze-topmost": L.topmost,
-		"data-breeze-interactive": L.interactive,
-		inert: !L.interactive,
+		"data-breeze-topmost": I.topmost,
+		"data-breeze-interactive": I.interactive,
+		inert: !I.interactive,
 		isNonModal: !0,
 		isOpen: A,
-		isKeyboardDismissDisabled: !n || !L.topmost,
-		onOpenChange: R,
+		isKeyboardDismissDisabled: !n || !I.topmost,
+		onOpenChange: L,
 		placement: g,
 		ref: ie,
-		shouldCloseOnInteractOutside: (e) => r === "popover" && n && L.topmost && !j.current?.contains(e),
-		style: { zIndex: L.zIndex },
-		triggerRef: le,
-		children: G
-	}) : /* @__PURE__ */ m(x, {
+		shouldCloseOnInteractOutside: (e) => r === "popover" && n && I.topmost && !j.current?.contains(e),
+		style: { zIndex: I.zIndex },
+		triggerRef: ue,
+		children: _e
+	}) : /* @__PURE__ */ m(D, {
 		className: "breeze-overlay-backdrop",
 		"data-breeze-overlay": r,
-		"data-breeze-scrim": L.scrim,
-		"data-breeze-topmost": L.topmost,
-		"data-breeze-interactive": L.interactive,
-		inert: !L.interactive,
-		isDismissable: n && L.topmost,
-		isKeyboardDismissDisabled: !n || !L.topmost,
+		"data-breeze-scrim": I.scrim,
+		"data-breeze-topmost": I.topmost,
+		"data-breeze-interactive": I.interactive,
+		inert: !I.interactive,
+		isDismissable: n && I.topmost,
+		isKeyboardDismissDisabled: !n || !I.topmost,
 		isOpen: A,
-		onOpenChange: R,
-		shouldCloseOnInteractOutside: (e) => L.topmost && Pe(e),
-		style: { zIndex: L.zIndex },
-		children: /* @__PURE__ */ m(b, {
-			className: Y.variant[r],
-			children: G
+		onOpenChange: L,
+		shouldCloseOnInteractOutside: (e) => I.topmost && Xe(e),
+		style: { zIndex: I.zIndex },
+		children: /* @__PURE__ */ m(E, {
+			className: X.variant[r],
+			children: _e
 		})
 	}))] });
 }
 //#endregion
 //#region src/primitives/Dialog/Dialog.tsx
-function Ie({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o }) {
-	return /* @__PURE__ */ m(Fe, {
+function Qe({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o }) {
+	return /* @__PURE__ */ m(Ze, {
 		defaultOpen: t,
 		dismissible: n,
 		onOpenChange: r,
@@ -640,8 +771,8 @@ function Ie({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open
 }
 //#endregion
 //#region src/primitives/Drawer/Drawer.tsx
-function Le({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o }) {
-	return /* @__PURE__ */ m(Fe, {
+function $e({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o }) {
+	return /* @__PURE__ */ m(Ze, {
 		defaultOpen: t,
 		dismissible: n,
 		onOpenChange: r,
@@ -654,7 +785,7 @@ function Le({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open
 }
 //#endregion
 //#region src/primitives/Grid/Grid.tsx
-var Re = {
+var et = {
 	base: { grid: "breeze:grid breeze:min-inline-size-0" },
 	compound: { columns: {
 		1: {
@@ -690,48 +821,48 @@ var Re = {
 	state: {},
 	variant: {}
 };
-function ze({ "aria-label": e, children: t, collapseBelow: n = "md", columns: i = 2, element: a = "div", gap: o = 4 }) {
-	let { accessibleLabel: s, role: c } = J(e, a);
+function tt({ "aria-label": e, children: t, collapseBelow: n = "md", columns: i = 2, element: a = "div", gap: o = 4 }) {
+	let { accessibleLabel: s, role: c } = K(e, a);
 	return r(a, {
 		"aria-label": s,
 		className: [
-			Re.base.grid,
-			Re.compound.columns[i][n],
-			Re.size[o]
+			et.base.grid,
+			et.compound.columns[i][n],
+			et.size[o]
 		].join(" "),
 		role: c
 	}, t);
 }
 //#endregion
 //#region src/primitives/Icon/Icon.tsx
-var Be = {
-	add: I,
-	back: A,
-	building: te,
-	calendar: ne,
-	camera: re,
-	check: O,
-	clock: ie,
-	close: z,
-	delete: le,
-	document: oe,
-	download: M,
-	expand: k,
-	forward: j,
-	lock: P,
-	money: N,
-	moneyIn: E,
-	moneyOut: D,
-	more: ae,
-	next: j,
-	notifications: ee,
-	overview: se,
-	people: ue,
-	settings: ce,
-	signOut: F,
-	upload: R,
-	warning: L
-}, Ve = {
+var nt = {
+	add: fe,
+	back: ce,
+	building: j,
+	calendar: ie,
+	camera: ae,
+	check: oe,
+	clock: N,
+	close: he,
+	delete: z,
+	document: le,
+	download: P,
+	expand: se,
+	forward: M,
+	lock: L,
+	money: I,
+	moneyIn: O,
+	moneyOut: k,
+	more: F,
+	next: M,
+	notifications: A,
+	overview: ue,
+	people: me,
+	settings: R,
+	signOut: de,
+	upload: pe,
+	warning: B
+}, rt = {
 	base: { icon: "breeze:block breeze:shrink-0" },
 	compound: {},
 	size: {
@@ -741,20 +872,20 @@ var Be = {
 	},
 	state: { logicalDirection: "breeze:rtl:rotate-180" },
 	variant: {}
-}, He = /* @__PURE__ */ new Set([
+}, it = /* @__PURE__ */ new Set([
 	"back",
 	"forward",
 	"next"
 ]);
-function Ue({ label: e, name: t, size: n = "md" }) {
-	let r = Be[t], i = e?.trim() || void 0;
+function at({ label: e, name: t, size: n = "md" }) {
+	let r = nt[t], i = e?.trim() || void 0;
 	return /* @__PURE__ */ m(r, {
 		"aria-hidden": i === void 0 || void 0,
 		"aria-label": i,
 		className: [
-			Ve.base.icon,
-			Ve.size[n],
-			He.has(t) && Ve.state.logicalDirection
+			rt.base.icon,
+			rt.size[n],
+			it.has(t) && rt.state.logicalDirection
 		].filter(Boolean).join(" "),
 		focusable: "false",
 		role: i === void 0 ? void 0 : "img",
@@ -763,7 +894,7 @@ function Ue({ label: e, name: t, size: n = "md" }) {
 }
 //#endregion
 //#region src/primitives/IconTile/IconTile.tsx
-var We = {
+var ot = {
 	base: { tile: "breeze:inline-flex breeze:shrink-0 breeze:items-center breeze:justify-center" },
 	compound: {},
 	size: {
@@ -785,15 +916,15 @@ var We = {
 		}
 	}
 };
-function Ge({ label: e, name: t, shape: n = "square", size: r = "lg", tone: i = "brand" }) {
+function st({ label: e, name: t, shape: n = "square", size: r = "lg", tone: i = "brand" }) {
 	return /* @__PURE__ */ m("span", {
 		className: [
-			We.base.tile,
-			We.variant.tone[i],
-			We.variant.shape[n],
-			We.size[r]
+			ot.base.tile,
+			ot.variant.tone[i],
+			ot.variant.shape[n],
+			ot.size[r]
 		].join(" "),
-		children: /* @__PURE__ */ m(Ue, {
+		children: /* @__PURE__ */ m(at, {
 			label: e,
 			name: t,
 			size: r === "lg" ? "md" : "sm"
@@ -802,7 +933,7 @@ function Ge({ label: e, name: t, shape: n = "square", size: r = "lg", tone: i =
 }
 //#endregion
 //#region src/primitives/Inline/Inline.tsx
-var Z = {
+var ct = {
 	base: { inline: "breeze:flex breeze:min-inline-size-0" },
 	compound: {},
 	size: {
@@ -832,24 +963,121 @@ var Z = {
 		}
 	}
 };
-function Ke({ "aria-label": e, children: t, element: n = "div", gap: i = 3, justify: a = "start", verticalAlign: o = "center", wrap: s = !1 }) {
-	let { accessibleLabel: c, role: l } = J(e, n);
+function lt({ "aria-label": e, children: t, element: n = "div", gap: i = 3, justify: a = "start", verticalAlign: o = "center", wrap: s = !1 }) {
+	let { accessibleLabel: c, role: l } = K(e, n);
 	return r(n, {
 		"aria-label": c,
 		className: [
-			Z.base.inline,
-			Z.variant.align[o],
-			Z.variant.justify[a],
-			Z.size[i],
-			s && Z.state.wrap
+			ct.base.inline,
+			ct.variant.align[o],
+			ct.variant.justify[a],
+			ct.size[i],
+			s && ct.state.wrap
 		].filter(Boolean).join(" "),
 		role: l
 	}, t);
 }
 //#endregion
+//#region src/primitives/NumberField/NumberField.tsx
+var Z = {
+	base: {
+		group: "breeze:relative breeze:inline-flex breeze:min-block-breeze-md breeze:min-inline-size-0 breeze:inline-size-full breeze:items-stretch breeze:overflow-hidden breeze:rounded-breeze-ctl breeze:border breeze:border-solid breeze:border-breeze-line-strong breeze:bg-breeze-surface breeze:has-[input[data-focus-visible]]:outline-2 breeze:has-[input[data-focus-visible]]:outline-solid breeze:has-[input[data-focus-visible]]:outline-breeze-brand breeze:has-[input[data-invalid]]:border-breeze-danger breeze:data-[disabled]:cursor-not-allowed breeze:data-[disabled]:bg-breeze-sunken",
+		input: "breeze:min-block-breeze-md breeze:min-inline-size-0 breeze:flex-1 breeze:border-0 breeze:rounded-none breeze:bg-transparent breeze:tabular-nums breeze:outline-none breeze:placeholder:text-breeze-ink-3 breeze:data-[hovered]:border-transparent breeze:data-[focus-visible]:!outline-none breeze:data-[invalid]:border-transparent breeze:disabled:cursor-not-allowed breeze:read-only:cursor-default",
+		skeleton: "breeze:pointer-events-none breeze:absolute breeze:[inset-block:0] breeze:[inset-inline:0]",
+		stepButton: "breeze:min-inline-breeze-md breeze:border-0 breeze:bg-transparent breeze:ps-breeze-2 breeze:pe-breeze-2 breeze:font-breeze-sans breeze:text-breeze-md breeze:font-semibold breeze:leading-none breeze:text-breeze-ink breeze:disabled:cursor-not-allowed breeze:disabled:opacity-50 breeze:any-pointer-coarse:min-block-breeze-tap breeze:any-pointer-coarse:min-inline-breeze-tap breeze:hover:text-breeze-brand breeze:focus-visible:outline-2 breeze:focus-visible:outline-solid breeze:focus-visible:outline-breeze-brand breeze:outline-offset-[-2px]"
+	},
+	compound: {},
+	size: {},
+	state: {
+		loadingGroup: "breeze:!bg-transparent breeze:!border-transparent breeze:!opacity-100 breeze:!overflow-visible",
+		loadingInput: "breeze:!opacity-0",
+		loadingStepButton: "breeze:!opacity-0",
+		readOnlyGroup: "breeze:!bg-breeze-sunken"
+	},
+	variant: {}
+};
+function ut({ autoComplete: e, autoFocus: t, defaultValue: n, description: i, disabled: a = !1, error: o, form: s, formatOptions: c, id: l, label: u, loading: d = !1, maxValue: f, minValue: p, name: _, onChange: v, placeholder: y, readOnly: b = !1, ref: x, required: S = !1, step: C, value: w }) {
+	let { messages: T } = V(), E = i?.trim() || void 0, D = o?.trim() || void 0, ee = a || d;
+	return /* @__PURE__ */ h(ve, {
+		autoFocus: t,
+		"aria-label": d ? u : void 0,
+		className: q.base.root,
+		defaultValue: n,
+		form: s,
+		formatOptions: c,
+		id: l,
+		isDisabled: ee,
+		isInvalid: !d && D !== void 0,
+		isReadOnly: b,
+		isRequired: S,
+		maxValue: f,
+		minValue: p,
+		name: _,
+		onChange: v,
+		step: C,
+		validationBehavior: "aria",
+		value: w,
+		children: [
+			/* @__PURE__ */ m(Pe, {
+				label: u,
+				loading: d
+			}),
+			/* @__PURE__ */ h(ge, {
+				className: J(Z.base.group, b && !d && Z.state.readOnlyGroup, d && Z.state.loadingGroup),
+				children: [
+					/* @__PURE__ */ m(_e, {
+						"aria-busy": d || void 0,
+						className: J(q.base.input, Z.base.input, d && Z.state.loadingInput),
+						autoComplete: e,
+						placeholder: y,
+						form: s,
+						ref: x
+					}),
+					/* @__PURE__ */ m(g, {
+						className: J(Z.base.stepButton, d && Z.state.loadingStepButton),
+						render: (e) => r("button", {
+							...e,
+							"aria-hidden": d || void 0,
+							type: "button"
+						}),
+						slot: "decrement",
+						type: "button",
+						children: "−"
+					}),
+					/* @__PURE__ */ m(g, {
+						className: J(Z.base.stepButton, d && Z.state.loadingStepButton),
+						render: (e) => r("button", {
+							...e,
+							"aria-hidden": d || void 0,
+							type: "button"
+						}),
+						slot: "increment",
+						type: "button",
+						children: "+"
+					}),
+					d && /* @__PURE__ */ m("span", {
+						className: Z.base.skeleton,
+						children: /* @__PURE__ */ m(U, {
+							blockSize: "100%",
+							inlineSize: "100%",
+							label: T.loading,
+							shape: "rectangle"
+						})
+					})
+				]
+			}),
+			/* @__PURE__ */ m(Fe, {
+				description: E,
+				error: D,
+				loading: d
+			})
+		]
+	});
+}
+//#endregion
 //#region src/primitives/Popover/Popover.tsx
-function qe({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o, placement: s }) {
-	return /* @__PURE__ */ m(Fe, {
+function dt({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open: i, title: a, trigger: o, placement: s }) {
+	return /* @__PURE__ */ m(Ze, {
 		defaultOpen: t,
 		dismissible: n,
 		onOpenChange: r,
@@ -863,7 +1091,7 @@ function qe({ children: e, defaultOpen: t, dismissible: n, onOpenChange: r, open
 }
 //#endregion
 //#region src/primitives/Separator/Separator.tsx
-var Je = {
+var ft = {
 	base: { separator: "breeze:m-0 breeze:shrink-0 breeze:border-0 breeze:bg-breeze-line breeze:forced-colors:bg-[CanvasText]" },
 	compound: {},
 	size: {},
@@ -873,15 +1101,15 @@ var Je = {
 		vertical: "breeze:block-size-full breeze:inline-size-breeze-px"
 	}
 };
-function Ye({ orientation: e = "horizontal" }) {
+function pt({ orientation: e = "horizontal" }) {
 	return /* @__PURE__ */ m("hr", {
 		"aria-orientation": e,
-		className: [Je.base.separator, Je.variant[e]].join(" ")
+		className: [ft.base.separator, ft.variant[e]].join(" ")
 	});
 }
 //#endregion
 //#region src/primitives/Stack/Stack.tsx
-var Xe = {
+var mt = {
 	base: { stack: "breeze:flex breeze:min-inline-size-0 breeze:flex-col" },
 	compound: {},
 	size: {
@@ -903,32 +1131,83 @@ var Xe = {
 		stretch: "breeze:items-stretch"
 	}
 };
-function Ze({ "aria-label": e, children: t, element: n = "div", gap: i = 3, horizontalAlign: a = "stretch" }) {
-	let { accessibleLabel: o, role: s } = J(e, n);
+function ht({ "aria-label": e, children: t, element: n = "div", gap: i = 3, horizontalAlign: a = "stretch" }) {
+	let { accessibleLabel: o, role: s } = K(e, n);
 	return r(n, {
 		"aria-label": o,
 		className: [
-			Xe.base.stack,
-			Xe.variant[a],
-			Xe.size[i]
+			mt.base.stack,
+			mt.variant[a],
+			mt.size[i]
 		].join(" "),
 		role: s
 	}, t);
 }
 //#endregion
+//#region src/primitives/TextField/TextField.tsx
+function gt({ autoComplete: e, autoFocus: t, defaultValue: n, description: r, disabled: i = !1, error: a, form: o, id: s, label: c, loading: l = !1, name: u, onChange: d, placeholder: f, readOnly: p = !1, ref: g, required: _ = !1, type: v = "text", value: y }) {
+	let { messages: b } = V(), x = r?.trim() || void 0, S = a?.trim() || void 0, C = i || l;
+	return /* @__PURE__ */ h(ye, {
+		className: q.base.root,
+		defaultValue: n,
+		"aria-label": l ? c : void 0,
+		id: s,
+		isDisabled: C,
+		isInvalid: !l && S !== void 0,
+		isReadOnly: p,
+		isRequired: _,
+		name: u,
+		onChange: d,
+		type: v,
+		validationBehavior: "aria",
+		value: y,
+		children: [
+			/* @__PURE__ */ m(Pe, {
+				label: c,
+				loading: l
+			}),
+			/* @__PURE__ */ h("span", {
+				className: q.base.control,
+				children: [/* @__PURE__ */ m(_e, {
+					"aria-busy": l || void 0,
+					className: J(q.base.input, l && q.state.loadingInput),
+					autoComplete: e,
+					autoFocus: t,
+					form: o,
+					placeholder: f,
+					ref: g
+				}), l && /* @__PURE__ */ m("span", {
+					className: q.base.skeleton,
+					children: /* @__PURE__ */ m(U, {
+						blockSize: "100%",
+						inlineSize: "100%",
+						label: b.loading,
+						shape: "rectangle"
+					})
+				})]
+			}),
+			/* @__PURE__ */ m(Fe, {
+				description: x,
+				error: S,
+				loading: l
+			})
+		]
+	});
+}
+//#endregion
 //#region src/primitives/Toast/Toast.tsx
-var Qe = 2600, $e = "BreezeProvider toastLimit must be a positive integer.", et = "Toast components must be rendered within BreezeProvider.";
-function tt(e) {
+var _t = 2600, vt = "BreezeProvider toastLimit must be a positive integer.", yt = "Toast components must be rendered within BreezeProvider.";
+function bt(e) {
 	return e.isIntersecting && e.intersectionRatio >= 1;
 }
-function nt(e, t, n, r) {
+function xt(e, t, n, r) {
 	let i = Number(e.target.dataset.breezeToastId);
-	t.has(i) && (tt(e) ? n(i) : r(i));
+	t.has(i) && (bt(e) ? n(i) : r(i));
 }
-var rt = n(null), it = n(!0), at = n(null);
-function ot({ children: e }) {
-	U();
-	let t = a(it), n = a(at), [r, i] = d(() => n?.message ?? null);
+var St = n(null), Ct = n(!0), wt = n(null);
+function Tt({ children: e }) {
+	V();
+	let t = a(Ct), n = a(wt), [r, i] = d(() => n?.message ?? null);
 	return o(() => {
 		if (!t || typeof document < "u" && document.hidden || r === e) return;
 		let a = setTimeout(() => {
@@ -946,15 +1225,15 @@ function ot({ children: e }) {
 		"aria-live": "polite",
 		className: "breeze-toast",
 		role: "status",
-		children: [/* @__PURE__ */ m(Ue, {
+		children: [/* @__PURE__ */ m(at, {
 			name: "check",
 			size: "sm"
 		}), /* @__PURE__ */ m("span", { children: r })]
 	});
 }
-function st({ children: e, limit: t }) {
-	let n = Me(), r = Ee(), a = u(null), [s, l] = d(() => typeof document > "u" || !document.hidden), [f, p] = d([]), g = u(0), _ = u(/* @__PURE__ */ new Map()), v = u(/* @__PURE__ */ new Set()), y = u(/* @__PURE__ */ new Map());
-	if (!Number.isInteger(t) || t < 1) throw RangeError($e);
+function Et({ children: e, limit: t }) {
+	let n = qe(), r = Ve(), a = u(null), [s, l] = d(() => typeof document > "u" || !document.hidden), [f, p] = d([]), g = u(0), _ = u(/* @__PURE__ */ new Map()), v = u(/* @__PURE__ */ new Set()), y = u(/* @__PURE__ */ new Map());
+	if (!Number.isInteger(t) || t < 1) throw RangeError(vt);
 	let b = i((e, t) => {
 		let n = y.current.get(e);
 		n !== void 0 && (n.message = t);
@@ -989,7 +1268,7 @@ function st({ children: e, limit: t }) {
 		if (!s || typeof document < "u" && document.hidden || t !== void 0 && t.handle !== null) return;
 		let n = t ?? {
 			handle: null,
-			remaining: Qe,
+			remaining: _t,
 			startedAt: null
 		};
 		if (n.remaining <= 0) {
@@ -1023,7 +1302,7 @@ function st({ children: e, limit: t }) {
 		}
 		let o, c = setTimeout(() => {
 			o = new IntersectionObserver((e) => {
-				e.forEach((e) => nt(e, r, D, w));
+				e.forEach((e) => xt(e, r, D, w));
 			}, { threshold: 1 }), Array.from(i.children).forEach((e) => {
 				e instanceof HTMLElement && e.dataset.breezeToastId !== void 0 && !e.hidden && o?.observe(e);
 			});
@@ -1041,11 +1320,11 @@ function st({ children: e, limit: t }) {
 		D
 	]), o(() => C, [C]);
 	let ee = f.slice(0, t), te = new Set(ee.map(({ id: e }) => e)), ne = f.filter(({ id: e }) => te.has(e) || v.current.has(e));
-	return /* @__PURE__ */ m(it, {
+	return /* @__PURE__ */ m(Ct, {
 		value: s,
-		children: /* @__PURE__ */ h(rt, {
+		children: /* @__PURE__ */ h(St, {
 			value: x,
-			children: [e, n && B(/* @__PURE__ */ m("div", {
+			children: [e, n && be(/* @__PURE__ */ m("div", {
 				ref: a,
 				className: "breeze-toast-region",
 				"data-breeze-toast-region": "",
@@ -1058,11 +1337,11 @@ function st({ children: e, limit: t }) {
 						"aria-hidden": n ? "true" : void 0,
 						"data-breeze-toast-id": e,
 						hidden: n,
-						children: /* @__PURE__ */ m(at, {
+						children: /* @__PURE__ */ m(wt, {
 							value: y.current.get(e) ?? null,
-							children: /* @__PURE__ */ m(it, {
+							children: /* @__PURE__ */ m(Ct, {
 								value: s && !n,
-								children: /* @__PURE__ */ m(ot, { children: t })
+								children: /* @__PURE__ */ m(Tt, { children: t })
 							})
 						})
 					}, e);
@@ -1071,9 +1350,9 @@ function st({ children: e, limit: t }) {
 		})
 	});
 }
-function ct() {
-	let e = a(rt);
-	if (e === null) throw Error(et);
+function Dt() {
+	let e = a(St);
+	if (e === null) throw Error(yt);
 	return e;
 }
 //#endregion
@@ -1114,10 +1393,10 @@ var Q = {
 		}
 	}
 };
-function lt(e) {
+function Ot(e) {
 	return e === "heading" ? "h2" : e === "title" ? "h3" : e === "body" ? "p" : "span";
 }
-function ut(e, t, n, r) {
+function kt(e, t, n, r) {
 	let i;
 	try {
 		i = new Intl.NumberFormat(n, {
@@ -1131,10 +1410,10 @@ function ut(e, t, n, r) {
 	}
 	return i.map((e) => e.type === "minusSign" ? "−" : e.value).join("");
 }
-function dt(e, t, n) {
+function At(e, t, n) {
 	let r;
 	try {
-		r = V(e).toDate("UTC");
+		r = xe(e).toDate("UTC");
 	} catch {
 		return e;
 	}
@@ -1143,15 +1422,15 @@ function dt(e, t, n) {
 		timeZone: "UTC"
 	}).format(r);
 }
-function ft(e, t, n) {
-	return e.loading ? /* @__PURE__ */ m(me, {
+function jt(e, t, n) {
+	return e.loading ? /* @__PURE__ */ m(U, {
 		blockSize: "1lh",
 		inlineSize: "8em",
 		label: n
-	}) : e.format === "currency" ? ut(e.value, e.currency, t, e.sign ?? "auto") : e.format === "date" ? dt(e.value, t, e.dateStyle) : e.children;
+	}) : e.format === "currency" ? kt(e.value, e.currency, t, e.sign ?? "auto") : e.format === "date" ? At(e.value, t, e.dateStyle) : e.children;
 }
-function pt(e) {
-	let { locale: t, messages: n } = U(), { "aria-label": i, align: a, children: o, element: s, format: c, id: l, loading: u = !1, numeric: d = !1, tone: f = "default", truncate: g = !1, variant: _ = "body" } = e, v = s ?? lt(_), y = i?.trim() || void 0, b = a ?? (_ === "money" || d ? "end" : "start"), x = a !== void 0 || _ === "money" || d, S = ft(e, t, n.loading), C = c !== void 0 || typeof o == "string" || typeof o == "number", w = !u && y !== void 0 && !C && [
+function Mt(e) {
+	let { locale: t, messages: n } = V(), { "aria-label": i, align: a, children: o, element: s, format: c, id: l, loading: u = !1, numeric: d = !1, tone: f = "default", truncate: g = !1, variant: _ = "body" } = e, v = s ?? Ot(_), y = i?.trim() || void 0, b = a ?? (_ === "money" || d ? "end" : "start"), x = a !== void 0 || _ === "money" || d, S = jt(e, t, n.loading), C = c !== void 0 || typeof o == "string" || typeof o == "number", w = !u && y !== void 0 && !C && [
 		"h1",
 		"h2",
 		"h3",
@@ -1160,7 +1439,7 @@ function pt(e) {
 	return !u && y !== void 0 && C && (S = /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
 		"aria-hidden": "true",
 		children: S
-	}), /* @__PURE__ */ m(ge, { children: y })] })), r(v, {
+	}), /* @__PURE__ */ m(Oe, { children: y })] })), r(v, {
 		"aria-busy": u || void 0,
 		"aria-label": T || w ? y : void 0,
 		className: [
@@ -1190,11 +1469,11 @@ var $ = {
 };
 //#endregion
 //#region src/provider/BreezeProvider.tsx
-function mt(e, t) {
+function Nt(e, t) {
 	return e === "automatic" ? t ? "dark" : "light" : e;
 }
-function ht({ children: e }) {
-	let { direction: t, locale: n } = T();
+function Pt({ children: e }) {
+	let { direction: t, locale: n } = re();
 	return /* @__PURE__ */ m("div", {
 		"data-breeze-root": "",
 		dir: t,
@@ -1202,8 +1481,8 @@ function ht({ children: e }) {
 		children: e
 	});
 }
-function gt({ appearance: e, children: t, defaultAppearance: n = "automatic", locale: r, messages: a, onAppearanceChange: s, portalContainer: u, toastLimit: f = 3 }) {
-	let [p] = d(() => typeof window > "u" || !window.matchMedia ? null : window.matchMedia("(prefers-color-scheme: dark)")), [h, g] = d(() => p?.matches ?? !1), [_, v] = d(n), y = e ?? _, b = mt(y, h);
+function Ft({ appearance: e, children: t, defaultAppearance: n = "automatic", locale: r, messages: a, onAppearanceChange: s, portalContainer: u, toastLimit: f = 3 }) {
+	let [p] = d(() => typeof window > "u" || !window.matchMedia ? null : window.matchMedia("(prefers-color-scheme: dark)")), [h, g] = d(() => p?.matches ?? !1), [_, v] = d(n), y = e ?? _, b = Nt(y, h);
 	o(() => {
 		if (!p) return;
 		g(p.matches);
@@ -1220,9 +1499,9 @@ function gt({ appearance: e, children: t, defaultAppearance: n = "automatic", lo
 	let x = i((t) => {
 		e === void 0 && v(t), s?.(t);
 	}, [e, s]), S = i((e) => a?.[e] === void 0 ? "en-GB" : r, [r, a]);
-	return /* @__PURE__ */ m(w, {
+	return /* @__PURE__ */ m(ne, {
 		locale: r,
-		children: /* @__PURE__ */ m(H, {
+		children: /* @__PURE__ */ m(Se, {
 			value: l(() => ({
 				appearance: y,
 				getMessageLocale: S,
@@ -1245,18 +1524,18 @@ function gt({ appearance: e, children: t, defaultAppearance: n = "automatic", lo
 				b,
 				x
 			]),
-			children: /* @__PURE__ */ m(je, {
+			children: /* @__PURE__ */ m(Ke, {
 				locale: r,
 				portalContainer: u,
-				children: /* @__PURE__ */ m(st, {
+				children: /* @__PURE__ */ m(Et, {
 					limit: f,
-					children: /* @__PURE__ */ m(ht, { children: t })
+					children: /* @__PURE__ */ m(Pt, { children: t })
 				})
 			})
 		})
 	});
 }
 //#endregion
-export { pe as AppearanceControl, _e as Badge, gt as BreezeProvider, ye as Button, xe as Card, Ce as Container, Ie as Dialog, Le as Drawer, ze as Grid, Ue as Icon, Ge as IconTile, Ke as Inline, qe as Popover, Ye as Separator, me as Skeleton, Ze as Stack, ot as Toast, pt as Typography, ge as VisuallyHidden, ct as useToast };
+export { Te as AppearanceControl, ke as Badge, Ft as BreezeProvider, je as Button, Ne as Card, Ie as Checkbox, Re as Container, Qe as Dialog, $e as Drawer, tt as Grid, at as Icon, st as IconTile, lt as Inline, ut as NumberField, dt as Popover, pt as Separator, U as Skeleton, ht as Stack, gt as TextField, Tt as Toast, Mt as Typography, Oe as VisuallyHidden, Dt as useToast };
 
 //# sourceMappingURL=index.js.map