@3w-witim/ui 0.1.0 → 0.3.0

package/dist/index.js

@@ -2,7 +2,7 @@
 
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
-var React16 = require('react');
+var React17 = require('react');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
@@ -26,7 +26,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React16__namespace = /*#__PURE__*/_interopNamespace(React16);
+var React17__namespace = /*#__PURE__*/_interopNamespace(React17);
 var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
 
 // src/utils.ts
@@ -59,7 +59,7 @@ var buttonVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Button = React16__namespace.forwardRef(
+var Button = React17__namespace.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : "button";
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -93,7 +93,7 @@ var inputVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Input = React16__namespace.forwardRef(
+var Input = React17__namespace.forwardRef(
   ({
     className,
     type = "text",
@@ -107,7 +107,7 @@ var Input = React16__namespace.forwardRef(
     ...props
   }, ref) => {
     const isError = state === "error";
-    const reactId = React16__namespace.useId();
+    const reactId = React17__namespace.useId();
     const helperId = helperText ? `${id ?? reactId}-helper` : void 0;
     const describedBy = [ariaDescribedby, helperId].filter(Boolean).join(" ") || void 0;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col gap-1.5", children: [
@@ -211,7 +211,7 @@ var textareaVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Textarea = React16__namespace.forwardRef(
+var Textarea = React17__namespace.forwardRef(
   ({ className, state, size, "aria-invalid": ariaInvalid, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
@@ -237,7 +237,7 @@ var cardVariants = classVarianceAuthority.cva("rounded-lg text-text-default tran
     variant: "default"
   }
 });
-var Card = React16__namespace.forwardRef(
+var Card = React17__namespace.forwardRef(
   ({ className, variant, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -248,7 +248,7 @@ var Card = React16__namespace.forwardRef(
   )
 );
 Card.displayName = "Card";
-var CardHeader = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardHeader = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -257,7 +257,7 @@ var CardHeader = React16__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardTitle = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -269,7 +269,7 @@ var CardTitle = React16__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -278,9 +278,9 @@ var CardDescription = React16__namespace.forwardRef(({ className, ...props }, re
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-5 pt-0", className), ...props }));
+var CardContent = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-5 pt-0", className), ...props }));
 CardContent.displayName = "CardContent";
-var CardFooter = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardFooter = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -289,7 +289,7 @@ var CardFooter = React16__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 CardFooter.displayName = "CardFooter";
-var ScrollArea = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var ScrollArea = React17__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   ScrollAreaPrimitive__namespace.Root,
   {
     ref,
@@ -303,7 +303,7 @@ var ScrollArea = React16__namespace.forwardRef(({ className, children, ...props
   }
 ));
 ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
-var ScrollBar = React16__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var ScrollBar = React17__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
   {
     ref,
@@ -334,7 +334,7 @@ var labelVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Label = React16__namespace.forwardRef(
+var Label = React17__namespace.forwardRef(
   ({ className, variant, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "span",
@@ -359,7 +359,7 @@ var skeletonVariants = classVarianceAuthority.cva("animate-pulse bg-border-subtl
     variant: "rect"
   }
 });
-var Skeleton = React16__namespace.forwardRef(
+var Skeleton = React17__namespace.forwardRef(
   ({ className, variant, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -408,7 +408,7 @@ function clamp(value) {
   if (Number.isNaN(value)) return 0;
   return Math.min(100, Math.max(0, value));
 }
-var Progress = React16__namespace.forwardRef(
+var Progress = React17__namespace.forwardRef(
   ({
     className,
     size,
@@ -475,9 +475,9 @@ var CheckIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx(
     )
   }
 );
-var Checkbox = React16__namespace.forwardRef(
+var Checkbox = React17__namespace.forwardRef(
   ({ className, state, error, label, id, disabled, "aria-invalid": ariaInvalid, ...props }, ref) => {
-    const reactId = React16__namespace.useId();
+    const reactId = React17__namespace.useId();
     const inputId = id ?? reactId;
     const resolvedState = error ? "error" : state ?? "default";
     const isInvalid = resolvedState === "error";
@@ -521,10 +521,10 @@ var Checkbox = React16__namespace.forwardRef(
   }
 );
 Checkbox.displayName = "Checkbox";
-var RadioGroupContext = React16__namespace.createContext(
+var RadioGroupContext = React17__namespace.createContext(
   null
 );
-var RadioGroup = React16__namespace.forwardRef(
+var RadioGroup = React17__namespace.forwardRef(
   ({
     className,
     name,
@@ -536,17 +536,17 @@ var RadioGroup = React16__namespace.forwardRef(
     children,
     ...props
   }, ref) => {
-    const [internalValue, setInternalValue] = React16__namespace.useState(defaultValue);
+    const [internalValue, setInternalValue] = React17__namespace.useState(defaultValue);
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
-    const handleValueChange = React16__namespace.useCallback(
+    const handleValueChange = React17__namespace.useCallback(
       (next) => {
         if (!isControlled) setInternalValue(next);
         onValueChange?.(next);
       },
       [isControlled, onValueChange]
     );
-    const ctx = React16__namespace.useMemo(
+    const ctx = React17__namespace.useMemo(
       () => ({
         name,
         value: currentValue,
@@ -598,7 +598,7 @@ var radioDotVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Radio = React16__namespace.forwardRef(
+var Radio = React17__namespace.forwardRef(
   ({
     className,
     id,
@@ -614,12 +614,12 @@ var Radio = React16__namespace.forwardRef(
     onClick,
     ...props
   }, ref) => {
-    const group = React16__namespace.useContext(RadioGroupContext);
-    const reactId = React16__namespace.useId();
+    const group = React17__namespace.useContext(RadioGroupContext);
+    const reactId = React17__namespace.useId();
     const inputId = id ?? reactId;
     const isGroup = group != null;
     const isControlled = checkedProp !== void 0;
-    const [internalChecked, setInternalChecked] = React16__namespace.useState(false);
+    const [internalChecked, setInternalChecked] = React17__namespace.useState(false);
     const name = nameProp ?? group?.name;
     const disabled = disabledProp ?? group?.disabled ?? false;
     const error = errorProp ?? group?.error ?? false;
@@ -748,7 +748,7 @@ var toggleThumbVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Toggle = React16__namespace.forwardRef(
+var Toggle = React17__namespace.forwardRef(
   ({
     className,
     size,
@@ -760,7 +760,7 @@ var Toggle = React16__namespace.forwardRef(
     ...props
   }, ref) => {
     const isControlled = checked !== void 0;
-    const [internalChecked, setInternalChecked] = React16__namespace.useState(defaultChecked);
+    const [internalChecked, setInternalChecked] = React17__namespace.useState(defaultChecked);
     const isOn = isControlled ? checked : internalChecked;
     const state = isOn ? "on" : "off";
     const handleClick = (event) => {
@@ -828,7 +828,7 @@ var CloseIcon = () => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 4l8 8M12 4l-8 8" })
   }
 );
-var Chip = React16__namespace.forwardRef(
+var Chip = React17__namespace.forwardRef(
   ({
     className,
     variant,
@@ -879,6 +879,50 @@ var Chip = React16__namespace.forwardRef(
   }
 );
 Chip.displayName = "Chip";
+var reactionPillVariants = classVarianceAuthority.cva(
+  "inline-flex items-center rounded-lg border font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+  {
+    variants: {
+      state: {
+        default: "border-border-subtle bg-surface-default text-text-default hover:border-border-default active:bg-surface-pressed",
+        selected: "border-brand-border bg-brand-subtle text-brand-text hover:bg-brand-subtle active:bg-brand-subtle"
+      },
+      size: {
+        sm: "h-[22px] gap-[3px] px-[7px] text-[11px]",
+        md: "h-[26px] gap-[5px] px-[9px] text-xs"
+      }
+    },
+    defaultVariants: {
+      state: "default",
+      size: "md"
+    }
+  }
+);
+var ReactionPill = React17__namespace.forwardRef(
+  ({ className, emoji, count, active = false, size, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        ref,
+        "aria-pressed": active,
+        className: cn(
+          reactionPillVariants({
+            state: active ? "selected" : "default",
+            size
+          }),
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "leading-none", children: emoji }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "tabular-nums", children: count })
+        ]
+      }
+    );
+  }
+);
+ReactionPill.displayName = "ReactionPill";
 var alertVariants = classVarianceAuthority.cva(
   "relative flex gap-3 rounded-lg border p-3 [&>svg]:size-5 [&>svg]:shrink-0 [&>svg]:mt-0.5",
   {
@@ -893,7 +937,7 @@ var alertVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Alert = React16__namespace.forwardRef(
+var Alert = React17__namespace.forwardRef(
   ({ className, variant, role = "alert", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -905,7 +949,7 @@ var Alert = React16__namespace.forwardRef(
   )
 );
 Alert.displayName = "Alert";
-var AlertTitle = React16__namespace.forwardRef(
+var AlertTitle = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "p",
     {
@@ -919,7 +963,7 @@ var AlertTitle = React16__namespace.forwardRef(
   )
 );
 AlertTitle.displayName = "AlertTitle";
-var AlertDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var AlertDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "p",
   {
     ref,
@@ -1052,7 +1096,7 @@ function MascotImage({
     }
   );
 }
-var Avatar = React16__namespace.forwardRef(
+var Avatar = React17__namespace.forwardRef(
   ({ className, size = "sm", src, alt, color, presence, children, ...props }, ref) => {
     const resolvedSize = size ?? "sm";
     return (
@@ -1093,9 +1137,9 @@ var Avatar = React16__namespace.forwardRef(
   }
 );
 Avatar.displayName = "Avatar";
-var AvatarImage = React16__namespace.forwardRef(
+var AvatarImage = React17__namespace.forwardRef(
   ({ className, alt = "", color, seed, ...props }, ref) => {
-    const [errored, setErrored] = React16__namespace.useState(false);
+    const [errored, setErrored] = React17__namespace.useState(false);
     if (errored) {
       return /* @__PURE__ */ jsxRuntime.jsx(MascotImage, { color, seed: seed ?? alt, alt });
     }
@@ -1112,7 +1156,7 @@ var AvatarImage = React16__namespace.forwardRef(
   }
 );
 AvatarImage.displayName = "AvatarImage";
-var AvatarFallback = React16__namespace.forwardRef(
+var AvatarFallback = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
@@ -1126,9 +1170,9 @@ var AvatarFallback = React16__namespace.forwardRef(
   )
 );
 AvatarFallback.displayName = "AvatarFallback";
-var AvatarGroup = React16__namespace.forwardRef(
+var AvatarGroup = React17__namespace.forwardRef(
   ({ className, children, max, size = "sm", ...props }, ref) => {
-    const items = React16__namespace.Children.toArray(children).filter(React16__namespace.isValidElement);
+    const items = React17__namespace.Children.toArray(children).filter(React17__namespace.isValidElement);
     const visible = typeof max === "number" ? items.slice(0, max) : items;
     const overflow = items.length - visible.length;
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("flex items-center", className), ...props, children: [
@@ -1192,7 +1236,7 @@ var tooltipArrowVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Tooltip = React16__namespace.forwardRef(
+var Tooltip = React17__namespace.forwardRef(
   ({
     className,
     content,
@@ -1203,10 +1247,10 @@ var Tooltip = React16__namespace.forwardRef(
     disabled = false,
     ...props
   }, ref) => {
-    const [hovered, setHovered] = React16__namespace.useState(false);
+    const [hovered, setHovered] = React17__namespace.useState(false);
     const isControlled = open !== void 0;
     const visible = !disabled && (isControlled ? open : hovered);
-    const tooltipId = React16__namespace.useId();
+    const tooltipId = React17__namespace.useId();
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -1250,20 +1294,20 @@ var Tooltip = React16__namespace.forwardRef(
   }
 );
 Tooltip.displayName = "Tooltip";
-var DropdownMenuContext = React16__namespace.createContext(null);
+var DropdownMenuContext = React17__namespace.createContext(null);
 function useDropdownMenuContext(component) {
-  const ctx = React16__namespace.useContext(DropdownMenuContext);
+  const ctx = React17__namespace.useContext(DropdownMenuContext);
   if (!ctx) {
     throw new Error(`${component} must be used within <DropdownMenu>`);
   }
   return ctx;
 }
-var DropdownMenu = React16__namespace.forwardRef(
+var DropdownMenu = React17__namespace.forwardRef(
   ({ className, open: openProp, defaultOpen = false, onOpenChange, ...props }, ref) => {
-    const [uncontrolledOpen, setUncontrolledOpen] = React16__namespace.useState(defaultOpen);
+    const [uncontrolledOpen, setUncontrolledOpen] = React17__namespace.useState(defaultOpen);
     const isControlled = openProp !== void 0;
     const open = isControlled ? openProp : uncontrolledOpen;
-    const setOpen = React16__namespace.useCallback(
+    const setOpen = React17__namespace.useCallback(
       (value) => {
         const next = typeof value === "function" ? value(open) : value;
         if (!isControlled) setUncontrolledOpen(next);
@@ -1271,7 +1315,7 @@ var DropdownMenu = React16__namespace.forwardRef(
       },
       [isControlled, onOpenChange, open]
     );
-    const ctx = React16__namespace.useMemo(() => ({ open, setOpen }), [open, setOpen]);
+    const ctx = React17__namespace.useMemo(() => ({ open, setOpen }), [open, setOpen]);
     return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -1283,7 +1327,7 @@ var DropdownMenu = React16__namespace.forwardRef(
   }
 );
 DropdownMenu.displayName = "DropdownMenu";
-var DropdownMenuTrigger = React16__namespace.forwardRef(({ className, onClick, disabled, ...props }, ref) => {
+var DropdownMenuTrigger = React17__namespace.forwardRef(({ className, onClick, disabled, ...props }, ref) => {
   const { open, setOpen } = useDropdownMenuContext("DropdownMenuTrigger");
   return /* @__PURE__ */ jsxRuntime.jsx(
     "button",
@@ -1321,7 +1365,7 @@ var dropdownMenuContentVariants = classVarianceAuthority.cva(
     }
   }
 );
-var DropdownMenuContent = React16__namespace.forwardRef(({ className, align, forceMount = false, ...props }, ref) => {
+var DropdownMenuContent = React17__namespace.forwardRef(({ className, align, forceMount = false, ...props }, ref) => {
   const { open } = useDropdownMenuContext("DropdownMenuContent");
   if (!open && !forceMount) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1354,7 +1398,7 @@ var dropdownMenuItemVariants = classVarianceAuthority.cva(
     }
   }
 );
-var DropdownMenuItem = React16__namespace.forwardRef(
+var DropdownMenuItem = React17__namespace.forwardRef(
   ({
     className,
     variant,
@@ -1385,7 +1429,7 @@ var DropdownMenuItem = React16__namespace.forwardRef(
   }
 );
 DropdownMenuItem.displayName = "DropdownMenuItem";
-var DropdownMenuLabel = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuLabel = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1397,7 +1441,7 @@ var DropdownMenuLabel = React16__namespace.forwardRef(({ className, ...props },
   }
 ));
 DropdownMenuLabel.displayName = "DropdownMenuLabel";
-var DropdownMenuSeparator = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuSeparator = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1408,7 +1452,7 @@ var DropdownMenuSeparator = React16__namespace.forwardRef(({ className, ...props
   }
 ));
 DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
-var DropdownMenuEmpty = React16__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuEmpty = React17__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1464,7 +1508,7 @@ var CheckIcon3 = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m4.5 10.5 3.5 3.5 7.5-8" })
   }
 );
-var Select = React16__namespace.forwardRef(
+var Select = React17__namespace.forwardRef(
   ({
     className,
     state,
@@ -1478,8 +1522,8 @@ var Select = React16__namespace.forwardRef(
     "aria-label": ariaLabel,
     ...props
   }, ref) => {
-    const [open, setOpen] = React16__namespace.useState(defaultOpen);
-    const selected = React16__namespace.useMemo(
+    const [open, setOpen] = React17__namespace.useState(defaultOpen);
+    const selected = React17__namespace.useMemo(
       () => options.find((o) => o.value === value),
       [options, value]
     );
@@ -1562,7 +1606,7 @@ var Select = React16__namespace.forwardRef(
   }
 );
 Select.displayName = "Select";
-var DialogOverlay = React16__namespace.forwardRef(
+var DialogOverlay = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1591,7 +1635,7 @@ var dialogPanelVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Dialog = React16__namespace.forwardRef(
+var Dialog = React17__namespace.forwardRef(
   ({
     open = true,
     onOpenChange,
@@ -1635,7 +1679,7 @@ var Dialog = React16__namespace.forwardRef(
   }
 );
 Dialog.displayName = "Dialog";
-var DialogHeader = React16__namespace.forwardRef(
+var DialogHeader = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1646,7 +1690,7 @@ var DialogHeader = React16__namespace.forwardRef(
   )
 );
 DialogHeader.displayName = "DialogHeader";
-var DialogTitle = React16__namespace.forwardRef(
+var DialogTitle = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "h2",
     {
@@ -1660,7 +1704,7 @@ var DialogTitle = React16__namespace.forwardRef(
   )
 );
 DialogTitle.displayName = "DialogTitle";
-var DialogDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "p",
   {
     ref,
@@ -1669,7 +1713,7 @@ var DialogDescription = React16__namespace.forwardRef(({ className, ...props },
   }
 ));
 DialogDescription.displayName = "DialogDescription";
-var DialogBody = React16__namespace.forwardRef(
+var DialogBody = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1680,7 +1724,7 @@ var DialogBody = React16__namespace.forwardRef(
   )
 );
 DialogBody.displayName = "DialogBody";
-var DialogFooter = React16__namespace.forwardRef(
+var DialogFooter = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1720,7 +1764,7 @@ var sheetPanelVariants = classVarianceAuthority.cva(
     defaultVariants: { side: "bottom" }
   }
 );
-var Sheet = React16__namespace.forwardRef(
+var Sheet = React17__namespace.forwardRef(
   ({
     className,
     side = "bottom",
@@ -1772,7 +1816,7 @@ var Sheet = React16__namespace.forwardRef(
   }
 );
 Sheet.displayName = "Sheet";
-var SheetHandle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetHandle = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1785,7 +1829,7 @@ var SheetHandle = React16__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SheetHandle.displayName = "SheetHandle";
-var SheetHeader = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetHeader = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1794,7 +1838,7 @@ var SheetHeader = React16__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SheetHeader.displayName = "SheetHeader";
-var SheetTitle = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetTitle = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "h2",
   {
     ref,
@@ -1803,7 +1847,7 @@ var SheetTitle = React16__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SheetTitle.displayName = "SheetTitle";
-var SheetDescription = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "p",
   {
     ref,
@@ -1812,7 +1856,7 @@ var SheetDescription = React16__namespace.forwardRef(({ className, ...props }, r
   }
 ));
 SheetDescription.displayName = "SheetDescription";
-var SheetBody = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetBody = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1821,7 +1865,7 @@ var SheetBody = React16__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SheetBody.displayName = "SheetBody";
-var SheetFooter = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetFooter = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -1833,30 +1877,30 @@ var SheetFooter = React16__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SheetFooter.displayName = "SheetFooter";
-var TabsContext = React16__namespace.createContext(null);
+var TabsContext = React17__namespace.createContext(null);
 function useTabsContext(component) {
-  const ctx = React16__namespace.useContext(TabsContext);
+  const ctx = React17__namespace.useContext(TabsContext);
   if (!ctx) {
     throw new Error(`<${component}> must be used within <Tabs>`);
   }
   return ctx;
 }
-var Tabs = React16__namespace.forwardRef(
+var Tabs = React17__namespace.forwardRef(
   ({ className, value, defaultValue, onValueChange, children, ...props }, ref) => {
-    const baseId = React16__namespace.useId();
-    const [internalValue, setInternalValue] = React16__namespace.useState(
+    const baseId = React17__namespace.useId();
+    const [internalValue, setInternalValue] = React17__namespace.useState(
       defaultValue ?? ""
     );
     const isControlled = value !== void 0;
     const activeValue = isControlled ? value : internalValue;
-    const setValue = React16__namespace.useCallback(
+    const setValue = React17__namespace.useCallback(
       (next) => {
         if (!isControlled) setInternalValue(next);
         onValueChange?.(next);
       },
       [isControlled, onValueChange]
     );
-    const ctx = React16__namespace.useMemo(
+    const ctx = React17__namespace.useMemo(
       () => ({ value: activeValue, setValue, baseId }),
       [activeValue, setValue, baseId]
     );
@@ -1878,7 +1922,7 @@ var tabsListVariants = classVarianceAuthority.cva(
     }
   }
 );
-var TabsList = React16__namespace.forwardRef(
+var TabsList = React17__namespace.forwardRef(
   ({ className, fullWidth, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1912,7 +1956,7 @@ var tabsTriggerVariants = classVarianceAuthority.cva(
     }
   }
 );
-var TabsTrigger = React16__namespace.forwardRef(
+var TabsTrigger = React17__namespace.forwardRef(
   ({ className, value, disabled, ...props }, ref) => {
     const { value: activeValue, setValue, baseId } = useTabsContext("TabsTrigger");
     const isActive = activeValue === value;
@@ -1936,7 +1980,7 @@ var TabsTrigger = React16__namespace.forwardRef(
   }
 );
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React16__namespace.forwardRef(
+var TabsContent = React17__namespace.forwardRef(
   ({ className, value, forceMount, children, ...props }, ref) => {
     const { value: activeValue, baseId } = useTabsContext("TabsContent");
     const isActive = activeValue === value;
@@ -1976,7 +2020,7 @@ var tableVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Table = React16__namespace.forwardRef(
+var Table = React17__namespace.forwardRef(
   ({ className, density, containerProps, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -1994,7 +2038,7 @@ var Table = React16__namespace.forwardRef(
   )
 );
 Table.displayName = "Table";
-var TableHeader = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableHeader = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "thead",
   {
     ref,
@@ -2003,7 +2047,7 @@ var TableHeader = React16__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 TableHeader.displayName = "TableHeader";
-var TableBody = React16__namespace.forwardRef(
+var TableBody = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("tbody", { ref, className: cn("", className), ...props })
 );
 TableBody.displayName = "TableBody";
@@ -2021,7 +2065,7 @@ var tableRowVariants = classVarianceAuthority.cva(
     }
   }
 );
-var TableRow = React16__namespace.forwardRef(
+var TableRow = React17__namespace.forwardRef(
   ({ className, interactive, selected, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "tr",
     {
@@ -2034,7 +2078,7 @@ var TableRow = React16__namespace.forwardRef(
   )
 );
 TableRow.displayName = "TableRow";
-var TableHead = React16__namespace.forwardRef(
+var TableHead = React17__namespace.forwardRef(
   ({ className, sort, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "th",
     {
@@ -2055,7 +2099,7 @@ var TableHead = React16__namespace.forwardRef(
   )
 );
 TableHead.displayName = "TableHead";
-var TableCell = React16__namespace.forwardRef(
+var TableCell = React17__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "td",
     {
@@ -2069,7 +2113,7 @@ var TableCell = React16__namespace.forwardRef(
   )
 );
 TableCell.displayName = "TableCell";
-var TableCaption = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableCaption = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "caption",
   {
     ref,
@@ -2135,7 +2179,7 @@ var EllipsisIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
     ]
   }
 );
-var PaginationItem = React16__namespace.forwardRef(
+var PaginationItem = React17__namespace.forwardRef(
   ({ className, active, page, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "button",
@@ -2152,7 +2196,7 @@ var PaginationItem = React16__namespace.forwardRef(
   }
 );
 PaginationItem.displayName = "PaginationItem";
-var PaginationEllipsis = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var PaginationEllipsis = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   "span",
   {
     ref,
@@ -2169,7 +2213,7 @@ var PaginationEllipsis = React16__namespace.forwardRef(({ className, ...props },
   }
 ));
 PaginationEllipsis.displayName = "PaginationEllipsis";
-var PaginationPrevious = React16__namespace.forwardRef(({ className, disabled, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var PaginationPrevious = React17__namespace.forwardRef(({ className, disabled, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "button",
   {
     ref,
@@ -2182,7 +2226,7 @@ var PaginationPrevious = React16__namespace.forwardRef(({ className, disabled, .
   }
 ));
 PaginationPrevious.displayName = "PaginationPrevious";
-var PaginationNext = React16__namespace.forwardRef(
+var PaginationNext = React17__namespace.forwardRef(
   ({ className, disabled, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "button",
     {
@@ -2222,7 +2266,7 @@ function buildPageRange(current, total, siblingCount = 1) {
   }
   return range;
 }
-var Pagination = React16__namespace.forwardRef(
+var Pagination = React17__namespace.forwardRef(
   ({
     className,
     totalPages,
@@ -2310,7 +2354,7 @@ var segmentItemVariants = classVarianceAuthority.cva(
     }
   }
 );
-var SegmentedControl = React16__namespace.forwardRef(
+var SegmentedControl = React17__namespace.forwardRef(
   ({
     className,
     items,
@@ -2323,7 +2367,7 @@ var SegmentedControl = React16__namespace.forwardRef(
     ...props
   }, ref) => {
     const isControlled = value !== void 0;
-    const [internalValue, setInternalValue] = React16__namespace.useState(
+    const [internalValue, setInternalValue] = React17__namespace.useState(
       defaultValue ?? items[0]?.value ?? ""
     );
     const currentValue = isControlled ? value : internalValue;
@@ -2454,7 +2498,7 @@ function CloseIcon2(props) {
     }
   );
 }
-var Toast = React16__namespace.forwardRef(
+var Toast = React17__namespace.forwardRef(
   ({
     className,
     variant,
@@ -2647,7 +2691,7 @@ var SearchIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(IconBase, { ...props
   /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m20 20-3.4-3.4" })
 ] });
 var XIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(IconBase, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18M6 6l12 12" }) });
-var AccordionItem = React16__namespace.forwardRef(
+var AccordionItem = React17__namespace.forwardRef(
   ({ className, title, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
     "details",
     {
@@ -2674,7 +2718,7 @@ var AccordionItem = React16__namespace.forwardRef(
   )
 );
 AccordionItem.displayName = "AccordionItem";
-var Accordion = React16__namespace.forwardRef(
+var Accordion = React17__namespace.forwardRef(
   ({ className, items, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -2697,7 +2741,7 @@ var Accordion = React16__namespace.forwardRef(
   )
 );
 Accordion.displayName = "Accordion";
-var KpiRow = React16__namespace.forwardRef(
+var KpiRow = React17__namespace.forwardRef(
   ({ items, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex w-[360px] gap-2", className), ...props, children: items.map((k) => /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -2720,7 +2764,7 @@ var KpiRow = React16__namespace.forwardRef(
   )) })
 );
 KpiRow.displayName = "KpiRow";
-var ProgressList = React16__namespace.forwardRef(
+var ProgressList = React17__namespace.forwardRef(
   ({ items, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -2750,7 +2794,7 @@ var ProgressList = React16__namespace.forwardRef(
   )
 );
 ProgressList.displayName = "ProgressList";
-var Ring = React16__namespace.forwardRef(
+var Ring = React17__namespace.forwardRef(
   ({ pct, size = 84, label, className, style, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -2792,7 +2836,7 @@ var Ring = React16__namespace.forwardRef(
   )
 );
 Ring.displayName = "Ring";
-var StackBar = React16__namespace.forwardRef(
+var StackBar = React17__namespace.forwardRef(
   ({ segments, showLegend = true, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("w-[360px]", className), ...props, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-6 gap-0.5", children: segments.map((s, i) => /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -2838,7 +2882,7 @@ var BAR_BY_STATE = {
   unreached: "bg-brand-subtle",
   pending: "bg-surface-sunken"
 };
-var WorkHoursBar = React16__namespace.forwardRef(
+var WorkHoursBar = React17__namespace.forwardRef(
   ({ data, max = 12, height = 120, caption, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className, ...props, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-end gap-3", children: data.map((d) => {
       const barH = d.state === "pending" ? 4 : d.hours / max * height;
@@ -2858,7 +2902,7 @@ var WorkHoursBar = React16__namespace.forwardRef(
   ] })
 );
 WorkHoursBar.displayName = "WorkHoursBar";
-var Kbd = React16__namespace.forwardRef(
+var Kbd = React17__namespace.forwardRef(
   ({ active, className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "kbd",
     {
@@ -2874,7 +2918,7 @@ var Kbd = React16__namespace.forwardRef(
   )
 );
 Kbd.displayName = "Kbd";
-var CommandPalette = React16__namespace.forwardRef(
+var CommandPalette = React17__namespace.forwardRef(
   ({
     groups,
     onSelect,
@@ -2932,7 +2976,7 @@ var CommandPalette = React16__namespace.forwardRef(
   }
 );
 CommandPalette.displayName = "CommandPalette";
-var AvatarWithPresence = React16__namespace.forwardRef(
+var AvatarWithPresence = React17__namespace.forwardRef(
   ({
     name,
     status = "online",
@@ -2963,7 +3007,7 @@ var AvatarWithPresence = React16__namespace.forwardRef(
   ] })
 );
 AvatarWithPresence.displayName = "AvatarWithPresence";
-var SidebarSection = React16__namespace.forwardRef(({ title, addable, onAdd, addLabel, className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className, ...props, children: [
+var SidebarSection = React17__namespace.forwardRef(({ title, addable, onAdd, addLabel, className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className, ...props, children: [
   /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 px-2 pb-1.5 pt-2.5 text-xs font-semibold text-text-subtle", children: [
     title,
     addable && /* @__PURE__ */ jsxRuntime.jsx(
@@ -2982,7 +3026,7 @@ var SidebarSection = React16__namespace.forwardRef(({ title, addable, onAdd, add
   children
 ] }));
 SidebarSection.displayName = "SidebarSection";
-var SidebarChannel = React16__namespace.forwardRef(({ name, icon, locked, active, badge, className, ...props }, ref) => {
+var SidebarChannel = React17__namespace.forwardRef(({ name, icon, locked, active, badge, className, ...props }, ref) => {
   const resolvedIcon = icon ?? (locked ? /* @__PURE__ */ jsxRuntime.jsx(LockIcon, { size: 17 }) : /* @__PURE__ */ jsxRuntime.jsx(HashIcon, { size: 17 }));
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
@@ -3014,7 +3058,7 @@ var SidebarChannel = React16__namespace.forwardRef(({ name, icon, locked, active
   );
 });
 SidebarChannel.displayName = "SidebarChannel";
-var SidebarDm = React16__namespace.forwardRef(
+var SidebarDm = React17__namespace.forwardRef(
   ({ name, status = "online", color, avatarSrc, pinned, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
     "button",
     {
@@ -3063,7 +3107,7 @@ var sidebarContainerVariants = classVarianceAuthority.cva(
     defaultVariants: { variant: "panel" }
   }
 );
-var SidebarPanel = React16__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SidebarPanel = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -3072,7 +3116,7 @@ var SidebarPanel = React16__namespace.forwardRef(({ className, ...props }, ref)
   }
 ));
 SidebarPanel.displayName = "SidebarPanel";
-var Sidebar = React16__namespace.forwardRef(
+var Sidebar = React17__namespace.forwardRef(
   ({ sections, variant = "panel", className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "nav",
     {
@@ -3101,7 +3145,7 @@ var Sidebar = React16__namespace.forwardRef(
   )
 );
 Sidebar.displayName = "Sidebar";
-var List = React16__namespace.forwardRef(
+var List = React17__namespace.forwardRef(
   ({ className, bordered = true, divided = true, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "ul",
@@ -3119,7 +3163,7 @@ var List = React16__namespace.forwardRef(
   }
 );
 List.displayName = "List";
-var ListItem = React16__namespace.forwardRef(
+var ListItem = React17__namespace.forwardRef(
   ({ className, leading, title, description, trailing, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "li",
@@ -3140,7 +3184,7 @@ var ListItem = React16__namespace.forwardRef(
   }
 );
 ListItem.displayName = "ListItem";
-var SuccessCheck = React16__namespace.forwardRef(
+var SuccessCheck = React17__namespace.forwardRef(
   ({ size = 22, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
@@ -3167,7 +3211,7 @@ var separatorVariants = classVarianceAuthority.cva("shrink-0 border-border-defau
     orientation: "horizontal"
   }
 });
-var Separator = React16__namespace.forwardRef(
+var Separator = React17__namespace.forwardRef(
   ({ className, orientation = "horizontal", label, decorative = false, ...props }, ref) => {
     const resolvedOrientation = orientation === "vertical" ? "vertical" : "horizontal";
     const ariaOrientation = label != null ? "horizontal" : resolvedOrientation;
@@ -3259,7 +3303,7 @@ var popoverContentVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Popover = React16__namespace.forwardRef(
+var Popover = React17__namespace.forwardRef(
   ({
     className,
     content,
@@ -3271,20 +3315,20 @@ var Popover = React16__namespace.forwardRef(
     onOpenChange,
     ...props
   }, ref) => {
-    const [uncontrolledOpen, setUncontrolledOpen] = React16__namespace.useState(defaultOpen);
+    const [uncontrolledOpen, setUncontrolledOpen] = React17__namespace.useState(defaultOpen);
     const isControlled = openProp !== void 0;
     const open = isControlled ? openProp : uncontrolledOpen;
-    const innerRef = React16__namespace.useRef(null);
-    React16__namespace.useImperativeHandle(ref, () => innerRef.current, []);
-    const contentId = React16__namespace.useId();
-    const setOpen = React16__namespace.useCallback(
+    const innerRef = React17__namespace.useRef(null);
+    React17__namespace.useImperativeHandle(ref, () => innerRef.current, []);
+    const contentId = React17__namespace.useId();
+    const setOpen = React17__namespace.useCallback(
       (next) => {
         if (!isControlled) setUncontrolledOpen(next);
         onOpenChange?.(next);
       },
       [isControlled, onOpenChange]
     );
-    React16__namespace.useEffect(() => {
+    React17__namespace.useEffect(() => {
       if (!open) return;
       const onPointerDown = (event) => {
         const node = innerRef.current;
@@ -3347,7 +3391,7 @@ var fieldVariants = classVarianceAuthority.cva("flex gap-1.5", {
     orientation: "vertical"
   }
 });
-var Field = React16__namespace.forwardRef(
+var Field = React17__namespace.forwardRef(
   ({
     className,
     orientation = "vertical",
@@ -3360,11 +3404,11 @@ var Field = React16__namespace.forwardRef(
     children,
     ...props
   }, ref) => {
-    const reactId = React16__namespace.useId();
+    const reactId = React17__namespace.useId();
     const controlId = htmlFor ?? reactId;
     const isHorizontal = orientation === "horizontal";
     const messageId = error ? `${controlId}-error` : hint ? `${controlId}-hint` : void 0;
-    const control = React16__namespace.isValidElement(children) ? React16__namespace.cloneElement(children, {
+    const control = React17__namespace.isValidElement(children) ? React17__namespace.cloneElement(children, {
       id: children.props.id ?? controlId,
       "aria-invalid": error ? true : children.props["aria-invalid"],
       "aria-describedby": [children.props["aria-describedby"], messageId].filter(Boolean).join(" ") || void 0
@@ -3424,7 +3468,7 @@ var Field = React16__namespace.forwardRef(
 );
 Field.displayName = "Field";
 var accessoryButtonClass = "inline-flex size-6 shrink-0 items-center justify-center rounded text-text-subtle transition-colors hover:bg-surface-hover hover:text-text-default active:bg-surface-pressed focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-border disabled:pointer-events-none disabled:text-text-disabled";
-var SearchField = React16__namespace.forwardRef(
+var SearchField = React17__namespace.forwardRef(
   ({
     className,
     value,
@@ -3440,12 +3484,12 @@ var SearchField = React16__namespace.forwardRef(
     ...props
   }, ref) => {
     const isControlled = value !== void 0;
-    const [internalValue, setInternalValue] = React16__namespace.useState(
+    const [internalValue, setInternalValue] = React17__namespace.useState(
       defaultValue ?? ""
     );
     const currentValue = isControlled ? value : internalValue;
-    const innerRef = React16__namespace.useRef(null);
-    React16__namespace.useImperativeHandle(ref, () => innerRef.current);
+    const innerRef = React17__namespace.useRef(null);
+    React17__namespace.useImperativeHandle(ref, () => innerRef.current);
     const commit = (next) => {
       if (!isControlled) setInternalValue(next);
       onValueChange?.(next);
@@ -3553,7 +3597,7 @@ var bannerVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Banner = React16__namespace.forwardRef(
+var Banner = React17__namespace.forwardRef(
   ({
     className,
     variant,
@@ -3659,6 +3703,7 @@ exports.Progress = Progress;
 exports.ProgressList = ProgressList;
 exports.Radio = Radio;
 exports.RadioGroup = RadioGroup;
+exports.ReactionPill = ReactionPill;
 exports.Ring = Ring;
 exports.ScrollArea = ScrollArea;
 exports.ScrollBar = ScrollBar;
@@ -3717,6 +3762,7 @@ exports.popoverContentVariants = popoverContentVariants;
 exports.progressFillVariants = progressFillVariants;
 exports.progressTrackVariants = progressTrackVariants;
 exports.radioVariants = radioVariants;
+exports.reactionPillVariants = reactionPillVariants;
 exports.segmentContainerVariants = segmentContainerVariants;
 exports.segmentItemVariants = segmentItemVariants;
 exports.selectTriggerVariants = selectTriggerVariants;