@almanaclabs/blaze-ui 0.3.0 → 0.3.1

package/README.md

@@ -3,8 +3,8 @@
 Shared React components and semantic design tokens for Blaze.
 
 The components use shadcn's `b0` preset: Base UI primitives, the Nova style,
-neutral colors, Inter, and Lucide icons. Component source is owned by this
-package so Blaze-specific changes stay reviewable.
+neutral colors, Inter, and Tabler outline and filled icons. Component source is
+owned by this package so Blaze-specific changes stay reviewable.
 
 ## Install
 

package/dist/components/spinner/spinner.d.ts

@@ -1,3 +1,3 @@
-declare function Spinner({ className, ...props }: React.ComponentProps<'svg'>): import("react").JSX.Element;
+declare function Spinner({ className, ...props }: React.ComponentPropsWithoutRef<'svg'>): import("react").JSX.Element;
 export { Spinner };
 //# sourceMappingURL=spinner.d.ts.map

package/dist/components/spinner/spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAGA,iBAAS,OAAO,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAUpE;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/spinner.tsx"],"names":[],"mappings":"AAGA,iBAAS,OAAO,CAAC,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,+BAUvC;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/index.js

@@ -8,16 +8,16 @@ import { useMemo as c } from "react";
 import { Separator as l } from "@base-ui/react/separator";
 import { Input as u } from "@base-ui/react/input";
 import { Accordion as d } from "@base-ui/react/accordion";
-import { CalendarIcon as f, CheckIcon as p, ChevronDownIcon as m, ChevronLeftIcon as h, ChevronRightIcon as g, ChevronUpIcon as _, CircleCheckIcon as v, InfoIcon as y, Loader2Icon as b, MoreHorizontalIcon as x, OctagonXIcon as ee, PanelLeftIcon as S, TriangleAlertIcon as te, XIcon as C } from "lucide-react";
-import { AlertDialog as w } from "@base-ui/react/alert-dialog";
-import { mergeProps as T } from "@base-ui/react/merge-props";
-import { useRender as E } from "@base-ui/react/use-render";
-import { Avatar as D } from "@base-ui/react/avatar";
-import { DayPicker as O, getDefaultClassNames as ne } from "react-day-picker";
-import re from "embla-carousel-react";
-import * as k from "recharts";
-import { Checkbox as ie } from "@base-ui/react/checkbox";
-import { Collapsible as A } from "@base-ui/react/collapsible";
+import { IconAlertOctagon as f, IconAlertTriangle as p, IconCalendar as m, IconCheck as h, IconChevronDown as g, IconChevronLeft as _, IconChevronRight as v, IconChevronUp as y, IconCircleCheck as b, IconDots as x, IconInfoCircle as ee, IconLayoutSidebar as S, IconLoader2 as C, IconX as w } from "@tabler/icons-react";
+import { AlertDialog as T } from "@base-ui/react/alert-dialog";
+import { mergeProps as E } from "@base-ui/react/merge-props";
+import { useRender as D } from "@base-ui/react/use-render";
+import { Avatar as O } from "@base-ui/react/avatar";
+import { DayPicker as k, getDefaultClassNames as te } from "react-day-picker";
+import ne from "embla-carousel-react";
+import * as A from "recharts";
+import { Checkbox as re } from "@base-ui/react/checkbox";
+import { Collapsible as ie } from "@base-ui/react/collapsible";
 import { Combobox as j } from "@base-ui/react";
 import { flexRender as ae, getCoreRowModel as oe, useReactTable as se } from "@tanstack/react-table";
 import { format as ce } from "date-fns";
@@ -291,11 +291,11 @@ function Re({ className: e, children: t, ...n }) {
 			...n,
 			children: [
 				t,
-				/* @__PURE__ */ a(m, {
+				/* @__PURE__ */ a(g, {
 					"data-slot": "accordion-trigger-icon",
 					className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
 				}),
-				/* @__PURE__ */ a(_, {
+				/* @__PURE__ */ a(y, {
 					"data-slot": "accordion-trigger-icon",
 					className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
 				})
@@ -355,32 +355,32 @@ function We({ className: e, ...t }) {
 //#endregion
 //#region src/components/alert-dialog/alert-dialog.tsx
 function Ge({ ...e }) {
-	return /* @__PURE__ */ a(w.Root, {
+	return /* @__PURE__ */ a(T.Root, {
 		"data-slot": "alert-dialog",
 		...e
 	});
 }
 function Ke({ ...e }) {
-	return /* @__PURE__ */ a(w.Trigger, {
+	return /* @__PURE__ */ a(T.Trigger, {
 		"data-slot": "alert-dialog-trigger",
 		...e
 	});
 }
 function qe({ ...e }) {
-	return /* @__PURE__ */ a(w.Portal, {
+	return /* @__PURE__ */ a(T.Portal, {
 		"data-slot": "alert-dialog-portal",
 		...e
 	});
 }
 function Je({ className: e, ...t }) {
-	return /* @__PURE__ */ a(w.Backdrop, {
+	return /* @__PURE__ */ a(T.Backdrop, {
 		"data-slot": "alert-dialog-overlay",
 		className: W("fixed inset-0 isolate z-50 bg-foreground/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", e),
 		...t
 	});
 }
 function Ye({ className: e, size: t = "default", ...n }) {
-	return /* @__PURE__ */ o(qe, { children: [/* @__PURE__ */ a(Je, {}), /* @__PURE__ */ a(w.Popup, {
+	return /* @__PURE__ */ o(qe, { children: [/* @__PURE__ */ a(Je, {}), /* @__PURE__ */ a(T.Popup, {
 		"data-slot": "alert-dialog-content",
 		"data-size": t,
 		className: W("group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", e),
@@ -409,14 +409,14 @@ function Qe({ className: e, ...t }) {
 	});
 }
 function $e({ className: e, ...t }) {
-	return /* @__PURE__ */ a(w.Title, {
+	return /* @__PURE__ */ a(T.Title, {
 		"data-slot": "alert-dialog-title",
 		className: W("font-heading text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", e),
 		...t
 	});
 }
 function et({ className: e, ...t }) {
-	return /* @__PURE__ */ a(w.Description, {
+	return /* @__PURE__ */ a(T.Description, {
 		"data-slot": "alert-dialog-description",
 		className: W("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", e),
 		...t
@@ -430,7 +430,7 @@ function tt({ className: e, ...t }) {
 	});
 }
 function nt({ className: e, variant: t = "outline", size: n = "default", ...r }) {
-	return /* @__PURE__ */ a(w.Close, {
+	return /* @__PURE__ */ a(T.Close, {
 		"data-slot": "alert-dialog-cancel",
 		className: W(e),
 		render: /* @__PURE__ */ a(K, {
@@ -529,9 +529,9 @@ function ft({ className: e, variant: t, size: n = "icon-xs", ...r }) {
 	});
 }
 function pt({ className: e, render: t, type: n, ...r }) {
-	return E({
+	return D({
 		defaultTagName: "button",
-		props: T({
+		props: E({
 			type: t ? n : n ?? "button",
 			className: W("absolute inset-0 z-10 outline-none", e)
 		}, r),
@@ -549,7 +549,7 @@ function mt({ className: e, ...t }) {
 //#endregion
 //#region src/components/avatar/avatar.tsx
 function ht({ className: e, size: t = "default", ...n }) {
-	return /* @__PURE__ */ a(D.Root, {
+	return /* @__PURE__ */ a(O.Root, {
 		"data-slot": "avatar",
 		"data-size": t,
 		className: W("group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten", e),
@@ -557,14 +557,14 @@ function ht({ className: e, size: t = "default", ...n }) {
 	});
 }
 function gt({ className: e, ...t }) {
-	return /* @__PURE__ */ a(D.Image, {
+	return /* @__PURE__ */ a(O.Image, {
 		"data-slot": "avatar-image",
 		className: W("aspect-square size-full rounded-full object-cover", e),
 		...t
 	});
 }
 function _t({ className: e, ...t }) {
-	return /* @__PURE__ */ a(D.Fallback, {
+	return /* @__PURE__ */ a(O.Fallback, {
 		"data-slot": "avatar-fallback",
 		className: W("flex size-full items-center justify-center rounded-full bg-muted text-sm text-foreground group-data-[size=sm]/avatar:text-xs", e),
 		...t
@@ -605,9 +605,9 @@ var xt = t("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-cent
 	defaultVariants: { variant: "default" }
 });
 function St({ className: e, variant: t = "default", render: n, ...r }) {
-	return E({
+	return D({
 		defaultTagName: "span",
-		props: T({ className: W(xt({ variant: t }), e) }, r),
+		props: E({ className: W(xt({ variant: t }), e) }, r),
 		render: n,
 		state: {
 			slot: "badge",
@@ -640,9 +640,9 @@ function Tt({ className: e, ...t }) {
 	});
 }
 function Et({ className: e, render: t, ...n }) {
-	return E({
+	return D({
 		defaultTagName: "a",
-		props: T({ className: W("transition-colors hover:text-foreground", e) }, n),
+		props: E({ className: W("transition-colors hover:text-foreground", e) }, n),
 		render: t,
 		state: { slot: "breadcrumb-link" }
 	});
@@ -664,7 +664,7 @@ function Ot({ children: e, className: t, ...n }) {
 		"aria-hidden": "true",
 		className: W("[&>svg]:size-3.5", t),
 		...n,
-		children: e ?? /* @__PURE__ */ a(g, {})
+		children: e ?? /* @__PURE__ */ a(v, {})
 	});
 }
 function kt({ className: e, ...t }) {
@@ -711,9 +711,9 @@ function Mt({ variant: e = "default", align: t = "start", className: n, ...r })
 	});
 }
 function Nt({ className: e, render: t, ...n }) {
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({ className: W("w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50", e) }, n),
+		props: E({ className: W("w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50", e) }, n),
 		render: t,
 		state: { slot: "bubble-content" }
 	});
@@ -765,9 +765,9 @@ function Lt({ className: e, orientation: t, ...n }) {
 	});
 }
 function Rt({ className: e, render: t, ...n }) {
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({ className: W("flex items-center gap-2 rounded-lg border bg-muted px-2.5 text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", e) }, n),
+		props: E({ className: W("flex items-center gap-2 rounded-lg border bg-muted px-2.5 text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", e) }, n),
 		render: t,
 		state: { slot: "button-group-text" }
 	});
@@ -783,8 +783,8 @@ function zt({ className: e, orientation: t = "vertical", ...n }) {
 //#endregion
 //#region src/components/calendar/calendar.tsx
 function Bt({ className: e, classNames: t, showOutsideDays: n = !0, captionLayout: r = "label", buttonVariant: i = "ghost", locale: o, formatters: s, components: c, ...l }) {
-	let u = ne();
-	return /* @__PURE__ */ a(O, {
+	let u = te();
+	return /* @__PURE__ */ a(k, {
 		showOutsideDays: n,
 		className: W("group/calendar bg-background p-2 [--cell-radius:var(--radius-md)] [--cell-size:--spacing(7)] in-data-[slot=card-content]:bg-transparent in-data-[slot=popover-content]:bg-transparent", String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`, String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`, e),
 		captionLayout: r,
@@ -828,7 +828,7 @@ function Bt({ className: e, classNames: t, showOutsideDays: n = !0, captionLayou
 				className: W(e),
 				...n
 			}),
-			Chevron: ({ className: e, orientation: t, ...n }) => a(t === "left" ? h : t === "right" ? g : m, {
+			Chevron: ({ className: e, orientation: t, ...n }) => a(t === "left" ? _ : t === "right" ? v : g, {
 				className: W("size-4", e),
 				...n
 			}),
@@ -849,7 +849,7 @@ function Bt({ className: e, classNames: t, showOutsideDays: n = !0, captionLayou
 	});
 }
 function Vt({ className: e, day: t, modifiers: n, locale: r, ...i }) {
-	let o = ne(), c = s.useRef(null);
+	let o = te(), c = s.useRef(null);
 	return s.useEffect(() => {
 		n.focused && c.current?.focus();
 	}, [n.focused]), /* @__PURE__ */ a(K, {
@@ -873,7 +873,7 @@ function J() {
 	return e;
 }
 function Ut({ orientation: e = "horizontal", opts: t, setApi: n, plugins: r, className: i, children: o, ...c }) {
-	let [l, u] = re({
+	let [l, u] = ne({
 		...t,
 		axis: e === "horizontal" ? "x" : "y"
 	}, r), [d, f] = s.useState(!1), [p, m] = s.useState(!1), h = s.useCallback((e) => {
@@ -945,7 +945,7 @@ function Kt({ className: e, variant: t = "outline", size: n = "icon-sm", ...r })
 		disabled: !c,
 		onClick: s,
 		...r,
-		children: [/* @__PURE__ */ a(h, {}), /* @__PURE__ */ a("span", {
+		children: [/* @__PURE__ */ a(_, {}), /* @__PURE__ */ a("span", {
 			className: "sr-only",
 			children: "Previous slide"
 		})]
@@ -961,7 +961,7 @@ function qt({ className: e, variant: t = "outline", size: n = "icon-sm", ...r })
 		disabled: !c,
 		onClick: s,
 		...r,
-		children: [/* @__PURE__ */ a(g, {}), /* @__PURE__ */ a("span", {
+		children: [/* @__PURE__ */ a(v, {}), /* @__PURE__ */ a("span", {
 			className: "sr-only",
 			children: "Next slide"
 		})]
@@ -993,7 +993,7 @@ function Qt({ id: e, className: t, children: n, config: r, initialDimension: i =
 			children: [/* @__PURE__ */ a($t, {
 				id: u,
 				config: r
-			}), /* @__PURE__ */ a(k.ResponsiveContainer, {
+			}), /* @__PURE__ */ a(A.ResponsiveContainer, {
 				initialDimension: i,
 				children: n
 			})]
@@ -1010,7 +1010,7 @@ ${n.map(([e, n]) => {
 	}).join("\n")}
 }
 `).join("\n") } }) : null;
-}, en = k.Tooltip;
+}, en = A.Tooltip;
 function tn({ active: e, payload: t, className: n, indicator: r = "dot", hideLabel: c = !1, hideIndicator: l = !1, label: u, labelFormatter: d, labelClassName: f, formatter: p, color: m, nameKey: h, labelKey: g }) {
 	let { config: _ } = Zt(), v = s.useMemo(() => {
 		if (c || !t?.length) return null;
@@ -1070,7 +1070,7 @@ function tn({ active: e, payload: t, className: n, indicator: r = "dot", hideLab
 		})]
 	});
 }
-var nn = k.Legend;
+var nn = A.Legend;
 function rn({ className: e, hideIcon: t = !1, payload: n, verticalAlign: r = "bottom", nameKey: i }) {
 	let { config: s } = Zt();
 	return n?.length ? /* @__PURE__ */ a("div", {
@@ -1095,33 +1095,33 @@ function an(e, t, n) {
 //#endregion
 //#region src/components/checkbox/checkbox.tsx
 function on({ className: e, ...t }) {
-	return /* @__PURE__ */ a(ie.Root, {
+	return /* @__PURE__ */ a(re.Root, {
 		"data-slot": "checkbox",
 		className: W("peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 group-has-[:focus-visible]/field-label:ring-0 group-has-[:focus-visible]/field-label:not-data-checked:border-input after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground group-has-[:focus-visible]/field-label:data-checked:border-primary dark:data-checked:bg-primary", e),
 		...t,
-		children: /* @__PURE__ */ a(ie.Indicator, {
+		children: /* @__PURE__ */ a(re.Indicator, {
 			"data-slot": "checkbox-indicator",
 			className: "grid place-content-center text-current transition-none [&>svg]:size-3.5",
-			children: /* @__PURE__ */ a(p, {})
+			children: /* @__PURE__ */ a(h, {})
 		})
 	});
 }
 //#endregion
 //#region src/components/collapsible/collapsible.tsx
 function sn({ ...e }) {
-	return /* @__PURE__ */ a(A.Root, {
+	return /* @__PURE__ */ a(ie.Root, {
 		"data-slot": "collapsible",
 		...e
 	});
 }
 function cn({ ...e }) {
-	return /* @__PURE__ */ a(A.Trigger, {
+	return /* @__PURE__ */ a(ie.Trigger, {
 		"data-slot": "collapsible-trigger",
 		...e
 	});
 }
 function ln({ ...e }) {
-	return /* @__PURE__ */ a(A.Panel, {
+	return /* @__PURE__ */ a(ie.Panel, {
 		"data-slot": "collapsible-content",
 		...e
 	});
@@ -1218,7 +1218,7 @@ function xn({ className: e, children: t, ...n }) {
 		"data-slot": "combobox-trigger",
 		className: W("[&_svg:not([class*='size-'])]:size-4", e),
 		...n,
-		children: [t, /* @__PURE__ */ a(m, { className: "pointer-events-none size-4 text-muted-foreground" })]
+		children: [t, /* @__PURE__ */ a(g, { className: "pointer-events-none size-4 text-muted-foreground" })]
 	});
 }
 function Sn({ className: e, "aria-label": t = "Clear selection", ...n }) {
@@ -1231,7 +1231,7 @@ function Sn({ className: e, "aria-label": t = "Clear selection", ...n }) {
 		className: W(e),
 		"aria-label": t,
 		...n,
-		children: /* @__PURE__ */ a(C, { className: "pointer-events-none" })
+		children: /* @__PURE__ */ a(w, { className: "pointer-events-none" })
 	});
 }
 function Cn({ className: e, children: t, disabled: n = !1, showTrigger: r = !0, showClear: i = !1, triggerAriaLabel: s = "Toggle suggestions", ...c }) {
@@ -1288,7 +1288,7 @@ function En({ className: e, children: t, ...n }) {
 		...n,
 		children: [t, /* @__PURE__ */ a(j.ItemIndicator, {
 			render: /* @__PURE__ */ a("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
-			children: /* @__PURE__ */ a(p, { className: "pointer-events-none" })
+			children: /* @__PURE__ */ a(h, { className: "pointer-events-none" })
 		})]
 	});
 }
@@ -1346,7 +1346,7 @@ function Nn({ className: e, children: t, showRemove: n = !0, ...r }) {
 			className: "-ml-1 opacity-50 hover:opacity-100",
 			"data-slot": "combobox-chip-remove",
 			"aria-label": "Remove item",
-			children: /* @__PURE__ */ a(C, { className: "pointer-events-none" })
+			children: /* @__PURE__ */ a(w, { className: "pointer-events-none" })
 		})]
 	});
 }
@@ -1499,7 +1499,7 @@ function Yn({ className: e, ...t }) {
 //#endregion
 //#region src/components/date-picker/date-picker.tsx
 function Xn(e) {
-	let { value: t, defaultValue: n, onValueChange: r, placeholder: i = "Pick a date", disabled: c, className: l, calendarProps: u, triggerProps: d, formatValue: p = (e) => ce(e, "PPP") } = e, [m, h] = s.useState(n), [g, _] = s.useState(!1), v = Object.prototype.hasOwnProperty.call(e, "value"), y = v ? t : m, b = (e) => {
+	let { value: t, defaultValue: n, onValueChange: r, placeholder: i = "Pick a date", disabled: c, className: l, calendarProps: u, triggerProps: d, formatValue: f = (e) => ce(e, "PPP") } = e, [p, h] = s.useState(n), [g, _] = s.useState(!1), v = Object.prototype.hasOwnProperty.call(e, "value"), y = v ? t : p, b = (e) => {
 		v || h(e), r?.(e), e && _(!1);
 	};
 	return /* @__PURE__ */ o(Wn, {
@@ -1512,7 +1512,7 @@ function Xn(e) {
 				variant: d?.variant ?? "outline",
 				className: W("justify-start text-left font-normal data-[empty=true]:text-muted-foreground", l, d?.className)
 			}),
-			children: [/* @__PURE__ */ a(f, { "data-icon": "inline-start" }), y ? p(y) : /* @__PURE__ */ a("span", { children: i })]
+			children: [/* @__PURE__ */ a(m, { "data-icon": "inline-start" }), y ? f(y) : /* @__PURE__ */ a("span", { children: i })]
 		}), /* @__PURE__ */ a(Kn, {
 			align: "start",
 			"aria-label": "Choose date",
@@ -1571,7 +1571,7 @@ function nr({ className: e, children: t, showCloseButton: n = !0, ...r }) {
 				className: "absolute top-2 right-2",
 				size: "icon-sm"
 			}),
-			children: [/* @__PURE__ */ a(C, {}), /* @__PURE__ */ a("span", {
+			children: [/* @__PURE__ */ a(w, {}), /* @__PURE__ */ a("span", {
 				className: "sr-only",
 				children: "Close"
 			})]
@@ -1794,7 +1794,7 @@ function Or({ className: e, inset: t, children: n, ...r }) {
 		"data-inset": t,
 		className: W("flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-popup-open:bg-accent data-popup-open:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", e),
 		...r,
-		children: [n, /* @__PURE__ */ a(g, { className: "ml-auto" })]
+		children: [n, /* @__PURE__ */ a(v, { className: "ml-auto" })]
 	});
 }
 function kr({ align: e = "start", alignOffset: t = -3, side: n = "right", sideOffset: r = 0, className: i, ...o }) {
@@ -1818,7 +1818,7 @@ function Ar({ className: e, children: t, checked: n, inset: r, ...i }) {
 		children: [/* @__PURE__ */ a("span", {
 			className: "pointer-events-none absolute right-2 flex items-center justify-center",
 			"data-slot": "dropdown-menu-checkbox-item-indicator",
-			children: /* @__PURE__ */ a(F.CheckboxItemIndicator, { children: /* @__PURE__ */ a(p, {}) })
+			children: /* @__PURE__ */ a(F.CheckboxItemIndicator, { children: /* @__PURE__ */ a(h, {}) })
 		}), t]
 	});
 }
@@ -1837,7 +1837,7 @@ function Mr({ className: e, children: t, inset: n, ...r }) {
 		children: [/* @__PURE__ */ a("span", {
 			className: "pointer-events-none absolute right-2 flex items-center justify-center",
 			"data-slot": "dropdown-menu-radio-item-indicator",
-			children: /* @__PURE__ */ a(F.RadioItemIndicator, { children: /* @__PURE__ */ a(p, {}) })
+			children: /* @__PURE__ */ a(F.RadioItemIndicator, { children: /* @__PURE__ */ a(h, {}) })
 		}), t]
 	});
 }
@@ -1978,9 +1978,9 @@ var qr = t("group/item flex w-full flex-wrap items-center rounded-lg border text
 	}
 });
 function Jr({ className: e, variant: t = "default", size: n = "default", render: r, ...i }) {
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({ className: W(qr({
+		props: E({ className: W(qr({
 			variant: t,
 			size: n,
 			className: e
@@ -2062,9 +2062,9 @@ var ri = t("group/marker relative flex min-h-4 w-full items-center gap-2 text-le
 	border: "border-b border-border pb-2"
 } } });
 function ii({ className: e, variant: t = "default", render: n, ...r }) {
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({ className: W(ri({
+		props: E({ className: W(ri({
 			variant: t,
 			className: e
 		})) }, r),
@@ -2148,7 +2148,7 @@ function pi({ className: e, size: t = "default", "aria-label": n = "Select an op
 			"data-size": t,
 			className: "h-8 w-full min-w-0 appearance-none rounded-lg border border-input bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors outline-none select-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
 			...r
-		}), /* @__PURE__ */ a(m, {
+		}), /* @__PURE__ */ a(g, {
 			className: "pointer-events-none absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none",
 			"aria-hidden": "true",
 			"data-slot": "native-select-icon"
@@ -2213,7 +2213,7 @@ function bi({ className: e, text: t = "Previous", ...n }) {
 		size: "default",
 		className: W("pl-1.5!", e),
 		...n,
-		children: [/* @__PURE__ */ a(h, { "data-icon": "inline-start" }), /* @__PURE__ */ a("span", {
+		children: [/* @__PURE__ */ a(_, { "data-icon": "inline-start" }), /* @__PURE__ */ a("span", {
 			className: "hidden sm:block",
 			children: t
 		})]
@@ -2228,7 +2228,7 @@ function xi({ className: e, text: t = "Next", ...n }) {
 		children: [/* @__PURE__ */ a("span", {
 			className: "hidden sm:block",
 			children: t
-		}), /* @__PURE__ */ a(g, { "data-icon": "inline-end" })]
+		}), /* @__PURE__ */ a(v, { "data-icon": "inline-end" })]
 	});
 }
 function Si({ className: e, ...t }) {
@@ -2308,26 +2308,26 @@ function Mi({ defaultItem: e, item: t, items: n = [], onItemChange: r, shortcuts
 		_,
 		t,
 		r
-	]), te = s.useCallback((e) => (f((t) => t.includes(e) ? t : [...t, e]), () => f((t) => t.filter((t) => t !== e))), []), C = s.useCallback((e, t) => {
+	]), C = s.useCallback((e) => (f((t) => t.includes(e) ? t : [...t, e]), () => f((t) => t.filter((t) => t !== e))), []), w = s.useCallback((e, t) => {
 		b((n) => ({
 			...n,
 			[e]: t ? "answered" : "unanswered"
 		}));
-	}, []), w = s.useCallback((e, t, n, r) => {
+	}, []), T = s.useCallback((e, t, n, r) => {
 		ee((i) => {
 			let a = i[e] ?? [], o = r ? n ? [.../* @__PURE__ */ new Set([...a, t])] : [t] : a.filter((e) => e !== t);
-			return C(e, o.length > 0), {
+			return w(e, o.length > 0), {
 				...i,
 				[e]: o
 			};
 		});
-	}, [C]), T = s.useCallback(() => {
+	}, [w]), E = s.useCallback(() => {
 		S(m[v - 1]);
 	}, [
 		v,
 		m,
 		S
-	]), E = s.useCallback(() => {
+	]), D = s.useCallback(() => {
 		if (_) {
 			if (n.find((e) => e.name === _)?.required && y[_] !== "answered") {
 				b((e) => ({
@@ -2345,7 +2345,7 @@ function Mi({ defaultItem: e, item: t, items: n = [], onItemChange: r, shortcuts
 		m,
 		S,
 		y
-	]), D = s.useCallback(() => {
+	]), O = s.useCallback(() => {
 		_ && (b((e) => ({
 			...e,
 			[_]: "skipped"
@@ -2355,7 +2355,7 @@ function Mi({ defaultItem: e, item: t, items: n = [], onItemChange: r, shortcuts
 		_,
 		m,
 		S
-	]), O = s.useMemo(() => ({
+	]), k = s.useMemo(() => ({
 		activeName: _,
 		current: m.length ? v + 1 : 0,
 		first: v === 0,
@@ -2365,29 +2365,29 @@ function Mi({ defaultItem: e, item: t, items: n = [], onItemChange: r, shortcuts
 		itemDefinitions: n,
 		statuses: y,
 		selections: x,
-		registerItem: te,
-		setAnswered: C,
-		setSelection: w,
-		goPrevious: T,
-		goNext: E,
-		skip: D
+		registerItem: C,
+		setAnswered: w,
+		setSelection: T,
+		goPrevious: E,
+		goNext: D,
+		skip: O
 	}), [
 		v,
 		_,
+		D,
 		E,
-		T,
 		n,
 		m.length,
-		te,
-		x,
 		C,
+		x,
 		w,
+		T,
 		i,
-		D,
+		O,
 		y
 	]);
 	return /* @__PURE__ */ a(Oi.Provider, {
-		value: O,
+		value: k,
 		children: /* @__PURE__ */ a("form", {
 			...u,
 			noValidate: !0,
@@ -2396,16 +2396,16 @@ function Mi({ defaultItem: e, item: t, items: n = [], onItemChange: r, shortcuts
 			},
 			onSubmit: c,
 			onKeyDown: (e) => {
-				l?.(e), !e.defaultPrevented && (e.metaKey || e.ctrlKey) && e.key === "Enter" && (e.preventDefault(), O.last ? e.currentTarget.requestSubmit() : O.goNext());
+				l?.(e), !e.defaultPrevented && (e.metaKey || e.ctrlKey) && e.key === "Enter" && (e.preventDefault(), k.last ? e.currentTarget.requestSubmit() : k.goNext());
 			}
 		})
 	});
 }
 function Ni({ children: e, render: t, ...n }) {
 	let { current: r, first: i, last: a, total: o } = X("QuestionnaireProgress"), s = o ? `Question ${r} of ${o}` : void 0;
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({
+		props: E({
 			children: e ?? s,
 			role: "progressbar",
 			"aria-label": "Questionnaire progress",
@@ -2461,7 +2461,7 @@ function Pi({ disabled: e = !1, invalid: t = !1, multiple: n = !1, name: r, onSt
 	});
 }
 function Fi({ render: e, ...t }) {
-	return Z("QuestionnaireTitle"), E({
+	return Z("QuestionnaireTitle"), D({
 		defaultTagName: "legend",
 		props: t,
 		render: e,
@@ -2469,7 +2469,7 @@ function Fi({ render: e, ...t }) {
 	});
 }
 function Ii({ render: e, ...t }) {
-	return Z("QuestionnaireDescription"), E({
+	return Z("QuestionnaireDescription"), D({
 		defaultTagName: "p",
 		props: t,
 		render: e,
@@ -2692,7 +2692,7 @@ function ea({ children: e, className: t, ...n }) {
 				children: [/* @__PURE__ */ a("span", {
 					"data-slot": "questionnaire-choice-indicator-dot",
 					className: "hidden size-2 rounded-full bg-primary-foreground group-data-[type=checkbox]/questionnaire-choice:hidden group-data-checked/questionnaire-choice:block"
-				}), /* @__PURE__ */ a(p, {
+				}), /* @__PURE__ */ a(h, {
 					"data-slot": "questionnaire-choice-indicator-check",
 					className: "hidden size-3.5 group-data-[type=radio]/questionnaire-choice:hidden group-data-checked/questionnaire-choice:block"
 				})]
@@ -2869,7 +2869,7 @@ function ga({ className: e, size: t = "default", children: n, "aria-label": r =
 		"data-size": t,
 		className: W("flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", e),
 		...i,
-		children: [n, /* @__PURE__ */ a(z.Icon, { render: /* @__PURE__ */ a(m, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
+		children: [n, /* @__PURE__ */ a(z.Icon, { render: /* @__PURE__ */ a(g, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
 	});
 }
 function _a({ className: e, children: t, side: n = "bottom", sideOffset: r = 4, align: i = "center", alignOffset: s = 0, alignItemWithTrigger: c = !0, ...l }) {
@@ -2910,7 +2910,7 @@ function ya({ className: e, children: t, ...n }) {
 			children: t
 		}), /* @__PURE__ */ a(z.ItemIndicator, {
 			render: /* @__PURE__ */ a("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
-			children: /* @__PURE__ */ a(p, { className: "pointer-events-none" })
+			children: /* @__PURE__ */ a(h, { className: "pointer-events-none" })
 		})]
 	});
 }
@@ -2926,7 +2926,7 @@ function xa({ className: e, ...t }) {
 		"data-slot": "select-scroll-up-button",
 		className: W("top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", e),
 		...t,
-		children: /* @__PURE__ */ a(_, {})
+		children: /* @__PURE__ */ a(y, {})
 	});
 }
 function Sa({ className: e, ...t }) {
@@ -2934,7 +2934,7 @@ function Sa({ className: e, ...t }) {
 		"data-slot": "select-scroll-down-button",
 		className: W("bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", e),
 		...t,
-		children: /* @__PURE__ */ a(m, {})
+		children: /* @__PURE__ */ a(g, {})
 	});
 }
 //#endregion
@@ -2983,7 +2983,7 @@ function Oa({ className: e, children: t, side: n = "right", showCloseButton: r =
 				className: "absolute top-3 right-3",
 				size: "icon-sm"
 			}),
-			children: [/* @__PURE__ */ a(C, {}), /* @__PURE__ */ a("span", {
+			children: [/* @__PURE__ */ a(w, {}), /* @__PURE__ */ a("span", {
 				className: "sr-only",
 				children: "Close"
 			})]
@@ -3268,9 +3268,9 @@ function ro({ className: e, ...t }) {
 	});
 }
 function io({ className: e, render: t, ...n }) {
-	return E({
+	return D({
 		defaultTagName: "div",
-		props: T({ className: W("flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", e) }, n),
+		props: E({ className: W("flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", e) }, n),
 		render: t,
 		state: {
 			slot: "sidebar-group-label",
@@ -3279,9 +3279,9 @@ function io({ className: e, render: t, ...n }) {
 	});
 }
 function ao({ className: e, render: t, ...n }) {
-	return E({
+	return D({
 		defaultTagName: "button",
-		props: T({ className: W("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", e) }, n),
+		props: E({ className: W("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", e) }, n),
 		render: t,
 		state: {
 			slot: "sidebar-group-action",
@@ -3331,9 +3331,9 @@ var lo = t("peer/menu-button group/menu-button flex w-full items-center gap-2 ov
 	}
 });
 function uo({ render: e, isActive: t = !1, variant: n = "default", size: r = "default", tooltip: i, className: s, ...c }) {
-	let { isMobile: l, state: u } = $(), d = E({
+	let { isMobile: l, state: u } = $(), d = D({
 		defaultTagName: "button",
-		props: T({ className: W(lo({
+		props: E({ className: W(lo({
 			variant: n,
 			size: r
 		}), s) }, c),
@@ -3353,9 +3353,9 @@ function uo({ render: e, isActive: t = !1, variant: n = "default", size: r = "de
 	})] })) : d;
 }
 function fo({ className: e, render: t, showOnHover: n = !1, ...r }) {
-	return E({
+	return D({
 		defaultTagName: "button",
-		props: T({ className: W("absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", n && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground aria-expanded:opacity-100 md:opacity-0", e) }, r),
+		props: E({ className: W("absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", n && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground aria-expanded:opacity-100 md:opacity-0", e) }, r),
 		render: t,
 		state: {
 			slot: "sidebar-menu-action",
@@ -3405,9 +3405,9 @@ function go({ className: e, ...t }) {
 	});
 }
 function _o({ render: e, size: t = "md", isActive: n = !1, className: r, ...i }) {
-	return E({
+	return D({
 		defaultTagName: "a",
-		props: T({ className: W("flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-sm data-[size=sm]:text-xs data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", r) }, i),
+		props: E({ className: W("flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-sm data-[size=sm]:text-xs data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", r) }, i),
 		render: e,
 		state: {
 			slot: "sidebar-menu-sub-button",
@@ -3453,7 +3453,7 @@ function vo({ className: e, defaultValue: t, value: n, min: r = 0, max: i = 100,
 //#endregion
 //#region src/components/spinner/spinner.tsx
 function yo({ className: e, ...t }) {
-	return /* @__PURE__ */ a(b, {
+	return /* @__PURE__ */ a(C, {
 		"data-slot": "spinner",
 		role: "status",
 		"aria-label": "Loading",
@@ -3583,15 +3583,15 @@ function Fo({ className: e, children: t, render: n = /* @__PURE__ */ a(K, {
 		render: n,
 		className: W("relative shrink-0 text-muted-foreground after:absolute after:-inset-2 after:content-[''] hover:text-foreground", e),
 		...r,
-		children: t ?? /* @__PURE__ */ a(C, { "aria-hidden": "true" })
+		children: t ?? /* @__PURE__ */ a(w, { "aria-hidden": "true" })
 	});
 }
 function Io({ type: e }) {
 	let t = null;
-	return e === "success" && (t = /* @__PURE__ */ a(v, { "aria-hidden": "true" })), e === "info" && (t = /* @__PURE__ */ a(y, { "aria-hidden": "true" })), e === "warning" && (t = /* @__PURE__ */ a(te, { "aria-hidden": "true" })), e === "error" && (t = /* @__PURE__ */ a(ee, {
+	return e === "success" && (t = /* @__PURE__ */ a(b, { "aria-hidden": "true" })), e === "info" && (t = /* @__PURE__ */ a(ee, { "aria-hidden": "true" })), e === "warning" && (t = /* @__PURE__ */ a(p, { "aria-hidden": "true" })), e === "error" && (t = /* @__PURE__ */ a(f, {
 		className: "text-destructive",
 		"aria-hidden": "true"
-	})), e === "loading" && (t = /* @__PURE__ */ a(b, {
+	})), e === "loading" && (t = /* @__PURE__ */ a(C, {
 		className: "animate-spin",
 		"aria-hidden": "true"
 	})), t ? /* @__PURE__ */ a("span", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almanaclabs/blaze-ui",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "Shared React components and design tokens for Blaze",
   "type": "module",
   "sideEffects": [
@@ -44,12 +44,12 @@
   },
   "dependencies": {
     "@fontsource-variable/inter": "5.3.0",
+    "@tabler/icons-react": "3.31.0",
     "@tanstack/react-table": "8.21.3",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
     "date-fns": "4.4.0",
     "embla-carousel-react": "8.6.0",
-    "lucide-react": "1.31.0",
     "react-day-picker": "10.0.1",
     "recharts": "3.8.0",
     "tailwind-merge": "3.6.0",