@vuer-ai/vuer-uikit 0.0.120 → 0.1.0

package/dist/{chunk-7H7U2X45.cjs → chunk-O3DFVRON.cjs}

@@ -1,9 +1,10 @@
 'use strict';
 
 var chunkG2ZYONQO_cjs = require('./chunk-G2ZYONQO.cjs');
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
+var clamp = (value, min, max) => Math.min(Math.max(value, min), max);
 function TimelineProcessBar({
   item,
   isHovered,
@@ -21,7 +22,7 @@ function TimelineProcessBar({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: chunkCRX2ZCM2_cjs.cn("relative h-[32px] w-full", isHovered && "bg-bg-secondary"),
+      className: chunk6LTCLQH3_cjs.cn("relative h-[32px] w-full", isHovered && "bg-bg-secondary"),
       onMouseEnter,
       onMouseLeave,
       children: [
@@ -37,7 +38,7 @@ function TimelineProcessBar({
               /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
-                  className: chunkCRX2ZCM2_cjs.cn(
+                  className: chunk6LTCLQH3_cjs.cn(
                     "absolute top-1/2 left-0 h-2 w-px -translate-y-1/2",
                     chunkG2ZYONQO_cjs.colorClasses[item.color]
                   )
@@ -46,7 +47,7 @@ function TimelineProcessBar({
               /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
-                  className: chunkCRX2ZCM2_cjs.cn(
+                  className: chunk6LTCLQH3_cjs.cn(
                     "absolute top-1/2 w-full -translate-y-1/2 border-t",
                     chunkG2ZYONQO_cjs.borderColorClasses[item.color]
                   )
@@ -55,7 +56,7 @@ function TimelineProcessBar({
               /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
-                  className: chunkCRX2ZCM2_cjs.cn(
+                  className: chunk6LTCLQH3_cjs.cn(
                     "absolute top-1/2 right-0 h-2 w-px -translate-y-1/2",
                     chunkG2ZYONQO_cjs.colorClasses[item.color]
                   )
@@ -67,7 +68,7 @@ function TimelineProcessBar({
         item.startTime !== void 0 && item.duration !== void 0 && !isHaltedStep && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: chunkCRX2ZCM2_cjs.cn(
+            className: chunk6LTCLQH3_cjs.cn(
               "rounded-uk-xs absolute top-1/2 flex h-5 -translate-y-1/2 items-center justify-center overflow-hidden",
               item.color && chunkG2ZYONQO_cjs.colorClasses[item.color],
               item.hasStripes && "bg-[repeating-linear-gradient(-45deg,transparent,transparent_4px,rgba(0,0,0,0.1)_4px,rgba(0,0,0,0.1)_8px)]",
@@ -107,7 +108,7 @@ function TimelineProcessBar({
               children: /* @__PURE__ */ jsxRuntime.jsx(
                 "span",
                 {
-                  className: chunkCRX2ZCM2_cjs.cn(
+                  className: chunk6LTCLQH3_cjs.cn(
                     "text-uk-sm font-medium whitespace-nowrap",
                     item.color === "gray-light" || item.color === "gray-medium" ? "text-slate-600 dark:text-slate-300" : "text-text-withbg"
                   ),
@@ -120,7 +121,7 @@ function TimelineProcessBar({
         item.startTime !== void 0 && item.duration !== void 0 && !isHaltedStep && item.color && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: chunkCRX2ZCM2_cjs.cn(
+            className: chunk6LTCLQH3_cjs.cn(
               "bg-bg-primary absolute top-1/2 z-10 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full border-2",
               chunkG2ZYONQO_cjs.borderColorClasses[item.color]
             ),
@@ -150,16 +151,19 @@ function TimelineProcessBar({
           if (visibleEnd <= visibleStart) return null;
           const visibleDuration = visibleEnd - visibleStart;
           const visibleWidthPercent = visibleDuration / viewWindow * 100;
-          if (visibleWidthPercent < 8) return null;
-          return /* @__PURE__ */ jsxRuntime.jsx(
+          return /* @__PURE__ */ jsxRuntime.jsxs(
             "div",
             {
-              className: "pointer-events-none absolute top-1/2 flex -translate-y-1/2 items-center justify-center",
+              className: "pointer-events-none absolute top-1/2 flex -translate-y-1/2 items-center justify-center overflow-hidden",
               style: {
                 left: `${timeToPercent(visibleStart)}%`,
-                width: `${visibleWidthPercent}%`
+                width: `${visibleWidthPercent}%`,
+                zoom: clamp(visibleWidthPercent, 6, 12) / 12
               },
-              children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-secondary text-xs italic", children: "Halted" })
+              children: [
+                visibleWidthPercent > 7 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-full bg-orange-500 px-2 py-0.5 text-xs text-white", children: "Halted" }),
+                visibleWidthPercent < 7 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-3 w-3 rounded-full bg-orange-500" })
+              ]
             }
           );
         })()

package/dist/chunk-O57DAVOQ.mjs

@@ -0,0 +1 @@
+

package/dist/{chunk-S37MJNNP.cjs → chunk-OCADGDGL.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var lucideReact = require('lucide-react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -30,7 +30,7 @@ function CursorOverlay({
     showReadout && /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
-        className: chunkCRX2ZCM2_cjs.cn(
+        className: chunk6LTCLQH3_cjs.cn(
           "absolute top-1",
           "flex items-center justify-center",
           variant === "active" ? "pointer-events-none" : "pointer-events-auto",

package/dist/{chunk-ZSAPBZ36.mjs → chunk-OW653F7T.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import { jsx } from 'react/jsx-runtime';
 
 function LeftWedge({ item, classes, viewStart }) {

package/dist/{chunk-GRXUYMZJ.cjs → chunk-OX5FXH6W.cjs}

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var lucideReact = require('lucide-react');
 var jsxRuntime = require('react/jsx-runtime');
 
-var PACKAGE_VERSION = "0.0.119" ;
+var PACKAGE_VERSION = "0.1.0" ;
 var PACKAGE_NAME = "@vuer-ai/vuer-uikit" ;
-var GIT_HASH = "1f21475" ;
+var GIT_HASH = "75def5e" ;
 function PackageBadge({
   className,
   packageName,
@@ -39,7 +39,7 @@ function PackageBadge({
             "a",
             {
               href: linkable && npmUrl ? npmUrl : void 0,
-              className: chunkCRX2ZCM2_cjs.cn(
+              className: chunk6LTCLQH3_cjs.cn(
                 "pl-xs pr-sm py-xxxs rounded-r-uk-xs",
                 "bg-alt-primary",
                 "text-text-secondary",

package/dist/{chunk-GQYUSBSO.mjs → chunk-P3FBRYWH.mjs}

@@ -1,20 +1,13 @@
-import { cn } from './chunk-T66ETI7E.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
 import { jsx } from 'react/jsx-runtime';
 
-function Progress({
-  className,
-  value,
-  ...props
-}) {
+function Progress({ className, value, ...props }) {
   return /* @__PURE__ */ jsx(
     ProgressPrimitive.Root,
     {
       "data-slot": "progress",
-      className: cn(
-        "bg-bg-secondary relative h-2 w-full overflow-hidden rounded-uk-xl",
-        className
-      ),
+      className: cn("bg-bg-secondary rounded-uk-xl relative h-2 w-full overflow-hidden", className),
       ...props,
       children: /* @__PURE__ */ jsx(
         ProgressPrimitive.Indicator,

package/dist/{chunk-P3YSHGT5.mjs → chunk-P55DAW6H.mjs}

@@ -1,4 +1,4 @@
-import { InputRoot, InputSlot } from './chunk-SMXN2KOV.mjs';
+import { InputRoot, InputSlot } from './chunk-HGTL7DFT.mjs';
 import { forwardRef } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-JOOURIX7.cjs → chunk-P6E4WLMD.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var CheckboxPrimitive = require('@radix-ui/react-checkbox');
 var lucideReact = require('lucide-react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -29,7 +29,7 @@ var Checkbox = ({ className, checkall, ...props }) => /* @__PURE__ */ jsxRuntime
   CheckboxPrimitive__namespace.Root,
   {
     "data-slot": "checkbox",
-    className: chunkCRX2ZCM2_cjs.cn(
+    className: chunk6LTCLQH3_cjs.cn(
       "group",
       "relative",
       "w-[16px]",
@@ -59,7 +59,7 @@ var Checkbox = ({ className, checkall, ...props }) => /* @__PURE__ */ jsxRuntime
       CheckboxPrimitive__namespace.Indicator,
       {
         "data-slot": "checkbox-indicator",
-        className: chunkCRX2ZCM2_cjs.cn(
+        className: chunk6LTCLQH3_cjs.cn(
           "absolute",
           "inset-0",
           "m-auto",
@@ -73,7 +73,7 @@ var Checkbox = ({ className, checkall, ...props }) => /* @__PURE__ */ jsxRuntime
       CheckboxPrimitive__namespace.Indicator,
       {
         "data-slot": "checkbox-indicator",
-        className: chunkCRX2ZCM2_cjs.cn(
+        className: chunk6LTCLQH3_cjs.cn(
           "flex",
           "items-center",
           "justify-center",

package/dist/{chunk-WDSOII5A.cjs → chunk-P7J7XHDE.cjs}

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkASZIBFA6_cjs = require('./chunk-ASZIBFA6.cjs');
+var chunkUZTOUPJ7_cjs = require('./chunk-UZTOUPJ7.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
 var DegInput = react.forwardRef(function DegInput2({ value = 0, onChange, ...props }, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkASZIBFA6_cjs.InputNumbers,
+    chunkUZTOUPJ7_cjs.InputNumbers,
     {
       ref,
       value: [value],

package/dist/chunk-PHRZ5JE6.mjs

@@ -0,0 +1 @@
+

package/dist/{chunk-F3HOBNGR.cjs → chunk-PMG3NZF5.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var reactComposeRefs = require('@radix-ui/react-compose-refs');
 var classVarianceAuthority = require('class-variance-authority');
 var react = require('react');
@@ -52,7 +52,7 @@ var InputRoot = react.forwardRef(function InputRoot2({ style, className, side, c
     {
       style,
       "data-input": true,
-      className: chunkCRX2ZCM2_cjs.cn(inputRootVariants({ size, state: disabled ? "disabled" : state }), className),
+      className: chunk6LTCLQH3_cjs.cn(inputRootVariants({ size, state: disabled ? "disabled" : state }), className),
       onClick: (event) => {
         const target = event.target;
         if (target.closest("input, button, a")) return;
@@ -82,7 +82,7 @@ var InputRoot = react.forwardRef(function InputRoot2({ style, className, side, c
             disabled,
             name: type ?? "text",
             ref: reactComposeRefs.composeRefs(inputRef, ref),
-            className: chunkCRX2ZCM2_cjs.cn(
+            className: chunk6LTCLQH3_cjs.cn(
               [
                 "w-full",
                 "h-full",
@@ -110,7 +110,7 @@ var InputSlot = react.forwardRef(function({ className, children, side = "left",
       "data-side": side,
       ...props,
       ref,
-      className: chunkCRX2ZCM2_cjs.cn(
+      className: chunk6LTCLQH3_cjs.cn(
         [
           "input-slot",
           "cursor-text",

package/dist/chunk-PMYOKSO3.mjs

@@ -0,0 +1,30 @@
+import { Button } from './chunk-5JYH7TXY.mjs';
+import { IconRenderer } from './chunk-6YMDD5CU.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var DialButton = ({
+  name,
+  label,
+  icon,
+  onClick,
+  variant = "secondary",
+  disabled = false
+}) => {
+  const displayLabel = label || name.charAt(0).toUpperCase() + name.slice(1);
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant,
+      size: "sm",
+      onClick,
+      disabled,
+      className: "w-full justify-center gap-2",
+      children: [
+        /* @__PURE__ */ jsx(IconRenderer, { iconName: icon, size: 14 }),
+        displayLabel
+      ]
+    }
+  );
+};
+
+export { DialButton };

package/dist/chunk-PTUZYCOY.mjs

@@ -0,0 +1,314 @@
+import { CursorContext } from './chunk-3FR3WKI4.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
+import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import { createPortal } from 'react-dom';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var SPRING_CONFIG = {
+  stiffness: 0.15,
+  // How snappy (higher = faster)
+  damping: 0.75};
+var SQUISH_CONFIG = {
+  maxSquish: 0.15,
+  // Maximum squish amount (0.15 = 15% squish)
+  velocityScale: 8e-3,
+  // How much velocity affects squish
+  recovery: 0.15
+  // How fast squish recovers
+};
+var CursorProvider = ({
+  children,
+  maxOffsetX = 5,
+  maxOffsetY = 20,
+  cursorSize = 20,
+  boundaryThreshold = 4,
+  outerThreshold = 8,
+  cursorClassName,
+  className,
+  as: Component = "div",
+  ...props
+}) => {
+  const [isClient, setIsClient] = useState(false);
+  const [isMouseInside, setIsMouseInside] = useState(false);
+  const cursorRef = useRef(null);
+  const cursorInnerRef = useRef(null);
+  const mousePositionRef = useRef({ x: 0, y: 0 });
+  const prevMousePositionRef = useRef({ x: 0, y: 0 });
+  const hoveredElementIdRef = useRef(null);
+  const hoveredElementRef = useRef(null);
+  const elementDimensionsRef = useRef({ width: 0, height: 0, x: 0, y: 0, right: 0, bottom: 0 });
+  const elementBorderRadiusRef = useRef("9999px");
+  const animationFrameRef = useRef(null);
+  const springRef = useRef({
+    x: 0,
+    y: 0,
+    width: cursorSize,
+    height: cursorSize,
+    velocityX: 0,
+    velocityY: 0,
+    velocityW: 0,
+    velocityH: 0,
+    scaleX: 1,
+    scaleY: 1
+  });
+  const targetRef = useRef({
+    x: 0,
+    y: 0,
+    width: cursorSize,
+    height: cursorSize
+  });
+  const [hoveredElementId, setHoveredElementId] = useState(null);
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+  const updateTarget = useCallback(() => {
+    const mouse = mousePositionRef.current;
+    const dims = elementDimensionsRef.current;
+    const isHovering = hoveredElementIdRef.current !== null;
+    if (isHovering && dims.width > 0) {
+      const distFromLeft = mouse.x - dims.x;
+      const distFromRight = dims.x + dims.width - mouse.x;
+      const distFromTop = mouse.y - dims.y;
+      const distFromBottom = dims.y + dims.height - mouse.y;
+      const totalThreshold = boundaryThreshold + outerThreshold;
+      let offsetX = 0;
+      let offsetY = 0;
+      if (distFromLeft < boundaryThreshold) {
+        const progress = Math.min(1, (boundaryThreshold - distFromLeft) / totalThreshold);
+        offsetX = -maxOffsetX * progress;
+      } else if (distFromRight < boundaryThreshold) {
+        const progress = Math.min(1, (boundaryThreshold - distFromRight) / totalThreshold);
+        offsetX = maxOffsetX * progress;
+      }
+      if (distFromTop < boundaryThreshold) {
+        const progress = Math.min(1, (boundaryThreshold - distFromTop) / totalThreshold);
+        offsetY = -maxOffsetY * progress;
+      } else if (distFromBottom < boundaryThreshold) {
+        const progress = Math.min(1, (boundaryThreshold - distFromBottom) / totalThreshold);
+        offsetY = maxOffsetY * progress;
+      }
+      targetRef.current = {
+        x: dims.x + offsetX,
+        y: dims.y + offsetY,
+        width: dims.width,
+        height: dims.height
+      };
+    } else {
+      targetRef.current = {
+        x: mouse.x - cursorSize / 2,
+        y: mouse.y - cursorSize / 2,
+        width: cursorSize,
+        height: cursorSize
+      };
+    }
+  }, [cursorSize, maxOffsetX, maxOffsetY, boundaryThreshold, outerThreshold]);
+  const animate = useCallback(() => {
+    const cursor = cursorRef.current;
+    const cursorInner = cursorInnerRef.current;
+    if (!cursor || !cursorInner) {
+      animationFrameRef.current = requestAnimationFrame(animate);
+      return;
+    }
+    const spring = springRef.current;
+    const target = targetRef.current;
+    const { stiffness, damping } = SPRING_CONFIG;
+    const mouse = mousePositionRef.current;
+    const prevMouse = prevMousePositionRef.current;
+    const mouseVelocityX = mouse.x - prevMouse.x;
+    const mouseVelocityY = mouse.y - prevMouse.y;
+    prevMousePositionRef.current = { ...mouse };
+    const forceX = (target.x - spring.x) * stiffness;
+    const forceY = (target.y - spring.y) * stiffness;
+    spring.velocityX = (spring.velocityX + forceX) * damping;
+    spring.velocityY = (spring.velocityY + forceY) * damping;
+    spring.x += spring.velocityX;
+    spring.y += spring.velocityY;
+    const forceW = (target.width - spring.width) * stiffness;
+    const forceH = (target.height - spring.height) * stiffness;
+    spring.velocityW = (spring.velocityW + forceW) * damping;
+    spring.velocityH = (spring.velocityH + forceH) * damping;
+    spring.width += spring.velocityW;
+    spring.height += spring.velocityH;
+    const targetScaleX = 1 - Math.abs(mouseVelocityY) * SQUISH_CONFIG.velocityScale;
+    const targetScaleY = 1 - Math.abs(mouseVelocityX) * SQUISH_CONFIG.velocityScale;
+    const clampedTargetScaleX = Math.max(1 - SQUISH_CONFIG.maxSquish, Math.min(1, targetScaleX));
+    const clampedTargetScaleY = Math.max(1 - SQUISH_CONFIG.maxSquish, Math.min(1, targetScaleY));
+    spring.scaleX += (clampedTargetScaleX - spring.scaleX) * SQUISH_CONFIG.recovery;
+    spring.scaleY += (clampedTargetScaleY - spring.scaleY) * SQUISH_CONFIG.recovery;
+    const bounceSquishX = 1 - Math.abs(spring.velocityY) * 0.02;
+    const bounceSquishY = 1 - Math.abs(spring.velocityX) * 0.02;
+    const finalScaleX = Math.max(0.85, spring.scaleX * bounceSquishX);
+    const finalScaleY = Math.max(0.85, spring.scaleY * bounceSquishY);
+    cursor.style.transform = `translate3d(${spring.x}px, ${spring.y}px, 0)`;
+    cursor.style.width = `${spring.width}px`;
+    cursor.style.height = `${spring.height}px`;
+    cursorInner.style.transform = `scale(${finalScaleX}, ${finalScaleY})`;
+    const isHovering = hoveredElementIdRef.current !== null;
+    if (isHovering) {
+      cursorInner.style.borderRadius = elementBorderRadiusRef.current;
+    } else {
+      cursorInner.style.borderRadius = "9999px";
+    }
+    animationFrameRef.current = requestAnimationFrame(animate);
+  }, []);
+  useEffect(() => {
+    if (!isClient) return;
+    animationFrameRef.current = requestAnimationFrame(animate);
+    return () => {
+      if (animationFrameRef.current) {
+        cancelAnimationFrame(animationFrameRef.current);
+      }
+    };
+  }, [isClient, animate]);
+  useEffect(() => {
+    if (!isClient) return;
+    const handleMouseMove = (e) => {
+      mousePositionRef.current = { x: e.clientX, y: e.clientY };
+      updateTarget();
+    };
+    document.addEventListener("mousemove", handleMouseMove, { passive: true });
+    return () => document.removeEventListener("mousemove", handleMouseMove);
+  }, [isClient, updateTarget]);
+  const handleMouseEnter = useCallback(() => {
+    setIsMouseInside(true);
+    const mouse = mousePositionRef.current;
+    springRef.current.x = mouse.x - cursorSize / 2;
+    springRef.current.y = mouse.y - cursorSize / 2;
+    updateTarget();
+  }, [cursorSize, updateTarget]);
+  const handleMouseLeave = useCallback(() => {
+    setIsMouseInside(false);
+    hoveredElementIdRef.current = null;
+    hoveredElementRef.current = null;
+    setHoveredElementId(null);
+    updateTarget();
+  }, [updateTarget]);
+  const checkMouseInElement = useCallback(() => {
+    if (!hoveredElementRef.current || !hoveredElementIdRef.current) return;
+    const rect = hoveredElementRef.current.getBoundingClientRect();
+    const mouse = mousePositionRef.current;
+    elementDimensionsRef.current = {
+      width: rect.width,
+      height: rect.height,
+      x: rect.left,
+      y: rect.top,
+      right: rect.right,
+      bottom: rect.bottom
+    };
+    const isInside = mouse.x >= rect.left && mouse.x <= rect.right && mouse.y >= rect.top && mouse.y <= rect.bottom;
+    if (!isInside) {
+      hoveredElementIdRef.current = null;
+      hoveredElementRef.current = null;
+      setHoveredElementId(null);
+    }
+    updateTarget();
+  }, [updateTarget]);
+  useEffect(() => {
+    if (!isClient) return;
+    const handleScroll = () => checkMouseInElement();
+    document.addEventListener("scroll", handleScroll, { passive: true, capture: true });
+    return () => document.removeEventListener("scroll", handleScroll, { capture: true });
+  }, [checkMouseInElement, isClient]);
+  const registerHoveredElement = useCallback(
+    (id, dimensions, element) => {
+      hoveredElementIdRef.current = id;
+      elementDimensionsRef.current = {
+        width: dimensions.width,
+        height: dimensions.height,
+        x: dimensions.left,
+        y: dimensions.top,
+        right: dimensions.right,
+        bottom: dimensions.bottom
+      };
+      if (element) {
+        hoveredElementRef.current = element;
+        const computedStyle = window.getComputedStyle(element);
+        elementBorderRadiusRef.current = computedStyle.borderRadius || "8px";
+      }
+      setHoveredElementId(id);
+      updateTarget();
+    },
+    [updateTarget]
+  );
+  const unregisterHoveredElement = useCallback(() => {
+    hoveredElementIdRef.current = null;
+    hoveredElementRef.current = null;
+    elementBorderRadiusRef.current = "9999px";
+    setHoveredElementId(null);
+    updateTarget();
+  }, [updateTarget]);
+  const updateElementDimensions = useCallback(
+    (dimensions) => {
+      if (hoveredElementIdRef.current) {
+        elementDimensionsRef.current = {
+          width: dimensions.width,
+          height: dimensions.height,
+          x: dimensions.left,
+          y: dimensions.top,
+          right: dimensions.right,
+          bottom: dimensions.bottom
+        };
+        updateTarget();
+      }
+    },
+    [updateTarget]
+  );
+  const contextValue = useMemo(
+    () => ({
+      mousePosition: mousePositionRef.current,
+      hoveredElementId,
+      elementDimensions: elementDimensionsRef.current,
+      registerHoveredElement,
+      unregisterHoveredElement,
+      updateElementDimensions
+    }),
+    [hoveredElementId, registerHoveredElement, unregisterHoveredElement, updateElementDimensions]
+  );
+  const cursorElement = isClient && /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: cursorRef,
+      className: "pointer-events-none fixed z-50",
+      style: {
+        left: 0,
+        top: 0,
+        width: cursorSize,
+        height: cursorSize,
+        display: isMouseInside ? "block" : "none",
+        willChange: "transform, width, height"
+      },
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: cursorInnerRef,
+          className: cn("h-full w-full border border-white/50", cursorClassName),
+          style: {
+            backgroundColor: "rgba(156, 163, 175, 0.2)",
+            boxShadow: "0 0 25px rgba(255, 255, 255, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.5)",
+            borderRadius: "9999px",
+            transformOrigin: "center center"
+          }
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isClient && typeof document !== "undefined" && document.body && createPortal(cursorElement, document.body),
+    /* @__PURE__ */ jsx(CursorContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+      Component,
+      {
+        ...props,
+        className: cn(className),
+        style: {
+          cursor: isMouseInside && !hoveredElementId ? "none" : "auto",
+          ...props.style
+        },
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        children
+      }
+    ) })
+  ] });
+};
+
+export { CursorProvider };

package/dist/{chunk-PV6CEMTT.cjs → chunk-PWZ4F3WY.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkCRX2ZCM2_cjs = require('./chunk-CRX2ZCM2.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
 var React = require('react');
@@ -194,10 +194,10 @@ var ToggleButtons = React__namespace.forwardRef(
               if (typeof ref === "function") ref(node);
               else if (ref) ref.current = node;
             },
-            className: chunkCRX2ZCM2_cjs.cn(toggleButtonsVariants({ variant, padding }), className),
+            className: chunk6LTCLQH3_cjs.cn(toggleButtonsVariants({ variant, padding }), className),
             ...props,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkCRX2ZCM2_cjs.cn(toggleButtonHighlightVariants({ variant })), style: highlightStyle }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk6LTCLQH3_cjs.cn(toggleButtonHighlightVariants({ variant })), style: highlightStyle }),
               children
             ]
           }
@@ -244,7 +244,7 @@ var ToggleButton = React__namespace.forwardRef(
         },
         ...props,
         "data-selected": isSelected,
-        className: chunkCRX2ZCM2_cjs.cn(
+        className: chunk6LTCLQH3_cjs.cn(
           toggleButtonVariants({
             variant: finalVariant,
             size: finalSize,

package/dist/{chunk-QBAZ6TKZ.cjs → chunk-PZZW3E5D.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkASZIBFA6_cjs = require('./chunk-ASZIBFA6.cjs');
+var chunkUZTOUPJ7_cjs = require('./chunk-UZTOUPJ7.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -22,7 +22,7 @@ var IntInput = react.forwardRef(function IntInput2({ value = 0, onChange, ...pro
     [onChange]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkASZIBFA6_cjs.InputNumbers,
+    chunkUZTOUPJ7_cjs.InputNumbers,
     {
       ref,
       value: [value],