@vuer-ai/vuer-uikit 0.0.96 → 0.0.98

package/dist/chunk-VBBJSIY7.cjs

@@ -0,0 +1,308 @@
+'use strict';
+
+var chunkG4FJGNY5_cjs = require('./chunk-G4FJGNY5.cjs');
+var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.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: chunkOHIB3TEN_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: chunkOHIB3TEN_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: chunkOHIB3TEN_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: chunkOHIB3TEN_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: chunkOHIB3TEN_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: chunkOHIB3TEN_cjs.cn(
+        "cursor-grab overflow-x-auto overflow-y-hidden",
+        isDragging && "cursor-grabbing",
+        className
+      ),
+      style: { userSelect: isDragging ? "none" : "auto", ...props.style },
+      ...props,
+      children
+    }
+  );
+};
+var SyncDragY = ({
+  ref: extRef,
+  children,
+  className,
+  asChild = false,
+  ...props
+}) => {
+  const ref = chunkG4FJGNY5_cjs.useSyncDrag({ ref: extRef, axis: "vertical" });
+  const [isDragging, setIsDragging] = react.useState(false);
+  const dragStartY = react.useRef(0);
+  const scrollStartTop = react.useRef(0);
+  react.useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    const handleMouseDown = (e) => {
+      setIsDragging(true);
+      dragStartY.current = e.clientY;
+      scrollStartTop.current = element.scrollTop;
+      e.preventDefault();
+    };
+    const handleMouseMove = (e) => {
+      if (!isDragging || !element) return;
+      const deltaY = e.clientY - dragStartY.current;
+      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: chunkOHIB3TEN_cjs.cn(
+        "cursor-grab overflow-x-hidden overflow-y-auto",
+        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.SyncDragY = SyncDragY;
+exports.SyncScroll = SyncScroll;
+exports.SyncScrollSlave = SyncScrollSlave;

package/dist/{chunk-AIINOWEH.mjs → chunk-W4JCKCW7.mjs}

@@ -1,21 +1,21 @@
+import { QuaternionInput } from './chunk-6J7ZVRSY.mjs';
 import { RadInput } from './chunk-GPV4XELL.mjs';
 import { TimeInput } from './chunk-7R2ZBAE6.mjs';
 import { Vec3Input } from './chunk-PIXIN3IG.mjs';
+import { CmInput } from './chunk-SQQXY4AY.mjs';
 import { DegInput } from './chunk-CZ2YNM7Y.mjs';
 import { EulerDegInput } from './chunk-OJUK6WJ5.mjs';
 import { EulerInput } from './chunk-5TXABUNC.mjs';
 import { InchInput } from './chunk-ZZLF2YWP.mjs';
 import { IntInput } from './chunk-NT5ZTF56.mjs';
-import { QuaternionInput } from './chunk-6J7ZVRSY.mjs';
 import { VectorInput } from './chunk-6CM4GYJU.mjs';
-import { CmInput } from './chunk-SQQXY4AY.mjs';
 import { Slider } from './chunk-Y6WGGVT2.mjs';
 import { Switch } from './chunk-AZBJB6KC.mjs';
-import { Label } from './chunk-42UBHC2D.mjs';
 import { FormLayout } from './chunk-NRQJX772.mjs';
-import { InputRoot, InputSlot } from './chunk-4XUJBMDE.mjs';
+import { Label } from './chunk-42UBHC2D.mjs';
+import { useDialSchema } from './chunk-3HEZVWRW.mjs';
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-CX6OFX5Z.mjs';
-import { useDialSchema } from './chunk-W2YAQV5N.mjs';
+import { InputRoot, InputSlot } from './chunk-4XUJBMDE.mjs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var DialInputWrapper = ({ label, children }) => {

package/dist/chunk-WWGF6TBZ.mjs

@@ -0,0 +1,206 @@
+import { cn } from './chunk-HMN4IKTG.mjs';
+import { CursorContext } from './chunk-3FR3WKI4.mjs';
+import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import { createPortal } from 'react-dom';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var CursorProvider = ({
+  children,
+  maxOffsetX = 5,
+  maxOffsetY = 20,
+  cursorSize = 20,
+  transitionDuration = 100,
+  cursorClassName,
+  className,
+  as: Component = "div",
+  ...props
+}) => {
+  const [isClient, setIsClient] = useState(false);
+  const [isMouseInside, setIsMouseInside] = useState(false);
+  const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 });
+  const [hoveredElementId, setHoveredElementId] = useState(null);
+  const [elementDimensions, setElementDimensions] = useState({
+    width: 0,
+    height: 0,
+    x: 0,
+    y: 0,
+    right: 0,
+    bottom: 0
+  });
+  const hoveredElementRef = useRef(null);
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+  useEffect(() => {
+    if (!isClient) return;
+    const handleMouseMove = (e) => {
+      setMousePosition({ x: e.clientX, y: e.clientY });
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    return () => document.removeEventListener("mousemove", handleMouseMove);
+  }, [isClient]);
+  const handleMouseEnter = useCallback(() => {
+    setIsMouseInside(true);
+  }, []);
+  const handleMouseLeave = useCallback(() => {
+    setIsMouseInside(false);
+    setHoveredElementId(null);
+    hoveredElementRef.current = null;
+  }, []);
+  const checkMouseInElement = useCallback(() => {
+    if (!hoveredElementRef.current || !hoveredElementId) {
+      return;
+    }
+    const rect = hoveredElementRef.current.getBoundingClientRect();
+    setElementDimensions({
+      width: rect.width,
+      height: rect.height,
+      x: rect.left,
+      y: rect.top,
+      right: rect.right,
+      bottom: rect.bottom
+    });
+    const isInside = mousePosition.x >= rect.left && mousePosition.x <= rect.right && mousePosition.y >= rect.top && mousePosition.y <= rect.bottom;
+    if (!isInside) {
+      setHoveredElementId(null);
+      hoveredElementRef.current = null;
+    }
+  }, [mousePosition, hoveredElementId]);
+  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) => {
+      setHoveredElementId(id);
+      setElementDimensions({
+        width: dimensions.width,
+        height: dimensions.height,
+        x: dimensions.left,
+        y: dimensions.top,
+        right: dimensions.right,
+        bottom: dimensions.bottom
+      });
+      if (element) {
+        hoveredElementRef.current = element;
+      }
+    },
+    []
+  );
+  const unregisterHoveredElement = useCallback(() => {
+    setHoveredElementId(null);
+    hoveredElementRef.current = null;
+  }, []);
+  const updateElementDimensions = useCallback(
+    (dimensions) => {
+      if (hoveredElementId) {
+        setElementDimensions({
+          width: dimensions.width,
+          height: dimensions.height,
+          x: dimensions.left,
+          y: dimensions.top,
+          right: dimensions.right,
+          bottom: dimensions.bottom
+        });
+      }
+    },
+    [hoveredElementId]
+  );
+  const getCursorPosition = () => {
+    if (!hoveredElementId) {
+      return {
+        x: mousePosition.x - cursorSize / 2,
+        y: mousePosition.y - cursorSize / 2
+      };
+    }
+    const elementCenterX = elementDimensions.x + elementDimensions.width / 2;
+    const elementCenterY = elementDimensions.y + elementDimensions.height / 2;
+    const offsetX = (mousePosition.x - elementCenterX) * 0.1;
+    const offsetY = (mousePosition.y - elementCenterY) * 0.1;
+    const boundedOffsetX = Math.max(-maxOffsetX, Math.min(maxOffsetX, offsetX));
+    const boundedOffsetY = Math.max(-maxOffsetY, Math.min(maxOffsetY, offsetY));
+    return {
+      x: elementDimensions.x + boundedOffsetX,
+      y: elementDimensions.y + boundedOffsetY
+    };
+  };
+  const contextValue = useMemo(
+    () => ({
+      // State values that change during component lifecycle
+      mousePosition,
+      hoveredElementId,
+      elementDimensions,
+      // Callbacks that should be stable references
+      registerHoveredElement,
+      unregisterHoveredElement,
+      updateElementDimensions
+    }),
+    [
+      mousePosition,
+      hoveredElementId,
+      elementDimensions,
+      registerHoveredElement,
+      unregisterHoveredElement,
+      updateElementDimensions
+    ]
+  );
+  const cursorPosition = getCursorPosition();
+  const cursorStyleObject = useMemo(
+    () => ({
+      left: cursorPosition.x,
+      top: cursorPosition.y,
+      width: hoveredElementId ? elementDimensions.width > 0 ? elementDimensions.width : cursorSize : cursorSize,
+      height: hoveredElementId ? elementDimensions.height > 0 ? elementDimensions.height : cursorSize : cursorSize,
+      willChange: "transform, width, height"
+    }),
+    [
+      cursorPosition.x,
+      cursorPosition.y,
+      hoveredElementId,
+      elementDimensions.width,
+      elementDimensions.height,
+      cursorSize
+    ]
+  );
+  let styleClass;
+  if (hoveredElementId) {
+    styleClass = `opacity-[0.05] rounded-uk-md transition-[width,height,left,top] duration-${transitionDuration} ease-out`;
+  } else {
+    styleClass = `opacity-90 rounded-full z-10 transition-[width,height,left,top] duration-${transitionDuration} ease-out transition-opacity duration-${transitionDuration}`;
+  }
+  const cursorElement = isClient && isMouseInside && /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `pointer-events-none fixed ${styleClass} ${hoveredElementId ? "" : cursorClassName || ""}`,
+      style: {
+        ...cursorStyleObject,
+        backgroundColor: "var(--shadow-tertiary)"
+      }
+    }
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isClient && typeof document !== "undefined" && document.body && cursorElement && 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 };