@vuer-ai/vuer-uikit 0.0.121 → 0.1.0

package/dist/{chunk-FUMJBAQI.mjs → chunk-HNW2DRPV.mjs}

@@ -13,11 +13,7 @@ var cardVariants = cva(
     "rounded-uk-xl",
     "bg-bg-primary",
     "liquid-dark:liquid-dark-bg",
-    "liquid-dark:border-[0.9px]",
-    "liquid-dark:border-[rgba(85,85,85,100)]",
-    "liquid-light:liquid-light-bg",
-    "liquid-light:border-[0.8px]",
-    "liquid-light:border-[white]"
+    "liquid-light:liquid-light-bg"
   ],
   {
     variants: {
@@ -53,7 +49,7 @@ function Card({
           ...props,
           children: [
             collapsedContent,
-            /* @__PURE__ */ jsx("div", { className: "right-lg absolute top-1/2 -translate-y-1/2", children: /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx("div", { className: "right-lg absolute top-1/2 h-6 -translate-y-1/2", children: /* @__PURE__ */ jsx(
               Button,
               {
                 variant: "ghost",

package/dist/{chunk-YAFKQ5ZV.cjs → chunk-HSUL5OUG.cjs}

@@ -101,6 +101,7 @@ function SelectTrigger({
   state,
   font,
   align,
+  icon,
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -121,7 +122,7 @@ function SelectTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "opacity-50" }) })
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: icon || /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "opacity-50" }) })
       ]
     }
   );

package/dist/{chunk-KKGDRIR2.cjs → chunk-I2COLDHC.cjs}

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

package/dist/{chunk-E7ACJ3NX.cjs → chunk-IAWMCOHS.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkQF3JWGWX_cjs = require('./chunk-QF3JWGWX.cjs');
+var chunk2KBNQ5PY_cjs = require('./chunk-2KBNQ5PY.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -31,7 +31,7 @@ var EulerRadInput = react.forwardRef(function EulerRadInput2({ value, onValuesCh
   }, [display]);
   const labels = [`x${unitSymbol}`, `y${unitSymbol}`, `z${unitSymbol}`];
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkQF3JWGWX_cjs.VectorInput,
+    chunk2KBNQ5PY_cjs.VectorInput,
     {
       ref,
       value: displayValues,

package/dist/{chunk-PC42NEBI.mjs → chunk-ITOTSGSL.mjs}

@@ -1,4 +1,4 @@
-import { InputNumbers } from './chunk-HGN7J4CP.mjs';
+import { InputNumbers } from './chunk-D2LUQKPM.mjs';
 import { forwardRef, useMemo } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-CEYNTMQP.mjs → chunk-IYTGWOZY.mjs}

@@ -1,4 +1,4 @@
-import { VectorInput } from './chunk-HUPECWNG.mjs';
+import { VectorInput } from './chunk-V4THHKSO.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/chunk-J74A5LNZ.cjs

@@ -0,0 +1,179 @@
+'use strict';
+
+var react = require('react');
+
+// src/ui/virtual-grid/useVirtualGrid.ts
+function getHeight(rowHeight, rowIndex) {
+  return typeof rowHeight === "function" ? rowHeight(rowIndex) : rowHeight;
+}
+function getWidth(columnWidth, colIndex) {
+  return typeof columnWidth === "function" ? columnWidth(colIndex) : columnWidth;
+}
+function findStartIndex(count, scrollOffset, getSize) {
+  if (count === 0) return 0;
+  let offset = 0;
+  let low = 0;
+  let high = count - 1;
+  while (low <= high) {
+    const mid = Math.floor((low + high) / 2);
+    let midOffset = 0;
+    for (let i = 0; i < mid; i++) {
+      midOffset += getSize(i);
+    }
+    if (midOffset < scrollOffset) {
+      low = mid + 1;
+      offset = midOffset;
+    } else if (midOffset > scrollOffset) {
+      high = mid - 1;
+    } else {
+      return mid;
+    }
+  }
+  let index = Math.max(0, low - 1);
+  offset = 0;
+  for (let i = 0; i < index; i++) {
+    offset += getSize(i);
+  }
+  while (index < count - 1 && offset + getSize(index) <= scrollOffset) {
+    offset += getSize(index);
+    index++;
+  }
+  return index;
+}
+function useVirtualGrid({
+  rowCount,
+  columnCount,
+  rowHeight,
+  columnWidth,
+  containerWidth,
+  containerHeight,
+  scrollTop,
+  scrollLeft,
+  overscanRows,
+  overscanColumns,
+  getColSpan = () => 1,
+  getRowSpan = () => 1
+}) {
+  const getRowHeightFn = react.useCallback((index) => getHeight(rowHeight, index), [rowHeight]);
+  const getColumnWidthFn = react.useCallback(
+    (index) => getWidth(columnWidth, index),
+    [columnWidth]
+  );
+  const totalHeight = react.useMemo(() => {
+    let height = 0;
+    for (let i = 0; i < rowCount; i++) {
+      height += getRowHeightFn(i);
+    }
+    return height;
+  }, [rowCount, getRowHeightFn]);
+  const totalWidth = react.useMemo(() => {
+    let width = 0;
+    for (let i = 0; i < columnCount; i++) {
+      width += getColumnWidthFn(i);
+    }
+    return width;
+  }, [columnCount, getColumnWidthFn]);
+  const rowOffsets = react.useMemo(() => {
+    const offsets = [0];
+    for (let i = 0; i < rowCount; i++) {
+      offsets.push(offsets[i] + getRowHeightFn(i));
+    }
+    return offsets;
+  }, [rowCount, getRowHeightFn]);
+  const columnOffsets = react.useMemo(() => {
+    const offsets = [0];
+    for (let i = 0; i < columnCount; i++) {
+      offsets.push(offsets[i] + getColumnWidthFn(i));
+    }
+    return offsets;
+  }, [columnCount, getColumnWidthFn]);
+  const getRowOffset = react.useCallback((rowIndex) => rowOffsets[rowIndex] ?? 0, [rowOffsets]);
+  const getColumnOffset = react.useCallback(
+    (colIndex) => columnOffsets[colIndex] ?? 0,
+    [columnOffsets]
+  );
+  const visibleRange = react.useMemo(() => {
+    if (rowCount === 0 || columnCount === 0) {
+      return { startRow: 0, endRow: 0, startCol: 0, endCol: 0 };
+    }
+    const startRow = findStartIndex(rowCount, scrollTop, getRowHeightFn);
+    let endRow = startRow;
+    let accumulatedHeight = getRowOffset(startRow) - scrollTop;
+    while (endRow < rowCount - 1 && accumulatedHeight < containerHeight) {
+      accumulatedHeight += getRowHeightFn(endRow);
+      endRow++;
+    }
+    const startCol = findStartIndex(columnCount, scrollLeft, getColumnWidthFn);
+    let endCol = startCol;
+    let accumulatedWidth = getColumnOffset(startCol) - scrollLeft;
+    while (endCol < columnCount - 1 && accumulatedWidth < containerWidth) {
+      accumulatedWidth += getColumnWidthFn(endCol);
+      endCol++;
+    }
+    return {
+      startRow: Math.max(0, startRow - overscanRows),
+      endRow: Math.min(rowCount - 1, endRow + overscanRows),
+      startCol: Math.max(0, startCol - overscanColumns),
+      endCol: Math.min(columnCount - 1, endCol + overscanColumns)
+    };
+  }, [
+    rowCount,
+    columnCount,
+    scrollTop,
+    scrollLeft,
+    containerHeight,
+    containerWidth,
+    overscanRows,
+    overscanColumns,
+    getRowHeightFn,
+    getColumnWidthFn,
+    getRowOffset,
+    getColumnOffset
+  ]);
+  const getCellStyle = react.useCallback(
+    (row, col) => {
+      const top = getRowOffset(row);
+      const left = getColumnOffset(col);
+      const colspan = getColSpan(row, col);
+      let width = 0;
+      for (let c = col; c < col + colspan && c < columnCount; c++) {
+        width += getColumnWidthFn(c);
+      }
+      const rowspan = getRowSpan(row, col);
+      let height = 0;
+      for (let r = row; r < row + rowspan && r < rowCount; r++) {
+        height += getRowHeightFn(r);
+      }
+      return {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width,
+        height,
+        transform: `translate(${left}px, ${top}px)`
+      };
+    },
+    [
+      getRowOffset,
+      getColumnOffset,
+      getColSpan,
+      getRowSpan,
+      columnCount,
+      rowCount,
+      getColumnWidthFn,
+      getRowHeightFn
+    ]
+  );
+  return {
+    visibleRange,
+    totalWidth,
+    totalHeight,
+    getRowOffset,
+    getColumnOffset,
+    getRowHeight: getRowHeightFn,
+    getColumnWidth: getColumnWidthFn,
+    getCellStyle
+  };
+}
+
+exports.useVirtualGrid = useVirtualGrid;

package/dist/{chunk-CV2EDA3W.cjs → chunk-JDEZ6NNG.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkQF3JWGWX_cjs = require('./chunk-QF3JWGWX.cjs');
+var chunk2KBNQ5PY_cjs = require('./chunk-2KBNQ5PY.cjs');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -8,7 +8,7 @@ var EulerInput = react.forwardRef(function EulerInput2({ value, onValuesChange,
   const unitSymbol = unit === "deg" ? "\xB0" : "rad";
   const labels = [`x${unitSymbol}`, `y${unitSymbol}`, `z${unitSymbol}`];
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkQF3JWGWX_cjs.VectorInput,
+    chunk2KBNQ5PY_cjs.VectorInput,
     {
       ref,
       value,

package/dist/chunk-JEWTYDLX.cjs

@@ -0,0 +1,119 @@
+'use strict';
+
+var chunkPMG3NZF5_cjs = require('./chunk-PMG3NZF5.cjs');
+var chunk6LTCLQH3_cjs = require('./chunk-6LTCLQH3.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var ColorInput = react.forwardRef(function ColorInput2({ className, value, defaultValue, onChange, onValueChange, ...props }, ref) {
+  const normalizeColor = (colorValue) => {
+    if (colorValue === void 0 || colorValue === null) {
+      return "ffffff";
+    }
+    if (typeof colorValue === "number") {
+      if (colorValue > 16777215) {
+        const hex = colorValue.toString(16).padStart(8, "0");
+        return hex.slice(0, 6);
+      }
+      return colorValue.toString(16).padStart(6, "0");
+    }
+    if (typeof colorValue === "string") {
+      const trimmed = colorValue.trim().toLowerCase();
+      if (trimmed.startsWith("0x")) {
+        const hex = trimmed.slice(2);
+        if (hex.length > 6) {
+          return hex.slice(0, 6);
+        }
+        return hex.padStart(6, "0");
+      }
+      if (trimmed.startsWith("#")) {
+        const hex = trimmed.slice(1);
+        if (hex.length === 3) {
+          return hex.split("").map((c) => c + c).join("");
+        }
+        if (hex.length === 4) {
+          return hex.slice(0, 3).split("").map((c) => c + c).join("");
+        }
+        if (hex.length > 6) {
+          return hex.slice(0, 6);
+        }
+        return hex;
+      }
+      const rgbMatch = trimmed.match(/^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);
+      if (rgbMatch) {
+        const r = Math.min(255, parseInt(rgbMatch[1], 10)).toString(16).padStart(2, "0");
+        const g = Math.min(255, parseInt(rgbMatch[2], 10)).toString(16).padStart(2, "0");
+        const b = Math.min(255, parseInt(rgbMatch[3], 10)).toString(16).padStart(2, "0");
+        return r + g + b;
+      }
+      if (/^[0-9a-f]+$/i.test(trimmed)) {
+        if (trimmed.length === 3) {
+          return trimmed.split("").map((c) => c + c).join("");
+        }
+        if (trimmed.length > 6) {
+          return trimmed.slice(0, 6);
+        }
+        return trimmed.padStart(6, "0");
+      }
+      return trimmed;
+    }
+    return "ffffff";
+  };
+  const [color, setColor] = react.useState(normalizeColor(value || defaultValue));
+  react.useEffect(() => {
+    if (value !== void 0) {
+      setColor(normalizeColor(value));
+    }
+  }, [value]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "gap-sm flex", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        ref,
+        type: "color",
+        value: `#${color}`,
+        onChange: (e) => {
+          const newColor = e.currentTarget.value.replace(/^#/, "");
+          setColor(newColor);
+          onValueChange?.(newColor);
+          onChange?.(e);
+        },
+        className: chunk6LTCLQH3_cjs.cn(
+          [
+            "h-6",
+            "w-6",
+            "flex-none",
+            "cursor-pointer",
+            "rounded-1",
+            "[appearance:none]",
+            "[&::-webkit-color-swatch-wrapper]:p-0",
+            "[&::-webkit-color-swatch]:border-line-primary",
+            "[&::-webkit-color-swatch]:rounded-lg",
+            "[&::-moz-color-swatch]:border-line-primary",
+            "[&::-moz-color-swatch]:rounded-lg"
+          ],
+          className
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      chunkPMG3NZF5_cjs.InputRoot,
+      {
+        ...props,
+        size: "sm",
+        type: "text",
+        className: "flex-1",
+        value: color,
+        onChange: (e) => {
+          const newColor = e.currentTarget.value;
+          setColor(newColor);
+          onValueChange?.(newColor);
+          onChange?.(e);
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsx(chunkPMG3NZF5_cjs.InputSlot, { children: "#" })
+      }
+    )
+  ] });
+});
+
+exports.ColorInput = ColorInput;

package/dist/{chunk-UTHAZV2T.cjs → chunk-JTFQFULL.cjs}

@@ -15,11 +15,7 @@ var cardVariants = classVarianceAuthority.cva(
     "rounded-uk-xl",
     "bg-bg-primary",
     "liquid-dark:liquid-dark-bg",
-    "liquid-dark:border-[0.9px]",
-    "liquid-dark:border-[rgba(85,85,85,100)]",
-    "liquid-light:liquid-light-bg",
-    "liquid-light:border-[0.8px]",
-    "liquid-light:border-[white]"
+    "liquid-light:liquid-light-bg"
   ],
   {
     variants: {
@@ -55,7 +51,7 @@ function Card({
           ...props,
           children: [
             collapsedContent,
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "right-lg absolute top-1/2 -translate-y-1/2", children: /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "right-lg absolute top-1/2 h-6 -translate-y-1/2", children: /* @__PURE__ */ jsxRuntime.jsx(
               chunkR22VW3EK_cjs.Button,
               {
                 variant: "ghost",

package/dist/{chunk-GJKFQHUX.mjs → chunk-KXKUQSNY.mjs}

@@ -1,4 +1,4 @@
-import { RadInput } from './chunk-PC42NEBI.mjs';
+import { RadInput } from './chunk-ITOTSGSL.mjs';
 import { Button } from './chunk-5JYH7TXY.mjs';
 import { cn } from './chunk-HBEU2PU2.mjs';
 import { forwardRef, useState } from 'react';

package/dist/chunk-L2AKG4VJ.mjs

@@ -0,0 +1,258 @@
+import { useVirtualGrid } from './chunk-VDYJAOMN.mjs';
+import { cn } from './chunk-HBEU2PU2.mjs';
+import React, { forwardRef, useRef, useState, useCallback, useEffect, useLayoutEffect } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function VirtualGridInner({
+  data,
+  rowCount,
+  columnCount,
+  rowHeight,
+  columnWidth,
+  height,
+  width = "100%",
+  overscanRows = 2,
+  overscanColumns = 2,
+  getCellKey,
+  getColSpan,
+  getRowSpan,
+  children,
+  stickyHeader = false,
+  stickyColumn = false,
+  className,
+  style,
+  ...props
+}, ref) {
+  const containerRef = useRef(null);
+  const stickyLayerRef = useRef(null);
+  const [scrollTop, setScrollTop] = useState(0);
+  const [scrollLeft, setScrollLeft] = useState(0);
+  const [containerWidth, setContainerWidth] = useState(0);
+  const [containerHeight, setContainerHeight] = useState(0);
+  const scrollRef = useRef({ top: 0, left: 0 });
+  const setRefs = useCallback(
+    (node) => {
+      containerRef.current = node;
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+    },
+    [ref]
+  );
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        setContainerWidth(entry.contentRect.width);
+        setContainerHeight(entry.contentRect.height);
+      }
+    });
+    resizeObserver.observe(container);
+    setContainerWidth(container.clientWidth);
+    setContainerHeight(container.clientHeight);
+    return () => resizeObserver.disconnect();
+  }, []);
+  const {
+    visibleRange,
+    totalWidth,
+    totalHeight,
+    getCellStyle,
+    getRowOffset,
+    getColumnOffset,
+    getRowHeight,
+    getColumnWidth
+  } = useVirtualGrid({
+    rowCount,
+    columnCount,
+    rowHeight,
+    columnWidth,
+    containerWidth,
+    containerHeight,
+    scrollTop,
+    scrollLeft,
+    overscanRows,
+    overscanColumns,
+    getColSpan,
+    getRowSpan
+  });
+  const rafRef = useRef(null);
+  const handleScroll = useCallback((e) => {
+    const newScrollTop = e.currentTarget.scrollTop;
+    const newScrollLeft = e.currentTarget.scrollLeft;
+    scrollRef.current = { top: newScrollTop, left: newScrollLeft };
+    if (stickyLayerRef.current) {
+      stickyLayerRef.current.style.setProperty("--scroll-top", `${Math.round(newScrollTop)}px`);
+      stickyLayerRef.current.style.setProperty("--scroll-left", `${Math.round(newScrollLeft)}px`);
+    }
+    if (rafRef.current) {
+      cancelAnimationFrame(rafRef.current);
+    }
+    rafRef.current = requestAnimationFrame(() => {
+      setScrollTop(newScrollTop);
+      setScrollLeft(newScrollLeft);
+    });
+  }, []);
+  useEffect(() => {
+    return () => {
+      if (rafRef.current) {
+        cancelAnimationFrame(rafRef.current);
+      }
+    };
+  }, []);
+  useLayoutEffect(() => {
+    if (stickyLayerRef.current) {
+      stickyLayerRef.current.style.setProperty("--scroll-top", "0px");
+      stickyLayerRef.current.style.setProperty("--scroll-left", "0px");
+    }
+  }, []);
+  const coveredCells = /* @__PURE__ */ new Set();
+  if (getColSpan || getRowSpan) {
+    for (let row = visibleRange.startRow; row <= visibleRange.endRow; row++) {
+      for (let col = visibleRange.startCol; col <= visibleRange.endCol; col++) {
+        const colspan = getColSpan?.(row, col) ?? 1;
+        const rowspan = getRowSpan?.(row, col) ?? 1;
+        if (colspan > 1 || rowspan > 1) {
+          for (let r = row; r < row + rowspan; r++) {
+            for (let c = col; c < col + colspan; c++) {
+              if (r !== row || c !== col) {
+                coveredCells.add(`${r}-${c}`);
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+  const visibleCells = [];
+  for (let row = visibleRange.startRow; row <= visibleRange.endRow && row < rowCount; row++) {
+    for (let col = visibleRange.startCol; col <= visibleRange.endCol && col < columnCount; col++) {
+      if (coveredCells.has(`${row}-${col}`)) {
+        continue;
+      }
+      if (stickyHeader && row === 0 || stickyColumn && col === 0) {
+        continue;
+      }
+      const cellData = data[row]?.[col];
+      const key = getCellKey ? getCellKey(row, col) : `${row}-${col}`;
+      const cellStyle = getCellStyle(row, col);
+      visibleCells.push(
+        /* @__PURE__ */ jsx(React.Fragment, { children: children(cellData, row, col, cellStyle) }, key)
+      );
+    }
+  }
+  const stickyContentStyle = { width: "100%", height: "100%" };
+  const stickyHeaderCells = [];
+  if (stickyHeader && rowCount > 0) {
+    for (let col = visibleRange.startCol; col <= visibleRange.endCol && col < columnCount; col++) {
+      if (stickyColumn && col === 0) continue;
+      if (coveredCells.has(`0-${col}`)) continue;
+      const cellData = data[0]?.[col];
+      const key = getCellKey ? getCellKey(0, col) : `header-${col}`;
+      stickyHeaderCells.push(
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "sticky-header-cell",
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: getColumnWidth(col),
+              height: getRowHeight(0),
+              transform: `translate3d(${getColumnOffset(col)}px, var(--scroll-top, 0px), 0)`,
+              willChange: "transform",
+              zIndex: 2
+            },
+            children: children(cellData, 0, col, stickyContentStyle)
+          },
+          key
+        )
+      );
+    }
+  }
+  const stickyColumnCells = [];
+  if (stickyColumn && columnCount > 0) {
+    for (let row = visibleRange.startRow; row <= visibleRange.endRow && row < rowCount; row++) {
+      if (stickyHeader && row === 0) continue;
+      if (coveredCells.has(`${row}-0`)) continue;
+      const cellData = data[row]?.[0];
+      const key = getCellKey ? getCellKey(row, 0) : `sticky-col-${row}`;
+      stickyColumnCells.push(
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "sticky-column-cell",
+            style: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: getColumnWidth(0),
+              height: getRowHeight(row),
+              transform: `translate3d(var(--scroll-left, 0px), ${getRowOffset(row)}px, 0)`,
+              willChange: "transform",
+              zIndex: 2
+            },
+            children: children(cellData, row, 0, stickyContentStyle)
+          },
+          key
+        )
+      );
+    }
+  }
+  const stickyCornerCell = stickyHeader && stickyColumn && rowCount > 0 && columnCount > 0 ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "sticky-corner-cell",
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: getColumnWidth(0),
+        height: getRowHeight(0),
+        transform: `translate3d(var(--scroll-left, 0px), var(--scroll-top, 0px), 0)`,
+        willChange: "transform",
+        zIndex: 3
+      },
+      children: children(data[0]?.[0], 0, 0, stickyContentStyle)
+    },
+    "sticky-corner"
+  ) : null;
+  const hasStickyElements = stickyHeader || stickyColumn;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setRefs,
+      className: cn("relative overflow-auto", className),
+      style: {
+        height,
+        width,
+        ...style
+      },
+      onScroll: handleScroll,
+      ...props,
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref: hasStickyElements ? stickyLayerRef : void 0,
+          style: {
+            height: totalHeight,
+            width: totalWidth,
+            position: "relative"
+          },
+          children: [
+            stickyCornerCell,
+            stickyHeaderCells,
+            stickyColumnCells,
+            visibleCells
+          ]
+        }
+      )
+    }
+  );
+}
+var VirtualGrid = forwardRef(VirtualGridInner);
+
+export { VirtualGrid };

package/dist/{chunk-7MR3M2HW.mjs → chunk-L2DME42Q.mjs}

@@ -1,4 +1,4 @@
-import { VectorInput } from './chunk-HUPECWNG.mjs';
+import { VectorInput } from './chunk-V4THHKSO.mjs';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';