@vuer-ai/vuer-uikit 0.0.63 → 0.0.66

package/dist/chunk-4DPLDAHW.cjs

@@ -0,0 +1,246 @@
+'use strict';
+
+var chunkG4FJGNY5_cjs = require('./chunk-G4FJGNY5.cjs');
+var chunkDWD754BX_cjs = require('./chunk-DWD754BX.cjs');
+var reactSlot = require('@radix-ui/react-slot');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var SyncScroll = ({ children, className, asChild = false, ...props }) => {
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(Comp, { ref: chunkG4FJGNY5_cjs.useSyncScroll(), className: chunkDWD754BX_cjs.cn("overflow-y-auto", className), ...props, children });
+};
+var SyncScrollSlave = ({
+  children,
+  className,
+  asChild = false,
+  ...props
+}) => {
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(Comp, { ref: chunkG4FJGNY5_cjs.useScrollSlave(), className: chunkDWD754BX_cjs.cn("overflow-y-auto", className), ...props, children });
+};
+var SyncDrag = ({
+  ref: extRef,
+  children,
+  className,
+  asChild = false,
+  ...props
+}) => {
+  const ref = chunkG4FJGNY5_cjs.useSyncDrag({ ref: extRef, axis: "both" });
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartX = react.useRef(0);
+  const dragStartY = react.useRef(0);
+  const scrollStartLeft = react.useRef(0);
+  const scrollStartTop = react.useRef(0);
+  react.useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    const handleMouseDown = (e) => {
+      setIsDragging(true);
+      dragStartX.current = e.clientX;
+      dragStartY.current = e.clientY;
+      scrollStartLeft.current = element.scrollLeft;
+      scrollStartTop.current = element.scrollTop;
+      e.preventDefault();
+    };
+    const handleMouseMove = (e) => {
+      if (!isDragging || !element) return;
+      const deltaX = e.clientX - dragStartX.current;
+      const deltaY = e.clientY - dragStartY.current;
+      element.scrollLeft = scrollStartLeft.current - deltaX * 2;
+      element.scrollTop = scrollStartTop.current - deltaY * 2;
+    };
+    const handleMouseUp = () => {
+      setIsDragging(false);
+    };
+    element.addEventListener("mousedown", handleMouseDown);
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.addEventListener("mouseleave", handleMouseUp);
+    }
+    return () => {
+      element.removeEventListener("mousedown", handleMouseDown);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("mouseleave", handleMouseUp);
+    };
+  }, [isDragging, ref]);
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      ref,
+      className: chunkDWD754BX_cjs.cn("cursor-grab overflow-auto", isDragging && "cursor-grabbing", className),
+      style: { userSelect: isDragging ? "none" : "auto", ...props.style },
+      ...props,
+      children
+    }
+  );
+};
+var SyncDragX = ({ children, className, asChild = false, ...props }) => {
+  const ref = chunkG4FJGNY5_cjs.useSyncDrag({ axis: "horizontal" });
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartX = react.useRef(0);
+  const scrollStartLeft = react.useRef(0);
+  react.useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    const handleMouseDown = (e) => {
+      setIsDragging(true);
+      dragStartX.current = e.clientX;
+      scrollStartLeft.current = element.scrollLeft;
+      e.preventDefault();
+    };
+    const handleMouseMove = (e) => {
+      if (!isDragging || !element) return;
+      const deltaX = e.clientX - dragStartX.current;
+      element.scrollLeft = scrollStartLeft.current - deltaX * 2;
+    };
+    const handleMouseUp = () => {
+      setIsDragging(false);
+    };
+    element.addEventListener("mousedown", handleMouseDown);
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.addEventListener("mouseleave", handleMouseUp);
+    }
+    return () => {
+      element.removeEventListener("mousedown", handleMouseDown);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("mouseleave", handleMouseUp);
+    };
+  }, [isDragging, ref]);
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      ref,
+      className: chunkDWD754BX_cjs.cn("cursor-grab overflow-x-auto", isDragging ? "cursor-grabbing" : "", className),
+      style: { userSelect: isDragging ? "none" : "auto", ...props.style },
+      ...props,
+      children
+    }
+  );
+};
+var SyncDragSlave = ({
+  ref: extRef,
+  children,
+  className,
+  asChild = false,
+  ...props
+}) => {
+  const ref = chunkG4FJGNY5_cjs.useScrollSlave({ ref: extRef, axis: "both" });
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartX = react.useRef(0);
+  const dragStartY = react.useRef(0);
+  const scrollStartLeft = react.useRef(0);
+  const scrollStartTop = react.useRef(0);
+  react.useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    const handleMouseDown = (e) => {
+      setIsDragging(true);
+      dragStartX.current = e.clientX;
+      dragStartY.current = e.clientY;
+      scrollStartLeft.current = element.scrollLeft;
+      scrollStartTop.current = element.scrollTop;
+      e.preventDefault();
+    };
+    const handleMouseMove = (e) => {
+      if (!isDragging || !element) return;
+      const deltaX = e.clientX - dragStartX.current;
+      const deltaY = e.clientY - dragStartY.current;
+      element.scrollLeft = scrollStartLeft.current - deltaX * 2;
+      element.scrollTop = scrollStartTop.current - deltaY * 2;
+    };
+    const handleMouseUp = () => {
+      setIsDragging(false);
+    };
+    element.addEventListener("mousedown", handleMouseDown);
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.addEventListener("mouseleave", handleMouseUp);
+    }
+    return () => {
+      element.removeEventListener("mousedown", handleMouseDown);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("mouseleave", handleMouseUp);
+    };
+  }, [isDragging, ref]);
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      ref,
+      className: chunkDWD754BX_cjs.cn("cursor-grab overflow-auto", isDragging && "cursor-grabbing", className),
+      style: { userSelect: isDragging ? "none" : "auto", ...props.style },
+      ...props,
+      children
+    }
+  );
+};
+var SyncDragSlaveX = ({
+  ref: extRef,
+  children,
+  className,
+  asChild = false,
+  ...props
+}) => {
+  const ref = chunkG4FJGNY5_cjs.useScrollSlave({ ref: extRef, axis: "horizontal" });
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartX = react.useRef(0);
+  const scrollStartLeft = react.useRef(0);
+  react.useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    const handleMouseDown = (e) => {
+      setIsDragging(true);
+      dragStartX.current = e.clientX;
+      scrollStartLeft.current = element.scrollLeft;
+      e.preventDefault();
+    };
+    const handleMouseMove = (e) => {
+      if (!isDragging || !element) return;
+      const deltaX = e.clientX - dragStartX.current;
+      element.scrollLeft = scrollStartLeft.current - deltaX * 2;
+    };
+    const handleMouseUp = () => {
+      setIsDragging(false);
+    };
+    element.addEventListener("mousedown", handleMouseDown);
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.addEventListener("mouseleave", handleMouseUp);
+    }
+    return () => {
+      element.removeEventListener("mousedown", handleMouseDown);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("mouseleave", handleMouseUp);
+    };
+  }, [isDragging, ref]);
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      ref,
+      className: chunkDWD754BX_cjs.cn("cursor-grab overflow-x-auto overflow-y-hidden", isDragging && "cursor-grabbing", className),
+      style: { userSelect: isDragging ? "none" : "auto", ...props.style },
+      ...props,
+      children
+    }
+  );
+};
+
+exports.SyncDrag = SyncDrag;
+exports.SyncDragSlave = SyncDragSlave;
+exports.SyncDragSlaveX = SyncDragSlaveX;
+exports.SyncDragX = SyncDragX;
+exports.SyncScroll = SyncScroll;
+exports.SyncScrollSlave = SyncScrollSlave;

package/dist/chunk-4WSB6SKT.mjs

@@ -0,0 +1,89 @@
+import { cn } from './chunk-KVFUDYD3.mjs';
+import { Slot } from '@radix-ui/react-slot';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var DockLayout = forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        ...props,
+        className: cn(
+          "relative h-full w-full flex flex-col overflow-hidden",
+          className
+        )
+      }
+    );
+  }
+);
+DockLayout.displayName = "DockLayout";
+function DockLayoutContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { ...props, className: cn("flex-1 flex flex-col items-center justify-center overflow-auto relative", className) });
+}
+function DockLayoutLeft({
+  className,
+  asChild,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ...props,
+      className: cn(
+        "h-full flex flex-col items-start gap-4 bg-bg-primary flex-shrink-0",
+        className
+      )
+    }
+  );
+}
+function DockLayoutTop({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      className: cn(
+        "absolute top-4 left-1/2 transform -translate-x-1/2 z-20 flex items-start justify-center",
+        className
+      )
+    }
+  );
+}
+function DockLayoutRight({
+  className,
+  asChild,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ...props,
+      className: cn(
+        "h-full flex flex-col items-end gap-4 bg-bg-primary flex-shrink-0",
+        className
+      )
+    }
+  );
+}
+var DockLayoutBottom = forwardRef(
+  ({ className, asChild, ...props }, ref) => {
+    const Comp = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        ...props,
+        className: cn(
+          "inline-flex justify-center bg-bg-primary flex-shrink-0 w-full",
+          className
+        )
+      }
+    );
+  }
+);
+DockLayoutBottom.displayName = "DockLayoutBottom";
+
+export { DockLayout, DockLayoutBottom, DockLayoutContent, DockLayoutLeft, DockLayoutRight, DockLayoutTop };

package/dist/{chunk-BZ4VQAAM.mjs → chunk-5RQE4EDL.mjs}

@@ -1,7 +1,7 @@
 import { Badge } from './chunk-Q27ILZE6.mjs';
 import { jsx } from 'react/jsx-runtime';
 
-var PACKAGE_VERSION = "0.0.63" ;
+var PACKAGE_VERSION = "0.0.66" ;
 var PACKAGE_NAME = "@vuer-ai/vuer-uikit" ;
 function VersionBadge({
   className,

package/dist/{chunk-N7NPTGOF.js → chunk-5XHWH2UY.cjs}

@@ -1,13 +1,13 @@
 'use strict';
 
-var chunkYUTSR2OT_js = require('./chunk-YUTSR2OT.js');
+var chunkDWD754BX_cjs = require('./chunk-DWD754BX.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
 function Toolbar({ className, children, variant = "default", size = "md" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: chunkYUTSR2OT_js.cn(
+      className: chunkDWD754BX_cjs.cn(
         "bg-bg-primary flex items-center gap-2 shadow-sm",
         "liquid:liquid-bg",
         size === "sm" && "rounded-uk-md p-1.5",
@@ -21,10 +21,10 @@ function Toolbar({ className, children, variant = "default", size = "md" }) {
   );
 }
 function ToolbarGroup({ className, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkYUTSR2OT_js.cn("flex items-center gap-1", className), children });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkDWD754BX_cjs.cn("flex items-center gap-1", className), children });
 }
 function ToolbarSeparator({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkYUTSR2OT_js.cn("bg-line-primary mx-2 h-3.5 w-0.75 rounded-full", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkDWD754BX_cjs.cn("bg-line-primary mx-2 h-3.5 w-0.75 rounded-full", className) });
 }
 
 exports.Toolbar = Toolbar;

package/dist/{chunk-HYMAPQ22.mjs → chunk-6LG57RUT.mjs}

@@ -1,11 +1,10 @@
-import { createClientOnlyComponent } from './chunk-4F2GSF2T.mjs';
 import { cn } from './chunk-KVFUDYD3.mjs';
 import * as SliderPrimitive from '@radix-ui/react-slider';
-import { forwardRef, useState, useMemo } from 'react';
+import { forwardRef, useState, useMemo, useEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var SliderRoot = forwardRef(
-  function SliderRoot2({
+var Slider = forwardRef(
+  function SliderRoot({
     className,
     defaultValue,
     value,
@@ -21,6 +20,11 @@ var SliderRoot = forwardRef(
       () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
       [value, defaultValue, min, max]
     );
+    useEffect(() => {
+      if (value) {
+        setCurrentValue(value);
+      }
+    }, [value]);
     return /* @__PURE__ */ jsxs(
       SliderPrimitive.Root,
       {
@@ -111,72 +115,6 @@ var SliderRoot = forwardRef(
     );
   }
 );
-var SliderFallback = forwardRef(function SliderFallback2({ className, defaultValue, value, min = 0, max = 100, ...props }, ref) {
-  const [currentValue] = useState(value ?? defaultValue ?? [0]);
-  const _values = useMemo(
-    () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
-    [value, defaultValue, min, max]
-  );
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "slider",
-      ref,
-      className: cn(
-        "relative",
-        "flex",
-        "w-full",
-        "touch-none",
-        "select-none",
-        "items-center",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            "data-slot": "slider-track",
-            className: cn(
-              "bg-line-primary",
-              "relative",
-              "grow",
-              "overflow-hidden",
-              "rounded-full",
-              "h-0.5",
-              "w-full"
-            ),
-            children: /* @__PURE__ */ jsx(
-              "div",
-              {
-                "data-slot": "slider-range",
-                className: cn("bg-brand-primary", "absolute", "h-full"),
-                style: { width: `${((currentValue[0] ?? min) - min) / (max - min) * 100}%` }
-              }
-            )
-          }
-        ),
-        _values.map((_, index) => /* @__PURE__ */ jsx(
-          "div",
-          {
-            "data-slot": "slider-thumb",
-            className: cn(
-              "bg-brand-primary",
-              "block",
-              "h-4",
-              "w-[0.6rem]",
-              "shrink-0",
-              "rounded-[3px]",
-              "cursor-ew-resize"
-            )
-          },
-          index
-        ))
-      ]
-    }
-  );
-});
-var Slider = createClientOnlyComponent(SliderRoot, SliderFallback);
 function SliderSteps({ step, min, max, currentValue }) {
   const steps = useMemo(() => {
     const value = max - min;

package/dist/{chunk-XOSA5UHF.mjs → chunk-6YW46AEZ.mjs}

@@ -1,4 +1,4 @@
-import { NumberInput } from './chunk-ZJ3NYGIH.mjs';
+import { NumberInput } from './chunk-WZS23ODD.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-GAHZZDEF.js → chunk-7OHIAOEL.cjs}

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunkKVN35F5P_js = require('./chunk-KVN35F5P.js');
-var chunkYUTSR2OT_js = require('./chunk-YUTSR2OT.js');
+var chunkNFJTF2GL_cjs = require('./chunk-NFJTF2GL.cjs');
+var chunkDWD754BX_cjs = require('./chunk-DWD754BX.cjs');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -174,7 +174,7 @@ var InputNumbers = React.forwardRef(function InputNumbers2({ size, value, onValu
     {
       ref,
       onMouseDown: handleMouseDown,
-      className: chunkYUTSR2OT_js.cn([
+      className: chunkDWD754BX_cjs.cn([
         "gap-xs flex touch-none flex-col select-none",
         cursorState === "default" && "cursor-crosshair",
         cursorState === "dragging-y" && "cursor-ns-resize",
@@ -186,7 +186,7 @@ var InputNumbers = React.forwardRef(function InputNumbers2({ size, value, onValu
         "data-[hover=y]:cursor-ns-resize"
       ]),
       children: value.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
-        chunkKVN35F5P_js.InputRoot,
+        chunkNFJTF2GL_cjs.InputRoot,
         {
           ref: (r) => {
             inputs.current.set(index.toString(), r);
@@ -201,7 +201,7 @@ var InputNumbers = React.forwardRef(function InputNumbers2({ size, value, onValu
           },
           onChange: valueChangeHandler(index),
           "data-hover": "none",
-          className: chunkYUTSR2OT_js.cn([
+          className: chunkDWD754BX_cjs.cn([
             "group/number-input",
             "cursor-text",
             "data-[hover=down]:bg-bg-tertiary",
@@ -210,15 +210,15 @@ var InputNumbers = React.forwardRef(function InputNumbers2({ size, value, onValu
             "data-[hover=x]:cursor-col-resize",
             "data-[hover=y]:cursor-ns-resize"
           ]),
-          inputClassName: chunkYUTSR2OT_js.cn([
+          inputClassName: chunkDWD754BX_cjs.cn([
             "cursor-text",
             "group-data-[hover=x]/number-input:cursor-col-resize",
             "group-data-[hover=y]/number-input:cursor-ns-resize"
           ]),
           children: /* @__PURE__ */ jsxRuntime.jsx(
-            chunkKVN35F5P_js.InputSlot,
+            chunkNFJTF2GL_cjs.InputSlot,
             {
-              className: chunkYUTSR2OT_js.cn(
+              className: chunkDWD754BX_cjs.cn(
                 "cursor-text",
                 "group-data-[hover=x]/number-input:cursor-col-resize",
                 "group-data-[hover=y]/number-input:cursor-ns-resize"

package/dist/{chunk-E54RICZ7.mjs → chunk-7Y2LX6UY.mjs}

@@ -1,4 +1,4 @@
-import { EulerInput } from './chunk-LF2PJCL2.mjs';
+import { EulerInput } from './chunk-PABIHEC7.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-BUUBTZRO.js → chunk-A5S72EIK.cjs}

@@ -1,13 +1,13 @@
 'use strict';
 
-var chunkGW32CP24_js = require('./chunk-GW32CP24.js');
+var chunkMK6XW5PC_cjs = require('./chunk-MK6XW5PC.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
 var KVectorInput = react.forwardRef(function KVectorInput2({ value, dimensions, ...props }, ref) {
   const k = dimensions || value.length;
   const labels = Array.from({ length: k }, (_, i) => `${i}`);
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkGW32CP24_js.VectorInput, { ref, value, labels, ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkMK6XW5PC_cjs.VectorInput, { ref, value, labels, ...props });
 });
 
 exports.KVectorInput = KVectorInput;

package/dist/{chunk-QR27X2S2.js → chunk-A77GE42F.cjs}

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkGW32CP24_js = require('./chunk-GW32CP24.js');
+var chunkMK6XW5PC_cjs = require('./chunk-MK6XW5PC.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
 var QuaternionInput = react.forwardRef(function QuaternionInput2({ value, onValuesChange, ...props }, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkGW32CP24_js.VectorInput,
+    chunkMK6XW5PC_cjs.VectorInput,
     {
       ref,
       value,