@alexgorbatchev/shadcn 0.0.46 → 0.0.48

package/README.md

@@ -71,7 +71,7 @@ Import shared controls and providers from `@alexgorbatchev/shadcn`. Import the f
 | `/file-upload`       | FileUpload selection and validation                                  | `bun add react-dropzone@^20.1.4`                                                                    |
 | `/color-picker`      | ColorPicker                                                          | `bun add react-colorful@^5.8.1`                                                                     |
 | `/image-crop`        | ImageCrop and native export helpers                                  | `bun add react-image-crop@^11.1.2`                                                                  |
-| `/tree`              | Tree, native hooks and features                                      | `bun add @headless-tree/core@^1.8.0 @headless-tree/react@^1.8.0`                                    |
+| `/tree`              | Tree, native hooks and features                                      | `bun add @headless-tree/core@^1.8.0 @headless-tree/react@^1.8.0`; patched runtimes are bundled      |
 | `/editor`            | RichTextEditor, native Tiptap hooks and StarterKit                   | `bun add @tiptap/core@^3.32.0 @tiptap/react@^3.32.0 @tiptap/pm@^3.32.0 @tiptap/starter-kit@^3.32.0` |
 | `/event-calendar`    | EventCalendar, EventForm and native calendar APIs                    | `bun add date-fns@^4.4.0`; TypeScript: `bun add -d @types/react-big-calendar@^1.16.3`               |
 | `/gantt`             | Gantt and Roadmap                                                    | `bun add date-fns@^4.4.0 @date-fns/tz@^1.5.0`                                                       |
@@ -86,7 +86,7 @@ import { ChartContainer, type ChartConfig } from "@alexgorbatchev/shadcn/chart";
 import { Carousel, CarouselContent, CarouselItem } from "@alexgorbatchev/shadcn/carousel";
 ```
 
-A production install of this package adds no third-party packages: every library is an optional peer that consumers install themselves, or is bundled into the package. Core peers are listed under Installation; feature peers are listed per entry point above. The patched `sonner`, `input-otp`, and `@shadcn/react` runtimes, and the calendar with its patched `uncontrollable` wrapper, are bundled so consumers receive the fixes even when their package manager does not apply Bun patches; consumers of those three entry points still install the upstream packages for the types the declarations reference; the calendar runtime stays isolated behind `/event-calendar`. Install `@base-ui/utils` at the exact version `@base-ui/react` requires, so the portal components share Base UI's own ref merging without a second copy. Shared providers work across entry points.
+A production install of this package adds no third-party packages: every library is an optional peer that consumers install themselves, or is bundled into the package. Core peers are listed under Installation; feature peers are listed per entry point above. The patched `sonner`, `input-otp`, `@shadcn/react`, and Headless Tree runtimes, and the calendar with its patched `uncontrollable` wrapper, are bundled so consumers receive the fixes even when their package manager does not apply Bun patches. Install their upstream peers for the types the declarations reference; the tree runtime stays behind `/tree` and the calendar runtime behind `/event-calendar`. Import tree hooks and features from this package's `/tree` entry point so they use the bundled native implementation. Install `@base-ui/utils` at the exact version `@base-ui/react` requires, so the portal components share Base UI's own ref merging without a second copy. Shared providers work across entry points.
 
 The optional assistant-ui catalog provides presentational families under `/assistant-ui/<family>` and runtime adapters under `/assistant-ui/native/<family>`. For example, import `ApprovalCard` from `@alexgorbatchev/shadcn/assistant-ui/approval-card`. Add `@alexgorbatchev/shadcn/assistant-ui.css` to your stylesheet. Native threads require an actual assistant-ui runtime and the selected family's optional peers. See the [assistant-ui reference](./docs/internal/assistant-ui.md) for imports, dependency-bearing styles, source inventory, and the SelectionToolbar isolation limitation.
 
@@ -360,7 +360,7 @@ Compose `QuestionnaireItem`, `QuestionnaireTitle`, and answer controls inside `Q
 
 # Inline editing and ratings
 
-`InlineEdit` mounts an edit session with a controlled `value`, `onValueChange`, `onCommit`, and `onCancel`. Mount it in place of the displayed label. Its input focuses and selects its text by default; `shouldSelectOnMount={false}` preserves the initial caret. Enter or blur commits once, Escape cancels without committing, and asynchronous saves disable the input until completion. Rejected saves display an error and allow retry.
+`InlineEdit` mounts an edit session with a controlled `value`, `onValueChange`, `onCommit`, and `onCancel`. Mount it in place of the displayed label. Its input focuses and selects its text by default; `shouldSelectOnMount={false}` preserves the initial caret. Enter or blur commits once, Escape cancels without committing, and asynchronous saves disable the input until completion. Set `hasChanges={false}` to cancel an unchanged edit before calling `onCommit`; the caller owns normalization and comparison. It defaults to true, so creation sessions can commit their initial value. Rejected saves display a generic error and allow retry; `renderError` can map the unknown failure to application-authored guidance.
 
 `VirtualTable` renders a bounded, dynamically measured set of native table rows using TanStack Virtual. Supply `items`, stable `getItemKey`, `header`, `label`, and `renderRow`; spread the supplied measurement props onto each native row. Optional `columns` accepts a `TableColumnGroup`; responsive columns keep their widths aligned with cells that share their `visibleFrom`. `maxHeight` defaults to `65vh`, `estimateRowHeight` to 80 pixels, and `overscan` to five rows. `retainedKeys` keeps editing rows mounted; the focused row is retained automatically. Filtering and selection belong to the consumer.
 
@@ -370,17 +370,25 @@ Column `meta.filter` offers a column in `DataGridFilters`, hidden columns includ
 
 Import `DataGridSelectHeader` and `DataGridSelectCell` from `@alexgorbatchev/shadcn/data-grid`. Pass the current `useTable` result as `table` to both controls, and pass `row` and an accessible `label` to each cell. The header selects selectable filtered rows across all pages and preserves selections hidden by filters. It shows a mixed state when some of those rows are selected and disables itself when none are selectable. Its default label is "Select all filtered rows"; provide `label` to name the scope in your application. Cells follow native row selection rules, including disabled rows and partially selected parents. The controls observe selection changes without requiring the parent table selector to include selection state.
 
+`ActionsMenu` shares one `items` definition between a dropdown action and an optional context menu. Supply an accessible `label`; the default trigger is a ghost icon button. `size="sm"` displays the label, and `variant`, `disabled`, and `trigger` customize the action. Supplying `contextTarget` composes the native context trigger with that element and adds its popup. Compose items with `MenuItem`, `MenuLinkItem`, checkbox/radio parts, groups, labels, separators, shortcuts, and submenu parts; dropdown and context menus share these implementations. `MenuLinkItem` retains its native anchor and menu keyboard semantics.
+
+For nested layouts, compose `ActionsMenuTrigger`, `ActionsMenuContextTarget`, and `ActionsMenuContextContent` explicitly inside `ActionsMenu`. The dropdown trigger owns its local native dropdown root and popup; the context target and content share an independent context root. A tree row can use `TreeItem render={<ActionsMenuContextTarget />}` and put the trigger in its action slot. For a table row, render the context target as the actual `tr`, then place the dropdown trigger and context content inside a `td`: native popup portals insert focus guards at their declaration, which must remain valid table children.
+
 `TreeItem linkProps` places the registered tree item, roving focus, and native drag handlers on an anchor. Pass `href` and anchor events directly, or compose a router link through `linkProps.render`. The outer `render` and `ref` remain available for row overlays; disclosure and `endEnhancer` controls remain siblings of the link. Enter and modified clicks retain native link behavior, while tree arrows retain navigation and expansion behavior. Optional `dropHint={{ content, open, side }}` displays caller-controlled drag feedback without adding a focus target.
 
+Embedded actions, links, menus, editable fields, and media controls retain their own keyboard behavior. Registered anchor and button rows still participate in tree navigation; rename and search inputs retain their completion and cancellation shortcuts.
+
 `PageHeader` accepts an optional `eyebrow` above its single page title. It accepts any React content without introducing another heading. Breadcrumbs, description, actions, and density remain independent slots; long action content wraps within narrow layouts.
 
 `StarRating` takes a controlled numeric `value` from 0 to 5, `onValueChange`, and an accessible `label`. Its native radio buttons support keyboard selection and an Unrated option to clear the rating. Set `disabled` while saving. `Avatar shape="square"` displays square artwork with matching image, fallback, and border corners.
 
 `DialogContent size="wide"` uses a desktop maximum width of 576px; `size="narrow"` uses 192px, and the default uses 384px. Dialogs remain bounded by the viewport. `FieldGroup columns={2}` arranges fields in two columns on desktop and one on mobile.
 
+`FormDialog` supplies a controlled dialog with a fixed heading and footer around a scrolling body. Supply `open`, `onOpenChange`, `title`, and children; `description`, `size`, and `density` are optional. With `onSubmit`, the body and actions use a native form: the caller handles `preventDefault`, validation, submission, and pending state. `submitLabel` adds the stock submit button, with optional `submitVariant` and `submitDisabled`; `primaryAction` supplies a custom action instead. Without `onSubmit`, custom actions can request consent without introducing a form. Without a primary action, `cancelLabel="Done"` gives a close-only footer. `isBusy` blocks native dismissal and disables the stock actions; callers disable their own inputs and custom actions. Pass already-rendered safe guidance through `error`.
+
 `ImagePicker` displays a 256px square preview with upload and unset buttons. Supply the existing `src`, a staged `file` (`undefined` for the existing image, `null` for removal), and `onFileChange`/`onClear` callbacks. It accepts PNG, JPEG, and GIF files and releases local preview URLs when they change or unmount. The consumer owns saving and removal confirmation.
 
-`ConfirmationDialog` uses an alert dialog with Cancel and a destructive confirmation button. Supply `open`, `onOpenChange`, `title`, `description`, `confirmLabel`, and `onConfirm`. It waits for asynchronous work, keeps the dialog open on failure, and prevents cancellation while that work is pending.
+`ConfirmationDialog` uses an alert dialog with Cancel and a destructive confirmation button. Supply `open`, `onOpenChange`, `title`, `description`, `confirmLabel`, and `onConfirm`. It waits for asynchronous work, keeps the dialog open on failure, and prevents cancellation while that work is pending. Its body scrolls within the viewport while the heading and actions stay visible. Failures display generic guidance by default; `renderError` maps unknown failures to application-authored messages.
 
 # Split views
 

package/dist/{chunk-p1eqxz4v.js → chunk-a6mes7w0.js}

@@ -1,3 +1,6 @@
+import {
+  cn2
+} from "./chunk-cp2m7y7v.js";
 import {
   useDensity
 } from "./chunk-e6hk39ev.js";
@@ -6,9 +9,6 @@ import {
   usePortalNode,
   PortalProvider2
 } from "./chunk-x90xmrba.js";
-import {
-  cn2
-} from "./chunk-cp2m7y7v.js";
 import {
   Button2
 } from "./chunk-38301e40.js";
@@ -22,53 +22,94 @@ import {
   useAnalyticsCallback
 } from "./chunk-5mydsjp3.js";
 
+// src/components/ScrollArea.tsx
+import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area";
+import { jsx, jsxs } from "react/jsx-runtime";
+function ScrollArea2({
+  density,
+  className,
+  children,
+  scrollbars = /* @__PURE__ */ jsx(ScrollBar2, {}),
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, {
+    "data-density": density,
+    "data-slot": "scroll-area",
+    className: (state) => cn2("relative flex min-h-0 flex-col", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(ScrollAreaPrimitive.Viewport, {
+        "data-slot": "scroll-area-viewport",
+        className: "size-full min-h-0 flex-1 rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
+        children
+      }),
+      scrollbars,
+      /* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
+    ]
+  });
+}
+function ScrollBar2({ density, className, orientation = "vertical", ...props }) {
+  return /* @__PURE__ */ jsx(ScrollAreaPrimitive.Scrollbar, {
+    "data-density": density,
+    "data-slot": "scroll-area-scrollbar",
+    "data-orientation": orientation,
+    orientation,
+    className: (state) => cn2("flex touch-none p-px transition-colors select-none data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent data-[orientation=vertical]:w-2.5 data-[orientation=vertical]:border-s data-[orientation=vertical]:border-s-transparent", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.Thumb, {
+      "data-slot": "scroll-area-thumb",
+      className: "relative flex-1 rounded-full bg-border"
+    })
+  });
+}
+
 // src/components/Combobox.tsx
 import { useDirection } from "@base-ui/react/direction-provider";
 import { Combobox as ComboboxPrimitive } from "@base-ui/react/combobox";
 import { ChevronDownIcon, XIcon, CheckIcon } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function Combobox2({
   analytics,
   ...props
 }) {
   const onValueChange = useAnalyticsCallback("Combobox", analytics, { name: "ui.change-request" }, props.onValueChange);
   const onOpenChange = useAnalyticsCallback("Combobox", analytics, (open, _details) => ({ name: "ui.open-request", open }), props.onOpenChange);
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Root, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Root, {
     ...props,
     onValueChange,
     onOpenChange
   });
 }
 function ComboboxValue2({ ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Value, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Value, {
     ...props
   });
 }
 function ComboboxTrigger2({ density, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs(ComboboxPrimitive.Trigger, {
+  return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Trigger, {
     "data-density": density,
     "data-slot": "combobox-trigger",
     className: (state) => cn2("[&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx(ChevronDownIcon, {
+      /* @__PURE__ */ jsx2(ChevronDownIcon, {
         className: "pointer-events-none size-4 text-muted-foreground"
       })
     ]
   });
 }
 function ComboboxClear({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Clear, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Clear, {
     "data-density": density,
     "data-slot": "combobox-clear",
-    render: /* @__PURE__ */ jsx(InputGroupButton2, {
+    render: /* @__PURE__ */ jsx2(InputGroupButton2, {
       variant: "ghost",
       size: "icon-xs"
     }),
     className: (state) => cn2(typeof className === "function" ? className(state) : className),
     ...props,
-    children: /* @__PURE__ */ jsx(XIcon, {
+    children: /* @__PURE__ */ jsx2(XIcon, {
       className: "pointer-events-none"
     })
   });
@@ -85,30 +126,30 @@ function ComboboxInput2({
   clearLabel = "Clear selection",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs(InputGroup2, {
+  return /* @__PURE__ */ jsxs2(InputGroup2, {
     density,
     className: cn2("w-auto", frameClassName),
     children: [
-      /* @__PURE__ */ jsx(ComboboxPrimitive.Input, {
+      /* @__PURE__ */ jsx2(ComboboxPrimitive.Input, {
         disabled,
         className,
-        render: /* @__PURE__ */ jsx(InputGroupInput2, {}),
+        render: /* @__PURE__ */ jsx2(InputGroupInput2, {}),
         ...props
       }),
-      /* @__PURE__ */ jsxs(InputGroupAddon2, {
+      /* @__PURE__ */ jsxs2(InputGroupAddon2, {
         align: "inline-end",
         children: [
-          showTrigger && /* @__PURE__ */ jsx(InputGroupButton2, {
+          showTrigger && /* @__PURE__ */ jsx2(InputGroupButton2, {
             size: "icon-xs",
             variant: "ghost",
-            render: /* @__PURE__ */ jsx(ComboboxTrigger2, {}),
+            render: /* @__PURE__ */ jsx2(ComboboxTrigger2, {}),
             "aria-label": triggerLabel,
             "data-density": density,
             "data-slot": "input-group-button",
             className: "group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent",
             disabled
           }),
-          showClear && /* @__PURE__ */ jsx(ComboboxClear, {
+          showClear && /* @__PURE__ */ jsx2(ComboboxClear, {
             disabled,
             "aria-label": clearLabel
           })
@@ -132,19 +173,19 @@ function ComboboxContent2({
   const direction = useDirection();
   const container = usePortalContainer2();
   const portal = usePortalNode();
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Portal, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Portal, {
     container,
     ref: portal.ref,
-    children: /* @__PURE__ */ jsx(PortalProvider2, {
+    children: /* @__PURE__ */ jsx2(PortalProvider2, {
       container: portal.node,
-      children: /* @__PURE__ */ jsx(ComboboxPrimitive.Positioner, {
+      children: /* @__PURE__ */ jsx2(ComboboxPrimitive.Positioner, {
         side,
         sideOffset,
         align,
         alignOffset,
         anchor,
         className: "isolate ",
-        children: /* @__PURE__ */ jsx(ComboboxPrimitive.Popup, {
+        children: /* @__PURE__ */ jsx2(ComboboxPrimitive.Popup, {
           dir: direction,
           "data-density": resolvedDensity,
           "data-slot": "combobox-content",
@@ -157,7 +198,7 @@ function ComboboxContent2({
   });
 }
 function ComboboxList2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.List, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.List, {
     "data-density": density,
     "data-slot": "combobox-list",
     className: (state) => cn2("no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0", typeof className === "function" ? className(state) : className),
@@ -165,18 +206,18 @@ function ComboboxList2({ density, className, ...props }) {
   });
 }
 function ComboboxItem2({ density, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs(ComboboxPrimitive.Item, {
+  return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Item, {
     "data-density": density,
     "data-slot": "combobox-item",
     className: (state) => cn2("relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx(ComboboxPrimitive.ItemIndicator, {
-        render: /* @__PURE__ */ jsx("span", {
+      /* @__PURE__ */ jsx2(ComboboxPrimitive.ItemIndicator, {
+        render: /* @__PURE__ */ jsx2("span", {
           className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
         }),
-        children: /* @__PURE__ */ jsx(CheckIcon, {
+        children: /* @__PURE__ */ jsx2(CheckIcon, {
           className: "pointer-events-none"
         })
       })
@@ -184,7 +225,7 @@ function ComboboxItem2({ density, className, children, ...props }) {
   });
 }
 function ComboboxGroup2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Group, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Group, {
     "data-density": density,
     "data-slot": "combobox-group",
     className: (state) => cn2(typeof className === "function" ? className(state) : className),
@@ -192,7 +233,7 @@ function ComboboxGroup2({ density, className, ...props }) {
   });
 }
 function ComboboxLabel2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.GroupLabel, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.GroupLabel, {
     "data-density": density,
     "data-slot": "combobox-label",
     className: (state) => cn2("px-2 py-1.5 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
@@ -200,12 +241,12 @@ function ComboboxLabel2({ density, className, ...props }) {
   });
 }
 function ComboboxCollection2({ ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Collection, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Collection, {
     ...props
   });
 }
 function ComboboxEmpty2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Empty, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Empty, {
     "data-density": density,
     "data-slot": "combobox-empty",
     className: (state) => cn2("flex w-full justify-center py-2 empty:p-0 text-center text-sm text-muted-foreground", typeof className === "function" ? className(state) : className),
@@ -213,7 +254,7 @@ function ComboboxEmpty2({ density, className, ...props }) {
   });
 }
 function ComboboxSeparator2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Separator, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Separator, {
     "data-density": density,
     "data-slot": "combobox-separator",
     className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
@@ -221,7 +262,7 @@ function ComboboxSeparator2({ density, className, ...props }) {
   });
 }
 function ComboboxChips2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Chips, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Chips, {
     "data-density": density,
     "data-slot": "combobox-chips",
     className: (state) => cn2("flex min-h-control flex-wrap items-center gap-1 rounded-sm border border-input bg-transparent bg-clip-padding px-control-x py-px text-sm transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive has-data-[slot=combobox-chip]:px-1", typeof className === "function" ? className(state) : className),
@@ -236,22 +277,22 @@ function ComboboxChip2({
   removeLabel = "Remove item",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs(ComboboxPrimitive.Chip, {
+  return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Chip, {
     "data-density": density,
     "data-slot": "combobox-chip",
     className: (state) => cn2("flex h-tag w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pe-0", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
       children,
-      showRemove && /* @__PURE__ */ jsx(ComboboxPrimitive.ChipRemove, {
-        render: /* @__PURE__ */ jsx(Button2, {
+      showRemove && /* @__PURE__ */ jsx2(ComboboxPrimitive.ChipRemove, {
+        render: /* @__PURE__ */ jsx2(Button2, {
           variant: "ghost",
           size: "icon-xs"
         }),
         className: "size-tag -ms-1 opacity-50 hover:opacity-100",
         "data-slot": "combobox-chip-remove",
         "aria-label": removeLabel,
-        children: /* @__PURE__ */ jsx(XIcon, {
+        children: /* @__PURE__ */ jsx2(XIcon, {
           className: "pointer-events-none"
         })
       })
@@ -259,7 +300,7 @@ function ComboboxChip2({
   });
 }
 function ComboboxChipsInput2({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx(ComboboxPrimitive.Input, {
+  return /* @__PURE__ */ jsx2(ComboboxPrimitive.Input, {
     "data-density": density,
     "data-slot": "combobox-chip-input",
     className: (state) => cn2("h-tag min-w-16 flex-1 py-0 text-sm leading-none outline-none", typeof className === "function" ? className(state) : className),
@@ -273,47 +314,6 @@ function useComboboxAnchor2() {
   return useRef(null);
 }
 
-// src/components/ScrollArea.tsx
-import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function ScrollArea2({
-  density,
-  className,
-  children,
-  scrollbars = /* @__PURE__ */ jsx2(ScrollBar2, {}),
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs2(ScrollAreaPrimitive.Root, {
-    "data-density": density,
-    "data-slot": "scroll-area",
-    className: (state) => cn2("relative flex min-h-0 flex-col", typeof className === "function" ? className(state) : className),
-    ...props,
-    children: [
-      /* @__PURE__ */ jsx2(ScrollAreaPrimitive.Viewport, {
-        "data-slot": "scroll-area-viewport",
-        className: "size-full min-h-0 flex-1 rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
-        children
-      }),
-      scrollbars,
-      /* @__PURE__ */ jsx2(ScrollAreaPrimitive.Corner, {})
-    ]
-  });
-}
-function ScrollBar2({ density, className, orientation = "vertical", ...props }) {
-  return /* @__PURE__ */ jsx2(ScrollAreaPrimitive.Scrollbar, {
-    "data-density": density,
-    "data-slot": "scroll-area-scrollbar",
-    "data-orientation": orientation,
-    orientation,
-    className: (state) => cn2("flex touch-none p-px transition-colors select-none data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent data-[orientation=vertical]:w-2.5 data-[orientation=vertical]:border-s data-[orientation=vertical]:border-s-transparent", typeof className === "function" ? className(state) : className),
-    ...props,
-    children: /* @__PURE__ */ jsx2(ScrollAreaPrimitive.Thumb, {
-      "data-slot": "scroll-area-thumb",
-      className: "relative flex-1 rounded-full bg-border"
-    })
-  });
-}
-
 // src/components/NumberField.tsx
 import { NumberField as NumberFieldPrimitive } from "@base-ui/react/number-field";
 import { MinusIcon, PlusIcon, MoveHorizontalIcon } from "lucide-react";
@@ -413,4 +413,4 @@ function NumberFieldScrubAreaCursor2({
   });
 }
 
-export { Combobox2, ComboboxValue2, ComboboxTrigger2, ComboboxInput2, ComboboxContent2, ComboboxList2, ComboboxItem2, ComboboxGroup2, ComboboxLabel2, ComboboxCollection2, ComboboxEmpty2, ComboboxSeparator2, ComboboxChips2, ComboboxChip2, ComboboxChipsInput2, useComboboxAnchor2, ScrollArea2, ScrollBar2, NumberField2, NumberFieldGroup2, NumberFieldInput2, NumberFieldDecrement2, NumberFieldIncrement2, NumberFieldScrubArea2, NumberFieldScrubAreaCursor2 };
+export { ScrollArea2, ScrollBar2, Combobox2, ComboboxValue2, ComboboxTrigger2, ComboboxInput2, ComboboxContent2, ComboboxList2, ComboboxItem2, ComboboxGroup2, ComboboxLabel2, ComboboxCollection2, ComboboxEmpty2, ComboboxSeparator2, ComboboxChips2, ComboboxChip2, ComboboxChipsInput2, useComboboxAnchor2, NumberField2, NumberFieldGroup2, NumberFieldInput2, NumberFieldDecrement2, NumberFieldIncrement2, NumberFieldScrubArea2, NumberFieldScrubAreaCursor2 };