@hanzo/ui 5.3.25 → 5.3.28

package/dist/3d/carousel.mjs

@@ -1,344 +0,0 @@
-"use client";
-import * as React from 'react';
-import { ChevronLeft, ChevronRight } from 'lucide-react';
-import { cn } from '@hanzo/ui/lib/utils';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var Carousel3D = React.forwardRef(
-  ({
-    items,
-    itemWidth = 300,
-    itemHeight = 400,
-    spacing = 80,
-    perspective = 1e3,
-    rotateY = 40,
-    autoRotate = false,
-    autoRotateSpeed = 3e3,
-    showControls = true,
-    infinite = true,
-    className,
-    ...props
-  }, ref) => {
-    const containerRef = React.useRef(null);
-    const [currentIndex, setCurrentIndex] = React.useState(0);
-    const [isHovered, setIsHovered] = React.useState(false);
-    const [isDragging, setIsDragging] = React.useState(false);
-    const [dragStart, setDragStart] = React.useState({ x: 0, y: 0 });
-    const [dragOffset, setDragOffset] = React.useState(0);
-    const autoRotateRef = React.useRef(void 0);
-    const totalItems = items.length;
-    const radius = (itemWidth + spacing) / 2 / Math.tan(Math.PI / totalItems);
-    React.useEffect(() => {
-      if (autoRotate && !isHovered && !isDragging) {
-        autoRotateRef.current = setInterval(() => {
-          setCurrentIndex((prev) => (prev + 1) % totalItems);
-        }, autoRotateSpeed);
-      } else {
-        if (autoRotateRef.current) {
-          clearInterval(autoRotateRef.current);
-        }
-      }
-      return () => {
-        if (autoRotateRef.current) {
-          clearInterval(autoRotateRef.current);
-        }
-      };
-    }, [autoRotate, isHovered, isDragging, autoRotateSpeed, totalItems]);
-    const goToPrevious = React.useCallback(() => {
-      setCurrentIndex(
-        (prev) => infinite ? (prev - 1 + totalItems) % totalItems : Math.max(0, prev - 1)
-      );
-    }, [infinite, totalItems]);
-    const goToNext = React.useCallback(() => {
-      setCurrentIndex(
-        (prev) => infinite ? (prev + 1) % totalItems : Math.min(totalItems - 1, prev + 1)
-      );
-    }, [infinite, totalItems]);
-    const goToIndex = React.useCallback(
-      (index) => {
-        setCurrentIndex(Math.max(0, Math.min(totalItems - 1, index)));
-      },
-      [totalItems]
-    );
-    const handleDragStart = React.useCallback(
-      (clientX, clientY) => {
-        setIsDragging(true);
-        setDragStart({ x: clientX, y: clientY });
-        setDragOffset(0);
-      },
-      []
-    );
-    const handleDragMove = React.useCallback(
-      (clientX, clientY) => {
-        if (!isDragging) return;
-        const deltaX = clientX - dragStart.x;
-        const sensitivity = 0.5;
-        const newOffset = deltaX * sensitivity;
-        setDragOffset(newOffset);
-      },
-      [isDragging, dragStart.x]
-    );
-    const handleDragEnd = React.useCallback(() => {
-      if (!isDragging) return;
-      const threshold = 50;
-      if (Math.abs(dragOffset) > threshold) {
-        if (dragOffset > 0) {
-          goToPrevious();
-        } else {
-          goToNext();
-        }
-      }
-      setIsDragging(false);
-      setDragOffset(0);
-    }, [isDragging, dragOffset, goToPrevious, goToNext]);
-    const handleMouseDown = React.useCallback(
-      (e) => {
-        e.preventDefault();
-        handleDragStart(e.clientX, e.clientY);
-      },
-      [handleDragStart]
-    );
-    const handleMouseMove = React.useCallback(
-      (e) => {
-        handleDragMove(e.clientX, e.clientY);
-      },
-      [handleDragMove]
-    );
-    const handleMouseUp = React.useCallback(() => {
-      handleDragEnd();
-    }, [handleDragEnd]);
-    const handleTouchStart = React.useCallback(
-      (e) => {
-        if (e.touches.length === 1) {
-          const touch = e.touches[0];
-          handleDragStart(touch.clientX, touch.clientY);
-        }
-      },
-      [handleDragStart]
-    );
-    const handleTouchMove = React.useCallback(
-      (e) => {
-        if (e.touches.length === 1) {
-          e.preventDefault();
-          const touch = e.touches[0];
-          handleDragMove(touch.clientX, touch.clientY);
-        }
-      },
-      [handleDragMove]
-    );
-    const handleTouchEnd = React.useCallback(() => {
-      handleDragEnd();
-    }, [handleDragEnd]);
-    React.useEffect(() => {
-      const handleKeyDown = /* @__PURE__ */ __name((e) => {
-        if (e.key === "ArrowLeft") {
-          e.preventDefault();
-          goToPrevious();
-        } else if (e.key === "ArrowRight") {
-          e.preventDefault();
-          goToNext();
-        } else if (e.key >= "1" && e.key <= "9") {
-          const index = parseInt(e.key) - 1;
-          if (index < totalItems) {
-            goToIndex(index);
-          }
-        }
-      }, "handleKeyDown");
-      if (containerRef.current) {
-        containerRef.current.addEventListener("keydown", handleKeyDown);
-        return () => {
-          containerRef.current?.removeEventListener("keydown", handleKeyDown);
-        };
-      }
-    }, [goToPrevious, goToNext, goToIndex, totalItems]);
-    React.useImperativeHandle(ref, () => containerRef.current);
-    const containerStyle = {
-      perspective: `${perspective}px`,
-      height: `${itemHeight + 100}px`
-    };
-    const carouselStyle = {
-      transform: `translateZ(-${radius}px) rotateY(${-currentIndex * (360 / totalItems) + dragOffset / 5}deg)`,
-      transition: isDragging ? "none" : "transform 0.6s cubic-bezier(0.4, 0.0, 0.2, 1)",
-      transformStyle: "preserve-3d"
-    };
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref: containerRef,
-        className: cn(
-          "relative w-full select-none focus:outline-none",
-          className
-        ),
-        style: containerStyle,
-        onMouseEnter: () => setIsHovered(true),
-        onMouseLeave: () => setIsHovered(false),
-        onMouseDown: handleMouseDown,
-        onMouseMove: handleMouseMove,
-        onMouseUp: handleMouseUp,
-        onTouchStart: handleTouchStart,
-        onTouchMove: handleTouchMove,
-        onTouchEnd: handleTouchEnd,
-        tabIndex: 0,
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "relative mx-auto",
-              style: {
-                width: `${itemWidth}px`,
-                height: `${itemHeight}px`,
-                transformStyle: "preserve-3d"
-              },
-              children: /* @__PURE__ */ jsx("div", { className: "absolute inset-0", style: carouselStyle, children: items.map((item, index) => {
-                const angle = index / totalItems * 360;
-                const isCurrent = index === currentIndex;
-                const itemStyle = {
-                  transform: `rotateY(${angle}deg) translateZ(${radius}px)`,
-                  width: `${itemWidth}px`,
-                  height: `${itemHeight}px`,
-                  position: "absolute",
-                  backfaceVisibility: "hidden",
-                  transformStyle: "preserve-3d"
-                };
-                return /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "rounded-lg border bg-card text-card-foreground shadow-lg cursor-pointer",
-                      "transition-all duration-300 transform-gpu will-change-transform",
-                      isCurrent && "ring-2 ring-primary ring-offset-2"
-                    ),
-                    style: itemStyle,
-                    onClick: () => goToIndex(index),
-                    children: /* @__PURE__ */ jsx("div", { className: "w-full h-full overflow-hidden rounded-lg", children: item.content })
-                  },
-                  item.id
-                );
-              }) })
-            }
-          ),
-          showControls && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: cn(
-                  "absolute left-4 top-1/2 -translate-y-1/2 z-10",
-                  "p-2 rounded-full bg-background/80 backdrop-blur-sm",
-                  "border shadow-lg hover:bg-background transition-all",
-                  "disabled:opacity-50 disabled:cursor-not-allowed"
-                ),
-                onClick: goToPrevious,
-                disabled: !infinite && currentIndex === 0,
-                "aria-label": "Previous item",
-                children: /* @__PURE__ */ jsx(ChevronLeft, { className: "w-5 h-5" })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                className: cn(
-                  "absolute right-4 top-1/2 -translate-y-1/2 z-10",
-                  "p-2 rounded-full bg-background/80 backdrop-blur-sm",
-                  "border shadow-lg hover:bg-background transition-all",
-                  "disabled:opacity-50 disabled:cursor-not-allowed"
-                ),
-                onClick: goToNext,
-                disabled: !infinite && currentIndex === totalItems - 1,
-                "aria-label": "Next item",
-                children: /* @__PURE__ */ jsx(ChevronRight, { className: "w-5 h-5" })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 z-10", children: /* @__PURE__ */ jsx("div", { className: "flex space-x-2 p-2 rounded-full bg-background/80 backdrop-blur-sm border shadow-lg", children: items.map((_, index) => /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: cn(
-                "w-2 h-2 rounded-full transition-all",
-                index === currentIndex ? "bg-primary scale-125" : "bg-muted-foreground/50 hover:bg-muted-foreground/75"
-              ),
-              onClick: () => goToIndex(index),
-              "aria-label": `Go to item ${index + 1}`
-            },
-            index
-          )) }) }),
-          autoRotate && /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2 p-2 rounded-full bg-background/80 backdrop-blur-sm border shadow-sm", children: [
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: cn(
-                  "w-2 h-2 rounded-full transition-all",
-                  isHovered || isDragging ? "bg-orange-500" : "bg-green-500 animate-pulse"
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: isHovered || isDragging ? "Paused" : "Auto" })
-          ] }) })
-        ]
-      }
-    );
-  }
-);
-Carousel3D.displayName = "Carousel3D";
-var Carousel3DCard = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    ref,
-    className: cn(
-      "w-full h-full flex flex-col bg-gradient-to-br from-background to-muted/20",
-      "border rounded-lg overflow-hidden group",
-      className
-    ),
-    ...props,
-    children
-  }
-));
-Carousel3DCard.displayName = "Carousel3DCard";
-var Carousel3DCardImage = React.forwardRef(({ className, alt, ...props }, ref) => /* @__PURE__ */ jsx(
-  "img",
-  {
-    ref,
-    className: cn(
-      "w-full h-48 object-cover transition-transform duration-300",
-      "group-hover:scale-105",
-      className
-    ),
-    alt,
-    ...props
-  }
-));
-Carousel3DCardImage.displayName = "Carousel3DCardImage";
-var Carousel3DCardContent = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    ref,
-    className: cn("flex-1 p-4 flex flex-col justify-between", className),
-    ...props,
-    children
-  }
-));
-Carousel3DCardContent.displayName = "Carousel3DCardContent";
-var Carousel3DCardTitle = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  "h3",
-  {
-    ref,
-    className: cn("font-semibold text-lg mb-2 line-clamp-2", className),
-    ...props,
-    children
-  }
-));
-Carousel3DCardTitle.displayName = "Carousel3DCardTitle";
-var Carousel3DCardDescription = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  "p",
-  {
-    ref,
-    className: cn("text-sm text-muted-foreground line-clamp-3 mb-4", className),
-    ...props,
-    children
-  }
-));
-Carousel3DCardDescription.displayName = "Carousel3DCardDescription";
-
-export { Carousel3D, Carousel3DCard, Carousel3DCardContent, Carousel3DCardDescription, Carousel3DCardImage, Carousel3DCardTitle };

package/dist/3d/grid.js

@@ -1,362 +0,0 @@
-"use client";
-'use strict';
-
-var React = require('react');
-var utils = require('@hanzo/ui/lib/utils');
-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 React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var Grid3D = React__namespace.forwardRef(
-  ({
-    items,
-    columns = 4,
-    rows = 3,
-    gap = 16,
-    perspective = 1e3,
-    rotateX = 25,
-    rotateY = 15,
-    cellHeight = 200,
-    cellWidth = 200,
-    isometric = false,
-    tiltOnHover = true,
-    staggerAnimation = true,
-    animationDelay = 100,
-    elevationOnHover = true,
-    maxElevation = 50,
-    className,
-    ...props
-  }, ref) => {
-    const gridRef = React__namespace.useRef(null);
-    const [hoveredIndex, setHoveredIndex] = React__namespace.useState(null);
-    const [mousePosition, setMousePosition] = React__namespace.useState({ x: 0, y: 0 });
-    const [isGridHovered, setIsGridHovered] = React__namespace.useState(false);
-    const gridTransform = React__namespace.useMemo(() => {
-      if (isometric) {
-        return `perspective(${perspective}px) rotateX(45deg) rotateY(45deg)`;
-      }
-      return `perspective(${perspective}px) rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;
-    }, [isometric, perspective, rotateX, rotateY]);
-    const handleMouseMove = React__namespace.useCallback(
-      (e) => {
-        if (!tiltOnHover || !gridRef.current) return;
-        const rect = gridRef.current.getBoundingClientRect();
-        const centerX = rect.left + rect.width / 2;
-        const centerY = rect.top + rect.height / 2;
-        const mouseX = (e.clientX - centerX) / (rect.width / 2);
-        const mouseY = (e.clientY - centerY) / (rect.height / 2);
-        setMousePosition({ x: mouseX * 10, y: mouseY * 10 });
-      },
-      [tiltOnHover]
-    );
-    const handleMouseEnter = React__namespace.useCallback(() => {
-      setIsGridHovered(true);
-    }, []);
-    const handleMouseLeave = React__namespace.useCallback(() => {
-      setIsGridHovered(false);
-      setMousePosition({ x: 0, y: 0 });
-      setHoveredIndex(null);
-    }, []);
-    React__namespace.useImperativeHandle(ref, () => gridRef.current);
-    const containerStyle = {
-      perspective: `${perspective}px`,
-      transformStyle: "preserve-3d"
-    };
-    const gridStyle = {
-      display: "grid",
-      gridTemplateColumns: `repeat(${columns}, ${cellWidth}px)`,
-      gridTemplateRows: `repeat(${rows}, ${cellHeight}px)`,
-      gap: `${gap}px`,
-      transform: tiltOnHover && isGridHovered ? `${gridTransform} rotateX(${-mousePosition.y}deg) rotateY(${mousePosition.x}deg)` : gridTransform,
-      transition: "transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-      transformStyle: "preserve-3d"
-    };
-    const getGridPosition = /* @__PURE__ */ __name((index) => {
-      const x = index % columns;
-      const y = Math.floor(index / columns);
-      return { x, y };
-    }, "getGridPosition");
-    const getStaggerDelay = /* @__PURE__ */ __name((index) => {
-      if (!staggerAnimation) return 0;
-      const { x, y } = getGridPosition(index);
-      return (x + y) * animationDelay;
-    }, "getStaggerDelay");
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        ref: gridRef,
-        className: utils.cn("w-fit mx-auto", className),
-        style: containerStyle,
-        onMouseMove: handleMouseMove,
-        onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave,
-        ...props,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { style: gridStyle, children: items.map((item, index) => {
-            const isHovered = hoveredIndex === index;
-            const { x, y } = getGridPosition(index);
-            const staggerDelay = getStaggerDelay(index);
-            const itemStyle = {
-              gridColumn: item.span ? `span ${item.span.x}` : void 0,
-              gridRow: item.span ? `span ${item.span.y}` : void 0,
-              transform: `translateZ(${(item.elevation || 0) + (isHovered && elevationOnHover ? maxElevation : 0)}px)`,
-              transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-              transformStyle: "preserve-3d",
-              animationDelay: `${staggerDelay}ms`
-            };
-            return /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
-              {
-                className: utils.cn(
-                  "relative rounded-lg border bg-card text-card-foreground shadow-lg",
-                  "transform-gpu will-change-transform cursor-pointer",
-                  "transition-all duration-300 hover:shadow-xl",
-                  staggerAnimation && "animate-in fade-in slide-in-from-bottom-4",
-                  isHovered && "ring-2 ring-primary ring-offset-2"
-                ),
-                style: itemStyle,
-                onMouseEnter: () => setHoveredIndex(index),
-                onMouseLeave: () => setHoveredIndex(null),
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full h-full overflow-hidden rounded-lg", children: item.content }),
-                  (item.elevation || 0) > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-                    "div",
-                    {
-                      className: "absolute inset-0 -z-10 rounded-lg bg-black/20 blur-sm",
-                      style: {
-                        transform: `translateY(${(item.elevation || 0) / 2}px) scale(0.95)`
-                      }
-                    }
-                  )
-                ]
-              },
-              item.id
-            );
-          }) }),
-          isometric && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 pointer-events-none opacity-20", children: /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: "grid border-dashed border-muted-foreground/30",
-              style: {
-                gridTemplateColumns: `repeat(${columns}, ${cellWidth}px)`,
-                gridTemplateRows: `repeat(${rows}, ${cellHeight}px)`,
-                gap: `${gap}px`,
-                transform: gridTransform,
-                transformStyle: "preserve-3d"
-              },
-              children: Array.from({ length: columns * rows }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: "border border-dashed border-muted-foreground/20 rounded-lg"
-                },
-                index
-              ))
-            }
-          ) })
-        ]
-      }
-    );
-  }
-);
-Grid3D.displayName = "Grid3D";
-var Grid3DCard = React__namespace.forwardRef(
-  ({
-    className,
-    title,
-    description,
-    image,
-    badge,
-    elevation = 0,
-    children,
-    ...props
-  }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      ref,
-      className: utils.cn(
-        "group relative w-full h-full flex flex-col bg-gradient-to-br from-background to-muted/20",
-        "border rounded-lg overflow-hidden",
-        className
-      ),
-      style: {
-        transform: `translateZ(${elevation}px)`,
-        transformStyle: "preserve-3d"
-      },
-      ...props,
-      children: [
-        image && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-32 overflow-hidden", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "img",
-            {
-              src: image,
-              alt: title || "",
-              className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-110"
-            }
-          ),
-          badge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-2 right-2 px-2 py-1 text-xs rounded-full bg-primary text-primary-foreground", children: badge })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 p-4 flex flex-col justify-between", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-lg mb-2 line-clamp-2 group-hover:text-primary transition-colors", children: title }),
-          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground line-clamp-3 mb-4", children: description }),
-          children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto", children })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: "absolute inset-0 -z-10 rounded-lg bg-gradient-to-br from-muted/50 to-muted",
-            style: {
-              transform: "translateZ(-2px) scale(0.98)",
-              transformStyle: "preserve-3d"
-            }
-          }
-        )
-      ]
-    }
-  )
-);
-Grid3DCard.displayName = "Grid3DCard";
-var Grid3DPreset = {
-  Dashboard: React__namespace.forwardRef(
-    ({ children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-      Grid3D,
-      {
-        ref,
-        columns: 4,
-        rows: 3,
-        cellWidth: 250,
-        cellHeight: 200,
-        gap: 20,
-        perspective: 1200,
-        rotateX: 20,
-        rotateY: 10,
-        tiltOnHover: true,
-        elevationOnHover: true,
-        maxElevation: 30,
-        items: [],
-        ...props
-      }
-    )
-  ),
-  Isometric: React__namespace.forwardRef(
-    ({ children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-      Grid3D,
-      {
-        ref,
-        columns: 3,
-        rows: 3,
-        cellWidth: 180,
-        cellHeight: 180,
-        gap: 16,
-        isometric: true,
-        perspective: 1e3,
-        staggerAnimation: true,
-        animationDelay: 50,
-        items: [],
-        ...props
-      }
-    )
-  ),
-  Gallery: React__namespace.forwardRef(
-    ({ children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-      Grid3D,
-      {
-        ref,
-        columns: 5,
-        rows: 2,
-        cellWidth: 200,
-        cellHeight: 280,
-        gap: 24,
-        perspective: 1500,
-        rotateX: 15,
-        rotateY: 5,
-        tiltOnHover: true,
-        elevationOnHover: true,
-        maxElevation: 40,
-        items: [],
-        ...props
-      }
-    )
-  ),
-  Compact: React__namespace.forwardRef(
-    ({ children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-      Grid3D,
-      {
-        ref,
-        columns: 6,
-        rows: 4,
-        cellWidth: 120,
-        cellHeight: 120,
-        gap: 8,
-        perspective: 800,
-        rotateX: 30,
-        rotateY: 20,
-        tiltOnHover: true,
-        staggerAnimation: true,
-        animationDelay: 30,
-        items: [],
-        ...props
-      }
-    )
-  )
-};
-Grid3DPreset.Dashboard.displayName = "Grid3DPreset.Dashboard";
-Grid3DPreset.Isometric.displayName = "Grid3DPreset.Isometric";
-Grid3DPreset.Gallery.displayName = "Grid3DPreset.Gallery";
-Grid3DPreset.Compact.displayName = "Grid3DPreset.Compact";
-var Grid3DAuto = React__namespace.forwardRef(
-  ({
-    items,
-    minCellWidth = 200,
-    maxCellWidth = 300,
-    aspectRatio = 1,
-    ...props
-  }, ref) => {
-    const [dimensions, setDimensions] = React__namespace.useState({ columns: 3, rows: 2 });
-    React__namespace.useEffect(() => {
-      const itemCount = items.length;
-      const columns = Math.ceil(Math.sqrt(itemCount));
-      const rows = Math.ceil(itemCount / columns);
-      setDimensions({ columns, rows });
-    }, [items.length]);
-    const cellWidth = Math.min(maxCellWidth, Math.max(minCellWidth, 200));
-    const cellHeight = cellWidth / aspectRatio;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Grid3D,
-      {
-        ref,
-        items,
-        columns: dimensions.columns,
-        rows: dimensions.rows,
-        cellWidth,
-        cellHeight,
-        ...props
-      }
-    );
-  }
-);
-Grid3DAuto.displayName = "Grid3DAuto";
-
-exports.Grid3D = Grid3D;
-exports.Grid3DAuto = Grid3DAuto;
-exports.Grid3DCard = Grid3DCard;
-exports.Grid3DPreset = Grid3DPreset;