@vamos-ui/react 0.3.0 → 0.4.1

package/dist/components/slider.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Slider as SliderPrimitive } from "radix-ui";
+import * as SliderPrimitive from "radix-ui/slider";
 import { cn } from "../lib/cn.js";
 import { mergeIds } from "../lib/compose-refs.js";
 import { FieldContextReset, useFieldContext } from "../lib/field-context.js";
@@ -36,7 +36,7 @@ const snap = (n, min, step) => {
  * <Slider defaultValue={[60]} marks={[0, 25, 50, 75, 100]} aria-label="Deal probability" />
  * ```
  */
-export const Slider = React.forwardRef(function Slider({ value: valueProp, defaultValue, onValueChange, onValueCommit, min = 0, max = 100, step = 1, marks, formatValue, formatOptions, showValue = "hover", withInputs, size = "md", thumbLabels, name, names, invalid, readOnly, required, disabled, labels, id, className, orientation = "horizontal", "aria-label": ariaLabel, "aria-labelledby": labelledBy, "aria-describedby": describedBy, ...props }, ref) {
+export const Slider = /*#__PURE__*/ React.forwardRef(function Slider({ value: valueProp, defaultValue, onValueChange, onValueCommit, min = 0, max = 100, step = 1, marks, formatValue, formatOptions, showValue = "hover", withInputs, size = "md", thumbLabels, name, names, invalid, readOnly, required, disabled, labels, id, className, orientation = "horizontal", "aria-label": ariaLabel, "aria-labelledby": labelledBy, "aria-describedby": describedBy, ...props }, ref) {
     const field = useFieldContext();
     const t = useLabels("slider", sliderLabels, labels);
     const f = useFormat();

package/dist/components/slug-input.js

@@ -39,7 +39,7 @@ const slugLabels = {
  * <SlugInput variant="permalink" source={title} prefix="https://vamos.ist/blog/" />
  * ```
  */
-export const SlugInput = React.forwardRef(function SlugInput(props, forwardedRef) {
+export const SlugInput = /*#__PURE__*/ React.forwardRef(function SlugInput(props, forwardedRef) {
     const { value, defaultValue, onValueChange, source, locked: lockedProp, defaultLocked, onLockedChange, prefix, maxLength = 80, locale: localeProp, validate, suggestUnique, validateDelay = 350, variant = "field", href, size, name, id, disabled, invalid, placeholder, labels, className, "aria-label": ariaLabel, "aria-describedby": describedByProp, ...rest } = props;
     const { locale: providerLocale } = useLocale();
     const locale = localeProp ?? providerLocale;

package/dist/components/sparkline.js

@@ -14,7 +14,7 @@ const SIZES = { xs: [64, 20], sm: [96, 32], md: [160, 40] };
  * <Sparkline values={weekly} variant="bars" size="xs" domain={[0, 120]} label={sparklineSummary(weekly)} />
  * ```
  */
-export const Sparkline = React.forwardRef(function Sparkline({ values, variant = "line", size = "sm", width, height, color, strokeWidth = 1.6, showLast, showMinMax, reference, domain, label, className, style, ...props }, ref) {
+export const Sparkline = /*#__PURE__*/ React.forwardRef(function Sparkline({ values, variant = "line", size = "sm", width, height, color, strokeWidth = 1.6, showLast, showMinMax, reference, domain, label, className, style, ...props }, ref) {
     const gradientId = `spark-${React.useId().replace(/:/g, "")}`;
     const fluid = width === "100%";
     const w = typeof width === "number" ? width : SIZES[size][0];

package/dist/components/spinner.js

@@ -4,7 +4,7 @@ import { cva } from "class-variance-authority";
 import { cn } from "../lib/cn.js";
 const SIZES = { xs: 12, sm: 16, md: 20, lg: 28 };
 const STROKE = { xs: 3, sm: 2.75, md: 2.5, lg: 2.25 };
-export const spinnerVariants = cva("ui-spinner inline-block shrink-0 align-middle", {
+export const spinnerVariants = /*#__PURE__*/ cva("ui-spinner inline-block shrink-0 align-middle", {
     variants: {
         tone: {
             /** Inherits the text colour — the default inside buttons. */
@@ -24,7 +24,7 @@ export const spinnerVariants = cva("ui-spinner inline-block shrink-0 align-middl
  * <Button loading>Save</Button>   // uses a decorative Spinner
  * ```
  */
-export const Spinner = React.forwardRef(function Spinner({ size = "sm", tone, label, delay, className, style, ...props }, ref) {
+export const Spinner = /*#__PURE__*/ React.forwardRef(function Spinner({ size = "sm", tone, label, delay, className, style, ...props }, ref) {
     const px = typeof size === "number" ? size : SIZES[size];
     const stroke = typeof size === "number" ? (size <= 14 ? 3 : size >= 26 ? 2.25 : 2.5) : STROKE[size];
     const svg = (_jsxs("svg", { ref: ref, "data-slot": "spinner", viewBox: "0 0 24 24", width: px, height: px, fill: "none", "aria-hidden": true, focusable: "false", className: cn(spinnerVariants({ tone }), delay ? "ui-spinner-delayed" : undefined, className), style: delay ? { ...style, "--spinner-delay": `${delay}ms` } : style, ...props, children: [_jsx("circle", { cx: "12", cy: "12", r: "9.25", stroke: "currentColor", strokeOpacity: 0.18, strokeWidth: stroke }), _jsx("circle", { className: "ui-spinner-arc", cx: "12", cy: "12", r: "9.25", stroke: "currentColor", strokeWidth: stroke, strokeLinecap: "round", transform: "rotate(-90 12 12)" })] }));

package/dist/components/stat.js

@@ -10,7 +10,7 @@ import { Sparkline, sparklineDirection } from "./sparkline.js";
 /* ------------------------------------------------------------------ */
 /* Delta                                                                */
 /* ------------------------------------------------------------------ */
-const deltaVariants = cva("inline-flex shrink-0 items-center gap-0.5 whitespace-nowrap font-medium leading-none [&_svg]:shrink-0", {
+const deltaVariants = /*#__PURE__*/ cva("inline-flex shrink-0 items-center gap-0.5 whitespace-nowrap font-medium leading-none [&_svg]:shrink-0", {
     variants: {
         variant: {
             text: "text-xs [&_svg]:size-3.5",
@@ -34,7 +34,7 @@ const deltaVariants = cva("inline-flex shrink-0 items-center gap-0.5 whitespace-
  * <Delta value={1250} kind="currency" variant="badge" />
  * ```
  */
-export const Delta = React.forwardRef(function Delta({ value, kind = "percent", currency, intent = "higher-is-better", variant, precision, srLabel, comparison, labels, className, ...props }, ref) {
+export const Delta = /*#__PURE__*/ React.forwardRef(function Delta({ value, kind = "percent", currency, intent = "higher-is-better", variant, precision, srLabel, comparison, labels, className, ...props }, ref) {
     const has = typeof value === "number" && Number.isFinite(value);
     const dir = has ? Math.sign(value) : 0;
     const good = intent === "neutral" || dir === 0 ? 0 : intent === "higher-is-better" ? dir : -dir;
@@ -45,7 +45,7 @@ export const Delta = React.forwardRef(function Delta({ value, kind = "percent",
 /* ------------------------------------------------------------------ */
 /* Stat parts                                                           */
 /* ------------------------------------------------------------------ */
-const statVariants = cva("group/stat relative grid min-w-0 grid-cols-[minmax(0,1fr)_auto] content-start items-start gap-x-3 [grid-template-areas:'label_delta'_'value_trend'_'target_target'_'foot_foot']" +
+const statVariants = /*#__PURE__*/ cva("group/stat relative grid min-w-0 grid-cols-[minmax(0,1fr)_auto] content-start items-start gap-x-3 [grid-template-areas:'label_delta'_'value_trend'_'target_target'_'foot_foot']" +
     // without a sparkline the value may use the full width (a wide delta must not squeeze "$3,815,400.00")
     " [&:not(:has([data-slot=stat-trend]))_[data-slot=stat-value]]:[grid-column:1/-1]", {
     variants: {
@@ -74,7 +74,7 @@ const statVariants = cva("group/stat relative grid min-w-0 grid-cols-[minmax(0,1
  *
  * Compose for custom layouts: `<Stat><StatLabel/><StatValue/><StatDelta/><StatTrend/><StatFooter/></Stat>`.
  */
-export const Stat = React.forwardRef(function Stat({ label, value, format, delta, deltaKind = "percent", deltaVariant, intent = "higher-is-better", comparison, trend, trendVariant = "line", target, icon: Icon, href, loading, error, errorAction, variant = "card", size = "md", labels, className, children, ...props }, ref) {
+export const Stat = /*#__PURE__*/ React.forwardRef(function Stat({ label, value, format, delta, deltaKind = "percent", deltaVariant, intent = "higher-is-better", comparison, trend, trendVariant = "line", target, icon: Icon, href, loading, error, errorAction, variant = "card", size = "md", labels, className, children, ...props }, ref) {
     const trendId = React.useId();
     const dir = trend ? sparklineDirection(trend) : 0;
     const good = intent === "neutral" || dir === 0 ? 0 : intent === "higher-is-better" ? dir : -dir;
@@ -125,6 +125,6 @@ const columnClasses = {
  * A responsive row of Stats. Columns follow the container width, not the viewport, so the same
  * row works in a page, a sheet or a dashboard widget.
  */
-export const StatGroup = React.forwardRef(function StatGroup({ columns = 4, variant = "cards", className, children, ...props }, ref) {
+export const StatGroup = /*#__PURE__*/ React.forwardRef(function StatGroup({ columns = 4, variant = "cards", className, children, ...props }, ref) {
     return (_jsx("div", { ref: ref, "data-slot": "stat-group", className: cn("@container", className), ...props, children: _jsx("div", { className: cn("grid grid-cols-1", columnClasses[columns], variant === "cards" ? "gap-(--gap)" : "surface overflow-hidden rounded-ui-lg [&>*]:shadow-[-1px_-1px_0_0_var(--line)]"), children: children }) }));
 });

package/dist/components/status-picker.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from "react";
-import { Select as SelectPrimitive } from "radix-ui";
+import * as SelectPrimitive from "radix-ui/select";
 import { Check, ChevronDown } from "lucide-react";
 import { cn } from "../lib/cn.js";
 import { useFieldControl } from "../lib/field-context.js";
@@ -83,7 +83,7 @@ export function StatusBadge({ status, size = "md", className }) {
  *   confirm={(s) => s.value === "rejected" && { title: "Reject request?", requireNote: true, tone: "danger" }} />
  * ```
  */
-export const StatusPicker = React.forwardRef(function StatusPicker({ statuses, value: valueProp, defaultValue, onValueChange, transitions, confirm, onError, trigger = "badge", groupByCategory, name, size = "md", disabled: disabledProp, readOnly: readOnlyProp, loading, fieldLabel, labels, className, ...rest }, ref) {
+export const StatusPicker = /*#__PURE__*/ React.forwardRef(function StatusPicker({ statuses, value: valueProp, defaultValue, onValueChange, transitions, confirm, onError, trigger = "badge", groupByCategory, name, size = "md", disabled: disabledProp, readOnly: readOnlyProp, loading, fieldLabel, labels, className, ...rest }, ref) {
     const t = useLabels("statusPicker", statusPickerLabels, labels);
     const control = useFieldControl({
         id: rest.id,

package/dist/components/stepper.js

@@ -41,7 +41,7 @@ export function StepIndicator({ status, number, icon, loading, size = "md", clas
  * An ordered list; the current step has `aria-current="step"` and every step's name includes its
  * position and status ("Step 2 of 4, Map columns, current").
  */
-export const Stepper = React.forwardRef(function Stepper({ value, onValueChange, navigable = "completed", orientation = "horizontal", variant = "numbered", size = "md", steps: stepsProp, loading, responsive = true, labels, className, children, "aria-label": ariaLabel, ...props }, ref) {
+export const Stepper = /*#__PURE__*/ React.forwardRef(function Stepper({ value, onValueChange, navigable = "completed", orientation = "horizontal", variant = "numbered", size = "md", steps: stepsProp, loading, responsive = true, labels, className, children, "aria-label": ariaLabel, ...props }, ref) {
     const t = useLabels("stepper", stepperLabels, labels);
     const raw = stepsProp ??
         React.Children.toArray(children)

package/dist/components/switch.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Switch as SwitchPrimitive } from "radix-ui";
+import * as SwitchPrimitive from "radix-ui/switch";
 export declare const switchVariants: (props?: ({
     size?: "sm" | "md" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/components/switch.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Switch as SwitchPrimitive } from "radix-ui";
+import * as SwitchPrimitive from "radix-ui/switch";
 import { cva } from "class-variance-authority";
 import { cn } from "../lib/cn.js";
 import { mergeIds } from "../lib/compose-refs.js";
 import { useFieldControl } from "../lib/field-context.js";
 import { useControllableState } from "../lib/use-controllable-state.js";
 import { Spinner } from "./spinner.js";
-export const switchVariants = cva([
+export const switchVariants = /*#__PURE__*/ cva([
     "group/switch relative inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent p-[2px] outline-none",
     "bg-track transition-[background-color,box-shadow] duration-200",
     "data-[state=unchecked]:hover:bg-[color-mix(in_srgb,var(--track),var(--fg)_9%)]",
@@ -36,7 +36,7 @@ export const switchVariants = cva([
  * <Switch size="sm" checked={active} onCheckedChange={save} loading={saving} aria-label="Active" />
  * ```
  */
-export const Switch = React.forwardRef(function Switch(rawProps, ref) {
+export const Switch = /*#__PURE__*/ React.forwardRef(function Switch(rawProps, ref) {
     const { checked: checkedProp, defaultChecked, onCheckedChange, label, description, labelPosition = "end", size = "md", loading, invalid, className, controlClassName, style, ...rest } = rawProps;
     const control = useFieldControl({ ...rest, "aria-invalid": invalid ? true : rest["aria-invalid"] });
     const { readOnly, required, ...controlProps } = control;

package/dist/components/table.js

@@ -9,7 +9,7 @@ const alignClass = { start: "text-start", center: "text-center", end: "text-end"
  * Scroll wrapper for a Table: horizontal (and optional vertical) scrolling with soft edge fades
  * that show there is more content. It is a focusable, named region so keyboard users can scroll.
  */
-export const TableContainer = React.forwardRef(function TableContainer({ className, maxHeight, style, ...props }, ref) {
+export const TableContainer = /*#__PURE__*/ React.forwardRef(function TableContainer({ className, maxHeight, style, ...props }, ref) {
     return (_jsx("div", { ref: ref, role: "region", tabIndex: 0, "data-slot": "table-container", className: cn("ui-table-scroll relative w-full overflow-auto overscroll-x-contain rounded-[inherit] focus-ring", className), style: maxHeight ? { maxHeight, ...style } : style, ...props }));
 });
 /**
@@ -26,7 +26,7 @@ export const TableContainer = React.forwardRef(function TableContainer({ classNa
  * </TableContainer>
  * ```
  */
-export const Table = React.forwardRef(function Table({ className, density = "inherit", striped, hover = true, bordered = "rows", stickyHeader, stickyFirstColumn, layout = "auto", children, ...props }, ref) {
+export const Table = /*#__PURE__*/ React.forwardRef(function Table({ className, density = "inherit", striped, hover = true, bordered = "rows", stickyHeader, stickyFirstColumn, layout = "auto", children, ...props }, ref) {
     if (process.env.NODE_ENV !== "production" && !props["aria-label"] && !props["aria-labelledby"]) {
         const hasCaption = React.Children.toArray(children).some((c) => React.isValidElement(c) && c.type === TableCaption);
         if (!hasCaption)
@@ -35,38 +35,38 @@ export const Table = React.forwardRef(function Table({ className, density = "inh
     return (_jsx("table", { ref: ref, "data-slot": "table", "data-density": density === "inherit" ? undefined : density, "data-striped": striped ? "" : undefined, "data-hover": hover ? "" : undefined, "data-bordered": bordered, "data-sticky-header": stickyHeader ? "" : undefined, "data-sticky-column": stickyFirstColumn ? "" : undefined, className: cn("ui-table w-full caption-bottom border-separate border-spacing-0 text-[13px] text-fg", layout === "fixed" && "table-fixed", className), ...props, children: children }));
 });
 /** Names the table. Visible under the table by default; `visuallyHidden` keeps it for screen readers. */
-export const TableCaption = React.forwardRef(function TableCaption({ className, visuallyHidden, side = "bottom", ...props }, ref) {
+export const TableCaption = /*#__PURE__*/ React.forwardRef(function TableCaption({ className, visuallyHidden, side = "bottom", ...props }, ref) {
     return (_jsx("caption", { ref: ref, "data-slot": "table-caption", className: cn(visuallyHidden ? "sr-only" : "px-(--cell-px) py-3 text-start text-xs text-fg-subtle", side === "top" && "caption-top pt-0", className), ...props }));
 });
-export const TableHeader = React.forwardRef(function TableHeader({ className, ...props }, ref) {
+export const TableHeader = /*#__PURE__*/ React.forwardRef(function TableHeader({ className, ...props }, ref) {
     return _jsx("thead", { ref: ref, "data-slot": "table-header", className: className, ...props });
 });
-export const TableBody = React.forwardRef(function TableBody({ className, ...props }, ref) {
+export const TableBody = /*#__PURE__*/ React.forwardRef(function TableBody({ className, ...props }, ref) {
     return _jsx("tbody", { ref: ref, "data-slot": "table-body", className: className, ...props });
 });
-export const TableFooter = React.forwardRef(function TableFooter({ className, ...props }, ref) {
+export const TableFooter = /*#__PURE__*/ React.forwardRef(function TableFooter({ className, ...props }, ref) {
     return _jsx("tfoot", { ref: ref, "data-slot": "table-footer", className: cn("font-medium", className), ...props });
 });
-export const TableRow = React.forwardRef(function TableRow({ className, selected, disabled, highlighted, ...props }, ref) {
+export const TableRow = /*#__PURE__*/ React.forwardRef(function TableRow({ className, selected, disabled, highlighted, ...props }, ref) {
     return (_jsx("tr", { ref: ref, "data-slot": "table-row", "data-state": selected ? "selected" : undefined, "data-disabled": disabled ? "" : undefined, "data-highlighted": highlighted ? "" : undefined, "aria-selected": selected === undefined ? undefined : selected, "aria-disabled": disabled || undefined, className: className, ...props }));
 });
 /**
  * Column header (`<th scope="col">`). With `onSort` the label becomes a button and the cell
  * gets `aria-sort`.
  */
-export const TableHead = React.forwardRef(function TableHead({ className, align, numeric, sort, onSort, scope = "col", children, ...props }, ref) {
+export const TableHead = /*#__PURE__*/ React.forwardRef(function TableHead({ className, align, numeric, sort, onSort, scope = "col", children, ...props }, ref) {
     const a = align ?? (numeric ? "end" : "start");
     const sortable = sort !== undefined || onSort !== undefined;
     const SortIcon = sort === "asc" ? ArrowUp : sort === "desc" ? ArrowDown : ChevronsUpDown;
     return (_jsx("th", { ref: ref, scope: scope, "data-slot": "table-head", "data-numeric": numeric ? "" : undefined, "aria-sort": sortable ? (sort === "asc" ? "ascending" : sort === "desc" ? "descending" : "none") : undefined, className: cn("h-[calc(var(--row-h)*0.78)] px-(--cell-px) align-middle text-xs font-medium whitespace-nowrap text-fg-muted", alignClass[a], className), ...props, children: sortable ? (_jsxs("button", { type: "button", onClick: onSort, "data-sorted": sort ? "" : undefined, className: cn("-mx-1.5 inline-flex items-center gap-1 rounded-ui-sm px-1.5 py-1 font-medium transition-colors hover:bg-hover hover:text-fg focus-ring data-sorted:text-fg", a === "end" && "flex-row-reverse"), children: [children, _jsx(SortIcon, { "aria-hidden": true, className: cn("size-3.5 shrink-0", sort ? "text-fg" : "text-fg-subtle") })] })) : (children) }));
 });
-export const TableCell = React.forwardRef(function TableCell({ className, align, numeric, truncate, rowHeader, children, ...props }, ref) {
+export const TableCell = /*#__PURE__*/ React.forwardRef(function TableCell({ className, align, numeric, truncate, rowHeader, children, ...props }, ref) {
     const a = align ?? (numeric ? "end" : "start");
     const Comp = rowHeader ? "th" : "td";
     const clamp = typeof truncate === "number" && truncate > 1;
     return (_jsx(Comp, { ref: ref, ...(rowHeader ? { scope: "row" } : {}), "data-slot": "table-cell", "data-numeric": numeric ? "" : undefined, className: cn("h-(--row-h) px-(--cell-px) py-2 align-middle", alignClass[a], numeric && "font-mono text-[12.5px] whitespace-nowrap tabular", rowHeader && "font-medium", truncate === true || truncate === 1 ? "max-w-0 truncate" : null, className), ...props, children: clamp ? (_jsx("span", { className: "line-clamp-(--lines)", style: { ["--lines"]: truncate }, children: children })) : (children) }));
 });
 /** A single full-width row for an empty table body. */
-export const TableEmpty = React.forwardRef(function TableEmpty({ colSpan, icon, title, description, className, children, ...props }, ref) {
+export const TableEmpty = /*#__PURE__*/ React.forwardRef(function TableEmpty({ colSpan, icon, title, description, className, children, ...props }, ref) {
     return (_jsx("tr", { ref: ref, "data-slot": "table-empty", className: className, ...props, children: _jsx("td", { colSpan: colSpan, className: "px-(--cell-px) py-8", children: _jsx(EmptyState, { kind: "no-results", size: "sm", icon: icon, title: title ?? _jsx(DataLabel, { ns: "table", id: "empty" }), description: description, actions: children }) }) }));
 });

package/dist/components/tabs.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Tabs as RadixTabs } from "radix-ui";
+import * as RadixTabs from "radix-ui/tabs";
 import { type VariantProps } from "class-variance-authority";
 import { type BadgeProps } from "./badge.js";
 export declare const tabsListVariants: (props?: ({

package/dist/components/tabs.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Tabs as RadixTabs } from "radix-ui";
+import * as RadixTabs from "radix-ui/tabs";
 import { cva } from "class-variance-authority";
 import { cn } from "../lib/cn.js";
 import { useControllableState } from "../lib/use-controllable-state.js";
@@ -12,7 +12,7 @@ import { Badge } from "./badge.js";
 /* ------------------------------------------------------------------ */
 /* Variants (shared by Radix tabs and link tabs)                       */
 /* ------------------------------------------------------------------ */
-export const tabsListVariants = cva("relative flex min-w-max", {
+export const tabsListVariants = /*#__PURE__*/ cva("relative flex min-w-max", {
     variants: {
         variant: {
             /** Pages and records: hairline rule with an accent underline on the selected tab. */
@@ -26,7 +26,7 @@ export const tabsListVariants = cva("relative flex min-w-max", {
     },
     defaultVariants: { variant: "underline" },
 });
-export const tabsTriggerVariants = cva([
+export const tabsTriggerVariants = /*#__PURE__*/ cva([
     "group/tab relative inline-flex shrink-0 select-none items-center gap-2 whitespace-nowrap font-medium text-fg-muted outline-none",
     "transition-[color,background-color,box-shadow] duration-150 focus-ring",
     "hover:text-fg data-selected:text-fg",
@@ -60,8 +60,8 @@ export const tabsTriggerVariants = cva([
     ],
     defaultVariants: { variant: "underline", size: "md" },
 });
-const TabsContext = React.createContext({ value: "", orientation: "horizontal" });
-const TabsListContext = React.createContext({ variant: "underline", size: "md" });
+const TabsContext = /*#__PURE__*/ React.createContext({ value: "", orientation: "horizontal" });
+const TabsListContext = /*#__PURE__*/ React.createContext({ variant: "underline", size: "md" });
 /**
  * Switches between views of the same context (WAI-ARIA Tabs: arrows, Home/End).
  * Inactive panels unmount by default; pass `forceMount` on a `TabsContent` to keep it.
@@ -79,13 +79,13 @@ const TabsListContext = React.createContext({ variant: "underline", size: "md" }
  * `activationMode="manual"` for heavy panels (focus moves with arrows, Enter/Space selects).
  * For route-based tabs use `TabsLinkList` — that is navigation, not the Tabs pattern.
  */
-export const Tabs = React.forwardRef(function Tabs({ value: valueProp, defaultValue, onValueChange, orientation = "horizontal", className, ...props }, ref) {
+export const Tabs = /*#__PURE__*/ React.forwardRef(function Tabs({ value: valueProp, defaultValue, onValueChange, orientation = "horizontal", className, ...props }, ref) {
     const [value, setValue] = useControllableState({ value: valueProp, defaultValue: defaultValue ?? "", onChange: onValueChange, name: "Tabs" });
     const ctx = React.useMemo(() => ({ value, orientation }), [value, orientation]);
     return (_jsx(TabsContext.Provider, { value: ctx, children: _jsx(RadixTabs.Root, { ref: ref, "data-slot": "tabs", value: value, onValueChange: setValue, orientation: orientation, className: cn("flex flex-col gap-4 data-[orientation=vertical]:flex-row data-[orientation=vertical]:gap-6", className), ...props }) }));
 });
 /** The row (or column) of tab triggers. */
-export const TabsList = React.forwardRef(function TabsList({ variant = "underline", size = "md", fill, overflow = "scroll", className, children, ...props }, ref) {
+export const TabsList = /*#__PURE__*/ React.forwardRef(function TabsList({ variant = "underline", size = "md", fill, overflow = "scroll", className, children, ...props }, ref) {
     const { value, orientation } = React.useContext(TabsContext);
     const scrollRef = React.useRef(null);
     const scrolls = overflow === "scroll" && orientation === "horizontal" && !fill;
@@ -109,7 +109,7 @@ export const TabsList = React.forwardRef(function TabsList({ variant = "underlin
     return (_jsx(TabsListContext.Provider, { value: ctx, children: scrolls ? (_jsx("div", { ref: scrollRef, "data-slot": "tabs-scroller", "data-edge-fade": "x", className: "min-w-0 scrollbar-none overflow-x-auto overscroll-x-contain", children: list })) : (list) }));
 });
 /** One tab. `value` must match a `TabsContent`. */
-export const TabsTrigger = React.forwardRef(function TabsTrigger({ value, icon, count, badgeTone, className, children, ...props }, ref) {
+export const TabsTrigger = /*#__PURE__*/ React.forwardRef(function TabsTrigger({ value, icon, count, badgeTone, className, children, ...props }, ref) {
     const { variant, size } = React.useContext(TabsListContext);
     const selected = React.useContext(TabsContext).value === value;
     // Tabs used as a filter (no TabsContent) would point aria-controls at a panel that never
@@ -134,7 +134,7 @@ function TabContent({ icon, count, badgeTone, children }) {
     return (_jsxs(_Fragment, { children: [icon ? (_jsx("span", { "aria-hidden": true, className: "inline-flex text-fg-subtle transition-colors group-hover/tab:text-fg-muted group-data-selected/tab:text-current", children: icon })) : null, _jsx("span", { className: "truncate", children: children }), count !== undefined ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "sr-only", children: ", " }), _jsx(Badge, { count: count, tone: badgeTone ?? "neutral", className: "-me-0.5" })] })) : null] }));
 }
 /** The panel for one tab. Unmounted while inactive unless `forceMount`. */
-export const TabsContent = React.forwardRef(function TabsContent({ className, ...props }, ref) {
+export const TabsContent = /*#__PURE__*/ React.forwardRef(function TabsContent({ className, ...props }, ref) {
     return _jsx(RadixTabs.Content, { ref: ref, "data-slot": "tabs-content", className: cn("min-w-0 flex-1 rounded-ui outline-none focus-ring", className), ...props });
 });
 /**
@@ -149,7 +149,7 @@ export const TabsContent = React.forwardRef(function TabsContent({ className, ..
  * </TabsLinkList>
  * ```
  */
-export const TabsLinkList = React.forwardRef(function TabsLinkList({ variant = "underline", size = "md", fill, orientation = "horizontal", overflow = "scroll", className, children, ...props }, ref) {
+export const TabsLinkList = /*#__PURE__*/ React.forwardRef(function TabsLinkList({ variant = "underline", size = "md", fill, orientation = "horizontal", overflow = "scroll", className, children, ...props }, ref) {
     const scrollRef = React.useRef(null);
     const composed = useComposedRefs(ref, scrollRef);
     const scrolls = overflow === "scroll" && orientation === "horizontal" && !fill;
@@ -164,7 +164,7 @@ export const TabsLinkList = React.forwardRef(function TabsLinkList({ variant = "
     return (_jsx(TabsListContext.Provider, { value: ctx, children: _jsx("nav", { ref: composed, "data-slot": "tabs-link-list", "data-edge-fade": scrolls ? "x" : undefined, className: cn(scrolls && "min-w-0 scrollbar-none overflow-x-auto overscroll-x-contain", className), ...props, children: _jsx("div", { "data-orientation": orientation, "data-variant": variant, className: tabsListVariants({ variant, fill }), children: React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child, { "data-orientation": orientation }) : child) }) }) }));
 });
 /** One route tab. Renders the app's `Link`. */
-export const TabsLink = React.forwardRef(function TabsLink({ href, active, exact, icon, count, badgeTone, disabled, className, children, ...props }, ref) {
+export const TabsLink = /*#__PURE__*/ React.forwardRef(function TabsLink({ href, active, exact, icon, count, badgeTone, disabled, className, children, ...props }, ref) {
     const Link = useLink();
     const { isActive } = useNavigation();
     const { variant, size } = React.useContext(TabsListContext);

package/dist/components/tag-input.js

@@ -40,7 +40,7 @@ const PASTE_SPLIT = /[,;\n\r\t]+/;
  * <TagInput validate={(v) => /^\S+@\S+\.\S+$/.test(v) || "Not an email address"} />
  * ```
  */
-export const TagInput = React.forwardRef(function TagInput(props, forwardedRef) {
+export const TagInput = /*#__PURE__*/ React.forwardRef(function TagInput(props, forwardedRef) {
     const { value: valueProp, defaultValue, onValueChange, suggestions, allowCustom = true, delimiters = ["Enter", "Tab", ","], max, maxLength, validate, transform = defaultTransform, dedupe = "fold", tagTone, addOnBlur = false, name: nameProp, placeholder, size = "md", variant = "default", invalid, className, labels, } = props;
     const t = useLabels("tagInput", tagInputLabels, labels);
     const { locale } = useLocale();

package/dist/components/task-list.js

@@ -55,7 +55,7 @@ function applyDone(items, overrides) {
  * <TaskList variant="checklist" items={prePublish} onToggle={toggle} />
  * ```
  */
-export const TaskList = React.forwardRef(function TaskList({ items, onToggle, onAdd, onEdit, onRemove, onReorder, title, hideCompleted: hideProp, defaultHideCompleted = false, onHideCompletedChange, showProgress = true, sortCompleted, variant = "list", today, readOnly, labels, className, ...props }, ref) {
+export const TaskList = /*#__PURE__*/ React.forwardRef(function TaskList({ items, onToggle, onAdd, onEdit, onRemove, onReorder, title, hideCompleted: hideProp, defaultHideCompleted = false, onHideCompletedChange, showProgress = true, sortCompleted, variant = "list", today, readOnly, labels, className, ...props }, ref) {
     const t = useLabels("taskList", taskListLabels, labels);
     const f = useFormat();
     const { timeZone } = useLocale();

package/dist/components/time-picker.js

@@ -51,7 +51,7 @@ export function isTimeOutOfRange(value, opts) {
  * <Field label="Start"><TimeInput value={time} onValueChange={setTime} /></Field>
  * ```
  */
-export const TimeInput = React.forwardRef(function TimeInput(rawProps, ref) {
+export const TimeInput = /*#__PURE__*/ React.forwardRef(function TimeInput(rawProps, ref) {
     const field = useFieldContext();
     const { value: valueProp, defaultValue, onValueChange, hourCycle: hourCycleProp, step = 1, seconds = false, min, max, disabledTimes, name, size = "md", variant = "default", invalid, icon, trailing, className, labels, onBlur, ...rest } = rawProps;
     const props = useFieldControl({ ...rest, name, "aria-invalid": invalid ? true : rest["aria-invalid"] });
@@ -308,7 +308,7 @@ export const TimeInput = React.forwardRef(function TimeInput(rawProps, ref) {
  * <TimePicker value={time} onValueChange={setTime} slots step={30} min="09:00" max="18:00" />
  * ```
  */
-export const TimePicker = React.forwardRef(function TimePicker({ slots = false, step = 15, slotRange, open: openProp, onOpenChange, value: valueProp, defaultValue, onValueChange, labels, ...props }, ref) {
+export const TimePicker = /*#__PURE__*/ React.forwardRef(function TimePicker({ slots = false, step = 15, slotRange, open: openProp, onOpenChange, value: valueProp, defaultValue, onValueChange, labels, ...props }, ref) {
     const t = useLabels("timePicker", timePickerLabels, labels);
     const { locale } = useLocale();
     const [value, setValue] = useControllableState({ value: valueProp, defaultValue: defaultValue ?? null, onChange: onValueChange, name: "TimePicker" });
@@ -383,7 +383,7 @@ export function timeRangeMinutes(range, overnight = false) {
  * Start and end time with a duration hint (shift start/end, opening hours). The end must be after
  * the start unless `overnight` is set.
  */
-export const TimeRangePicker = React.forwardRef(function TimeRangePicker({ value: valueProp, defaultValue, onValueChange, overnight = false, showDuration = true, nameStart, nameEnd, labels, className, size = "md", ...props }, ref) {
+export const TimeRangePicker = /*#__PURE__*/ React.forwardRef(function TimeRangePicker({ value: valueProp, defaultValue, onValueChange, overnight = false, showDuration = true, nameStart, nameEnd, labels, className, size = "md", ...props }, ref) {
     const t = useLabels("timePicker", timePickerLabels, labels);
     const [value, setValue] = useControllableState({ value: valueProp, defaultValue: defaultValue ?? { start: null, end: null }, onChange: onValueChange, name: "TimeRangePicker" });
     const minutes = timeRangeMinutes(value, overnight);

package/dist/components/toggle.d.ts

@@ -1,5 +1,6 @@
 import * as React from "react";
-import { Toggle as TogglePrimitive, ToggleGroup as ToggleGroupPrimitive } from "radix-ui";
+import * as TogglePrimitive from "radix-ui/toggle";
+import * as ToggleGroupPrimitive from "radix-ui/toggle-group";
 export declare const toggleVariants: (props?: ({
     variant?: "outline" | "ghost" | "segmented" | null | undefined;
     size?: "sm" | "md" | "lg" | "xs" | null | undefined;

package/dist/components/toggle.js

@@ -1,10 +1,11 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { Toggle as TogglePrimitive, ToggleGroup as ToggleGroupPrimitive } from "radix-ui";
+import * as TogglePrimitive from "radix-ui/toggle";
+import * as ToggleGroupPrimitive from "radix-ui/toggle-group";
 import { cva } from "class-variance-authority";
 import { cn } from "../lib/cn.js";
-export const toggleVariants = cva([
+export const toggleVariants = /*#__PURE__*/ cva([
     "relative inline-flex shrink-0 select-none items-center justify-center gap-1.5 whitespace-nowrap font-medium outline-none",
     "transition-[background-color,color,box-shadow,border-color] duration-150 focus-ring [&_svg]:shrink-0",
     "disabled:pointer-events-none disabled:opacity-45",
@@ -36,7 +37,7 @@ export const toggleVariants = cva([
  * <Toggle variant="outline" defaultPressed>Show archived</Toggle>
  * ```
  */
-export const Toggle = React.forwardRef(function Toggle({ variant = "ghost", size = "md", label, className, children, title, ...props }, ref) {
+export const Toggle = /*#__PURE__*/ React.forwardRef(function Toggle({ variant = "ghost", size = "md", label, className, children, title, ...props }, ref) {
     const iconOnly = Boolean(label) && !hasText(children);
     return (_jsx(TogglePrimitive.Root, { ref: ref, "data-slot": "toggle", "aria-label": props["aria-label"] ?? (iconOnly ? label : undefined), title: title ?? (iconOnly ? label : undefined), className: cn(toggleVariants({ variant, size, iconOnly }), className), ...props, children: children }));
 });
@@ -50,7 +51,7 @@ function hasText(node) {
     });
     return found;
 }
-const ToggleGroupContext = React.createContext({ variant: "outline", size: "md" });
+const ToggleGroupContext = /*#__PURE__*/ React.createContext({ variant: "outline", size: "md" });
 const trackClass = (orientation) => cn("gap-0.5 rounded-ui border border-line bg-selected p-[3px]", orientation === "vertical" ? "flex-col" : "");
 /**
  * A set of toggles with roving focus (one tab stop, arrow keys move): view switches, alignment,
@@ -64,7 +65,7 @@ const trackClass = (orientation) => cn("gap-0.5 rounded-ui border border-line bg
  * </ToggleGroup>
  * ```
  */
-export const ToggleGroup = React.forwardRef(function ToggleGroup(props, ref) {
+export const ToggleGroup = /*#__PURE__*/ React.forwardRef(function ToggleGroup(props, ref) {
     const { variant = "segmented", size = "md", orientation = "horizontal", block, className, children, ...rest } = props;
     const ctx = React.useMemo(() => ({ variant, size }), [variant, size]);
     const layout = cn("relative isolate items-stretch", block ? "flex w-full [&>*]:flex-1" : "inline-flex w-fit max-w-full", orientation === "vertical" && "flex-col", variant === "segmented" && trackClass(orientation), 
@@ -93,7 +94,7 @@ function SingleToggleGroup({ value, defaultValue, onValueChange, allowEmpty = fa
         }, children: children }));
 }
 /** One toggle inside a `ToggleGroup`. */
-export const ToggleGroupItem = React.forwardRef(function ToggleGroupItem({ label, className, children, title, ...props }, ref) {
+export const ToggleGroupItem = /*#__PURE__*/ React.forwardRef(function ToggleGroupItem({ label, className, children, title, ...props }, ref) {
     const { variant, size } = React.useContext(ToggleGroupContext);
     const iconOnly = Boolean(label) && !hasText(children);
     const segmentSize = variant === "segmented"

package/dist/components/tooltip.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Tooltip as TooltipPrimitive } from "radix-ui";
+import * as TooltipPrimitive from "radix-ui/tooltip";
 import { type VariantProps } from "class-variance-authority";
 /** `true` when a `TooltipProvider` is above this point (IconButton switches from `title` to Tooltip). */
 export declare function useHasTooltipProvider(): boolean;

package/dist/components/tooltip.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Slot, Tooltip as TooltipPrimitive } from "radix-ui";
+import * as Slot from "radix-ui/slot";
+import * as TooltipPrimitive from "radix-ui/tooltip";
 import { cva } from "class-variance-authority";
 import { cn } from "../lib/cn.js";
 import { usePortalContainer } from "../lib/theme-scope.js";
@@ -10,7 +11,7 @@ import { KbdGroup } from "./kbd.js";
 /* ------------------------------------------------------------------ */
 /* Provider                                                            */
 /* ------------------------------------------------------------------ */
-const TooltipProviderContext = React.createContext(false);
+const TooltipProviderContext = /*#__PURE__*/ React.createContext(false);
 /** `true` when a `TooltipProvider` is above this point (IconButton switches from `title` to Tooltip). */
 export function useHasTooltipProvider() {
     return React.useContext(TooltipProviderContext);
@@ -32,7 +33,7 @@ export function TooltipRoot(props) {
     return (_jsx(EnsureProvider, { children: _jsx(TooltipPrimitive.Root, { ...props }) }));
 }
 export const TooltipTrigger = TooltipPrimitive.Trigger;
-export const tooltipContentVariants = cva([
+export const tooltipContentVariants = /*#__PURE__*/ cva([
     "ui-pop z-(--z-tooltip) max-w-[min(18rem,calc(100vw-1.5rem))] select-none rounded-ui-sm px-2 py-1 text-[12.5px] leading-snug font-medium",
     // tooltips never blur — they open and close too often to spend the glass budget on
     "[--blur:0px] backdrop-filter-none",
@@ -51,7 +52,7 @@ export const tooltipContentVariants = cva([
     },
     defaultVariants: { tone: "inverted" },
 });
-export const TooltipContent = React.forwardRef(function TooltipContent({ className, tone, arrow = false, shortcut, sideOffset = 6, collisionPadding = 8, children, ...props }, ref) {
+export const TooltipContent = /*#__PURE__*/ React.forwardRef(function TooltipContent({ className, tone, arrow = false, shortcut, sideOffset = 6, collisionPadding = 8, children, ...props }, ref) {
     const container = usePortalContainer();
     const inverted = (tone ?? "inverted") === "inverted";
     return (_jsx(TooltipPrimitive.Portal, { container: container, children: _jsxs(TooltipPrimitive.Content, { ref: ref, "data-slot": "tooltip-content", "data-tone": tone ?? "inverted", sideOffset: sideOffset, collisionPadding: collisionPadding, className: cn(tooltipContentVariants({ tone }), className), ...props, children: [_jsx("span", { className: "min-w-0", children: children }), shortcut ? (_jsx(KbdGroup, { keys: shortcut, size: "sm", variant: "ghost", className: cn("-me-0.5", inverted && "[&_kbd_kbd]:border-[color-mix(in_srgb,var(--scene)_28%,transparent)] [&_kbd_kbd]:text-[color-mix(in_srgb,var(--scene)_78%,transparent)]") })) : null, arrow ? (_jsx(TooltipPrimitive.Arrow, { asChild: true, width: 10, height: 5, children: _jsx(FloatingArrow, { width: 10, height: 5, fill: inverted ? "var(--fg)" : "var(--popover-nested)", stroke: inverted ? "none" : "var(--popover-border)" }) })) : null] }) }));

package/dist/components/top-bar.js

@@ -19,7 +19,7 @@ const topBarLabels = {
  * Bridge between the top bar and the App shell (mobile nav button). App shell provides it; outside
  * a shell the menu button needs its own `onClick`.
  */
-export const TopBarShellContext = React.createContext(null);
+export const TopBarShellContext = /*#__PURE__*/ React.createContext(null);
 /**
  * The sticky bar above the content: mobile menu button, ⌘K search, contextual actions,
  * notifications and the user menu. The same in every app.
@@ -33,7 +33,7 @@ export const TopBarShellContext = React.createContext(null);
  * </TopBar>
  * ```
  */
-export const TopBar = React.forwardRef(function TopBar({ sticky = true, variant = "bar", scrollTarget, className, role, ...props }, ref) {
+export const TopBar = /*#__PURE__*/ React.forwardRef(function TopBar({ sticky = true, variant = "bar", scrollTarget, className, role, ...props }, ref) {
     const [scrolled, setScrolled] = React.useState(false);
     React.useEffect(() => {
         if (typeof window === "undefined")
@@ -64,7 +64,7 @@ export function TopBarSeparator({ className }) {
     return _jsx("span", { "aria-hidden": true, "data-slot": "top-bar-separator", className: cn("mx-1 h-5 w-px shrink-0 bg-line", className) });
 }
 /** Opens the App shell's mobile navigation. Visible only below 768px. */
-export const TopBarMenuButton = React.forwardRef(function TopBarMenuButton({ className, onClick, labels, ...props }, ref) {
+export const TopBarMenuButton = /*#__PURE__*/ React.forwardRef(function TopBarMenuButton({ className, onClick, labels, ...props }, ref) {
     const shell = React.useContext(TopBarShellContext);
     const t = useLabels("topBar", topBarLabels, labels);
     return (_jsx(IconButton, { ref: ref, label: t("menu"), size: "sm", tooltip: false, "aria-expanded": shell ? shell.mobileNavOpen : undefined, "aria-haspopup": "dialog", onClick: (e) => {
@@ -77,7 +77,7 @@ export const TopBarMenuButton = React.forwardRef(function TopBarMenuButton({ cla
  * The ⌘K trigger: a real button that looks like a field. Collapses to an icon button when the bar is
  * narrower than 560px.
  */
-export const TopBarSearch = React.forwardRef(function TopBarSearch({ placeholder, shortcut = "mod+k", onOpen, onClick, className, labels, ...props }, ref) {
+export const TopBarSearch = /*#__PURE__*/ React.forwardRef(function TopBarSearch({ placeholder, shortcut = "mod+k", onOpen, onClick, className, labels, ...props }, ref) {
     const t = useLabels("topBar", topBarLabels, labels);
     const palette = useCommandPalette();
     const open = (e) => {

package/dist/components/tour.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Popover as PopoverPrimitive } from "radix-ui";
+import * as PopoverPrimitive from "radix-ui/popover";
 import { X } from "lucide-react";
 import { cn } from "../lib/cn.js";
 import { useLabels } from "../lib/labels.js";

package/dist/components/tree-select.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { Popover as PopoverPrimitive } from "radix-ui";
+import * as PopoverPrimitive from "radix-ui/popover";
 import { ChevronsUpDown, Plus, Search, X } from "lucide-react";
 import { cn } from "../lib/cn.js";
 import { FieldContextReset, useFieldControl } from "../lib/field-context.js";
@@ -60,7 +60,7 @@ function PathSeparator() {
  * <TreeSelect multiple nodes={regions} valueMode="parent" value={territories} onValueChange={setTerritories} />
  * ```
  */
-export const TreeSelect = React.forwardRef(function TreeSelect(props, ref) {
+export const TreeSelect = /*#__PURE__*/ React.forwardRef(function TreeSelect(props, ref) {
     const { nodes, loadChildren, selectable = "any", showPath = true, defaultExpanded = "selected", onCreate, searchable = true, mode = "popover", height = 288, size = "md", placeholder, searchPlaceholder, labels, className, } = props;
     const multiple = props.multiple === true;
     const t = useLabels("treeSelect", treeSelectLabels, labels);

package/dist/components/tree-view.js

@@ -19,7 +19,7 @@ const treeViewLabels = {
     noMatches: "No matches for “{query}”",
     results: "{count, plural, =0 {No matches} one {# match} other {# matches}}",
 };
-export const treeRowVariants = cva([
+export const treeRowVariants = /*#__PURE__*/ cva([
     "group/tree-row relative flex w-full min-w-0 cursor-default select-none items-center gap-1.5 rounded-ui-sm pe-1.5 text-start outline-none",
     "transition-colors duration-100",
     "hover:bg-hover focus-visible:bg-hover focus-visible:shadow-[inset_0_0_0_2px_var(--ring)]",
@@ -57,7 +57,7 @@ export function TreeLabelText({ text, query, locale }) {
  * icon, label, badge and hover actions. Used by Tree view and Tree select; render it inside an
  * element carrying `tree.getTreeProps()`.
  */
-export const TreeViewRow = React.forwardRef(function TreeViewRow({ item, tree, indent = 16, guides = true, size = "md", variant = "default", checkbox, query, label, actions, labels, onRowClick, className, style, onClick, onDoubleClick, ...props }, ref) {
+export const TreeViewRow = /*#__PURE__*/ React.forwardRef(function TreeViewRow({ item, tree, indent = 16, guides = true, size = "md", variant = "default", checkbox, query, label, actions, labels, onRowClick, className, style, onClick, onDoubleClick, ...props }, ref) {
     const t = useLabels("treeView", treeViewLabels, labels);
     const { locale } = useLocale();
     const { node } = item;
@@ -95,7 +95,7 @@ export const TreeViewRow = React.forwardRef(function TreeViewRow({ item, tree, i
  * <TreeView aria-label="Categories" data={categories} selectionMode="checkbox" checkValueMode="leaf" />
  * ```
  */
-export const TreeView = React.forwardRef(function TreeView({ data, expanded, defaultExpanded, onExpandedChange, selectionMode = "single", selected, defaultSelected, onSelectedChange, cascade, checkValueMode, isSelectable, loadChildren, filter, onAction, renderActions, renderLabel, virtual = false, height, indent = 16, guides = true, variant = "default", size = "md", emptyState, labels, className, style, ...props }, ref) {
+export const TreeView = /*#__PURE__*/ React.forwardRef(function TreeView({ data, expanded, defaultExpanded, onExpandedChange, selectionMode = "single", selected, defaultSelected, onSelectedChange, cascade, checkValueMode, isSelectable, loadChildren, filter, onAction, renderActions, renderLabel, virtual = false, height, indent = 16, guides = true, variant = "default", size = "md", emptyState, labels, className, style, ...props }, ref) {
     const t = useLabels("treeView", treeViewLabels, labels);
     const { locale, dir } = useLocale();
     const checkbox = selectionMode === "checkbox";