@justanarthur/modo-ui 0.1.0 → 0.2.0

package/dist/shared/{components-gjfrycb5.js → components-yh3kwdhr.js}

@@ -1,44 +1,41 @@
 import {
-  Tooltip
-} from "./components-gndm6am4.js";
+  cn2
+} from "./components-ezxhrmer.js";
 import {
-  SizeProvider
-} from "./components-vb033rns.js";
-import {
-  Button
-} from "./components-5pkcfprd.js";
+  FluidHoverHighlight2
+} from "./components-kvr7f9hy.js";
 import {
   useIcon
-} from "./components-m5br529r.js";
+} from "./components-zrkzcayz.js";
 import {
-  SurfaceProvider,
-  surfaceClasses
-} from "./components-csxz9f52.js";
+  useShape
+} from "./components-cv16mryv.js";
 import {
-  FluidHoverHighlight
-} from "./components-r22vtgqc.js";
+  useSize2
+} from "./components-0sn7ypjw.js";
 import {
-  useFluidHover,
-  useRegisterFluidHoverItem
-} from "./components-e46kf6cp.js";
-import {
-  useShape
-} from "./components-7zp99w5d.js";
+  surfaceClasses2,
+  SurfaceProvider2
+} from "./components-zx6b6yby.js";
 import {
   useControllableState
-} from "./components-dg0w8g5p.js";
+} from "./components-n7mjr357.js";
+import {
+  useFluidHover2,
+  useRegisterFluidHoverItem2
+} from "./components-59efxjd9.js";
 import {
-  spring
-} from "./components-vc1k7yv2.js";
+  SizeProvider2
+} from "./components-jjw69c4c.js";
 import {
-  useSize
-} from "./components-x3rz4cyn.js";
+  Button2
+} from "./components-b2wyq2cq.js";
 import {
-  cn
-} from "./components-0f0as45n.js";
+  Tooltip2
+} from "./components-ng72k97e.js";
 import {
-  __require
-} from "./components-kpbcms10.js";
+  spring2
+} from "./components-1v7rxytx.js";
 
 // components/inputs/input-message/index.tsx
 import { AnimatePresence, motion, Reorder, useReducedMotion } from "motion/react";
@@ -82,7 +79,7 @@ async function renderPdfFirstPage(file, targetWidth) {
   await page.render({ canvas, viewport }).promise;
   return canvas.toDataURL("image/png");
 }
-function FileThumbnail({ file, size, className }) {
+function FileThumbnail2({ file, size, className }) {
   const shape = useShape();
   const isImage = file.type.startsWith("image/");
   const isPdf = file.type === "application/pdf";
@@ -119,7 +116,7 @@ function FileThumbnail({ file, size, className }) {
   const previewUrl = imageUrl ?? pdfUrl;
   const isPending = isImage && !imageUrl || isPdf && !pdfUrl && !pdfError;
   return /* @__PURE__ */ jsx("div", {
-    className: cn("relative shrink-0 overflow-hidden bg-accent border border-border", shape.bg, className),
+    className: cn2("relative shrink-0 overflow-hidden bg-accent border border-border", shape.bg, className),
     style: { width: size, height: size },
     children: previewUrl ? /* @__PURE__ */ jsx("img", {
       src: previewUrl,
@@ -196,22 +193,22 @@ function useIsTouch() {
 var DEFAULT_ACCEPT = "image/png,image/jpeg,application/pdf";
 var NO_FILES = [];
 var NO_QUEUE = [];
-var FilePreviewTile = forwardRef(function FilePreviewTile2({ file, onRemove, size }, ref) {
+var FilePreviewTile = forwardRef(function FilePreviewTile({ file, onRemove, size }, ref) {
   const XIcon = useIcon("x");
   return /* @__PURE__ */ jsxs2(motion.div, {
     ref,
     layout: true,
     initial: { opacity: 0, scale: 0.9 },
     animate: { opacity: 1, scale: 1 },
-    exit: { opacity: 0, scale: 0.9, transition: spring.fast.exit },
-    transition: spring.fast,
+    exit: { opacity: 0, scale: 0.9, transition: spring2.fast.exit },
+    transition: spring2.fast,
     className: "relative shrink-0 cursor-default group/tile",
     children: [
-      /* @__PURE__ */ jsx2(FileThumbnail, {
+      /* @__PURE__ */ jsx2(FileThumbnail2, {
         file,
         size
       }),
-      /* @__PURE__ */ jsx2(Tooltip, {
+      /* @__PURE__ */ jsx2(Tooltip2, {
         content: "Remove",
         side: "top",
         children: /* @__PURE__ */ jsx2("button", {
@@ -234,7 +231,7 @@ var FilePreviewTile = forwardRef(function FilePreviewTile2({ file, onRemove, siz
 function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove, onMove }) {
   const XIcon = useIcon("x");
   const ImageIcon = useIcon("image");
-  const compactStep = useSize().variant === "compact";
+  const compactStep = useSize2().variant === "compact";
   const fileCount = item.files.length;
   const label = item.text || `${fileCount} attachment${fileCount === 1 ? "" : "s"}`;
   return /* @__PURE__ */ jsxs2(Reorder.Item, {
@@ -242,8 +239,8 @@ function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove
     layout: true,
     initial: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.97 },
     animate: { opacity: 1, scale: 1 },
-    exit: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.97, transition: spring.fast.exit },
-    transition: spring.fast,
+    exit: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.97, transition: spring2.fast.exit },
+    transition: spring2.fast,
     "aria-label": `Queued message ${index + 1} of ${total}: ${label}`,
     tabIndex: 0,
     onDoubleClick: () => onEdit(item),
@@ -259,7 +256,7 @@ function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove
         onMove(item, e.key === "ArrowUp" ? -1 : 1);
       }
     },
-    className: cn("group/qrow flex items-center gap-2 rounded-lg bg-muted", compactStep ? "h-7 px-2 text-body-compact" : "h-8 px-2.5 text-body", "text-foreground/85 select-none outline-none", "cursor-grab active:cursor-grabbing", "focus-visible:ring-1 focus-visible:ring-focus-ring", "weight-normal"),
+    className: cn2("group/qrow flex items-center gap-2 rounded-lg bg-muted", compactStep ? "h-7 px-2 text-body-compact" : "h-8 px-2.5 text-body", "text-foreground/85 select-none outline-none", "cursor-grab active:cursor-grabbing", "focus-visible:ring-1 focus-visible:ring-focus-ring", "weight-normal"),
     children: [
       fileCount > 0 && /* @__PURE__ */ jsxs2("span", {
         className: "flex shrink-0 items-center gap-0.5 text-muted-foreground",
@@ -277,7 +274,7 @@ function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove
         className: "min-w-0 flex-1 truncate [text-box:trim-both_cap_alphabetic] py-1 -my-1",
         children: label
       }),
-      /* @__PURE__ */ jsx2(Tooltip, {
+      /* @__PURE__ */ jsx2(Tooltip2, {
         content: "Remove",
         side: "top",
         children: /* @__PURE__ */ jsx2("button", {
@@ -288,7 +285,7 @@ function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove
             onRemove(item);
           },
           "aria-label": `Remove queued message: ${label}`,
-          className: cn("shrink-0 flex h-5 w-5 items-center justify-center rounded-full", "text-muted-foreground hover:text-foreground hover:bg-hover", isTouch ? "opacity-100" : "opacity-0 group-hover/qrow:opacity-100 focus-visible:opacity-100", "transition-opacity duration-fast cursor-pointer outline-none", "focus-visible:ring-1 focus-visible:ring-focus-ring"),
+          className: cn2("shrink-0 flex h-5 w-5 items-center justify-center rounded-full", "text-muted-foreground hover:text-foreground hover:bg-hover", isTouch ? "opacity-100" : "opacity-0 group-hover/qrow:opacity-100 focus-visible:opacity-100", "transition-opacity duration-fast cursor-pointer outline-none", "focus-visible:ring-1 focus-visible:ring-focus-ring"),
           children: /* @__PURE__ */ jsx2(XIcon, {
             size: 13,
             strokeWidth: 2.5
@@ -301,16 +298,16 @@ function QueuedRow({ item, index, total, reduceMotion, isTouch, onEdit, onRemove
 function SuggestionRow({ text, index, active, keyHint, optionId, registerItem, onSelect }) {
   const EnterIcon = useIcon("corner-down-left");
   const ArrowDownIcon = useIcon("arrow-down");
-  const compactStep = useSize().variant === "compact";
+  const compactStep = useSize2().variant === "compact";
   const ref = useRef(null);
-  useRegisterFluidHoverItem(registerItem, index, ref);
+  useRegisterFluidHoverItem2(registerItem, index, ref);
   return /* @__PURE__ */ jsxs2("div", {
     ref,
     id: optionId,
     role: "option",
     "aria-selected": active,
     onClick: onSelect,
-    className: cn("relative flex cursor-pointer items-center gap-2", compactStep ? "h-7 px-2 text-subtitle-compact" : "h-8 px-2.5 text-subtitle", "text-muted-foreground transition-colors duration-fast", active && "text-foreground", "weight-normal"),
+    className: cn2("relative flex cursor-pointer items-center gap-2", compactStep ? "h-7 px-2 text-subtitle-compact" : "h-8 px-2.5 text-subtitle", "text-muted-foreground transition-colors duration-fast", active && "text-foreground", "weight-normal"),
     children: [
       /* @__PURE__ */ jsx2("span", {
         className: "min-w-0 flex-1 truncate [text-box:trim-both_cap_alphabetic] py-1 -my-1",
@@ -321,12 +318,12 @@ function SuggestionRow({ text, index, active, keyHint, optionId, registerItem, o
         className: "shrink-0 text-muted-foreground/70 transition-opacity duration-fast"
       }) : /* @__PURE__ */ jsx2(EnterIcon, {
         size: 13,
-        className: cn("shrink-0 transition-opacity duration-fast", active ? "opacity-100" : "opacity-0")
+        className: cn2("shrink-0 transition-opacity duration-fast", active ? "opacity-100" : "opacity-0")
       })
     ]
   });
 }
-var InputMessage = forwardRef(({
+var InputMessage2 = forwardRef(({
   size,
   value: valueProp,
   defaultValue,
@@ -363,7 +360,7 @@ var InputMessage = forwardRef(({
   ...props
 }, ref) => {
   const shape = useShape();
-  const compactStep = useSize(size).variant === "compact";
+  const compactStep = useSize2(size).variant === "compact";
   const ArrowUpIcon = useIcon("arrow-up");
   const reduceMotion = useReducedMotion() ?? false;
   const isTouch = useIsTouch();
@@ -400,7 +397,7 @@ var InputMessage = forwardRef(({
   const [filesRegionRef, filesRegionHeight] = useRegionHeight();
   const [queueRegionRef, queueRegionHeight] = useRegionHeight();
   const [suggestionsRegionRef, suggestionsRegionHeight] = useRegionHeight();
-  const suggestionHover = useFluidHover(suggestionListRef);
+  const suggestionHover = useFluidHover2(suggestionListRef);
   const {
     activeIndex: activeSuggestion,
     setActiveIndex: setActiveSuggestion,
@@ -754,12 +751,12 @@ var InputMessage = forwardRef(({
     onDragOver: handleDragOver,
     onDragLeave: handleDragLeave,
     onDrop: handleDrop,
-    className: cn("flex flex-col gap-1 p-2 transition-[box-shadow,color] duration-fast", surfaceClasses(2, 2), shape.container, clickToFocus && !disabled && "cursor-text", disabled && "opacity-50 pointer-events-none", className),
+    className: cn2("flex flex-col gap-1 p-2 transition-[box-shadow,color] duration-fast", surfaceClasses2(2, 2), shape.container, clickToFocus && !disabled && "cursor-text", disabled && "opacity-50 pointer-events-none", className),
     style: edgeShadow ? { boxShadow: edgeShadow, ...style } : style,
     onMouseEnter: () => setHovered(true),
     onMouseLeave: () => setHovered(false),
     ...props,
-    children: /* @__PURE__ */ jsxs2(SurfaceProvider, {
+    children: /* @__PURE__ */ jsxs2(SurfaceProvider2, {
       value: 2,
       children: [
         supportsFiles && /* @__PURE__ */ jsx2("input", {
@@ -778,7 +775,7 @@ var InputMessage = forwardRef(({
             initial: { height: 0, opacity: 0 },
             animate: { height: filesRegionHeight ?? 0, opacity: 1 },
             exit: { height: 0, opacity: 0 },
-            transition: { ...spring.moderate, bounce: 0 },
+            transition: { ...spring2.moderate, bounce: 0 },
             className: "overflow-hidden",
             children: /* @__PURE__ */ jsx2("div", {
               ref: filesRegionRef,
@@ -801,7 +798,7 @@ var InputMessage = forwardRef(({
             initial: { height: 0, opacity: 0 },
             animate: { height: queueRegionHeight ?? 0, opacity: 1 },
             exit: { height: 0, opacity: 0 },
-            transition: { ...spring.moderate, bounce: 0 },
+            transition: { ...spring2.moderate, bounce: 0 },
             className: "overflow-hidden",
             children: /* @__PURE__ */ jsx2(Reorder.Group, {
               ref: queueRegionRef,
@@ -854,12 +851,12 @@ var InputMessage = forwardRef(({
               "aria-label": textareaProps?.["aria-label"] ?? "Message",
               "aria-describedby": [showGhost ? ghostHintId : null, textareaDescribedBy].filter(Boolean).join(" ") || undefined,
               "aria-activedescendant": activeSuggestion != null ? `${suggestionListId}-${activeSuggestion}` : undefined,
-              className: cn("w-full resize-none rounded-none bg-transparent outline-none", "text-foreground placeholder:text-muted-foreground", compactStep ? "text-subtitle-compact leading-4.5 px-1.5 py-1.5" : "text-subtitle leading-5 px-2 py-2", "weight-normal"),
+              className: cn2("w-full resize-none rounded-none bg-transparent outline-none", "text-foreground placeholder:text-muted-foreground", compactStep ? "text-subtitle-compact leading-4.5 px-1.5 py-1.5" : "text-subtitle leading-5 px-2 py-2", "weight-normal"),
               ...restTextareaProps
             }),
             showGhost && /* @__PURE__ */ jsx2("div", {
               "aria-hidden": "true",
-              className: cn("pointer-events-none absolute inset-0 overflow-hidden text-muted-foreground", compactStep ? "text-subtitle-compact leading-4.5 px-1.5 py-1.5" : "text-subtitle leading-5 px-2 py-2", "weight-normal"),
+              className: cn2("pointer-events-none absolute inset-0 overflow-hidden text-muted-foreground", compactStep ? "text-subtitle-compact leading-4.5 px-1.5 py-1.5" : "text-subtitle leading-5 px-2 py-2", "weight-normal"),
               children: /* @__PURE__ */ jsxs2("span", {
                 className: "flex max-w-full items-center gap-1.5",
                 children: [
@@ -868,7 +865,7 @@ var InputMessage = forwardRef(({
                     children: placeholderSuggestion
                   }),
                   /* @__PURE__ */ jsx2("kbd", {
-                    className: cn("inline-flex shrink-0 -translate-y-px items-center rounded-box border border-border bg-background px-1 font-sans text-muted-foreground", compactStep ? "h-4 text-micro-compact" : "h-[18px] text-micro"),
+                    className: cn2("inline-flex shrink-0 -translate-y-px items-center rounded-box border border-border bg-background px-1 font-sans text-muted-foreground", compactStep ? "h-4 text-micro-compact" : "h-[18px] text-micro"),
                     children: "Tab"
                   })
                 ]
@@ -886,7 +883,7 @@ var InputMessage = forwardRef(({
           ]
         }),
         /* @__PURE__ */ jsxs2("div", {
-          className: cn("flex items-center justify-between", compactStep ? "gap-1.5 [&_button]:h-6 [&_button.w-7]:w-6 [&_button]:text-caption-compact" : "gap-2"),
+          className: cn2("flex items-center justify-between", compactStep ? "gap-1.5 [&_button]:h-6 [&_button.w-7]:w-6 [&_button]:text-caption-compact" : "gap-2"),
           children: [
             /* @__PURE__ */ jsx2("div", {
               className: "flex items-center gap-1.5 min-w-0",
@@ -896,7 +893,7 @@ var InputMessage = forwardRef(({
               className: "flex items-center gap-1.5 shrink-0",
               children: [
                 rightContent,
-                /* @__PURE__ */ jsx2(Button, {
+                /* @__PURE__ */ jsx2(Button2, {
                   type: "button",
                   variant: "primary",
                   size: "icon-sm",
@@ -909,14 +906,14 @@ var InputMessage = forwardRef(({
                     children: /* @__PURE__ */ jsx2(motion.span, {
                       initial: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.6 },
                       animate: { opacity: 1, scale: 1 },
-                      exit: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.6, transition: spring.fast.exit },
-                      transition: spring.fast,
+                      exit: reduceMotion ? { opacity: 0 } : { opacity: 0, scale: 0.6, transition: spring2.fast.exit },
+                      transition: spring2.fast,
                       className: "flex items-center justify-center leading-none",
                       children: buttonMode === "stop" ? /* @__PURE__ */ jsx2("span", {
                         className: "h-3 w-3 rounded-glyph bg-current"
                       }) : /* @__PURE__ */ jsx2(ArrowUpIcon, {
                         size: compactStep ? 15 : 19,
-                        className: cn("block", compactStep ? "!h-[15px] !w-[15px]" : "!h-[19px] !w-[19px]")
+                        className: cn2("block", compactStep ? "!h-[15px] !w-[15px]" : "!h-[19px] !w-[19px]")
                       })
                     }, buttonMode === "stop" ? "stop" : "arrow")
                   })
@@ -931,7 +928,7 @@ var InputMessage = forwardRef(({
             initial: { height: 0, opacity: 0 },
             animate: { height: suggestionsRegionHeight ?? 0, opacity: 1 },
             exit: { height: 0 },
-            transition: { ...spring.moderate, bounce: 0 },
+            transition: { ...spring2.moderate, bounce: 0 },
             className: "-mx-2 -mt-1 overflow-hidden",
             children: /* @__PURE__ */ jsxs2("div", {
               ref: (el) => {
@@ -947,7 +944,7 @@ var InputMessage = forwardRef(({
               onClick: suggestionHandlers.onClick,
               className: "relative mt-2 flex flex-col border-t border-border/60 px-1.5 pt-1.5",
               children: [
-                /* @__PURE__ */ jsx2(FluidHoverHighlight, {
+                /* @__PURE__ */ jsx2(FluidHoverHighlight2, {
                   hover: suggestionHover,
                   className: shape.bg
                 }),
@@ -973,12 +970,12 @@ var InputMessage = forwardRef(({
       ]
     })
   });
-  return size ? /* @__PURE__ */ jsx2(SizeProvider, {
+  return size ? /* @__PURE__ */ jsx2(SizeProvider2, {
     size,
     children: composer
   }) : composer;
 });
-InputMessage.displayName = "InputMessage";
-var input_message_default = InputMessage;
+InputMessage2.displayName = "InputMessage";
+var input_message_default = InputMessage2;
 
-export { FileThumbnail, InputMessage, input_message_default };
+export { FileThumbnail2, InputMessage2, input_message_default };

package/dist/shared/{components-y3cqdrgy.js → components-ytb2tefr.js}

@@ -1,33 +1,33 @@
 import {
-  SelectionBackgrounds,
-  useMergeSplitBlocks,
-  useSelectionRuns
-} from "./components-rc63qsy6.js";
-import {
-  SizeProvider
-} from "./components-vb033rns.js";
-import {
-  FluidHoverHighlight
-} from "./components-r22vtgqc.js";
+  cn2
+} from "./components-ezxhrmer.js";
 import {
-  useFluidHover,
-  useRegisterFluidHoverItem
-} from "./components-e46kf6cp.js";
+  FluidHoverHighlight2
+} from "./components-kvr7f9hy.js";
 import {
   useShape
-} from "./components-7zp99w5d.js";
+} from "./components-cv16mryv.js";
+import {
+  useSize2
+} from "./components-0sn7ypjw.js";
 import {
   useControllableState
-} from "./components-dg0w8g5p.js";
+} from "./components-n7mjr357.js";
+import {
+  useFluidHover2,
+  useRegisterFluidHoverItem2
+} from "./components-59efxjd9.js";
 import {
-  spring
-} from "./components-vc1k7yv2.js";
+  useSelectionRuns,
+  useMergeSplitBlocks,
+  SelectionBackgrounds
+} from "./components-5xc2j8jz.js";
 import {
-  useSize
-} from "./components-x3rz4cyn.js";
+  SizeProvider2
+} from "./components-jjw69c4c.js";
 import {
-  cn
-} from "./components-0f0as45n.js";
+  spring2
+} from "./components-1v7rxytx.js";
 
 // components/inputs/checkbox-group/index.tsx
 import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
@@ -49,7 +49,7 @@ function useCheckboxGroup() {
     throw new Error("useCheckboxGroup must be used within a CheckboxGroup");
   return ctx;
 }
-var CheckboxGroup = forwardRef(({
+var CheckboxGroup2 = forwardRef(({
   children,
   checkedIndices: checkedIndicesProp,
   defaultCheckedIndices,
@@ -72,7 +72,7 @@ var CheckboxGroup = forwardRef(({
       return next;
     });
   }, [setCheckedIndices]);
-  const hover = useFluidHover(containerRef);
+  const hover = useFluidHover2(containerRef);
   const { activeIndex, setActiveIndex, itemRects, handlers, registerItem } = hover;
   const checkedGroups = useSelectionRuns([...checkedIndices]);
   const [focusedIndex, setFocusedIndex] = useState(null);
@@ -125,13 +125,13 @@ var CheckboxGroup = forwardRef(({
         }
       },
       role: "group",
-      className: cn("relative flex flex-col w-72 max-w-full select-none", className),
+      className: cn2("relative flex flex-col w-72 max-w-full select-none", className),
       ...props,
       children: [
         /* @__PURE__ */ jsx(SelectionBackgrounds, {
           blocks
         }),
-        /* @__PURE__ */ jsx(FluidHoverHighlight, {
+        /* @__PURE__ */ jsx(FluidHoverHighlight2, {
           hover,
           className: shape.bg
         }),
@@ -145,10 +145,10 @@ var CheckboxGroup = forwardRef(({
               width: focusRect.width + 4,
               height: focusRect.height + 4
             },
-            exit: { opacity: 0, transition: spring.fast.exit },
+            exit: { opacity: 0, transition: spring2.fast.exit },
             transition: {
-              ...spring.fast,
-              opacity: { duration: spring.fast.duration }
+              ...spring2.fast,
+              opacity: { duration: spring2.fast.duration }
             }
           })
         }),
@@ -156,13 +156,13 @@ var CheckboxGroup = forwardRef(({
       ]
     })
   });
-  return size ? /* @__PURE__ */ jsx(SizeProvider, {
+  return size ? /* @__PURE__ */ jsx(SizeProvider2, {
     size,
     children: group
   }) : group;
 });
-CheckboxGroup.displayName = "CheckboxGroup";
-var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: onToggleProp, className, ...props }, ref) => {
+CheckboxGroup2.displayName = "CheckboxGroup";
+var CheckboxItem2 = forwardRef(({ label, index, checked: checkedProp, onToggle: onToggleProp, className, ...props }, ref) => {
   const internalRef = useRef(null);
   const hasMounted = useRef(false);
   const { registerItem, activeIndex, checkedIndices, setItemChecked } = useCheckboxGroup();
@@ -171,14 +171,14 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
     onToggleProp?.();
     setItemChecked(index, !checked);
   };
-  useRegisterFluidHoverItem(registerItem, index, internalRef);
+  useRegisterFluidHoverItem2(registerItem, index, internalRef);
   useEffect(() => {
     hasMounted.current = true;
   }, []);
   const isActive = activeIndex === index;
   const skipAnimation = !hasMounted.current;
   const shape = useShape();
-  const sizeClasses = useSize();
+  const sizeClasses = useSize2();
   const compact = sizeClasses.variant === "compact";
   return /* @__PURE__ */ jsxs("div", {
     ref: (node) => {
@@ -207,7 +207,7 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
         onToggle();
       }
     },
-    className: cn(`relative z-10 flex ${sizeClasses.control} items-center ${sizeClasses.gap} ${shape.item} ${sizeClasses.px} cursor-pointer outline-none`, className),
+    className: cn2(`relative z-10 flex ${sizeClasses.control} items-center ${sizeClasses.gap} ${shape.item} ${sizeClasses.px} cursor-pointer outline-none`, className),
     ...props,
     children: [
       /* @__PURE__ */ jsxs(CheckboxPrimitive.Root, {
@@ -215,11 +215,11 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
         onCheckedChange: () => onToggle(),
         tabIndex: -1,
         "aria-hidden": true,
-        className: cn("relative shrink-0 appearance-none bg-transparent p-0 border-0 outline-none cursor-pointer", compact ? "w-[14px] h-[14px]" : "w-[16px] h-[16px]"),
+        className: cn2("relative shrink-0 appearance-none bg-transparent p-0 border-0 outline-none cursor-pointer", compact ? "w-[14px] h-[14px]" : "w-[16px] h-[16px]"),
         onClick: (e) => e.stopPropagation(),
         children: [
           /* @__PURE__ */ jsx("div", {
-            className: cn("absolute inset-0 border-solid transition-all duration-fast", compact ? "rounded-sm" : "rounded-box", checked ? "border-[1.5px] border-transparent" : isActive ? "border-[1.5px] border-control" : "border-[1.5px] border-border")
+            className: cn2("absolute inset-0 border-solid transition-all duration-fast", compact ? "rounded-sm" : "rounded-box", checked ? "border-[1.5px] border-transparent" : isActive ? "border-[1.5px] border-control" : "border-[1.5px] border-border")
           }),
           /* @__PURE__ */ jsx(AnimatePresence, {
             children: checked && /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, {
@@ -254,7 +254,7 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
                     initial: { pathLength: skipAnimation ? 1 : 0 },
                     animate: {
                       pathLength: 1,
-                      transition: { duration: spring.fast.duration, ease: "easeOut" }
+                      transition: { duration: spring2.fast.duration, ease: "easeOut" }
                     },
                     exit: {
                       pathLength: 0,
@@ -268,7 +268,7 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
         ]
       }),
       /* @__PURE__ */ jsxs("span", {
-        className: cn("inline-grid", sizeClasses.text),
+        className: cn2("inline-grid", sizeClasses.text),
         children: [
           /* @__PURE__ */ jsx("span", {
             className: "col-start-1 row-start-1 invisible [text-box:trim-both_cap_alphabetic] weight-semibold",
@@ -276,7 +276,7 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
             children: label
           }),
           /* @__PURE__ */ jsx("span", {
-            className: cn("col-start-1 row-start-1 transition-[color,font-variation-settings] duration-fast [text-box:trim-both_cap_alphabetic]", checked || isActive ? "text-foreground" : "text-muted-foreground", checked ? "weight-semibold" : "weight-normal"),
+            className: cn2("col-start-1 row-start-1 transition-[color,font-variation-settings] duration-fast [text-box:trim-both_cap_alphabetic]", checked || isActive ? "text-foreground" : "text-muted-foreground", checked ? "weight-semibold" : "weight-normal"),
             children: label
           })
         ]
@@ -284,8 +284,8 @@ var CheckboxItem = forwardRef(({ label, index, checked: checkedProp, onToggle: o
     ]
   });
 });
-CheckboxItem.displayName = "CheckboxItem";
-Object.assign(CheckboxGroup, { Item: CheckboxItem });
-var checkbox_group_default = CheckboxGroup;
+CheckboxItem2.displayName = "CheckboxItem";
+Object.assign(CheckboxGroup2, { Item: CheckboxItem2 });
+var checkbox_group_default = CheckboxGroup2;
 
-export { CheckboxGroup, CheckboxItem, checkbox_group_default };
+export { CheckboxGroup2, CheckboxItem2, checkbox_group_default };