@nocoo/basalt 2.0.3 → 2.1.2

package/dist/components/dropdown-menu.js

@@ -5,12 +5,15 @@ import * as r from "react";
 import { jsx as i } from "react/jsx-runtime";
 import * as a from "@radix-ui/react-dropdown-menu";
 //#region src/components/dropdown-menu.tsx
-var o = a.Root, s = a.Trigger, c = a.Group, l = a.Portal, u = a.Sub, d = a.RadioGroup, f = r.forwardRef(({ className: t, sideOffset: r = 8, ...o }, s) => /* @__PURE__ */ i(a.Portal, { children: /* @__PURE__ */ i(a.Content, {
-	ref: s,
-	sideOffset: r,
-	className: n(e("min-w-40", t)),
-	...o
-}) }));
+var o = a.Root, s = a.Trigger, c = a.Group, l = a.Portal, u = a.Sub, d = a.RadioGroup, f = r.forwardRef(({ className: t, sideOffset: r = 8, ...o }, s) => /* @__PURE__ */ i(a.Portal, {
+	forceMount: o.forceMount,
+	children: /* @__PURE__ */ i(a.Content, {
+		ref: s,
+		sideOffset: r,
+		className: n(e("min-w-40", t)),
+		...o
+	})
+}));
 f.displayName = a.Content.displayName;
 var p = r.forwardRef(({ className: n, ...r }, o) => /* @__PURE__ */ i(a.Item, {
 	ref: o,

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { MENU_GAP, overlayItemClass, overlayPanelClass } from \"./overlay\";\n\nexport type DropdownMenuProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>,\n\t\"open\" | \"defaultOpen\" | \"onOpenChange\"\n> & {\n\t/**\n\t * The controlled open state.\n\t */\n\topen?: boolean;\n\t/**\n\t * The uncontrolled initial open state.\n\t * @default false\n\t */\n\tdefaultOpen?: boolean;\n\t/**\n\t * Called when the open state changes.\n\t */\n\tonOpenChange?: (open: boolean) => void;\n};\nexport const DropdownMenu: React.FC<DropdownMenuProps> = DropdownMenuPrimitive.Root;\nexport const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\nexport const DropdownMenuGroup = DropdownMenuPrimitive.Group;\nexport const DropdownMenuPortal = DropdownMenuPrimitive.Portal;\nexport const DropdownMenuSub = DropdownMenuPrimitive.Sub;\nexport const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nexport const DropdownMenuContent = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Content>,\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = MENU_GAP, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={overlayPanelClass(cn(\"min-w-40\", className))}\n\t\t\t{...props}\n\t\t/>\n\t</DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\nexport type DropdownMenuItemProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item>,\n\t\"disabled\"\n> & {\n\t/**\n\t * Disable the menu item.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const DropdownMenuItem = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Item>,\n\tDropdownMenuItemProps\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={overlayItemClass(\n\t\t\tcn(\n\t\t\t\t\"relative outline-hidden focus:bg-basalt-accent data-disabled:pointer-events-none data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n"],"mappings":";;;;;;;AAuBA,IAAa,IAA4C,EAAsB,MAClE,IAAsB,EAAsB,SAC5C,IAAoB,EAAsB,OAC1C,IAAqB,EAAsB,QAC3C,IAAkB,EAAsB,KACxC,IAAyB,EAAsB,YAE/C,IAAsB,EAAM,YAGtC,EAAE,cAAW,gBAAA,GAAuB,GAAG,KAAS,MAClD,kBAAC,EAAsB,QAAvB,EAAA,UACC,kBAAC,EAAsB,SAAvB;CACM;CACO;CACZ,WAAW,EAAkB,EAAG,YAAY,CAAS,CAAC;CACtD,GAAI;AACJ,CAAA,EAC4B,CAAA,CAC9B;AACD,EAAoB,cAAc,EAAsB,QAAQ;AAahE,IAAa,IAAmB,EAAM,YAGnC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAsB,MAAvB;CACM;CACL,WAAW,EACV,EACC,6GACA,CACD,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAiB,cAAc,EAAsB,KAAK"}
+{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { MENU_GAP, overlayItemClass, overlayPanelClass } from \"./overlay\";\n\ntype RadixDropdownMenuProps = React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>;\ntype RadixDropdownMenuTriggerProps = React.ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.Trigger\n>;\ntype RadixDropdownMenuGroupProps = React.ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.Group\n>;\ntype RadixDropdownMenuPortalProps = React.ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.Portal\n>;\ntype RadixDropdownMenuSubProps = React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Sub>;\ntype RadixDropdownMenuRadioGroupProps = React.ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioGroup\n>;\ntype RadixDropdownMenuContentProps = React.ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.Content\n>;\ntype RadixDropdownMenuItemProps = React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item>;\n\nexport interface DropdownMenuProps\n\textends Omit<\n\t\tRadixDropdownMenuProps,\n\t\t\"open\" | \"defaultOpen\" | \"onOpenChange\" | \"dir\" | \"modal\" | \"children\"\n\t> {\n\t/**\n\t * Structure elements comprising the dropdown menu, typically trigger and content.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * The controlled open state of the dropdown menu.\n\t */\n\topen?: RadixDropdownMenuProps[\"open\"];\n\t/**\n\t * The uncontrolled initial open state of the dropdown menu.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDropdownMenuProps[\"defaultOpen\"];\n\t/**\n\t * Called when the open state changes.\n\t */\n\tonOpenChange?: RadixDropdownMenuProps[\"onOpenChange\"];\n\t/**\n\t * The reading direction of the dropdown menu. Inherited from DirectionProvider if present,\n\t * or defaults to \"ltr\".\n\t * @default \"ltr\"\n\t */\n\tdir?: RadixDropdownMenuProps[\"dir\"];\n\t/**\n\t * The modality of the dropdown menu. When set to true, interaction with outside elements\n\t * will be disabled and only menu content will be visible to screen readers.\n\t * @default true\n\t */\n\tmodal?: RadixDropdownMenuProps[\"modal\"];\n}\n\nexport const DropdownMenu: React.FC<DropdownMenuProps> = DropdownMenuPrimitive.Root;\n\nexport interface DropdownMenuTriggerProps\n\textends Omit<RadixDropdownMenuTriggerProps, \"asChild\" | \"children\"> {\n\t/**\n\t * Trigger element content.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * DropdownMenuTrigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDropdownMenuTriggerProps[\"asChild\"];\n}\n\nexport const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nexport interface DropdownMenuGroupProps\n\textends Omit<RadixDropdownMenuGroupProps, \"asChild\" | \"children\"> {\n\t/**\n\t * Menu items or elements grouped together.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * DropdownMenuGroup forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDropdownMenuGroupProps[\"asChild\"];\n}\n\nexport const DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nexport interface DropdownMenuPortalProps\n\textends Omit<RadixDropdownMenuPortalProps, \"container\" | \"forceMount\" | \"children\"> {\n\t/**\n\t * Content to render into the portal target.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Specify a container element to portal the content into.\n\t * Note: Only controls direct portal children; does not override the destination\n\t * container of the built-in portal inside DropdownMenuContent.\n\t */\n\tcontainer?: RadixDropdownMenuPortalProps[\"container\"];\n\t/**\n\t * Used to force mounting when more control is needed. Useful when\n\t * controlling animation with React animation libraries.\n\t */\n\tforceMount?: RadixDropdownMenuPortalProps[\"forceMount\"];\n}\n\nexport const DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nexport interface DropdownMenuSubProps\n\textends Omit<RadixDropdownMenuSubProps, \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"children\"> {\n\t/**\n\t * Submenu structure elements.\n\t * Note: Basalt does not export styled DropdownMenuSubTrigger or DropdownMenuSubContent components;\n\t * compose with underlying Radix primitives when building nested submenus.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * The controlled open state of the submenu.\n\t */\n\topen?: RadixDropdownMenuSubProps[\"open\"];\n\t/**\n\t * The uncontrolled initial open state of the submenu.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDropdownMenuSubProps[\"defaultOpen\"];\n\t/**\n\t * Event handler called when the open state of the submenu changes.\n\t */\n\tonOpenChange?: RadixDropdownMenuSubProps[\"onOpenChange\"];\n}\n\nexport const DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nexport interface DropdownMenuRadioGroupProps\n\textends Omit<\n\t\tRadixDropdownMenuRadioGroupProps,\n\t\t\"value\" | \"onValueChange\" | \"asChild\" | \"children\"\n\t> {\n\t/**\n\t * Radio item elements grouped together.\n\t * Note: Basalt does not export styled DropdownMenuRadioItem or indicator components;\n\t * compose with underlying Radix primitives when building radio selection groups.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * The value of the currently selected radio item.\n\t */\n\tvalue?: RadixDropdownMenuRadioGroupProps[\"value\"];\n\t/**\n\t * Event handler called when the value changes.\n\t */\n\tonValueChange?: RadixDropdownMenuRadioGroupProps[\"onValueChange\"];\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * DropdownMenuRadioGroup forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDropdownMenuRadioGroupProps[\"asChild\"];\n}\n\nexport const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nexport interface DropdownMenuContentProps\n\textends Omit<\n\t\tRadixDropdownMenuContentProps,\n\t\t| \"side\"\n\t\t| \"sideOffset\"\n\t\t| \"align\"\n\t\t| \"alignOffset\"\n\t\t| \"avoidCollisions\"\n\t\t| \"collisionBoundary\"\n\t\t| \"collisionPadding\"\n\t\t| \"arrowPadding\"\n\t\t| \"sticky\"\n\t\t| \"hideWhenDetached\"\n\t\t| \"updatePositionStrategy\"\n\t\t| \"loop\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t\t| \"forceMount\"\n\t\t| \"asChild\"\n\t> {\n\t/**\n\t * Preferred placement side relative to trigger.\n\t * @default \"bottom\"\n\t */\n\tside?: RadixDropdownMenuContentProps[\"side\"];\n\t/**\n\t * Distance in pixels between trigger and floating content panel.\n\t * In Basalt, defaults to MENU_GAP (8).\n\t * @default 8\n\t */\n\tsideOffset?: RadixDropdownMenuContentProps[\"sideOffset\"];\n\t/**\n\t * Preferred alignment along the side axis.\n\t * @default \"center\"\n\t */\n\talign?: RadixDropdownMenuContentProps[\"align\"];\n\t/**\n\t * Offset in pixels from the start or end alignment position.\n\t * @default 0\n\t */\n\talignOffset?: RadixDropdownMenuContentProps[\"alignOffset\"];\n\t/**\n\t * Whether to reposition content to avoid viewport boundary collisions.\n\t * @default true\n\t */\n\tavoidCollisions?: RadixDropdownMenuContentProps[\"avoidCollisions\"];\n\t/**\n\t * Element or elements bounding boundary collision calculations.\n\t * @default []\n\t */\n\tcollisionBoundary?: RadixDropdownMenuContentProps[\"collisionBoundary\"];\n\t/**\n\t * Virtual padding from collision boundaries in pixels.\n\t * @default 0\n\t */\n\tcollisionPadding?: RadixDropdownMenuContentProps[\"collisionPadding\"];\n\t/**\n\t * Padding in pixels between popper arrow and floating panel edge.\n\t * @default 0\n\t */\n\tarrowPadding?: RadixDropdownMenuContentProps[\"arrowPadding\"];\n\t/**\n\t * Sticky positioning behavior along the align axis when overflowing.\n\t * @default \"partial\"\n\t */\n\tsticky?: RadixDropdownMenuContentProps[\"sticky\"];\n\t/**\n\t * Whether to hide content completely when trigger is fully occluded.\n\t * @default false\n\t */\n\thideWhenDetached?: RadixDropdownMenuContentProps[\"hideWhenDetached\"];\n\t/**\n\t * Strategy used to calculate and update popper position.\n\t * @default \"optimized\"\n\t */\n\tupdatePositionStrategy?: RadixDropdownMenuContentProps[\"updatePositionStrategy\"];\n\t/**\n\t * Whether keyboard navigation should loop around item boundaries.\n\t * @default false\n\t */\n\tloop?: RadixDropdownMenuContentProps[\"loop\"];\n\t/**\n\t * Callback fired when auto-focusing on close. Can be prevented.\n\t */\n\tonCloseAutoFocus?: RadixDropdownMenuContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Callback fired when the Escape key is down on the content layer. Can be prevented.\n\t */\n\tonEscapeKeyDown?: RadixDropdownMenuContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Callback fired when a pointerdown event happens outside the bounds of the content. Can be prevented.\n\t */\n\tonPointerDownOutside?: RadixDropdownMenuContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Callback fired when focus moves outside the bounds of the content. Can be prevented.\n\t */\n\tonFocusOutside?: RadixDropdownMenuContentProps[\"onFocusOutside\"];\n\t/**\n\t * Callback fired when an interaction (pointerdown or focus) happens outside the bounds of the content. Can be prevented.\n\t */\n\tonInteractOutside?: RadixDropdownMenuContentProps[\"onInteractOutside\"];\n\t/**\n\t * Force mounting content in DOM for external animation controls.\n\t * When forceMount is true, the content remains mounted even when closed.\n\t * The caller is responsible for visibility transitions and unmounting after animation completes.\n\t * Note: Keeping modal content forceMounted may isolate background interactions until unmounted.\n\t */\n\tforceMount?: true;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * DropdownMenuContent forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDropdownMenuContentProps[\"asChild\"];\n}\n\nexport const DropdownMenuContent = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, sideOffset = MENU_GAP, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Portal forceMount={props.forceMount}>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={overlayPanelClass(cn(\"min-w-40\", className))}\n\t\t\t{...props}\n\t\t/>\n\t</DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\nexport interface DropdownMenuItemProps\n\textends Omit<RadixDropdownMenuItemProps, \"disabled\" | \"onSelect\" | \"textValue\" | \"asChild\"> {\n\t/**\n\t * Disable the menu item.\n\t * @default false\n\t */\n\tdisabled?: RadixDropdownMenuItemProps[\"disabled\"];\n\t/**\n\t * Event handler called when the menu item is selected (via click or keyboard).\n\t * Note that this is a Radix CustomEvent, not native DOM onSelect.\n\t */\n\tonSelect?: RadixDropdownMenuItemProps[\"onSelect\"];\n\t/**\n\t * Optional text used for typeahead navigation. By default typeahead uses item text content.\n\t */\n\ttextValue?: RadixDropdownMenuItemProps[\"textValue\"];\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * DropdownMenuItem forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDropdownMenuItemProps[\"asChild\"];\n}\n\nexport const DropdownMenuItem = React.forwardRef<\n\tReact.ElementRef<typeof DropdownMenuPrimitive.Item>,\n\tDropdownMenuItemProps\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={overlayItemClass(\n\t\t\tcn(\n\t\t\t\t\"relative outline-hidden focus:bg-basalt-accent data-disabled:pointer-events-none data-disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n"],"mappings":";;;;;;;AA4DA,IAAa,IAA4C,EAAsB,MAgBlE,IAAsB,EAAsB,SAgB5C,IAAoB,EAAsB,OAqB1C,IAAqB,EAAsB,QAyB3C,IAAkB,EAAsB,KA6BxC,IAAyB,EAAsB,YAyH/C,IAAsB,EAAM,YAGtC,EAAE,cAAW,gBAAA,GAAuB,GAAG,KAAS,MAClD,kBAAC,EAAsB,QAAvB;CAA8B,YAAY,EAAM;CAC/C,UAAA,kBAAC,EAAsB,SAAvB;EACM;EACO;EACZ,WAAW,EAAkB,EAAG,YAAY,CAAS,CAAC;EACtD,GAAI;CACJ,CAAA;AAC4B,CAAA,CAC9B;AACD,EAAoB,cAAc,EAAsB,QAAQ;AA0BhE,IAAa,IAAmB,EAAM,YAGnC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAsB,MAAvB;CACM;CACL,WAAW,EACV,EACC,6GACA,CACD,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAiB,cAAc,EAAsB,KAAK"}

package/dist/components/editable-nav-item.d.ts

@@ -0,0 +1,33 @@
+import { type ReactNode } from "react";
+export interface EditableNavItemProps {
+    /** Current display name. */
+    label: string;
+    /** Application route, interpreted by LinkProvider. */
+    href?: string;
+    /** Navigation/selection request. */
+    onSelect?: () => void;
+    /** Selected location. @default false */
+    selected?: boolean;
+    /** Caller-owned leading icon. */
+    icon?: ReactNode;
+    /** Caller-formatted count or status. */
+    count?: ReactNode;
+    /** Separate row actions, never nested inside the navigation button/link. */
+    actions?: ReactNode;
+    /** Enable renaming; rejected promises keep the editor and draft available. */
+    onRename?: (name: string) => void | Promise<void>;
+    /** Disable navigation and renaming. Application action slots retain their own permissions. @default false */
+    disabled?: boolean;
+    /** Rename action prefix. @default "Rename" */
+    renameLabel?: string;
+    /** Accessible save action. @default "Save" */
+    saveLabel?: string;
+    /** Accessible cancel action. @default "Cancel" */
+    cancelLabel?: string;
+    /** Additional root classes. */
+    className?: string;
+}
+export declare function EditableNavItem({ label, href, onSelect, selected, icon, count, actions, onRename, disabled, renameLabel, saveLabel, cancelLabel, className, }: EditableNavItemProps): import("react").JSX.Element;
+export type FolderNavItemProps = EditableNavItemProps;
+/** Folder presentation with an overridable icon; no tree, router or permission model. */
+export declare function FolderNavItem({ icon, ...props }: FolderNavItemProps): import("react").JSX.Element;

package/dist/components/editable-nav-item.js

@@ -0,0 +1,90 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { Button as n } from "./button.js";
+import { Link as r } from "./link.js";
+import { InlineEditable as i } from "./inline-editable.js";
+import { useId as a, useLayoutEffect as o, useRef as s, useState as c } from "react";
+import { Folder as l, Pencil as u } from "lucide-react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region src/components/editable-nav-item.tsx
+function m({ label: l, href: m, onSelect: h, selected: g = !1, icon: _, count: v, actions: y, onRename: b, disabled: x = !1, renameLabel: S = "Rename", saveLabel: C = "Save", cancelLabel: w = "Cancel", className: T }) {
+	let [E, D] = c(!1), O = a(), k = s(null), A = s(!1);
+	o(() => {
+		!E && A.current && (A.current = !1, k.current?.focus());
+	}, [E]);
+	let j = /* @__PURE__ */ p(d, { children: [
+		/* @__PURE__ */ f("span", {
+			className: "shrink-0",
+			"aria-hidden": "true",
+			children: _
+		}),
+		/* @__PURE__ */ f("span", {
+			className: "min-w-0 flex-1 truncate text-left",
+			children: l
+		}),
+		v != null && /* @__PURE__ */ p("span", {
+			id: O,
+			className: "shrink-0 text-xs tabular-nums text-basalt-muted-foreground",
+			children: [" ", v]
+		})
+	] });
+	return /* @__PURE__ */ f("div", {
+		className: e(t, "min-w-0 rounded-basalt-md", g && "bg-basalt-accent", T),
+		children: E && b ? /* @__PURE__ */ f(i, {
+			className: "p-2",
+			label: `${S} ${l}`,
+			value: l,
+			editing: !0,
+			onSave: b,
+			saveLabel: C,
+			cancelLabel: w,
+			disabled: x,
+			onEditingChange: (e, t) => {
+				A.current = !e && t !== "blur", D(e);
+			}
+		}) : /* @__PURE__ */ p("div", {
+			className: "flex min-w-0 items-center gap-1",
+			children: [
+				/* @__PURE__ */ f(n, {
+					asChild: !!m,
+					variant: "ghost",
+					disabled: x,
+					className: "min-w-0 flex-1 justify-start gap-2",
+					"aria-current": g ? "page" : void 0,
+					"aria-label": l,
+					"aria-describedby": v == null ? void 0 : O,
+					onClick: h,
+					children: m ? /* @__PURE__ */ f(r, {
+						href: m,
+						className: "text-inherit no-underline hover:no-underline",
+						children: j
+					}) : j
+				}),
+				b && /* @__PURE__ */ f(n, {
+					ref: k,
+					size: "icon",
+					variant: "ghost",
+					disabled: x,
+					"aria-label": `${S} ${l}`,
+					onClick: () => D(!0),
+					children: /* @__PURE__ */ f(u, {})
+				}),
+				y && /* @__PURE__ */ f("div", {
+					className: "flex shrink-0 items-center gap-1",
+					children: y
+				})
+			]
+		})
+	});
+}
+function h({ icon: e = /* @__PURE__ */ f(l, { className: "size-4" }), ...t }) {
+	return /* @__PURE__ */ f(m, {
+		icon: e,
+		...t
+	});
+}
+//#endregion
+export { m as EditableNavItem, h as FolderNavItem };
+
+//# sourceMappingURL=editable-nav-item.js.map

package/dist/components/editable-nav-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editable-nav-item.js","names":[],"sources":["../../src/components/editable-nav-item.tsx"],"sourcesContent":["import { Folder, Pencil } from \"lucide-react\";\nimport { type ReactNode, useId, useLayoutEffect, useRef, useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Button } from \"./button\";\nimport { InlineEditable } from \"./inline-editable\";\nimport { Link } from \"./link\";\n\nexport interface EditableNavItemProps {\n\t/** Current display name. */\n\tlabel: string;\n\t/** Application route, interpreted by LinkProvider. */\n\thref?: string;\n\t/** Navigation/selection request. */\n\tonSelect?: () => void;\n\t/** Selected location. @default false */\n\tselected?: boolean;\n\t/** Caller-owned leading icon. */\n\ticon?: ReactNode;\n\t/** Caller-formatted count or status. */\n\tcount?: ReactNode;\n\t/** Separate row actions, never nested inside the navigation button/link. */\n\tactions?: ReactNode;\n\t/** Enable renaming; rejected promises keep the editor and draft available. */\n\tonRename?: (name: string) => void | Promise<void>;\n\t/** Disable navigation and renaming. Application action slots retain their own permissions. @default false */\n\tdisabled?: boolean;\n\t/** Rename action prefix. @default \"Rename\" */\n\trenameLabel?: string;\n\t/** Accessible save action. @default \"Save\" */\n\tsaveLabel?: string;\n\t/** Accessible cancel action. @default \"Cancel\" */\n\tcancelLabel?: string;\n\t/** Additional root classes. */\n\tclassName?: string;\n}\nexport function EditableNavItem({\n\tlabel,\n\thref,\n\tonSelect,\n\tselected = false,\n\ticon,\n\tcount,\n\tactions,\n\tonRename,\n\tdisabled = false,\n\trenameLabel = \"Rename\",\n\tsaveLabel = \"Save\",\n\tcancelLabel = \"Cancel\",\n\tclassName,\n}: EditableNavItemProps) {\n\tconst [editing, setEditing] = useState(false);\n\tconst countId = useId();\n\tconst rename = useRef<HTMLButtonElement>(null);\n\tconst restore = useRef(false);\n\tuseLayoutEffect(() => {\n\t\tif (!editing && restore.current) {\n\t\t\trestore.current = false;\n\t\t\trename.current?.focus();\n\t\t}\n\t}, [editing]);\n\tconst content = (\n\t\t<>\n\t\t\t<span className=\"shrink-0\" aria-hidden=\"true\">\n\t\t\t\t{icon}\n\t\t\t</span>\n\t\t\t<span className=\"min-w-0 flex-1 truncate text-left\">{label}</span>\n\t\t\t{count != null && (\n\t\t\t\t<span id={countId} className=\"shrink-0 text-xs tabular-nums text-basalt-muted-foreground\">\n\t\t\t\t\t{\" \"}\n\t\t\t\t\t{count}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</>\n\t);\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"min-w-0 rounded-basalt-md\",\n\t\t\t\tselected && \"bg-basalt-accent\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t{editing && onRename ? (\n\t\t\t\t<InlineEditable\n\t\t\t\t\tclassName=\"p-2\"\n\t\t\t\t\tlabel={`${renameLabel} ${label}`}\n\t\t\t\t\tvalue={label}\n\t\t\t\t\tediting\n\t\t\t\t\tonSave={onRename}\n\t\t\t\t\tsaveLabel={saveLabel}\n\t\t\t\t\tcancelLabel={cancelLabel}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonEditingChange={(next, reason) => {\n\t\t\t\t\t\trestore.current = !next && reason !== \"blur\";\n\t\t\t\t\t\tsetEditing(next);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<div className=\"flex min-w-0 items-center gap-1\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tasChild={!!href}\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tclassName=\"min-w-0 flex-1 justify-start gap-2\"\n\t\t\t\t\t\taria-current={selected ? \"page\" : undefined}\n\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\taria-describedby={count != null ? countId : undefined}\n\t\t\t\t\t\tonClick={onSelect}\n\t\t\t\t\t>\n\t\t\t\t\t\t{href ? (\n\t\t\t\t\t\t\t<Link href={href} className=\"text-inherit no-underline hover:no-underline\">\n\t\t\t\t\t\t\t\t{content}\n\t\t\t\t\t\t\t</Link>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tcontent\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Button>\n\t\t\t\t\t{onRename && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tref={rename}\n\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\taria-label={`${renameLabel} ${label}`}\n\t\t\t\t\t\t\tonClick={() => setEditing(true)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Pencil />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t)}\n\t\t\t\t\t{actions && <div className=\"flex shrink-0 items-center gap-1\">{actions}</div>}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\nexport type FolderNavItemProps = EditableNavItemProps;\n/** Folder presentation with an overridable icon; no tree, router or permission model. */\nexport function FolderNavItem({\n\ticon = <Folder className=\"size-4\" />,\n\t...props\n}: FolderNavItemProps) {\n\treturn <EditableNavItem icon={icon} {...props} />;\n}\n"],"mappings":";;;;;;;;;;AAoCA,SAAgB,EAAgB,EAC/B,UACA,SACA,aACA,cAAW,IACX,SACA,UACA,YACA,aACA,cAAW,IACX,iBAAc,UACd,eAAY,QACZ,iBAAc,UACd,gBACwB;CACxB,IAAM,CAAC,GAAS,KAAc,EAAS,EAAK,GACtC,IAAU,EAAM,GAChB,IAAS,EAA0B,IAAI,GACvC,IAAU,EAAO,EAAK;CAC5B,QAAsB;EACrB,AAAI,CAAC,KAAW,EAAQ,YACvB,EAAQ,UAAU,IAClB,EAAO,SAAS,MAAM;CAExB,GAAG,CAAC,CAAO,CAAC;CACZ,IAAM,IACL,kBAAA,GAAA,EAAA,UAAA;EACC,kBAAC,QAAD;GAAM,WAAU;GAAW,eAAY;GACrC,UAAA;EACI,CAAA;EACN,kBAAC,QAAD;GAAM,WAAU;GAAqC,UAAA;EAAY,CAAA;EAChE,KAAS,QACT,kBAAC,QAAD;GAAM,IAAI;GAAS,WAAU;GAA7B,UAAA,CACE,KACA,CACI;;CAEN,EAAA,CAAA;CAEH,OACC,kBAAC,OAAD;EACC,WAAW,EACV,GACA,6BACA,KAAY,oBACZ,CACD;EAEC,UAAA,KAAW,IACX,kBAAC,GAAD;GACC,WAAU;GACV,OAAO,GAAG,EAAY,GAAG;GACzB,OAAO;GACP,SAAA;GACA,QAAQ;GACG;GACE;GACH;GACV,kBAAkB,GAAM,MAAW;IAElC,AADA,EAAQ,UAAU,CAAC,KAAQ,MAAW,QACtC,EAAW,CAAI;GAChB;EACA,CAAA,IAED,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA;IACC,kBAAC,GAAD;KACC,SAAS,CAAC,CAAC;KACX,SAAQ;KACE;KACV,WAAU;KACV,gBAAc,IAAW,SAAS,KAAA;KAClC,cAAY;KACZ,oBAAkB,KAAS,OAAiB,KAAA,IAAV;KAClC,SAAS;KAER,UAAA,IACA,kBAAC,GAAD;MAAY;MAAM,WAAU;MAC1B,UAAA;KACI,CAAA,IAEN;IAEM,CAAA;IACP,KACA,kBAAC,GAAD;KACC,KAAK;KACL,MAAK;KACL,SAAQ;KACE;KACV,cAAY,GAAG,EAAY,GAAG;KAC9B,eAAe,EAAW,EAAI;KAE9B,UAAA,kBAAC,GAAD,CAAS,CAAA;IACF,CAAA;IAER,KAAW,kBAAC,OAAD;KAAK,WAAU;KAAoC,UAAA;IAAa,CAAA;GACxE;;CAEF,CAAA;AAEP;AAIA,SAAgB,EAAc,EAC7B,UAAO,kBAAC,GAAD,EAAQ,WAAU,SAAU,CAAA,GACnC,GAAG,KACmB;CACtB,OAAO,kBAAC,GAAD;EAAuB;EAAM,GAAI;CAAQ,CAAA;AACjD"}

package/dist/components/empty.d.ts

@@ -1,6 +1,26 @@
 import type { HTMLAttributes, ReactNode } from "react";
-export declare function Empty({ title, description, icon, className, ...props }: HTMLAttributes<HTMLDivElement> & {
+export interface EmptyProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "children"> {
+    /**
+     * Primary title text displayed in the empty state.
+     *
+     * @default "No results"
+     */
     title?: string;
+    /**
+     * Secondary supporting description text rendered below the title.
+     */
     description?: string;
+    /**
+     * Visual icon element rendered above the title.
+     */
     icon?: ReactNode;
-}): import("react").JSX.Element;
+    /**
+     * Interactive call-to-action element (e.g. Button or Link) rendered below content.
+     */
+    action?: ReactNode;
+    /**
+     * Custom supporting content or custom layout rendered between description and action.
+     */
+    children?: ReactNode;
+}
+export declare function Empty({ title, description, icon, action, children, className, ...props }: EmptyProps): import("react").JSX.Element;

package/dist/components/empty.js

@@ -1,28 +1,37 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/empty.tsx
-function r({ title: r = "No results", description: i, icon: a, className: o, ...s }) {
-	return /* @__PURE__ */ n("div", {
-		className: e("flex flex-col items-center gap-2 text-center", o),
-		...s,
+function i({ title: i = "No results", description: a, icon: o, action: s, children: c, className: l, ...u }) {
+	return /* @__PURE__ */ r("div", {
+		className: e(t, "flex flex-col items-center gap-2 text-center", l),
+		...u,
 		children: [
-			a ? /* @__PURE__ */ t("div", {
+			o ? /* @__PURE__ */ n("div", {
 				className: "text-basalt-muted-foreground [&_svg]:size-8",
-				children: a
+				children: o
 			}) : null,
-			/* @__PURE__ */ t("p", {
+			/* @__PURE__ */ n("p", {
 				className: "text-sm font-medium text-basalt-foreground",
-				children: r
+				children: i
 			}),
-			i ? /* @__PURE__ */ t("p", {
+			a ? /* @__PURE__ */ n("p", {
 				className: "text-xs text-basalt-muted-foreground",
-				children: i
-			}) : null
+				children: a
+			}) : null,
+			c == null ? null : /* @__PURE__ */ n("div", {
+				className: "text-xs text-basalt-muted-foreground",
+				children: c
+			}),
+			s == null ? null : /* @__PURE__ */ n("div", {
+				className: "mt-2 flex items-center justify-center gap-2",
+				children: s
+			})
 		]
 	});
 }
 //#endregion
-export { r as Empty };
+export { i as Empty };
 
 //# sourceMappingURL=empty.js.map

package/dist/components/empty.js.map

@@ -1 +1 @@
-{"version":3,"file":"empty.js","names":[],"sources":["../../src/components/empty.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport function Empty({\n\ttitle = \"No results\",\n\tdescription,\n\ticon,\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLDivElement> & { title?: string; description?: string; icon?: ReactNode }) {\n\treturn (\n\t\t<div className={cn(\"flex flex-col items-center gap-2 text-center\", className)} {...props}>\n\t\t\t{icon ? <div className=\"text-basalt-muted-foreground [&_svg]:size-8\">{icon}</div> : null}\n\t\t\t<p className=\"text-sm font-medium text-basalt-foreground\">{title}</p>\n\t\t\t{description ? <p className=\"text-xs text-basalt-muted-foreground\">{description}</p> : null}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;AAGA,SAAgB,EAAM,EACrB,WAAQ,cACR,gBACA,SACA,cACA,GAAG,KAC4F;CAC/F,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,gDAAgD,CAAS;EAAG,GAAI;EAAnF,UAAA;GACE,IAAO,kBAAC,OAAD;IAAK,WAAU;IAA+C,UAAA;GAAU,CAAA,IAAI;GACpF,kBAAC,KAAD;IAAG,WAAU;IAA8C,UAAA;GAAS,CAAA;GACnE,IAAc,kBAAC,KAAD;IAAG,WAAU;IAAwC,UAAA;GAAe,CAAA,IAAI;EACnF;;AAEP"}
+{"version":3,"file":"empty.js","names":[],"sources":["../../src/components/empty.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport interface EmptyProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"children\"> {\n\t/**\n\t * Primary title text displayed in the empty state.\n\t *\n\t * @default \"No results\"\n\t */\n\ttitle?: string;\n\n\t/**\n\t * Secondary supporting description text rendered below the title.\n\t */\n\tdescription?: string;\n\n\t/**\n\t * Visual icon element rendered above the title.\n\t */\n\ticon?: ReactNode;\n\n\t/**\n\t * Interactive call-to-action element (e.g. Button or Link) rendered below content.\n\t */\n\taction?: ReactNode;\n\n\t/**\n\t * Custom supporting content or custom layout rendered between description and action.\n\t */\n\tchildren?: ReactNode;\n}\n\nexport function Empty({\n\ttitle = \"No results\",\n\tdescription,\n\ticon,\n\taction,\n\tchildren,\n\tclassName,\n\t...props\n}: EmptyProps) {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(BASALT_UI_CLASS, \"flex flex-col items-center gap-2 text-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{icon ? <div className=\"text-basalt-muted-foreground [&_svg]:size-8\">{icon}</div> : null}\n\t\t\t<p className=\"text-sm font-medium text-basalt-foreground\">{title}</p>\n\t\t\t{description ? <p className=\"text-xs text-basalt-muted-foreground\">{description}</p> : null}\n\t\t\t{children !== undefined && children !== null ? (\n\t\t\t\t<div className=\"text-xs text-basalt-muted-foreground\">{children}</div>\n\t\t\t) : null}\n\t\t\t{action !== undefined && action !== null ? (\n\t\t\t\t<div className=\"mt-2 flex items-center justify-center gap-2\">{action}</div>\n\t\t\t) : null}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;AAiCA,SAAgB,EAAM,EACrB,WAAQ,cACR,gBACA,SACA,WACA,aACA,cACA,GAAG,KACW;CACd,OACC,kBAAC,OAAD;EACC,WAAW,EAAG,GAAiB,gDAAgD,CAAS;EACxF,GAAI;EAFL,UAAA;GAIE,IAAO,kBAAC,OAAD;IAAK,WAAU;IAA+C,UAAA;GAAU,CAAA,IAAI;GACpF,kBAAC,KAAD;IAAG,WAAU;IAA8C,UAAA;GAAS,CAAA;GACnE,IAAc,kBAAC,KAAD;IAAG,WAAU;IAAwC,UAAA;GAAe,CAAA,IAAI;GACtF,KAAuC,OAEpC,OADH,kBAAC,OAAD;IAAK,WAAU;IAAwC;GAAc,CAAA;GAErE,KAAmC,OAEhC,OADH,kBAAC,OAAD;IAAK,WAAU;IAA+C,UAAA;GAAY,CAAA;EAEvE;;AAEP"}

package/dist/components/field.js

@@ -1,52 +1,53 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { Label as t } from "./label.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { Label as n } from "./label.js";
+import * as r from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/field.tsx
-function a(e) {
-	return typeof e == "object" && !!e && !Array.isArray(e) && !n.isValidElement(e) && "message" in e;
-}
 function o(e) {
-	if (e != null) return a(e) ? e.message : e;
+	return typeof e == "object" && !!e && !Array.isArray(e) && !r.isValidElement(e) && "message" in e;
 }
 function s(e) {
+	if (e != null) return o(e) ? e.message : e;
+}
+function c(e) {
 	return !!e;
 }
-var c = n.forwardRef(({ label: a, htmlFor: c, hint: l, error: u, required: d, labelTooltip: f, className: p, children: m, ...h }, g) => {
-	let _ = n.useId(), v = n.isValidElement(m) ? m : null, y = v ? c ?? v.props.id ?? _ : c, b = y ? `${y}-hint` : void 0, x = y ? `${y}-error` : void 0, S = o(u), C = s(S), w = [[C ? x : null, !C && l ? b : null].filter(Boolean).join(" "), v?.props["aria-describedby"]].filter(Boolean).join(" ");
-	return /* @__PURE__ */ i("div", {
-		ref: g,
-		...h,
-		className: e("flex flex-col gap-1.5", p),
+var l = r.forwardRef(({ label: o, htmlFor: l, hint: u, error: d, required: f, labelTooltip: p, className: m, children: h, ...g }, _) => {
+	let v = r.useId(), y = r.isValidElement(h) ? h : null, b = y ? l ?? y.props.id ?? v : l, x = b ? `${b}-hint` : void 0, S = b ? `${b}-error` : void 0, C = s(d), w = c(C), T = [[w ? S : null, !w && u ? x : null].filter(Boolean).join(" "), y?.props["aria-describedby"]].filter(Boolean).join(" ");
+	return /* @__PURE__ */ a("div", {
+		ref: _,
+		...g,
+		className: e(t, "flex flex-col gap-1.5", m),
 		children: [
-			/* @__PURE__ */ r(t, {
-				htmlFor: y,
-				showOptional: d === !1,
-				tooltip: f,
-				children: a
+			/* @__PURE__ */ i(n, {
+				htmlFor: b,
+				showOptional: f === !1,
+				tooltip: p,
+				children: o
 			}),
-			v ? n.cloneElement(v, {
-				id: y,
-				"aria-invalid": C ? !0 : v.props["aria-invalid"],
-				"aria-describedby": w || void 0
-			}) : m,
-			l && !C ? /* @__PURE__ */ r("p", {
+			y ? r.cloneElement(y, {
 				id: b,
+				"aria-invalid": w ? !0 : y.props["aria-invalid"],
+				"aria-describedby": T || void 0
+			}) : h,
+			u && !w ? /* @__PURE__ */ i("p", {
+				id: x,
 				className: "text-xs text-basalt-muted-foreground",
-				children: l
+				children: u
 			}) : null,
-			C ? /* @__PURE__ */ r("p", {
-				id: x,
+			w ? /* @__PURE__ */ i("p", {
+				id: S,
 				className: "text-xs text-basalt-destructive",
 				role: "alert",
-				children: S
+				children: C
 			}) : null
 		]
 	});
 });
-c.displayName = "Field";
+l.displayName = "Field";
 //#endregion
-export { c as Field };
+export { l as Field };
 
 //# sourceMappingURL=field.js.map

package/dist/components/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","names":[],"sources":["../../src/components/field.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { Label } from \"./label\";\n\nexport type FieldError = Exclude<React.ReactNode, undefined> | { message: React.ReactNode };\n\ntype FieldControlProps = {\n\tid?: string;\n\t\"aria-describedby\"?: string;\n\t\"aria-invalid\"?: boolean | \"true\" | \"false\";\n};\n\nexport interface FieldProps\n\textends Omit<React.ComponentPropsWithoutRef<\"div\">, \"children\" | \"className\"> {\n\t/**\n\t * Visible label.\n\t */\n\tlabel: React.ReactNode;\n\t/**\n\t * Associates the label and described-by ids.\n\t */\n\thtmlFor?: string;\n\t/**\n\t * Supporting text when there is no error.\n\t */\n\thint?: React.ReactNode;\n\t/**\n\t * Replaces the hint and marks the control invalid.\n\t */\n\terror?: FieldError;\n\t/**\n\t * When false, show (optional) after the label.\n\t */\n\trequired?: boolean;\n\t/**\n\t * Info icon with hover text on the label.\n\t */\n\tlabelTooltip?: React.ReactNode;\n\t/**\n\t * Additional classes for the field root.\n\t */\n\tclassName?: string;\n\t/**\n\t * The control or content to render.\n\t */\n\tchildren: React.ReactNode;\n}\n\nfunction isStructuredError(error: FieldError): error is { message: React.ReactNode } {\n\treturn (\n\t\ttypeof error === \"object\" &&\n\t\terror !== null &&\n\t\t!Array.isArray(error) &&\n\t\t!React.isValidElement(error) &&\n\t\t\"message\" in error\n\t);\n}\n\nfunction fieldErrorMessage(error: FieldError | undefined): React.ReactNode | undefined {\n\tif (error == null) {\n\t\treturn undefined;\n\t}\n\treturn isStructuredError(error) ? error.message : error;\n}\n\nfunction hasFieldError(message: React.ReactNode | undefined): boolean {\n\treturn Boolean(message);\n}\n\nexport const Field = React.forwardRef<HTMLDivElement, FieldProps>(\n\t({ label, htmlFor, hint, error, required, labelTooltip, className, children, ...props }, ref) => {\n\t\tconst generatedId = React.useId();\n\t\tconst child = React.isValidElement(children)\n\t\t\t? (children as React.ReactElement<FieldControlProps>)\n\t\t\t: null;\n\t\tconst controlId = child ? (htmlFor ?? child.props.id ?? generatedId) : htmlFor;\n\t\tconst hintId = controlId ? `${controlId}-hint` : undefined;\n\t\tconst errorId = controlId ? `${controlId}-error` : undefined;\n\t\tconst errorMessage = fieldErrorMessage(error);\n\t\tconst hasError = hasFieldError(errorMessage);\n\t\tconst describedBy = [hasError ? errorId : null, !hasError && hint ? hintId : null]\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\tconst mergedDescribedBy = [describedBy, child?.props[\"aria-describedby\"]]\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\treturn (\n\t\t\t<div ref={ref} {...props} className={cn(\"flex flex-col gap-1.5\", className)}>\n\t\t\t\t<Label htmlFor={controlId} showOptional={required === false} tooltip={labelTooltip}>\n\t\t\t\t\t{label}\n\t\t\t\t</Label>\n\t\t\t\t{child\n\t\t\t\t\t? React.cloneElement(child, {\n\t\t\t\t\t\t\tid: controlId,\n\t\t\t\t\t\t\t\"aria-invalid\": hasError ? true : child.props[\"aria-invalid\"],\n\t\t\t\t\t\t\t\"aria-describedby\": mergedDescribedBy || undefined,\n\t\t\t\t\t\t})\n\t\t\t\t\t: children}\n\t\t\t\t{hint && !hasError ? (\n\t\t\t\t\t<p id={hintId} className=\"text-xs text-basalt-muted-foreground\">\n\t\t\t\t\t\t{hint}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t\t{hasError ? (\n\t\t\t\t\t<p id={errorId} className=\"text-xs text-basalt-destructive\" role=\"alert\">\n\t\t\t\t\t\t{errorMessage}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t);\n\t},\n);\nField.displayName = \"Field\";\n"],"mappings":";;;;;;AAgDA,SAAS,EAAkB,GAA0D;CACpF,OACC,OAAO,KAAU,cACjB,KACA,CAAC,MAAM,QAAQ,CAAK,KACpB,CAAC,EAAM,eAAe,CAAK,KAC3B,aAAa;AAEf;AAEA,SAAS,EAAkB,GAA4D;CAClF,SAAS,MAGb,OAAO,EAAkB,CAAK,IAAI,EAAM,UAAU;AACnD;AAEA,SAAS,EAAc,GAA+C;CACrE,OAAO,EAAQ;AAChB;AAEA,IAAa,IAAQ,EAAM,YACzB,EAAE,UAAO,YAAS,SAAM,UAAO,aAAU,iBAAc,cAAW,aAAU,GAAG,KAAS,MAAQ;CAChG,IAAM,IAAc,EAAM,MAAM,GAC1B,IAAQ,EAAM,eAAe,CAAQ,IACvC,IACD,MACG,IAAY,IAAS,KAAW,EAAM,MAAM,MAAM,IAAe,GACjE,IAAS,IAAY,GAAG,EAAU,SAAS,KAAA,GAC3C,IAAU,IAAY,GAAG,EAAU,UAAU,KAAA,GAC7C,IAAe,EAAkB,CAAK,GACtC,IAAW,EAAc,CAAY,GAIrC,IAAoB,CAHN,CAAC,IAAW,IAAU,MAAM,CAAC,KAAY,IAAO,IAAS,IAAI,CAAC,CAChF,OAAO,OAAO,CAAC,CACf,KAAK,GACoB,GAAa,GAAO,MAAM,mBAAmB,CAAC,CACvE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CACV,OACC,kBAAC,OAAD;EAAU;EAAK,GAAI;EAAO,WAAW,EAAG,yBAAyB,CAAS;EAA1E,UAAA;GACC,kBAAC,GAAD;IAAO,SAAS;IAAW,cAAc,MAAa;IAAO,SAAS;IACpE,UAAA;GACK,CAAA;GACN,IACE,EAAM,aAAa,GAAO;IAC1B,IAAI;IACJ,gBAAgB,IAAW,KAAO,EAAM,MAAM;IAC9C,oBAAoB,KAAqB,KAAA;GAC1C,CAAC,IACA;GACF,KAAQ,CAAC,IACT,kBAAC,KAAD;IAAG,IAAI;IAAQ,WAAU;IACvB,UAAA;GACC,CAAA,IACA;GACH,IACA,kBAAC,KAAD;IAAG,IAAI;IAAS,WAAU;IAAkC,MAAK;IAC/D,UAAA;GACC,CAAA,IACA;EACA;;AAEP,CACD;AACA,EAAM,cAAc"}
+{"version":3,"file":"field.js","names":[],"sources":["../../src/components/field.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Label } from \"./label\";\n\nexport type FieldError = Exclude<React.ReactNode, undefined> | { message: React.ReactNode };\n\ntype FieldControlProps = {\n\tid?: string;\n\t\"aria-describedby\"?: string;\n\t\"aria-invalid\"?: boolean | \"true\" | \"false\";\n};\n\nexport interface FieldProps\n\textends Omit<React.ComponentPropsWithoutRef<\"div\">, \"children\" | \"className\"> {\n\t/**\n\t * Visible label.\n\t */\n\tlabel: React.ReactNode;\n\t/**\n\t * Associates the label and described-by ids.\n\t */\n\thtmlFor?: string;\n\t/**\n\t * Supporting text when there is no error.\n\t */\n\thint?: React.ReactNode;\n\t/**\n\t * Replaces the hint and marks the control invalid.\n\t */\n\terror?: FieldError;\n\t/**\n\t * When false, show (optional) after the label.\n\t */\n\trequired?: boolean;\n\t/**\n\t * Info icon with hover text on the label.\n\t */\n\tlabelTooltip?: React.ReactNode;\n\t/**\n\t * Additional classes for the field root.\n\t */\n\tclassName?: string;\n\t/**\n\t * The control or content to render.\n\t */\n\tchildren: React.ReactNode;\n}\n\nfunction isStructuredError(error: FieldError): error is { message: React.ReactNode } {\n\treturn (\n\t\ttypeof error === \"object\" &&\n\t\terror !== null &&\n\t\t!Array.isArray(error) &&\n\t\t!React.isValidElement(error) &&\n\t\t\"message\" in error\n\t);\n}\n\nfunction fieldErrorMessage(error: FieldError | undefined): React.ReactNode | undefined {\n\tif (error == null) {\n\t\treturn undefined;\n\t}\n\treturn isStructuredError(error) ? error.message : error;\n}\n\nfunction hasFieldError(message: React.ReactNode | undefined): boolean {\n\treturn Boolean(message);\n}\n\nexport const Field = React.forwardRef<HTMLDivElement, FieldProps>(\n\t({ label, htmlFor, hint, error, required, labelTooltip, className, children, ...props }, ref) => {\n\t\tconst generatedId = React.useId();\n\t\tconst child = React.isValidElement(children)\n\t\t\t? (children as React.ReactElement<FieldControlProps>)\n\t\t\t: null;\n\t\tconst controlId = child ? (htmlFor ?? child.props.id ?? generatedId) : htmlFor;\n\t\tconst hintId = controlId ? `${controlId}-hint` : undefined;\n\t\tconst errorId = controlId ? `${controlId}-error` : undefined;\n\t\tconst errorMessage = fieldErrorMessage(error);\n\t\tconst hasError = hasFieldError(errorMessage);\n\t\tconst describedBy = [hasError ? errorId : null, !hasError && hint ? hintId : null]\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\tconst mergedDescribedBy = [describedBy, child?.props[\"aria-describedby\"]]\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\treturn (\n\t\t\t<div ref={ref} {...props} className={cn(BASALT_UI_CLASS, \"flex flex-col gap-1.5\", className)}>\n\t\t\t\t<Label htmlFor={controlId} showOptional={required === false} tooltip={labelTooltip}>\n\t\t\t\t\t{label}\n\t\t\t\t</Label>\n\t\t\t\t{child\n\t\t\t\t\t? React.cloneElement(child, {\n\t\t\t\t\t\t\tid: controlId,\n\t\t\t\t\t\t\t\"aria-invalid\": hasError ? true : child.props[\"aria-invalid\"],\n\t\t\t\t\t\t\t\"aria-describedby\": mergedDescribedBy || undefined,\n\t\t\t\t\t\t})\n\t\t\t\t\t: children}\n\t\t\t\t{hint && !hasError ? (\n\t\t\t\t\t<p id={hintId} className=\"text-xs text-basalt-muted-foreground\">\n\t\t\t\t\t\t{hint}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t\t{hasError ? (\n\t\t\t\t\t<p id={errorId} className=\"text-xs text-basalt-destructive\" role=\"alert\">\n\t\t\t\t\t\t{errorMessage}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t);\n\t},\n);\nField.displayName = \"Field\";\n"],"mappings":";;;;;;;AAiDA,SAAS,EAAkB,GAA0D;CACpF,OACC,OAAO,KAAU,cACjB,KACA,CAAC,MAAM,QAAQ,CAAK,KACpB,CAAC,EAAM,eAAe,CAAK,KAC3B,aAAa;AAEf;AAEA,SAAS,EAAkB,GAA4D;CAClF,SAAS,MAGb,OAAO,EAAkB,CAAK,IAAI,EAAM,UAAU;AACnD;AAEA,SAAS,EAAc,GAA+C;CACrE,OAAO,EAAQ;AAChB;AAEA,IAAa,IAAQ,EAAM,YACzB,EAAE,UAAO,YAAS,SAAM,UAAO,aAAU,iBAAc,cAAW,aAAU,GAAG,KAAS,MAAQ;CAChG,IAAM,IAAc,EAAM,MAAM,GAC1B,IAAQ,EAAM,eAAe,CAAQ,IACvC,IACD,MACG,IAAY,IAAS,KAAW,EAAM,MAAM,MAAM,IAAe,GACjE,IAAS,IAAY,GAAG,EAAU,SAAS,KAAA,GAC3C,IAAU,IAAY,GAAG,EAAU,UAAU,KAAA,GAC7C,IAAe,EAAkB,CAAK,GACtC,IAAW,EAAc,CAAY,GAIrC,IAAoB,CAHN,CAAC,IAAW,IAAU,MAAM,CAAC,KAAY,IAAO,IAAS,IAAI,CAAC,CAChF,OAAO,OAAO,CAAC,CACf,KAAK,GACoB,GAAa,GAAO,MAAM,mBAAmB,CAAC,CACvE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CACV,OACC,kBAAC,OAAD;EAAU;EAAK,GAAI;EAAO,WAAW,EAAG,GAAiB,yBAAyB,CAAS;EAA3F,UAAA;GACC,kBAAC,GAAD;IAAO,SAAS;IAAW,cAAc,MAAa;IAAO,SAAS;IACpE,UAAA;GACK,CAAA;GACN,IACE,EAAM,aAAa,GAAO;IAC1B,IAAI;IACJ,gBAAgB,IAAW,KAAO,EAAM,MAAM;IAC9C,oBAAoB,KAAqB,KAAA;GAC1C,CAAC,IACA;GACF,KAAQ,CAAC,IACT,kBAAC,KAAD;IAAG,IAAI;IAAQ,WAAU;IACvB,UAAA;GACC,CAAA,IACA;GACH,IACA,kBAAC,KAAD;IAAG,IAAI;IAAS,WAAU;IAAkC,MAAK;IAC/D,UAAA;GACC,CAAA,IACA;EACA;;AAEP,CACD;AACA,EAAM,cAAc"}

package/dist/components/file-dropzone.d.ts

@@ -0,0 +1,37 @@
+export interface FileRejection {
+    /** Original File; the component never creates preview URLs. */
+    file: File;
+    /** Machine-readable reason for application handling. */
+    code: "file-invalid-type" | "file-too-large" | "too-many-files";
+}
+export interface FileDropzoneProps {
+    /** Visible and accessible upload field name. */
+    label: string;
+    /** Optional file requirements shown under the label. */
+    description?: string;
+    /** Accepted extensions/MIME types using native accept syntax, e.g. .pdf,image/*. */
+    accept?: string;
+    /** Allow multiple files. @default true */
+    multiple?: boolean;
+    /** Maximum accepted file count including fileCount. @default Infinity */
+    maxFiles?: number;
+    /** Number already held by the application. @default 0 */
+    fileCount?: number;
+    /** Maximum size of an individual file in bytes. @default Infinity */
+    maxSize?: number;
+    /** Prevent both file browsing and drops. @default false */
+    disabled?: boolean;
+    /** Accepted files from this gesture; transport and queue ownership belong to the caller. */
+    onFilesAccepted: (files: File[]) => void;
+    /** Rejected files from this gesture, with one primary reason per file. */
+    onFilesRejected?: (rejections: FileRejection[]) => void;
+    /** Browse action text. @default "Browse files" */
+    browseLabel?: string;
+    /** Text while a file is dragged over the field. @default "Drop files here" */
+    dropLabel?: string;
+    /** Localized rejection message; defaults to a name and reason. */
+    formatRejection?: (rejection: FileRejection) => string;
+    /** Additional root classes. */
+    className?: string;
+}
+export declare function FileDropzone({ label, description, accept, multiple, maxFiles, fileCount, maxSize, disabled, onFilesAccepted, onFilesRejected, browseLabel, dropLabel, formatRejection, className, }: FileDropzoneProps): import("react").JSX.Element;

package/dist/components/file-dropzone.js

@@ -0,0 +1,103 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { useId as n, useRef as r, useState as i } from "react";
+import { Upload as a } from "lucide-react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/file-dropzone.tsx
+function c(e, t) {
+	let n = t.split(",").map((e) => e.trim().toLowerCase()).filter(Boolean);
+	return n.length === 0 || n.some((t) => t.startsWith(".") ? e.name.toLowerCase().endsWith(t) : t.endsWith("/*") ? e.type.toLowerCase().startsWith(t.slice(0, -1)) : e.type.toLowerCase() === t);
+}
+var l = {
+	"file-invalid-type": "File type is not accepted.",
+	"file-too-large": "File exceeds the size limit.",
+	"too-many-files": "File count limit reached."
+};
+function u({ label: u, description: d, accept: f = "", multiple: p = !0, maxFiles: m = Infinity, fileCount: h = 0, maxSize: g = Infinity, disabled: _ = !1, onFilesAccepted: v, onFilesRejected: y, browseLabel: b = "Browse files", dropLabel: x = "Drop files here", formatRejection: S, className: C }) {
+	let w = r(null), T = r(0), [E, D] = i(!1), [O, k] = i([]), A = n();
+	function j(e) {
+		if (_) return;
+		let t = [], n = [], r = Math.max(0, p ? m : Math.min(1, m));
+		for (let i of e) {
+			let e = c(i, f) ? i.size > g ? "file-too-large" : t.length + h >= r ? "too-many-files" : null : "file-invalid-type";
+			e ? n.push({
+				file: i,
+				code: e
+			}) : t.push(i);
+		}
+		k(n), t.length && v(t), n.length && y?.(n);
+	}
+	return /* @__PURE__ */ s("div", {
+		role: "group",
+		"aria-label": u,
+		className: e(t, "min-w-0 space-y-2", C),
+		children: [
+			/* @__PURE__ */ o("input", {
+				ref: w,
+				type: "file",
+				accept: f,
+				multiple: p,
+				disabled: _,
+				tabIndex: -1,
+				"aria-label": u,
+				className: "hidden",
+				onChange: (e) => {
+					j(Array.from(e.currentTarget.files ?? [])), e.currentTarget.value = "";
+				}
+			}),
+			/* @__PURE__ */ s("button", {
+				type: "button",
+				disabled: _,
+				"aria-label": `${b}: ${u}`,
+				"aria-describedby": d ? `${A}-description` : void 0,
+				"data-drag-active": E && !_,
+				onClick: () => w.current?.click(),
+				onDragEnter: (e) => {
+					e.preventDefault(), T.current += 1, _ || D(!0);
+				},
+				onDragOver: (e) => {
+					e.preventDefault(), _ || (e.dataTransfer.dropEffect = "copy");
+				},
+				onDragLeave: (e) => {
+					e.preventDefault(), T.current = Math.max(0, T.current - 1), T.current === 0 && D(!1);
+				},
+				onDrop: (e) => {
+					e.preventDefault(), e.stopPropagation(), T.current = 0, D(!1), j(Array.from(e.dataTransfer.files));
+				},
+				className: e("flex w-full min-w-0 flex-col items-center gap-2 rounded-basalt-lg border-2 border-dashed px-4 py-7 text-center transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-basalt-ring disabled:cursor-not-allowed disabled:opacity-50", E && !_ ? "border-basalt-primary bg-basalt-accent" : "border-basalt-border bg-basalt-card hover:bg-basalt-accent"),
+				children: [
+					/* @__PURE__ */ o(a, {
+						className: "size-6 text-basalt-muted-foreground",
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ o("span", {
+						className: "text-sm font-medium",
+						children: E && !_ ? x : u
+					}),
+					d && /* @__PURE__ */ o("span", {
+						id: `${A}-description`,
+						className: "text-xs text-basalt-muted-foreground",
+						children: d
+					}),
+					/* @__PURE__ */ o("span", {
+						className: "rounded-basalt-md border border-basalt-border px-3 py-1 text-xs",
+						children: b
+					})
+				]
+			}),
+			O.length > 0 && /* @__PURE__ */ o("ul", {
+				role: "alert",
+				className: "space-y-1 text-xs text-basalt-destructive",
+				children: O.map((e, t) => /* @__PURE__ */ o("li", {
+					className: "break-words",
+					children: S ? S(e) : `${e.file.name}: ${l[e.code]}`
+				}, `${e.file.name}-${t}`))
+			})
+		]
+	});
+}
+//#endregion
+export { u as FileDropzone };
+
+//# sourceMappingURL=file-dropzone.js.map

package/dist/components/file-dropzone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-dropzone.js","names":[],"sources":["../../src/components/file-dropzone.tsx"],"sourcesContent":["import { Upload } from \"lucide-react\";\nimport { useId, useRef, useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport interface FileRejection {\n\t/** Original File; the component never creates preview URLs. */\n\tfile: File;\n\t/** Machine-readable reason for application handling. */\n\tcode: \"file-invalid-type\" | \"file-too-large\" | \"too-many-files\";\n}\n\nexport interface FileDropzoneProps {\n\t/** Visible and accessible upload field name. */\n\tlabel: string;\n\t/** Optional file requirements shown under the label. */\n\tdescription?: string;\n\t/** Accepted extensions/MIME types using native accept syntax, e.g. .pdf,image/*. */\n\taccept?: string;\n\t/** Allow multiple files. @default true */\n\tmultiple?: boolean;\n\t/** Maximum accepted file count including fileCount. @default Infinity */\n\tmaxFiles?: number;\n\t/** Number already held by the application. @default 0 */\n\tfileCount?: number;\n\t/** Maximum size of an individual file in bytes. @default Infinity */\n\tmaxSize?: number;\n\t/** Prevent both file browsing and drops. @default false */\n\tdisabled?: boolean;\n\t/** Accepted files from this gesture; transport and queue ownership belong to the caller. */\n\tonFilesAccepted: (files: File[]) => void;\n\t/** Rejected files from this gesture, with one primary reason per file. */\n\tonFilesRejected?: (rejections: FileRejection[]) => void;\n\t/** Browse action text. @default \"Browse files\" */\n\tbrowseLabel?: string;\n\t/** Text while a file is dragged over the field. @default \"Drop files here\" */\n\tdropLabel?: string;\n\t/** Localized rejection message; defaults to a name and reason. */\n\tformatRejection?: (rejection: FileRejection) => string;\n\t/** Additional root classes. */\n\tclassName?: string;\n}\n\nfunction accepts(file: File, accept: string) {\n\tconst rules = accept\n\t\t.split(\",\")\n\t\t.map((rule) => rule.trim().toLowerCase())\n\t\t.filter(Boolean);\n\treturn (\n\t\trules.length === 0 ||\n\t\trules.some((rule) =>\n\t\t\trule.startsWith(\".\")\n\t\t\t\t? file.name.toLowerCase().endsWith(rule)\n\t\t\t\t: rule.endsWith(\"/*\")\n\t\t\t\t\t? file.type.toLowerCase().startsWith(rule.slice(0, -1))\n\t\t\t\t\t: file.type.toLowerCase() === rule,\n\t\t)\n\t);\n}\n\nconst REASONS = {\n\t\"file-invalid-type\": \"File type is not accepted.\",\n\t\"file-too-large\": \"File exceeds the size limit.\",\n\t\"too-many-files\": \"File count limit reached.\",\n};\n\nexport function FileDropzone({\n\tlabel,\n\tdescription,\n\taccept = \"\",\n\tmultiple = true,\n\tmaxFiles = Infinity,\n\tfileCount = 0,\n\tmaxSize = Infinity,\n\tdisabled = false,\n\tonFilesAccepted,\n\tonFilesRejected,\n\tbrowseLabel = \"Browse files\",\n\tdropLabel = \"Drop files here\",\n\tformatRejection,\n\tclassName,\n}: FileDropzoneProps) {\n\tconst input = useRef<HTMLInputElement>(null);\n\tconst depth = useRef(0);\n\tconst [dragging, setDragging] = useState(false);\n\tconst [rejections, setRejections] = useState<FileRejection[]>([]);\n\tconst id = useId();\n\tfunction receive(files: File[]) {\n\t\tif (disabled) return;\n\t\tconst accepted: File[] = [];\n\t\tconst rejected: FileRejection[] = [];\n\t\tconst limit = Math.max(0, multiple ? maxFiles : Math.min(1, maxFiles));\n\t\tfor (const file of files) {\n\t\t\tconst code = !accepts(file, accept)\n\t\t\t\t? \"file-invalid-type\"\n\t\t\t\t: file.size > maxSize\n\t\t\t\t\t? \"file-too-large\"\n\t\t\t\t\t: accepted.length + fileCount >= limit\n\t\t\t\t\t\t? \"too-many-files\"\n\t\t\t\t\t\t: null;\n\t\t\tif (code) rejected.push({ file, code });\n\t\t\telse accepted.push(file);\n\t\t}\n\t\tsetRejections(rejected);\n\t\tif (accepted.length) onFilesAccepted(accepted);\n\t\tif (rejected.length) onFilesRejected?.(rejected);\n\t}\n\treturn (\n\t\t<div\n\t\t\trole=\"group\"\n\t\t\taria-label={label}\n\t\t\tclassName={cn(BASALT_UI_CLASS, \"min-w-0 space-y-2\", className)}\n\t\t>\n\t\t\t<input\n\t\t\t\tref={input}\n\t\t\t\ttype=\"file\"\n\t\t\t\taccept={accept}\n\t\t\t\tmultiple={multiple}\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttabIndex={-1}\n\t\t\t\taria-label={label}\n\t\t\t\tclassName=\"hidden\"\n\t\t\t\tonChange={(event) => {\n\t\t\t\t\treceive(Array.from(event.currentTarget.files ?? []));\n\t\t\t\t\tevent.currentTarget.value = \"\";\n\t\t\t\t}}\n\t\t\t/>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tdisabled={disabled}\n\t\t\t\taria-label={`${browseLabel}: ${label}`}\n\t\t\t\taria-describedby={description ? `${id}-description` : undefined}\n\t\t\t\tdata-drag-active={dragging && !disabled}\n\t\t\t\tonClick={() => input.current?.click()}\n\t\t\t\tonDragEnter={(event) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tdepth.current += 1;\n\t\t\t\t\tif (!disabled) setDragging(true);\n\t\t\t\t}}\n\t\t\t\tonDragOver={(event) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif (!disabled) event.dataTransfer.dropEffect = \"copy\";\n\t\t\t\t}}\n\t\t\t\tonDragLeave={(event) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tdepth.current = Math.max(0, depth.current - 1);\n\t\t\t\t\tif (depth.current === 0) setDragging(false);\n\t\t\t\t}}\n\t\t\t\tonDrop={(event) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tdepth.current = 0;\n\t\t\t\t\tsetDragging(false);\n\t\t\t\t\treceive(Array.from(event.dataTransfer.files));\n\t\t\t\t}}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"flex w-full min-w-0 flex-col items-center gap-2 rounded-basalt-lg border-2 border-dashed px-4 py-7 text-center transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-basalt-ring disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\t\tdragging && !disabled\n\t\t\t\t\t\t? \"border-basalt-primary bg-basalt-accent\"\n\t\t\t\t\t\t: \"border-basalt-border bg-basalt-card hover:bg-basalt-accent\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Upload className=\"size-6 text-basalt-muted-foreground\" aria-hidden=\"true\" />\n\t\t\t\t<span className=\"text-sm font-medium\">{dragging && !disabled ? dropLabel : label}</span>\n\t\t\t\t{description && (\n\t\t\t\t\t<span id={`${id}-description`} className=\"text-xs text-basalt-muted-foreground\">\n\t\t\t\t\t\t{description}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span className=\"rounded-basalt-md border border-basalt-border px-3 py-1 text-xs\">\n\t\t\t\t\t{browseLabel}\n\t\t\t\t</span>\n\t\t\t</button>\n\t\t\t{rejections.length > 0 && (\n\t\t\t\t<ul role=\"alert\" className=\"space-y-1 text-xs text-basalt-destructive\">\n\t\t\t\t\t{rejections.map((item, index) => (\n\t\t\t\t\t\t<li key={`${item.file.name}-${index}`} className=\"break-words\">\n\t\t\t\t\t\t\t{formatRejection ? formatRejection(item) : `${item.file.name}: ${REASONS[item.code]}`}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t))}\n\t\t\t\t</ul>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;AA2CA,SAAS,EAAQ,GAAY,GAAgB;CAC5C,IAAM,IAAQ,EACZ,MAAM,GAAG,CAAC,CACV,KAAK,MAAS,EAAK,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC,CACxC,OAAO,OAAO;CAChB,OACC,EAAM,WAAW,KACjB,EAAM,MAAM,MACX,EAAK,WAAW,GAAG,IAChB,EAAK,KAAK,YAAY,CAAC,CAAC,SAAS,CAAI,IACrC,EAAK,SAAS,IAAI,IACjB,EAAK,KAAK,YAAY,CAAC,CAAC,WAAW,EAAK,MAAM,GAAG,EAAE,CAAC,IACpD,EAAK,KAAK,YAAY,MAAM,CACjC;AAEF;AAEA,IAAM,IAAU;CACf,qBAAqB;CACrB,kBAAkB;CAClB,kBAAkB;AACnB;AAEA,SAAgB,EAAa,EAC5B,UACA,gBACA,YAAS,IACT,cAAW,IACX,cAAW,UACX,eAAY,GACZ,aAAU,UACV,cAAW,IACX,oBACA,oBACA,iBAAc,gBACd,eAAY,mBACZ,oBACA,gBACqB;CACrB,IAAM,IAAQ,EAAyB,IAAI,GACrC,IAAQ,EAAO,CAAC,GAChB,CAAC,GAAU,KAAe,EAAS,EAAK,GACxC,CAAC,GAAY,KAAiB,EAA0B,CAAC,CAAC,GAC1D,IAAK,EAAM;CACjB,SAAS,EAAQ,GAAe;EAC/B,IAAI,GAAU;EACd,IAAM,IAAmB,CAAC,GACpB,IAA4B,CAAC,GAC7B,IAAQ,KAAK,IAAI,GAAG,IAAW,IAAW,KAAK,IAAI,GAAG,CAAQ,CAAC;EACrE,KAAK,IAAM,KAAQ,GAAO;GACzB,IAAM,IAAQ,EAAQ,GAAM,CAAM,IAE/B,EAAK,OAAO,IACX,mBACA,EAAS,SAAS,KAAa,IAC9B,mBACA,OALF;GAMH,AAAI,IAAM,EAAS,KAAK;IAAE;IAAM;GAAK,CAAC,IACjC,EAAS,KAAK,CAAI;EACxB;EAGA,AAFA,EAAc,CAAQ,GAClB,EAAS,UAAQ,EAAgB,CAAQ,GACzC,EAAS,UAAQ,IAAkB,CAAQ;CAChD;CACA,OACC,kBAAC,OAAD;EACC,MAAK;EACL,cAAY;EACZ,WAAW,EAAG,GAAiB,qBAAqB,CAAS;EAH9D,UAAA;GAKC,kBAAC,SAAD;IACC,KAAK;IACL,MAAK;IACG;IACE;IACA;IACV,UAAU;IACV,cAAY;IACZ,WAAU;IACV,WAAW,MAAU;KAEpB,AADA,EAAQ,MAAM,KAAK,EAAM,cAAc,SAAS,CAAC,CAAC,CAAC,GACnD,EAAM,cAAc,QAAQ;IAC7B;GACA,CAAA;GACD,kBAAC,UAAD;IACC,MAAK;IACK;IACV,cAAY,GAAG,EAAY,IAAI;IAC/B,oBAAkB,IAAc,GAAG,EAAG,gBAAgB,KAAA;IACtD,oBAAkB,KAAY,CAAC;IAC/B,eAAe,EAAM,SAAS,MAAM;IACpC,cAAc,MAAU;KAGvB,AAFA,EAAM,eAAe,GACrB,EAAM,WAAW,GACZ,KAAU,EAAY,EAAI;IAChC;IACA,aAAa,MAAU;KAEtB,AADA,EAAM,eAAe,GAChB,MAAU,EAAM,aAAa,aAAa;IAChD;IACA,cAAc,MAAU;KAGvB,AAFA,EAAM,eAAe,GACrB,EAAM,UAAU,KAAK,IAAI,GAAG,EAAM,UAAU,CAAC,GACzC,EAAM,YAAY,KAAG,EAAY,EAAK;IAC3C;IACA,SAAS,MAAU;KAKlB,AAJA,EAAM,eAAe,GACrB,EAAM,gBAAgB,GACtB,EAAM,UAAU,GAChB,EAAY,EAAK,GACjB,EAAQ,MAAM,KAAK,EAAM,aAAa,KAAK,CAAC;IAC7C;IACA,WAAW,EACV,6QACA,KAAY,CAAC,IACV,2CACA,4DACJ;IAjCD,UAAA;KAmCC,kBAAC,GAAD;MAAQ,WAAU;MAAsC,eAAY;KAAQ,CAAA;KAC5E,kBAAC,QAAD;MAAM,WAAU;MAAuB,UAAA,KAAY,CAAC,IAAW,IAAY;KAAY,CAAA;KACtF,KACA,kBAAC,QAAD;MAAM,IAAI,GAAG,EAAG;MAAe,WAAU;MACvC,UAAA;KACI,CAAA;KAEP,kBAAC,QAAD;MAAM,WAAU;MACd,UAAA;KACI,CAAA;IACC;;GACP,EAAW,SAAS,KACpB,kBAAC,MAAD;IAAI,MAAK;IAAQ,WAAU;IACzB,UAAA,EAAW,KAAK,GAAM,MACtB,kBAAC,MAAD;KAAuC,WAAU;KAC/C,UAAA,IAAkB,EAAgB,CAAI,IAAI,GAAG,EAAK,KAAK,KAAK,IAAI,EAAQ,EAAK;IAC3E,GAFK,GAAG,EAAK,KAAK,KAAK,GAAG,GAE1B,CACJ;GACE,CAAA;EAED;;AAEP"}

package/dist/components/filter-bar.d.ts

@@ -0,0 +1,34 @@
+import type { ReactNode } from "react";
+export interface FilterBarProps {
+    /** Accessible group name. */
+    label: string;
+    /** Application-owned search, select, and date controls. */
+    children: ReactNode;
+    /** Active chips, shown on their own wrapping row. */
+    chips?: ReactNode;
+    /** Whether the clear action is available. @default false */
+    active?: boolean;
+    /** Requests clearing application-owned filters. */
+    onClear?: () => void;
+    /** Clear action text. @default "Clear filters" */
+    clearLabel?: string;
+    /** Additional root classes. */
+    className?: string;
+}
+/** Layout only; URL serialization, query execution, and date presets belong to the caller. */
+export declare function FilterBar({ label, children, chips, active, onClear, clearLabel, className, }: FilterBarProps): import("react").JSX.Element;
+export interface FilterChipProps {
+    /** Filter dimension, e.g. Status. */
+    label: string;
+    /** Display value. */
+    value: ReactNode;
+    /** Requests removal from the application's filter state. */
+    onRemove: () => void;
+    /** Full accessible removal label; defaults to Remove plus the dimension label. */
+    removeLabel?: string;
+    /** Disable removal. @default false */
+    disabled?: boolean;
+    /** Additional root classes. */
+    className?: string;
+}
+export declare function FilterChip({ label, value, onRemove, removeLabel, disabled, className, }: FilterChipProps): import("react").JSX.Element;