@nocoo/basalt 2.1.8 → 3.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.js","names":[],"sources":["../../src/components/navigation-menu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport type * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\ntype RadixNavigationMenuProps = React.ComponentProps<typeof NavigationMenuPrimitive.Root>;\ntype RadixNavigationMenuListProps = React.ComponentProps<typeof NavigationMenuPrimitive.List>;\ntype RadixNavigationMenuItemProps = React.ComponentProps<typeof NavigationMenuPrimitive.Item>;\ntype RadixNavigationMenuLinkProps = React.ComponentProps<typeof NavigationMenuPrimitive.Link>;\n\nexport interface NavigationMenuProps\n\textends Omit<\n\t\tRadixNavigationMenuProps,\n\t\t| \"value\"\n\t\t| \"defaultValue\"\n\t\t| \"onValueChange\"\n\t\t| \"dir\"\n\t\t| \"orientation\"\n\t\t| \"delayDuration\"\n\t\t| \"skipDelayDuration\"\n\t\t| \"asChild\"\n\t> {\n\t/**\n\t * Controlled value of the currently active navigation item.\n\t */\n\tvalue?: RadixNavigationMenuProps[\"value\"];\n\t/**\n\t * Uncontrolled initial active navigation item value.\n\t */\n\tdefaultValue?: RadixNavigationMenuProps[\"defaultValue\"];\n\t/**\n\t * Callback invoked when active navigation item value changes.\n\t */\n\tonValueChange?: RadixNavigationMenuProps[\"onValueChange\"];\n\t/**\n\t * Reading direction of the navigation menu. Inherits from nearest DirectionProvider or ltr.\n\t * @default \"ltr\"\n\t */\n\tdir?: RadixNavigationMenuProps[\"dir\"];\n\t/**\n\t * Orientation of the navigation menu items and keyboard navigation axis.\n\t * @default \"horizontal\"\n\t */\n\torientation?: RadixNavigationMenuProps[\"orientation\"];\n\t/**\n\t * Duration in milliseconds from pointer entering trigger until menu opens.\n\t * @default 200\n\t */\n\tdelayDuration?: RadixNavigationMenuProps[\"delayDuration\"];\n\t/**\n\t * Duration in milliseconds to move between triggers without re-triggering delay.\n\t * @default 300\n\t */\n\tskipDelayDuration?: RadixNavigationMenuProps[\"skipDelayDuration\"];\n\t/**\n\t * Change the default rendered nav element to the child element, merging props and behavior.\n\t * NavigationMenu forwards ref to HTMLElement and inherits native nav attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuProps[\"asChild\"];\n}\n\nexport const NavigationMenu = NavigationMenuPrimitive.Root;\n\nexport interface NavigationMenuListProps extends Omit<RadixNavigationMenuListProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered ul element to the child element, merging props and behavior.\n\t * NavigationMenuList forwards ref to HTMLUListElement and inherits native ul attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuListProps[\"asChild\"];\n}\n\nexport const NavigationMenuList = NavigationMenuPrimitive.List;\n\nexport interface NavigationMenuItemProps\n\textends Omit<RadixNavigationMenuItemProps, \"value\" | \"asChild\"> {\n\t/**\n\t * Unique value that associates the item with sub-navigation state.\n\t */\n\tvalue?: RadixNavigationMenuItemProps[\"value\"];\n\t/**\n\t * Change the default rendered li element to the child element, merging props and behavior.\n\t * NavigationMenuItem forwards ref to HTMLLIElement and inherits native li attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuItemProps[\"asChild\"];\n}\n\nexport const NavigationMenuItem = NavigationMenuPrimitive.Item;\n\nexport interface NavigationMenuLinkProps\n\textends Omit<RadixNavigationMenuLinkProps, \"active\" | \"onSelect\" | \"asChild\"> {\n\t/**\n\t * Whether the link represents the currently active destination.\n\t * Adds data-active attribute for styling.\n\t * @default false\n\t */\n\tactive?: RadixNavigationMenuLinkProps[\"active\"];\n\t/**\n\t * Event handler called when the navigation link is selected via pointer or keyboard.\n\t */\n\tonSelect?: RadixNavigationMenuLinkProps[\"onSelect\"];\n\t/**\n\t * Change the default rendered anchor element to the child element, merging props and behavior.\n\t * NavigationMenuLink forwards ref to HTMLAnchorElement and inherits native anchor attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuLinkProps[\"asChild\"];\n}\n\nexport function NavigationMenuLink({ className, ...props }: NavigationMenuLinkProps) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Link\n\t\t\tclassName={cn(\"rounded-basalt-md px-3 py-2 text-sm hover:bg-basalt-accent\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;AA6DA,IAAa,IAAiB,EAAwB,MAWzC,IAAqB,EAAwB,MAgB7C,IAAqB,EAAwB;AAsB1D,SAAgB,EAAmB,EAAE,cAAW,GAAG,KAAkC;CACpF,OACC,kBAAC,EAAwB,MAAzB;EACC,WAAW,EAAG,8DAA8D,CAAS;EACrF,GAAI;CACJ,CAAA;AAEH"}
+{"version":3,"file":"navigation-menu.js","names":["NavigationMenuPrimitive","NavigationMenu","NavigationMenuList","props","highlightRef","useHoverHighlight","ref","cn","NAV_LIST_CLASS","className","NavigationMenuItem","NavigationMenuLink","active","NAV_ITEM_CLASS"],"sources":["../../src/components/navigation-menu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport type * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { NAV_ITEM_CLASS, NAV_LIST_CLASS } from \"../utils/navigation\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\n\ntype RadixNavigationMenuProps = React.ComponentProps<typeof NavigationMenuPrimitive.Root>;\ntype RadixNavigationMenuListProps = React.ComponentProps<typeof NavigationMenuPrimitive.List>;\ntype RadixNavigationMenuItemProps = React.ComponentProps<typeof NavigationMenuPrimitive.Item>;\ntype RadixNavigationMenuLinkProps = React.ComponentProps<typeof NavigationMenuPrimitive.Link>;\n\nexport interface NavigationMenuProps\n\textends Omit<\n\t\tRadixNavigationMenuProps,\n\t\t| \"value\"\n\t\t| \"defaultValue\"\n\t\t| \"onValueChange\"\n\t\t| \"dir\"\n\t\t| \"orientation\"\n\t\t| \"delayDuration\"\n\t\t| \"skipDelayDuration\"\n\t\t| \"asChild\"\n\t> {\n\t/**\n\t * Controlled value of the currently active navigation item.\n\t */\n\tvalue?: RadixNavigationMenuProps[\"value\"];\n\t/**\n\t * Uncontrolled initial active navigation item value.\n\t */\n\tdefaultValue?: RadixNavigationMenuProps[\"defaultValue\"];\n\t/**\n\t * Callback invoked when active navigation item value changes.\n\t */\n\tonValueChange?: RadixNavigationMenuProps[\"onValueChange\"];\n\t/**\n\t * Reading direction of the navigation menu. Inherits from nearest DirectionProvider or ltr.\n\t * @default \"ltr\"\n\t */\n\tdir?: RadixNavigationMenuProps[\"dir\"];\n\t/**\n\t * Orientation of the navigation menu items and keyboard navigation axis.\n\t * @default \"horizontal\"\n\t */\n\torientation?: RadixNavigationMenuProps[\"orientation\"];\n\t/**\n\t * Duration in milliseconds from pointer entering trigger until menu opens.\n\t * @default 200\n\t */\n\tdelayDuration?: RadixNavigationMenuProps[\"delayDuration\"];\n\t/**\n\t * Duration in milliseconds to move between triggers without re-triggering delay.\n\t * @default 300\n\t */\n\tskipDelayDuration?: RadixNavigationMenuProps[\"skipDelayDuration\"];\n\t/**\n\t * Change the default rendered nav element to the child element, merging props and behavior.\n\t * NavigationMenu forwards ref to HTMLElement and inherits native nav attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuProps[\"asChild\"];\n}\n\nexport const NavigationMenu = NavigationMenuPrimitive.Root;\n\nexport interface NavigationMenuListProps extends Omit<RadixNavigationMenuListProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered ul element to the child element, merging props and behavior.\n\t * NavigationMenuList forwards ref to HTMLUListElement and inherits native ul attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuListProps[\"asChild\"];\n}\n\nexport function NavigationMenuList({ className, ref, ...props }: NavigationMenuListProps) {\n\tconst highlightRef = useHoverHighlight(ref);\n\treturn (\n\t\t<NavigationMenuPrimitive.List\n\t\t\tref={highlightRef}\n\t\t\tclassName={cn(NAV_LIST_CLASS, \"data-[orientation=vertical]:flex-col\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface NavigationMenuItemProps\n\textends Omit<RadixNavigationMenuItemProps, \"value\" | \"asChild\"> {\n\t/**\n\t * Unique value that associates the item with sub-navigation state.\n\t */\n\tvalue?: RadixNavigationMenuItemProps[\"value\"];\n\t/**\n\t * Change the default rendered li element to the child element, merging props and behavior.\n\t * NavigationMenuItem forwards ref to HTMLLIElement and inherits native li attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuItemProps[\"asChild\"];\n}\n\nexport const NavigationMenuItem = NavigationMenuPrimitive.Item;\n\nexport interface NavigationMenuLinkProps\n\textends Omit<RadixNavigationMenuLinkProps, \"active\" | \"onSelect\" | \"asChild\"> {\n\t/**\n\t * Whether the link represents the currently active destination.\n\t * Adds data-active attribute for styling.\n\t * @default false\n\t */\n\tactive?: RadixNavigationMenuLinkProps[\"active\"];\n\t/**\n\t * Event handler called when the navigation link is selected via pointer or keyboard.\n\t */\n\tonSelect?: RadixNavigationMenuLinkProps[\"onSelect\"];\n\t/**\n\t * Change the default rendered anchor element to the child element, merging props and behavior.\n\t * NavigationMenuLink forwards ref to HTMLAnchorElement and inherits native anchor attributes.\n\t * @default false\n\t */\n\tasChild?: RadixNavigationMenuLinkProps[\"asChild\"];\n}\n\nexport function NavigationMenuLink({ className, active, ...props }: NavigationMenuLinkProps) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Link\n\t\t\tactive={active}\n\t\t\tdata-basalt-hover-item=\"\"\n\t\t\tdata-hover-selected={active}\n\t\t\tclassName={cn(NAV_ITEM_CLASS, className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;;AA+DA,IAAaC,IAAiBD,EAAwB;AAWtD,SAAgBE,EAAmB,EAAE,cAAW,QAAK,GAAGC,KAAkC;CACzF,IAAMC,IAAeC,EAAkBC,CAAG;CAC1C,OACC,kBAACN,EAAwB,MAAzB;EACC,KAAKI;EACL,WAAWG,EAAGC,GAAgB,wCAAwCC,CAAS;EAC/E,GAAIN;CACJ,CAAA;AAEH;AAgBA,IAAaO,IAAqBV,EAAwB;AAsB1D,SAAgBW,EAAmB,EAAE,cAAW,WAAQ,GAAGR,KAAkC;CAC5F,OACC,kBAACH,EAAwB,MAAzB;EACS;EACR,0BAAuB;EACvB,uBAAqBY;EACrB,WAAWL,EAAGM,GAAgBJ,CAAS;EACvC,GAAIN;CACJ,CAAA;AAEH"}

package/dist/components/overlay.js

@@ -4,10 +4,10 @@ import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
 //#region src/components/overlay.ts
 var n = 4, r = 8, i = "z-50", a = "motion-reduce:animate-none motion-reduce:transition-none", o = "outline-hidden focus-visible:border-basalt-ring", s = "outline-hidden focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-basalt-ring", c = "outline-hidden focus-visible:ring-2 focus-visible:ring-basalt-ring focus-visible:ring-offset-2 focus-visible:ring-offset-basalt-background";
 function l(n) {
-	return e(t, i, "overflow-hidden rounded-basalt-md border border-basalt-border bg-basalt-popover py-1.5 text-sm text-basalt-popover-foreground shadow-md", a, n);
+	return e(t, i, "basalt-floating overflow-hidden rounded-basalt-md border border-basalt-border bg-basalt-popover py-basalt-menu-inset text-basalt-base text-basalt-popover-foreground shadow-md", a, n);
 }
 function u(t) {
-	return e("mx-1.5 flex w-[calc(100%-0.75rem)] cursor-default items-center rounded-basalt-sm px-2 py-1.5 text-left text-sm outline-hidden select-none", t);
+	return e("mx-basalt-menu-inset flex min-h-basalt-menu-row w-[calc(100%-var(--basalt-space-menu-inset)*2)] cursor-default items-center gap-basalt-row-gap rounded-basalt-sm px-basalt-menu-x py-basalt-menu-y text-left text-basalt-base leading-basalt-row outline-hidden select-none", t);
 }
 //#endregion
 export { o as FOCUS_BORDER, s as FOCUS_INSET, c as FOCUS_RING, r as MENU_GAP, n as OVERLAY_GAP, i as OVERLAY_LAYER, a as OVERLAY_MOTION, u as overlayItemClass, l as overlayPanelClass };

package/dist/components/overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"overlay.js","names":[],"sources":["../../src/components/overlay.ts"],"sourcesContent":["import { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Gap between a field trigger and its list. Matches Kumo Select/Combobox. */\nexport const OVERLAY_GAP = 4;\n/** Gap between a menu trigger and its panel. Matches Kumo Dropdown/Popover. */\nexport const MENU_GAP = 8;\n/** Shared stacking layer for portals, menus, and chrome overlays. */\nexport const OVERLAY_LAYER = \"z-50\";\n/** Kill CSS animation and transition when the user prefers reduced motion. */\nexport const OVERLAY_MOTION = \"motion-reduce:animate-none motion-reduce:transition-none\";\n\n/** Recolor the existing 1px border. No extra ring, no layout shift. */\nexport const FOCUS_BORDER = \"outline-hidden focus-visible:border-basalt-ring\";\n/** Inset 1px theme ring for borderless controls. Outer size stays put. */\nexport const FOCUS_INSET =\n\t\"outline-hidden focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-basalt-ring\";\n/** Offset ring stays visible on primary fills (ring token equals primary). */\nexport const FOCUS_RING =\n\t\"outline-hidden focus-visible:ring-2 focus-visible:ring-basalt-ring focus-visible:ring-offset-2 focus-visible:ring-offset-basalt-background\";\n\nexport function overlayPanelClass(className?: string) {\n\treturn cn(\n\t\tBASALT_UI_CLASS,\n\t\tOVERLAY_LAYER,\n\t\t\"overflow-hidden rounded-basalt-md border border-basalt-border bg-basalt-popover py-1.5 text-sm text-basalt-popover-foreground shadow-md\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function overlayItemClass(className?: string) {\n\treturn cn(\n\t\t\"mx-1.5 flex w-[calc(100%-0.75rem)] cursor-default items-center rounded-basalt-sm px-2 py-1.5 text-left text-sm outline-hidden select-none\",\n\t\tclassName,\n\t);\n}\n"],"mappings":";;;;AAIA,IAAa,IAAc,GAEd,IAAW,GAEX,IAAgB,QAEhB,IAAiB,4DAGjB,IAAe,mDAEf,IACZ,+FAEY,IACZ;AAED,SAAgB,EAAkB,GAAoB;CACrD,OAAO,EACN,GACA,GACA,2IACA,GACA,CACD;AACD;AAEA,SAAgB,EAAiB,GAAoB;CACpD,OAAO,EACN,6IACA,CACD;AACD"}
+{"version":3,"file":"overlay.js","names":["OVERLAY_GAP","MENU_GAP","OVERLAY_LAYER","OVERLAY_MOTION","FOCUS_BORDER","FOCUS_INSET","FOCUS_RING","overlayPanelClass","cn","BASALT_UI_CLASS","className","overlayItemClass"],"sources":["../../src/components/overlay.ts"],"sourcesContent":["import { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Gap between a field trigger and its list. Matches Kumo Select/Combobox. */\nexport const OVERLAY_GAP = 4;\n/** Gap between a menu trigger and its panel. Matches Kumo Dropdown/Popover. */\nexport const MENU_GAP = 8;\n/** Shared stacking layer for portals, menus, and chrome overlays. */\nexport const OVERLAY_LAYER = \"z-50\";\n/** Kill CSS animation and transition when the user prefers reduced motion. */\nexport const OVERLAY_MOTION = \"motion-reduce:animate-none motion-reduce:transition-none\";\n\n/** Recolor the existing 1px border. No extra ring, no layout shift. */\nexport const FOCUS_BORDER = \"outline-hidden focus-visible:border-basalt-ring\";\n/** Inset 1px theme ring for borderless controls. Outer size stays put. */\nexport const FOCUS_INSET =\n\t\"outline-hidden focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-basalt-ring\";\n/** Offset ring stays visible on primary fills (ring token equals primary). */\nexport const FOCUS_RING =\n\t\"outline-hidden focus-visible:ring-2 focus-visible:ring-basalt-ring focus-visible:ring-offset-2 focus-visible:ring-offset-basalt-background\";\n\nexport function overlayPanelClass(className?: string) {\n\treturn cn(\n\t\tBASALT_UI_CLASS,\n\t\tOVERLAY_LAYER,\n\t\t\"basalt-floating overflow-hidden rounded-basalt-md border border-basalt-border bg-basalt-popover py-basalt-menu-inset text-basalt-base text-basalt-popover-foreground shadow-md\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function overlayItemClass(className?: string) {\n\treturn cn(\n\t\t\"mx-basalt-menu-inset flex min-h-basalt-menu-row w-[calc(100%-var(--basalt-space-menu-inset)*2)] cursor-default items-center gap-basalt-row-gap rounded-basalt-sm px-basalt-menu-x py-basalt-menu-y text-left text-basalt-base leading-basalt-row outline-hidden select-none\",\n\t\tclassName,\n\t);\n}\n"],"mappings":";;;;AAIA,IAAaA,IAAc,GAEdC,IAAW,GAEXC,IAAgB,QAEhBC,IAAiB,4DAGjBC,IAAe,mDAEfC,IACZ,+FAEYC,IACZ;AAED,SAAgBC,EAAkB,GAAoB;CACrD,OAAOC,EACNC,GACAP,GACA,kLACAC,GACAO,CACD;AACD;AAEA,SAAgBC,EAAiB,GAAoB;CACpD,OAAOH,EACN,+QACAE,CACD;AACD"}

package/dist/components/page-header.d.ts

@@ -5,6 +5,8 @@ export interface PageHeaderBreadcrumb {
     icon?: React.ReactNode;
 }
 export interface PageHeaderProps {
+    /** Heading scale: workspace, dashboard, or reading-focused page. @default "md" */
+    size?: "md" | "lg" | "xl";
     /** The page title, rendered as the only heading. */
     title: React.ReactNode;
     /** Supporting text below the title. */
@@ -16,4 +18,4 @@ export interface PageHeaderProps {
     /** Own-row filters. Keep short filters in actions. */
     filters?: React.ReactNode;
 }
-export declare function PageHeader({ actions, breadcrumbs, description, filters, title }: PageHeaderProps): React.JSX.Element;
+export declare function PageHeader({ actions, breadcrumbs, description, filters, size, title, }: PageHeaderProps): React.JSX.Element;

package/dist/components/page-header.js

@@ -5,32 +5,32 @@ import { Breadcrumbs as n } from "./breadcrumbs.js";
 import * as r from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/page-header.tsx
-function o({ actions: o, breadcrumbs: s, description: c, filters: l, title: u }) {
-	let d = r.useId();
+function o({ actions: o, breadcrumbs: s, description: c, filters: l, size: u = "md", title: d }) {
+	let f = r.useId();
 	return /* @__PURE__ */ a("header", {
-		"aria-labelledby": d,
-		className: e(t, "space-y-4"),
+		"aria-labelledby": f,
+		className: e(t, "min-w-0 shrink-0 space-y-basalt-layout"),
 		children: [
 			s && s.length > 0 ? /* @__PURE__ */ i(n, { items: [...s] }) : null,
 			/* @__PURE__ */ a("div", {
-				className: "flex flex-col gap-4 md:flex-row md:items-start md:justify-between",
+				className: "flex flex-col gap-basalt-layout md:flex-row md:items-start md:justify-between",
 				children: [/* @__PURE__ */ a("div", {
-					className: "min-w-0 flex-1 space-y-1",
+					className: "min-w-0 flex-1 space-y-basalt-space-lg",
 					children: [/* @__PURE__ */ i("h1", {
-						id: d,
-						className: "text-2xl font-semibold tracking-tight text-basalt-foreground",
-						children: u
+						id: f,
+						className: e("font-basalt-display font-semibold tracking-tight text-basalt-foreground [overflow-wrap:anywhere]", u === "md" && "text-basalt-3xl", u === "lg" && "text-basalt-4xl", u === "xl" && "text-basalt-4xl md:text-basalt-5xl", "leading-basalt-tight"),
+						children: d
 					}), c ? /* @__PURE__ */ i("p", {
-						className: "text-sm text-basalt-muted-foreground",
+						className: e("max-w-[65ch] text-basalt-muted-foreground [overflow-wrap:anywhere]", u === "md" ? "text-basalt-base" : "text-basalt-lg leading-basalt-relaxed"),
 						children: c
 					}) : null]
 				}), o ? /* @__PURE__ */ i("div", {
-					className: "flex flex-wrap items-center justify-end gap-2",
+					className: "flex flex-wrap items-center justify-end gap-basalt-space-lg",
 					children: o
 				}) : null]
 			}),
 			l ? /* @__PURE__ */ i("div", {
-				className: "flex flex-wrap items-center gap-2",
+				className: "flex flex-wrap items-center gap-basalt-space-lg",
 				children: l
 			}) : null
 		]

package/dist/components/page-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-header.js","names":[],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Breadcrumbs } from \"./breadcrumbs\";\n\nexport interface PageHeaderBreadcrumb {\n\thref?: string;\n\tlabel: React.ReactNode;\n\ticon?: React.ReactNode;\n}\n\nexport interface PageHeaderProps {\n\t/** The page title, rendered as the only heading. */\n\ttitle: React.ReactNode;\n\t/** Supporting text below the title. */\n\tdescription?: React.ReactNode;\n\t/** Trail of parent pages. */\n\tbreadcrumbs?: readonly PageHeaderBreadcrumb[];\n\t/** Right-side title-row actions. Put the create button last. */\n\tactions?: React.ReactNode;\n\t/** Own-row filters. Keep short filters in actions. */\n\tfilters?: React.ReactNode;\n}\n\nexport function PageHeader({ actions, breadcrumbs, description, filters, title }: PageHeaderProps) {\n\tconst titleId = React.useId();\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useAriaPropsSupportedByRole: the title heading names this header\n\t\t<header aria-labelledby={titleId} className={cn(BASALT_UI_CLASS, \"space-y-4\")}>\n\t\t\t{breadcrumbs && breadcrumbs.length > 0 ? <Breadcrumbs items={[...breadcrumbs]} /> : null}\n\t\t\t<div className=\"flex flex-col gap-4 md:flex-row md:items-start md:justify-between\">\n\t\t\t\t<div className=\"min-w-0 flex-1 space-y-1\">\n\t\t\t\t\t<h1 id={titleId} className=\"text-2xl font-semibold tracking-tight text-basalt-foreground\">\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</h1>\n\t\t\t\t\t{description ? (\n\t\t\t\t\t\t<p className=\"text-sm text-basalt-muted-foreground\">{description}</p>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t{actions ? (\n\t\t\t\t\t<div className=\"flex flex-wrap items-center justify-end gap-2\">{actions}</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{filters ? <div className=\"flex flex-wrap items-center gap-2\">{filters}</div> : null}\n\t\t</header>\n\t);\n}\n"],"mappings":";;;;;;;AAwBA,SAAgB,EAAW,EAAE,YAAS,gBAAa,gBAAa,YAAS,YAA0B;CAClG,IAAM,IAAU,EAAM,MAAM;CAE5B,OAEC,kBAAC,UAAD;EAAQ,mBAAiB;EAAS,WAAW,EAAG,GAAiB,WAAW;EAA5E,UAAA;GACE,KAAe,EAAY,SAAS,IAAI,kBAAC,GAAD,EAAa,OAAO,CAAC,GAAG,CAAW,EAAI,CAAA,IAAI;GACpF,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACC,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACC,kBAAC,MAAD;MAAI,IAAI;MAAS,WAAU;MACzB,UAAA;KACE,CAAA,GACH,IACA,kBAAC,KAAD;MAAG,WAAU;MAAwC,UAAA;KAAe,CAAA,IACjE,IACA;IACJ,CAAA,GAAA,IACA,kBAAC,OAAD;KAAK,WAAU;KAAiD,UAAA;IAAa,CAAA,IAC1E,IACA;;GACJ,IAAU,kBAAC,OAAD;IAAK,WAAU;IAAqC,UAAA;GAAa,CAAA,IAAI;EACzE;;AAEV"}
+{"version":3,"file":"page-header.js","names":["React","PageHeader","titleId","cn","BASALT_UI_CLASS","breadcrumbs","Breadcrumbs","size","title","description","actions","filters"],"sources":["../../src/components/page-header.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Breadcrumbs } from \"./breadcrumbs\";\n\nexport interface PageHeaderBreadcrumb {\n\thref?: string;\n\tlabel: React.ReactNode;\n\ticon?: React.ReactNode;\n}\n\nexport interface PageHeaderProps {\n\t/** Heading scale: workspace, dashboard, or reading-focused page. @default \"md\" */\n\tsize?: \"md\" | \"lg\" | \"xl\";\n\t/** The page title, rendered as the only heading. */\n\ttitle: React.ReactNode;\n\t/** Supporting text below the title. */\n\tdescription?: React.ReactNode;\n\t/** Trail of parent pages. */\n\tbreadcrumbs?: readonly PageHeaderBreadcrumb[];\n\t/** Right-side title-row actions. Put the create button last. */\n\tactions?: React.ReactNode;\n\t/** Own-row filters. Keep short filters in actions. */\n\tfilters?: React.ReactNode;\n}\n\nexport function PageHeader({\n\tactions,\n\tbreadcrumbs,\n\tdescription,\n\tfilters,\n\tsize = \"md\",\n\ttitle,\n}: PageHeaderProps) {\n\tconst titleId = React.useId();\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useAriaPropsSupportedByRole: the title heading names this header\n\t\t<header\n\t\t\taria-labelledby={titleId}\n\t\t\tclassName={cn(BASALT_UI_CLASS, \"min-w-0 shrink-0 space-y-basalt-layout\")}\n\t\t>\n\t\t\t{breadcrumbs && breadcrumbs.length > 0 ? <Breadcrumbs items={[...breadcrumbs]} /> : null}\n\t\t\t<div className=\"flex flex-col gap-basalt-layout md:flex-row md:items-start md:justify-between\">\n\t\t\t\t<div className=\"min-w-0 flex-1 space-y-basalt-space-lg\">\n\t\t\t\t\t<h1\n\t\t\t\t\t\tid={titleId}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"font-basalt-display font-semibold tracking-tight text-basalt-foreground [overflow-wrap:anywhere]\",\n\t\t\t\t\t\t\tsize === \"md\" && \"text-basalt-3xl\",\n\t\t\t\t\t\t\tsize === \"lg\" && \"text-basalt-4xl\",\n\t\t\t\t\t\t\tsize === \"xl\" && \"text-basalt-4xl md:text-basalt-5xl\",\n\t\t\t\t\t\t\t\"leading-basalt-tight\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</h1>\n\t\t\t\t\t{description ? (\n\t\t\t\t\t\t<p\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"max-w-[65ch] text-basalt-muted-foreground [overflow-wrap:anywhere]\",\n\t\t\t\t\t\t\t\tsize === \"md\" ? \"text-basalt-base\" : \"text-basalt-lg leading-basalt-relaxed\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{description}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t{actions ? (\n\t\t\t\t\t<div className=\"flex flex-wrap items-center justify-end gap-basalt-space-lg\">\n\t\t\t\t\t\t{actions}\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{filters ? (\n\t\t\t\t<div className=\"flex flex-wrap items-center gap-basalt-space-lg\">{filters}</div>\n\t\t\t) : null}\n\t\t</header>\n\t);\n}\n"],"mappings":";;;;;;;AA0BA,SAAgBC,EAAW,EAC1B,YACA,gBACA,gBACA,YACA,UAAO,MACP,YACmB;CACnB,IAAMC,IAAUF,EAAM,MAAM;CAE5B,OAEC,kBAAC,UAAD;EACC,mBAAiBE;EACjB,WAAWC,EAAGC,GAAiB,wCAAwC;EAFxE,UAAA;GAIEC,KAAeA,EAAY,SAAS,IAAI,kBAACC,GAAD,EAAa,OAAO,CAAC,GAAGD,CAAW,EAAI,CAAA,IAAI;GACpF,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACC,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACC,kBAAC,MAAD;MACC,IAAIH;MACJ,WAAWC,EACV,oGACAI,MAAS,QAAQ,mBACjBA,MAAS,QAAQ,mBACjBA,MAAS,QAAQ,sCACjB,sBACD;MAEC,UAAAC;KACE,CAAA,GACHC,IACA,kBAAC,KAAD;MACC,WAAWN,EACV,sEACAI,MAAS,OAAO,qBAAqB,uCACtC;MAEC,UAAAE;KACC,CAAA,IACA,IACA;IACJ,CAAA,GAAAC,IACA,kBAAC,OAAD;KAAK,WAAU;KACb,UAAAA;IACG,CAAA,IACF,IACA;;GACJC,IACA,kBAAC,OAAD;IAAK,WAAU;IAAmD,UAAAA;GAAa,CAAA,IAC5E;EACG;;AAEV"}

package/dist/components/pagination.js

@@ -6,7 +6,7 @@ import { useState as r } from "react";
 import { ChevronLeft as i, ChevronRight as a, ChevronsLeft as o, ChevronsRight as s } from "lucide-react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/pagination.tsx
-var u = e("relative h-full w-9 shrink-0 rounded-none border-0 bg-transparent shadow-none first:rounded-l-basalt-md last:rounded-r-basalt-md", "hover:bg-basalt-accent focus-visible:bg-basalt-accent active:bg-basalt-accent", "disabled:pointer-events-none disabled:opacity-100 disabled:text-basalt-muted-foreground");
+var u = e("relative basalt-action-inset w-basalt-control shrink-0 rounded-none border-0 bg-transparent shadow-none first:rounded-l-basalt-md last:rounded-r-basalt-md", "hover:bg-basalt-hover focus-visible:bg-basalt-hover active:bg-basalt-hover", "disabled:pointer-events-none disabled:opacity-100 disabled:text-basalt-muted-foreground");
 function d({ page: d, defaultPage: f = 1, pageCount: p = 10, onPageChange: m, simple: h = !1, disabled: g = !1, className: _ }) {
 	let [v, y] = r(f), b = Math.max(1, p), x = Math.min(b, Math.max(1, d ?? v)), S = (e) => {
 		d === void 0 && y(e), m?.(e);
@@ -15,7 +15,7 @@ function d({ page: d, defaultPage: f = 1, pageCount: p = 10, onPageChange: m, si
 		"aria-label": "Pagination",
 		className: _,
 		children: /* @__PURE__ */ l("div", {
-			className: t(e("inline-flex h-9 items-stretch", "[&>*:not(:first-child)]:border-l [&>*:not(:first-child)]:border-basalt-border", "[&>:first-child]:rounded-l-basalt-md [&>:last-child]:rounded-r-basalt-md")),
+			className: t(e("inline-flex min-h-basalt-control items-stretch", "[&>*:not(:first-child)]:border-l [&>*:not(:first-child)]:border-basalt-border", "[&>:first-child]:rounded-l-basalt-md [&>:last-child]:rounded-r-basalt-md")),
 			children: [
 				h ? null : /* @__PURE__ */ c(n, {
 					variant: "ghost",
@@ -37,7 +37,7 @@ function d({ page: d, defaultPage: f = 1, pageCount: p = 10, onPageChange: m, si
 				}),
 				h ? null : /* @__PURE__ */ c("span", {
 					"aria-current": "page",
-					className: "flex h-full min-w-9 items-center justify-center px-3 text-sm font-medium tabular-nums text-basalt-foreground",
+					className: "basalt-choice flex min-w-basalt-control items-center justify-center px-basalt-space-lg text-basalt-base font-medium tabular-nums text-basalt-foreground",
 					children: x
 				}),
 				/* @__PURE__ */ c(n, {

package/dist/components/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","names":[],"sources":["../../src/components/pagination.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from \"lucide-react\";\nimport { useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { Button } from \"./button\";\n\nconst itemClass = cn(\n\t\"relative h-full w-9 shrink-0 rounded-none border-0 bg-transparent shadow-none first:rounded-l-basalt-md last:rounded-r-basalt-md\",\n\t\"hover:bg-basalt-accent focus-visible:bg-basalt-accent active:bg-basalt-accent\",\n\t\"disabled:pointer-events-none disabled:opacity-100 disabled:text-basalt-muted-foreground\",\n);\n\nexport type PaginationProps = {\n\t/**\n\t * Controlled 1-based page.\n\t */\n\tpage?: number;\n\t/**\n\t * Uncontrolled initial page.\n\t * @default 1\n\t */\n\tdefaultPage?: number;\n\t/**\n\t * Last page number.\n\t * @default 10\n\t */\n\tpageCount?: number;\n\t/**\n\t * Called when the page changes.\n\t */\n\tonPageChange?: (page: number) => void;\n\t/**\n\t * Hide first, last, and page number controls.\n\t * @default false\n\t */\n\tsimple?: boolean;\n\t/**\n\t * Disable every control.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Additional classes for the nav.\n\t */\n\tclassName?: string;\n};\n\nexport function Pagination({\n\tpage,\n\tdefaultPage = 1,\n\tpageCount = 10,\n\tonPageChange,\n\tsimple = false,\n\tdisabled = false,\n\tclassName,\n}: PaginationProps) {\n\tconst [uncontrolled, setUncontrolled] = useState(defaultPage);\n\tconst last = Math.max(1, pageCount);\n\tconst current = Math.min(last, Math.max(1, page ?? uncontrolled));\n\tconst go = (next: number) => {\n\t\tif (page === undefined) {\n\t\t\tsetUncontrolled(next);\n\t\t}\n\t\tonPageChange?.(next);\n\t};\n\tconst atStart = current <= 1;\n\tconst atEnd = current >= last;\n\tconst startDisabled = disabled || atStart;\n\tconst endDisabled = disabled || atEnd;\n\n\treturn (\n\t\t<nav aria-label=\"Pagination\" className={className}>\n\t\t\t<div\n\t\t\t\tclassName={controlSurfaceClass(\n\t\t\t\t\tcn(\n\t\t\t\t\t\t\"inline-flex h-9 items-stretch\",\n\t\t\t\t\t\t\"[&>*:not(:first-child)]:border-l [&>*:not(:first-child)]:border-basalt-border\",\n\t\t\t\t\t\t\"[&>:first-child]:rounded-l-basalt-md [&>:last-child]:rounded-r-basalt-md\",\n\t\t\t\t\t),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ticon={<ChevronsLeft />}\n\t\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\t\taria-label=\"First page\"\n\t\t\t\t\t\tdisabled={startDisabled}\n\t\t\t\t\t\tonClick={() => go(1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\ticon={<ChevronLeft />}\n\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\taria-label=\"Previous page\"\n\t\t\t\t\tdisabled={startDisabled}\n\t\t\t\t\tonClick={() => go(Math.max(1, current - 1))}\n\t\t\t\t/>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<span\n\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\tclassName=\"flex h-full min-w-9 items-center justify-center px-3 text-sm font-medium tabular-nums text-basalt-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{current}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\ticon={<ChevronRight />}\n\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\taria-label=\"Next page\"\n\t\t\t\t\tdisabled={endDisabled}\n\t\t\t\t\tonClick={() => go(Math.min(last, current + 1))}\n\t\t\t\t/>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ticon={<ChevronsRight />}\n\t\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\t\taria-label=\"Last page\"\n\t\t\t\t\t\tdisabled={endDisabled}\n\t\t\t\t\t\tonClick={() => go(last)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</nav>\n\t);\n}\n"],"mappings":";;;;;;;;AAMA,IAAM,IAAY,EACjB,oIACA,iFACA,yFACD;AAqCA,SAAgB,EAAW,EAC1B,SACA,iBAAc,GACd,eAAY,IACZ,iBACA,YAAS,IACT,cAAW,IACX,gBACmB;CACnB,IAAM,CAAC,GAAc,KAAmB,EAAS,CAAW,GACtD,IAAO,KAAK,IAAI,GAAG,CAAS,GAC5B,IAAU,KAAK,IAAI,GAAM,KAAK,IAAI,GAAG,KAAQ,CAAY,CAAC,GAC1D,KAAM,MAAiB;EAI5B,AAHI,MAAS,KAAA,KACZ,EAAgB,CAAI,GAErB,IAAe,CAAI;CACpB,GACM,IAAU,KAAW,GACrB,IAAQ,KAAW,GACnB,IAAgB,KAAY,GAC5B,IAAc,KAAY;CAEhC,OACC,kBAAC,OAAD;EAAK,cAAW;EAAwB;EACvC,UAAA,kBAAC,OAAD;GACC,WAAW,EACV,EACC,iCACA,iFACA,0EACD,CACD;GAPD,UAAA;IASE,IAAS,OACT,kBAAC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAAC,GAAD,CAAe,CAAA;KACrB,WAAW;KACX,cAAW;KACX,UAAU;KACV,eAAe,EAAG,CAAC;IACnB,CAAA;IAEF,kBAAC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAAC,GAAD,CAAc,CAAA;KACpB,WAAW;KACX,cAAW;KACX,UAAU;KACV,eAAe,EAAG,KAAK,IAAI,GAAG,IAAU,CAAC,CAAC;IAC1C,CAAA;IACA,IAAS,OACT,kBAAC,QAAD;KACC,gBAAa;KACb,WAAU;KAET,UAAA;IACI,CAAA;IAEP,kBAAC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAAC,GAAD,CAAe,CAAA;KACrB,WAAW;KACX,cAAW;KACX,UAAU;KACV,eAAe,EAAG,KAAK,IAAI,GAAM,IAAU,CAAC,CAAC;IAC7C,CAAA;IACA,IAAS,OACT,kBAAC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAAC,GAAD,CAAgB,CAAA;KACtB,WAAW;KACX,cAAW;KACX,UAAU;KACV,eAAe,EAAG,CAAI;IACtB,CAAA;GAEE;;CACD,CAAA;AAEP"}
+{"version":3,"file":"pagination.js","names":["itemClass","cn","Pagination","uncontrolled","setUncontrolled","useState","defaultPage","last","pageCount","current","page","go","next","onPageChange","atStart","atEnd","startDisabled","disabled","endDisabled","controlSurfaceClass","simple","Button","ChevronsLeft","ChevronLeft","ChevronRight","ChevronsRight"],"sources":["../../src/components/pagination.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from \"lucide-react\";\nimport { useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { Button } from \"./button\";\n\nconst itemClass = cn(\n\t\"relative basalt-action-inset w-basalt-control shrink-0 rounded-none border-0 bg-transparent shadow-none first:rounded-l-basalt-md last:rounded-r-basalt-md\",\n\t\"hover:bg-basalt-hover focus-visible:bg-basalt-hover active:bg-basalt-hover\",\n\t\"disabled:pointer-events-none disabled:opacity-100 disabled:text-basalt-muted-foreground\",\n);\n\nexport type PaginationProps = {\n\t/**\n\t * Controlled 1-based page.\n\t */\n\tpage?: number;\n\t/**\n\t * Uncontrolled initial page.\n\t * @default 1\n\t */\n\tdefaultPage?: number;\n\t/**\n\t * Last page number.\n\t * @default 10\n\t */\n\tpageCount?: number;\n\t/**\n\t * Called when the page changes.\n\t */\n\tonPageChange?: (page: number) => void;\n\t/**\n\t * Hide first, last, and page number controls.\n\t * @default false\n\t */\n\tsimple?: boolean;\n\t/**\n\t * Disable every control.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Additional classes for the nav.\n\t */\n\tclassName?: string;\n};\n\nexport function Pagination({\n\tpage,\n\tdefaultPage = 1,\n\tpageCount = 10,\n\tonPageChange,\n\tsimple = false,\n\tdisabled = false,\n\tclassName,\n}: PaginationProps) {\n\tconst [uncontrolled, setUncontrolled] = useState(defaultPage);\n\tconst last = Math.max(1, pageCount);\n\tconst current = Math.min(last, Math.max(1, page ?? uncontrolled));\n\tconst go = (next: number) => {\n\t\tif (page === undefined) {\n\t\t\tsetUncontrolled(next);\n\t\t}\n\t\tonPageChange?.(next);\n\t};\n\tconst atStart = current <= 1;\n\tconst atEnd = current >= last;\n\tconst startDisabled = disabled || atStart;\n\tconst endDisabled = disabled || atEnd;\n\n\treturn (\n\t\t<nav aria-label=\"Pagination\" className={className}>\n\t\t\t<div\n\t\t\t\tclassName={controlSurfaceClass(\n\t\t\t\t\tcn(\n\t\t\t\t\t\t\"inline-flex min-h-basalt-control items-stretch\",\n\t\t\t\t\t\t\"[&>*:not(:first-child)]:border-l [&>*:not(:first-child)]:border-basalt-border\",\n\t\t\t\t\t\t\"[&>:first-child]:rounded-l-basalt-md [&>:last-child]:rounded-r-basalt-md\",\n\t\t\t\t\t),\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ticon={<ChevronsLeft />}\n\t\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\t\taria-label=\"First page\"\n\t\t\t\t\t\tdisabled={startDisabled}\n\t\t\t\t\t\tonClick={() => go(1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\ticon={<ChevronLeft />}\n\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\taria-label=\"Previous page\"\n\t\t\t\t\tdisabled={startDisabled}\n\t\t\t\t\tonClick={() => go(Math.max(1, current - 1))}\n\t\t\t\t/>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<span\n\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\tclassName=\"basalt-choice flex min-w-basalt-control items-center justify-center px-basalt-space-lg text-basalt-base font-medium tabular-nums text-basalt-foreground\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{current}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\ticon={<ChevronRight />}\n\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\taria-label=\"Next page\"\n\t\t\t\t\tdisabled={endDisabled}\n\t\t\t\t\tonClick={() => go(Math.min(last, current + 1))}\n\t\t\t\t/>\n\t\t\t\t{simple ? null : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\ticon={<ChevronsRight />}\n\t\t\t\t\t\tclassName={itemClass}\n\t\t\t\t\t\taria-label=\"Last page\"\n\t\t\t\t\t\tdisabled={endDisabled}\n\t\t\t\t\t\tonClick={() => go(last)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</nav>\n\t);\n}\n"],"mappings":";;;;;;;;AAMA,IAAMA,IAAYC,EACjB,8JACA,8EACA,yFACD;AAqCA,SAAgBC,EAAW,EAC1B,SACA,iBAAc,GACd,eAAY,IACZ,iBACA,YAAS,IACT,cAAW,IACX,gBACmB;CACnB,IAAM,CAACC,GAAcC,KAAmBC,EAASC,CAAW,GACtDC,IAAO,KAAK,IAAI,GAAGC,CAAS,GAC5BC,IAAU,KAAK,IAAIF,GAAM,KAAK,IAAI,GAAGG,KAAQP,CAAY,CAAC,GAC1DQ,KAAM,MAAiB;EAI5B,AAHID,MAAS,KAAA,KACZN,EAAgBQ,CAAI,GAErBC,IAAeD,CAAI;CACpB,GACME,IAAUL,KAAW,GACrBM,IAAQN,KAAWF,GACnBS,IAAgBC,KAAYH,GAC5BI,IAAcD,KAAYF;CAEhC,OACC,kBAAC,OAAD;EAAK,cAAW;EAAwB;EACvC,UAAA,kBAAC,OAAD;GACC,WAAWI,EACVlB,EACC,kDACA,iFACA,0EACD,CACD;GAPD,UAAA;IASEmB,IAAS,OACT,kBAACC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAACC,GAAD,CAAe,CAAA;KACrB,WAAWtB;KACX,cAAW;KACX,UAAUgB;KACV,eAAeL,EAAG,CAAC;IACnB,CAAA;IAEF,kBAACU,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAACE,GAAD,CAAc,CAAA;KACpB,WAAWvB;KACX,cAAW;KACX,UAAUgB;KACV,eAAeL,EAAG,KAAK,IAAI,GAAGF,IAAU,CAAC,CAAC;IAC1C,CAAA;IACAW,IAAS,OACT,kBAAC,QAAD;KACC,gBAAa;KACb,WAAU;KAET,UAAAX;IACI,CAAA;IAEP,kBAACY,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAACG,GAAD,CAAe,CAAA;KACrB,WAAWxB;KACX,cAAW;KACX,UAAUkB;KACV,eAAeP,EAAG,KAAK,IAAIJ,GAAME,IAAU,CAAC,CAAC;IAC7C,CAAA;IACAW,IAAS,OACT,kBAACC,GAAD;KACC,SAAQ;KACR,MAAK;KACL,MAAM,kBAACI,GAAD,CAAgB,CAAA;KACtB,WAAWzB;KACX,cAAW;KACX,UAAUkB;KACV,eAAeP,EAAGJ,CAAI;IACtB,CAAA;GAEE;;CACD,CAAA;AAEP"}

package/dist/components/popover.js

@@ -18,12 +18,12 @@ var c = [
 		align: c,
 		side: l,
 		sideOffset: u,
-		className: e(t, n, "rounded-basalt-md border border-basalt-border bg-basalt-popover px-4 py-3 text-sm text-basalt-popover-foreground shadow-md outline-hidden", r),
+		className: e(t, n, "basalt-floating rounded-basalt-md border border-basalt-border bg-basalt-popover p-basalt-card text-basalt-base leading-[var(--basalt-line-body)] text-basalt-popover-foreground shadow-md outline-hidden", r),
 		...p,
 		children: [/* @__PURE__ */ a(i, { children: f }), d ? /* @__PURE__ */ a(s.Arrow, {
 			asChild: !0,
-			width: 20,
-			height: 10,
+			width: 12,
+			height: 6,
 			children: /* @__PURE__ */ a(h, {})
 		}) : null]
 	})
@@ -31,36 +31,31 @@ var c = [
 f.displayName = s.Content.displayName;
 var p = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a("h2", {
 	ref: r,
-	className: e("m-0 text-base font-medium leading-6 text-basalt-foreground", t),
+	className: e("m-0 mb-basalt-space-sm text-basalt-base font-medium leading-[var(--basalt-line-body)] text-basalt-popover-foreground", t),
 	...n
 }));
 p.displayName = "PopoverTitle";
 var m = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a("p", {
 	ref: r,
-	className: e("m-0 text-base leading-6 text-basalt-muted-foreground", t),
+	className: e("m-0 text-basalt-base leading-[var(--basalt-line-body)] text-basalt-muted-foreground", t),
 	...n
 }));
 m.displayName = "PopoverDescription";
 function h(e) {
-	return /* @__PURE__ */ a("svg", {
-		width: 20,
-		height: 10,
-		"aria-hidden": !0,
+	return /* @__PURE__ */ o("svg", {
 		...e,
-		children: /* @__PURE__ */ o("svg", {
-			width: "100%",
-			height: "100%",
-			viewBox: "0 0 20 10",
-			preserveAspectRatio: "none",
-			"aria-hidden": !0,
-			children: [/* @__PURE__ */ a("path", {
-				d: "M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z",
-				className: "fill-basalt-popover"
-			}), /* @__PURE__ */ a("path", {
-				d: "M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z",
-				className: "fill-basalt-border"
-			})]
-		})
+		width: 12,
+		height: 6,
+		viewBox: "0 0 12 6",
+		"aria-hidden": !0,
+		children: [/* @__PURE__ */ a("path", {
+			d: "M0 0H12L6 6Z",
+			className: "fill-basalt-popover"
+		}), /* @__PURE__ */ a("path", {
+			d: "M0 0L6 6L12 0",
+			fill: "none",
+			className: "stroke-basalt-border"
+		})]
 	});
 }
 //#endregion

package/dist/components/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","names":[],"sources":["../../src/components/popover.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Slottable } from \"@radix-ui/react-slot\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { MENU_GAP, OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const POPOVER_SIDES = [\"top\", \"bottom\", \"left\", \"right\"] as const;\nexport type PopoverSide = (typeof POPOVER_SIDES)[number];\n\ntype RadixPopoverProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Root>;\ntype RadixPopoverTriggerProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Trigger>;\ntype RadixPopoverCloseProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Close>;\ntype RadixPopoverContentProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>;\n\nexport interface PopoverProps\n\textends Omit<RadixPopoverProps, \"children\" | \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Popover structure elements, typically PopoverTrigger and PopoverContent.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Controlled open state of the popover.\n\t */\n\topen?: RadixPopoverProps[\"open\"];\n\t/**\n\t * Uncontrolled initial open state of the popover.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixPopoverProps[\"defaultOpen\"];\n\t/**\n\t * Callback called when the open state changes.\n\t */\n\tonOpenChange?: RadixPopoverProps[\"onOpenChange\"];\n\t/**\n\t * Whether the popover renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default false\n\t */\n\tmodal?: RadixPopoverProps[\"modal\"];\n}\n\nexport const Popover: React.FC<PopoverProps> = PopoverPrimitive.Root;\n\nexport interface PopoverTriggerProps extends Omit<RadixPopoverTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * PopoverTrigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverTriggerProps[\"asChild\"];\n}\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport interface PopoverCloseProps extends Omit<RadixPopoverCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * PopoverClose forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverCloseProps[\"asChild\"];\n}\n\nexport const PopoverClose = PopoverPrimitive.Close;\n\nexport interface PopoverContentProps\n\textends Omit<\n\t\tRadixPopoverContentProps,\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| \"forceMount\"\n\t\t| \"asChild\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Preferred placement side relative to trigger.\n\t * @default \"bottom\"\n\t */\n\tside?: RadixPopoverContentProps[\"side\"];\n\t/**\n\t * Distance in pixels between trigger and floating content panel.\n\t * @default 8\n\t */\n\tsideOffset?: RadixPopoverContentProps[\"sideOffset\"];\n\t/**\n\t * Preferred alignment along the side axis.\n\t * @default \"center\"\n\t */\n\talign?: RadixPopoverContentProps[\"align\"];\n\t/**\n\t * Offset in pixels from the start or end alignment position.\n\t * @default 0\n\t */\n\talignOffset?: RadixPopoverContentProps[\"alignOffset\"];\n\t/**\n\t * Whether to reposition content to avoid viewport boundary collisions.\n\t * @default true\n\t */\n\tavoidCollisions?: RadixPopoverContentProps[\"avoidCollisions\"];\n\t/**\n\t * Element or elements bounding boundary collision calculations.\n\t * @default []\n\t */\n\tcollisionBoundary?: RadixPopoverContentProps[\"collisionBoundary\"];\n\t/**\n\t * Virtual padding from collision boundaries in pixels.\n\t * @default 0\n\t */\n\tcollisionPadding?: RadixPopoverContentProps[\"collisionPadding\"];\n\t/**\n\t * Padding in pixels between popper arrow and floating panel edge.\n\t * @default 0\n\t */\n\tarrowPadding?: RadixPopoverContentProps[\"arrowPadding\"];\n\t/**\n\t * Sticky positioning behavior along the align axis when overflowing.\n\t * @default \"partial\"\n\t */\n\tsticky?: RadixPopoverContentProps[\"sticky\"];\n\t/**\n\t * Whether to hide content completely when trigger is fully occluded.\n\t * @default false\n\t */\n\thideWhenDetached?: RadixPopoverContentProps[\"hideWhenDetached\"];\n\t/**\n\t * Strategy used to calculate and update popper position.\n\t * @default \"optimized\"\n\t */\n\tupdatePositionStrategy?: RadixPopoverContentProps[\"updatePositionStrategy\"];\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 * PopoverContent forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverContentProps[\"asChild\"];\n\t/**\n\t * Callback fired when auto-focusing on open. Can be prevented.\n\t */\n\tonOpenAutoFocus?: RadixPopoverContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Callback fired when auto-focusing on close. Can be prevented.\n\t */\n\tonCloseAutoFocus?: RadixPopoverContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Callback fired when the Escape key is down on the dismissable layer. Can be prevented.\n\t */\n\tonEscapeKeyDown?: RadixPopoverContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Callback fired when a pointerdown event happens outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonPointerDownOutside?: RadixPopoverContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Callback fired when focus moves outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonFocusOutside?: RadixPopoverContentProps[\"onFocusOutside\"];\n\t/**\n\t * Callback fired when an interaction (pointerdown or focus) happens outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonInteractOutside?: RadixPopoverContentProps[\"onInteractOutside\"];\n\t/**\n\t * Show the pointing arrow.\n\t * @default true\n\t */\n\tarrow?: boolean;\n}\n\nexport const PopoverContent = React.forwardRef<\n\tReact.ElementRef<typeof PopoverPrimitive.Content>,\n\tPopoverContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\talign = \"center\",\n\t\t\tside = \"bottom\",\n\t\t\tsideOffset = MENU_GAP,\n\t\t\tarrow = true,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<PopoverPrimitive.Portal forceMount={props.forceMount}>\n\t\t\t<PopoverPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\talign={align}\n\t\t\t\tside={side}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tOVERLAY_LAYER,\n\t\t\t\t\tOVERLAY_MOTION,\n\t\t\t\t\t\"rounded-basalt-md border border-basalt-border bg-basalt-popover px-4 py-3 text-sm text-basalt-popover-foreground shadow-md outline-hidden\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<Slottable>{children}</Slottable>\n\t\t\t\t{arrow ? (\n\t\t\t\t\t<PopoverPrimitive.Arrow asChild width={20} height={10}>\n\t\t\t\t\t\t<ArrowSvg />\n\t\t\t\t\t</PopoverPrimitive.Arrow>\n\t\t\t\t) : null}\n\t\t\t</PopoverPrimitive.Content>\n\t\t</PopoverPrimitive.Portal>\n\t),\n);\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\nexport interface PopoverTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}\n\nexport const PopoverTitle = React.forwardRef<HTMLHeadingElement, PopoverTitleProps>(\n\t({ className, ...props }, ref) => (\n\t\t<h2\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"m-0 text-base font-medium leading-6 text-basalt-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nPopoverTitle.displayName = \"PopoverTitle\";\n\nexport interface PopoverDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nexport const PopoverDescription = React.forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n\t({ className, ...props }, ref) => (\n\t\t<p\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"m-0 text-base leading-6 text-basalt-muted-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nPopoverDescription.displayName = \"PopoverDescription\";\n\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n\treturn (\n\t\t<svg width={20} height={10} aria-hidden {...props}>\n\t\t\t<svg width=\"100%\" height=\"100%\" viewBox=\"0 0 20 10\" preserveAspectRatio=\"none\" aria-hidden>\n\t\t\t\t<path\n\t\t\t\t\td=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n\t\t\t\t\tclassName=\"fill-basalt-popover\"\n\t\t\t\t/>\n\t\t\t\t<path\n\t\t\t\t\td=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n\t\t\t\t\tclassName=\"fill-basalt-border\"\n\t\t\t\t/>\n\t\t\t</svg>\n\t\t</svg>\n\t);\n}\n"],"mappings":";;;;;;;;AAMA,IAAa,IAAgB;CAAC;CAAO;CAAU;CAAQ;AAAO,GAkCjD,IAAkC,EAAiB,MAWnD,IAAiB,EAAiB,SAWlC,IAAe,EAAiB,OA4HhC,IAAiB,EAAM,YAKlC,EACC,cACA,WAAQ,UACR,UAAO,UACP,gBAAA,GACA,WAAQ,IACR,aACA,GAAG,KAEJ,MAEA,kBAAC,EAAiB,QAAlB;CAAyB,YAAY,EAAM;CAC1C,UAAA,kBAAC,EAAiB,SAAlB;EACM;EACE;EACD;EACM;EACZ,WAAW,EACV,GACA,GACA,6IACA,CACD;EACA,GAAI;EAXL,UAAA,CAaC,kBAAC,GAAD,EAAY,YAAoB,CAAA,GAC/B,IACA,kBAAC,EAAiB,OAAlB;GAAwB,SAAA;GAAQ,OAAO;GAAI,QAAQ;GAClD,UAAA,kBAAC,GAAD,CAAW,CAAA;EACY,CAAA,IACrB,IACqB;;AACF,CAAA,CAE3B;AACA,EAAe,cAAc,EAAiB,QAAQ;AAItD,IAAa,IAAe,EAAM,YAChC,EAAE,cAAW,GAAG,KAAS,MACzB,kBAAC,MAAD;CACM;CACL,WAAW,EAAG,8DAA8D,CAAS;CACrF,GAAI;AACJ,CAAA,CAEH;AACA,EAAa,cAAc;AAI3B,IAAa,IAAqB,EAAM,YACtC,EAAE,cAAW,GAAG,KAAS,MACzB,kBAAC,KAAD;CACM;CACL,WAAW,EAAG,wDAAwD,CAAS;CAC/E,GAAI;AACJ,CAAA,CAEH;AACA,EAAmB,cAAc;AAEjC,SAAS,EAAS,GAAoC;CACrD,OACC,kBAAC,OAAD;EAAK,OAAO;EAAI,QAAQ;EAAI,eAAA;EAAY,GAAI;EAC3C,UAAA,kBAAC,OAAD;GAAK,OAAM;GAAO,QAAO;GAAO,SAAQ;GAAY,qBAAoB;GAAO,eAAA;GAA/E,UAAA,CACC,kBAAC,QAAD;IACC,GAAE;IACF,WAAU;GACV,CAAA,GACD,kBAAC,QAAD;IACC,GAAE;IACF,WAAU;GACV,CAAA,CACG;;CACD,CAAA;AAEP"}
+{"version":3,"file":"popover.js","names":["React","PopoverPrimitive","POPOVER_SIDES","Popover","PopoverTrigger","PopoverClose","PopoverContent","props","cn","OVERLAY_LAYER","OVERLAY_MOTION","className","Slottable","arrow","ArrowSvg","PopoverTitle","PopoverDescription"],"sources":["../../src/components/popover.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Slottable } from \"@radix-ui/react-slot\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { MENU_GAP, OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const POPOVER_SIDES = [\"top\", \"bottom\", \"left\", \"right\"] as const;\nexport type PopoverSide = (typeof POPOVER_SIDES)[number];\n\ntype RadixPopoverProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Root>;\ntype RadixPopoverTriggerProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Trigger>;\ntype RadixPopoverCloseProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Close>;\ntype RadixPopoverContentProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>;\n\nexport interface PopoverProps\n\textends Omit<RadixPopoverProps, \"children\" | \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Popover structure elements, typically PopoverTrigger and PopoverContent.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Controlled open state of the popover.\n\t */\n\topen?: RadixPopoverProps[\"open\"];\n\t/**\n\t * Uncontrolled initial open state of the popover.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixPopoverProps[\"defaultOpen\"];\n\t/**\n\t * Callback called when the open state changes.\n\t */\n\tonOpenChange?: RadixPopoverProps[\"onOpenChange\"];\n\t/**\n\t * Whether the popover renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default false\n\t */\n\tmodal?: RadixPopoverProps[\"modal\"];\n}\n\nexport const Popover: React.FC<PopoverProps> = PopoverPrimitive.Root;\n\nexport interface PopoverTriggerProps extends Omit<RadixPopoverTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * PopoverTrigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverTriggerProps[\"asChild\"];\n}\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport interface PopoverCloseProps extends Omit<RadixPopoverCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * PopoverClose forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverCloseProps[\"asChild\"];\n}\n\nexport const PopoverClose = PopoverPrimitive.Close;\n\nexport interface PopoverContentProps\n\textends Omit<\n\t\tRadixPopoverContentProps,\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| \"forceMount\"\n\t\t| \"asChild\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Preferred placement side relative to trigger.\n\t * @default \"bottom\"\n\t */\n\tside?: RadixPopoverContentProps[\"side\"];\n\t/**\n\t * Distance in pixels between trigger and floating content panel.\n\t * @default 8\n\t */\n\tsideOffset?: RadixPopoverContentProps[\"sideOffset\"];\n\t/**\n\t * Preferred alignment along the side axis.\n\t * @default \"center\"\n\t */\n\talign?: RadixPopoverContentProps[\"align\"];\n\t/**\n\t * Offset in pixels from the start or end alignment position.\n\t * @default 0\n\t */\n\talignOffset?: RadixPopoverContentProps[\"alignOffset\"];\n\t/**\n\t * Whether to reposition content to avoid viewport boundary collisions.\n\t * @default true\n\t */\n\tavoidCollisions?: RadixPopoverContentProps[\"avoidCollisions\"];\n\t/**\n\t * Element or elements bounding boundary collision calculations.\n\t * @default []\n\t */\n\tcollisionBoundary?: RadixPopoverContentProps[\"collisionBoundary\"];\n\t/**\n\t * Virtual padding from collision boundaries in pixels.\n\t * @default 0\n\t */\n\tcollisionPadding?: RadixPopoverContentProps[\"collisionPadding\"];\n\t/**\n\t * Padding in pixels between popper arrow and floating panel edge.\n\t * @default 0\n\t */\n\tarrowPadding?: RadixPopoverContentProps[\"arrowPadding\"];\n\t/**\n\t * Sticky positioning behavior along the align axis when overflowing.\n\t * @default \"partial\"\n\t */\n\tsticky?: RadixPopoverContentProps[\"sticky\"];\n\t/**\n\t * Whether to hide content completely when trigger is fully occluded.\n\t * @default false\n\t */\n\thideWhenDetached?: RadixPopoverContentProps[\"hideWhenDetached\"];\n\t/**\n\t * Strategy used to calculate and update popper position.\n\t * @default \"optimized\"\n\t */\n\tupdatePositionStrategy?: RadixPopoverContentProps[\"updatePositionStrategy\"];\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 * PopoverContent forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixPopoverContentProps[\"asChild\"];\n\t/**\n\t * Callback fired when auto-focusing on open. Can be prevented.\n\t */\n\tonOpenAutoFocus?: RadixPopoverContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Callback fired when auto-focusing on close. Can be prevented.\n\t */\n\tonCloseAutoFocus?: RadixPopoverContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Callback fired when the Escape key is down on the dismissable layer. Can be prevented.\n\t */\n\tonEscapeKeyDown?: RadixPopoverContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Callback fired when a pointerdown event happens outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonPointerDownOutside?: RadixPopoverContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Callback fired when focus moves outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonFocusOutside?: RadixPopoverContentProps[\"onFocusOutside\"];\n\t/**\n\t * Callback fired when an interaction (pointerdown or focus) happens outside the bounds of the dismissable layer. Can be prevented.\n\t */\n\tonInteractOutside?: RadixPopoverContentProps[\"onInteractOutside\"];\n\t/**\n\t * Show the pointing arrow.\n\t * @default true\n\t */\n\tarrow?: boolean;\n}\n\nexport const PopoverContent = React.forwardRef<\n\tReact.ElementRef<typeof PopoverPrimitive.Content>,\n\tPopoverContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\talign = \"center\",\n\t\t\tside = \"bottom\",\n\t\t\tsideOffset = MENU_GAP,\n\t\t\tarrow = true,\n\t\t\tchildren,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<PopoverPrimitive.Portal forceMount={props.forceMount}>\n\t\t\t<PopoverPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\talign={align}\n\t\t\t\tside={side}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tOVERLAY_LAYER,\n\t\t\t\t\tOVERLAY_MOTION,\n\t\t\t\t\t\"basalt-floating rounded-basalt-md border border-basalt-border bg-basalt-popover p-basalt-card text-basalt-base leading-[var(--basalt-line-body)] text-basalt-popover-foreground shadow-md outline-hidden\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<Slottable>{children}</Slottable>\n\t\t\t\t{arrow ? (\n\t\t\t\t\t<PopoverPrimitive.Arrow asChild width={12} height={6}>\n\t\t\t\t\t\t<ArrowSvg />\n\t\t\t\t\t</PopoverPrimitive.Arrow>\n\t\t\t\t) : null}\n\t\t\t</PopoverPrimitive.Content>\n\t\t</PopoverPrimitive.Portal>\n\t),\n);\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\nexport interface PopoverTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}\n\nexport const PopoverTitle = React.forwardRef<HTMLHeadingElement, PopoverTitleProps>(\n\t({ className, ...props }, ref) => (\n\t\t<h2\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"m-0 mb-basalt-space-sm text-basalt-base font-medium leading-[var(--basalt-line-body)] text-basalt-popover-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nPopoverTitle.displayName = \"PopoverTitle\";\n\nexport interface PopoverDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {}\n\nexport const PopoverDescription = React.forwardRef<HTMLParagraphElement, PopoverDescriptionProps>(\n\t({ className, ...props }, ref) => (\n\t\t<p\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"m-0 text-basalt-base leading-[var(--basalt-line-body)] text-basalt-muted-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nPopoverDescription.displayName = \"PopoverDescription\";\n\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n\treturn (\n\t\t<svg {...props} width={12} height={6} viewBox=\"0 0 12 6\" aria-hidden>\n\t\t\t<path d=\"M0 0H12L6 6Z\" className=\"fill-basalt-popover\" />\n\t\t\t<path d=\"M0 0L6 6L12 0\" fill=\"none\" className=\"stroke-basalt-border\" />\n\t\t</svg>\n\t);\n}\n"],"mappings":";;;;;;;;AAMA,IAAaE,IAAgB;CAAC;CAAO;CAAU;CAAQ;AAAO,GAkCjDC,IAAkCF,EAAiB,MAWnDG,IAAiBH,EAAiB,SAWlCI,IAAeJ,EAAiB,OA4HhCK,IAAiBN,EAAM,YAKlC,EACC,cACA,WAAQ,UACR,UAAO,UACP,gBAAA,GACA,WAAQ,IACR,aACA,GAAGO,KAEJ,MAEA,kBAACN,EAAiB,QAAlB;CAAyB,YAAYM,EAAM;CAC1C,UAAA,kBAACN,EAAiB,SAAlB;EACM;EACE;EACD;EACM;EACZ,WAAWO,EACVC,GACAC,GACA,4MACAC,CACD;EACA,GAAIJ;EAXL,UAAA,CAaC,kBAACK,GAAD,EAAY,YAAoB,CAAA,GAC/BC,IACA,kBAACZ,EAAiB,OAAlB;GAAwB,SAAA;GAAQ,OAAO;GAAI,QAAQ;GAClD,UAAA,kBAACa,GAAD,CAAW,CAAA;EACY,CAAA,IACrB,IACqB;;AACF,CAAA,CAE3B;AACA,EAAe,cAAcb,EAAiB,QAAQ;AAItD,IAAac,IAAef,EAAM,YAChC,EAAE,cAAW,GAAGO,KAAS,MACzB,kBAAC,MAAD;CACM;CACL,WAAWC,EACV,wHACAG,CACD;CACA,GAAIJ;AACJ,CAAA,CAEH;AACA,EAAa,cAAc;AAI3B,IAAaS,IAAqBhB,EAAM,YACtC,EAAE,cAAW,GAAGO,KAAS,MACzB,kBAAC,KAAD;CACM;CACL,WAAWC,EACV,uFACAG,CACD;CACA,GAAIJ;AACJ,CAAA,CAEH;AACA,EAAmB,cAAc;AAEjC,SAASO,EAAS,GAAoC;CACrD,OACC,kBAAC,OAAD;EAAK,GAAIP;EAAO,OAAO;EAAI,QAAQ;EAAG,SAAQ;EAAW,eAAA;EAAzD,UAAA,CACC,kBAAC,QAAD;GAAM,GAAE;GAAe,WAAU;EAAuB,CAAA,GACxD,kBAAC,QAAD;GAAM,GAAE;GAAgB,MAAK;GAAO,WAAU;EAAwB,CAAA,CAClE;;AAEP"}

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

@@ -0,0 +1,16 @@
+import { type ChatComposerProps } from "./chat-composer.js";
+export type PromptModel = {
+    id: string;
+    label: string;
+    disabled?: boolean;
+};
+export interface PromptBarProps extends Omit<ChatComposerProps, "toolbar"> {
+    models: readonly PromptModel[];
+    model: string;
+    onModelChange: (model: string) => void;
+    reasoning?: boolean;
+    onReasoningChange?: (value: boolean) => void;
+    webSearch?: boolean;
+    onWebSearchChange?: (value: boolean) => void;
+}
+export declare function PromptBar({ models, model, onModelChange, reasoning, onReasoningChange, webSearch, onWebSearchChange, ...props }: PromptBarProps): import("react").JSX.Element;

package/dist/components/prompt-bar.js

@@ -0,0 +1,49 @@
+"use client";
+import { ChatComposer as e } from "./chat-composer.js";
+import { Select as t, SelectContent as n, SelectItem as r, SelectTrigger as i, SelectValue as a } from "./select.js";
+import { Toggle as o } from "./toggle.js";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/prompt-bar.tsx
+function u({ models: u, model: d, onModelChange: f, reasoning: p, onReasoningChange: m, webSearch: h, onWebSearchChange: g, ..._ }) {
+	let v = _.disabled || _.streaming;
+	return /* @__PURE__ */ c(e, {
+		..._,
+		toolbar: /* @__PURE__ */ l(s, { children: [
+			/* @__PURE__ */ l(t, {
+				value: d,
+				onValueChange: f,
+				disabled: v,
+				children: [/* @__PURE__ */ c(i, {
+					size: "sm",
+					"aria-label": "Model",
+					className: "w-auto min-w-0 max-w-full border-0 bg-transparent shadow-none",
+					children: /* @__PURE__ */ c(a, {})
+				}), /* @__PURE__ */ c(n, { children: u.map((e) => /* @__PURE__ */ c(r, {
+					value: e.id,
+					disabled: e.disabled,
+					children: e.label
+				}, e.id)) })]
+			}),
+			m && /* @__PURE__ */ c(o, {
+				size: "sm",
+				pressed: p,
+				onPressedChange: m,
+				disabled: v,
+				"aria-label": "Reasoning",
+				children: "Think"
+			}),
+			g && /* @__PURE__ */ c(o, {
+				size: "sm",
+				pressed: h,
+				onPressedChange: g,
+				disabled: v,
+				"aria-label": "Web search",
+				children: "Search"
+			})
+		] })
+	});
+}
+//#endregion
+export { u as PromptBar };
+
+//# sourceMappingURL=prompt-bar.js.map

package/dist/components/prompt-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prompt-bar.js","names":["_Fragment","PromptBar","props","disabled","ChatComposer","Fragment","Select","model","onModelChange","SelectTrigger","SelectValue","SelectContent","models","SelectItem","item","onReasoningChange","Toggle","reasoning","onWebSearchChange","webSearch"],"sources":["../../src/components/prompt-bar.tsx"],"sourcesContent":["import { ChatComposer, type ChatComposerProps } from \"./chat-composer\";\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from \"./select\";\nimport { Toggle } from \"./toggle\";\n\nexport type PromptModel = { id: string; label: string; disabled?: boolean };\nexport interface PromptBarProps extends Omit<ChatComposerProps, \"toolbar\"> {\n\tmodels: readonly PromptModel[];\n\tmodel: string;\n\tonModelChange: (model: string) => void;\n\treasoning?: boolean;\n\tonReasoningChange?: (value: boolean) => void;\n\twebSearch?: boolean;\n\tonWebSearchChange?: (value: boolean) => void;\n}\n\nexport function PromptBar({\n\tmodels,\n\tmodel,\n\tonModelChange,\n\treasoning,\n\tonReasoningChange,\n\twebSearch,\n\tonWebSearchChange,\n\t...props\n}: PromptBarProps) {\n\tconst disabled = props.disabled || props.streaming;\n\treturn (\n\t\t<ChatComposer\n\t\t\t{...props}\n\t\t\ttoolbar={\n\t\t\t\t<>\n\t\t\t\t\t<Select value={model} onValueChange={onModelChange} disabled={disabled}>\n\t\t\t\t\t\t<SelectTrigger\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\taria-label=\"Model\"\n\t\t\t\t\t\t\tclassName=\"w-auto min-w-0 max-w-full border-0 bg-transparent shadow-none\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SelectValue />\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t{models.map((item) => (\n\t\t\t\t\t\t\t\t<SelectItem key={item.id} value={item.id} disabled={item.disabled}>\n\t\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\t\t\t\t\t{onReasoningChange && (\n\t\t\t\t\t\t<Toggle\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\tpressed={reasoning}\n\t\t\t\t\t\t\tonPressedChange={onReasoningChange}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\taria-label=\"Reasoning\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tThink\n\t\t\t\t\t\t</Toggle>\n\t\t\t\t\t)}\n\t\t\t\t\t{onWebSearchChange && (\n\t\t\t\t\t\t<Toggle\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\tpressed={webSearch}\n\t\t\t\t\t\t\tonPressedChange={onWebSearchChange}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\taria-label=\"Web search\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tSearch\n\t\t\t\t\t\t</Toggle>\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAeA,SAAgBC,EAAU,EACzB,WACA,UACA,kBACA,cACA,sBACA,cACA,sBACA,GAAGC,KACe;CAClB,IAAMC,IAAWD,EAAM,YAAYA,EAAM;CACzC,OACC,kBAACE,GAAD;EACC,GAAIF;EACJ,SACC,kBAAAF,GAAA,EAAA,UAAA;GACC,kBAACM,GAAD;IAAQ,OAAOC;IAAO,eAAeC;IAAyB;IAA9D,UAAA,CACC,kBAACC,GAAD;KACC,MAAK;KACL,cAAW;KACX,WAAU;KAEV,UAAA,kBAACC,GAAD,CAAc,CAAA;IACA,CAAA,GACf,kBAACC,GAAD,EAAA,UACEC,EAAO,KAAK,MACZ,kBAACC,GAAD;KAA0B,OAAOC,EAAK;KAAI,UAAUA,EAAK;KACvD,UAAAA,EAAK;IACK,GAFKA,EAAK,EAEV,CACZ,EACa,CAAA,CACR;;GACPC,KACA,kBAACC,GAAD;IACC,MAAK;IACL,SAASC;IACT,iBAAiBF;IACP;IACV,cAAW;IACX,UAAA;GAEO,CAAA;GAERG,KACA,kBAACF,GAAD;IACC,MAAK;IACL,SAASG;IACT,iBAAiBD;IACP;IACV,cAAW;IACX,UAAA;GAEO,CAAA;EAER,EAAA,CAAA;CAEH,CAAA;AAEH"}

package/dist/components/radio.js

@@ -8,14 +8,14 @@ import { jsx as a, jsxs as o } from "react/jsx-runtime";
 import * as s from "@radix-ui/react-radio-group";
 //#region src/components/radio.tsx
 var c = {
-	sm: "h-3 w-3",
-	default: "h-4 w-4"
+	sm: "h-basalt-check-sm w-basalt-check-sm",
+	default: "h-basalt-check w-basalt-check"
 }, l = {
-	sm: "h-1.5 w-1.5 fill-current text-current",
-	default: "h-2.5 w-2.5 fill-current text-current"
+	sm: "h-basalt-1_5 w-basalt-1_5 fill-current text-current",
+	default: "h-basalt-2_5 w-basalt-2_5 fill-current text-current"
 }, u = r.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a("legend", {
 	ref: r,
-	className: e("text-sm font-medium text-basalt-foreground", t),
+	className: e("mb-basalt-field-gap text-basalt-base font-medium leading-[var(--basalt-line-body)] text-basalt-foreground", t),
 	...n
 }));
 u.displayName = "Radio.Legend";
@@ -37,13 +37,13 @@ var d = r.forwardRef(({ className: t, error: n, disabled: i = !1, children: c, "
 	}), S = [x.map((e) => e.props.id).filter(Boolean).join(" "), f].filter(Boolean).join(" ") || void 0, C = [g ? _ : null, l].filter(Boolean).join(" ") || void 0;
 	return /* @__PURE__ */ o("fieldset", {
 		disabled: i,
-		className: "flex flex-col gap-2",
+		className: "basalt-ui flex flex-col gap-basalt-field-gap",
 		children: [
 			x,
 			/* @__PURE__ */ a(s.Root, {
 				ref: m,
 				disabled: i,
-				className: e("grid gap-2", t),
+				className: e("grid gap-basalt-space-lg", t),
 				...p,
 				"aria-labelledby": S,
 				"aria-describedby": C,
@@ -52,7 +52,7 @@ var d = r.forwardRef(({ className: t, error: n, disabled: i = !1, children: c, "
 			}),
 			g ? /* @__PURE__ */ a("p", {
 				id: _,
-				className: "text-xs text-basalt-destructive",
+				className: "text-basalt-sm text-basalt-destructive",
 				role: "alert",
 				children: n
 			}) : null
@@ -62,7 +62,7 @@ var d = r.forwardRef(({ className: t, error: n, disabled: i = !1, children: c, "
 d.displayName = "Radio.Group";
 var f = r.forwardRef(({ className: r, size: o = "default", ...u }, d) => /* @__PURE__ */ a(s.Item, {
 	ref: d,
-	className: e(t, "aspect-square shrink-0 rounded-full border border-basalt-primary text-basalt-primary disabled:cursor-not-allowed disabled:opacity-50", c[o], n, r),
+	className: e(t, "aspect-square shrink-0 rounded-basalt-full border border-basalt-primary text-basalt-primary disabled:cursor-not-allowed disabled:opacity-50", c[o], n, r),
 	...u,
 	children: /* @__PURE__ */ a(s.Indicator, {
 		className: "flex items-center justify-center",

package/dist/components/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","names":[],"sources":["../../src/components/radio.tsx"],"sourcesContent":["import * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport { Circle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { FOCUS_RING } from \"./overlay\";\n\nexport type RadioSize = \"sm\" | \"default\";\n\nconst RADIO_SIZE_CLASS: Record<RadioSize, string> = {\n\tsm: \"h-3 w-3\",\n\tdefault: \"h-4 w-4\",\n};\n\nconst RADIO_INDICATOR_CLASS: Record<RadioSize, string> = {\n\tsm: \"h-1.5 w-1.5 fill-current text-current\",\n\tdefault: \"h-2.5 w-2.5 fill-current text-current\",\n};\n\nexport type RadioGroupProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>,\n\t\"disabled\" | \"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected value.\n\t */\n\tvalue?: string;\n\t/**\n\t * The initially selected value.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected value changes.\n\t */\n\tonValueChange?: (value: string) => void;\n\t/**\n\t * Marks the group invalid and shows alert copy.\n\t */\n\terror?: React.ReactNode;\n\t/**\n\t * Disable every item in the group.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport type RadioLegendProps = React.ComponentPropsWithoutRef<\"legend\">;\n\nexport type RadioProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>,\n\t\"value\"\n> & {\n\t/**\n\t * The value associated with the radio item.\n\t */\n\tvalue: string;\n\t/**\n\t * The visual size of the radio.\n\t * @default default\n\t */\n\tsize?: RadioSize;\n};\n\nconst RadioLegend = React.forwardRef<HTMLLegendElement, RadioLegendProps>(\n\t({ className, ...props }, ref) => (\n\t\t<legend\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"text-sm font-medium text-basalt-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nRadioLegend.displayName = \"Radio.Legend\";\n\nexport const RadioGroup = React.forwardRef<\n\tReact.ElementRef<typeof RadioGroupPrimitive.Root>,\n\tRadioGroupProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\terror,\n\t\t\tdisabled = false,\n\t\t\tchildren,\n\t\t\t\"aria-describedby\": describedBy,\n\t\t\t\"aria-invalid\": ariaInvalid,\n\t\t\t\"aria-labelledby\": labelledBy,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst generatedId = React.useId();\n\t\tconst invalid = Boolean(error);\n\t\tconst errorId = `${generatedId}-error`;\n\t\tconst defaultLegendId = `${generatedId}-legend`;\n\t\tconst legends: React.ReactElement<RadioLegendProps>[] = [];\n\t\tconst items: React.ReactNode[] = [];\n\t\tReact.Children.forEach(children, (child) => {\n\t\t\tif (React.isValidElement(child) && child.type === RadioLegend) {\n\t\t\t\tlegends.push(child as React.ReactElement<RadioLegendProps>);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\titems.push(child);\n\t\t});\n\t\tconst labeledLegends = legends.map((legend, index) => {\n\t\t\tconst legendId =\n\t\t\t\tlegend.props.id ?? (index === 0 ? defaultLegendId : `${defaultLegendId}-${index}`);\n\t\t\treturn React.cloneElement(legend, { key: legendId, id: legendId });\n\t\t});\n\t\tconst legendIds = labeledLegends\n\t\t\t.map((legend) => legend.props.id)\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\tconst mergedLabelledBy = [legendIds, labelledBy].filter(Boolean).join(\" \") || undefined;\n\t\tconst mergedDescribedBy =\n\t\t\t[invalid ? errorId : null, describedBy].filter(Boolean).join(\" \") || undefined;\n\t\treturn (\n\t\t\t<fieldset disabled={disabled} className=\"flex flex-col gap-2\">\n\t\t\t\t{labeledLegends}\n\t\t\t\t<RadioGroupPrimitive.Root\n\t\t\t\t\tref={ref}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tclassName={cn(\"grid gap-2\", className)}\n\t\t\t\t\t{...props}\n\t\t\t\t\taria-labelledby={mergedLabelledBy}\n\t\t\t\t\taria-describedby={mergedDescribedBy}\n\t\t\t\t\taria-invalid={invalid ? true : ariaInvalid}\n\t\t\t\t>\n\t\t\t\t\t{items}\n\t\t\t\t</RadioGroupPrimitive.Root>\n\t\t\t\t{invalid ? (\n\t\t\t\t\t<p id={errorId} className=\"text-xs text-basalt-destructive\" role=\"alert\">\n\t\t\t\t\t\t{error}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t</fieldset>\n\t\t);\n\t},\n);\nRadioGroup.displayName = \"Radio.Group\";\n\nconst RadioRoot = React.forwardRef<React.ElementRef<typeof RadioGroupPrimitive.Item>, RadioProps>(\n\t({ className, size = \"default\", ...props }, ref) => (\n\t\t<RadioGroupPrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"aspect-square shrink-0 rounded-full border border-basalt-primary text-basalt-primary disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tRADIO_SIZE_CLASS[size],\n\t\t\t\tFOCUS_RING,\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<RadioGroupPrimitive.Indicator className=\"flex items-center justify-center\">\n\t\t\t\t<Circle className={RADIO_INDICATOR_CLASS[size]} />\n\t\t\t</RadioGroupPrimitive.Indicator>\n\t\t</RadioGroupPrimitive.Item>\n\t),\n);\nRadioRoot.displayName = RadioGroupPrimitive.Item.displayName;\n\nexport const Radio = Object.assign(RadioRoot, {\n\tGroup: RadioGroup,\n\tLegend: RadioLegend,\n\tItem: RadioRoot,\n});\n"],"mappings":";;;;;;;;;AASA,IAAM,IAA8C;CACnD,IAAI;CACJ,SAAS;AACV,GAEM,IAAmD;CACxD,IAAI;CACJ,SAAS;AACV,GA8CM,IAAc,EAAM,YACxB,EAAE,cAAW,GAAG,KAAS,MACzB,kBAAC,UAAD;CACM;CACL,WAAW,EAAG,8CAA8C,CAAS;CACrE,GAAI;AACJ,CAAA,CAEH;AACA,EAAY,cAAc;AAE1B,IAAa,IAAa,EAAM,YAK9B,EACC,cACA,UACA,cAAW,IACX,aACA,oBAAoB,GACpB,gBAAgB,GAChB,mBAAmB,GACnB,GAAG,KAEJ,MACI;CACJ,IAAM,IAAc,EAAM,MAAM,GAC1B,IAAU,EAAQ,GAClB,IAAU,GAAG,EAAY,SACzB,IAAkB,GAAG,EAAY,UACjC,IAAkD,CAAC,GACnD,IAA2B,CAAC;CAClC,EAAM,SAAS,QAAQ,IAAW,MAAU;EAC3C,IAAI,EAAM,eAAe,CAAK,KAAK,EAAM,SAAS,GAAa;GAC9D,EAAQ,KAAK,CAA6C;GAC1D;EACD;EACA,EAAM,KAAK,CAAK;CACjB,CAAC;CACD,IAAM,IAAiB,EAAQ,KAAK,GAAQ,MAAU;EACrD,IAAM,IACL,EAAO,MAAM,OAAO,MAAU,IAAI,IAAkB,GAAG,EAAgB,GAAG;EAC3E,OAAO,EAAM,aAAa,GAAQ;GAAE,KAAK;GAAU,IAAI;EAAS,CAAC;CAClE,CAAC,GAKK,IAAmB,CAJP,EAChB,KAAK,MAAW,EAAO,MAAM,EAAE,CAAC,CAChC,OAAO,OAAO,CAAC,CACf,KAAK,GACmB,GAAW,CAAU,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA,GACxE,IACL,CAAC,IAAU,IAAU,MAAM,CAAW,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACtE,OACC,kBAAC,YAAD;EAAoB;EAAU,WAAU;EAAxC,UAAA;GACE;GACD,kBAAC,EAAoB,MAArB;IACM;IACK;IACV,WAAW,EAAG,cAAc,CAAS;IACrC,GAAI;IACJ,mBAAiB;IACjB,oBAAkB;IAClB,gBAAc,IAAU,KAAO;IAE9B,UAAA;GACwB,CAAA;GACzB,IACA,kBAAC,KAAD;IAAG,IAAI;IAAS,WAAU;IAAkC,MAAK;IAC/D,UAAA;GACC,CAAA,IACA;EACK;;AAEZ,CACD;AACA,EAAW,cAAc;AAEzB,IAAM,IAAY,EAAM,YACtB,EAAE,cAAW,UAAO,WAAW,GAAG,KAAS,MAC3C,kBAAC,EAAoB,MAArB;CACM;CACL,WAAW,EACV,GACA,wIACA,EAAiB,IACjB,GACA,CACD;CACA,GAAI;CAEJ,UAAA,kBAAC,EAAoB,WAArB;EAA+B,WAAU;EACxC,UAAA,kBAAC,GAAD,EAAQ,WAAW,EAAsB,GAAQ,CAAA;CACnB,CAAA;AACN,CAAA,CAE5B;AACA,EAAU,cAAc,EAAoB,KAAK;AAEjD,IAAa,IAAQ,OAAO,OAAO,GAAW;CAC7C,OAAO;CACP,QAAQ;CACR,MAAM;AACP,CAAC"}
+{"version":3,"file":"radio.js","names":["React","RadioGroupPrimitive","RADIO_SIZE_CLASS","RADIO_INDICATOR_CLASS","RadioLegend","props","cn","className","RadioGroup","describedBy","ariaInvalid","labelledBy","generatedId","invalid","error","errorId","defaultLegendId","legends","items","children","child","labeledLegends","legendId","legend","index","mergedLabelledBy","mergedDescribedBy","RadioRoot","BASALT_UI_CLASS","size","FOCUS_RING","Circle","Radio"],"sources":["../../src/components/radio.tsx"],"sourcesContent":["import * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport { Circle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { FOCUS_RING } from \"./overlay\";\n\nexport type RadioSize = \"sm\" | \"default\";\n\nconst RADIO_SIZE_CLASS: Record<RadioSize, string> = {\n\tsm: \"h-basalt-check-sm w-basalt-check-sm\",\n\tdefault: \"h-basalt-check w-basalt-check\",\n};\n\nconst RADIO_INDICATOR_CLASS: Record<RadioSize, string> = {\n\tsm: \"h-basalt-1_5 w-basalt-1_5 fill-current text-current\",\n\tdefault: \"h-basalt-2_5 w-basalt-2_5 fill-current text-current\",\n};\n\nexport type RadioGroupProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>,\n\t\"disabled\" | \"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected value.\n\t */\n\tvalue?: string;\n\t/**\n\t * The initially selected value.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected value changes.\n\t */\n\tonValueChange?: (value: string) => void;\n\t/**\n\t * Marks the group invalid and shows alert copy.\n\t */\n\terror?: React.ReactNode;\n\t/**\n\t * Disable every item in the group.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport type RadioLegendProps = React.ComponentPropsWithoutRef<\"legend\">;\n\nexport type RadioProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>,\n\t\"value\"\n> & {\n\t/**\n\t * The value associated with the radio item.\n\t */\n\tvalue: string;\n\t/**\n\t * The visual size of the radio.\n\t * @default default\n\t */\n\tsize?: RadioSize;\n};\n\nconst RadioLegend = React.forwardRef<HTMLLegendElement, RadioLegendProps>(\n\t({ className, ...props }, ref) => (\n\t\t<legend\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"mb-basalt-field-gap text-basalt-base font-medium leading-[var(--basalt-line-body)] text-basalt-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nRadioLegend.displayName = \"Radio.Legend\";\n\nexport const RadioGroup = React.forwardRef<\n\tReact.ElementRef<typeof RadioGroupPrimitive.Root>,\n\tRadioGroupProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\terror,\n\t\t\tdisabled = false,\n\t\t\tchildren,\n\t\t\t\"aria-describedby\": describedBy,\n\t\t\t\"aria-invalid\": ariaInvalid,\n\t\t\t\"aria-labelledby\": labelledBy,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst generatedId = React.useId();\n\t\tconst invalid = Boolean(error);\n\t\tconst errorId = `${generatedId}-error`;\n\t\tconst defaultLegendId = `${generatedId}-legend`;\n\t\tconst legends: React.ReactElement<RadioLegendProps>[] = [];\n\t\tconst items: React.ReactNode[] = [];\n\t\tReact.Children.forEach(children, (child) => {\n\t\t\tif (React.isValidElement(child) && child.type === RadioLegend) {\n\t\t\t\tlegends.push(child as React.ReactElement<RadioLegendProps>);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\titems.push(child);\n\t\t});\n\t\tconst labeledLegends = legends.map((legend, index) => {\n\t\t\tconst legendId =\n\t\t\t\tlegend.props.id ?? (index === 0 ? defaultLegendId : `${defaultLegendId}-${index}`);\n\t\t\treturn React.cloneElement(legend, { key: legendId, id: legendId });\n\t\t});\n\t\tconst legendIds = labeledLegends\n\t\t\t.map((legend) => legend.props.id)\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\t\tconst mergedLabelledBy = [legendIds, labelledBy].filter(Boolean).join(\" \") || undefined;\n\t\tconst mergedDescribedBy =\n\t\t\t[invalid ? errorId : null, describedBy].filter(Boolean).join(\" \") || undefined;\n\t\treturn (\n\t\t\t<fieldset disabled={disabled} className=\"basalt-ui flex flex-col gap-basalt-field-gap\">\n\t\t\t\t{labeledLegends}\n\t\t\t\t<RadioGroupPrimitive.Root\n\t\t\t\t\tref={ref}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tclassName={cn(\"grid gap-basalt-space-lg\", className)}\n\t\t\t\t\t{...props}\n\t\t\t\t\taria-labelledby={mergedLabelledBy}\n\t\t\t\t\taria-describedby={mergedDescribedBy}\n\t\t\t\t\taria-invalid={invalid ? true : ariaInvalid}\n\t\t\t\t>\n\t\t\t\t\t{items}\n\t\t\t\t</RadioGroupPrimitive.Root>\n\t\t\t\t{invalid ? (\n\t\t\t\t\t<p id={errorId} className=\"text-basalt-sm text-basalt-destructive\" role=\"alert\">\n\t\t\t\t\t\t{error}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t</fieldset>\n\t\t);\n\t},\n);\nRadioGroup.displayName = \"Radio.Group\";\n\nconst RadioRoot = React.forwardRef<React.ElementRef<typeof RadioGroupPrimitive.Item>, RadioProps>(\n\t({ className, size = \"default\", ...props }, ref) => (\n\t\t<RadioGroupPrimitive.Item\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"aspect-square shrink-0 rounded-basalt-full border border-basalt-primary text-basalt-primary disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tRADIO_SIZE_CLASS[size],\n\t\t\t\tFOCUS_RING,\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<RadioGroupPrimitive.Indicator className=\"flex items-center justify-center\">\n\t\t\t\t<Circle className={RADIO_INDICATOR_CLASS[size]} />\n\t\t\t</RadioGroupPrimitive.Indicator>\n\t\t</RadioGroupPrimitive.Item>\n\t),\n);\nRadioRoot.displayName = RadioGroupPrimitive.Item.displayName;\n\nexport const Radio = Object.assign(RadioRoot, {\n\tGroup: RadioGroup,\n\tLegend: RadioLegend,\n\tItem: RadioRoot,\n});\n"],"mappings":";;;;;;;;;AASA,IAAME,IAA8C;CACnD,IAAI;CACJ,SAAS;AACV,GAEMC,IAAmD;CACxD,IAAI;CACJ,SAAS;AACV,GA8CMC,IAAcJ,EAAM,YACxB,EAAE,cAAW,GAAGK,KAAS,MACzB,kBAAC,UAAD;CACM;CACL,WAAWC,EACV,6GACAC,CACD;CACA,GAAIF;AACJ,CAAA,CAEH;AACA,EAAY,cAAc;AAE1B,IAAaG,IAAaR,EAAM,YAK9B,EACC,cACA,UACA,cAAW,IACX,aACA,oBAAoBS,GACpB,gBAAgBC,GAChB,mBAAmBC,GACnB,GAAGN,KAEJ,MACI;CACJ,IAAMO,IAAcZ,EAAM,MAAM,GAC1Ba,IAAU,EAAQC,GAClBC,IAAU,GAAGH,EAAY,SACzBI,IAAkB,GAAGJ,EAAY,UACjCK,IAAkD,CAAC,GACnDC,IAA2B,CAAC;CAClC,EAAM,SAAS,QAAQC,IAAW,MAAU;EAC3C,IAAInB,EAAM,eAAeoB,CAAK,KAAKA,EAAM,SAAShB,GAAa;GAC9D,EAAQ,KAAKgB,CAA6C;GAC1D;EACD;EACA,EAAM,KAAKA,CAAK;CACjB,CAAC;CACD,IAAMC,IAAiBJ,EAAQ,KAAK,GAAQ,MAAU;EACrD,IAAMK,IACLC,EAAO,MAAM,OAAOC,MAAU,IAAIR,IAAkB,GAAGA,EAAgB,GAAGQ;EAC3E,OAAOxB,EAAM,aAAauB,GAAQ;GAAE,KAAKD;GAAU,IAAIA;EAAS,CAAC;CAClE,CAAC,GAKKG,IAAmB,CAJPJ,EAChB,KAAK,MAAWE,EAAO,MAAM,EAAE,CAAC,CAChC,OAAO,OAAO,CAAC,CACf,KAAK,GACmB,GAAWZ,CAAU,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA,GACxEe,IACL,CAACb,IAAUE,IAAU,MAAMN,CAAW,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,KAAK,KAAA;CACtE,OACC,kBAAC,YAAD;EAAoB;EAAU,WAAU;EAAxC,UAAA;GACEY;GACD,kBAACpB,EAAoB,MAArB;IACM;IACK;IACV,WAAWK,EAAG,4BAA4BC,CAAS;IACnD,GAAIF;IACJ,mBAAiBoB;IACjB,oBAAkBC;IAClB,gBAAcb,IAAU,KAAOH;IAE9B,UAAAQ;GACwB,CAAA;GACzBL,IACA,kBAAC,KAAD;IAAG,IAAIE;IAAS,WAAU;IAAyC,MAAK;IACtE,UAAAD;GACC,CAAA,IACA;EACK;;AAEZ,CACD;AACA,EAAW,cAAc;AAEzB,IAAMa,IAAY3B,EAAM,YACtB,EAAE,cAAW,UAAO,WAAW,GAAGK,KAAS,MAC3C,kBAACJ,EAAoB,MAArB;CACM;CACL,WAAWK,EACVsB,GACA,+IACA1B,EAAiB2B,IACjBC,GACAvB,CACD;CACA,GAAIF;CAEJ,UAAA,kBAACJ,EAAoB,WAArB;EAA+B,WAAU;EACxC,UAAA,kBAAC8B,GAAD,EAAQ,WAAW5B,EAAsB0B,GAAQ,CAAA;CACnB,CAAA;AACN,CAAA,CAE5B;AACA,EAAU,cAAc5B,EAAoB,KAAK;AAEjD,IAAa+B,IAAQ,OAAO,OAAOL,GAAW;CAC7C,OAAOnB;CACP,QAAQJ;CACR,MAAMuB;AACP,CAAC"}

package/dist/components/recommendation-card.d.ts

@@ -0,0 +1,13 @@
+import { type RecommendationOption } from "../models/recommendation.js";
+export type { RecommendationConfidence, RecommendationOption } from "../models/recommendation.js";
+export interface RecommendationCardProps {
+    /** Caller-owned options with stable IDs. Remount with a new key for a new request. */
+    options: readonly RecommendationOption[];
+    /** Card heading. @default "Recommended action" */
+    title?: string;
+    /** Explicit acceptance; rejected promises keep the choice and allow retry. */
+    onAccept: (option: RecommendationOption) => void | Promise<void>;
+    disabled?: boolean;
+    className?: string;
+}
+export declare function RecommendationCard({ title, className, ...props }: RecommendationCardProps): import("react").JSX.Element;