"use client";
'use strict';

var React = require('react');
var lucideReact = require('lucide-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 Carousel3D = React__namespace.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__namespace.useRef(null);
    const [currentIndex, setCurrentIndex] = React__namespace.useState(0);
    const [isHovered, setIsHovered] = React__namespace.useState(false);
    const [isDragging, setIsDragging] = React__namespace.useState(false);
    const [dragStart, setDragStart] = React__namespace.useState({ x: 0, y: 0 });
    const [dragOffset, setDragOffset] = React__namespace.useState(0);
    const autoRotateRef = React__namespace.useRef(void 0);
    const totalItems = items.length;
    const radius = (itemWidth + spacing) / 2 / Math.tan(Math.PI / totalItems);
    React__namespace.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__namespace.useCallback(() => {
      setCurrentIndex(
        (prev) => infinite ? (prev - 1 + totalItems) % totalItems : Math.max(0, prev - 1)
      );
    }, [infinite, totalItems]);
    const goToNext = React__namespace.useCallback(() => {
      setCurrentIndex(
        (prev) => infinite ? (prev + 1) % totalItems : Math.min(totalItems - 1, prev + 1)
      );
    }, [infinite, totalItems]);
    const goToIndex = React__namespace.useCallback(
      (index) => {
        setCurrentIndex(Math.max(0, Math.min(totalItems - 1, index)));
      },
      [totalItems]
    );
    const handleDragStart = React__namespace.useCallback(
      (clientX, clientY) => {
        setIsDragging(true);
        setDragStart({ x: clientX, y: clientY });
        setDragOffset(0);
      },
      []
    );
    const handleDragMove = React__namespace.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__namespace.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__namespace.useCallback(
      (e) => {
        e.preventDefault();
        handleDragStart(e.clientX, e.clientY);
      },
      [handleDragStart]
    );
    const handleMouseMove = React__namespace.useCallback(
      (e) => {
        handleDragMove(e.clientX, e.clientY);
      },
      [handleDragMove]
    );
    const handleMouseUp = React__namespace.useCallback(() => {
      handleDragEnd();
    }, [handleDragEnd]);
    const handleTouchStart = React__namespace.useCallback(
      (e) => {
        if (e.touches.length === 1) {
          const touch = e.touches[0];
          handleDragStart(touch.clientX, touch.clientY);
        }
      },
      [handleDragStart]
    );
    const handleTouchMove = React__namespace.useCallback(
      (e) => {
        if (e.touches.length === 1) {
          e.preventDefault();
          const touch = e.touches[0];
          handleDragMove(touch.clientX, touch.clientY);
        }
      },
      [handleDragMove]
    );
    const handleTouchEnd = React__namespace.useCallback(() => {
      handleDragEnd();
    }, [handleDragEnd]);
    React__namespace.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__namespace.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__ */ jsxRuntime.jsxs(
      "div",
      {
        ref: containerRef,
        className: utils.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__ */ jsxRuntime.jsx(
            "div",
            {
              className: "relative mx-auto",
              style: {
                width: `${itemWidth}px`,
                height: `${itemHeight}px`,
                transformStyle: "preserve-3d"
              },
              children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
                  "div",
                  {
                    className: utils.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__ */ jsxRuntime.jsx("div", { className: "w-full h-full overflow-hidden rounded-lg", children: item.content })
                  },
                  item.id
                );
              }) })
            }
          ),
          showControls && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
            /* @__PURE__ */ jsxRuntime.jsx(
              "button",
              {
                className: utils.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__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "w-5 h-5" })
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx(
              "button",
              {
                className: utils.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__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "w-5 h-5" })
              }
            )
          ] }),
          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 z-10", children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
            "button",
            {
              className: utils.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__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 p-2 rounded-full bg-background/80 backdrop-blur-sm border shadow-sm", children: [
            /* @__PURE__ */ jsxRuntime.jsx(
              "div",
              {
                className: utils.cn(
                  "w-2 h-2 rounded-full transition-all",
                  isHovered || isDragging ? "bg-orange-500" : "bg-green-500 animate-pulse"
                )
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: isHovered || isDragging ? "Paused" : "Auto" })
          ] }) })
        ]
      }
    );
  }
);
Carousel3D.displayName = "Carousel3D";
var Carousel3DCard = React__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
  "div",
  {
    ref,
    className: utils.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__namespace.forwardRef(({ className, alt, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
  "img",
  {
    ref,
    className: utils.cn(
      "w-full h-48 object-cover transition-transform duration-300",
      "group-hover:scale-105",
      className
    ),
    alt,
    ...props
  }
));
Carousel3DCardImage.displayName = "Carousel3DCardImage";
var Carousel3DCardContent = React__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
  "div",
  {
    ref,
    className: utils.cn("flex-1 p-4 flex flex-col justify-between", className),
    ...props,
    children
  }
));
Carousel3DCardContent.displayName = "Carousel3DCardContent";
var Carousel3DCardTitle = React__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
  "h3",
  {
    ref,
    className: utils.cn("font-semibold text-lg mb-2 line-clamp-2", className),
    ...props,
    children
  }
));
Carousel3DCardTitle.displayName = "Carousel3DCardTitle";
var Carousel3DCardDescription = React__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
  "p",
  {
    ref,
    className: utils.cn("text-sm text-muted-foreground line-clamp-3 mb-4", className),
    ...props,
    children
  }
));
Carousel3DCardDescription.displayName = "Carousel3DCardDescription";

exports.Carousel3D = Carousel3D;
exports.Carousel3DCard = Carousel3DCard;
exports.Carousel3DCardContent = Carousel3DCardContent;
exports.Carousel3DCardDescription = Carousel3DCardDescription;
exports.Carousel3DCardImage = Carousel3DCardImage;
exports.Carousel3DCardTitle = Carousel3DCardTitle;
