@vuer-ai/vuer-uikit 0.0.73 → 0.0.75

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

@@ -1,13 +1,13 @@
 'use strict';
 
-var chunkDWD754BX_cjs = require('./chunk-DWD754BX.cjs');
+var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
 function Toolbar({ className, children, variant = "default", size = "md" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: chunkDWD754BX_cjs.cn(
+      className: chunkOHIB3TEN_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: chunkDWD754BX_cjs.cn("flex items-center gap-1", className), children });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkOHIB3TEN_cjs.cn("flex items-center gap-1", className), children });
 }
 function ToolbarSeparator({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkDWD754BX_cjs.cn("bg-line-primary mx-2 h-3.5 w-0.75 rounded-full", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkOHIB3TEN_cjs.cn("bg-line-primary mx-2 h-3.5 w-0.75 rounded-full", className) });
 }
 
 exports.Toolbar = Toolbar;

package/dist/{chunk-XKV3CDJ7.cjs → chunk-JBMXLVXM.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkDWD754BX_cjs = require('./chunk-DWD754BX.cjs');
+var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.cjs');
 var SelectPrimitive = require('@radix-ui/react-select');
 var classVarianceAuthority = require('class-variance-authority');
 var lucideReact = require('lucide-react');
@@ -36,7 +36,7 @@ function SelectGroup({ className, ...props }) {
     SelectPrimitive__namespace.Group,
     {
       "data-slot": "select-group",
-      className: chunkDWD754BX_cjs.cn("space-y-xs", className),
+      className: chunkOHIB3TEN_cjs.cn("space-y-xs", className),
       ...props
     }
   );
@@ -108,7 +108,7 @@ function SelectTrigger({
     {
       "data-slot": "select-trigger",
       "data-size": size,
-      className: chunkDWD754BX_cjs.cn(
+      className: chunkOHIB3TEN_cjs.cn(
         selectTriggerVariants({
           size,
           className,
@@ -138,7 +138,7 @@ function SelectContent({
     {
       "data-slot": "select-content",
       "data-font": font,
-      className: chunkDWD754BX_cjs.cn(
+      className: chunkOHIB3TEN_cjs.cn(
         [
           "bg-bg-primary",
           "data-[state=open]:animate-in",
@@ -175,7 +175,7 @@ function SelectContent({
         /* @__PURE__ */ jsxRuntime.jsx(
           SelectPrimitive__namespace.Viewport,
           {
-            className: chunkDWD754BX_cjs.cn("p-md", {
+            className: chunkOHIB3TEN_cjs.cn("p-md", {
               "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1": position === "popper"
             }),
             children
@@ -191,7 +191,7 @@ function SelectLabel({ className, ...props }) {
     SelectPrimitive__namespace.Label,
     {
       "data-slot": "select-label",
-      className: chunkDWD754BX_cjs.cn("text-text-secondary text-uk-sm px-2 py-1.5", className),
+      className: chunkOHIB3TEN_cjs.cn("text-text-secondary text-uk-sm px-2 py-1.5", className),
       ...props
     }
   );
@@ -209,7 +209,7 @@ function SelectItem({
     {
       "data-slot": "select-item",
       disabled,
-      className: chunkDWD754BX_cjs.cn(
+      className: chunkOHIB3TEN_cjs.cn(
         [
           "group/select-item",
           "w-full",
@@ -252,7 +252,7 @@ function SelectItem({
           "p",
           {
             "data-disabled": disabled,
-            className: chunkDWD754BX_cjs.cn([
+            className: chunkOHIB3TEN_cjs.cn([
               "text-text-tertiary",
               "flex",
               "shrink-0",
@@ -268,7 +268,7 @@ function SelectItem({
           "p",
           {
             "data-disabled": disabled,
-            className: chunkDWD754BX_cjs.cn(
+            className: chunkOHIB3TEN_cjs.cn(
               "text-text-tertiary",
               "ml-auto",
               "flex",
@@ -292,7 +292,7 @@ function SelectSeparator({
     SelectPrimitive__namespace.Separator,
     {
       "data-slot": "select-separator",
-      className: chunkDWD754BX_cjs.cn("bg-line-primary my-lg pointer-events-none -mx-1 h-px", className),
+      className: chunkOHIB3TEN_cjs.cn("bg-line-primary my-lg pointer-events-none -mx-1 h-px", className),
       ...props
     }
   );
@@ -305,7 +305,7 @@ function SelectScrollUpButton({
     SelectPrimitive__namespace.ScrollUpButton,
     {
       "data-slot": "select-scroll-up-button",
-      className: chunkDWD754BX_cjs.cn("mx-24 flex cursor-default items-center justify-center py-1", className),
+      className: chunkOHIB3TEN_cjs.cn("mx-24 flex cursor-default items-center justify-center py-1", className),
       ...props,
       children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUpIcon, { className: "size-4" })
     }
@@ -319,7 +319,7 @@ function SelectScrollDownButton({
     SelectPrimitive__namespace.ScrollDownButton,
     {
       "data-slot": "select-scroll-down-button",
-      className: chunkDWD754BX_cjs.cn("flex cursor-default items-center justify-center py-1", className),
+      className: chunkOHIB3TEN_cjs.cn("flex cursor-default items-center justify-center py-1", className),
       ...props,
       children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "size-4" })
     }

package/dist/chunk-JD4J3RDN.cjs

@@ -0,0 +1,132 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/ui/theme/themeScript.tsx
+var themeScript = (defaultTheme, storageKey, attribute, themes, value, forcedTheme, enableSystem, enableColorScheme) => {
+  const el = document.documentElement;
+  function updateDOM(theme) {
+    const attributes = Array.isArray(attribute) ? attribute : [attribute];
+    attributes.forEach((attr) => {
+      const isClass = attr === "class";
+      const classes = isClass && value ? themes.map((t) => value[t] || t) : themes;
+      if (isClass) {
+        el.classList.remove(...classes);
+        el.classList.add(value && value[theme] ? value[theme] : theme);
+      } else {
+        el.setAttribute(attr, theme);
+      }
+    });
+    setColorScheme(theme);
+  }
+  function setColorScheme(theme) {
+    if (enableColorScheme) {
+      const isDark = theme.includes("dark");
+      el.style.colorScheme = isDark ? "dark" : "light";
+    }
+  }
+  function parseOldTheme(oldTheme) {
+    if (oldTheme === "system") {
+      return { baseTheme: "system", isLiquid: false };
+    }
+    if (oldTheme.startsWith("liquid-")) {
+      const base = oldTheme.replace("liquid-", "");
+      return { baseTheme: base, isLiquid: true };
+    }
+    return { baseTheme: oldTheme, isLiquid: false };
+  }
+  function computeTheme(baseTheme, isLiquid, systemIsDark) {
+    let resolvedBase;
+    if (baseTheme === "system") {
+      resolvedBase = systemIsDark ? "dark" : "light";
+    } else {
+      resolvedBase = baseTheme;
+    }
+    return isLiquid ? `liquid-${resolvedBase}` : resolvedBase;
+  }
+  function getStoredState() {
+    try {
+      const baseTheme = localStorage.getItem(`${storageKey}-base`);
+      const isLiquid = localStorage.getItem(`${storageKey}-liquid`);
+      if (baseTheme !== null && isLiquid !== null) {
+        return {
+          baseTheme,
+          isLiquid: isLiquid === "true"
+        };
+      }
+      const oldTheme = localStorage.getItem(storageKey);
+      if (oldTheme) {
+        return parseOldTheme(oldTheme);
+      }
+      const defaultBaseTheme = enableSystem ? "system" : "light";
+      return {
+        baseTheme: defaultBaseTheme,
+        isLiquid: true
+      };
+    } catch {
+      const defaultBaseTheme = enableSystem ? "system" : "light";
+      return {
+        baseTheme: defaultBaseTheme,
+        isLiquid: true
+      };
+    }
+  }
+  if (forcedTheme) {
+    updateDOM(forcedTheme);
+  } else {
+    const { baseTheme, isLiquid } = getStoredState();
+    const hasStoredBase = localStorage.getItem(`${storageKey}-base`) !== null;
+    const hasStoredLiquid = localStorage.getItem(`${storageKey}-liquid`) !== null;
+    if (!hasStoredBase || !hasStoredLiquid) {
+      try {
+        if (!hasStoredBase) {
+          localStorage.setItem(`${storageKey}-base`, baseTheme);
+        }
+        if (!hasStoredLiquid) {
+          localStorage.setItem(`${storageKey}-liquid`, String(isLiquid));
+        }
+      } catch {
+      }
+    }
+    const systemIsDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    const computedTheme = computeTheme(baseTheme, isLiquid, systemIsDark);
+    updateDOM(computedTheme);
+  }
+};
+var ThemeScript = react.memo(
+  ({
+    forcedTheme,
+    storageKey,
+    attribute,
+    enableSystem,
+    enableColorScheme,
+    defaultTheme,
+    value,
+    themes,
+    nonce,
+    scriptProps
+  }) => {
+    const scriptArgs = JSON.stringify([
+      defaultTheme,
+      storageKey,
+      attribute,
+      themes,
+      value,
+      forcedTheme,
+      enableSystem,
+      enableColorScheme
+    ]).slice(1, -1);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "script",
+      {
+        ...scriptProps,
+        suppressHydrationWarning: true,
+        nonce: typeof window === "undefined" ? nonce : "",
+        dangerouslySetInnerHTML: { __html: `(${themeScript.toString()})(${scriptArgs})` }
+      }
+    );
+  }
+);
+
+exports.ThemeScript = ThemeScript;

package/dist/chunk-JM6NBUDT.cjs

@@ -0,0 +1,259 @@
+'use strict';
+
+var chunkJD4J3RDN_cjs = require('./chunk-JD4J3RDN.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var colorSchemes = ["light", "dark"];
+var MEDIA = "(prefers-color-scheme: dark)";
+var isServer = typeof window === "undefined";
+var ThemeContext = react.createContext(void 0);
+var saveToLS = (key, value) => {
+  try {
+    localStorage.setItem(key, value);
+  } catch {
+  }
+};
+var getFromLS = (key, fallback) => {
+  if (isServer) return fallback;
+  try {
+    return localStorage.getItem(key) || fallback;
+  } catch {
+    return fallback;
+  }
+};
+var computeTheme = (baseTheme, isLiquid, systemIsDark) => {
+  let resolvedBase;
+  if (baseTheme === "system") {
+    resolvedBase = systemIsDark ? "dark" : "light";
+  } else {
+    resolvedBase = baseTheme;
+  }
+  return isLiquid ? `liquid-${resolvedBase}` : resolvedBase;
+};
+var parseOldTheme = (oldTheme) => {
+  if (oldTheme === "system") {
+    return { baseTheme: "system", isLiquid: false };
+  }
+  if (oldTheme.startsWith("liquid-")) {
+    const base = oldTheme.replace("liquid-", "");
+    return { baseTheme: base, isLiquid: true };
+  }
+  return { baseTheme: oldTheme, isLiquid: false };
+};
+var useTheme = () => {
+  const context = react.useContext(ThemeContext);
+  if (context === void 0) throw new Error("useTheme must be used within a ThemeProvider");
+  return context;
+};
+var ThemeProvider = (props) => {
+  const context = react.useContext(ThemeContext);
+  if (context) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: props.children });
+  return /* @__PURE__ */ jsxRuntime.jsx(Theme, { ...props });
+};
+var defaultThemes = ["light", "dark", "liquid-light", "liquid-dark"];
+var Theme = ({
+  forcedTheme,
+  disableTransitionOnChange = false,
+  enableSystem = true,
+  enableColorScheme = false,
+  storageKey = "vuer-uikit-theme",
+  defaultBaseTheme = enableSystem ? "system" : "light",
+  defaultIsLiquid = true,
+  attribute = "class",
+  value,
+  children,
+  nonce,
+  scriptProps
+}) => {
+  const themes = defaultThemes;
+  const initialState = react.useMemo(() => {
+    return { baseTheme: defaultBaseTheme, isLiquid: defaultIsLiquid };
+  }, [defaultBaseTheme, defaultIsLiquid]);
+  const [baseTheme, setBaseThemeState] = react.useState(() => {
+    const stored = getFromLS(`${storageKey}-base`, "");
+    if (!stored) {
+      return initialState.baseTheme;
+    }
+    return ["light", "dark", "system"].includes(stored) ? stored : initialState.baseTheme;
+  });
+  const [isLiquid, setIsLiquidState] = react.useState(() => {
+    const stored = getFromLS(`${storageKey}-liquid`, "");
+    if (!stored) {
+      return initialState.isLiquid;
+    }
+    return stored === "true";
+  });
+  const [systemIsDark, setSystemIsDark] = react.useState(() => {
+    if (isServer) {
+      return false;
+    }
+    return window.matchMedia(MEDIA).matches;
+  });
+  const attrs = !value ? themes : Object.values(value);
+  const computedTheme = react.useMemo(
+    () => computeTheme(baseTheme, isLiquid, systemIsDark),
+    [baseTheme, isLiquid, systemIsDark]
+  );
+  const resolvedTheme = react.useMemo(() => {
+    if (forcedTheme) {
+      const parsed = parseOldTheme(forcedTheme);
+      return computeTheme(parsed.baseTheme, parsed.isLiquid, systemIsDark);
+    }
+    return computedTheme;
+  }, [forcedTheme, computedTheme, systemIsDark]);
+  const applyTheme = react.useCallback(
+    (theme) => {
+      if (!theme) return;
+      const name = value ? value[theme] : theme;
+      const enable = disableTransitionOnChange ? disableAnimation(nonce) : null;
+      const d = document.documentElement;
+      const handleAttribute = (attr) => {
+        if (attr === "class") {
+          d.classList.remove(...attrs);
+          if (name) d.classList.add(name);
+        } else if (attr.startsWith("data-")) {
+          if (name) {
+            d.setAttribute(attr, name);
+          } else {
+            d.removeAttribute(attr);
+          }
+        }
+      };
+      if (Array.isArray(attribute)) attribute.forEach(handleAttribute);
+      else handleAttribute(attribute);
+      if (enableColorScheme) {
+        const isDark = theme.includes("dark");
+        d.style.colorScheme = isDark ? "dark" : "light";
+      }
+      enable?.();
+    },
+    [attribute, attrs, disableTransitionOnChange, enableColorScheme, nonce, value]
+  );
+  const setBaseTheme = react.useCallback((newBaseTheme) => {
+    setBaseThemeState(newBaseTheme);
+    saveToLS(`${storageKey}-base`, newBaseTheme);
+  }, [storageKey]);
+  const toggleLiquid = react.useCallback(() => {
+    setIsLiquidState((prev) => {
+      const newValue = !prev;
+      saveToLS(`${storageKey}-liquid`, String(newValue));
+      return newValue;
+    });
+  }, [storageKey]);
+  const handleMediaQuery = react.useCallback(
+    (e) => {
+      const isDark = e.matches;
+      setSystemIsDark(isDark);
+    },
+    []
+  );
+  react.useEffect(() => {
+    const media = window.matchMedia(MEDIA);
+    media.addListener(handleMediaQuery);
+    handleMediaQuery(media);
+    return () => media.removeListener(handleMediaQuery);
+  }, [handleMediaQuery]);
+  react.useEffect(() => {
+    const handleStorage = (e) => {
+      if (e.key === `${storageKey}-base` && e.newValue) {
+        setBaseThemeState(e.newValue);
+      } else if (e.key === `${storageKey}-liquid` && e.newValue !== null) {
+        setIsLiquidState(e.newValue === "true");
+      }
+    };
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
+  }, [storageKey]);
+  react.useEffect(() => {
+    applyTheme(resolvedTheme);
+  }, [applyTheme, resolvedTheme]);
+  const contextValue = react.useMemo(
+    () => ({
+      baseTheme,
+      setBaseTheme,
+      isLiquid,
+      toggleLiquid,
+      computedTheme,
+      resolvedTheme,
+      systemTheme: enableSystem ? systemIsDark ? "dark" : "light" : void 0,
+      forcedTheme,
+      storageKey
+    }),
+    [
+      baseTheme,
+      setBaseTheme,
+      isLiquid,
+      toggleLiquid,
+      computedTheme,
+      resolvedTheme,
+      systemIsDark,
+      enableSystem,
+      forcedTheme,
+      storageKey
+    ]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(ThemeContext.Provider, { value: contextValue, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      chunkJD4J3RDN_cjs.ThemeScript,
+      {
+        ...{
+          forcedTheme,
+          storageKey,
+          attribute,
+          enableSystem,
+          enableColorScheme,
+          defaultTheme: initialState.baseTheme === "system" ? "system" : initialState.isLiquid ? `liquid-${initialState.baseTheme}` : initialState.baseTheme,
+          value,
+          themes,
+          nonce,
+          scriptProps
+        }
+      }
+    ),
+    children
+  ] });
+};
+var getTheme = (key, fallback) => {
+  return getFromLS(key, fallback);
+};
+var disableAnimation = (nonce) => {
+  const css = document.createElement("style");
+  if (nonce) css.setAttribute("nonce", nonce);
+  css.appendChild(
+    document.createTextNode(
+      `*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}`
+    )
+  );
+  document.head.appendChild(css);
+  return () => {
+    (() => window.getComputedStyle(document.body))();
+    setTimeout(() => {
+      if (css && css.parentNode) {
+        css.parentNode.removeChild(css);
+      }
+    }, 1);
+  };
+};
+var getSystemTheme = (e) => {
+  if (isServer) return "liquid-light";
+  if (!e) e = window.matchMedia(MEDIA);
+  const isDark = e.matches;
+  return isDark ? "liquid-dark" : "liquid-light";
+};
+
+exports.MEDIA = MEDIA;
+exports.Theme = Theme;
+exports.ThemeContext = ThemeContext;
+exports.ThemeProvider = ThemeProvider;
+exports.colorSchemes = colorSchemes;
+exports.computeTheme = computeTheme;
+exports.defaultThemes = defaultThemes;
+exports.disableAnimation = disableAnimation;
+exports.getFromLS = getFromLS;
+exports.getSystemTheme = getSystemTheme;
+exports.getTheme = getTheme;
+exports.isServer = isServer;
+exports.parseOldTheme = parseOldTheme;
+exports.saveToLS = saveToLS;
+exports.useTheme = useTheme;

package/dist/{chunk-YTM334QC.mjs → chunk-JRBTIFM6.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-KVFUDYD3.mjs';
+import { cn } from './chunk-HMN4IKTG.mjs';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import * as React from 'react';

package/dist/chunk-JWKOW2OV.mjs

@@ -0,0 +1,75 @@
+import { useState, useMemo } from 'react';
+
+// src/ui/waterfall/hooks/useTimelineState.tsx
+function useTimelineState(logData) {
+  const [expandedItems, setExpandedItems] = useState(() => {
+    const initial = /* @__PURE__ */ new Set();
+    logData.forEach((item) => {
+      if (item.isCollapsible) initial.add(item.id);
+    });
+    return initial;
+  });
+  const [hoveredId, setHoveredId] = useState(null);
+  const toggleItem = (id) => {
+    setExpandedItems((prev) => {
+      const newSet = new Set(prev);
+      if (newSet.has(id)) {
+        newSet.delete(id);
+      } else {
+        newSet.add(id);
+      }
+      return newSet;
+    });
+  };
+  const childrenMap = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    logData.forEach((item) => {
+      if (!map.has(item.parentId)) {
+        map.set(item.parentId, []);
+      }
+      map.get(item.parentId).push(item);
+    });
+    return map;
+  }, [logData]);
+  const logDataWithMeta = useMemo(() => {
+    const dataMap = new Map(logData.map((item) => [item.id, item]));
+    const getAncestors = (item) => {
+      const ancestors = [];
+      let current = item.parentId;
+      while (current) {
+        const parent = dataMap.get(current);
+        if (parent) {
+          ancestors.unshift(parent);
+          current = parent.parentId;
+        } else {
+          break;
+        }
+      }
+      return ancestors;
+    };
+    return logData.map((item) => {
+      const siblings = childrenMap.get(item.parentId) || [];
+      const isLast = siblings.length > 0 && siblings[siblings.length - 1].id === item.id;
+      const ancestors = getAncestors(item);
+      return { ...item, isLast, ancestors };
+    });
+  }, [childrenMap, logData]);
+  const isVisible = (item) => {
+    return item.ancestors.every(
+      (ancestor) => !ancestor.isCollapsible || expandedItems.has(ancestor.id)
+    );
+  };
+  const getVisibleLogData = (filteredData) => {
+    return filteredData.filter(isVisible);
+  };
+  return {
+    expandedItems,
+    hoveredId,
+    setHoveredId,
+    toggleItem,
+    logDataWithMeta,
+    getVisibleLogData
+  };
+}
+
+export { useTimelineState };

package/dist/{chunk-IWPVLQSF.mjs → chunk-JXALL32A.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-KVFUDYD3.mjs';
+import { cn } from './chunk-HMN4IKTG.mjs';
 import { composeRefs } from '@radix-ui/react-compose-refs';
 import { cva } from 'class-variance-authority';
 import { forwardRef, useRef } from 'react';

package/dist/{chunk-FWH3ACEX.mjs → chunk-JY5TZBRK.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-KVFUDYD3.mjs';
+import { cn } from './chunk-HMN4IKTG.mjs';
 import { GripVerticalIcon } from 'lucide-react';
 import * as ResizablePrimitive from 'react-resizable-panels';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/dist/chunk-K22BEXUA.mjs

@@ -0,0 +1,36 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+// src/ui/waterfall/Tick.tsx
+function Tick({ time, label, timeToPercent, zIndex = 10 }) {
+  const naturalCenterPercent = timeToPercent(time);
+  if (naturalCenterPercent < -20 || naturalCenterPercent > 120) {
+    return null;
+  }
+  const labelHalfWidthPercent = 3;
+  const clampedCenterPercent = Math.min(
+    100 - labelHalfWidthPercent,
+    Math.max(labelHalfWidthPercent, naturalCenterPercent)
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "bg-line-primary absolute top-0 h-full w-px",
+        style: { left: `${naturalCenterPercent}%` }
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "bg-bg-primary text-text-secondary rounded-uk-xs text-uk-sm pointer-events-none absolute top-1/2 -translate-x-1/2 -translate-y-1/2 px-1 backdrop-blur-sm",
+        style: {
+          left: `${clampedCenterPercent}%`,
+          zIndex
+        },
+        children: label
+      }
+    )
+  ] });
+}
+
+export { Tick };

package/dist/chunk-K6KHDM35.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+var chunkT2RTITL6_cjs = require('./chunk-T2RTITL6.cjs');
+var chunkNSQOQD43_cjs = require('./chunk-NSQOQD43.cjs');
+var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var PresetsInput = react.forwardRef(function PresetsInput2({ presets, value = 0, onChange, size, className, ...props }, ref) {
+  const [preset, setPreset] = react.useState(value);
+  const handleValueChange = (values) => {
+    const newValue = values[0];
+    setPreset(newValue);
+    onChange?.(newValue);
+  };
+  const handlePresetClick = (presetValue) => {
+    setPreset(presetValue);
+    onChange?.(presetValue);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkOHIB3TEN_cjs.cn("gap-xs grid grid-cols-5", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+      chunkT2RTITL6_cjs.InputNumbers,
+      {
+        ...props,
+        ref,
+        size,
+        value: [preset],
+        onValuesChange: handleValueChange
+      }
+    ) }),
+    presets.map((p, i) => {
+      return /* @__PURE__ */ jsxRuntime.jsx(chunkNSQOQD43_cjs.Button, { size, variant: "secondary", className: "h-6", onClick: () => handlePresetClick(p), children: p }, i);
+    })
+  ] });
+});
+
+exports.PresetsInput = PresetsInput;