@vuer-ai/vuer-uikit 0.0.2 → 0.0.3

package/dist/chunk-GA2JCN3F.mjs

@@ -0,0 +1,111 @@
+import { cn } from './chunk-HW6SLBO3.mjs';
+import { TabsCursorProvider, useTabsCursor } from './chunk-FYEZTS4S.mjs';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { cva } from 'class-variance-authority';
+import { createContext, useContext } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var TabsContext = createContext(void 0);
+var useTabsContext = () => {
+  const context = useContext(TabsContext);
+  if (!context) {
+    throw new Error("Tabs components must be used within a Tabs component");
+  }
+  return context;
+};
+function Tabs({ className, size = "base", ...props }) {
+  return /* @__PURE__ */ jsx(TabsCursorProvider, { children: /* @__PURE__ */ jsx(TabsContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx(
+    TabsPrimitive.Root,
+    {
+      "data-slot": "tabs",
+      className: cn("flex w-full flex-col gap-2", className),
+      ...props
+    }
+  ) }) });
+}
+var tabsListVariants = cva(["inline-flex", "items-center", "justify-center"], {
+  variants: {
+    size: {
+      sm: "p-0.5 gap-0.5",
+      base: "p-1 gap-1",
+      lg: "p-1.5 gap-1.5"
+    }
+  },
+  defaultVariants: {
+    size: "base"
+  }
+});
+function TabsList({ className, ...props }) {
+  const { setCursorTarget } = useTabsCursor();
+  const { size } = useTabsContext();
+  return /* @__PURE__ */ jsx(
+    TabsPrimitive.List,
+    {
+      onMouseLeave: () => setCursorTarget(null),
+      "data-slot": "tabs-list",
+      className: cn(tabsListVariants({ size }), "justify-start", className),
+      ...props
+    }
+  );
+}
+var tabsTriggerVariants = cva(
+  [
+    "inline-flex",
+    "items-center",
+    "justify-center",
+    "whitespace-nowrap",
+    "text-sm",
+    "font-medium",
+    "transition-all",
+    "disabled:pointer-events-none",
+    "disabled:bg-bg-tertiary",
+    "[&_svg]:pointer-events-none",
+    "[&_svg:not([class*='size-'])]:size-xl",
+    "shrink-0",
+    "[&_svg]:shrink-0",
+    "outline-none",
+    "focus-visible:border-ring",
+    "focus-visible:ring-ring/50",
+    "focus-visible:ring-[3px]",
+    "text-text-secondary",
+    "data-[state=active]:text-text-highlight",
+    "data-[state=active]:bg-bg-secondary"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "text-[11px] h-[22px] gap-xs px-md py-xs rounded-sm",
+        base: "text-[12px] h-[28px] gap-sm px-lg py-sm rounded-md",
+        lg: "text-[14px] h-[32px] gap-md px-xl py-sm rounded-md"
+      }
+    },
+    defaultVariants: {
+      size: "base"
+    }
+  }
+);
+function TabsTrigger({ className, ...props }) {
+  const { setCursorTarget } = useTabsCursor();
+  const { size } = useTabsContext();
+  return /* @__PURE__ */ jsx(
+    TabsPrimitive.Trigger,
+    {
+      onMouseEnter: (e) => setCursorTarget(e.currentTarget),
+      "data-slot": "tabs-trigger",
+      className: cn(tabsTriggerVariants({ size }), className),
+      ...props
+    }
+  );
+}
+function TabsContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    TabsPrimitive.Content,
+    {
+      "data-slot": "tabs-content",
+      className: cn("mt-2 flex-1 outline-none", className),
+      ...props
+    }
+  );
+}
+
+export { Tabs, TabsContent, TabsList, TabsTrigger };

package/dist/chunk-HW6SLBO3.mjs

@@ -0,0 +1,9 @@
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+export { cn };

package/dist/chunk-I6VKLSAJ.js

@@ -0,0 +1,163 @@
+'use strict';
+
+var chunkZYBSCTBR_js = require('./chunk-ZYBSCTBR.js');
+var chunkUWO6RBCE_js = require('./chunk-UWO6RBCE.js');
+var react$1 = require('@use-gesture/react');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var getHoverElementAndIndex = (element, inputs) => {
+  if (!element) return null;
+  const container = element == null ? void 0 : element.closest("[data-input]");
+  const currentInput = container == null ? void 0 : container.querySelector("input");
+  if (!currentInput) return null;
+  return Array.from(inputs.values()).indexOf(currentInput);
+};
+var changeElementsHoverState = (inputs, range, changed) => {
+  const [first, last] = range;
+  Array.from(inputs.values()).forEach((input, i) => {
+    const container = input == null ? void 0 : input.closest("[data-input]");
+    if (first === null || last === null) {
+      container == null ? void 0 : container.setAttribute("data-hover", "none");
+    } else if (i >= Math.min(first, last) && i <= Math.max(first, last)) {
+      container == null ? void 0 : container.setAttribute("data-hover", changed !== "none" ? changed : "down");
+    } else {
+      container == null ? void 0 : container.setAttribute("data-hover", "none");
+    }
+  });
+};
+var InputNumbers = react.forwardRef(function InputNumbers2({ size, value, onValuesChange, prefix, step = 0.1 }, ref) {
+  const inputs = react.useRef(/* @__PURE__ */ new Map());
+  const selectRange = react.useRef([null, null]);
+  const inputChange = react.useRef(false);
+  const stopClick = react.useCallback(() => {
+    const stopClick2 = (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+      document.removeEventListener("click", stopClick2, true);
+    };
+    document.addEventListener("click", stopClick2, true);
+  }, []);
+  const bind = react$1.useGesture({
+    onDrag: ({ delta: [dx], event, initial, distance: [, oy], xy, memo = 0 }) => {
+      event.stopPropagation();
+      event.preventDefault();
+      if (selectRange.current[0] === null) {
+        selectRange.current[0] = getHoverElementAndIndex(
+          document.elementFromPoint(...initial),
+          inputs.current
+        );
+      }
+      let newMX = memo + dx / 2;
+      if (Math.abs(newMX) >= (inputChange.current ? 1 : 5)) {
+        const multiplyStep = event.shiftKey ? 5 : event.altKey ? 1 / 5 : 1;
+        const newValue = value.map((v, i) => {
+          const [first, last] = selectRange.current;
+          if (first === null || last === null) {
+            return v;
+          } else if (i <= Math.max(first, last) && i >= Math.min(first, last)) {
+            return Number(((v || 0) + Math.floor(newMX) * step * multiplyStep).toPrecision(6));
+          } else {
+            return v;
+          }
+        });
+        onValuesChange == null ? void 0 : onValuesChange(newValue);
+        newMX = 0;
+        inputChange.current = true;
+        changeElementsHoverState(inputs.current, selectRange.current, "x");
+        stopClick();
+      }
+      if (!inputChange.current) {
+        const currentElement = document.elementFromPoint(...xy);
+        const currentIndex = getHoverElementAndIndex(currentElement, inputs.current);
+        selectRange.current[1] = currentIndex ?? selectRange.current[1];
+        changeElementsHoverState(inputs.current, selectRange.current, oy !== 0 ? "y" : "none");
+        stopClick();
+      }
+      return newMX;
+    },
+    onDragEnd: () => {
+      selectRange.current = [null, null];
+      inputChange.current = false;
+      changeElementsHoverState(inputs.current, selectRange.current, "none");
+    }
+  });
+  const valueChangeHandler = react.useCallback(
+    (index) => {
+      return (e) => {
+        const inputValue = e.target.value;
+        if (inputValue === "" || !isNaN(Number(inputValue))) {
+          const newValue = value.map((v, i) => {
+            if (inputValue === "") {
+              return "";
+            }
+            return i === index ? Number(inputValue) : v;
+          });
+          onValuesChange == null ? void 0 : onValuesChange(newValue);
+        }
+      };
+    },
+    [onValuesChange, value]
+  );
+  if ((value == null ? void 0 : value.length) === 0) {
+    throw new Error("`value` cannot be an empty array");
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      ...bind(),
+      className: chunkUWO6RBCE_js.cn("gap-xs flex cursor-crosshair touch-none select-none flex-col"),
+      children: value.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        chunkZYBSCTBR_js.InputRoot,
+        {
+          ref: (r) => {
+            inputs.current.set(index.toString(), r);
+            return () => {
+              inputs.current.delete(index.toString());
+            };
+          },
+          size,
+          value: item,
+          onClick: () => {
+            var _a;
+            (_a = inputs.current.get(index.toString())) == null ? void 0 : _a.focus();
+          },
+          onChange: valueChangeHandler(index),
+          "data-hover": "none",
+          className: chunkUWO6RBCE_js.cn([
+            "group/number-input",
+            "cursor-crosshair",
+            "data-[hover=down]:bg-bg-tertiary",
+            "data-[hover=x]:bg-bg-tertiary",
+            "data-[hover=y]:bg-bg-tertiary",
+            "data-[hover=down]:cursor-move",
+            "data-[hover=x]:cursor-col-resize",
+            "data-[hover=y]:cursor-row-resize"
+          ]),
+          inputClassName: chunkUWO6RBCE_js.cn([
+            "cursor-crosshair",
+            "group-data-[hover=down]/number-input:cursor-move",
+            "group-data-[hover=x]/number-input:cursor-col-resize",
+            "group-data-[hover=y]/number-input:cursor-row-resize"
+          ]),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            chunkZYBSCTBR_js.InputSlot,
+            {
+              className: chunkUWO6RBCE_js.cn(
+                "cursor-crosshair",
+                "group-data-[hover=down]/number-input:cursor-move",
+                "group-data-[hover=x]/number-input:cursor-col-resize",
+                "group-data-[hover=y]/number-input:cursor-row-resize"
+              ),
+              children: prefix == null ? void 0 : prefix[index]
+            }
+          )
+        },
+        index
+      ))
+    }
+  );
+});
+
+exports.InputNumbers = InputNumbers;

package/dist/chunk-J4RFFBDJ.mjs

@@ -0,0 +1,94 @@
+import { cn } from './chunk-HW6SLBO3.mjs';
+import { jsx } from 'react/jsx-runtime';
+
+function Card({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card",
+      className: cn(
+        "flex",
+        "flex-col",
+        "gap-lg",
+        "w-[300px]",
+        "m-h-[244px]",
+        "rounded-lg",
+        "p-lg",
+        "bg-bg-primary",
+        "border-text-secondary",
+        "shadow-[0_4px_16px_0_var(--color-shadow-secondary)]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-header",
+      className: cn("flex", "flex-row", "items-center", "justify-between", "gap-lg", className),
+      ...props
+    }
+  );
+}
+function CardTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-title",
+      className: cn(
+        "text-text-highlight",
+        "text-[14px]",
+        "leading-[20px]",
+        "font-medium",
+        "vertical-align-middle",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-description",
+      className: cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+function CardAction({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-action",
+      className: cn(
+        "text-text-secondary",
+        "text-[11px]",
+        "leading-[14px]",
+        "font-medium",
+        "vertical-align-middle",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CardContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "card-content", className: cn("", className), ...props });
+}
+function CardFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-footer",
+      className: cn("[.border-t]:pt-6 flex items-center", className),
+      ...props
+    }
+  );
+}
+
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/chunk-JIXJTLEO.js

@@ -0,0 +1,93 @@
+'use strict';
+
+var framerMotion = require('framer-motion');
+var react = require('react');
+var reactDom = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/highlight-cursor/tabs-cursor-context.tsx
+var TabsCursorContext = react.createContext(null);
+var TabsCursorProvider = ({
+  children,
+  className,
+  ...props
+}) => {
+  const [cursorTarget, setCursorTarget] = react.useState(null);
+  const [targetRect, setTargetRect] = react.useState(null);
+  const [mousePosition, setMousePosition] = react.useState({ x: 0, y: 0 });
+  const [isMouseInside, setIsMouseInside] = react.useState(false);
+  react.useEffect(() => {
+    const handleMouseMove = (e) => {
+      setMousePosition({ x: e.clientX, y: e.clientY });
+    };
+    document.addEventListener("mousemove", handleMouseMove);
+    return () => document.removeEventListener("mousemove", handleMouseMove);
+  }, []);
+  react.useEffect(() => {
+    if (cursorTarget) {
+      setTargetRect(cursorTarget.getBoundingClientRect());
+    } else {
+      setTargetRect(null);
+    }
+  }, [cursorTarget]);
+  const handleMouseEnter = react.useCallback(() => {
+    setIsMouseInside(true);
+  }, []);
+  const handleMouseLeave = react.useCallback(() => {
+    setIsMouseInside(false);
+    setCursorTarget(null);
+  }, []);
+  const contextValue = { setCursorTarget };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      className,
+      style: {
+        cursor: isMouseInside && !cursorTarget ? "none" : "auto",
+        ...props.style
+      },
+      onMouseEnter: handleMouseEnter,
+      onMouseLeave: handleMouseLeave,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(TabsCursorContext.Provider, { value: contextValue, children: [
+        children,
+        isMouseInside && reactDom.createPortal(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            framerMotion.motion.div,
+            {
+              className: "pointer-events-none",
+              initial: false,
+              animate: {
+                x: targetRect ? targetRect.left : mousePosition.x - 8,
+                y: targetRect ? targetRect.top : mousePosition.y - 8,
+                width: targetRect ? targetRect.width : 16,
+                height: targetRect ? targetRect.height : 16,
+                borderRadius: targetRect && cursorTarget ? getComputedStyle(cursorTarget).borderRadius : "50%"
+              },
+              transition: { type: "spring", stiffness: 1e3, damping: 60, mass: 1 },
+              style: {
+                position: "fixed",
+                top: 0,
+                left: 0,
+                backgroundColor: "var(--bg-secondary)",
+                zIndex: 9999
+              }
+            }
+          ),
+          document.body
+        )
+      ] })
+    }
+  );
+};
+var useTabsCursor = () => {
+  const context = react.useContext(TabsCursorContext);
+  if (!context) {
+    return { setCursorTarget: () => {
+    } };
+  }
+  return context;
+};
+
+exports.TabsCursorProvider = TabsCursorProvider;
+exports.useTabsCursor = useTabsCursor;

package/dist/chunk-JOBQTBEM.mjs

@@ -0,0 +1,49 @@
+import { cn } from './chunk-HW6SLBO3.mjs';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var textareaVariants = cva(
+  [
+    "bg-bg-secondary",
+    "disabled:bg-bg-tertiary",
+    "disabled:cursor-not-allowed",
+    "outline",
+    "outline-transparent",
+    "-outline-offset-1",
+    "placehoder:text-muted-foreground",
+    "flex",
+    "min-h-16",
+    "w-full",
+    "px-3",
+    "py-2"
+  ],
+  {
+    variants: {
+      state: {
+        default: ["hover:outline-text-tertiary", "focus:outline-brand-primary"],
+        error: ["outline-danger-primary"]
+      },
+      size: {
+        sm: ["text-sm", "rounded-uk-sm"],
+        base: ["text-md", "rounded-uk-md"],
+        lg: ["text-xl", "rounded-uk-md"]
+      }
+    },
+    defaultVariants: {
+      state: "default",
+      size: "base"
+    }
+  }
+);
+function Textarea({ className, state, size, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      className: cn(textareaVariants({ className, state, size })),
+      "data-slot": "textarea",
+      ...props
+    }
+  );
+}
+
+export { Textarea };

package/dist/chunk-JZ7V43ZL.js

@@ -0,0 +1,136 @@
+'use strict';
+
+var chunkUWO6RBCE_js = require('./chunk-UWO6RBCE.js');
+var chunkJIXJTLEO_js = require('./chunk-JIXJTLEO.js');
+var TabsPrimitive = require('@radix-ui/react-tabs');
+var classVarianceAuthority = require('class-variance-authority');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
+
+var TabsContext = react.createContext(void 0);
+var useTabsContext = () => {
+  const context = react.useContext(TabsContext);
+  if (!context) {
+    throw new Error("Tabs components must be used within a Tabs component");
+  }
+  return context;
+};
+function Tabs({ className, size = "base", ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkJIXJTLEO_js.TabsCursorProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(TabsContext.Provider, { value: { size }, children: /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Root,
+    {
+      "data-slot": "tabs",
+      className: chunkUWO6RBCE_js.cn("flex w-full flex-col gap-2", className),
+      ...props
+    }
+  ) }) });
+}
+var tabsListVariants = classVarianceAuthority.cva(["inline-flex", "items-center", "justify-center"], {
+  variants: {
+    size: {
+      sm: "p-0.5 gap-0.5",
+      base: "p-1 gap-1",
+      lg: "p-1.5 gap-1.5"
+    }
+  },
+  defaultVariants: {
+    size: "base"
+  }
+});
+function TabsList({ className, ...props }) {
+  const { setCursorTarget } = chunkJIXJTLEO_js.useTabsCursor();
+  const { size } = useTabsContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.List,
+    {
+      onMouseLeave: () => setCursorTarget(null),
+      "data-slot": "tabs-list",
+      className: chunkUWO6RBCE_js.cn(tabsListVariants({ size }), "justify-start", className),
+      ...props
+    }
+  );
+}
+var tabsTriggerVariants = classVarianceAuthority.cva(
+  [
+    "inline-flex",
+    "items-center",
+    "justify-center",
+    "whitespace-nowrap",
+    "text-sm",
+    "font-medium",
+    "transition-all",
+    "disabled:pointer-events-none",
+    "disabled:bg-bg-tertiary",
+    "[&_svg]:pointer-events-none",
+    "[&_svg:not([class*='size-'])]:size-xl",
+    "shrink-0",
+    "[&_svg]:shrink-0",
+    "outline-none",
+    "focus-visible:border-ring",
+    "focus-visible:ring-ring/50",
+    "focus-visible:ring-[3px]",
+    "text-text-secondary",
+    "data-[state=active]:text-text-highlight",
+    "data-[state=active]:bg-bg-secondary"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "text-[11px] h-[22px] gap-xs px-md py-xs rounded-sm",
+        base: "text-[12px] h-[28px] gap-sm px-lg py-sm rounded-md",
+        lg: "text-[14px] h-[32px] gap-md px-xl py-sm rounded-md"
+      }
+    },
+    defaultVariants: {
+      size: "base"
+    }
+  }
+);
+function TabsTrigger({ className, ...props }) {
+  const { setCursorTarget } = chunkJIXJTLEO_js.useTabsCursor();
+  const { size } = useTabsContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Trigger,
+    {
+      onMouseEnter: (e) => setCursorTarget(e.currentTarget),
+      "data-slot": "tabs-trigger",
+      className: chunkUWO6RBCE_js.cn(tabsTriggerVariants({ size }), className),
+      ...props
+    }
+  );
+}
+function TabsContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Content,
+    {
+      "data-slot": "tabs-content",
+      className: chunkUWO6RBCE_js.cn("mt-2 flex-1 outline-none", className),
+      ...props
+    }
+  );
+}
+
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;