@bzync/rui 0.0.5 → 0.0.9

package/dist/components/drawer.js

@@ -1,3 +1,129 @@
 "use client";
-import { t as e } from "../drawer-ixuzyLVS.js";
-export { e as Drawer };
+import { t as e } from "../cn-BJyZJP-y.js";
+import { c as t } from "../component-styles-C2CbHEEA.js";
+import { t as n } from "../use-event-callback-DGkfO_uu.js";
+import { n as r } from "../motion-gnRzFS5f.js";
+import { n as i, t as a } from "../use-focus-trap-CS6BXJAB.js";
+import { t as o } from "../icons-Dk7VZ4Ph.js";
+import { AnimatePresence as s, motion as c } from "framer-motion";
+import { useId as l, useRef as u } from "react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { createPortal as m } from "react-dom";
+//#region src/components/drawer.tsx
+function h({ open: h, onClose: g, position: _ = "left", title: v, children: y, width: b = 320, className: x, overlayClassName: S, panelClassName: C, headerClassName: w, titleClassName: T, closeButtonClassName: E, contentClassName: D, handleClassName: O, unstyled: k = !1, ariaLabel: A = "Drawer", closeAriaLabel: j = "Close drawer", closeOnEscape: M = !0, closeOnOverlayClick: N = !0 }) {
+	let P = n(g), F = u(null), I = l(), { previouslyFocusedRef: L, restoreNow: R } = i(h);
+	a(F, {
+		active: h,
+		onEscape: P,
+		closeOnEscape: M
+	});
+	let z = R;
+	if (typeof document > "u") return null;
+	if (k && h) return m(/* @__PURE__ */ f("div", {
+		ref: F,
+		tabIndex: -1,
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": typeof v == "string" ? v : A,
+		className: e(x, C),
+		children: y
+	}), document.body);
+	if (_ === "bottom") return m(/* @__PURE__ */ f(s, {
+		onExitComplete: z,
+		children: h && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(c.div, {
+			initial: { opacity: 0 },
+			animate: { opacity: 1 },
+			exit: { opacity: 0 },
+			transition: r.overlay,
+			className: e("fixed inset-0 z-[100] bg-overlay", S),
+			onClick: N ? P : void 0
+		}, "drawer-backdrop"), /* @__PURE__ */ p(c.div, {
+			ref: F,
+			tabIndex: -1,
+			initial: { y: "100%" },
+			animate: { y: 0 },
+			exit: { y: "100%" },
+			transition: r.panelEnter,
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-labelledby": v ? I : void 0,
+			"aria-label": v ? void 0 : A,
+			className: e("fixed bottom-0 left-0 right-0 z-[101] flex max-h-[80dvh] flex-col rounded-t-[var(--radius-xl)] border-t border-border bg-surface-raised shadow-overlay", C, x),
+			children: [
+				/* @__PURE__ */ f("div", {
+					className: "flex justify-center pb-1 pt-3 shrink-0",
+					"aria-hidden": "true",
+					children: /* @__PURE__ */ f("div", { className: e("h-1 w-9 rounded-full bg-border-strong", O) })
+				}),
+				v && /* @__PURE__ */ p("div", {
+					className: e("flex items-center justify-between border-b border-border px-5 py-3 shrink-0", w),
+					children: [/* @__PURE__ */ f("h2", {
+						id: I,
+						className: e("text-sm font-semibold text-foreground", T),
+						children: v
+					}), /* @__PURE__ */ f("button", {
+						type: "button",
+						onClick: P,
+						className: e(t, E),
+						"aria-label": j,
+						children: /* @__PURE__ */ f(o, {
+							size: 14,
+							"aria-hidden": "true"
+						})
+					})]
+				}),
+				/* @__PURE__ */ f("div", {
+					className: e("flex-1 overflow-y-auto pb-safe-bottom", D),
+					children: y
+				})
+			]
+		}, "drawer-panel")] })
+	}), document.body);
+	let B = _ === "left" ? "-100%" : "100%";
+	return m(/* @__PURE__ */ f(s, {
+		onExitComplete: z,
+		children: h && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(c.div, {
+			initial: { opacity: 0 },
+			animate: { opacity: 1 },
+			exit: { opacity: 0 },
+			transition: r.overlay,
+			className: e("fixed inset-0 z-[100] bg-overlay", S),
+			onClick: N ? P : void 0
+		}, "drawer-backdrop"), /* @__PURE__ */ p(c.div, {
+			ref: F,
+			tabIndex: -1,
+			initial: { x: B },
+			animate: { x: 0 },
+			exit: { x: B },
+			transition: r.panelEnter,
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-labelledby": v ? I : void 0,
+			"aria-label": v ? void 0 : A,
+			className: e("fixed top-0 bottom-0 z-[101] flex max-w-[100vw] flex-col bg-surface-raised shadow-overlay", _ === "left" ? "left-0 border-r border-border" : "right-0 border-l border-border", C, x),
+			style: { width: b },
+			children: [v && /* @__PURE__ */ p("div", {
+				className: e("flex h-14 items-center justify-between gap-3 border-b border-border px-5 shrink-0", w),
+				children: [/* @__PURE__ */ f("h2", {
+					id: I,
+					className: e("min-w-0 truncate text-sm font-semibold text-foreground", T),
+					children: v
+				}), /* @__PURE__ */ f("button", {
+					type: "button",
+					onClick: P,
+					className: e(t, E),
+					"aria-label": j,
+					children: /* @__PURE__ */ f(o, {
+						size: 14,
+						"aria-hidden": "true"
+					})
+				})]
+			}), /* @__PURE__ */ f("div", {
+				className: e("flex-1 overflow-y-auto", D),
+				children: y
+			})]
+		}, "drawer-panel")] })
+	}), document.body);
+}
+//#endregion
+export { h as Drawer };

package/dist/components/dropdown-menu-panel.cjs

@@ -0,0 +1 @@
+"use client";const e=require("../cn-B6R3HKzx.cjs"),t=require("../motion-B2shivEB.cjs");let n=require("framer-motion"),r=require("react/jsx-runtime");var i={bottom:`top-full mt-1.5`,top:`bottom-full mb-1.5`},a={start:`left-0`,end:`right-0`,center:`left-1/2 -translate-x-1/2`},o={bottom:{y:-4},top:{y:4}};function s(e){return`items`in e}function c({open:c,menuRef:l,items:u,side:d,align:f,className:p,itemClassName:m,groupLabelClassName:h,separatorClassName:g,ariaLabel:_,onKeyDown:v,onSelect:y}){function b(t,n){return(0,r.jsxs)(`button`,{type:`button`,disabled:t.disabled,role:`menuitem`,onClick:()=>{t.disabled||(t.onClick?.(),y())},className:e.t(`flex min-h-9 items-center gap-2.5 w-full px-3 py-2 text-sm rounded-md transition-colors text-left focus-visible:outline-none focus-visible:bg-surface-muted`,t.destructive?`text-destructive hover:bg-destructive/10`:`text-foreground hover:bg-surface-muted`,t.disabled&&`opacity-40 cursor-not-allowed pointer-events-none`,m),children:[t.icon&&(0,r.jsx)(`span`,{className:e.t(`shrink-0`,t.destructive?`text-red-400`:`text-slate-500 dark:text-slate-400`),children:t.icon}),(0,r.jsx)(`span`,{className:`flex-1 min-w-0 truncate`,children:t.label}),t.shortcut&&(0,r.jsx)(`span`,{className:`text-[10px] text-slate-500 shrink-0 font-mono`,children:t.shortcut})]},n)}return(0,r.jsx)(n.AnimatePresence,{children:c&&(0,r.jsx)(n.motion.div,{ref:l,role:`menu`,"aria-label":_,onKeyDown:v,initial:{opacity:0,scaleY:.96,...o[d]},animate:{opacity:1,scaleY:1,y:0},exit:{opacity:0,scaleY:.96,...o[d]},transition:t.n.fade,style:{originY:d===`bottom`?0:1},className:e.t(`absolute z-50 min-w-[180px] rounded-[var(--radius-lg)] border border-border bg-surface-raised shadow-floating`,`p-1`,i[d],a[f],p),children:u.map((t,n)=>s(t)?(0,r.jsxs)(`div`,{children:[n>0&&(0,r.jsx)(`div`,{role:`separator`,className:e.t(`my-1 border-t border-border`,g)}),t.group&&(0,r.jsx)(`p`,{className:e.t(`px-3 pt-1.5 pb-1 text-xs font-medium text-muted-foreground`,h),children:t.group}),t.items.map((e,t)=>b(e,t))]},n):b(t,n))})})}module.exports=c;

package/dist/components/dropdown-menu-panel.d.ts

@@ -0,0 +1,24 @@
+import { DropdownMenuSection } from './dropdown-menu';
+type Side = "bottom" | "top";
+type Align = "start" | "end" | "center";
+export interface DropdownMenuPanelProps {
+    open: boolean;
+    menuRef: React.RefObject<HTMLDivElement | null>;
+    items: DropdownMenuSection[];
+    side: Side;
+    align: Align;
+    className?: string;
+    itemClassName?: string;
+    groupLabelClassName?: string;
+    separatorClassName?: string;
+    ariaLabel: string;
+    onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    onSelect: () => void;
+}
+/**
+ * The framer-motion-backed menu surface for {@link DropdownMenu}, split into its
+ * own async chunk so the motion runtime stays off the initial critical path —
+ * it loads on first open of any dropdown, not on page load.
+ */
+export default function DropdownMenuPanel({ open, menuRef, items, side, align, className, itemClassName, groupLabelClassName, separatorClassName, ariaLabel, onKeyDown, onSelect, }: DropdownMenuPanelProps): import("react").JSX.Element;
+export {};

package/dist/components/dropdown-menu-panel.js

@@ -0,0 +1,84 @@
+"use client";
+import { t as e } from "../cn-BJyZJP-y.js";
+import { n as t } from "../motion-gnRzFS5f.js";
+import { AnimatePresence as n, motion as r } from "framer-motion";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/dropdown-menu-panel.tsx
+var o = {
+	bottom: "top-full mt-1.5",
+	top: "bottom-full mb-1.5"
+}, s = {
+	start: "left-0",
+	end: "right-0",
+	center: "left-1/2 -translate-x-1/2"
+}, c = {
+	bottom: { y: -4 },
+	top: { y: 4 }
+};
+function l(e) {
+	return "items" in e;
+}
+function u({ open: u, menuRef: d, items: f, side: p, align: m, className: h, itemClassName: g, groupLabelClassName: _, separatorClassName: v, ariaLabel: y, onKeyDown: b, onSelect: x }) {
+	function S(t, n) {
+		return /* @__PURE__ */ a("button", {
+			type: "button",
+			disabled: t.disabled,
+			role: "menuitem",
+			onClick: () => {
+				t.disabled || (t.onClick?.(), x());
+			},
+			className: e("flex min-h-9 items-center gap-2.5 w-full px-3 py-2 text-sm rounded-md transition-colors text-left focus-visible:outline-none focus-visible:bg-surface-muted", t.destructive ? "text-destructive hover:bg-destructive/10" : "text-foreground hover:bg-surface-muted", t.disabled && "opacity-40 cursor-not-allowed pointer-events-none", g),
+			children: [
+				t.icon && /* @__PURE__ */ i("span", {
+					className: e("shrink-0", t.destructive ? "text-red-400" : "text-slate-500 dark:text-slate-400"),
+					children: t.icon
+				}),
+				/* @__PURE__ */ i("span", {
+					className: "flex-1 min-w-0 truncate",
+					children: t.label
+				}),
+				t.shortcut && /* @__PURE__ */ i("span", {
+					className: "text-[10px] text-slate-500 shrink-0 font-mono",
+					children: t.shortcut
+				})
+			]
+		}, n);
+	}
+	return /* @__PURE__ */ i(n, { children: u && /* @__PURE__ */ i(r.div, {
+		ref: d,
+		role: "menu",
+		"aria-label": y,
+		onKeyDown: b,
+		initial: {
+			opacity: 0,
+			scaleY: .96,
+			...c[p]
+		},
+		animate: {
+			opacity: 1,
+			scaleY: 1,
+			y: 0
+		},
+		exit: {
+			opacity: 0,
+			scaleY: .96,
+			...c[p]
+		},
+		transition: t.fade,
+		style: { originY: p === "bottom" ? 0 : 1 },
+		className: e("absolute z-50 min-w-[180px] rounded-[var(--radius-lg)] border border-border bg-surface-raised shadow-floating", "p-1", o[p], s[m], h),
+		children: f.map((t, n) => l(t) ? /* @__PURE__ */ a("div", { children: [
+			n > 0 && /* @__PURE__ */ i("div", {
+				role: "separator",
+				className: e("my-1 border-t border-border", v)
+			}),
+			t.group && /* @__PURE__ */ i("p", {
+				className: e("px-3 pt-1.5 pb-1 text-xs font-medium text-muted-foreground", _),
+				children: t.group
+			}),
+			t.items.map((e, t) => S(e, t))
+		] }, n) : S(t, n))
+	}) });
+}
+//#endregion
+export { u as default };

package/dist/components/dropdown-menu.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-BdjraxxU.cjs");let t=require("framer-motion"),n=require("react"),r=require("react/jsx-runtime");function i(e){return`items`in e}var a={bottom:`top-full mt-1.5`,top:`bottom-full mb-1.5`},o={start:`left-0`,end:`right-0`,center:`left-1/2 -translate-x-1/2`},s={bottom:{y:-4},top:{y:4}};function c({trigger:c,items:l,side:u=`bottom`,align:d=`start`,className:f,ariaLabel:p=`Actions menu`}){let[m,h]=(0,n.useState)(!1),g=(0,n.useRef)(null),_=(0,n.useRef)(null);(0,n.useEffect)(()=>{function e(e){g.current?.contains(e.target)||h(!1)}return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,n.useEffect)(()=>{m&&_.current?.querySelector(`[role="menuitem"]:not(:disabled)`)?.focus()},[m]);function v(){h(!1),g.current?.querySelector(`[aria-haspopup="menu"]`)?.focus()}function y(e){let t=Array.from(_.current?.querySelectorAll(`[role="menuitem"]:not(:disabled)`)??[]),n=t.indexOf(document.activeElement);e.key===`Escape`?(e.preventDefault(),v()):[`ArrowDown`,`ArrowUp`,`Home`,`End`].includes(e.key)&&t.length>0&&(e.preventDefault(),t[e.key===`Home`?0:e.key===`End`?t.length-1:(Math.max(n,0)+(e.key===`ArrowDown`?1:-1)+t.length)%t.length]?.focus())}function b(t,n){return(0,r.jsxs)(`button`,{type:`button`,disabled:t.disabled,role:`menuitem`,onClick:()=>{t.disabled||(t.onClick?.(),h(!1))},className:e.t(`flex min-h-9 items-center gap-2.5 w-full px-3 py-2 text-sm rounded-md transition-colors text-left focus-visible:outline-none focus-visible:bg-surface-muted`,t.destructive?`text-destructive hover:bg-destructive/10`:`text-foreground hover:bg-surface-muted`,t.disabled&&`opacity-40 cursor-not-allowed pointer-events-none`),children:[t.icon&&(0,r.jsx)(`span`,{className:e.t(`shrink-0`,t.destructive?`text-red-400`:`text-slate-500 dark:text-slate-400`),children:t.icon}),(0,r.jsx)(`span`,{className:`flex-1 min-w-0 truncate`,children:t.label}),t.shortcut&&(0,r.jsx)(`span`,{className:`text-[10px] text-slate-500 shrink-0 font-mono`,children:t.shortcut})]},n)}let x=(0,n.isValidElement)(c)?(0,n.cloneElement)(c,{"aria-haspopup":`menu`,"aria-expanded":m,onClick:e=>{c.props.onClick?.(e),e.defaultPrevented||h(e=>!e)}}):(0,r.jsx)(`button`,{type:`button`,"aria-haspopup":`menu`,"aria-expanded":m,onClick:()=>h(e=>!e),children:c});return(0,r.jsxs)(`div`,{ref:g,className:`relative inline-flex`,children:[x,(0,r.jsx)(t.AnimatePresence,{children:m&&(0,r.jsx)(t.motion.div,{ref:_,role:`menu`,"aria-label":p,onKeyDown:y,initial:{opacity:0,scaleY:.96,...s[u]},animate:{opacity:1,scaleY:1,y:0},exit:{opacity:0,scaleY:.96,...s[u]},transition:{duration:.13},style:{originY:u===`bottom`?0:1},className:e.t(`absolute z-50 min-w-[180px] rounded-[var(--radius-lg)] border border-border bg-surface-raised shadow-floating`,`p-1`,a[u],o[d],f),children:l.map((e,t)=>i(e)?(0,r.jsxs)(`div`,{children:[t>0&&(0,r.jsx)(`div`,{role:`separator`,className:`my-1 border-t border-border`}),e.group&&(0,r.jsx)(`p`,{className:`px-3 pt-1.5 pb-1 text-xs font-medium text-muted-foreground`,children:e.group}),e.items.map((e,t)=>b(e,t))]},t):b(e,t))})})]})}exports.DropdownMenu=c;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-B6R3HKzx.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(0,t.lazy)(()=>Promise.resolve().then(()=>require("./dropdown-menu-panel.cjs")));function i({trigger:i,items:a,side:o=`bottom`,align:s=`start`,className:c,wrapperClassName:l,itemClassName:u,groupLabelClassName:d,separatorClassName:f,ariaLabel:p=`Actions menu`}){let[m,h]=(0,t.useState)(!1),[g,_]=(0,t.useState)(!1),v=(0,t.useRef)(null),y=(0,t.useRef)(null);(0,t.useEffect)(()=>{m&&_(!0)},[m]),(0,t.useEffect)(()=>{function e(e){v.current?.contains(e.target)||h(!1)}return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,t.useEffect)(()=>{m&&y.current?.querySelector(`[role="menuitem"]:not(:disabled)`)?.focus()},[m,g]);function b(){h(!1),v.current?.querySelector(`[aria-haspopup="menu"]`)?.focus()}function x(e){let t=Array.from(y.current?.querySelectorAll(`[role="menuitem"]:not(:disabled)`)??[]),n=t.indexOf(document.activeElement);e.key===`Escape`?(e.preventDefault(),b()):[`ArrowDown`,`ArrowUp`,`Home`,`End`].includes(e.key)&&t.length>0&&(e.preventDefault(),t[e.key===`Home`?0:e.key===`End`?t.length-1:(Math.max(n,0)+(e.key===`ArrowDown`?1:-1)+t.length)%t.length]?.focus())}let S=(0,t.isValidElement)(i)?(0,t.cloneElement)(i,{"aria-haspopup":`menu`,"aria-expanded":m,onClick:e=>{i.props.onClick?.(e),e.defaultPrevented||h(e=>!e)}}):(0,n.jsx)(`button`,{type:`button`,"aria-haspopup":`menu`,"aria-expanded":m,onClick:()=>h(e=>!e),children:i});return(0,n.jsxs)(`div`,{ref:v,className:e.t(`relative inline-flex`,l),children:[S,g&&(0,n.jsx)(t.Suspense,{fallback:null,children:(0,n.jsx)(r,{open:m,menuRef:y,items:a,side:o,align:s,className:c,itemClassName:u,groupLabelClassName:d,separatorClassName:f,ariaLabel:p,onKeyDown:x,onSelect:()=>h(!1)})})]})}exports.DropdownMenu=i;

package/dist/components/dropdown-menu.d.ts

@@ -20,7 +20,11 @@ export interface DropdownMenuProps {
     side?: Side;
     align?: Align;
     className?: string;
+    wrapperClassName?: string;
+    itemClassName?: string;
+    groupLabelClassName?: string;
+    separatorClassName?: string;
     ariaLabel?: string;
 }
-export declare function DropdownMenu({ trigger, items, side, align, className, ariaLabel, }: DropdownMenuProps): import("react").JSX.Element;
+export declare function DropdownMenu({ trigger, items, side, align, className, wrapperClassName, itemClassName, groupLabelClassName, separatorClassName, ariaLabel, }: DropdownMenuProps): import("react").JSX.Element;
 export {};

package/dist/components/dropdown-menu.js

@@ -1,122 +1,67 @@
 "use client";
-import { t as e } from "../cn-DpgY2leY.js";
-import { AnimatePresence as t, motion as n } from "framer-motion";
-import { cloneElement as r, isValidElement as i, useEffect as a, useRef as o, useState as s } from "react";
+import { t as e } from "../cn-BJyZJP-y.js";
+import { Suspense as t, cloneElement as n, isValidElement as r, lazy as i, useEffect as a, useRef as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/dropdown-menu.tsx
-function u(e) {
-	return "items" in e;
-}
-var d = {
-	bottom: "top-full mt-1.5",
-	top: "bottom-full mb-1.5"
-}, f = {
-	start: "left-0",
-	end: "right-0",
-	center: "left-1/2 -translate-x-1/2"
-}, p = {
-	bottom: { y: -4 },
-	top: { y: 4 }
-};
-function m({ trigger: m, items: h, side: g = "bottom", align: _ = "start", className: v, ariaLabel: y = "Actions menu" }) {
-	let [b, x] = s(!1), S = o(null), C = o(null);
+var u = i(() => import("./dropdown-menu-panel.js"));
+function d({ trigger: i, items: d, side: f = "bottom", align: p = "start", className: m, wrapperClassName: h, itemClassName: g, groupLabelClassName: _, separatorClassName: v, ariaLabel: y = "Actions menu" }) {
+	let [b, x] = s(!1), [S, C] = s(!1), w = o(null), T = o(null);
 	a(() => {
+		b && C(!0);
+	}, [b]), a(() => {
 		function e(e) {
-			S.current?.contains(e.target) || x(!1);
+			w.current?.contains(e.target) || x(!1);
 		}
 		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
 	}, []), a(() => {
-		b && C.current?.querySelector("[role=\"menuitem\"]:not(:disabled)")?.focus();
-	}, [b]);
-	function w() {
-		x(!1), S.current?.querySelector("[aria-haspopup=\"menu\"]")?.focus();
+		b && T.current?.querySelector("[role=\"menuitem\"]:not(:disabled)")?.focus();
+	}, [b, S]);
+	function E() {
+		x(!1), w.current?.querySelector("[aria-haspopup=\"menu\"]")?.focus();
 	}
-	function T(e) {
-		let t = Array.from(C.current?.querySelectorAll("[role=\"menuitem\"]:not(:disabled)") ?? []), n = t.indexOf(document.activeElement);
-		e.key === "Escape" ? (e.preventDefault(), w()) : [
+	function D(e) {
+		let t = Array.from(T.current?.querySelectorAll("[role=\"menuitem\"]:not(:disabled)") ?? []), n = t.indexOf(document.activeElement);
+		e.key === "Escape" ? (e.preventDefault(), E()) : [
 			"ArrowDown",
 			"ArrowUp",
 			"Home",
 			"End"
 		].includes(e.key) && t.length > 0 && (e.preventDefault(), t[e.key === "Home" ? 0 : e.key === "End" ? t.length - 1 : (Math.max(n, 0) + (e.key === "ArrowDown" ? 1 : -1) + t.length) % t.length]?.focus());
 	}
-	function E(t, n) {
-		return /* @__PURE__ */ l("button", {
-			type: "button",
-			disabled: t.disabled,
-			role: "menuitem",
-			onClick: () => {
-				t.disabled || (t.onClick?.(), x(!1));
-			},
-			className: e("flex min-h-9 items-center gap-2.5 w-full px-3 py-2 text-sm rounded-md transition-colors text-left focus-visible:outline-none focus-visible:bg-surface-muted", t.destructive ? "text-destructive hover:bg-destructive/10" : "text-foreground hover:bg-surface-muted", t.disabled && "opacity-40 cursor-not-allowed pointer-events-none"),
-			children: [
-				t.icon && /* @__PURE__ */ c("span", {
-					className: e("shrink-0", t.destructive ? "text-red-400" : "text-slate-500 dark:text-slate-400"),
-					children: t.icon
-				}),
-				/* @__PURE__ */ c("span", {
-					className: "flex-1 min-w-0 truncate",
-					children: t.label
-				}),
-				t.shortcut && /* @__PURE__ */ c("span", {
-					className: "text-[10px] text-slate-500 shrink-0 font-mono",
-					children: t.shortcut
-				})
-			]
-		}, n);
-	}
-	let D = i(m) ? r(m, {
+	let O = r(i) ? n(i, {
 		"aria-haspopup": "menu",
 		"aria-expanded": b,
 		onClick: (e) => {
-			m.props.onClick?.(e), e.defaultPrevented || x((e) => !e);
+			i.props.onClick?.(e), e.defaultPrevented || x((e) => !e);
 		}
 	}) : /* @__PURE__ */ c("button", {
 		type: "button",
 		"aria-haspopup": "menu",
 		"aria-expanded": b,
 		onClick: () => x((e) => !e),
-		children: m
+		children: i
 	});
 	return /* @__PURE__ */ l("div", {
-		ref: S,
-		className: "relative inline-flex",
-		children: [D, /* @__PURE__ */ c(t, { children: b && /* @__PURE__ */ c(n.div, {
-			ref: C,
-			role: "menu",
-			"aria-label": y,
-			onKeyDown: T,
-			initial: {
-				opacity: 0,
-				scaleY: .96,
-				...p[g]
-			},
-			animate: {
-				opacity: 1,
-				scaleY: 1,
-				y: 0
-			},
-			exit: {
-				opacity: 0,
-				scaleY: .96,
-				...p[g]
-			},
-			transition: { duration: .13 },
-			style: { originY: g === "bottom" ? 0 : 1 },
-			className: e("absolute z-50 min-w-[180px] rounded-[var(--radius-lg)] border border-border bg-surface-raised shadow-floating", "p-1", d[g], f[_], v),
-			children: h.map((e, t) => u(e) ? /* @__PURE__ */ l("div", { children: [
-				t > 0 && /* @__PURE__ */ c("div", {
-					role: "separator",
-					className: "my-1 border-t border-border"
-				}),
-				e.group && /* @__PURE__ */ c("p", {
-					className: "px-3 pt-1.5 pb-1 text-xs font-medium text-muted-foreground",
-					children: e.group
-				}),
-				e.items.map((e, t) => E(e, t))
-			] }, t) : E(e, t))
-		}) })]
+		ref: w,
+		className: e("relative inline-flex", h),
+		children: [O, S && /* @__PURE__ */ c(t, {
+			fallback: null,
+			children: /* @__PURE__ */ c(u, {
+				open: b,
+				menuRef: T,
+				items: d,
+				side: f,
+				align: p,
+				className: m,
+				itemClassName: g,
+				groupLabelClassName: _,
+				separatorClassName: v,
+				ariaLabel: y,
+				onKeyDown: D,
+				onSelect: () => x(!1)
+			})
+		})]
 	});
 }
 //#endregion
-export { m as DropdownMenu };
+export { d as DropdownMenu };

package/dist/components/empty-state.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-BdjraxxU.cjs");let t=require("react/jsx-runtime");var n={sm:{wrap:`py-6`,icon:`w-5 h-5`,title:`text-sm`,desc:`text-xs`,iconWrap:`w-8 h-8`},md:{wrap:`py-10`,icon:`w-6 h-6`,title:`text-base`,desc:`text-sm`,iconWrap:`w-9 h-9`},lg:{wrap:`py-12`,icon:`w-7 h-7`,title:`text-lg`,desc:`text-sm`,iconWrap:`w-10 h-10`}},r=({className:e})=>(0,t.jsxs)(`svg`,{className:e,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,t.jsx)(`circle`,{cx:`11`,cy:`11`,r:`8`}),(0,t.jsx)(`path`,{d:`m21 21-4.35-4.35`})]});function i({icon:i,title:a,description:o,action:s,className:c,size:l=`md`}){let u=n[l];return(0,t.jsxs)(`div`,{className:e.t(`flex flex-col items-center justify-center text-center px-4`,u.wrap,c),children:[(0,t.jsx)(`div`,{className:e.t(`mb-3 flex items-center justify-center text-muted-foreground`,u.iconWrap),children:i?(0,t.jsx)(`span`,{className:e.t(`inline-flex items-center justify-center text-muted-foreground`,u.icon),children:i}):(0,t.jsx)(r,{className:e.t(`text-muted-foreground`,u.icon)})}),(0,t.jsx)(`p`,{className:e.t(`font-semibold text-foreground`,u.title),children:a}),o&&(0,t.jsx)(`p`,{className:e.t(`mt-1.5 max-w-sm leading-5 text-muted-foreground`,u.desc),children:o}),s&&(0,t.jsx)(`div`,{className:`mt-4`,children:s})]})}exports.EmptyState=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-B6R3HKzx.cjs");let t=require("react/jsx-runtime");var n={sm:{wrap:`py-6`,icon:`w-5 h-5`,title:`text-sm`,desc:`text-xs`,iconWrap:`w-8 h-8`},md:{wrap:`py-10`,icon:`w-6 h-6`,title:`text-base`,desc:`text-sm`,iconWrap:`w-9 h-9`},lg:{wrap:`py-12`,icon:`w-7 h-7`,title:`text-lg`,desc:`text-sm`,iconWrap:`w-10 h-10`}},r=({className:e})=>(0,t.jsxs)(`svg`,{className:e,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,t.jsx)(`circle`,{cx:`11`,cy:`11`,r:`8`}),(0,t.jsx)(`path`,{d:`m21 21-4.35-4.35`})]});function i({icon:i,title:a,description:o,action:s,className:c,size:l=`md`,density:u,variant:d}){let f=u??(d===`compact`?`compact`:`comfortable`),p=n[l],m=f===`compact`?`py-4`:p.wrap;return(0,t.jsxs)(`div`,{className:e.t(`flex flex-col items-center justify-center text-center px-4`,m,c),children:[(0,t.jsx)(`div`,{className:e.t(`mb-3 flex items-center justify-center text-muted-foreground`,p.iconWrap),children:i?(0,t.jsx)(`span`,{className:e.t(`inline-flex items-center justify-center text-muted-foreground`,p.icon),children:i}):(0,t.jsx)(r,{className:e.t(`text-muted-foreground`,p.icon)})}),(0,t.jsx)(`p`,{className:e.t(`font-semibold text-foreground`,p.title),children:a}),o&&(0,t.jsx)(`p`,{className:e.t(`mt-1.5 max-w-sm leading-5 text-muted-foreground`,p.desc),children:o}),s&&(0,t.jsx)(`div`,{className:`mt-4`,children:s})]})}exports.EmptyState=i;

package/dist/components/empty-state.d.ts

@@ -6,5 +6,9 @@ export interface EmptyStateProps {
     action?: ReactNode;
     className?: string;
     size?: "sm" | "md" | "lg";
+    /** Density adjusts vertical padding for tight layouts (tables, cards). */
+    density?: "compact" | "comfortable";
+    /** Optional density alias — density wins if both provided */
+    variant?: "default" | "compact";
 }
-export declare function EmptyState({ icon, title, description, action, className, size, }: EmptyStateProps): import("react").JSX.Element;
+export declare function EmptyState({ icon, title, description, action, className, size, density, variant, }: EmptyStateProps): import("react").JSX.Element;

package/dist/components/empty-state.js

@@ -1,4 +1,4 @@
-import { t as e } from "../cn-DpgY2leY.js";
+import { t as e } from "../cn-BJyZJP-y.js";
 import { jsx as t, jsxs as n } from "react/jsx-runtime";
 //#region src/components/empty-state.tsx
 var r = {
@@ -37,24 +37,24 @@ var r = {
 		r: "8"
 	}), /* @__PURE__ */ t("path", { d: "m21 21-4.35-4.35" })]
 });
-function a({ icon: a, title: o, description: s, action: c, className: l, size: u = "md" }) {
-	let d = r[u];
+function a({ icon: a, title: o, description: s, action: c, className: l, size: u = "md", density: d, variant: f }) {
+	let p = d ?? (f === "compact" ? "compact" : "comfortable"), m = r[u], h = p === "compact" ? "py-4" : m.wrap;
 	return /* @__PURE__ */ n("div", {
-		className: e("flex flex-col items-center justify-center text-center px-4", d.wrap, l),
+		className: e("flex flex-col items-center justify-center text-center px-4", h, l),
 		children: [
 			/* @__PURE__ */ t("div", {
-				className: e("mb-3 flex items-center justify-center text-muted-foreground", d.iconWrap),
+				className: e("mb-3 flex items-center justify-center text-muted-foreground", m.iconWrap),
 				children: a ? /* @__PURE__ */ t("span", {
-					className: e("inline-flex items-center justify-center text-muted-foreground", d.icon),
+					className: e("inline-flex items-center justify-center text-muted-foreground", m.icon),
 					children: a
-				}) : /* @__PURE__ */ t(i, { className: e("text-muted-foreground", d.icon) })
+				}) : /* @__PURE__ */ t(i, { className: e("text-muted-foreground", m.icon) })
 			}),
 			/* @__PURE__ */ t("p", {
-				className: e("font-semibold text-foreground", d.title),
+				className: e("font-semibold text-foreground", m.title),
 				children: o
 			}),
 			s && /* @__PURE__ */ t("p", {
-				className: e("mt-1.5 max-w-sm leading-5 text-muted-foreground", d.desc),
+				className: e("mt-1.5 max-w-sm leading-5 text-muted-foreground", m.desc),
 				children: s
 			}),
 			c && /* @__PURE__ */ t("div", {

package/dist/components/error-state.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-BdjraxxU.cjs"),t=require("./button.cjs");let n=require("react/jsx-runtime");function r({title:r=`Something went wrong`,description:i=`An unexpected error occurred. Please try again.`,error:a,onRetry:o,action:s,className:c}){let l=a instanceof Error?a.message:a;return(0,n.jsxs)(`div`,{role:`alert`,className:e.t(`flex flex-col items-center justify-center text-center px-4 py-10`,c),children:[(0,n.jsx)(`div`,{className:`mb-3 flex size-9 items-center justify-center text-destructive`,children:(0,n.jsxs)(`svg`,{"aria-hidden":`true`,width:`22`,height:`22`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.75`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,n.jsx)(`circle`,{cx:`12`,cy:`12`,r:`10`}),(0,n.jsx)(`line`,{x1:`12`,y1:`8`,x2:`12`,y2:`12`}),(0,n.jsx)(`line`,{x1:`12`,y1:`16`,x2:`12.01`,y2:`16`})]})}),(0,n.jsx)(`p`,{className:`text-base font-semibold text-foreground`,children:r}),(0,n.jsx)(`p`,{className:`mt-1.5 max-w-sm text-sm leading-5 text-muted-foreground`,children:i}),l&&(0,n.jsx)(`p`,{className:`mt-3 max-w-sm break-all rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 font-mono text-xs text-destructive`,children:l}),(o||s)&&(0,n.jsxs)(`div`,{className:`mt-5 flex items-center gap-3`,children:[o&&(0,n.jsx)(t.Button,{variant:`outline`,size:`sm`,onClick:o,icon:(0,n.jsxs)(`svg`,{width:`13`,height:`13`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,n.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,n.jsx)(`path`,{d:`M3 3v5h5`})]}),children:`Try again`}),s]})]})}exports.ErrorState=r;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-B6R3HKzx.cjs"),t=require("./button.cjs");let n=require("react/jsx-runtime");function r({title:r=`This didn't load`,description:i=`The request didn't finish. Try again — if it keeps failing, the problem is on our end, not yours.`,error:a,onRetry:o,action:s,className:c}){let l=a instanceof Error?a.message:a;return(0,n.jsxs)(`div`,{role:`alert`,className:e.t(`flex flex-col items-center justify-center text-center px-4 py-10`,c),children:[(0,n.jsx)(`div`,{className:`mb-3 flex size-9 items-center justify-center text-destructive`,children:(0,n.jsxs)(`svg`,{"aria-hidden":`true`,width:`22`,height:`22`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.75`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,n.jsx)(`circle`,{cx:`12`,cy:`12`,r:`10`}),(0,n.jsx)(`line`,{x1:`12`,y1:`8`,x2:`12`,y2:`12`}),(0,n.jsx)(`line`,{x1:`12`,y1:`16`,x2:`12.01`,y2:`16`})]})}),(0,n.jsx)(`p`,{className:`text-base font-semibold text-foreground`,children:r}),(0,n.jsx)(`p`,{className:`mt-1.5 max-w-sm text-sm leading-5 text-muted-foreground`,children:i}),l&&(0,n.jsx)(`p`,{className:`mt-3 max-w-sm break-all rounded-md border border-destructive/20 bg-destructive/5 px-3 py-2 font-mono text-xs text-destructive`,children:l}),(o||s)&&(0,n.jsxs)(`div`,{className:`mt-5 flex items-center gap-3`,children:[o&&(0,n.jsx)(t.Button,{variant:`outline`,size:`sm`,onClick:o,icon:(0,n.jsxs)(`svg`,{width:`13`,height:`13`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,n.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,n.jsx)(`path`,{d:`M3 3v5h5`})]}),children:`Try again`}),s]})]})}exports.ErrorState=r;

package/dist/components/error-state.js

@@ -1,8 +1,8 @@
-import { t as e } from "../cn-DpgY2leY.js";
+import { t as e } from "../cn-BJyZJP-y.js";
 import { Button as t } from "./button.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/error-state.tsx
-function i({ title: i = "Something went wrong", description: a = "An unexpected error occurred. Please try again.", error: o, onRetry: s, action: c, className: l }) {
+function i({ title: i = "This didn't load", description: a = "The request didn't finish. Try again — if it keeps failing, the problem is on our end, not yours.", error: o, onRetry: s, action: c, className: l }) {
 	let u = o instanceof Error ? o.message : o;
 	return /* @__PURE__ */ r("div", {
 		role: "alert",

package/dist/components/file-upload.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-BdjraxxU.cjs"),t=require("../component-styles-DOUctc8_.cjs");let n=require("framer-motion"),r=require("react"),i=require("react/jsx-runtime");var a=(0,r.forwardRef)(({className:a,label:o,hint:s,error:c,accept:l,maxSizeMB:u,onFilesChange:d,disabled:f,multiple:p,id:m,...h},g)=>{let[_,v]=(0,r.useState)(!1),[y,b]=(0,r.useState)([]),[x,S]=(0,r.useState)(``),C=(0,r.useRef)(null),w=(0,r.useId)(),T=m??w,E=`${T}-message`,D=u&&(u>=1024?`${u/1024}GB`:`${u}MB`);function O(e){if(!e)return;let t=Array.from(e);if(u){let e=t.find(e=>e.size>u*1024*1024);if(e){S(`${e.name} exceeds ${D}`);return}}S(``);let n=p?[...y,...t]:t;b(n),d?.(n)}function k(e){let t=y.filter((t,n)=>n!==e);b(t),d?.(t)}function A(e){e.preventDefault(),v(!1),!f&&O(e.dataTransfer.files)}let j=c??x;return(0,i.jsxs)(`div`,{className:e.t(t.o,a),children:[o&&(0,i.jsx)(`label`,{htmlFor:T,className:`text-xs font-semibold leading-5 text-foreground`,children:o}),(0,i.jsxs)(`label`,{htmlFor:T,onDragOver:e=>{e.preventDefault(),f||v(!0)},onDragLeave:()=>v(!1),onDrop:A,className:e.t(`relative flex flex-col items-center justify-center gap-2 rounded-[var(--radius-lg)] border border-dashed px-4 py-7 text-center cursor-pointer transition-colors focus-within:ring-2 focus-within:ring-focus-ring/25`,_?`border-accent-500/60 bg-accent-500/6`:j?`border-red-500/40 bg-red-500/4`:`border-border-strong bg-surface-muted/50 hover:border-accent-500/60 hover:bg-muted`,f&&`opacity-50 cursor-not-allowed pointer-events-none`),children:[(0,i.jsx)(`input`,{ref:e=>{C.current=e,typeof g==`function`?g(e):g&&(g.current=e)},type:`file`,id:T,accept:l,multiple:p,disabled:f,"aria-invalid":j?!0:void 0,"aria-describedby":j||s?E:void 0,className:`sr-only`,onChange:e=>O(e.target.files),...h}),(0,i.jsxs)(`svg`,{width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`,className:`text-muted-foreground`,children:[(0,i.jsx)(`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`}),(0,i.jsx)(`polyline`,{points:`17 8 12 3 7 8`}),(0,i.jsx)(`line`,{x1:`12`,y1:`3`,x2:`12`,y2:`15`})]}),(0,i.jsxs)(`div`,{children:[(0,i.jsxs)(`p`,{className:`text-sm font-medium text-foreground`,children:[`Drop files here or `,(0,i.jsx)(`span`,{className:`text-accent-700 dark:text-accent-300`,children:`browse`})]}),(l||u)&&(0,i.jsx)(`p`,{className:`mt-0.5 text-xs text-muted-foreground`,children:[l&&`Accepts ${l}`,D&&`Max ${D}`].filter(Boolean).join(` · `)})]})]}),(0,i.jsx)(n.AnimatePresence,{initial:!1,children:y.length>0&&(0,i.jsx)(n.motion.ul,{initial:{opacity:0,height:0},animate:{opacity:1,height:`auto`},exit:{opacity:0,height:0},className:`flex flex-col gap-1 overflow-hidden`,children:y.map((t,n)=>(0,i.jsxs)(`li`,{className:`flex items-center gap-2 rounded-[var(--radius-md)] border border-border bg-surface-muted px-3 py-2`,children:[(0,i.jsxs)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,className:`text-slate-400 shrink-0`,children:[(0,i.jsx)(`path`,{d:`M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z`}),(0,i.jsx)(`polyline`,{points:`14 2 14 8 20 8`})]}),(0,i.jsx)(`span`,{className:`min-w-0 flex-1 truncate text-xs text-foreground`,children:t.name}),(0,i.jsxs)(`span`,{className:`shrink-0 text-[10px] text-muted-foreground`,children:[(t.size/1024).toFixed(0),`KB`]}),(0,i.jsx)(`button`,{type:`button`,onClick:()=>k(n),"aria-label":`Remove ${t.name}`,className:e.t(`shrink-0 rounded-sm text-muted-foreground hover:text-destructive transition-colors`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring/35 focus-visible:ring-offset-2 focus-visible:ring-offset-bg`),children:(0,i.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:(0,i.jsx)(`path`,{d:`M18 6 6 18M6 6l12 12`})})})]},`${t.name}-${n}`))})}),j&&(0,i.jsx)(`p`,{id:E,"aria-live":`polite`,className:`text-xs leading-5 text-destructive`,children:j}),s&&!j&&(0,i.jsx)(`p`,{id:E,className:`text-xs leading-5 text-muted-foreground`,children:s})]})});a.displayName=`FileUpload`,exports.FileUpload=a;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-B6R3HKzx.cjs"),t=require("../component-styles-DY4wigiq.cjs");let n=require("framer-motion"),r=require("react"),i=require("react/jsx-runtime");var a=(0,r.forwardRef)(({className:a,label:o,hint:s,error:c,accept:l,maxSizeMB:u,onFilesChange:d,disabled:f,multiple:p,id:m,...h},g)=>{let[_,v]=(0,r.useState)(!1),[y,b]=(0,r.useState)([]),[x,S]=(0,r.useState)(``),C=(0,r.useRef)(null),w=(0,r.useId)(),T=m??w,E=`${T}-message`,D=u&&(u>=1024?`${u/1024}GB`:`${u}MB`);function O(e){if(!e)return;let t=Array.from(e);if(u){let e=t.find(e=>e.size>u*1024*1024);if(e){S(`${e.name} exceeds ${D}`);return}}S(``);let n=p?[...y,...t]:t;b(n),d?.(n)}function k(e){let t=y.filter((t,n)=>n!==e);b(t),d?.(t)}function A(e){e.preventDefault(),v(!1),!f&&O(e.dataTransfer.files)}let j=c??x;return(0,i.jsxs)(`div`,{className:e.t(t.o,a),children:[o&&(0,i.jsx)(`label`,{htmlFor:T,className:`text-xs font-semibold leading-5 text-foreground`,children:o}),(0,i.jsxs)(`label`,{htmlFor:T,onDragOver:e=>{e.preventDefault(),f||v(!0)},onDragLeave:()=>v(!1),onDrop:A,className:e.t(`relative flex flex-col items-center justify-center gap-2 rounded-[var(--radius-lg)] border border-dashed px-4 py-7 text-center cursor-pointer transition-colors focus-within:ring-[3px] focus-within:ring-focus-ring/25`,_?`border-accent-500/60 bg-accent-500/6`:j?`border-red-500/40 bg-red-500/4`:`border-border-strong bg-surface-muted/50 hover:border-accent-500/60 hover:bg-muted`,f&&`opacity-50 cursor-not-allowed pointer-events-none`),children:[(0,i.jsx)(`input`,{ref:e=>{C.current=e,typeof g==`function`?g(e):g&&(g.current=e)},type:`file`,id:T,accept:l,multiple:p,disabled:f,"aria-invalid":j?!0:void 0,"aria-describedby":j||s?E:void 0,className:`sr-only`,onChange:e=>O(e.target.files),...h}),(0,i.jsxs)(`svg`,{width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`,className:`text-muted-foreground`,children:[(0,i.jsx)(`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`}),(0,i.jsx)(`polyline`,{points:`17 8 12 3 7 8`}),(0,i.jsx)(`line`,{x1:`12`,y1:`3`,x2:`12`,y2:`15`})]}),(0,i.jsxs)(`div`,{children:[(0,i.jsxs)(`p`,{className:`text-sm font-medium text-foreground`,children:[`Drop files here or `,(0,i.jsx)(`span`,{className:`text-accent-700 dark:text-accent-300`,children:`browse`})]}),(l||u)&&(0,i.jsx)(`p`,{className:`mt-0.5 text-xs text-muted-foreground`,children:[l&&`Accepts ${l}`,D&&`Max ${D}`].filter(Boolean).join(` · `)})]})]}),(0,i.jsx)(n.AnimatePresence,{initial:!1,children:y.length>0&&(0,i.jsx)(n.motion.ul,{initial:{opacity:0,height:0},animate:{opacity:1,height:`auto`},exit:{opacity:0,height:0},className:`flex flex-col gap-1 overflow-hidden`,children:y.map((t,n)=>(0,i.jsxs)(`li`,{className:`flex items-center gap-2 rounded-[var(--radius-md)] border border-border bg-surface-muted px-3 py-2`,children:[(0,i.jsxs)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,className:`text-slate-400 shrink-0`,children:[(0,i.jsx)(`path`,{d:`M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z`}),(0,i.jsx)(`polyline`,{points:`14 2 14 8 20 8`})]}),(0,i.jsx)(`span`,{className:`min-w-0 flex-1 truncate text-xs text-foreground`,children:t.name}),(0,i.jsxs)(`span`,{className:`shrink-0 text-[10px] text-muted-foreground`,children:[(t.size/1024).toFixed(0),`KB`]}),(0,i.jsx)(`button`,{type:`button`,onClick:()=>k(n),"aria-label":`Remove ${t.name}`,className:e.t(`shrink-0 rounded-sm text-muted-foreground hover:text-destructive transition-colors`,`focus-ring`),children:(0,i.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2.5`,strokeLinecap:`round`,strokeLinejoin:`round`,children:(0,i.jsx)(`path`,{d:`M18 6 6 18M6 6l12 12`})})})]},`${t.name}-${n}`))})}),j&&(0,i.jsx)(`p`,{id:E,"aria-live":`polite`,className:`text-xs leading-5 text-destructive`,children:j}),s&&!j&&(0,i.jsx)(`p`,{id:E,className:`text-xs leading-5 text-muted-foreground`,children:s})]})});a.displayName=`FileUpload`,exports.FileUpload=a;

package/dist/components/file-upload.js

@@ -1,6 +1,6 @@
 "use client";
-import { t as e } from "../cn-DpgY2leY.js";
-import { o as t } from "../component-styles-Bgy44fc8.js";
+import { t as e } from "../cn-BJyZJP-y.js";
+import { o as t } from "../component-styles-C2CbHEEA.js";
 import { AnimatePresence as n, motion as r } from "framer-motion";
 import { forwardRef as i, useId as a, useRef as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
@@ -44,7 +44,7 @@ var u = i(({ className: i, label: u, hint: d, error: f, accept: p, maxSizeMB: m,
 				},
 				onDragLeave: () => S(!1),
 				onDrop: P,
-				className: e("relative flex flex-col items-center justify-center gap-2 rounded-[var(--radius-lg)] border border-dashed px-4 py-7 text-center cursor-pointer transition-colors focus-within:ring-2 focus-within:ring-focus-ring/25", x ? "border-accent-500/60 bg-accent-500/6" : F ? "border-red-500/40 bg-red-500/4" : "border-border-strong bg-surface-muted/50 hover:border-accent-500/60 hover:bg-muted", g && "opacity-50 cursor-not-allowed pointer-events-none"),
+				className: e("relative flex flex-col items-center justify-center gap-2 rounded-[var(--radius-lg)] border border-dashed px-4 py-7 text-center cursor-pointer transition-colors focus-within:ring-[3px] focus-within:ring-focus-ring/25", x ? "border-accent-500/60 bg-accent-500/6" : F ? "border-red-500/40 bg-red-500/4" : "border-border-strong bg-surface-muted/50 hover:border-accent-500/60 hover:bg-muted", g && "opacity-50 cursor-not-allowed pointer-events-none"),
 				children: [
 					/* @__PURE__ */ c("input", {
 						ref: (e) => {
@@ -137,7 +137,7 @@ var u = i(({ className: i, label: u, hint: d, error: f, accept: p, maxSizeMB: m,
 								type: "button",
 								onClick: () => N(n),
 								"aria-label": `Remove ${t.name}`,
-								className: e("shrink-0 rounded-sm text-muted-foreground hover:text-destructive transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring/35 focus-visible:ring-offset-2 focus-visible:ring-offset-bg"),
+								className: e("shrink-0 rounded-sm text-muted-foreground hover:text-destructive transition-colors", "focus-ring"),
 								children: /* @__PURE__ */ c("svg", {
 									width: "12",
 									height: "12",

package/dist/components/form-field.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-BdjraxxU.cjs"),t=require("../component-styles-DOUctc8_.cjs");let n=require("react/jsx-runtime");function r({label:r,hint:i,error:a,required:o,htmlFor:s,className:c,children:l,...u}){return(0,n.jsxs)(`div`,{className:e.t(t.o,c),...u,children:[r&&(0,n.jsxs)(`label`,{htmlFor:s,className:e.t(`flex items-center gap-1`,`text-xs font-semibold leading-5 text-foreground`),children:[r,o&&(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`span`,{"aria-hidden":`true`,className:`text-destructive`,children:`*`}),(0,n.jsx)(`span`,{className:`sr-only`,children:` (required)`})]})]}),l,a&&(0,n.jsx)(`p`,{"aria-live":`polite`,className:`text-xs leading-5 text-destructive`,children:a}),i&&!a&&(0,n.jsx)(`p`,{className:`text-xs leading-5 text-muted-foreground`,children:i})]})}exports.FormField=r;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../cn-B6R3HKzx.cjs"),t=require("../component-styles-DY4wigiq.cjs");let n=require("react/jsx-runtime");function r({label:r,hint:i,error:a,required:o,htmlFor:s,className:c,children:l,...u}){return(0,n.jsxs)(`div`,{className:e.t(t.o,c),...u,children:[r&&(0,n.jsxs)(`label`,{htmlFor:s,className:e.t(`flex items-center gap-1`,`text-xs font-semibold leading-5 text-foreground`),children:[r,o&&(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`span`,{"aria-hidden":`true`,className:`text-destructive`,children:`*`}),(0,n.jsx)(`span`,{className:`sr-only`,children:` (required)`})]})]}),l,a&&(0,n.jsx)(`p`,{"aria-live":`polite`,className:`text-xs leading-5 text-destructive`,children:a}),i&&!a&&(0,n.jsx)(`p`,{className:`text-xs leading-5 text-muted-foreground`,children:i})]})}var i=r;function a({className:r,children:i,required:a,htmlFor:o,...s}){return(0,n.jsxs)(`label`,{htmlFor:o,className:e.t(`flex items-center gap-1`,t.a,r),...s,children:[i,a&&(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`span`,{"aria-hidden":`true`,className:`text-destructive`,children:` *`}),(0,n.jsx)(`span`,{className:`sr-only`,children:` (required)`})]})]})}function o({className:r,...i}){return(0,n.jsx)(`p`,{className:e.t(t.r,r),...i})}function s({className:r,...i}){return(0,n.jsx)(`p`,{"aria-live":`polite`,className:e.t(t.i,r),...i})}function c({className:t,...r}){return(0,n.jsx)(`div`,{className:e.t(`flex flex-col gap-1.5`,t),...r})}exports.Field=i,exports.FieldContent=c,exports.FieldDescription=o,exports.FieldError=s,exports.FieldLabel=a,exports.FormField=r;

package/dist/components/form-field.d.ts

@@ -8,3 +8,12 @@ export interface FormFieldProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
 }
 export declare function FormField({ label, hint, error, required, htmlFor, className, children, ...props }: FormFieldProps): import("react").JSX.Element;
+export declare const Field: typeof FormField;
+export type FieldProps = FormFieldProps;
+export declare function FieldLabel({ className, children, required, htmlFor, ...props }: HTMLAttributes<HTMLLabelElement> & {
+    required?: boolean;
+    htmlFor?: string;
+}): import("react").JSX.Element;
+export declare function FieldDescription({ className, ...props }: HTMLAttributes<HTMLParagraphElement>): import("react").JSX.Element;
+export declare function FieldError({ className, ...props }: HTMLAttributes<HTMLParagraphElement>): import("react").JSX.Element;
+export declare function FieldContent({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;