@setsquare/ui 0.4.0 → 0.5.0

package/dist/ui/breadcrumbs.d.ts

@@ -1,13 +1,21 @@
 export interface BreadcrumbItem {
     label: string;
     href?: string;
+    /** The label's language and direction, when it isn't the interface's: a page's own title (3.1.2). */
+    lang?: string;
+    dir?: 'ltr' | 'rtl' | 'auto';
 }
 export interface BreadcrumbsProps {
     /** Ancestors first; the last item is the current page and is not a link. */
     items: BreadcrumbItem[];
     label?: string;
+    /**
+     * For places inside the page rather than pages (a block's parents in a page builder): called with an item's index
+     * when it's pressed. Items without an `href` are still links to a screen reader.
+     */
+    onAction?: (index: number) => void;
     className?: string;
 }
 /** Where you are (WCAG 2.4.8). Every page below the top level shows one. */
-export declare function Breadcrumbs({ items, label, className }: BreadcrumbsProps): import("react").JSX.Element;
+export declare function Breadcrumbs({ items, label, onAction, className, }: BreadcrumbsProps): import("react").JSX.Element;
 //# sourceMappingURL=breadcrumbs.d.ts.map

package/dist/ui/breadcrumbs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../src/ui/breadcrumbs.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,4EAA4E;IAC5E,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4EAA4E;AAC5E,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,KAAoB,EAAE,SAAS,EAAE,EAAE,gBAAgB,+BAiCvF"}
+{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../src/ui/breadcrumbs.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qGAAqG;IACrG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC;CAC9B;AAED,MAAM,WAAW,gBAAgB;IAC/B,4EAA4E;IAC5E,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4EAA4E;AAC5E,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAoB,EACpB,QAAQ,EACR,SAAS,GACV,EAAE,gBAAgB,+BAsClB"}

package/dist/ui/breadcrumbs.js

@@ -4,9 +4,9 @@ import { Breadcrumb, Breadcrumbs as RACBreadcrumbs, Link } from 'react-aria-comp
 import { ChevronRight } from 'lucide-react';
 import { cn } from '../lib/cn.js';
 /** Where you are (WCAG 2.4.8). Every page below the top level shows one. */
-export function Breadcrumbs({ items, label = 'Breadcrumb', className }) {
-    return (_jsx("nav", { "aria-label": label, className: cn('min-w-0', className), children: _jsx(RACBreadcrumbs, { className: "flex min-w-0 items-center gap-1 text-sm", children: items.map((item, i) => (_jsxs(Breadcrumb, { id: i, className: "flex min-w-0 items-center gap-1", children: [i > 0 && (_jsx(ChevronRight, { "aria-hidden": "true", className: "size-4 shrink-0 text-muted-foreground" })), _jsx(Link, { href: item.href, className: cn(
+export function Breadcrumbs({ items, label = 'Breadcrumb', onAction, className, }) {
+    return (_jsx("nav", { "aria-label": label, className: cn('min-w-0', className), children: _jsx(RACBreadcrumbs, { className: "flex min-w-0 items-center gap-1 text-sm", onAction: onAction ? (key) => onAction(Number(key)) : undefined, children: items.map((item, i) => (_jsxs(Breadcrumb, { id: i, className: "flex min-w-0 items-center gap-1", children: [i > 0 && (_jsx(ChevronRight, { "aria-hidden": "true", className: "size-4 shrink-0 text-muted-foreground" })), _jsx(Link, { href: item.href, className: cn(
                         // The current page is not a link to press: React Aria disables it, and it keeps the default cursor.
-                        'group/crumb flex min-h-target min-w-target max-w-[20ch] cursor-pointer items-center justify-center leading-5 no-underline outline-none data-current:cursor-default'), children: _jsx("span", { className: cn('min-w-0 truncate rounded-sm text-muted-foreground underline decoration-1 underline-offset-3', 'group-data-hovered/crumb:text-foreground group-data-focus-visible/crumb:focus-ring', 'group-data-current/crumb:font-semibold group-data-current/crumb:text-foreground group-data-current/crumb:no-underline'), children: item.label }) })] }, `${i}-${item.label}`))) }) }));
+                        'group/crumb flex min-h-target min-w-target max-w-[20ch] cursor-pointer items-center justify-center leading-5 no-underline outline-none data-current:cursor-default'), children: _jsx("span", { lang: item.lang, dir: item.dir, className: cn('min-w-0 truncate rounded-sm text-muted-foreground underline decoration-1 underline-offset-3', 'group-data-hovered/crumb:text-foreground group-data-focus-visible/crumb:focus-ring', 'group-data-current/crumb:font-semibold group-data-current/crumb:text-foreground group-data-current/crumb:no-underline'), children: item.label }) })] }, `${i}-${item.label}`))) }) }));
 }
 //# sourceMappingURL=breadcrumbs.js.map

package/dist/ui/breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs.js","sourceRoot":"","sources":["../../src/ui/breadcrumbs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,WAAW,IAAI,cAAc,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AACxF,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAclC,4EAA4E;AAC5E,MAAM,UAAU,WAAW,CAAC,EAAE,KAAK,EAAE,KAAK,GAAG,YAAY,EAAE,SAAS,EAAoB;IACtF,OAAO,CACL,4BAAiB,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,YACzD,KAAC,cAAc,IAAC,SAAS,EAAC,yCAAyC,YAChE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,MAAC,UAAU,IAA4B,EAAE,EAAE,CAAC,EAAE,SAAS,EAAC,iCAAiC,aACtF,CAAC,GAAG,CAAC,IAAI,CACR,KAAC,YAAY,mBAAa,MAAM,EAAC,SAAS,EAAC,uCAAuC,GAAG,CACtF,EAED,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,SAAS,EAAE,EAAE;wBACX,oGAAoG;wBACpG,oKAAoK,CACrK,YAGD,eACE,SAAS,EAAE,EAAE,CACX,6FAA6F,EAC7F,oFAAoF,EACpF,uHAAuH,CACxH,YAEA,IAAI,CAAC,KAAK,GACN,GACF,KAtBQ,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAuBxB,CACd,CAAC,GACa,GACb,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"breadcrumbs.js","sourceRoot":"","sources":["../../src/ui/breadcrumbs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,UAAU,EAAE,WAAW,IAAI,cAAc,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AACxF,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAsBlC,4EAA4E;AAC5E,MAAM,UAAU,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,GAAG,YAAY,EACpB,QAAQ,EACR,SAAS,GACQ;IACjB,OAAO,CACL,4BAAiB,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,YACzD,KAAC,cAAc,IACb,SAAS,EAAC,yCAAyC,EACnD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,YAE9D,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,MAAC,UAAU,IAA4B,EAAE,EAAE,CAAC,EAAE,SAAS,EAAC,iCAAiC,aACtF,CAAC,GAAG,CAAC,IAAI,CACR,KAAC,YAAY,mBAAa,MAAM,EAAC,SAAS,EAAC,uCAAuC,GAAG,CACtF,EAED,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,SAAS,EAAE,EAAE;wBACX,oGAAoG;wBACpG,oKAAoK,CACrK,YAGD,eACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,SAAS,EAAE,EAAE,CACX,6FAA6F,EAC7F,oFAAoF,EACpF,uHAAuH,CACxH,YAEA,IAAI,CAAC,KAAK,GACN,GACF,KAxBQ,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAyBxB,CACd,CAAC,GACa,GACb,CACP,CAAC;AACJ,CAAC"}

package/dist/ui/button-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-styles.d.ts","sourceRoot":"","sources":["../../src/ui/button-styles.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAC1F,qGAAqG;AACrG,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;AA0C5E;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAE;IAAE,SAAS,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAO,GAAG,MAAM,CAEjG;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,GAAE;IACJ,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACf,GACL,MAAM,CAGR"}
+{"version":3,"file":"button-styles.d.ts","sourceRoot":"","sources":["../../src/ui/button-styles.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAC1F,qGAAqG;AACrG,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;AAuD5E;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAE;IAAE,SAAS,CAAC,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAO,GAAG,MAAM,CAEjG;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,GAAE;IACJ,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACf,GACL,MAAM,CAGR"}

package/dist/ui/button-styles.js

@@ -11,16 +11,26 @@ import { cn } from '../lib/cn.js';
  * The target is in the layout, not an overlay, so two neighbouring targets can never overlap.
  */
 const target = 'group/button relative inline-flex shrink-0 cursor-pointer items-center justify-center min-h-target min-w-target no-underline outline-none select-none ' +
-    'data-disabled:cursor-not-allowed data-disabled:opacity-50 data-pending:cursor-wait';
+    'data-disabled:cursor-not-allowed data-disabled:opacity-50 data-pending:cursor-wait aria-disabled:cursor-not-allowed';
 const visual = 'relative inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md border text-sm font-semibold no-underline ' +
     'transition-colors duration-(--duration-fast) ease-(--ease-standard) group-data-focus-visible/button:focus-ring ' +
     '[&_svg]:size-5 [&_svg]:shrink-0 group-data-pending/button:[&>svg:not([data-spinner])]:hidden';
+// A button that can't act right now but keeps its focus (aria-disabled, with the reason in its description):
+// muted words, on a muted ground for the filled variants and on no ground for ghost, hovered or not. Outline
+// keeps its border and ground. Not faded, so its words stay readable (muted-foreground on muted, background and
+// card are promised text pairs) and its focus ring keeps its contrast, which opacity on the paint would lose.
+const filledOff = 'group-aria-disabled/button:bg-muted group-aria-disabled/button:text-muted-foreground';
+const lineOff = 'group-aria-disabled/button:bg-transparent group-aria-disabled/button:text-muted-foreground';
 const variants = {
-    primary: 'border-transparent bg-primary text-primary-foreground group-data-hovered/button:bg-primary-hover group-data-pressed/button:bg-primary-hover',
-    secondary: 'border-transparent bg-secondary text-secondary-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent',
-    outline: 'border-input bg-background text-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent',
-    ghost: 'border-transparent bg-transparent text-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent',
-    destructive: 'border-transparent bg-destructive text-destructive-foreground group-data-hovered/button:bg-destructive-hover group-data-pressed/button:bg-destructive-hover',
+    primary: 'border-transparent bg-primary text-primary-foreground group-data-hovered/button:bg-primary-hover group-data-pressed/button:bg-primary-hover ' +
+        filledOff,
+    secondary: 'border-transparent bg-secondary text-secondary-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent ' +
+        filledOff,
+    outline: 'border-input bg-background text-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent group-aria-disabled/button:text-muted-foreground',
+    ghost: 'border-transparent bg-transparent text-foreground group-data-hovered/button:bg-accent group-data-pressed/button:bg-accent ' +
+        lineOff,
+    destructive: 'border-transparent bg-destructive text-destructive-foreground group-data-hovered/button:bg-destructive-hover group-data-pressed/button:bg-destructive-hover ' +
+        filledOff,
 };
 const sizes = {
     default: 'min-h-control px-(--control-pad-x)',

package/dist/ui/button-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-styles.js","sourceRoot":"","sources":["../../src/ui/button-styles.ts"],"names":[],"mappings":"AAAA,2GAA2G;AAC3G,0DAA0D;AAC1D,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAMlC;;;;;;;;GAQG;AACH,MAAM,MAAM,GACV,wJAAwJ;IACxJ,oFAAoF,CAAC;AAEvF,MAAM,MAAM,GACV,gIAAgI;IAChI,iHAAiH;IACjH,8FAA8F,CAAC;AAEjG,MAAM,QAAQ,GAAkC;IAC9C,OAAO,EACL,6IAA6I;IAC/I,SAAS,EACP,mIAAmI;IACrI,OAAO,EACL,oHAAoH;IACtH,KAAK,EACH,2HAA2H;IAC7H,WAAW,EACT,6JAA6J;CAChK,CAAC;AAEF,MAAM,KAAK,GAAqC;IAC9C,OAAO,EAAE,oCAAoC;IAC7C,EAAE,EAAE,uBAAuB;IAC3B,kGAAkG;IAClG,EAAE,EAAE,iCAAiC;IACrC,IAAI,EAAE,cAAc;IACpB,SAAS,EAAE,iBAAiB;CAC7B,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAC,IAAI,GAAgD,EAAE;IACvF,OAAO,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,IAAI,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;AAChE,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAChC,IAAI,GAKA,EAAE;IAEN,MAAM,EAAE,OAAO,GAAG,SAAS,EAAE,UAAU,GAAG,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IACnF,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,EAAE,SAAS,IAAI,QAAQ,EAAE,SAAS,CAAC,CAAC;AAC5F,CAAC"}
+{"version":3,"file":"button-styles.js","sourceRoot":"","sources":["../../src/ui/button-styles.ts"],"names":[],"mappings":"AAAA,2GAA2G;AAC3G,0DAA0D;AAC1D,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAMlC;;;;;;;;GAQG;AACH,MAAM,MAAM,GACV,wJAAwJ;IACxJ,qHAAqH,CAAC;AAExH,MAAM,MAAM,GACV,gIAAgI;IAChI,iHAAiH;IACjH,8FAA8F,CAAC;AAEjG,6GAA6G;AAC7G,6GAA6G;AAC7G,gHAAgH;AAChH,8GAA8G;AAC9G,MAAM,SAAS,GACb,sFAAsF,CAAC;AACzF,MAAM,OAAO,GACX,4FAA4F,CAAC;AAE/F,MAAM,QAAQ,GAAkC;IAC9C,OAAO,EACL,8IAA8I;QAC9I,SAAS;IACX,SAAS,EACP,oIAAoI;QACpI,SAAS;IACX,OAAO,EACL,qKAAqK;IACvK,KAAK,EACH,4HAA4H;QAC5H,OAAO;IACT,WAAW,EACT,8JAA8J;QAC9J,SAAS;CACZ,CAAC;AAEF,MAAM,KAAK,GAAqC;IAC9C,OAAO,EAAE,oCAAoC;IAC7C,EAAE,EAAE,uBAAuB;IAC3B,kGAAkG;IAClG,EAAE,EAAE,iCAAiC;IACrC,IAAI,EAAE,cAAc;IACpB,SAAS,EAAE,iBAAiB;CAC7B,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAC,IAAI,GAAgD,EAAE;IACvF,OAAO,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,IAAI,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;AAChE,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAChC,IAAI,GAKA,EAAE;IAEN,MAAM,EAAE,OAAO,GAAG,SAAS,EAAE,UAAU,GAAG,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IACnF,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,EAAE,SAAS,IAAI,QAAQ,EAAE,SAAS,CAAC,CAAC;AAC5F,CAAC"}

package/dist/ui/combo-box.d.ts

@@ -11,8 +11,13 @@ export interface ComboBoxProps<T extends object> extends Omit<RACComboBoxProps<T
     children: ReactNode | ((item: T) => ReactNode);
     width?: FieldWidth;
     labels?: Partial<FieldLabels>;
+    /**
+     * What the open list says when nothing is in it: "Searching…" while results load, or why nothing matched. Inside
+     * the list, because React Aria hides the rest of the page from assistive technology while the list is open.
+     */
+    emptyState?: ReactNode;
     className?: string;
 }
 /** Type to filter a long list, then choose (people, countries, projects). The list opens as you type or from the button. */
-export declare function ComboBox<T extends object>({ label, description, errorMessage, requiredMessage, validate, placeholder, children, width, labels, className, ...props }: ComboBoxProps<T>): import("react").JSX.Element;
+export declare function ComboBox<T extends object>({ label, description, errorMessage, requiredMessage, validate, placeholder, children, width, labels, emptyState, className, ...props }: ComboBoxProps<T>): import("react").JSX.Element;
 //# sourceMappingURL=combo-box.d.ts.map

package/dist/ui/combo-box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,GAAG,EACT,MAAM,uBAAuB,CAAC;AAI/B,OAAO,EAUL,KAAK,UAAU,EACf,KAAK,WAAW,EACjB,MAAM,YAAY,CAAC;AAIpB,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC3D,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,GAAG,UAAU,GAAG,UAAU,CACtC;IACC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI,KAAK,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4HAA4H;AAC5H,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAY,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,CAAC,CAAC,+BA+ClB"}
+{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,GAAG,EACT,MAAM,uBAAuB,CAAC;AAI/B,OAAO,EAUL,KAAK,UAAU,EACf,KAAK,WAAW,EACjB,MAAM,YAAY,CAAC;AAIpB,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC3D,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,GAAG,UAAU,GAAG,UAAU,CACtC;IACC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI,KAAK,MAAM,GAAG,MAAM,EAAE,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC9B;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,4HAA4H;AAC5H,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAY,EACZ,MAAM,EACN,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,CAAC,CAAC,+BA+ClB"}

package/dist/ui/combo-box.js

@@ -8,7 +8,7 @@ import { FieldDescription, FieldError, FieldLabel, fieldBox, fieldInput, fieldSt
 import { ListBox } from './list-box.js';
 import { Popover } from './menu.js';
 /** Type to filter a long list, then choose (people, countries, projects). The list opens as you type or from the button. */
-export function ComboBox({ label, description, errorMessage, requiredMessage, validate, placeholder, children, width = 'md', labels, className, ...props }) {
-    return (_jsxs(RACComboBox, { ...props, validate: withRequired(props.isRequired, requiredMessage ?? `Choose ${lcFirst(label)}`, (v) => v == null, validate), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: labels?.errorPrefix, requiredMessage: requiredMessage ?? `Choose ${lcFirst(label)}`, children: errorMessage }), _jsxs("div", { className: fieldBox, children: [_jsx(Input, { placeholder: placeholder, className: fieldInput }), _jsx(Button, { variant: "ghost", visualSize: "icon-sm", className: "me-1 justify-end", visualClassName: "text-muted-foreground group-data-hovered/button:text-foreground [&_svg]:size-4", children: _jsx(ChevronsUpDown, { "aria-hidden": "true" }) })] }), _jsx(Popover, { placement: "bottom start", className: "max-h-80", children: _jsx(ListBox, { renderEmptyState: () => (_jsx("p", { className: "px-3 py-2 text-sm text-muted-foreground", children: "No matches. Check the spelling or try fewer letters." })), children: children }) })] }));
+export function ComboBox({ label, description, errorMessage, requiredMessage, validate, placeholder, children, width = 'md', labels, emptyState, className, ...props }) {
+    return (_jsxs(RACComboBox, { ...props, validate: withRequired(props.isRequired, requiredMessage ?? `Choose ${lcFirst(label)}`, (v) => v == null, validate), className: cn(fieldStack, fieldWidths[width], className), children: [_jsx(FieldLabel, { isRequired: props.isRequired, children: label }), description && _jsx(FieldDescription, { children: description }), _jsx(FieldError, { errorPrefix: labels?.errorPrefix, requiredMessage: requiredMessage ?? `Choose ${lcFirst(label)}`, children: errorMessage }), _jsxs("div", { className: fieldBox, children: [_jsx(Input, { placeholder: placeholder, className: fieldInput }), _jsx(Button, { variant: "ghost", visualSize: "icon-sm", className: "me-1 justify-end", visualClassName: "text-muted-foreground group-data-hovered/button:text-foreground [&_svg]:size-4", children: _jsx(ChevronsUpDown, { "aria-hidden": "true" }) })] }), _jsx(Popover, { placement: "bottom start", className: "max-h-80", children: _jsx(ListBox, { renderEmptyState: () => (_jsx("p", { className: "px-3 py-2 text-sm text-muted-foreground", children: emptyState ?? 'No matches. Check the spelling or try fewer letters.' })), children: children }) })] }));
 }
 //# sourceMappingURL=combo-box.js.map

package/dist/ui/combo-box.js.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,KAAK,GAGN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,OAAO,EACP,YAAY,GAGb,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAkBpC,4HAA4H;AAC5H,MAAM,UAAU,QAAQ,CAAmB,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACS;IACjB,OAAO,CACL,MAAC,WAAW,OACL,KAA6B,EAClC,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,eAAe,IAAI,UAAU,OAAO,CAAC,KAAK,CAAC,EAAE,EAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAChB,QAAQ,CACA,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,YAAG,KAAK,GAAc,EAC7D,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IACT,WAAW,EAAE,MAAM,EAAE,WAAW,EAChC,eAAe,EAAE,eAAe,IAAI,UAAU,OAAO,CAAC,KAAK,CAAC,EAAE,YAE7D,YAAY,GACF,EACb,eAAK,SAAS,EAAE,QAAQ,aACtB,KAAC,KAAK,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,GAAI,EAE1D,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAC,SAAS,EACpB,SAAS,EAAC,kBAAkB,EAC5B,eAAe,EAAC,gFAAgF,YAEhG,KAAC,cAAc,mBAAa,MAAM,GAAG,GAC9B,IACL,EACN,KAAC,OAAO,IAAC,SAAS,EAAC,cAAc,EAAC,SAAS,EAAC,UAAU,YACpD,KAAC,OAAO,IACN,gBAAgB,EAAE,GAAG,EAAE,CAAC,CACtB,YAAG,SAAS,EAAC,yCAAyC,qEAElD,CACL,YAEA,QAAiB,GACV,GACF,IACE,CACf,CAAC;AACJ,CAAC"}
+{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../src/ui/combo-box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,KAAK,GAGN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,OAAO,EACP,YAAY,GAGb,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAuBpC,4HAA4H;AAC5H,MAAM,UAAU,QAAQ,CAAmB,EACzC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAK,GAAG,IAAI,EACZ,MAAM,EACN,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACS;IACjB,OAAO,CACL,MAAC,WAAW,OACL,KAA6B,EAClC,QAAQ,EACN,YAAY,CACV,KAAK,CAAC,UAAU,EAChB,eAAe,IAAI,UAAU,OAAO,CAAC,KAAK,CAAC,EAAE,EAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,IAAI,EAChB,QAAQ,CACA,EAEZ,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,aAExD,KAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,YAAG,KAAK,GAAc,EAC7D,WAAW,IAAI,KAAC,gBAAgB,cAAE,WAAW,GAAoB,EAClE,KAAC,UAAU,IACT,WAAW,EAAE,MAAM,EAAE,WAAW,EAChC,eAAe,EAAE,eAAe,IAAI,UAAU,OAAO,CAAC,KAAK,CAAC,EAAE,YAE7D,YAAY,GACF,EACb,eAAK,SAAS,EAAE,QAAQ,aACtB,KAAC,KAAK,IAAC,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,GAAI,EAE1D,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAC,SAAS,EACpB,SAAS,EAAC,kBAAkB,EAC5B,eAAe,EAAC,gFAAgF,YAEhG,KAAC,cAAc,mBAAa,MAAM,GAAG,GAC9B,IACL,EACN,KAAC,OAAO,IAAC,SAAS,EAAC,cAAc,EAAC,SAAS,EAAC,UAAU,YACpD,KAAC,OAAO,IACN,gBAAgB,EAAE,GAAG,EAAE,CAAC,CACtB,YAAG,SAAS,EAAC,yCAAyC,YACnD,UAAU,IAAI,sDAAsD,GACnE,CACL,YAEA,QAAiB,GACV,GACF,IACE,CACf,CAAC;AACJ,CAAC"}

package/dist/ui/drop-indicator.d.ts

@@ -0,0 +1,21 @@
+import { type DropIndicatorProps as RACDropIndicatorProps } from 'react-aria-components';
+export interface DropIndicatorProps extends Omit<RACDropIndicatorProps, 'className' | 'style'> {
+    /**
+     * What the line is drawn over. `surface` (the default): the editor's own lists, a 4px `brand` line with a 2px
+     * `background` halo. `canvas`: a page the product doesn't style, such as a page builder's canvas, a 4px
+     * `canvas-mark` line with a 2px `canvas-mark-halo` halo, the same in every theme, so one of the two tones has
+     * 3:1 against whatever is underneath.
+     */
+    tone?: 'surface' | 'canvas';
+    className?: string;
+}
+/**
+ * Where a dragged row will land, between two rows of a Tree or a GridList. Give it to `useDragAndDrop`'s
+ * `renderDropIndicator`: `renderDropIndicator: (target) => <DropIndicator target={target} />`.
+ *
+ * Two tones, so it reads on any surface: a 4px line with a 2px halo. It takes no room until it's the target, so
+ * rows never jump while something is dragged over them. React Aria names it for a screen reader ("Insert between
+ * Hero and Fixtures") and moves through these by keyboard during a drag.
+ */
+export declare function DropIndicator({ tone, className, ...props }: DropIndicatorProps): import("react").JSX.Element;
+//# sourceMappingURL=drop-indicator.d.ts.map

package/dist/ui/drop-indicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drop-indicator.d.ts","sourceRoot":"","sources":["../../src/ui/drop-indicator.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,kBAAkB,IAAI,qBAAqB,EACjD,MAAM,uBAAuB,CAAC;AAG/B,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,qBAAqB,EAAE,WAAW,GAAG,OAAO,CAAC;IAC5F;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,aAAa,CAAC,EAAE,IAAgB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,+BAkB1F"}

package/dist/ui/drop-indicator.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DropIndicator as RACDropIndicator, } from 'react-aria-components';
+import { cn } from '../lib/cn.js';
+/**
+ * Where a dragged row will land, between two rows of a Tree or a GridList. Give it to `useDragAndDrop`'s
+ * `renderDropIndicator`: `renderDropIndicator: (target) => <DropIndicator target={target} />`.
+ *
+ * Two tones, so it reads on any surface: a 4px line with a 2px halo. It takes no room until it's the target, so
+ * rows never jump while something is dragged over them. React Aria names it for a screen reader ("Insert between
+ * Hero and Fixtures") and moves through these by keyboard during a drag.
+ */
+export function DropIndicator({ tone = 'surface', className, ...props }) {
+    return (_jsx(RACDropIndicator, { ...props, className: ({ isDropTarget }) => cn('relative z-10 h-0 outline-none', isDropTarget &&
+            "before:absolute before:inset-x-2 before:-top-0.5 before:h-1 before:rounded-full before:content-[''] forced-colors:before:bg-[Highlight] forced-colors:before:forced-color-adjust-none", isDropTarget &&
+            (tone === 'canvas'
+                ? 'before:bg-canvas-mark before:shadow-[0_0_0_2px_var(--canvas-mark-halo)]'
+                : 'before:bg-brand before:shadow-[0_0_0_2px_var(--background)]'), className) }));
+}
+//# sourceMappingURL=drop-indicator.js.map

package/dist/ui/drop-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drop-indicator.js","sourceRoot":"","sources":["../../src/ui/drop-indicator.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EACL,aAAa,IAAI,gBAAgB,GAElC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAalC;;;;;;;GAOG;AACH,MAAM,UAAU,aAAa,CAAC,EAAE,IAAI,GAAG,SAAS,EAAE,SAAS,EAAE,GAAG,KAAK,EAAsB;IACzF,OAAO,CACL,KAAC,gBAAgB,OACX,KAAK,EACT,SAAS,EAAE,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAC9B,EAAE,CACA,gCAAgC,EAChC,YAAY;YACV,uLAAuL,EACzL,YAAY;YACV,CAAC,IAAI,KAAK,QAAQ;gBAChB,CAAC,CAAC,yEAAyE;gBAC3E,CAAC,CAAC,6DAA6D,CAAC,EACpE,SAAS,CACV,GAEH,CACH,CAAC;AACJ,CAAC"}

package/dist/ui/grid-list.d.ts

@@ -7,8 +7,13 @@ export interface GridListProps<T extends object> extends Omit<RACGridListProps<T
 }
 /**
  * A list of items people act on — members, files, integrations — where each row can hold its own buttons.
- * Arrow keys move between rows, Tab reaches the buttons in a row. With `selectionMode="multiple"` every row
- * gets a SelectionCheckbox; Space or a click on the row toggles it. The list is `relative` because it scrolls.
+ * ↑ ↓ move between rows and → through a row's own controls; Tab leaves the list. With
+ * `selectionMode="multiple"` every row gets a SelectionCheckbox; Space or a click on the row toggles it. The list is `relative` because it scrolls,
+ * and because React Aria positions its drop indicators absolutely.
+ *
+ * Drag and drop: pass `dragAndDropHooks` from React Aria's `useDragAndDrop`, with
+ * `renderDropIndicator: (target) => <DropIndicator target={target} />`. Every draggable row then shows a drag
+ * button, which is how a keyboard or screen reader drag starts.
  */
 export declare function GridList<T extends object>({ className, ...props }: GridListProps<T>): import("react").JSX.Element;
 export interface GridListItemProps extends Omit<RACGridListItemProps, 'className' | 'children'> {
@@ -17,8 +22,10 @@ export interface GridListItemProps extends Omit<RACGridListItemProps, 'className
     description?: ReactNode;
     /** Buttons for this row only. Name them with the row ("Remove Priya Shah"). */
     actions?: ReactNode;
+    /** Words for the drag button, when the row can be dragged. React Aria's own ("Drag {name}") by default. */
+    dragLabel?: string;
     className?: string;
 }
 /** Selected: brand-subtle, the 3px sidebar-primary marker and a ticked box — the same signals as a table row. */
-export declare function GridListItem({ children, description, actions, className, ...props }: GridListItemProps): import("react").JSX.Element;
+export declare function GridListItem({ children, description, actions, dragLabel, className, ...props }: GridListItemProps): import("react").JSX.Element;
 //# sourceMappingURL=grid-list.d.ts.map

package/dist/ui/grid-list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-list.d.ts","sourceRoot":"","sources":["../../src/ui/grid-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAGL,KAAK,iBAAiB,IAAI,oBAAoB,EAC9C,KAAK,aAAa,IAAI,gBAAgB,EACvC,MAAM,uBAAuB,CAAC;AAI/B,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC;IAC7F,iDAAiD;IACjD,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,CAAC,CAAC,+BAUnF;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,WAAW,GAAG,UAAU,CAAC;IAC7F,QAAQ,EAAE,SAAS,CAAC;IACpB,sDAAsD;IACtD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,+EAA+E;IAC/E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iHAAiH;AACjH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,iBAAiB,+BA6BnB"}
+{"version":3,"file":"grid-list.d.ts","sourceRoot":"","sources":["../../src/ui/grid-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAIL,KAAK,iBAAiB,IAAI,oBAAoB,EAC9C,KAAK,aAAa,IAAI,gBAAgB,EACvC,MAAM,uBAAuB,CAAC;AAI/B,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC;IAC7F,iDAAiD;IACjD,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,CAAC,CAAC,+BAWnF;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,WAAW,GAAG,UAAU,CAAC;IAC7F,QAAQ,EAAE,SAAS,CAAC;IACpB,sDAAsD;IACtD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,+EAA+E;IAC/E,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,2GAA2G;IAC3G,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iHAAiH;AACjH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,SAAS,EACT,GAAG,KAAK,EACT,EAAE,iBAAiB,+BAgDnB"}

package/dist/ui/grid-list.js

@@ -1,21 +1,32 @@
 'use client';
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { GridList as RACGridList, GridListItem as RACGridListItem, } from 'react-aria-components';
+import { GripVertical } from 'lucide-react';
+import { Button as RACButton, GridList as RACGridList, GridListItem as RACGridListItem, } from 'react-aria-components';
 import { cn } from '../lib/cn.js';
 import { SelectionCheckbox } from './checkbox.js';
 /**
  * A list of items people act on — members, files, integrations — where each row can hold its own buttons.
- * Arrow keys move between rows, Tab reaches the buttons in a row. With `selectionMode="multiple"` every row
- * gets a SelectionCheckbox; Space or a click on the row toggles it. The list is `relative` because it scrolls.
+ * ↑ ↓ move between rows and → through a row's own controls; Tab leaves the list. With
+ * `selectionMode="multiple"` every row gets a SelectionCheckbox; Space or a click on the row toggles it. The list is `relative` because it scrolls,
+ * and because React Aria positions its drop indicators absolutely.
+ *
+ * Drag and drop: pass `dragAndDropHooks` from React Aria's `useDragAndDrop`, with
+ * `renderDropIndicator: (target) => <DropIndicator target={target} />`. Every draggable row then shows a drag
+ * button, which is how a keyboard or screen reader drag starts.
  */
 export function GridList({ className, ...props }) {
-    return (_jsx(RACGridList, { ...props, className: cn('relative flex max-h-[inherit] flex-col overflow-auto rounded-lg border border-border bg-card text-sm outline-none data-focus-visible:focus-ring', className) }));
+    return (_jsx(RACGridList, { ...props, className: cn('relative flex max-h-[inherit] flex-col overflow-auto rounded-lg border border-border bg-card text-sm outline-none data-focus-visible:focus-ring', 'data-drop-target:bg-brand-subtle data-drop-target:outline-2 data-drop-target:outline-solid data-drop-target:outline-brand data-drop-target:-outline-offset-2', className) }));
 }
 /** Selected: brand-subtle, the 3px sidebar-primary marker and a ticked box — the same signals as a table row. */
-export function GridListItem({ children, description, actions, className, ...props }) {
+export function GridListItem({ children, description, actions, dragLabel, className, ...props }) {
     const textValue = props.textValue ?? (typeof children === 'string' ? children : undefined);
-    return (_jsx(RACGridListItem, { ...props, textValue: textValue, className: cn(
+    return (_jsx(RACGridListItem, { ...props, textValue: textValue, className: ({ allowsDragging }) => cn(
         // React Aria sets data-hovered only on a row that can be selected or has an action: the pointer then.
-        'group/item relative flex min-h-[calc(var(--control-height)+12px)] cursor-default items-center gap-3 border-b border-border px-3 py-1.5 outline-none last:border-b-0', 'data-hovered:cursor-pointer data-disabled:cursor-not-allowed data-hovered:bg-accent data-selected:bg-brand-subtle data-selected:shadow-[inset_3px_0_0_var(--sidebar-primary)] data-focus-visible:focus-ring-inset data-disabled:opacity-60', className), children: ({ selectionMode, selectionBehavior }) => (_jsxs(_Fragment, { children: [selectionMode !== 'none' && selectionBehavior === 'toggle' && (_jsx(SelectionCheckbox, { className: "-ml-1" })), _jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "leading-5 font-medium text-foreground", children: children }), description && (_jsx("span", { className: "text-[13px] leading-5 text-muted-foreground", children: description }))] }), actions && _jsx("span", { className: "flex shrink-0 items-center gap-1", children: actions })] })) }));
+        'group/item relative flex min-h-[calc(var(--control-height)+12px)] cursor-default items-center gap-3 border-b border-border py-1.5 pe-3 outline-none last:border-b-0', 
+        // A draggable row starts with its drag button, whose target is wider than its paint: the row gives it
+        // the start padding rather than the button reaching into it.
+        allowsDragging ? 'ps-1' : 'ps-3', 'data-hovered:cursor-pointer data-disabled:cursor-not-allowed data-hovered:bg-accent data-selected:bg-brand-subtle data-selected:shadow-[inset_3px_0_0_var(--sidebar-primary)] data-focus-visible:focus-ring-inset data-disabled:opacity-60', 'data-dragging:opacity-50 data-drop-target:bg-brand-subtle data-drop-target:outline-2 data-drop-target:outline-solid data-drop-target:outline-brand data-drop-target:-outline-offset-2', 
+        // Forced colours drop the selected ground and the inset marker: draw the marker in Highlight instead.
+        "forced-colors:data-selected:before:absolute forced-colors:data-selected:before:inset-y-1 forced-colors:data-selected:before:start-0 forced-colors:data-selected:before:w-[3px] forced-colors:data-selected:before:bg-[Highlight] forced-colors:data-selected:before:forced-color-adjust-none forced-colors:data-selected:before:content-['']", className), children: ({ selectionMode, selectionBehavior, allowsDragging }) => (_jsxs(_Fragment, { children: [allowsDragging && (_jsx(RACButton, { slot: "drag", "aria-label": dragLabel, className: "group/grid-drag relative flex min-h-target min-w-target shrink-0 cursor-grab items-center justify-center outline-none", children: _jsx("span", { className: "flex size-control-sm items-center justify-center rounded-md text-muted-foreground group-data-focus-visible/grid-drag:focus-ring group-data-hovered/grid-drag:bg-muted group-data-hovered/grid-drag:text-foreground", children: _jsx(GripVertical, { "aria-hidden": "true", className: "size-4" }) }) })), selectionMode !== 'none' && selectionBehavior === 'toggle' && (_jsx(SelectionCheckbox, { className: "-ml-1" })), _jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "leading-5 font-medium text-foreground", children: children }), description && (_jsx("span", { className: "text-[13px] leading-5 text-muted-foreground", children: description }))] }), actions && _jsx("span", { className: "flex shrink-0 items-center gap-1", children: actions })] })) }));
 }
 //# sourceMappingURL=grid-list.js.map

package/dist/ui/grid-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-list.js","sourceRoot":"","sources":["../../src/ui/grid-list.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,QAAQ,IAAI,WAAW,EACvB,YAAY,IAAI,eAAe,GAGhC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAQlD;;;;GAIG;AACH,MAAM,UAAU,QAAQ,CAAmB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB;IAClF,OAAO,CACL,KAAC,WAAW,OACN,KAAK,EACT,SAAS,EAAE,EAAE,CACX,iJAAiJ,EACjJ,SAAS,CACV,GACD,CACH,CAAC;AACJ,CAAC;AAWD,iHAAiH;AACjH,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACU;IAClB,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI,CAAC,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC3F,OAAO,CACL,KAAC,eAAe,OACV,KAAK,EACT,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,EAAE;QACX,sGAAsG;QACtG,qKAAqK,EACrK,4OAA4O,EAC5O,SAAS,CACV,YAEA,CAAC,EAAE,aAAa,EAAE,iBAAiB,EAAE,EAAE,EAAE,CAAC,CACzC,8BACG,aAAa,KAAK,MAAM,IAAI,iBAAiB,KAAK,QAAQ,IAAI,CAC7D,KAAC,iBAAiB,IAAC,SAAS,EAAC,OAAO,GAAG,CACxC,EACD,gBAAM,SAAS,EAAC,8BAA8B,aAC5C,eAAM,SAAS,EAAC,uCAAuC,YAAE,QAAQ,GAAQ,EACxE,WAAW,IAAI,CACd,eAAM,SAAS,EAAC,6CAA6C,YAAE,WAAW,GAAQ,CACnF,IACI,EACN,OAAO,IAAI,eAAM,SAAS,EAAC,kCAAkC,YAAE,OAAO,GAAQ,IAC9E,CACJ,GACe,CACnB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"grid-list.js","sourceRoot":"","sources":["../../src/ui/grid-list.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EACL,MAAM,IAAI,SAAS,EACnB,QAAQ,IAAI,WAAW,EACvB,YAAY,IAAI,eAAe,GAGhC,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAQlD;;;;;;;;;GASG;AACH,MAAM,UAAU,QAAQ,CAAmB,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB;IAClF,OAAO,CACL,KAAC,WAAW,OACN,KAAK,EACT,SAAS,EAAE,EAAE,CACX,iJAAiJ,EACjJ,8JAA8J,EAC9J,SAAS,CACV,GACD,CACH,CAAC;AACJ,CAAC;AAaD,iHAAiH;AACjH,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,SAAS,EACT,SAAS,EACT,GAAG,KAAK,EACU;IAClB,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI,CAAC,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC3F,OAAO,CACL,KAAC,eAAe,OACV,KAAK,EACT,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,CAAC,EAAE,cAAc,EAAE,EAAE,EAAE,CAChC,EAAE;QACA,sGAAsG;QACtG,qKAAqK;QACrK,sGAAsG;QACtG,6DAA6D;QAC7D,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAChC,4OAA4O,EAC5O,uLAAuL;QACvL,sGAAsG;QACtG,8UAA8U,EAC9U,SAAS,CACV,YAGF,CAAC,EAAE,aAAa,EAAE,iBAAiB,EAAE,cAAc,EAAE,EAAE,EAAE,CAAC,CACzD,8BACG,cAAc,IAAI,CACjB,KAAC,SAAS,IACR,IAAI,EAAC,MAAM,gBACC,SAAS,EACrB,SAAS,EAAC,uHAAuH,YAEjI,eAAM,SAAS,EAAC,oNAAoN,YAClO,KAAC,YAAY,mBAAa,MAAM,EAAC,SAAS,EAAC,QAAQ,GAAG,GACjD,GACG,CACb,EACA,aAAa,KAAK,MAAM,IAAI,iBAAiB,KAAK,QAAQ,IAAI,CAC7D,KAAC,iBAAiB,IAAC,SAAS,EAAC,OAAO,GAAG,CACxC,EACD,gBAAM,SAAS,EAAC,8BAA8B,aAC5C,eAAM,SAAS,EAAC,uCAAuC,YAAE,QAAQ,GAAQ,EACxE,WAAW,IAAI,CACd,eAAM,SAAS,EAAC,6CAA6C,YAAE,WAAW,GAAQ,CACnF,IACI,EACN,OAAO,IAAI,eAAM,SAAS,EAAC,kCAAkC,YAAE,OAAO,GAAQ,IAC9E,CACJ,GACe,CACnB,CAAC;AACJ,CAAC"}

package/dist/ui/switch.d.ts

@@ -7,7 +7,8 @@ export interface SwitchProps extends Omit<RACSwitchProps, 'className' | 'childre
 }
 /**
  * On/off that takes effect immediately — confirm the change with a status message. Inside a form that is
- * submitted later, use a Checkbox. On: the thumb moves right and the track fills, never colour alone.
+ * submitted later, use a Checkbox. On: the thumb moves right and the track fills, never colour alone. In forced
+ * colours the track and thumb are drawn in the system's colours (Canvas and CanvasText, Highlight when on).
  */
 export declare function Switch({ children, description, className, ...props }: SwitchProps): import("react").JSX.Element;
 //# sourceMappingURL=switch.d.ts.map

package/dist/ui/switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAuB,KAAK,WAAW,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGhG,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,EAAE,WAAW,GAAG,UAAU,CAAC;IACjF,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,+BA+BjF"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAuB,KAAK,WAAW,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGhG,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,EAAE,WAAW,GAAG,UAAU,CAAC;IACjF,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,+BAkCjF"}

package/dist/ui/switch.js

@@ -4,9 +4,12 @@ import { Switch as RACSwitch } from 'react-aria-components';
 import { cn } from '../lib/cn.js';
 /**
  * On/off that takes effect immediately — confirm the change with a status message. Inside a form that is
- * submitted later, use a Checkbox. On: the thumb moves right and the track fills, never colour alone.
+ * submitted later, use a Checkbox. On: the thumb moves right and the track fills, never colour alone. In forced
+ * colours the track and thumb are drawn in the system's colours (Canvas and CanvasText, Highlight when on).
  */
 export function Switch({ children, description, className, ...props }) {
-    return (_jsxs(RACSwitch, { ...props, className: cn('group/choice relative flex min-h-target cursor-pointer items-start gap-3 py-[calc((var(--target-min)-var(--choice-size))/2)] text-sm leading-5 text-foreground outline-none data-disabled:cursor-not-allowed data-disabled:opacity-60 data-readonly:cursor-default', className), children: [_jsx("span", { "aria-hidden": "true", className: cn('relative mt-[calc((20px-var(--choice-size))/2)] h-choice w-[calc(var(--choice-size)*1.8)] shrink-0 rounded-full border border-input bg-muted transition-colors duration-(--duration-fast)', 'group-data-focus-visible/choice:focus-ring group-data-selected/choice:border-primary group-data-selected/choice:bg-primary'), children: _jsx("span", { className: cn('absolute top-1/2 left-[2px] size-[calc(var(--choice-size)-6px)] -translate-y-1/2 rounded-full bg-muted-foreground', 'transition-[left] duration-(--duration-fast) motion-reduce:transition-none aaa:transition-none', 'group-data-selected/choice:left-[calc(100%-var(--choice-size)+4px)] group-data-selected/choice:bg-primary-foreground') }) }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [_jsx("span", { children: children }), description && _jsx("span", { className: "text-[13px] text-muted-foreground", children: description })] })] }));
+    return (_jsxs(RACSwitch, { ...props, className: cn('group/choice relative flex min-h-target cursor-pointer items-start gap-3 py-[calc((var(--target-min)-var(--choice-size))/2)] text-sm leading-5 text-foreground outline-none data-disabled:cursor-not-allowed data-disabled:opacity-60 data-readonly:cursor-default', className), children: [_jsx("span", { "aria-hidden": "true", className: cn('relative mt-[calc((20px-var(--choice-size))/2)] h-choice w-[calc(var(--choice-size)*1.8)] shrink-0 rounded-full border border-input bg-muted transition-colors duration-(--duration-fast)', 'group-data-focus-visible/choice:focus-ring group-data-selected/choice:border-primary group-data-selected/choice:bg-primary', 
+                // Forced colours drop backgrounds, and with them the thumb: the system's colours, kept, draw it instead.
+                'forced-colors:border-[CanvasText] forced-colors:bg-[Canvas] forced-colors:forced-color-adjust-none forced-colors:group-data-selected/choice:border-[Highlight] forced-colors:group-data-selected/choice:bg-[Highlight]'), children: _jsx("span", { className: cn('absolute top-1/2 left-[2px] size-[calc(var(--choice-size)-6px)] -translate-y-1/2 rounded-full bg-muted-foreground', 'transition-[left] duration-(--duration-fast) motion-reduce:transition-none aaa:transition-none', 'group-data-selected/choice:left-[calc(100%-var(--choice-size)+4px)] group-data-selected/choice:bg-primary-foreground', 'forced-colors:bg-[CanvasText] forced-colors:group-data-selected/choice:bg-[HighlightText]') }) }), _jsxs("span", { className: "flex min-w-0 flex-col", children: [_jsx("span", { children: children }), description && _jsx("span", { className: "text-[13px] text-muted-foreground", children: description })] })] }));
 }
 //# sourceMappingURL=switch.js.map

package/dist/ui/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,MAAM,IAAI,SAAS,EAAsC,MAAM,uBAAuB,CAAC;AAChG,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC;;;GAGG;AACH,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAe;IAChF,OAAO,CAEL,MAAC,SAAS,OACJ,KAAK,EACT,SAAS,EAAE,EAAE,CACX,oQAAoQ,EACpQ,SAAS,CACV,aAED,8BACc,MAAM,EAClB,SAAS,EAAE,EAAE,CACX,2LAA2L,EAC3L,4HAA4H,CAC7H,YAED,eACE,SAAS,EAAE,EAAE,CACX,mHAAmH,EACnH,gGAAgG,EAChG,sHAAsH,CACvH,GACD,GACG,EACP,gBAAM,SAAS,EAAC,uBAAuB,aACrC,yBAAO,QAAQ,GAAQ,EACtB,WAAW,IAAI,eAAM,SAAS,EAAC,mCAAmC,YAAE,WAAW,GAAQ,IACnF,IACG,CACb,CAAC;AACJ,CAAC"}
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,MAAM,IAAI,SAAS,EAAsC,MAAM,uBAAuB,CAAC;AAChG,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC;;;;GAIG;AACH,MAAM,UAAU,MAAM,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,KAAK,EAAe;IAChF,OAAO,CAEL,MAAC,SAAS,OACJ,KAAK,EACT,SAAS,EAAE,EAAE,CACX,oQAAoQ,EACpQ,SAAS,CACV,aAED,8BACc,MAAM,EAClB,SAAS,EAAE,EAAE,CACX,2LAA2L,EAC3L,4HAA4H;gBAC5H,yGAAyG;gBACzG,wNAAwN,CACzN,YAED,eACE,SAAS,EAAE,EAAE,CACX,mHAAmH,EACnH,gGAAgG,EAChG,sHAAsH,EACtH,2FAA2F,CAC5F,GACD,GACG,EACP,gBAAM,SAAS,EAAC,uBAAuB,aACrC,yBAAO,QAAQ,GAAQ,EACtB,WAAW,IAAI,eAAM,SAAS,EAAC,mCAAmC,YAAE,WAAW,GAAQ,IACnF,IACG,CACb,CAAC;AACJ,CAAC"}

package/dist/ui/toolbar.d.ts

@@ -0,0 +1,22 @@
+import { type ToolbarProps as RACToolbarProps } from 'react-aria-components';
+export interface ToolbarProps extends Omit<RACToolbarProps, 'className' | 'aria-label'> {
+    /** Required: what the buttons act on, such as "Fixtures actions". */
+    'aria-label': string;
+    className?: string;
+}
+/**
+ * A row of buttons that act on one thing: a block on a canvas, a selection, a rich text field. React Aria's
+ * Toolbar, so it is one stop in the tab order: ← → (↑ ↓ when vertical) move between its buttons, Home and End go to
+ * the ends, and Tab leaves it. It wraps instead of overflowing, so nothing is cut off at 320px (1.4.10); a toolbar
+ * that would wrap onto more than two lines should move its less-used commands into a `MenuTrigger` at its end.
+ * Buttons inside it are ordinary `IconButton`s and `Button`s, at least `--target-min` square, `--control-gap`
+ * apart. A button that can't act right now (Move up on the first block) is better left enabled with
+ * `aria-disabled="true"` and a reason in its description than `isDisabled`: React Aria skips disabled buttons,
+ * so a button that disables itself while focused would drop focus.
+ */
+export declare function Toolbar({ className, orientation, ...props }: ToolbarProps): import("react").JSX.Element;
+/** A line between groups of buttons in a Toolbar. Decorative to sight, a separator to a screen reader. */
+export declare function ToolbarSeparator({ className }: {
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=toolbar.d.ts.map

package/dist/ui/toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.d.ts","sourceRoot":"","sources":["../../src/ui/toolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGL,KAAK,YAAY,IAAI,eAAe,EACrC,MAAM,uBAAuB,CAAC;AAG/B,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,eAAe,EAAE,WAAW,GAAG,YAAY,CAAC;IACrF,qEAAqE;IACrE,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,WAA0B,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BAWxF;AAED,0GAA0G;AAC1G,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAOrE"}

package/dist/ui/toolbar.js

@@ -0,0 +1,22 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Separator as RACSeparator, Toolbar as RACToolbar, } from 'react-aria-components';
+import { cn } from '../lib/cn.js';
+/**
+ * A row of buttons that act on one thing: a block on a canvas, a selection, a rich text field. React Aria's
+ * Toolbar, so it is one stop in the tab order: ← → (↑ ↓ when vertical) move between its buttons, Home and End go to
+ * the ends, and Tab leaves it. It wraps instead of overflowing, so nothing is cut off at 320px (1.4.10); a toolbar
+ * that would wrap onto more than two lines should move its less-used commands into a `MenuTrigger` at its end.
+ * Buttons inside it are ordinary `IconButton`s and `Button`s, at least `--target-min` square, `--control-gap`
+ * apart. A button that can't act right now (Move up on the first block) is better left enabled with
+ * `aria-disabled="true"` and a reason in its description than `isDisabled`: React Aria skips disabled buttons,
+ * so a button that disables itself while focused would drop focus.
+ */
+export function Toolbar({ className, orientation = 'horizontal', ...props }) {
+    return (_jsx(RACToolbar, { orientation: orientation, ...props, className: cn('flex flex-wrap items-center gap-(--control-gap) outline-none aria-[orientation=vertical]:flex-col', className) }));
+}
+/** A line between groups of buttons in a Toolbar. Decorative to sight, a separator to a screen reader. */
+export function ToolbarSeparator({ className }) {
+    return (_jsx(RACSeparator, { orientation: "vertical", className: cn('mx-0.5 h-6 w-px self-center bg-border', className) }));
+}
+//# sourceMappingURL=toolbar.js.map

package/dist/ui/toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.js","sourceRoot":"","sources":["../../src/ui/toolbar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EACL,SAAS,IAAI,YAAY,EACzB,OAAO,IAAI,UAAU,GAEtB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC;;;;;;;;;GASG;AACH,MAAM,UAAU,OAAO,CAAC,EAAE,SAAS,EAAE,WAAW,GAAG,YAAY,EAAE,GAAG,KAAK,EAAgB;IACvF,OAAO,CACL,KAAC,UAAU,IACT,WAAW,EAAE,WAAW,KACpB,KAAK,EACT,SAAS,EAAE,EAAE,CACX,mGAAmG,EACnG,SAAS,CACV,GACD,CACH,CAAC;AACJ,CAAC;AAED,0GAA0G;AAC1G,MAAM,UAAU,gBAAgB,CAAC,EAAE,SAAS,EAA0B;IACpE,OAAO,CACL,KAAC,YAAY,IACX,WAAW,EAAC,UAAU,EACtB,SAAS,EAAE,EAAE,CAAC,uCAAuC,EAAE,SAAS,CAAC,GACjE,CACH,CAAC;AACJ,CAAC"}

package/dist/ui/tree.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
 import { TreeSection as RACTreeSection, type TreeItemProps as RACTreeItemProps, type TreeProps as RACTreeProps } from 'react-aria-components';
+import { type IconProp } from './icon.js';
 /** A tree is named by a visible heading (`aria-labelledby`) or, when it has none, by `aria-label`. */
 type TreeName = {
     'aria-label': string;
@@ -10,11 +11,19 @@ export type TreeProps<T extends object> = Omit<RACTreeProps<T>, 'className' | 'a
     className?: string;
 };
 /**
- * Nested things people open, close and act on: the steps of a workflow and their outcomes, operations grouped by
- * resource. React Aria's Tree, a `treegrid` and one tab stop. ↑ ↓ move between rows, → opens a row and ← closes
- * it, Home and End go to the ends, and typing jumps to the next row whose name starts with what you typed. On an
- * open row, → moves to the row's own buttons. The tree is `relative` because it scrolls, and because React Aria
- * positions its drop indicators absolutely.
+ * Nested things people open, close and act on: the blocks of a page, the steps of a workflow and their outcomes,
+ * operations grouped by resource. React Aria's Tree, a `treegrid` and one tab stop. ↑ ↓ move between rows, → opens a
+ * row and ← closes it, Home and End go to the ends, and typing jumps to the next row whose name starts with what you
+ * typed. On an open row, → moves to the row's own buttons.
+ *
+ * It draws no box of its own: rows sit on whatever surface holds the tree (a panel, a card), `--nav-item-gap`
+ * apart, like a nav list. The tree is `relative` because it scrolls, and because React Aria positions its drop
+ * indicators absolutely.
+ *
+ * Drag and drop: pass `dragAndDropHooks` from React Aria's `useDragAndDrop`, with
+ * `renderDropIndicator: (target) => <DropIndicator target={target} />`. Every draggable row then shows a drag
+ * button, which is how a keyboard or screen reader drag starts: Enter on it, ↑ ↓ to a drop place, Enter to drop,
+ * Esc to cancel.
  */
 export declare function Tree<T extends object>({ className, ...props }: TreeProps<T>): import("react").JSX.Element;
 export interface TreeItemProps<T extends object = object> extends Omit<RACTreeItemProps<T>, 'className' | 'children' | 'textValue' | 'style'> {
@@ -22,21 +31,57 @@ export interface TreeItemProps<T extends object = object> extends Omit<RACTreeIt
     title: ReactNode;
     /** Required when `title` isn't a string: the words typeahead matches and a screen reader reads. */
     textValue?: string;
-    /** Second line: a type, a count, a status in words. */
+    /** What kind of thing the row is: a block's type, a step's verb. 16px, `brand` while the row is selected. */
+    icon?: IconProp;
+    /**
+     * A few words after the title, on the same line: a block's heading, a count. When they don't fit beside the
+     * title they move under it and wrap there. They're never cut short, so text spacing and zoom lose none of them
+     * (1.4.12). A string is added to the row's accessible name, so the words are never only seen.
+     */
     description?: ReactNode;
-    /** Buttons for this row only. Name them with the row ("More actions for Create candidate"). */
+    /**
+     * A `StatusBadge` for this row: a check result ("2nd H1"), a draft, a lock. It sits after the description,
+     * before the actions. Always an icon and a word.
+     */
+    status?: ReactNode;
+    /**
+     * The status in words for a screen reader ("2nd H1, must fix"). React Aria names a row from its `textValue`
+     * alone, so without this the status is only seen, never heard. Added to the row's name after the description.
+     */
+    statusLabel?: string;
+    /**
+     * Buttons for this row only. Name them with the row ("Actions for Fixtures"). They show on the selected row,
+     * the row with focus and the row under the pointer, so the tree stays quiet; keyboard focus on a row shows them
+     * before → reaches them. `alwaysShowActions` keeps them showing, for a row that can't be selected.
+     */
     actions?: ReactNode;
+    alwaysShowActions?: boolean;
     /** The rows inside this one: `TreeItem`s, or a React Aria `Collection` of them. */
     children?: ReactNode;
+    /** Words for the drag button, when the row can be dragged. React Aria's own ("Drag {title}") by default. */
+    dragLabel?: string;
+    /**
+     * `false` leaves the drag button off a row that can't move, such as a column in a page layout, in a tree that
+     * otherwise drags. React Aria has no per-row switch for dragging (only for `disabledBehavior="all"`, which also
+     * takes the row out of focus), so the tree's `getItems` should give such a row a type its drop targets refuse.
+     */
+    allowsDragging?: boolean;
     className?: string;
 }
 /**
- * One row and the rows inside it. A row with children has a chevron: a target at least `--target-min` square
- * around a `--control-height-sm` paint, which React Aria keeps out of the tab order, since → and ← do the same.
- * Each level indents by the chevron's width. Selected: brand-subtle and the 3px sidebar-primary marker, as in a
- * GridList; with multiple selection, a ticked box too.
+ * One row and the rows inside it, on one line while it fits: chevron, icon, title, description, status, then its
+ * buttons. Each level indents by `--tree-indent` (16px). A row is at least `--nav-item-height` tall and `--target-min` at AAA,
+ * rounded, with the `accent` ground on hover. Selected: `brand-subtle`, the 3px `sidebar-primary` marker, a bold
+ * title and a `brand` icon, as in a GridList and the sidebar; with multiple selection, a ticked box too.
+ *
+ * A row that only holds other rows, such as a column in a page layout, can be focused and opened but never
+ * selected: put its id in the Tree's `disabledKeys` and set `disabledBehavior="selection"`. React Aria then
+ * leaves it focusable and doesn't mark it disabled, so it isn't dimmed.
+ *
+ * While a drag is over the row, as a place to drop into, it gets the `brand-subtle` ground and a 2px `brand`
+ * outline inside its edge. The row being dragged fades to 50%.
  */
-export declare function TreeItem<T extends object = object>({ title, textValue, description, actions, children, className, ...props }: TreeItemProps<T>): import("react").JSX.Element;
+export declare function TreeItem<T extends object = object>({ title, textValue, icon, description, status, statusLabel, actions, alwaysShowActions, children, dragLabel, allowsDragging: rowDrags, className, ...props }: TreeItemProps<T>): import("react").JSX.Element;
 /** React Aria doesn't export its TreeSection's props by name. */
 type RACTreeSectionProps<T extends object> = Parameters<typeof RACTreeSection<T>>[0];
 export interface TreeSectionProps<T extends object> extends Omit<RACTreeSectionProps<T>, 'className'> {

package/dist/ui/tree.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tree.d.ts","sourceRoot":"","sources":["../../src/ui/tree.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAML,WAAW,IAAI,cAAc,EAC7B,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,SAAS,IAAI,YAAY,EAC/B,MAAM,uBAAuB,CAAC;AAI/B,sGAAsG;AACtG,KAAK,QAAQ,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,iBAAiB,EAAE,MAAM,CAAA;CAAE,CAAC;AAEzE,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,MAAM,IAAI,IAAI,CAC5C,YAAY,CAAC,CAAC,CAAC,EACf,WAAW,GAAG,YAAY,GAAG,iBAAiB,CAC/C,GACC,QAAQ,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpC;;;;;;GAMG;AACH,wBAAgB,IAAI,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,CAAC,CAAC,CAAC,+BAU3E;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAAE,SAAQ,IAAI,CACpE,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CACjD;IACC,gEAAgE;IAChE,KAAK,EAAE,SAAS,CAAC;IACjB,mGAAmG;IACnG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,+FAA+F;IAC/F,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAClD,KAAK,EACL,SAAS,EACT,WAAW,EACX,OAAO,EACP,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,CAAC,CAAC,+BAkDlB;AAED,iEAAiE;AACjE,KAAK,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAErF,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC9D,mBAAmB,CAAC,CAAC,CAAC,EACtB,WAAW,CACZ;IACC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,8FAA8F;AAC9F,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,+BAEzF;AAED,gGAAgG;AAChG,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAW9F"}
+{"version":3,"file":"tree.d.ts","sourceRoot":"","sources":["../../src/ui/tree.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAML,WAAW,IAAI,cAAc,EAC7B,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,SAAS,IAAI,YAAY,EAC/B,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAAc,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAEtD,sGAAsG;AACtG,KAAK,QAAQ,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,iBAAiB,EAAE,MAAM,CAAA;CAAE,CAAC;AAEzE,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,MAAM,IAAI,IAAI,CAC5C,YAAY,CAAC,CAAC,CAAC,EACf,WAAW,GAAG,YAAY,GAAG,iBAAiB,CAC/C,GACC,QAAQ,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpC;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,IAAI,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,CAAC,CAAC,CAAC,+BAY3E;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAAE,SAAQ,IAAI,CACpE,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CACjD;IACC,gEAAgE;IAChE,KAAK,EAAE,SAAS,CAAC;IACjB,mGAAmG;IACnG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6GAA6G;IAC7G,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;;OAIG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mFAAmF;IACnF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,4GAA4G;IAC5G,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAClD,KAAK,EACL,SAAS,EACT,IAAI,EACJ,WAAW,EACX,MAAM,EACN,WAAW,EACX,OAAO,EACP,iBAAiB,EACjB,QAAQ,EACR,SAAS,EACT,cAAc,EAAE,QAAe,EAC/B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,CAAC,CAAC,+BA6GlB;AAED,iEAAiE;AACjE,KAAK,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAErF,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC9D,mBAAmB,CAAC,CAAC,CAAC,EACtB,WAAW,CACZ;IACC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,8FAA8F;AAC9F,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,+BAEzF;AAED,gGAAgG;AAChG,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAW9F"}