@sth87/shadcn-design-system 0.0.35 → 0.1.0

package/dist/cjs/components/Carousel/Carousel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.cjs","sources":["../../../../src/components/Carousel/Carousel.tsx"],"sourcesContent":["import React, {\n  useState,\n  useEffect,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  isValidElement,\n  cloneElement,\n} from \"react\";\nimport {\n  ChevronLeft,\n  ChevronRight,\n  ChevronUp,\n  ChevronDown,\n} from \"lucide-react\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ImageViewer } from \"../ImageViewer\";\nimport type { ImageInfo } from \"../ImageViewer\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type SliderEffect =\n  | \"slide\"\n  | \"fade\"\n  | \"cube\"\n  | \"coverflow\"\n  | \"flip\"\n  | \"cards\";\n\nexport type SliderDirection = \"horizontal\" | \"vertical\";\n\nexport type PaginationType =\n  | \"bullets\"\n  | \"fraction\"\n  | \"progressbar\"\n  | \"scrollbar\"\n  | \"custom\";\n\nexport interface AutoplayOptions {\n  delay?: number;\n  disableOnInteraction?: boolean;\n  pauseOnMouseEnter?: boolean;\n  reverseDirection?: boolean;\n  stopOnLastSlide?: boolean;\n}\n\nexport interface BreakpointOptions {\n  slidesPerView?: number;\n  spaceBetween?: number;\n  slidesPerGroup?: number;\n}\n\nexport interface NavigationOptions {\n  enabled?: boolean;\n  prevEl?: React.ReactNode;\n  nextEl?: React.ReactNode;\n  hideOnClick?: boolean;\n  position?: \"inside\" | \"outside\"; // inside = overlay on image, outside = beside image\n}\n\nexport interface PaginationOptions {\n  enabled?: boolean;\n  type?: PaginationType;\n  clickable?: boolean;\n  dynamicBullets?: boolean;\n  dynamicMainBullets?: number;\n  position?: \"inside\" | \"outside\"; // inside = overlay on image, outside = below image\n  renderBullet?: (index: number, className: string) => React.ReactNode;\n  renderFraction?: (\n    currentClass: string,\n    totalClass: string\n  ) => React.ReactNode;\n  renderProgressbar?: (progressbarFillClass: string) => React.ReactNode;\n  renderScrollbar?: (scrollbarDragClass: string) => React.ReactNode;\n  renderCustom?: (current: number, total: number) => React.ReactNode;\n}\n\nexport interface CarouselProps {\n  children: React.ReactNode;\n  // Core\n  initialSlide?: number;\n  direction?: SliderDirection;\n  speed?: number;\n  spaceBetween?: number;\n  slidesPerView?: number | \"auto\";\n  slidesPerGroup?: number;\n  centeredSlides?: boolean;\n  loop?: boolean;\n  loopedSlides?: number;\n  rewind?: boolean;\n  effect?: SliderEffect;\n  // Responsive breakpoints\n  breakpoints?: Record<number, BreakpointOptions>;\n  // Navigation\n  navigation?: boolean | NavigationOptions;\n  // Pagination\n  pagination?: boolean | PaginationOptions;\n  // Autoplay\n  autoplay?: boolean | AutoplayOptions;\n  // Interaction\n  allowTouchMove?: boolean;\n  grabCursor?: boolean;\n  keyboard?: boolean;\n  mousewheel?: boolean;\n  freeMode?: boolean;\n  // Styling\n  className?: string;\n  containerClassName?: string;\n  wrapperClassName?: string;\n  slideClassName?: string;\n  // Image Viewer\n  enableImageViewer?: boolean;\n  // Callbacks\n  onSlideChange?: (swiper: { activeIndex: number; realIndex: number }) => void;\n  onReachBeginning?: () => void;\n  onReachEnd?: () => void;\n  onAutoplayStart?: () => void;\n  onAutoplayStop?: () => void;\n}\n\n// ============================================================================\n// Carousel Slide Component Types\n// ============================================================================\n\nexport interface CarouselSlideProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\n// ============================================================================\n// Carousel Component\n// ============================================================================\n\nexport const Carousel = React.forwardRef<HTMLDivElement, CarouselProps>(\n  (\n    {\n      children,\n      initialSlide = 0,\n      direction = \"horizontal\",\n      speed = 300,\n      spaceBetween = 0,\n      slidesPerView = 1,\n      slidesPerGroup = 1,\n      centeredSlides = false,\n      loop = false,\n      rewind = false,\n      effect = \"slide\",\n      breakpoints,\n      navigation = false,\n      pagination = false,\n      autoplay = false,\n      allowTouchMove = true,\n      grabCursor = true,\n      keyboard = false,\n      mousewheel = false,\n      className,\n      containerClassName,\n      wrapperClassName,\n      slideClassName,\n      enableImageViewer = false,\n      onSlideChange,\n      onReachBeginning,\n      onReachEnd,\n      onAutoplayStart,\n      onAutoplayStop,\n    },\n    ref\n  ) => {\n    // Parse navigation options\n    const navigationOptions: NavigationOptions =\n      typeof navigation === \"boolean\"\n        ? { enabled: navigation, position: \"inside\" }\n        : { enabled: true, position: \"inside\", ...navigation };\n\n    // Parse pagination options\n    const paginationOptions: PaginationOptions =\n      typeof pagination === \"boolean\"\n        ? { enabled: pagination, type: \"bullets\", position: \"inside\" }\n        : { enabled: true, type: \"bullets\", position: \"inside\", ...pagination };\n\n    // Parse autoplay options\n    const autoplayOptions: AutoplayOptions = useMemo(\n      () =>\n        typeof autoplay === \"boolean\"\n          ? { delay: 3000, disableOnInteraction: true }\n          : { delay: 3000, disableOnInteraction: true, ...autoplay },\n      [autoplay]\n    );\n\n    // State\n    const [activeIndex, setActiveIndex] = useState(initialSlide);\n    const [isBeginning, setIsBeginning] = useState(initialSlide === 0);\n    const [isEnd, setIsEnd] = useState(false);\n    const [isDragging, setIsDragging] = useState(false);\n    const [translate, setTranslate] = useState(0);\n    const [isAutoplayRunning, setIsAutoplayRunning] = useState(false);\n    const [showScrollbar, setShowScrollbar] = useState(false);\n    const [windowWidth, setWindowWidth] = useState(\n      typeof window !== \"undefined\" ? window.innerWidth : 1024\n    );\n    const [viewerVisible, setViewerVisible] = useState(false);\n    const [viewerIndex, setViewerIndex] = useState(0);\n\n    // Handle window resize for breakpoints\n    useEffect(() => {\n      if (!breakpoints) return;\n\n      const handleResize = () => {\n        setWindowWidth(window.innerWidth);\n      };\n\n      window.addEventListener(\"resize\", handleResize);\n      return () => window.removeEventListener(\"resize\", handleResize);\n    }, [breakpoints]);\n\n    // Get current breakpoint values\n    const currentBreakpoint = useMemo(() => {\n      if (!breakpoints) {\n        return { slidesPerView, spaceBetween, slidesPerGroup };\n      }\n\n      const breakpointKeys = Object.keys(breakpoints)\n        .map(Number)\n        .sort((a, b) => b - a); // Sort descending\n\n      for (const breakpoint of breakpointKeys) {\n        if (windowWidth >= breakpoint) {\n          return {\n            slidesPerView:\n              breakpoints[breakpoint].slidesPerView ?? slidesPerView,\n            spaceBetween: breakpoints[breakpoint].spaceBetween ?? spaceBetween,\n            slidesPerGroup:\n              breakpoints[breakpoint].slidesPerGroup ?? slidesPerGroup,\n          };\n        }\n      }\n\n      return { slidesPerView, spaceBetween, slidesPerGroup };\n    }, [breakpoints, windowWidth, slidesPerView, spaceBetween, slidesPerGroup]);\n\n    // Use breakpoint values\n    const actualSlidesPerView = currentBreakpoint.slidesPerView;\n    const actualSpaceBetween = currentBreakpoint.spaceBetween;\n    const actualSlidesPerGroup = currentBreakpoint.slidesPerGroup;\n\n    // Refs\n    const containerRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const autoplayTimerRef = useRef<number | null>(null);\n    const scrollbarTimerRef = useRef<number | null>(null);\n    const dragStateRef = useRef({\n      startX: 0,\n      startY: 0,\n      currentX: 0,\n      currentY: 0,\n    });\n    const hasDraggedRef = useRef(false);\n\n    // Get slides\n    const slides = Children.toArray(children).filter(\n      (child) => isValidElement(child) && child.type === CarouselSlide\n    );\n    const totalSlides = slides.length;\n\n    // Helper function to find image in children\n    const findImageInChildren = useCallback(\n      (\n        children: React.ReactNode\n      ): React.ReactElement<\n        React.ImgHTMLAttributes<HTMLImageElement>\n      > | null => {\n        let result: React.ReactElement<\n          React.ImgHTMLAttributes<HTMLImageElement>\n        > | null = null;\n\n        React.Children.forEach(children, (child) => {\n          if (result) return;\n\n          if (isValidElement(child)) {\n            if (child.type === \"img\") {\n              result = child as React.ReactElement<\n                React.ImgHTMLAttributes<HTMLImageElement>\n              >;\n            } else if (\n              child.props &&\n              typeof child.props === \"object\" &&\n              \"children\" in child.props\n            ) {\n              result = findImageInChildren(\n                child.props.children as React.ReactNode\n              );\n            }\n          }\n        });\n\n        return result;\n      },\n      []\n    );\n\n    // Extract images for ImageViewer\n    const imageInfos = useMemo((): ImageInfo[] => {\n      if (!enableImageViewer) return [];\n\n      return slides.map((slide) => {\n        const slideElement = slide as React.ReactElement<CarouselSlideProps>;\n        const imgElement = findImageInChildren(slideElement.props.children);\n\n        if (imgElement) {\n          return {\n            src: imgElement.props.src || \"\",\n            alt: imgElement.props.alt || \"\",\n          };\n        }\n\n        return { src: \"\", alt: \"\" };\n      });\n    }, [slides, enableImageViewer, findImageInChildren]);\n\n    // Handle slide click for image viewer\n    const handleSlideClick = useCallback(\n      (index: number) => {\n        console.log(\"Slide clicked:\", {\n          index,\n          enableImageViewer,\n          hasSrc: !!imageInfos[index]?.src,\n          hasDragged: hasDraggedRef.current,\n          imageInfos,\n        });\n\n        // Only open viewer if not dragged\n        if (\n          enableImageViewer &&\n          imageInfos[index]?.src &&\n          !hasDraggedRef.current\n        ) {\n          console.log(\"Opening viewer at index:\", index);\n          setViewerIndex(index);\n          setViewerVisible(true);\n        }\n      },\n      [enableImageViewer, imageInfos]\n    );\n\n    // Calculate visible slides\n    const visibleSlides =\n      actualSlidesPerView === \"auto\"\n        ? 1\n        : Math.min(actualSlidesPerView as number, totalSlides);\n\n    // Update beginning/end state\n    useEffect(() => {\n      if (loop) {\n        setIsBeginning(false);\n        setIsEnd(false);\n      } else {\n        setIsBeginning(activeIndex === 0);\n        setIsEnd(activeIndex >= totalSlides - visibleSlides);\n      }\n    }, [activeIndex, totalSlides, visibleSlides, loop]);\n\n    // Slide to index\n    const slideTo = useCallback(\n      (index: number) => {\n        let newIndex = index;\n\n        if (loop) {\n          // In loop mode, allow any index\n          newIndex = ((index % totalSlides) + totalSlides) % totalSlides;\n        } else if (rewind) {\n          // In rewind mode, wrap around\n          if (index < 0) newIndex = totalSlides - 1;\n          else if (index >= totalSlides) newIndex = 0;\n          else newIndex = index;\n        } else {\n          // Normal mode, clamp to bounds\n          newIndex = Math.max(0, Math.min(index, totalSlides - visibleSlides));\n        }\n\n        setActiveIndex(newIndex);\n\n        // Calculate translate\n        const containerSize =\n          direction === \"horizontal\"\n            ? containerRef.current?.offsetWidth || 0\n            : containerRef.current?.offsetHeight || 0;\n\n        const slideSize = containerSize / visibleSlides;\n        let newTranslate = -newIndex * (slideSize + actualSpaceBetween);\n\n        if (centeredSlides && visibleSlides < totalSlides) {\n          newTranslate += containerSize / 2 - slideSize / 2;\n        }\n\n        setTranslate(newTranslate);\n\n        // Show scrollbar on slide change\n        if (paginationOptions.type === \"scrollbar\") {\n          setShowScrollbar(true);\n          if (scrollbarTimerRef.current) {\n            clearTimeout(scrollbarTimerRef.current);\n          }\n          scrollbarTimerRef.current = setTimeout(() => {\n            setShowScrollbar(false);\n          }, 1000) as unknown as number;\n        }\n\n        // Callbacks\n        onSlideChange?.({ activeIndex: newIndex, realIndex: newIndex });\n\n        if (newIndex === 0) onReachBeginning?.();\n        if (newIndex >= totalSlides - visibleSlides) onReachEnd?.();\n      },\n      [\n        totalSlides,\n        visibleSlides,\n        loop,\n        rewind,\n        direction,\n        actualSpaceBetween,\n        centeredSlides,\n        paginationOptions.type,\n        onSlideChange,\n        onReachBeginning,\n        onReachEnd,\n      ]\n    );\n\n    // Navigation\n    const slideNext = useCallback(() => {\n      slideTo(activeIndex + actualSlidesPerGroup);\n    }, [activeIndex, actualSlidesPerGroup, slideTo]);\n\n    const slidePrev = useCallback(() => {\n      slideTo(activeIndex - actualSlidesPerGroup);\n    }, [activeIndex, actualSlidesPerGroup, slideTo]);\n\n    // Autoplay\n    const stopAutoplay = useCallback(() => {\n      if (autoplayTimerRef.current) {\n        clearInterval(autoplayTimerRef.current);\n        autoplayTimerRef.current = null;\n      }\n      setIsAutoplayRunning(false);\n      onAutoplayStop?.();\n    }, [onAutoplayStop]);\n\n    const startAutoplay = useCallback(() => {\n      if (!autoplay) return;\n\n      autoplayTimerRef.current = setInterval(() => {\n        if (autoplayOptions.reverseDirection) {\n          slidePrev();\n        } else {\n          slideNext();\n        }\n\n        if (autoplayOptions.stopOnLastSlide && isEnd) {\n          stopAutoplay();\n        }\n      }, autoplayOptions.delay) as unknown as number;\n\n      setIsAutoplayRunning(true);\n      onAutoplayStart?.();\n    }, [\n      autoplayOptions,\n      autoplay,\n      slideNext,\n      slidePrev,\n      isEnd,\n      onAutoplayStart,\n      stopAutoplay,\n    ]);\n\n    // Auto-start autoplay\n    useEffect(() => {\n      if (autoplay) {\n        startAutoplay();\n      }\n      return () => stopAutoplay();\n    }, [autoplay, startAutoplay, stopAutoplay]);\n\n    // Pause on hover\n    const handleMouseEnter = useCallback(() => {\n      if (autoplayOptions.pauseOnMouseEnter && isAutoplayRunning) {\n        stopAutoplay();\n      }\n    }, [autoplayOptions.pauseOnMouseEnter, isAutoplayRunning, stopAutoplay]);\n\n    const handleMouseLeave = useCallback(() => {\n      if (autoplayOptions.pauseOnMouseEnter && autoplay && !isAutoplayRunning) {\n        startAutoplay();\n      }\n    }, [\n      autoplayOptions.pauseOnMouseEnter,\n      autoplay,\n      isAutoplayRunning,\n      startAutoplay,\n    ]);\n\n    // Touch/drag handlers\n    const handlePointerDown = useCallback(\n      (e: React.PointerEvent) => {\n        if (!allowTouchMove) return;\n\n        try {\n          e.currentTarget.setPointerCapture(e.pointerId);\n        } catch (err) {\n          console.error(\"Failed to capture pointer:\", err);\n        }\n\n        dragStateRef.current.startX = e.clientX;\n        dragStateRef.current.startY = e.clientY;\n        dragStateRef.current.currentX = e.clientX;\n        dragStateRef.current.currentY = e.clientY;\n        hasDraggedRef.current = false;\n        setIsDragging(true);\n\n        if (autoplayOptions.disableOnInteraction) {\n          stopAutoplay();\n        }\n      },\n      [allowTouchMove, autoplayOptions.disableOnInteraction, stopAutoplay]\n    );\n\n    const handlePointerMove = useCallback(\n      (e: React.PointerEvent) => {\n        if (!allowTouchMove) return;\n\n        const startX = dragStateRef.current.startX;\n        const startY = dragStateRef.current.startY;\n\n        // Check if drag has started (startX/Y are set)\n        if (startX === 0 && startY === 0) return;\n\n        e.preventDefault();\n        dragStateRef.current.currentX = e.clientX;\n        dragStateRef.current.currentY = e.clientY;\n\n        // Mark as dragged if moved more than 5px\n        const diffX = Math.abs(e.clientX - dragStateRef.current.startX);\n        const diffY = Math.abs(e.clientY - dragStateRef.current.startY);\n        if (diffX > 5 || diffY > 5) {\n          hasDraggedRef.current = true;\n        }\n\n        setIsDragging(true);\n      },\n      [allowTouchMove]\n    );\n\n    const handlePointerUp = useCallback(() => {\n      const startX = dragStateRef.current.startX;\n      const startY = dragStateRef.current.startY;\n\n      // Check if we actually dragged\n      if (startX === 0 && startY === 0) return;\n\n      const diffX = dragStateRef.current.currentX - startX;\n      const diffY = dragStateRef.current.currentY - startY;\n      const diff = direction === \"horizontal\" ? diffX : diffY;\n\n      // Determine slide action with lower threshold\n      const threshold = 0;\n      if (Math.abs(diff) > threshold && hasDraggedRef.current) {\n        if (diff > 0) {\n          // Swipe right/down = previous slide\n          slidePrev();\n        } else {\n          // Swipe left/up = next slide\n          slideNext();\n        }\n      } else {\n        // Snap back to current\n        slideTo(activeIndex);\n      }\n\n      // Reset after a small delay to allow onClick to check the flag\n      setTimeout(() => {\n        setIsDragging(false);\n        dragStateRef.current.startX = 0;\n        dragStateRef.current.startY = 0;\n        dragStateRef.current.currentX = 0;\n        dragStateRef.current.currentY = 0;\n        hasDraggedRef.current = false;\n      }, 50);\n    }, [direction, slidePrev, slideNext, slideTo, activeIndex]);\n\n    // Keyboard navigation\n    useEffect(() => {\n      if (!keyboard) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n          e.preventDefault();\n          slidePrev();\n        } else if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n          e.preventDefault();\n          slideNext();\n        }\n      };\n\n      window.addEventListener(\"keydown\", handleKeyDown);\n      return () => window.removeEventListener(\"keydown\", handleKeyDown);\n    }, [keyboard, slideNext, slidePrev]);\n\n    // Mousewheel navigation\n    useEffect(() => {\n      if (!mousewheel) return;\n\n      const handleWheel = (e: WheelEvent) => {\n        e.preventDefault();\n        if (e.deltaY > 0) slideNext();\n        else if (e.deltaY < 0) slidePrev();\n      };\n\n      const container = containerRef.current;\n      if (container) {\n        container.addEventListener(\"wheel\", handleWheel, { passive: false });\n        return () => container.removeEventListener(\"wheel\", handleWheel);\n      }\n    }, [mousewheel, slideNext, slidePrev]);\n\n    // Render pagination\n    const renderPagination = () => {\n      if (!paginationOptions.enabled) return null;\n\n      const {\n        type,\n        clickable,\n        dynamicBullets,\n        dynamicMainBullets = 1,\n        position = \"inside\",\n      } = paginationOptions;\n\n      const isOutside = position === \"outside\";\n\n      if (type === \"bullets\") {\n        const bulletsToShow = dynamicBullets\n          ? Math.min(dynamicMainBullets * 2 + 1, totalSlides)\n          : totalSlides;\n\n        return (\n          <div\n            className={cn(\n              \"flex items-center justify-center gap-2\",\n              isOutside\n                ? \"mt-4\" // Outside: margin-top for spacing\n                : \"absolute bottom-4 left-1/2 -translate-x-1/2\", // Inside: overlay\n              direction === \"vertical\" &&\n                !isOutside &&\n                \"flex-col right-4 left-auto top-1/2 -translate-y-1/2 translate-x-0 bottom-auto\"\n            )}\n          >\n            {Array.from({ length: bulletsToShow }).map((_, i) => {\n              const bulletIndex = dynamicBullets\n                ? Math.max(\n                    0,\n                    Math.min(\n                      i + activeIndex - dynamicMainBullets,\n                      totalSlides - 1\n                    )\n                  )\n                : i;\n\n              const isActive = bulletIndex === activeIndex;\n\n              return paginationOptions.renderBullet ? (\n                <React.Fragment key={bulletIndex}>\n                  {paginationOptions.renderBullet(\n                    bulletIndex,\n                    cn(\n                      \"carousel-pagination-bullet\",\n                      isActive && \"carousel-pagination-bullet-active\"\n                    )\n                  )}\n                </React.Fragment>\n              ) : (\n                <button\n                  key={bulletIndex}\n                  onClick={() => clickable && slideTo(bulletIndex)}\n                  className={cn(\n                    \"rounded-full transition-all\",\n                    direction === \"horizontal\" ? \"w-2 h-2\" : \"w-2 h-2\",\n                    isActive\n                      ? direction === \"horizontal\"\n                        ? \"bg-primary w-6\"\n                        : \"bg-primary h-6\"\n                      : \"bg-muted-foreground/30 hover:bg-muted-foreground/50\",\n                    clickable && \"cursor-pointer\"\n                  )}\n                  aria-label={`Go to slide ${bulletIndex + 1}`}\n                />\n              );\n            })}\n          </div>\n        );\n      }\n\n      if (type === \"fraction\") {\n        return (\n          <div\n            className={cn(\n              \"text-center text-sm text-muted-foreground bg-background/80 backdrop-blur px-3 py-1 rounded-full\",\n              isOutside\n                ? \"mt-4 mx-auto w-fit\" // Outside: centered with margin\n                : \"absolute bottom-4 left-1/2 -translate-x-1/2\" // Inside: overlay\n            )}\n          >\n            {paginationOptions.renderFraction ? (\n              paginationOptions.renderFraction(\n                \"carousel-pagination-current\",\n                \"carousel-pagination-total\"\n              )\n            ) : (\n              <>\n                <span className=\"carousel-pagination-current font-semibold text-foreground\">\n                  {activeIndex + 1}\n                </span>\n                {\" / \"}\n                <span className=\"carousel-pagination-total\">{totalSlides}</span>\n              </>\n            )}\n          </div>\n        );\n      }\n\n      if (type === \"progressbar\") {\n        const progress = ((activeIndex + 1) / totalSlides) * 100;\n        const isInside = paginationOptions.position === \"inside\";\n\n        const handleProgressbarClick = (\n          e: React.MouseEvent<HTMLDivElement>\n        ) => {\n          if (!clickable) return;\n          const rect = e.currentTarget.getBoundingClientRect();\n          const clickX = e.clientX - rect.left;\n          const percentage = clickX / rect.width;\n          const targetIndex = Math.floor(percentage * totalSlides);\n          slideTo(Math.min(targetIndex, totalSlides - 1));\n        };\n\n        return (\n          <div\n            onClick={handleProgressbarClick}\n            className={cn(\n              \"w-full h-1 bg-muted rounded-full overflow-hidden\",\n              isInside\n                ? \"absolute bottom-0 left-0 right-0 rounded-none\"\n                : \"mt-4\",\n              clickable && \"cursor-pointer\"\n            )}\n          >\n            {paginationOptions.renderProgressbar ? (\n              paginationOptions.renderProgressbar(\"carousel-progressbar-fill\")\n            ) : (\n              <div\n                className=\"carousel-progressbar-fill h-full bg-primary transition-all duration-300\"\n                style={{ width: `${progress}%` }}\n              />\n            )}\n          </div>\n        );\n      }\n\n      if (type === \"custom\" && paginationOptions.renderCustom) {\n        return (\n          <div\n            className={cn(\n              isOutside\n                ? \"mt-4 flex justify-center\" // Outside: centered with margin\n                : \"absolute bottom-4 left-1/2 -translate-x-1/2\" // Inside: overlay\n            )}\n          >\n            {paginationOptions.renderCustom(activeIndex + 1, totalSlides)}\n          </div>\n        );\n      }\n\n      if (type === \"scrollbar\") {\n        const dragWidth = (1 / totalSlides) * 100;\n        const scrollPosition =\n          (activeIndex / (totalSlides - 1)) * (100 - dragWidth);\n\n        const handleScrollbarClick = (e: React.MouseEvent<HTMLDivElement>) => {\n          if (!clickable) return;\n\n          // Show scrollbar on click\n          setShowScrollbar(true);\n          if (scrollbarTimerRef.current) {\n            clearTimeout(scrollbarTimerRef.current);\n          }\n\n          const rect = e.currentTarget.getBoundingClientRect();\n          const clickX = e.clientX - rect.left;\n          const percentage = clickX / rect.width;\n          const targetIndex = Math.round(percentage * (totalSlides - 1));\n          slideTo(Math.max(0, Math.min(targetIndex, totalSlides - 1)));\n\n          // Hide after 1s\n          scrollbarTimerRef.current = setTimeout(() => {\n            setShowScrollbar(false);\n          }, 1000) as unknown as number;\n        };\n\n        return (\n          <div\n            onClick={handleScrollbarClick}\n            className={cn(\n              \"w-full h-1 bg-muted/50 rounded-full transition-opacity duration-300\",\n              isOutside\n                ? \"mt-4\" // Outside: margin-top for spacing\n                : \"absolute bottom-0 left-1/2 -translate-x-1/2\", // Inside: overlay at bottom\n              clickable && \"cursor-pointer\",\n              showScrollbar ? \"opacity-100\" : \"opacity-0\"\n            )}\n          >\n            {paginationOptions.renderScrollbar ? (\n              paginationOptions.renderScrollbar(\"carousel-scrollbar-drag\")\n            ) : (\n              <div\n                className=\"carousel-scrollbar-drag h-full bg-primary rounded-full transition-all duration-300 absolute left-0\"\n                style={{\n                  width: `${dragWidth}%`,\n                  left: `${scrollPosition}%`,\n                }}\n              />\n            )}\n          </div>\n        );\n      }\n\n      return null;\n    };\n\n    // Get effect transform/classes for slides\n    const getSlideTransform = (index: number) => {\n      const diff = index - activeIndex;\n\n      switch (effect) {\n        case \"fade\":\n          return {\n            opacity: diff === 0 ? 1 : 0,\n            zIndex: diff === 0 ? 10 : 0,\n          };\n        case \"cube\":\n          return {\n            transform: `translateX(${diff * 100}%) rotateY(${diff * -90}deg)`,\n            transformOrigin: diff > 0 ? \"left center\" : \"right center\",\n          };\n        case \"coverflow\":\n          return {\n            transform: `translateX(${diff * 60}%) translateZ(${Math.abs(diff) * -100}px) rotateY(${diff * -50}deg)`,\n            zIndex: -Math.abs(diff),\n          };\n        case \"flip\":\n          return {\n            transform: `rotateY(${diff * 180}deg)`,\n            backfaceVisibility: \"hidden\" as const,\n          };\n        case \"cards\":\n          return {\n            transform: `translateX(${diff * 50}px) translateZ(${-Math.abs(diff) * 100}px) scale(${1 - Math.abs(diff) * 0.2})`,\n            opacity: diff === 0 ? 1 : 0.5,\n            zIndex: 100 - Math.abs(diff) * 10,\n            transition: \"all 0.5s ease\",\n          };\n        default:\n          return {};\n      }\n    };\n\n    return (\n      <>\n        <div\n          ref={ref}\n          className={cn(\"carousel-container\", containerClassName, className)}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n        >\n          <div\n            ref={containerRef}\n            className={cn(\n              \"carousel relative overflow-hidden\",\n              (effect === \"fade\" ||\n                effect === \"cube\" ||\n                effect === \"flip\" ||\n                effect === \"cards\") &&\n                \"aspect-4/3\",\n              effect === \"coverflow\" && \"aspect-4/2 rounded-xl\",\n              direction === \"vertical\" && effect === \"slide\" && \"h-full\",\n              grabCursor && allowTouchMove && !isDragging && \"cursor-grab\",\n              isDragging && \"cursor-grabbing\"\n            )}\n          >\n            {/* Wrapper */}\n            <div\n              ref={wrapperRef}\n              className={cn(\n                \"carousel-wrapper select-none\",\n                effect === \"slide\" && \"flex\",\n                direction === \"vertical\" &&\n                  effect === \"slide\" &&\n                  \"flex-col h-full\",\n                effect !== \"slide\" && \"relative\",\n                wrapperClassName\n              )}\n              style={{\n                transform:\n                  effect === \"slide\"\n                    ? direction === \"horizontal\"\n                      ? `translateX(${translate}px)`\n                      : `translateY(${translate}px)`\n                    : undefined,\n                transition: isDragging ? \"none\" : `transform ${speed}ms ease`,\n                gap: effect === \"slide\" ? `${actualSpaceBetween}px` : undefined,\n                perspective:\n                  effect !== \"slide\" && effect !== \"fade\"\n                    ? \"1200px\"\n                    : undefined,\n                touchAction: allowTouchMove ? \"none\" : \"auto\",\n                height:\n                  direction === \"vertical\" && effect === \"slide\"\n                    ? \"100%\"\n                    : undefined,\n              }}\n              onPointerDown={handlePointerDown}\n              onPointerMove={handlePointerMove}\n              onPointerUp={handlePointerUp}\n              onPointerCancel={handlePointerUp}\n            >\n              {slides.map((slide, index) => {\n                const isActive = index === activeIndex;\n                const slideElement =\n                  slide as React.ReactElement<CarouselSlideProps>;\n\n                return cloneElement(slideElement, {\n                  key: index,\n                  className: cn(\n                    \"carousel-slide\",\n                    slideClassName,\n                    slideElement.props.className,\n                    effect !== \"slide\" && \"absolute inset-0\",\n                    effect === \"fade\" && \"transition-opacity duration-300\",\n                    effect !== \"slide\" &&\n                      effect !== \"fade\" &&\n                      \"transition-all duration-500\",\n                    enableImageViewer &&\n                      imageInfos[index]?.src &&\n                      \"cursor-pointer\"\n                  ),\n                  style: {\n                    flex:\n                      effect === \"slide\"\n                        ? direction === \"vertical\"\n                          ? `0 0 100%`\n                          : `0 0 calc(${100 / visibleSlides}% - ${(actualSpaceBetween * (visibleSlides - 1)) / visibleSlides}px)`\n                        : undefined,\n                    minWidth:\n                      effect === \"slide\" && direction === \"horizontal\"\n                        ? 0\n                        : undefined,\n                    minHeight:\n                      effect === \"slide\" && direction === \"vertical\"\n                        ? 0\n                        : undefined,\n                    height:\n                      direction === \"vertical\" && effect === \"slide\"\n                        ? \"100%\"\n                        : undefined,\n                    userSelect: \"none\",\n                    // @ts-expect-error - WebkitUserDrag is not in CSSProperties but is valid CSS\n                    WebkitUserDrag: \"none\",\n                    ...(effect !== \"slide\" ? getSlideTransform(index) : {}),\n                    ...slideElement.props.style,\n                  } as React.CSSProperties,\n                  onClick: (e: React.MouseEvent) => {\n                    e.stopPropagation();\n                    handleSlideClick(index);\n                  },\n                  onDragStart: (e: React.DragEvent) => e.preventDefault(),\n                  \"data-active\": isActive,\n                  \"data-index\": index,\n                } as Partial<CarouselSlideProps>);\n              })}\n            </div>\n\n            {/* Pagination - Inside only (overlay on slider) */}\n            {paginationOptions.enabled &&\n              paginationOptions.position !== \"outside\" &&\n              renderPagination()}\n\n            {/* Navigation - Inside (overlay on slider) */}\n            {navigationOptions.enabled &&\n              navigationOptions.position === \"inside\" && (\n                <>\n                  <button\n                    onClick={slidePrev}\n                    disabled={!loop && !rewind && isBeginning}\n                    className={cn(\n                      \"absolute z-10 w-10 h-10 rounded-full bg-background/80 backdrop-blur shadow-lg flex items-center justify-center transition-all hover:bg-background disabled:opacity-30 disabled:cursor-not-allowed\",\n                      direction === \"horizontal\"\n                        ? \"left-4 top-1/2 -translate-y-1/2\"\n                        : \"top-4 left-1/2 -translate-x-1/2\"\n                    )}\n                    aria-label=\"Previous slide\"\n                  >\n                    {navigationOptions.prevEl ||\n                      (direction === \"horizontal\" ? (\n                        <ChevronLeft className=\"w-5 h-5\" />\n                      ) : (\n                        <ChevronUp className=\"w-5 h-5\" />\n                      ))}\n                  </button>\n                  <button\n                    onClick={slideNext}\n                    disabled={!loop && !rewind && isEnd}\n                    className={cn(\n                      \"absolute z-10 w-10 h-10 rounded-full bg-background/80 backdrop-blur shadow-lg flex items-center justify-center transition-all hover:bg-background disabled:opacity-30 disabled:cursor-not-allowed\",\n                      direction === \"horizontal\"\n                        ? \"right-4 top-1/2 -translate-y-1/2\"\n                        : \"bottom-4 left-1/2 -translate-x-1/2\"\n                    )}\n                    aria-label=\"Next slide\"\n                  >\n                    {navigationOptions.nextEl ||\n                      (direction === \"horizontal\" ? (\n                        <ChevronRight className=\"w-5 h-5\" />\n                      ) : (\n                        <ChevronDown className=\"w-5 h-5\" />\n                      ))}\n                  </button>\n                </>\n              )}\n          </div>\n\n          {/* Pagination - Outside (below slider) */}\n          {paginationOptions.enabled &&\n            paginationOptions.position === \"outside\" &&\n            renderPagination()}\n        </div>\n\n        {/* Image Viewer */}\n        {enableImageViewer && imageInfos.length > 0 && (\n          <ImageViewer\n            images={imageInfos}\n            visible={viewerVisible}\n            onClose={() => {\n              console.log(\"Closing viewer\");\n              setViewerVisible(false);\n            }}\n            activeIndex={viewerIndex}\n            onIndexChange={setViewerIndex}\n          />\n        )}\n        {/* {enableImageViewer && (\n          <div\n            style={{\n              position: \"fixed\",\n              top: 10,\n              right: 10,\n              background: \"white\",\n              padding: \"10px\",\n              zIndex: 9999,\n              fontSize: \"12px\",\n            }}\n          >\n            Debug: visible={String(viewerVisible)}, images={imageInfos.length},\n            index={viewerIndex}\n          </div>\n        )} */}\n      </>\n    );\n  }\n);\n\nCarousel.displayName = \"Carousel\";\n\n// ============================================================================\n// Carousel Slide Component\n// ============================================================================\n\nexport const CarouselSlide = React.forwardRef<\n  HTMLDivElement,\n  CarouselSlideProps\n>(({ children, className, style, ...props }, ref) => {\n  return (\n    <div ref={ref} className={className} style={style} {...props}>\n      {children}\n    </div>\n  );\n});\n\nCarouselSlide.displayName = \"CarouselSlide\";\n\nexport default Carousel;\n"],"names":["Carousel","React","children","initialSlide","direction","speed","spaceBetween","slidesPerView","slidesPerGroup","centeredSlides","loop","rewind","effect","breakpoints","navigation","pagination","autoplay","allowTouchMove","grabCursor","keyboard","mousewheel","className","containerClassName","wrapperClassName","slideClassName","enableImageViewer","onSlideChange","onReachBeginning","onReachEnd","onAutoplayStart","onAutoplayStop","ref","navigationOptions","paginationOptions","autoplayOptions","useMemo","activeIndex","setActiveIndex","useState","isBeginning","setIsBeginning","isEnd","setIsEnd","isDragging","setIsDragging","translate","setTranslate","isAutoplayRunning","setIsAutoplayRunning","showScrollbar","setShowScrollbar","windowWidth","setWindowWidth","viewerVisible","setViewerVisible","viewerIndex","setViewerIndex","useEffect","handleResize","currentBreakpoint","breakpointKeys","a","b","breakpoint","actualSlidesPerView","actualSpaceBetween","actualSlidesPerGroup","containerRef","useRef","wrapperRef","autoplayTimerRef","scrollbarTimerRef","dragStateRef","hasDraggedRef","slides","Children","child","isValidElement","CarouselSlide","totalSlides","findImageInChildren","useCallback","result","imageInfos","slide","imgElement","handleSlideClick","index","visibleSlides","slideTo","newIndex","containerSize","slideSize","newTranslate","slideNext","slidePrev","stopAutoplay","startAutoplay","handleMouseEnter","handleMouseLeave","handlePointerDown","e","err","handlePointerMove","startX","startY","diffX","diffY","handlePointerUp","diff","handleKeyDown","handleWheel","container","renderPagination","type","clickable","dynamicBullets","dynamicMainBullets","position","isOutside","bulletsToShow","jsx","cn","i","bulletIndex","isActive","jsxs","Fragment","progress","isInside","handleProgressbarClick","rect","percentage","targetIndex","dragWidth","scrollPosition","handleScrollbarClick","getSlideTransform","slideElement","cloneElement","ChevronLeft","ChevronUp","ChevronRight","ChevronDown","ImageViewer","style","props"],"mappings":"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"}
+{"version":3,"file":"Carousel.cjs","sources":["../../../../src/components/Carousel/Carousel.tsx"],"sourcesContent":["import React, {\n  useState,\n  useEffect,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  isValidElement,\n  cloneElement,\n} from \"react\";\nimport {\n  ChevronLeft,\n  ChevronRight,\n  ChevronUp,\n  ChevronDown,\n} from \"lucide-react\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ImageViewer } from \"../ImageViewer\";\nimport type { ImageInfo } from \"../ImageViewer\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type SliderEffect =\n  | \"slide\"\n  | \"fade\"\n  | \"cube\"\n  | \"coverflow\"\n  | \"flip\"\n  | \"cards\";\n\nexport type SliderDirection = \"horizontal\" | \"vertical\";\n\nexport type PaginationType =\n  | \"bullets\"\n  | \"fraction\"\n  | \"progressbar\"\n  | \"scrollbar\"\n  | \"custom\";\n\nexport interface AutoplayOptions {\n  delay?: number;\n  disableOnInteraction?: boolean;\n  pauseOnMouseEnter?: boolean;\n  reverseDirection?: boolean;\n  stopOnLastSlide?: boolean;\n}\n\nexport interface BreakpointOptions {\n  slidesPerView?: number;\n  spaceBetween?: number;\n  slidesPerGroup?: number;\n}\n\nexport interface NavigationOptions {\n  enabled?: boolean;\n  prevEl?: React.ReactNode;\n  nextEl?: React.ReactNode;\n  hideOnClick?: boolean;\n  position?: \"inside\" | \"outside\"; // inside = overlay on image, outside = beside image\n}\n\nexport interface PaginationOptions {\n  enabled?: boolean;\n  type?: PaginationType;\n  clickable?: boolean;\n  dynamicBullets?: boolean;\n  dynamicMainBullets?: number;\n  position?: \"inside\" | \"outside\"; // inside = overlay on image, outside = below image\n  renderBullet?: (index: number, className: string) => React.ReactNode;\n  renderFraction?: (\n    currentClass: string,\n    totalClass: string\n  ) => React.ReactNode;\n  renderProgressbar?: (progressbarFillClass: string) => React.ReactNode;\n  renderScrollbar?: (scrollbarDragClass: string) => React.ReactNode;\n  renderCustom?: (current: number, total: number) => React.ReactNode;\n}\n\nexport interface CarouselProps {\n  children: React.ReactNode;\n  // Core\n  initialSlide?: number;\n  direction?: SliderDirection;\n  speed?: number;\n  spaceBetween?: number;\n  slidesPerView?: number | \"auto\";\n  slidesPerGroup?: number;\n  centeredSlides?: boolean;\n  loop?: boolean;\n  loopedSlides?: number;\n  rewind?: boolean;\n  effect?: SliderEffect;\n  // Responsive breakpoints\n  breakpoints?: Record<number, BreakpointOptions>;\n  // Navigation\n  navigation?: boolean | NavigationOptions;\n  // Pagination\n  pagination?: boolean | PaginationOptions;\n  // Autoplay\n  autoplay?: boolean | AutoplayOptions;\n  // Interaction\n  allowTouchMove?: boolean;\n  grabCursor?: boolean;\n  keyboard?: boolean;\n  mousewheel?: boolean;\n  freeMode?: boolean;\n  // Styling\n  className?: string;\n  containerClassName?: string;\n  wrapperClassName?: string;\n  slideClassName?: string;\n  // Image Viewer\n  enableImageViewer?: boolean;\n  // Callbacks\n  onSlideChange?: (swiper: { activeIndex: number; realIndex: number }) => void;\n  onReachBeginning?: () => void;\n  onReachEnd?: () => void;\n  onAutoplayStart?: () => void;\n  onAutoplayStop?: () => void;\n}\n\n// ============================================================================\n// Carousel Slide Component Types\n// ============================================================================\n\nexport interface CarouselSlideProps\n  extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\n// ============================================================================\n// Carousel Component\n// ============================================================================\n\nexport const Carousel = React.forwardRef<HTMLDivElement, CarouselProps>(\n  (\n    {\n      children,\n      initialSlide = 0,\n      direction = \"horizontal\",\n      speed = 300,\n      spaceBetween = 0,\n      slidesPerView = 1,\n      slidesPerGroup = 1,\n      centeredSlides = false,\n      loop = false,\n      rewind = false,\n      effect = \"slide\",\n      breakpoints,\n      navigation = false,\n      pagination = false,\n      autoplay = false,\n      allowTouchMove = true,\n      grabCursor = true,\n      keyboard = false,\n      mousewheel = false,\n      className,\n      containerClassName,\n      wrapperClassName,\n      slideClassName,\n      enableImageViewer = false,\n      onSlideChange,\n      onReachBeginning,\n      onReachEnd,\n      onAutoplayStart,\n      onAutoplayStop,\n    },\n    ref\n  ) => {\n    // Parse navigation options\n    const navigationOptions: NavigationOptions =\n      typeof navigation === \"boolean\"\n        ? { enabled: navigation, position: \"inside\" }\n        : { enabled: true, position: \"inside\", ...navigation };\n\n    // Parse pagination options\n    const paginationOptions: PaginationOptions =\n      typeof pagination === \"boolean\"\n        ? { enabled: pagination, type: \"bullets\", position: \"inside\" }\n        : { enabled: true, type: \"bullets\", position: \"inside\", ...pagination };\n\n    // Parse autoplay options\n    const autoplayOptions: AutoplayOptions = useMemo(\n      () =>\n        typeof autoplay === \"boolean\"\n          ? { delay: 3000, disableOnInteraction: true }\n          : { delay: 3000, disableOnInteraction: true, ...autoplay },\n      [autoplay]\n    );\n\n    // State\n    const [activeIndex, setActiveIndex] = useState(initialSlide);\n    const [isBeginning, setIsBeginning] = useState(initialSlide === 0);\n    const [isEnd, setIsEnd] = useState(false);\n    const [isDragging, setIsDragging] = useState(false);\n    const [translate, setTranslate] = useState(0);\n    const [isAutoplayRunning, setIsAutoplayRunning] = useState(false);\n    const [showScrollbar, setShowScrollbar] = useState(false);\n    const [windowWidth, setWindowWidth] = useState(\n      typeof window !== \"undefined\" ? window.innerWidth : 1024\n    );\n    const [viewerVisible, setViewerVisible] = useState(false);\n    const [viewerIndex, setViewerIndex] = useState(0);\n\n    // Handle window resize for breakpoints\n    useEffect(() => {\n      if (!breakpoints) return;\n\n      const handleResize = () => {\n        setWindowWidth(window.innerWidth);\n      };\n\n      window.addEventListener(\"resize\", handleResize);\n      return () => window.removeEventListener(\"resize\", handleResize);\n    }, [breakpoints]);\n\n    // Get current breakpoint values\n    const currentBreakpoint = useMemo(() => {\n      if (!breakpoints) {\n        return { slidesPerView, spaceBetween, slidesPerGroup };\n      }\n\n      const breakpointKeys = Object.keys(breakpoints)\n        .map(Number)\n        .sort((a, b) => b - a); // Sort descending\n\n      for (const breakpoint of breakpointKeys) {\n        if (windowWidth >= breakpoint) {\n          return {\n            slidesPerView:\n              breakpoints[breakpoint].slidesPerView ?? slidesPerView,\n            spaceBetween: breakpoints[breakpoint].spaceBetween ?? spaceBetween,\n            slidesPerGroup:\n              breakpoints[breakpoint].slidesPerGroup ?? slidesPerGroup,\n          };\n        }\n      }\n\n      return { slidesPerView, spaceBetween, slidesPerGroup };\n    }, [breakpoints, windowWidth, slidesPerView, spaceBetween, slidesPerGroup]);\n\n    // Use breakpoint values\n    const actualSlidesPerView = currentBreakpoint.slidesPerView;\n    const actualSpaceBetween = currentBreakpoint.spaceBetween;\n    const actualSlidesPerGroup = currentBreakpoint.slidesPerGroup;\n\n    // Refs\n    const containerRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const autoplayTimerRef = useRef<number | null>(null);\n    const scrollbarTimerRef = useRef<number | null>(null);\n    const dragStateRef = useRef({\n      startX: 0,\n      startY: 0,\n      currentX: 0,\n      currentY: 0,\n    });\n    const hasDraggedRef = useRef(false);\n\n    // Get slides\n    const slides = Children.toArray(children).filter(\n      (child) => isValidElement(child) && child.type === CarouselSlide\n    );\n    const totalSlides = slides.length;\n\n    // Helper function to find image in children\n    const findImageInChildren = useCallback(\n      (\n        children: React.ReactNode\n      ): React.ReactElement<\n        React.ImgHTMLAttributes<HTMLImageElement>\n      > | null => {\n        let result: React.ReactElement<\n          React.ImgHTMLAttributes<HTMLImageElement>\n        > | null = null;\n\n        React.Children.forEach(children, (child) => {\n          if (result) return;\n\n          if (isValidElement(child)) {\n            if (child.type === \"img\") {\n              result = child as React.ReactElement<\n                React.ImgHTMLAttributes<HTMLImageElement>\n              >;\n            } else if (\n              child.props &&\n              typeof child.props === \"object\" &&\n              \"children\" in child.props\n            ) {\n              result = findImageInChildren(\n                child.props.children as React.ReactNode\n              );\n            }\n          }\n        });\n\n        return result;\n      },\n      []\n    );\n\n    // Extract images for ImageViewer\n    const imageInfos = useMemo((): ImageInfo[] => {\n      if (!enableImageViewer) return [];\n\n      return slides.map((slide) => {\n        const slideElement = slide as React.ReactElement<CarouselSlideProps>;\n        const imgElement = findImageInChildren(slideElement.props.children);\n\n        if (imgElement) {\n          return {\n            src: imgElement.props.src || \"\",\n            alt: imgElement.props.alt || \"\",\n          };\n        }\n\n        return { src: \"\", alt: \"\" };\n      });\n    }, [slides, enableImageViewer, findImageInChildren]);\n\n    // Handle slide click for image viewer\n    const handleSlideClick = useCallback(\n      (index: number) => {\n        console.log(\"Slide clicked:\", {\n          index,\n          enableImageViewer,\n          hasSrc: !!imageInfos[index]?.src,\n          hasDragged: hasDraggedRef.current,\n          imageInfos,\n        });\n\n        // Only open viewer if not dragged\n        if (\n          enableImageViewer &&\n          imageInfos[index]?.src &&\n          !hasDraggedRef.current\n        ) {\n          console.log(\"Opening viewer at index:\", index);\n          setViewerIndex(index);\n          setViewerVisible(true);\n        }\n      },\n      [enableImageViewer, imageInfos]\n    );\n\n    // Calculate visible slides\n    const visibleSlides =\n      actualSlidesPerView === \"auto\"\n        ? 1\n        : Math.min(actualSlidesPerView as number, totalSlides);\n\n    // Update beginning/end state\n    useEffect(() => {\n      if (loop) {\n        setIsBeginning(false);\n        setIsEnd(false);\n      } else {\n        setIsBeginning(activeIndex === 0);\n        setIsEnd(activeIndex >= totalSlides - visibleSlides);\n      }\n    }, [activeIndex, totalSlides, visibleSlides, loop]);\n\n    // Slide to index\n    const slideTo = useCallback(\n      (index: number) => {\n        let newIndex = index;\n\n        if (loop) {\n          // In loop mode, allow any index\n          newIndex = ((index % totalSlides) + totalSlides) % totalSlides;\n        } else if (rewind) {\n          // In rewind mode, wrap around\n          if (index < 0) newIndex = totalSlides - 1;\n          else if (index >= totalSlides) newIndex = 0;\n          else newIndex = index;\n        } else {\n          // Normal mode, clamp to bounds\n          newIndex = Math.max(0, Math.min(index, totalSlides - visibleSlides));\n        }\n\n        setActiveIndex(newIndex);\n\n        // Calculate translate\n        const containerSize =\n          direction === \"horizontal\"\n            ? containerRef.current?.offsetWidth || 0\n            : containerRef.current?.offsetHeight || 0;\n\n        const slideSize = containerSize / visibleSlides;\n        let newTranslate = -newIndex * (slideSize + actualSpaceBetween);\n\n        if (centeredSlides && visibleSlides < totalSlides) {\n          newTranslate += containerSize / 2 - slideSize / 2;\n        }\n\n        setTranslate(newTranslate);\n\n        // Show scrollbar on slide change\n        if (paginationOptions.type === \"scrollbar\") {\n          setShowScrollbar(true);\n          if (scrollbarTimerRef.current) {\n            clearTimeout(scrollbarTimerRef.current);\n          }\n          scrollbarTimerRef.current = setTimeout(() => {\n            setShowScrollbar(false);\n          }, 1000) as unknown as number;\n        }\n\n        // Callbacks\n        onSlideChange?.({ activeIndex: newIndex, realIndex: newIndex });\n\n        if (newIndex === 0) onReachBeginning?.();\n        if (newIndex >= totalSlides - visibleSlides) onReachEnd?.();\n      },\n      [\n        totalSlides,\n        visibleSlides,\n        loop,\n        rewind,\n        direction,\n        actualSpaceBetween,\n        centeredSlides,\n        paginationOptions.type,\n        onSlideChange,\n        onReachBeginning,\n        onReachEnd,\n      ]\n    );\n\n    // Navigation\n    const slideNext = useCallback(() => {\n      slideTo(activeIndex + actualSlidesPerGroup);\n    }, [activeIndex, actualSlidesPerGroup, slideTo]);\n\n    const slidePrev = useCallback(() => {\n      slideTo(activeIndex - actualSlidesPerGroup);\n    }, [activeIndex, actualSlidesPerGroup, slideTo]);\n\n    // Autoplay\n    const stopAutoplay = useCallback(() => {\n      if (autoplayTimerRef.current) {\n        clearInterval(autoplayTimerRef.current);\n        autoplayTimerRef.current = null;\n      }\n      setIsAutoplayRunning(false);\n      onAutoplayStop?.();\n    }, [onAutoplayStop]);\n\n    const startAutoplay = useCallback(() => {\n      if (!autoplay) return;\n\n      autoplayTimerRef.current = setInterval(() => {\n        if (autoplayOptions.reverseDirection) {\n          slidePrev();\n        } else {\n          slideNext();\n        }\n\n        if (autoplayOptions.stopOnLastSlide && isEnd) {\n          stopAutoplay();\n        }\n      }, autoplayOptions.delay) as unknown as number;\n\n      setIsAutoplayRunning(true);\n      onAutoplayStart?.();\n    }, [\n      autoplayOptions,\n      autoplay,\n      slideNext,\n      slidePrev,\n      isEnd,\n      onAutoplayStart,\n      stopAutoplay,\n    ]);\n\n    // Auto-start autoplay\n    useEffect(() => {\n      if (autoplay) {\n        startAutoplay();\n      }\n      return () => stopAutoplay();\n    }, [autoplay, startAutoplay, stopAutoplay]);\n\n    // Pause on hover\n    const handleMouseEnter = useCallback(() => {\n      if (autoplayOptions.pauseOnMouseEnter && isAutoplayRunning) {\n        stopAutoplay();\n      }\n    }, [autoplayOptions.pauseOnMouseEnter, isAutoplayRunning, stopAutoplay]);\n\n    const handleMouseLeave = useCallback(() => {\n      if (autoplayOptions.pauseOnMouseEnter && autoplay && !isAutoplayRunning) {\n        startAutoplay();\n      }\n    }, [\n      autoplayOptions.pauseOnMouseEnter,\n      autoplay,\n      isAutoplayRunning,\n      startAutoplay,\n    ]);\n\n    // Touch/drag handlers\n    const handlePointerDown = useCallback(\n      (e: React.PointerEvent) => {\n        if (!allowTouchMove) return;\n\n        try {\n          e.currentTarget.setPointerCapture(e.pointerId);\n        } catch (err) {\n          console.error(\"Failed to capture pointer:\", err);\n        }\n\n        dragStateRef.current.startX = e.clientX;\n        dragStateRef.current.startY = e.clientY;\n        dragStateRef.current.currentX = e.clientX;\n        dragStateRef.current.currentY = e.clientY;\n        hasDraggedRef.current = false;\n        setIsDragging(true);\n\n        if (autoplayOptions.disableOnInteraction) {\n          stopAutoplay();\n        }\n      },\n      [allowTouchMove, autoplayOptions.disableOnInteraction, stopAutoplay]\n    );\n\n    const handlePointerMove = useCallback(\n      (e: React.PointerEvent) => {\n        if (!allowTouchMove) return;\n\n        const startX = dragStateRef.current.startX;\n        const startY = dragStateRef.current.startY;\n\n        // Check if drag has started (startX/Y are set)\n        if (startX === 0 && startY === 0) return;\n\n        e.preventDefault();\n        dragStateRef.current.currentX = e.clientX;\n        dragStateRef.current.currentY = e.clientY;\n\n        // Mark as dragged if moved more than 5px\n        const diffX = Math.abs(e.clientX - dragStateRef.current.startX);\n        const diffY = Math.abs(e.clientY - dragStateRef.current.startY);\n        if (diffX > 5 || diffY > 5) {\n          hasDraggedRef.current = true;\n        }\n\n        setIsDragging(true);\n      },\n      [allowTouchMove]\n    );\n\n    const handlePointerUp = useCallback(() => {\n      const startX = dragStateRef.current.startX;\n      const startY = dragStateRef.current.startY;\n\n      // Check if we actually dragged\n      if (startX === 0 && startY === 0) return;\n\n      const diffX = dragStateRef.current.currentX - startX;\n      const diffY = dragStateRef.current.currentY - startY;\n      const diff = direction === \"horizontal\" ? diffX : diffY;\n\n      // Determine slide action with lower threshold\n      const threshold = 0;\n      if (Math.abs(diff) > threshold && hasDraggedRef.current) {\n        if (diff > 0) {\n          // Swipe right/down = previous slide\n          slidePrev();\n        } else {\n          // Swipe left/up = next slide\n          slideNext();\n        }\n      } else {\n        // Snap back to current\n        slideTo(activeIndex);\n      }\n\n      // Reset after a small delay to allow onClick to check the flag\n      setTimeout(() => {\n        setIsDragging(false);\n        dragStateRef.current.startX = 0;\n        dragStateRef.current.startY = 0;\n        dragStateRef.current.currentX = 0;\n        dragStateRef.current.currentY = 0;\n        hasDraggedRef.current = false;\n      }, 50);\n    }, [direction, slidePrev, slideNext, slideTo, activeIndex]);\n\n    // Keyboard navigation\n    useEffect(() => {\n      if (!keyboard) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n          e.preventDefault();\n          slidePrev();\n        } else if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n          e.preventDefault();\n          slideNext();\n        }\n      };\n\n      window.addEventListener(\"keydown\", handleKeyDown);\n      return () => window.removeEventListener(\"keydown\", handleKeyDown);\n    }, [keyboard, slideNext, slidePrev]);\n\n    // Mousewheel navigation\n    useEffect(() => {\n      if (!mousewheel) return;\n\n      const handleWheel = (e: WheelEvent) => {\n        e.preventDefault();\n        if (e.deltaY > 0) slideNext();\n        else if (e.deltaY < 0) slidePrev();\n      };\n\n      const container = containerRef.current;\n      if (container) {\n        container.addEventListener(\"wheel\", handleWheel, { passive: false });\n        return () => container.removeEventListener(\"wheel\", handleWheel);\n      }\n    }, [mousewheel, slideNext, slidePrev]);\n\n    // Render pagination\n    const renderPagination = () => {\n      if (!paginationOptions.enabled) return null;\n\n      const {\n        type,\n        clickable,\n        dynamicBullets,\n        dynamicMainBullets = 1,\n        position = \"inside\",\n      } = paginationOptions;\n\n      const isOutside = position === \"outside\";\n\n      if (type === \"bullets\") {\n        const bulletsToShow = dynamicBullets\n          ? Math.min(dynamicMainBullets * 2 + 1, totalSlides)\n          : totalSlides;\n\n        return (\n          <div\n            className={cn(\n              \"ds:flex ds:items-center ds:justify-center ds:gap-2\",\n              isOutside\n                ? \"ds:mt-4\" // Outside: margin-top for spacing\n                : \"ds:absolute ds:bottom-4 ds:left-1/2 ds:-translate-x-1/2\", // Inside: overlay\n              direction === \"vertical\" &&\n                !isOutside &&\n                \"ds:flex-col ds:right-4 ds:left-auto ds:top-1/2 ds:-translate-y-1/2 ds:translate-x-0 ds:bottom-auto\"\n            )}\n          >\n            {Array.from({ length: bulletsToShow }).map((_, i) => {\n              const bulletIndex = dynamicBullets\n                ? Math.max(\n                    0,\n                    Math.min(\n                      i + activeIndex - dynamicMainBullets,\n                      totalSlides - 1\n                    )\n                  )\n                : i;\n\n              const isActive = bulletIndex === activeIndex;\n\n              return paginationOptions.renderBullet ? (\n                <React.Fragment key={bulletIndex}>\n                  {paginationOptions.renderBullet(\n                    bulletIndex,\n                    cn(\n                      \"ds:carousel-pagination-bullet\",\n                      isActive && \"ds:carousel-pagination-bullet-active\"\n                    )\n                  )}\n                </React.Fragment>\n              ) : (\n                <button\n                  key={bulletIndex}\n                  onClick={() => clickable && slideTo(bulletIndex)}\n                  className={cn(\n                    \"ds:rounded-full ds:transition-all\",\n                    direction === \"horizontal\" ? \"ds:w-2 ds:h-2\" : \"ds:w-2 ds:h-2\",\n                    isActive\n                      ? direction === \"horizontal\"\n                        ? \"ds:bg-primary ds:w-6\"\n                        : \"ds:bg-primary ds:h-6\"\n                      : \"ds:bg-muted-foreground/30 ds:hover:bg-muted-foreground/50\",\n                    clickable && \"ds:cursor-pointer\"\n                  )}\n                  aria-label={`Go to slide ${bulletIndex + 1}`}\n                />\n              );\n            })}\n          </div>\n        );\n      }\n\n      if (type === \"fraction\") {\n        return (\n          <div\n            className={cn(\n              \"ds:text-center ds:text-sm ds:text-muted-foreground ds:bg-background/80 ds:backdrop-blur ds:px-3 ds:py-1 ds:rounded-full\",\n              isOutside\n                ? \"ds:mt-4 ds:mx-auto ds:w-fit\" // Outside: centered with margin\n                : \"ds:absolute ds:bottom-4 ds:left-1/2 ds:-translate-x-1/2\" // Inside: overlay\n            )}\n          >\n            {paginationOptions.renderFraction ? (\n              paginationOptions.renderFraction(\n                \"carousel-pagination-current\",\n                \"carousel-pagination-total\"\n              )\n            ) : (\n              <>\n                <span className=\"ds:carousel-pagination-current ds:font-semibold ds:text-foreground\">\n                  {activeIndex + 1}\n                </span>\n                {\" / \"}\n                <span className=\"ds:carousel-pagination-total\">{totalSlides}</span>\n              </>\n            )}\n          </div>\n        );\n      }\n\n      if (type === \"progressbar\") {\n        const progress = ((activeIndex + 1) / totalSlides) * 100;\n        const isInside = paginationOptions.position === \"inside\";\n\n        const handleProgressbarClick = (\n          e: React.MouseEvent<HTMLDivElement>\n        ) => {\n          if (!clickable) return;\n          const rect = e.currentTarget.getBoundingClientRect();\n          const clickX = e.clientX - rect.left;\n          const percentage = clickX / rect.width;\n          const targetIndex = Math.floor(percentage * totalSlides);\n          slideTo(Math.min(targetIndex, totalSlides - 1));\n        };\n\n        return (\n          <div\n            onClick={handleProgressbarClick}\n            className={cn(\n              \"ds:w-full ds:h-1 ds:bg-muted ds:rounded-full ds:overflow-hidden\",\n              isInside\n                ? \"ds:absolute ds:bottom-0 ds:left-0 ds:right-0 ds:rounded-none\"\n                : \"ds:mt-4\",\n              clickable && \"ds:cursor-pointer\"\n            )}\n          >\n            {paginationOptions.renderProgressbar ? (\n              paginationOptions.renderProgressbar(\"carousel-progressbar-fill\")\n            ) : (\n              <div\n                className=\"ds:carousel-progressbar-fill ds:h-full ds:bg-primary ds:transition-all ds:duration-300\"\n                style={{ width: `${progress}%` }}\n              />\n            )}\n          </div>\n        );\n      }\n\n      if (type === \"custom\" && paginationOptions.renderCustom) {\n        return (\n          <div\n            className={cn(\n              isOutside\n                ? \"ds:mt-4 ds:flex ds:justify-center\" // Outside: centered with margin\n                : \"ds:absolute ds:bottom-4 ds:left-1/2 ds:-translate-x-1/2\" // Inside: overlay\n            )}\n          >\n            {paginationOptions.renderCustom(activeIndex + 1, totalSlides)}\n          </div>\n        );\n      }\n\n      if (type === \"scrollbar\") {\n        const dragWidth = (1 / totalSlides) * 100;\n        const scrollPosition =\n          (activeIndex / (totalSlides - 1)) * (100 - dragWidth);\n\n        const handleScrollbarClick = (e: React.MouseEvent<HTMLDivElement>) => {\n          if (!clickable) return;\n\n          // Show scrollbar on click\n          setShowScrollbar(true);\n          if (scrollbarTimerRef.current) {\n            clearTimeout(scrollbarTimerRef.current);\n          }\n\n          const rect = e.currentTarget.getBoundingClientRect();\n          const clickX = e.clientX - rect.left;\n          const percentage = clickX / rect.width;\n          const targetIndex = Math.round(percentage * (totalSlides - 1));\n          slideTo(Math.max(0, Math.min(targetIndex, totalSlides - 1)));\n\n          // Hide after 1s\n          scrollbarTimerRef.current = setTimeout(() => {\n            setShowScrollbar(false);\n          }, 1000) as unknown as number;\n        };\n\n        return (\n          <div\n            onClick={handleScrollbarClick}\n            className={cn(\n              \"ds:w-full ds:h-1 ds:bg-muted/50 ds:rounded-full ds:transition-opacity ds:duration-300\",\n              isOutside\n                ? \"ds:mt-4\" // Outside: margin-top for spacing\n                : \"ds:absolute ds:bottom-0 ds:left-1/2 ds:-translate-x-1/2\", // Inside: overlay at bottom\n              clickable && \"ds:cursor-pointer\",\n              showScrollbar ? \"ds:opacity-100\" : \"ds:opacity-0\"\n            )}\n          >\n            {paginationOptions.renderScrollbar ? (\n              paginationOptions.renderScrollbar(\"carousel-scrollbar-drag\")\n            ) : (\n              <div\n                className=\"ds:carousel-scrollbar-drag ds:h-full ds:bg-primary ds:rounded-full ds:transition-all ds:duration-300 ds:absolute ds:left-0\"\n                style={{\n                  width: `${dragWidth}%`,\n                  left: `${scrollPosition}%`,\n                }}\n              />\n            )}\n          </div>\n        );\n      }\n\n      return null;\n    };\n\n    // Get effect transform/classes for slides\n    const getSlideTransform = (index: number) => {\n      const diff = index - activeIndex;\n\n      switch (effect) {\n        case \"fade\":\n          return {\n            opacity: diff === 0 ? 1 : 0,\n            zIndex: diff === 0 ? 10 : 0,\n          };\n        case \"cube\":\n          return {\n            transform: `translateX(${diff * 100}%) rotateY(${diff * -90}deg)`,\n            transformOrigin: diff > 0 ? \"left center\" : \"right center\",\n          };\n        case \"coverflow\":\n          return {\n            transform: `translateX(${diff * 60}%) translateZ(${Math.abs(diff) * -100}px) rotateY(${diff * -50}deg)`,\n            zIndex: -Math.abs(diff),\n          };\n        case \"flip\":\n          return {\n            transform: `rotateY(${diff * 180}deg)`,\n            backfaceVisibility: \"hidden\" as const,\n          };\n        case \"cards\":\n          return {\n            transform: `translateX(${diff * 50}px) translateZ(${-Math.abs(diff) * 100}px) scale(${1 - Math.abs(diff) * 0.2})`,\n            opacity: diff === 0 ? 1 : 0.5,\n            zIndex: 100 - Math.abs(diff) * 10,\n            transition: \"all 0.5s ease\",\n          };\n        default:\n          return {};\n      }\n    };\n\n    return (\n      <>\n        <div\n          ref={ref}\n          className={cn(\"ds:carousel-container\", containerClassName, className)}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n        >\n          <div\n            ref={containerRef}\n            className={cn(\n              \"ds:carousel ds:relative ds:overflow-hidden\",\n              (effect === \"fade\" ||\n                effect === \"cube\" ||\n                effect === \"flip\" ||\n                effect === \"cards\") &&\n                \"ds:aspect-4/3\",\n              effect === \"coverflow\" && \"ds:aspect-4/2 ds:rounded-xl\",\n              direction === \"vertical\" && effect === \"slide\" && \"ds:h-full\",\n              grabCursor && allowTouchMove && !isDragging && \"ds:cursor-grab\",\n              isDragging && \"ds:cursor-grabbing\"\n            )}\n          >\n            {/* Wrapper */}\n            <div\n              ref={wrapperRef}\n              className={cn(\n                \"ds:carousel-wrapper ds:select-none\",\n                effect === \"slide\" && \"ds:flex\",\n                direction === \"vertical\" &&\n                  effect === \"slide\" &&\n                  \"ds:flex-col ds:h-full\",\n                effect !== \"slide\" && \"ds:relative\",\n                wrapperClassName\n              )}\n              style={{\n                transform:\n                  effect === \"slide\"\n                    ? direction === \"horizontal\"\n                      ? `translateX(${translate}px)`\n                      : `translateY(${translate}px)`\n                    : undefined,\n                transition: isDragging ? \"none\" : `transform ${speed}ms ease`,\n                gap: effect === \"slide\" ? `${actualSpaceBetween}px` : undefined,\n                perspective:\n                  effect !== \"slide\" && effect !== \"fade\"\n                    ? \"1200px\"\n                    : undefined,\n                touchAction: allowTouchMove ? \"none\" : \"auto\",\n                height:\n                  direction === \"vertical\" && effect === \"slide\"\n                    ? \"100%\"\n                    : undefined,\n              }}\n              onPointerDown={handlePointerDown}\n              onPointerMove={handlePointerMove}\n              onPointerUp={handlePointerUp}\n              onPointerCancel={handlePointerUp}\n            >\n              {slides.map((slide, index) => {\n                const isActive = index === activeIndex;\n                const slideElement =\n                  slide as React.ReactElement<CarouselSlideProps>;\n\n                return cloneElement(slideElement, {\n                  key: index,\n                  className: cn(\n                    \"ds:carousel-slide\",\n                    slideClassName,\n                    slideElement.props.className,\n                    effect !== \"slide\" && \"ds:absolute ds:inset-0\",\n                    effect === \"fade\" && \"ds:transition-opacity ds:duration-300\",\n                    effect !== \"slide\" &&\n                      effect !== \"fade\" &&\n                      \"ds:transition-all ds:duration-500\",\n                    enableImageViewer &&\n                      imageInfos[index]?.src &&\n                      \"ds:cursor-pointer\"\n                  ),\n                  style: {\n                    flex:\n                      effect === \"slide\"\n                        ? direction === \"vertical\"\n                          ? `0 0 100%`\n                          : `0 0 calc(${100 / visibleSlides}% - ${(actualSpaceBetween * (visibleSlides - 1)) / visibleSlides}px)`\n                        : undefined,\n                    minWidth:\n                      effect === \"slide\" && direction === \"horizontal\"\n                        ? 0\n                        : undefined,\n                    minHeight:\n                      effect === \"slide\" && direction === \"vertical\"\n                        ? 0\n                        : undefined,\n                    height:\n                      direction === \"vertical\" && effect === \"slide\"\n                        ? \"100%\"\n                        : undefined,\n                    userSelect: \"none\",\n                    // @ts-expect-error - WebkitUserDrag is not in CSSProperties but is valid CSS\n                    WebkitUserDrag: \"none\",\n                    ...(effect !== \"slide\" ? getSlideTransform(index) : {}),\n                    ...slideElement.props.style,\n                  } as React.CSSProperties,\n                  onClick: (e: React.MouseEvent) => {\n                    e.stopPropagation();\n                    handleSlideClick(index);\n                  },\n                  onDragStart: (e: React.DragEvent) => e.preventDefault(),\n                  \"data-active\": isActive,\n                  \"data-index\": index,\n                } as Partial<CarouselSlideProps>);\n              })}\n            </div>\n\n            {/* Pagination - Inside only (overlay on slider) */}\n            {paginationOptions.enabled &&\n              paginationOptions.position !== \"outside\" &&\n              renderPagination()}\n\n            {/* Navigation - Inside (overlay on slider) */}\n            {navigationOptions.enabled &&\n              navigationOptions.position === \"inside\" && (\n                <>\n                  <button\n                    onClick={slidePrev}\n                    disabled={!loop && !rewind && isBeginning}\n                    className={cn(\n                      \"ds:absolute ds:z-10 ds:w-10 ds:h-10 ds:rounded-full ds:bg-background/80 ds:backdrop-blur ds:shadow-lg ds:flex ds:items-center ds:justify-center ds:transition-all ds:hover:bg-background ds:disabled:opacity-30 ds:disabled:cursor-not-allowed\",\n                      direction === \"horizontal\"\n                        ? \"ds:left-4 ds:top-1/2 ds:-translate-y-1/2\"\n                        : \"ds:top-4 ds:left-1/2 ds:-translate-x-1/2\"\n                    )}\n                    aria-label=\"Previous slide\"\n                  >\n                    {navigationOptions.prevEl ||\n                      (direction === \"horizontal\" ? (\n                        <ChevronLeft className=\"ds:w-5 ds:h-5\" />\n                      ) : (\n                        <ChevronUp className=\"ds:w-5 ds:h-5\" />\n                      ))}\n                  </button>\n                  <button\n                    onClick={slideNext}\n                    disabled={!loop && !rewind && isEnd}\n                    className={cn(\n                      \"ds:absolute ds:z-10 ds:w-10 ds:h-10 ds:rounded-full ds:bg-background/80 ds:backdrop-blur ds:shadow-lg ds:flex ds:items-center ds:justify-center ds:transition-all ds:hover:bg-background ds:disabled:opacity-30 ds:disabled:cursor-not-allowed\",\n                      direction === \"horizontal\"\n                        ? \"ds:right-4 ds:top-1/2 ds:-translate-y-1/2\"\n                        : \"ds:bottom-4 ds:left-1/2 ds:-translate-x-1/2\"\n                    )}\n                    aria-label=\"Next slide\"\n                  >\n                    {navigationOptions.nextEl ||\n                      (direction === \"horizontal\" ? (\n                        <ChevronRight className=\"ds:w-5 ds:h-5\" />\n                      ) : (\n                        <ChevronDown className=\"ds:w-5 ds:h-5\" />\n                      ))}\n                  </button>\n                </>\n              )}\n          </div>\n\n          {/* Pagination - Outside (below slider) */}\n          {paginationOptions.enabled &&\n            paginationOptions.position === \"outside\" &&\n            renderPagination()}\n        </div>\n\n        {/* Image Viewer */}\n        {enableImageViewer && imageInfos.length > 0 && (\n          <ImageViewer\n            images={imageInfos}\n            visible={viewerVisible}\n            onClose={() => {\n              console.log(\"Closing viewer\");\n              setViewerVisible(false);\n            }}\n            activeIndex={viewerIndex}\n            onIndexChange={setViewerIndex}\n          />\n        )}\n        {/* {enableImageViewer && (\n          <div\n            style={{\n              position: \"fixed\",\n              top: 10,\n              right: 10,\n              background: \"white\",\n              padding: \"10px\",\n              zIndex: 9999,\n              fontSize: \"12px\",\n            }}\n          >\n            Debug: visible={String(viewerVisible)}, images={imageInfos.length},\n            index={viewerIndex}\n          </div>\n        )} */}\n      </>\n    );\n  }\n);\n\nCarousel.displayName = \"Carousel\";\n\n// ============================================================================\n// Carousel Slide Component\n// ============================================================================\n\nexport const CarouselSlide = React.forwardRef<\n  HTMLDivElement,\n  CarouselSlideProps\n>(({ children, className, style, ...props }, ref) => {\n  return (\n    <div ref={ref} className={className} style={style} {...props}>\n      {children}\n    </div>\n  );\n});\n\nCarouselSlide.displayName = \"CarouselSlide\";\n\nexport default Carousel;\n"],"names":["Carousel","React","children","initialSlide","direction","speed","spaceBetween","slidesPerView","slidesPerGroup","centeredSlides","loop","rewind","effect","breakpoints","navigation","pagination","autoplay","allowTouchMove","grabCursor","keyboard","mousewheel","className","containerClassName","wrapperClassName","slideClassName","enableImageViewer","onSlideChange","onReachBeginning","onReachEnd","onAutoplayStart","onAutoplayStop","ref","navigationOptions","paginationOptions","autoplayOptions","useMemo","activeIndex","setActiveIndex","useState","isBeginning","setIsBeginning","isEnd","setIsEnd","isDragging","setIsDragging","translate","setTranslate","isAutoplayRunning","setIsAutoplayRunning","showScrollbar","setShowScrollbar","windowWidth","setWindowWidth","viewerVisible","setViewerVisible","viewerIndex","setViewerIndex","useEffect","handleResize","currentBreakpoint","breakpointKeys","a","b","breakpoint","actualSlidesPerView","actualSpaceBetween","actualSlidesPerGroup","containerRef","useRef","wrapperRef","autoplayTimerRef","scrollbarTimerRef","dragStateRef","hasDraggedRef","slides","Children","child","isValidElement","CarouselSlide","totalSlides","findImageInChildren","useCallback","result","imageInfos","slide","imgElement","handleSlideClick","index","visibleSlides","slideTo","newIndex","containerSize","slideSize","newTranslate","slideNext","slidePrev","stopAutoplay","startAutoplay","handleMouseEnter","handleMouseLeave","handlePointerDown","e","err","handlePointerMove","startX","startY","diffX","diffY","handlePointerUp","diff","handleKeyDown","handleWheel","container","renderPagination","type","clickable","dynamicBullets","dynamicMainBullets","position","isOutside","bulletsToShow","jsx","cn","i","bulletIndex","isActive","jsxs","Fragment","progress","isInside","handleProgressbarClick","rect","percentage","targetIndex","dragWidth","scrollPosition","handleScrollbarClick","getSlideTransform","slideElement","cloneElement","ChevronLeft","ChevronUp","ChevronRight","ChevronDown","ImageViewer","style","props"],"mappings":"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"}

package/dist/cjs/components/Checkbox/Checkbox.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("react"),F=require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");const M=require("../../packages/ui/src/components/label.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");const a=require("../../packages/ui/src/lib/utils.cjs"),f=require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const p=require("../Tooltip/Tooltip.cjs"),D=require("motion/react"),L=require("../../utils/css.cjs"),b=o.forwardRef((g,j)=>{const{label:t,infoTooltip:s,helperText:i,state:c,variant:C="default",size:v="default",color:N,labelPosition:r="right",labelAlignment:u="center",icon:w,animation:T,id:k,onCheckedChange:d,...y}=g,[I,x]=o.useState(!1),S=o.useId(),n=k||S,P={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"},R=l=>{l&&(x(!0),setTimeout(()=>x(!1),800)),d?.(l)},q=r==="top"||r==="bottom",z=q?"flex-col":"flex-row",A=q?"gap-1.5":"gap-2",_=u==="start"?"items-start":u==="center"?"items-center":"items-end",m="flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";return e.jsxs("div",{className:a.cn("flex flex-col gap-1.5 relative",{}),children:[e.jsxs("div",{className:a.cn("flex",z,A,_),children:[(r==="top"||r==="left")&&t&&e.jsxs("label",{htmlFor:n,className:m,children:[t,s&&e.jsx(p.Tooltip,{content:s,children:e.jsx(f.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative inline-flex",children:[e.jsx(F.Checkbox,{ref:j,id:n,...y,variant:C,size:v,color:N,icon:w,onCheckedChange:T?R:d}),e.jsx(D.AnimatePresence,{children:I&&e.jsx("div",{className:"pointer-events-none absolute inset-0",children:[...Array(12)].map((l,h)=>e.jsx(L.ConfettiPiece,{index:h},h))})})]}),(r==="bottom"||r==="right")&&t&&e.jsxs(M.Label,{htmlFor:n,className:m,children:[t,s&&e.jsx(p.Tooltip,{content:s,children:e.jsx(f.Info,{className:"size-3.5 min-w-3.5"})})]})]}),i&&e.jsx("div",{className:"flex items-center justify-between text-xs gap-2",children:i&&e.jsx("p",{className:a.cn("text-xs",c?P?.[c]:""),children:i})})]})});b.displayName="Checkbox";exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("react"),F=require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");const M=require("../../packages/ui/src/components/label.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");const a=require("../../packages/ui/src/lib/utils.cjs"),f=require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const p=require("../Tooltip/Tooltip.cjs"),D=require("motion/react"),L=require("../../utils/css.cjs"),b=o.forwardRef((g,j)=>{const{label:r,infoTooltip:t,helperText:i,state:c,variant:C="default",size:v="default",color:N,labelPosition:s="right",labelAlignment:d="center",icon:w,animation:T,id:k,onCheckedChange:u,...y}=g,[I,x]=o.useState(!1),S=o.useId(),n=k||S,P={default:"ds:text-muted-foreground",success:"ds:text-success",warning:"ds:text-warning",error:"ds:text-error"},R=l=>{l&&(x(!0),setTimeout(()=>x(!1),800)),u?.(l)},q=s==="top"||s==="bottom",z=q?"flex-col":"flex-row",A=q?"gap-1.5":"gap-2",_=d==="start"?"items-start":d==="center"?"items-center":"items-end",m="flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";return e.jsxs("div",{className:a.cn("ds:flex ds:flex-col ds:gap-1.5 ds:relative",{}),children:[e.jsxs("div",{className:a.cn("ds:flex",z,A,_),children:[(s==="top"||s==="left")&&r&&e.jsxs("label",{htmlFor:n,className:m,children:[r,t&&e.jsx(p.Tooltip,{content:t,children:e.jsx(f.Info,{className:"ds:size-3.5 ds:min-w-3.5"})})]}),e.jsxs("div",{className:"ds:relative ds:inline-flex",children:[e.jsx(F.Checkbox,{ref:j,id:n,...y,variant:C,size:v,color:N,icon:w,onCheckedChange:T?R:u}),e.jsx(D.AnimatePresence,{children:I&&e.jsx("div",{className:"ds:pointer-events-none ds:absolute ds:inset-0",children:[...Array(12)].map((l,h)=>e.jsx(L.ConfettiPiece,{index:h},h))})})]}),(s==="bottom"||s==="right")&&r&&e.jsxs(M.Label,{htmlFor:n,className:m,children:[r,t&&e.jsx(p.Tooltip,{content:t,children:e.jsx(f.Info,{className:"ds:size-3.5 ds:min-w-3.5"})})]})]}),i&&e.jsx("div",{className:"ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2",children:i&&e.jsx("p",{className:a.cn("ds:text-xs",c?P?.[c]:""),children:i})})]})});b.displayName="Checkbox";exports.default=b;
 //# sourceMappingURL=Checkbox.cjs.map

package/dist/cjs/components/Checkbox/Checkbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Checkbox as SCheckbox } from \"@dsui/ui/components/checkbox\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\nimport { Info } from \"lucide-react\";\nimport { AnimatePresence } from \"motion/react\";\nimport { ConfettiPiece } from \"@/utils/css\";\nimport type { CheckedState } from \"@radix-ui/react-checkbox\";\n\nexport type CheckboxProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCheckbox>,\n  \"onCheckedChange\" | \"variant\" | \"size\" | \"color\" | \"icon\"\n> & {\n  onCheckedChange?: (checked: CheckedState) => void;\n  variant?: \"default\" | \"circle\";\n  size?: \"sm\" | \"default\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  icon?: React.ReactNode;\n  label?: React.ReactNode;\n  labelPosition?: \"top\" | \"left\" | \"right\" | \"bottom\";\n  labelAlignment?: \"start\" | \"center\" | \"end\";\n  infoTooltip?: React.ReactNode;\n  helperText?: React.ReactNode;\n  state?: \"default\" | \"error\" | \"success\" | \"warning\";\n  animation?: \"confetti\" | undefined;\n};\n\nconst Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const {\n      label,\n      infoTooltip,\n      helperText,\n      state,\n      variant = \"default\",\n      size = \"default\",\n      color,\n      labelPosition = \"right\",\n      labelAlignment = \"center\",\n      icon,\n      animation,\n      id,\n      onCheckedChange,\n      ...rest\n    } = props;\n    const [showConfetti, setShowConfetti] = useState(false);\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n\n    // State\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    const handleCheckedChange = (checked: CheckedState) => {\n      if (checked) {\n        setShowConfetti(true);\n        setTimeout(() => setShowConfetti(false), 800);\n      }\n      onCheckedChange?.(checked);\n    };\n\n    const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n    const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n    const gapClass = isVertical ? \"gap-1.5\" : \"gap-2\";\n\n    const alignmentClass =\n      labelAlignment === \"start\"\n        ? \"items-start\"\n        : labelAlignment === \"center\"\n          ? \"items-center\"\n          : \"items-end\";\n\n    const labelClass =\n      \"flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\";\n\n    return (\n      <div className={cn(\"flex flex-col gap-1.5 relative\", {})}>\n        <div className={cn(\"flex\", flexDirection, gapClass, alignmentClass)}>\n          {(labelPosition === \"top\" || labelPosition === \"left\") && label && (\n            <label htmlFor={inputId} className={labelClass}>\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"size-3.5 min-w-3.5\" />\n                </Tooltip>\n              )}\n            </label>\n          )}\n\n          <div className=\"relative inline-flex\">\n            <SCheckbox\n              ref={ref}\n              id={inputId}\n              {...rest}\n              variant={variant}\n              size={size}\n              color={color}\n              icon={icon}\n              onCheckedChange={\n                animation ? handleCheckedChange : onCheckedChange\n              }\n            />\n\n            <AnimatePresence>\n              {showConfetti && (\n                <div className=\"pointer-events-none absolute inset-0\">\n                  {[...Array(12)].map((_, i) => (\n                    <ConfettiPiece key={i} index={i} />\n                  ))}\n                </div>\n              )}\n            </AnimatePresence>\n          </div>\n\n          {(labelPosition === \"bottom\" || labelPosition === \"right\") &&\n            label && (\n              <Label htmlFor={inputId} className={labelClass}>\n                {label}\n                {infoTooltip && (\n                  <Tooltip content={infoTooltip}>\n                    <Info className=\"size-3.5 min-w-3.5\" />\n                  </Tooltip>\n                )}\n              </Label>\n            )}\n        </div>\n\n        {helperText && (\n          <div className=\"flex items-center justify-between text-xs gap-2\">\n            {helperText && (\n              <p\n                className={cn(\n                  \"text-xs\",\n                  state ? helperTextStyles?.[state] : \"\"\n                )}\n              >\n                {helperText}\n              </p>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\nexport default Checkbox;\n"],"names":["Checkbox","React","props","ref","label","infoTooltip","helperText","state","variant","size","color","labelPosition","labelAlignment","icon","animation","id","onCheckedChange","rest","showConfetti","setShowConfetti","useState","generatedId","inputId","helperTextStyles","handleCheckedChange","checked","isVertical","flexDirection","gapClass","alignmentClass","labelClass","cn","jsxs","Tooltip","jsx","Info","SCheckbox","AnimatePresence","_","i","ConfettiPiece","Label"],"mappings":"wsDAoCMA,EAAWC,EAAM,WACrB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAA,MACJC,EACA,YAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,UACP,MAAAC,EACA,cAAAC,EAAgB,QAChB,eAAAC,EAAiB,SACjB,KAAAC,EACA,UAAAC,EACA,GAAAC,EACA,gBAAAC,EACA,GAAGC,CAAA,EACDf,EACE,CAACgB,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAcpB,EAAM,MAAA,EACpBqB,EAAUP,GAAMM,EAGhBE,EAAmB,CACvB,QAAS,wBACT,QAAS,eACT,QAAS,eACT,MAAO,YAAA,EAGHC,EAAuBC,GAA0B,CACjDA,IACFN,EAAgB,EAAI,EACpB,WAAW,IAAMA,EAAgB,EAAK,EAAG,GAAG,GAE9CH,IAAkBS,CAAO,CAC3B,EAEMC,EAAaf,IAAkB,OAASA,IAAkB,SAC1DgB,EAAgBD,EAAa,WAAa,WAC1CE,EAAWF,EAAa,UAAY,QAEpCG,EACJjB,IAAmB,QACf,cACAA,IAAmB,SACjB,eACA,YAEFkB,EACJ,uEAEF,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,iCAAkC,CAAA,CAAE,EACrD,SAAA,CAAAC,OAAC,OAAI,UAAWD,EAAAA,GAAG,OAAQJ,EAAeC,EAAUC,CAAc,EAC9D,SAAA,EAAAlB,IAAkB,OAASA,IAAkB,SAAWP,UACvD,QAAA,CAAM,QAASkB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,EAEJ,EAGFH,EAAAA,KAAC,MAAA,CAAI,UAAU,uBACb,SAAA,CAAAE,EAAAA,IAACE,EAAAA,SAAA,CACC,IAAAjC,EACA,GAAImB,EACH,GAAGL,EACJ,QAAAT,EACA,KAAAC,EACA,MAAAC,EACA,KAAAG,EACA,gBACEC,EAAYU,EAAsBR,CAAA,CAAA,EAItCkB,EAAAA,IAACG,EAAAA,gBAAA,CACE,SAAAnB,GACCgB,EAAAA,IAAC,MAAA,CAAI,UAAU,uCACZ,SAAA,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,IAAI,CAACI,EAAGC,IACtBL,EAAAA,IAACM,EAAAA,cAAA,CAAsB,MAAOD,CAAA,EAAVA,CAAa,CAClC,CAAA,CACH,CAAA,CAEJ,CAAA,EACF,GAEE5B,IAAkB,UAAYA,IAAkB,UAChDP,UACGqC,EAAAA,MAAA,CAAM,QAASnB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,CAAA,CAEJ,CAAA,EAEN,EAEC7B,GACC4B,EAAAA,IAAC,MAAA,CAAI,UAAU,kDACZ,SAAA5B,GACC4B,EAAAA,IAAC,IAAA,CACC,UAAWH,EAAAA,GACT,UACAxB,EAAQgB,IAAmBhB,CAAK,EAAI,EAAA,EAGrC,SAAAD,CAAA,CAAA,CACH,CAEJ,CAAA,EAEJ,CAEJ,CACF,EAEAN,EAAS,YAAc"}
+{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Checkbox as SCheckbox } from \"@dsui/ui/components/checkbox\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\nimport { Info } from \"lucide-react\";\nimport { AnimatePresence } from \"motion/react\";\nimport { ConfettiPiece } from \"@/utils/css\";\nimport type { CheckedState } from \"@radix-ui/react-checkbox\";\n\nexport type CheckboxProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCheckbox>,\n  \"onCheckedChange\" | \"variant\" | \"size\" | \"color\" | \"icon\"\n> & {\n  onCheckedChange?: (checked: CheckedState) => void;\n  variant?: \"default\" | \"circle\";\n  size?: \"sm\" | \"default\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  icon?: React.ReactNode;\n  label?: React.ReactNode;\n  labelPosition?: \"top\" | \"left\" | \"right\" | \"bottom\";\n  labelAlignment?: \"start\" | \"center\" | \"end\";\n  infoTooltip?: React.ReactNode;\n  helperText?: React.ReactNode;\n  state?: \"default\" | \"error\" | \"success\" | \"warning\";\n  animation?: \"confetti\" | undefined;\n};\n\nconst Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const {\n      label,\n      infoTooltip,\n      helperText,\n      state,\n      variant = \"default\",\n      size = \"default\",\n      color,\n      labelPosition = \"right\",\n      labelAlignment = \"center\",\n      icon,\n      animation,\n      id,\n      onCheckedChange,\n      ...rest\n    } = props;\n    const [showConfetti, setShowConfetti] = useState(false);\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n\n    // State\n    const helperTextStyles = {\n      default: \"ds:text-muted-foreground\",\n      success: \"ds:text-success\",\n      warning: \"ds:text-warning\",\n      error: \"ds:text-error\",\n    };\n\n    const handleCheckedChange = (checked: CheckedState) => {\n      if (checked) {\n        setShowConfetti(true);\n        setTimeout(() => setShowConfetti(false), 800);\n      }\n      onCheckedChange?.(checked);\n    };\n\n    const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n    const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n    const gapClass = isVertical ? \"gap-1.5\" : \"gap-2\";\n\n    const alignmentClass =\n      labelAlignment === \"start\"\n        ? \"items-start\"\n        : labelAlignment === \"center\"\n          ? \"items-center\"\n          : \"items-end\";\n\n    const labelClass =\n      \"flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\";\n\n    return (\n      <div className={cn(\"ds:flex ds:flex-col ds:gap-1.5 ds:relative\", {})}>\n        <div className={cn(\"ds:flex\", flexDirection, gapClass, alignmentClass)}>\n          {(labelPosition === \"top\" || labelPosition === \"left\") && label && (\n            <label htmlFor={inputId} className={labelClass}>\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"ds:size-3.5 ds:min-w-3.5\" />\n                </Tooltip>\n              )}\n            </label>\n          )}\n\n          <div className=\"ds:relative ds:inline-flex\">\n            <SCheckbox\n              ref={ref}\n              id={inputId}\n              {...rest}\n              variant={variant}\n              size={size}\n              color={color}\n              icon={icon}\n              onCheckedChange={\n                animation ? handleCheckedChange : onCheckedChange\n              }\n            />\n\n            <AnimatePresence>\n              {showConfetti && (\n                <div className=\"ds:pointer-events-none ds:absolute ds:inset-0\">\n                  {[...Array(12)].map((_, i) => (\n                    <ConfettiPiece key={i} index={i} />\n                  ))}\n                </div>\n              )}\n            </AnimatePresence>\n          </div>\n\n          {(labelPosition === \"bottom\" || labelPosition === \"right\") &&\n            label && (\n              <Label htmlFor={inputId} className={labelClass}>\n                {label}\n                {infoTooltip && (\n                  <Tooltip content={infoTooltip}>\n                    <Info className=\"ds:size-3.5 ds:min-w-3.5\" />\n                  </Tooltip>\n                )}\n              </Label>\n            )}\n        </div>\n\n        {helperText && (\n          <div className=\"ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2\">\n            {helperText && (\n              <p\n                className={cn(\n                  \"ds:text-xs\",\n                  state ? helperTextStyles?.[state] : \"\"\n                )}\n              >\n                {helperText}\n              </p>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\nexport default Checkbox;\n"],"names":["Checkbox","React","props","ref","label","infoTooltip","helperText","state","variant","size","color","labelPosition","labelAlignment","icon","animation","id","onCheckedChange","rest","showConfetti","setShowConfetti","useState","generatedId","inputId","helperTextStyles","handleCheckedChange","checked","isVertical","flexDirection","gapClass","alignmentClass","labelClass","cn","jsxs","Tooltip","jsx","Info","SCheckbox","AnimatePresence","_","i","ConfettiPiece","Label"],"mappings":"wsDAoCMA,EAAWC,EAAM,WACrB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAA,MACJC,EACA,YAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,UACP,MAAAC,EACA,cAAAC,EAAgB,QAChB,eAAAC,EAAiB,SACjB,KAAAC,EACA,UAAAC,EACA,GAAAC,EACA,gBAAAC,EACA,GAAGC,CAAA,EACDf,EACE,CAACgB,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAcpB,EAAM,MAAA,EACpBqB,EAAUP,GAAMM,EAGhBE,EAAmB,CACvB,QAAS,2BACT,QAAS,kBACT,QAAS,kBACT,MAAO,eAAA,EAGHC,EAAuBC,GAA0B,CACjDA,IACFN,EAAgB,EAAI,EACpB,WAAW,IAAMA,EAAgB,EAAK,EAAG,GAAG,GAE9CH,IAAkBS,CAAO,CAC3B,EAEMC,EAAaf,IAAkB,OAASA,IAAkB,SAC1DgB,EAAgBD,EAAa,WAAa,WAC1CE,EAAWF,EAAa,UAAY,QAEpCG,EACJjB,IAAmB,QACf,cACAA,IAAmB,SACjB,eACA,YAEFkB,EACJ,uEAEF,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,6CAA8C,CAAA,CAAE,EACjE,SAAA,CAAAC,OAAC,OAAI,UAAWD,EAAAA,GAAG,UAAWJ,EAAeC,EAAUC,CAAc,EACjE,SAAA,EAAAlB,IAAkB,OAASA,IAAkB,SAAWP,UACvD,QAAA,CAAM,QAASkB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,0BAAA,CAA2B,CAAA,CAC7C,CAAA,EAEJ,EAGFH,EAAAA,KAAC,MAAA,CAAI,UAAU,6BACb,SAAA,CAAAE,EAAAA,IAACE,EAAAA,SAAA,CACC,IAAAjC,EACA,GAAImB,EACH,GAAGL,EACJ,QAAAT,EACA,KAAAC,EACA,MAAAC,EACA,KAAAG,EACA,gBACEC,EAAYU,EAAsBR,CAAA,CAAA,EAItCkB,EAAAA,IAACG,EAAAA,gBAAA,CACE,SAAAnB,GACCgB,EAAAA,IAAC,MAAA,CAAI,UAAU,gDACZ,SAAA,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,IAAI,CAACI,EAAGC,IACtBL,EAAAA,IAACM,EAAAA,cAAA,CAAsB,MAAOD,CAAA,EAAVA,CAAa,CAClC,CAAA,CACH,CAAA,CAEJ,CAAA,EACF,GAEE5B,IAAkB,UAAYA,IAAkB,UAChDP,UACGqC,EAAAA,MAAA,CAAM,QAASnB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,0BAAA,CAA2B,CAAA,CAC7C,CAAA,CAAA,CAEJ,CAAA,EAEN,EAEC7B,GACC4B,EAAAA,IAAC,MAAA,CAAI,UAAU,iEACZ,SAAA5B,GACC4B,EAAAA,IAAC,IAAA,CACC,UAAWH,EAAAA,GACT,aACAxB,EAAQgB,IAAmBhB,CAAK,EAAI,EAAA,EAGrC,SAAAD,CAAA,CAAA,CACH,CAEJ,CAAA,EAEJ,CAEJ,CACF,EAEAN,EAAS,YAAc"}

package/dist/cjs/components/Collapsible/Collapsible.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),n=require("../../packages/ui/src/components/collapsible.cjs"),t=require("../../packages/ui/src/lib/utils.cjs"),x=require("lucide-react"),y=l.forwardRef((v,a)=>{const{trigger:i,content:c,showIcon:p=!0,iconPosition:d="right",iconRotation:g=!0,triggerClassName:N,contentClassName:j,variant:O="default",className:u,open:s,defaultOpen:q,onOpenChange:w,children:b,...C}=v,[o,f]=l.useState(q??!1);l.useEffect(()=>{s!==void 0&&f(s)},[s]);const h=m=>{f(m),w?.(m)},r={default:{root:"rounded-lg border bg-card",trigger:"px-4 py-3 hover:bg-accent/50",content:"px-4 py-3 border-t"},bordered:{root:"rounded-lg border-2",trigger:"px-4 py-3 font-semibold hover:bg-accent",content:"px-4 py-3 border-t-2"},ghost:{root:"",trigger:"px-2 py-2 hover:bg-accent/30 rounded-md",content:"px-2 py-2"}}[O];return b&&!i&&!c?e.jsx(n.Collapsible,{ref:a,open:o,onOpenChange:h,className:t.cn(r.root,u),...C,children:b}):e.jsxs(n.Collapsible,{ref:a,open:o,onOpenChange:h,className:t.cn(r.root,u),...C,children:[e.jsxs(n.CollapsibleTrigger,{className:t.cn("flex w-full items-center justify-between transition-colors",r.trigger,N),children:[d==="left"&&p&&e.jsx(x.ChevronDown,{className:t.cn("size-4 transition-transform duration-200",g&&o&&"rotate-180")}),e.jsx("span",{className:"flex-1 text-left",children:i}),d==="right"&&p&&e.jsx(x.ChevronDown,{className:t.cn("size-4 transition-transform duration-200",g&&o&&"rotate-180")})]}),e.jsx(n.CollapsibleContent,{className:t.cn(r.content,j),children:c})]})});y.displayName="Collapsible";exports.CollapsibleContent=n.CollapsibleContent;exports.CollapsibleTrigger=n.CollapsibleTrigger;exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),t=require("../../packages/ui/src/components/collapsible.cjs"),s=require("../../packages/ui/src/lib/utils.cjs"),x=require("lucide-react"),y=l.forwardRef((v,d)=>{const{trigger:a,content:i,showIcon:c=!0,iconPosition:p="right",iconRotation:g=!0,triggerClassName:N,contentClassName:j,variant:O="default",className:u,open:r,defaultOpen:q,onOpenChange:w,children:b,...C}=v,[n,f]=l.useState(q??!1);l.useEffect(()=>{r!==void 0&&f(r)},[r]);const h=m=>{f(m),w?.(m)},o={default:{root:"ds:rounded-lg ds:border ds:bg-card",trigger:"ds:px-4 ds:py-3 ds:hover:bg-accent/50",content:"ds:px-4 ds:py-3 ds:border-t"},bordered:{root:"ds:rounded-lg ds:border-2",trigger:"ds:px-4 ds:py-3 ds:font-semibold ds:hover:bg-accent",content:"ds:px-4 ds:py-3 ds:border-t-2"},ghost:{root:"",trigger:"ds:px-2 ds:py-2 ds:hover:bg-accent/30 ds:rounded-md",content:"ds:px-2 ds:py-2"}}[O];return b&&!a&&!i?e.jsx(t.Collapsible,{ref:d,open:n,onOpenChange:h,className:s.cn(o.root,u),...C,children:b}):e.jsxs(t.Collapsible,{ref:d,open:n,onOpenChange:h,className:s.cn(o.root,u),...C,children:[e.jsxs(t.CollapsibleTrigger,{className:s.cn("ds:flex ds:w-full ds:items-center ds:justify-between ds:transition-colors",o.trigger,N),children:[p==="left"&&c&&e.jsx(x.ChevronDown,{className:s.cn("ds:size-4 ds:transition-transform ds:duration-200",g&&n&&"ds:rotate-180")}),e.jsx("span",{className:"ds:flex-1 ds:text-left",children:a}),p==="right"&&c&&e.jsx(x.ChevronDown,{className:s.cn("ds:size-4 ds:transition-transform ds:duration-200",g&&n&&"ds:rotate-180")})]}),e.jsx(t.CollapsibleContent,{className:s.cn(o.content,j),children:i})]})});y.displayName="Collapsible";exports.CollapsibleContent=t.CollapsibleContent;exports.CollapsibleTrigger=t.CollapsibleTrigger;exports.default=y;
 //# sourceMappingURL=Collapsible.cjs.map

package/dist/cjs/components/Collapsible/Collapsible.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.cjs","sources":["../../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Collapsible as SCollapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n} from \"@dsui/ui/components/collapsible\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ChevronDown } from \"lucide-react\";\n\nexport type CollapsibleProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCollapsible>,\n  \"children\" | \"content\" | \"open\" | \"defaultOpen\" | \"onOpenChange\"\n> & {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  showIcon?: boolean;\n  iconPosition?: \"left\" | \"right\";\n  iconRotation?: boolean;\n  triggerClassName?: string;\n  contentClassName?: string;\n  variant?: \"default\" | \"bordered\" | \"ghost\";\n  children?: React.ReactNode;\n};\n\nconst Collapsible = React.forwardRef<\n  React.ElementRef<typeof SCollapsible>,\n  CollapsibleProps\n>((props, ref) => {\n  const {\n    trigger,\n    content,\n    showIcon = true,\n    iconPosition = \"right\",\n    iconRotation = true,\n    triggerClassName,\n    contentClassName,\n    variant = \"default\",\n    className,\n    open,\n    defaultOpen,\n    onOpenChange,\n    children,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState(defaultOpen ?? false);\n\n  React.useEffect(() => {\n    if (open !== undefined) {\n      setIsOpen(open);\n    }\n  }, [open]);\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const variantStyles = {\n    default: {\n      root: \"rounded-lg border bg-card\",\n      trigger: \"px-4 py-3 hover:bg-accent/50\",\n      content: \"px-4 py-3 border-t\",\n    },\n    bordered: {\n      root: \"rounded-lg border-2\",\n      trigger: \"px-4 py-3 font-semibold hover:bg-accent\",\n      content: \"px-4 py-3 border-t-2\",\n    },\n    ghost: {\n      root: \"\",\n      trigger: \"px-2 py-2 hover:bg-accent/30 rounded-md\",\n      content: \"px-2 py-2\",\n    },\n  };\n\n  const styles = variantStyles[variant];\n\n  // If children are provided, use them directly (custom implementation)\n  if (children && !trigger && !content) {\n    return (\n      <SCollapsible\n        ref={ref}\n        open={isOpen}\n        onOpenChange={handleOpenChange}\n        className={cn(styles.root, className)}\n        {...rest}\n      >\n        {children}\n      </SCollapsible>\n    );\n  }\n\n  // Default implementation with trigger and content\n  return (\n    <SCollapsible\n      ref={ref}\n      open={isOpen}\n      onOpenChange={handleOpenChange}\n      className={cn(styles.root, className)}\n      {...rest}\n    >\n      <CollapsibleTrigger\n        className={cn(\n          \"flex w-full items-center justify-between transition-colors\",\n          styles.trigger,\n          triggerClassName\n        )}\n      >\n        {iconPosition === \"left\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n        <span className=\"flex-1 text-left\">{trigger}</span>\n        {iconPosition === \"right\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n      </CollapsibleTrigger>\n      <CollapsibleContent className={cn(styles.content, contentClassName)}>\n        {content}\n      </CollapsibleContent>\n    </SCollapsible>\n  );\n});\n\nCollapsible.displayName = \"Collapsible\";\n\nexport default Collapsible;\nexport { CollapsibleTrigger, CollapsibleContent };\n"],"names":["Collapsible","React","props","ref","trigger","content","showIcon","iconPosition","iconRotation","triggerClassName","contentClassName","variant","className","open","defaultOpen","onOpenChange","children","rest","isOpen","setIsOpen","handleOpenChange","newOpen","styles","jsx","SCollapsible","cn","jsxs","CollapsibleTrigger","ChevronDown","CollapsibleContent"],"mappings":"6SA2BMA,EAAcC,EAAM,WAGxB,CAACC,EAAOC,IAAQ,CAChB,KAAM,CACJ,QAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,aAAAC,EAAe,QACf,aAAAC,EAAe,GACf,iBAAAC,EACA,iBAAAC,EACA,QAAAC,EAAU,UACV,UAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EACDf,EAEE,CAACgB,EAAQC,CAAS,EAAIlB,EAAM,SAASa,GAAe,EAAK,EAE/Db,EAAM,UAAU,IAAM,CAChBY,IAAS,QACXM,EAAUN,CAAI,CAElB,EAAG,CAACA,CAAI,CAAC,EAET,MAAMO,EAAoBC,GAAqB,CAC7CF,EAAUE,CAAO,EACjBN,IAAeM,CAAO,CACxB,EAoBMC,EAlBgB,CACpB,QAAS,CACP,KAAM,4BACN,QAAS,+BACT,QAAS,oBAAA,EAEX,SAAU,CACR,KAAM,sBACN,QAAS,0CACT,QAAS,sBAAA,EAEX,MAAO,CACL,KAAM,GACN,QAAS,0CACT,QAAS,WAAA,CACX,EAG2BX,CAAO,EAGpC,OAAIK,GAAY,CAACZ,GAAW,CAACC,EAEzBkB,EAAAA,IAACC,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEH,SAAAD,CAAA,CAAA,EAOLU,EAAAA,KAACF,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEJ,SAAA,CAAAS,EAAAA,KAACC,EAAAA,mBAAA,CACC,UAAWF,EAAAA,GACT,6DACAH,EAAO,QACPb,CAAA,EAGD,SAAA,CAAAF,IAAiB,QAAUD,GAC1BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,EAGJK,EAAAA,IAAC,OAAA,CAAK,UAAU,mBAAoB,SAAAnB,EAAQ,EAC3CG,IAAiB,SAAWD,GAC3BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,CACF,CAAA,CAAA,EAGJK,MAACM,EAAAA,oBAAmB,UAAWJ,EAAAA,GAAGH,EAAO,QAASZ,CAAgB,EAC/D,SAAAL,CAAA,CACH,CAAA,CAAA,CAAA,CAGN,CAAC,EAEDL,EAAY,YAAc"}
+{"version":3,"file":"Collapsible.cjs","sources":["../../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Collapsible as SCollapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n} from \"@dsui/ui/components/collapsible\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ChevronDown } from \"lucide-react\";\n\nexport type CollapsibleProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCollapsible>,\n  \"children\" | \"content\" | \"open\" | \"defaultOpen\" | \"onOpenChange\"\n> & {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  showIcon?: boolean;\n  iconPosition?: \"left\" | \"right\";\n  iconRotation?: boolean;\n  triggerClassName?: string;\n  contentClassName?: string;\n  variant?: \"default\" | \"bordered\" | \"ghost\";\n  children?: React.ReactNode;\n};\n\nconst Collapsible = React.forwardRef<\n  React.ElementRef<typeof SCollapsible>,\n  CollapsibleProps\n>((props, ref) => {\n  const {\n    trigger,\n    content,\n    showIcon = true,\n    iconPosition = \"right\",\n    iconRotation = true,\n    triggerClassName,\n    contentClassName,\n    variant = \"default\",\n    className,\n    open,\n    defaultOpen,\n    onOpenChange,\n    children,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState(defaultOpen ?? false);\n\n  React.useEffect(() => {\n    if (open !== undefined) {\n      setIsOpen(open);\n    }\n  }, [open]);\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const variantStyles = {\n    default: {\n      root: \"ds:rounded-lg ds:border ds:bg-card\",\n      trigger: \"ds:px-4 ds:py-3 ds:hover:bg-accent/50\",\n      content: \"ds:px-4 ds:py-3 ds:border-t\",\n    },\n    bordered: {\n      root: \"ds:rounded-lg ds:border-2\",\n      trigger: \"ds:px-4 ds:py-3 ds:font-semibold ds:hover:bg-accent\",\n      content: \"ds:px-4 ds:py-3 ds:border-t-2\",\n    },\n    ghost: {\n      root: \"\",\n      trigger: \"ds:px-2 ds:py-2 ds:hover:bg-accent/30 ds:rounded-md\",\n      content: \"ds:px-2 ds:py-2\",\n    },\n  };\n\n  const styles = variantStyles[variant];\n\n  // If children are provided, use them directly (custom implementation)\n  if (children && !trigger && !content) {\n    return (\n      <SCollapsible\n        ref={ref}\n        open={isOpen}\n        onOpenChange={handleOpenChange}\n        className={cn(styles.root, className)}\n        {...rest}\n      >\n        {children}\n      </SCollapsible>\n    );\n  }\n\n  // Default implementation with trigger and content\n  return (\n    <SCollapsible\n      ref={ref}\n      open={isOpen}\n      onOpenChange={handleOpenChange}\n      className={cn(styles.root, className)}\n      {...rest}\n    >\n      <CollapsibleTrigger\n        className={cn(\n          \"ds:flex ds:w-full ds:items-center ds:justify-between ds:transition-colors\",\n          styles.trigger,\n          triggerClassName\n        )}\n      >\n        {iconPosition === \"left\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"ds:size-4 ds:transition-transform ds:duration-200\",\n              iconRotation && isOpen && \"ds:rotate-180\"\n            )}\n          />\n        )}\n        <span className=\"ds:flex-1 ds:text-left\">{trigger}</span>\n        {iconPosition === \"right\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"ds:size-4 ds:transition-transform ds:duration-200\",\n              iconRotation && isOpen && \"ds:rotate-180\"\n            )}\n          />\n        )}\n      </CollapsibleTrigger>\n      <CollapsibleContent className={cn(styles.content, contentClassName)}>\n        {content}\n      </CollapsibleContent>\n    </SCollapsible>\n  );\n});\n\nCollapsible.displayName = \"Collapsible\";\n\nexport default Collapsible;\nexport { CollapsibleTrigger, CollapsibleContent };\n"],"names":["Collapsible","React","props","ref","trigger","content","showIcon","iconPosition","iconRotation","triggerClassName","contentClassName","variant","className","open","defaultOpen","onOpenChange","children","rest","isOpen","setIsOpen","handleOpenChange","newOpen","styles","jsx","SCollapsible","cn","jsxs","CollapsibleTrigger","ChevronDown","CollapsibleContent"],"mappings":"6SA2BMA,EAAcC,EAAM,WAGxB,CAACC,EAAOC,IAAQ,CAChB,KAAM,CACJ,QAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,aAAAC,EAAe,QACf,aAAAC,EAAe,GACf,iBAAAC,EACA,iBAAAC,EACA,QAAAC,EAAU,UACV,UAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EACDf,EAEE,CAACgB,EAAQC,CAAS,EAAIlB,EAAM,SAASa,GAAe,EAAK,EAE/Db,EAAM,UAAU,IAAM,CAChBY,IAAS,QACXM,EAAUN,CAAI,CAElB,EAAG,CAACA,CAAI,CAAC,EAET,MAAMO,EAAoBC,GAAqB,CAC7CF,EAAUE,CAAO,EACjBN,IAAeM,CAAO,CACxB,EAoBMC,EAlBgB,CACpB,QAAS,CACP,KAAM,qCACN,QAAS,wCACT,QAAS,6BAAA,EAEX,SAAU,CACR,KAAM,4BACN,QAAS,sDACT,QAAS,+BAAA,EAEX,MAAO,CACL,KAAM,GACN,QAAS,sDACT,QAAS,iBAAA,CACX,EAG2BX,CAAO,EAGpC,OAAIK,GAAY,CAACZ,GAAW,CAACC,EAEzBkB,EAAAA,IAACC,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEH,SAAAD,CAAA,CAAA,EAOLU,EAAAA,KAACF,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEJ,SAAA,CAAAS,EAAAA,KAACC,EAAAA,mBAAA,CACC,UAAWF,EAAAA,GACT,4EACAH,EAAO,QACPb,CAAA,EAGD,SAAA,CAAAF,IAAiB,QAAUD,GAC1BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,oDACAjB,GAAgBU,GAAU,eAAA,CAC5B,CAAA,EAGJK,EAAAA,IAAC,OAAA,CAAK,UAAU,yBAA0B,SAAAnB,EAAQ,EACjDG,IAAiB,SAAWD,GAC3BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,oDACAjB,GAAgBU,GAAU,eAAA,CAC5B,CAAA,CACF,CAAA,CAAA,EAGJK,MAACM,EAAAA,oBAAmB,UAAWJ,EAAAA,GAAGH,EAAO,QAASZ,CAAgB,EAC/D,SAAAL,CAAA,CACH,CAAA,CAAA,CAAA,CAGN,CAAC,EAEDL,EAAY,YAAc"}

package/dist/cjs/components/Command/Command.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),y=require("react"),r=require("../../packages/ui/src/components/command.cjs"),q=require("../../packages/ui/src/lib/utils.cjs"),c=y.forwardRef((p,j)=>{const{className:d,children:x,items:s,search:o,open:t,defaultOpen:m,onOpenChange:i,modal:h=!1,title:C="Command Palette",description:f="Search for a command to run...",showCloseButton:g=!0,...u}=p,N=v=>v.map((n,l)=>{switch(n.type){case"item":return e.jsx(r.CommandItem,{disabled:n.disabled,className:n.className,onSelect:n.onClick,children:n.children?n.children:e.jsxs(e.Fragment,{children:[n.icon&&e.jsx(n.icon,{className:"mr-2 h-4 w-4"}),e.jsx("span",{children:n.label}),n.shortcut&&e.jsx(r.CommandShortcut,{children:n.shortcut})]})},l);case"group":return e.jsx(r.CommandGroup,{heading:n.heading,className:n.className,children:n.items.map((a,w)=>e.jsx(r.CommandItem,{disabled:a.disabled,className:a.className,onSelect:a.onClick,children:a.children?a.children:e.jsxs(e.Fragment,{children:[a.icon&&e.jsx(a.icon,{className:"mr-2 h-4 w-4"}),e.jsx("span",{children:a.label}),a.shortcut&&e.jsx(r.CommandShortcut,{children:a.shortcut})]})},w))},l);case"separator":return e.jsx(r.CommandSeparator,{},l);default:return null}}),S=e.jsxs(r.Command,{ref:j,className:q.cn("bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",d),...u,children:[o&&e.jsx(r.CommandInput,{placeholder:typeof o=="string"?o:"Type a command or search..."}),e.jsx(r.CommandList,{children:s?e.jsxs(e.Fragment,{children:[e.jsx(r.CommandEmpty,{children:"No results found."}),N(s)]}):x})]});return h&&(t!==void 0||i||m!==void 0)?e.jsx(r.CommandDialog,{open:t,defaultOpen:m,onOpenChange:i,modal:h,title:C,description:f,showCloseButton:g,children:e.jsx(c,{className:d,items:s,search:o,...u})}):S});c.displayName="Command";exports.default=c;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),y=require("react"),n=require("../../packages/ui/src/components/command.cjs"),q=require("../../packages/ui/src/lib/utils.cjs"),l=y.forwardRef((p,j)=>{const{className:c,children:x,items:d,search:a,open:t,defaultOpen:m,onOpenChange:i,modal:h=!1,title:C="Command Palette",description:f="Search for a command to run...",showCloseButton:g=!0,...u}=p,N=v=>v.map((s,o)=>{switch(s.type){case"item":return e.jsx(n.CommandItem,{disabled:s.disabled,className:s.className,onSelect:s.onClick,children:s.children?s.children:e.jsxs(e.Fragment,{children:[s.icon&&e.jsx(s.icon,{className:"ds:mr-2 ds:h-4 ds:w-4"}),e.jsx("span",{children:s.label}),s.shortcut&&e.jsx(n.CommandShortcut,{children:s.shortcut})]})},o);case"group":return e.jsx(n.CommandGroup,{heading:s.heading,className:s.className,children:s.items.map((r,w)=>e.jsx(n.CommandItem,{disabled:r.disabled,className:r.className,onSelect:r.onClick,children:r.children?r.children:e.jsxs(e.Fragment,{children:[r.icon&&e.jsx(r.icon,{className:"ds:mr-2 ds:h-4 ds:w-4"}),e.jsx("span",{children:r.label}),r.shortcut&&e.jsx(n.CommandShortcut,{children:r.shortcut})]})},w))},o);case"separator":return e.jsx(n.CommandSeparator,{},o);default:return null}}),S=e.jsxs(n.Command,{ref:j,className:q.cn("ds:bg-popover ds:text-popover-foreground ds:flex ds:h-full ds:w-full ds:flex-col ds:overflow-hidden ds:rounded-md",c),...u,children:[a&&e.jsx(n.CommandInput,{placeholder:typeof a=="string"?a:"Type a command or search..."}),e.jsx(n.CommandList,{children:d?e.jsxs(e.Fragment,{children:[e.jsx(n.CommandEmpty,{children:"No results found."}),N(d)]}):x})]});return h&&(t!==void 0||i||m!==void 0)?e.jsx(n.CommandDialog,{open:t,defaultOpen:m,onOpenChange:i,modal:h,title:C,description:f,showCloseButton:g,children:e.jsx(l,{className:c,items:d,search:a,...u})}):S});l.displayName="Command";exports.default=l;
 //# sourceMappingURL=Command.cjs.map

package/dist/cjs/components/Command/Command.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Command.cjs","sources":["../../../../src/components/Command/Command.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Command as SCommand,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandSeparator,\n  CommandItem,\n  CommandShortcut,\n} from \"@dsui/ui/components/command\";\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nexport interface CommandItem {\n  readonly type: \"item\";\n  label?: string;\n  icon?: React.ComponentType<{ className?: string }>;\n  shortcut?: string;\n  disabled?: boolean;\n  className?: string;\n  onClick?: () => void;\n  children?: React.ReactNode;\n}\n\nexport interface CommandGroup {\n  readonly type: \"group\";\n  heading: string;\n  className?: string;\n  items: CommandItem[];\n}\n\nexport interface CommandSeparator {\n  readonly type: \"separator\";\n}\n\nexport type CommandItemType = CommandItem | CommandGroup | CommandSeparator;\n\nexport interface CommandProps {\n  className?: string;\n  children?: React.ReactNode;\n  items?: CommandItemType[];\n  search?: boolean | string;\n\n  // Dialog mode props\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  modal?: boolean;\n  title?: string;\n  description?: string;\n  showCloseButton?: boolean;\n}\n\nconst Command = React.forwardRef<HTMLDivElement, CommandProps>((props, ref) => {\n  const {\n    className,\n    children,\n    items,\n    search,\n    open,\n    defaultOpen,\n    onOpenChange,\n    modal = false,\n    title = \"Command Palette\",\n    description = \"Search for a command to run...\",\n    showCloseButton = true,\n    ...rest\n  } = props;\n\n  const renderItems = (items: CommandItemType[]) => {\n    return items.map((item, index) => {\n      switch (item.type) {\n        case \"item\":\n          return (\n            <CommandItem\n              key={index}\n              disabled={item.disabled}\n              className={item.className}\n              onSelect={item.onClick}\n            >\n              {item.children ? (\n                item.children\n              ) : (\n                <>\n                  {item.icon && <item.icon className=\"mr-2 h-4 w-4\" />}\n                  <span>{item.label}</span>\n                  {item.shortcut && (\n                    <CommandShortcut>{item.shortcut}</CommandShortcut>\n                  )}\n                </>\n              )}\n            </CommandItem>\n          );\n        case \"group\":\n          return (\n            <CommandGroup\n              key={index}\n              heading={item.heading}\n              className={item.className}\n            >\n              {item.items.map((subItem, subIndex) => (\n                <CommandItem\n                  key={subIndex}\n                  disabled={subItem.disabled}\n                  className={subItem.className}\n                  onSelect={subItem.onClick}\n                >\n                  {subItem.children ? (\n                    subItem.children\n                  ) : (\n                    <>\n                      {subItem.icon && (\n                        <subItem.icon className=\"mr-2 h-4 w-4\" />\n                      )}\n                      <span>{subItem.label}</span>\n                      {subItem.shortcut && (\n                        <CommandShortcut>{subItem.shortcut}</CommandShortcut>\n                      )}\n                    </>\n                  )}\n                </CommandItem>\n              ))}\n            </CommandGroup>\n          );\n        case \"separator\":\n          return <CommandSeparator key={index} />;\n        default:\n          return null;\n      }\n    });\n  };\n\n  const commandContent = (\n    <SCommand\n      ref={ref}\n      className={cn(\n        \"bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md\",\n        className\n      )}\n      {...rest}\n    >\n      {search && (\n        <CommandInput\n          placeholder={\n            typeof search === \"string\" ? search : \"Type a command or search...\"\n          }\n        />\n      )}\n      <CommandList>\n        {items ? (\n          <>\n            <CommandEmpty>No results found.</CommandEmpty>\n            {renderItems(items)}\n          </>\n        ) : (\n          children\n        )}\n      </CommandList>\n    </SCommand>\n  );\n\n  // If dialog props are provided, render as dialog\n  if (\n    modal &&\n    (open !== undefined || onOpenChange || defaultOpen !== undefined)\n  ) {\n    return (\n      <CommandDialog\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        modal={modal}\n        title={title}\n        description={description}\n        showCloseButton={showCloseButton}\n      >\n        <Command\n          className={className}\n          items={items}\n          search={search}\n          {...rest}\n        />\n      </CommandDialog>\n    );\n  }\n\n  // Otherwise, render as regular command\n  return commandContent;\n});\n\nCommand.displayName = \"Command\";\n\nexport default Command;\n"],"names":["Command","React","props","ref","className","children","items","search","open","defaultOpen","onOpenChange","modal","title","description","showCloseButton","rest","renderItems","item","index","jsx","CommandItem","jsxs","Fragment","CommandShortcut","CommandGroup","subItem","subIndex","CommandSeparator","commandContent","SCommand","cn","CommandInput","CommandList","CommandEmpty","CommandDialog"],"mappings":"+QAsDMA,EAAUC,EAAM,WAAyC,CAACC,EAAOC,IAAQ,CAC7E,KAAM,CACJ,UAAAC,EACA,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EAAQ,GACR,MAAAC,EAAQ,kBACR,YAAAC,EAAc,iCACd,gBAAAC,EAAkB,GAClB,GAAGC,CAAA,EACDb,EAEEc,EAAeV,GACZA,EAAM,IAAI,CAACW,EAAMC,IAAU,CAChC,OAAQD,EAAK,KAAA,CACX,IAAK,OACH,OACEE,EAAAA,IAACC,EAAAA,YAAA,CAEC,SAAUH,EAAK,SACf,UAAWA,EAAK,UAChB,SAAUA,EAAK,QAEd,SAAAA,EAAK,SACJA,EAAK,SAELI,OAAAC,EAAAA,SAAA,CACG,SAAA,CAAAL,EAAK,MAAQE,MAACF,EAAK,KAAL,CAAU,UAAU,eAAe,EAClDE,EAAAA,IAAC,OAAA,CAAM,SAAAF,EAAK,KAAA,CAAM,EACjBA,EAAK,UACJE,MAACI,EAAAA,gBAAA,CAAiB,WAAK,QAAA,CAAS,CAAA,CAAA,CAEpC,CAAA,EAdGL,CAAA,EAkBX,IAAK,QACH,OACEC,EAAAA,IAACK,EAAAA,aAAA,CAEC,QAASP,EAAK,QACd,UAAWA,EAAK,UAEf,SAAAA,EAAK,MAAM,IAAI,CAACQ,EAASC,IACxBP,EAAAA,IAACC,EAAAA,YAAA,CAEC,SAAUK,EAAQ,SAClB,UAAWA,EAAQ,UACnB,SAAUA,EAAQ,QAEjB,SAAAA,EAAQ,SACPA,EAAQ,SAERJ,OAAAC,EAAAA,SAAA,CACG,SAAA,CAAAG,EAAQ,MACPN,MAACM,EAAQ,KAAR,CAAa,UAAU,eAAe,EAEzCN,EAAAA,IAAC,OAAA,CAAM,SAAAM,EAAQ,KAAA,CAAM,EACpBA,EAAQ,UACPN,MAACI,EAAAA,gBAAA,CAAiB,WAAQ,QAAA,CAAS,CAAA,CAAA,CAEvC,CAAA,EAhBGG,CAAA,CAmBR,CAAA,EAzBIR,CAAA,EA4BX,IAAK,YACH,OAAOC,MAACQ,EAAAA,oBAAsBT,CAAO,EACvC,QACE,OAAO,IAAA,CAEb,CAAC,EAGGU,EACJP,EAAAA,KAACQ,EAAAA,QAAA,CACC,IAAA1B,EACA,UAAW2B,EAAAA,GACT,4FACA1B,CAAA,EAED,GAAGW,EAEH,SAAA,CAAAR,GACCY,EAAAA,IAACY,EAAAA,aAAA,CACC,YACE,OAAOxB,GAAW,SAAWA,EAAS,6BAAA,CAAA,EAI5CY,EAAAA,IAACa,EAAAA,YAAA,CACE,SAAA1B,EACCe,OAAAC,EAAAA,SAAA,CACE,SAAA,CAAAH,EAAAA,IAACc,EAAAA,cAAa,SAAA,mBAAA,CAAiB,EAC9BjB,EAAYV,CAAK,CAAA,CAAA,CACpB,EAEAD,CAAA,CAEJ,CAAA,CAAA,CAAA,EAKJ,OACEM,IACCH,IAAS,QAAaE,GAAgBD,IAAgB,QAGrDU,EAAAA,IAACe,EAAAA,cAAA,CACC,KAAA1B,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EACA,MAAAC,EACA,YAAAC,EACA,gBAAAC,EAEA,SAAAK,EAAAA,IAACnB,EAAA,CACC,UAAAI,EACA,MAAAE,EACA,OAAAC,EACC,GAAGQ,CAAA,CAAA,CACN,CAAA,EAMCa,CACT,CAAC,EAED5B,EAAQ,YAAc"}
+{"version":3,"file":"Command.cjs","sources":["../../../../src/components/Command/Command.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Command as SCommand,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandSeparator,\n  CommandItem,\n  CommandShortcut,\n} from \"@dsui/ui/components/command\";\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nexport interface CommandItem {\n  readonly type: \"item\";\n  label?: string;\n  icon?: React.ComponentType<{ className?: string }>;\n  shortcut?: string;\n  disabled?: boolean;\n  className?: string;\n  onClick?: () => void;\n  children?: React.ReactNode;\n}\n\nexport interface CommandGroup {\n  readonly type: \"group\";\n  heading: string;\n  className?: string;\n  items: CommandItem[];\n}\n\nexport interface CommandSeparator {\n  readonly type: \"separator\";\n}\n\nexport type CommandItemType = CommandItem | CommandGroup | CommandSeparator;\n\nexport interface CommandProps {\n  className?: string;\n  children?: React.ReactNode;\n  items?: CommandItemType[];\n  search?: boolean | string;\n\n  // Dialog mode props\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  modal?: boolean;\n  title?: string;\n  description?: string;\n  showCloseButton?: boolean;\n}\n\nconst Command = React.forwardRef<HTMLDivElement, CommandProps>((props, ref) => {\n  const {\n    className,\n    children,\n    items,\n    search,\n    open,\n    defaultOpen,\n    onOpenChange,\n    modal = false,\n    title = \"Command Palette\",\n    description = \"Search for a command to run...\",\n    showCloseButton = true,\n    ...rest\n  } = props;\n\n  const renderItems = (items: CommandItemType[]) => {\n    return items.map((item, index) => {\n      switch (item.type) {\n        case \"item\":\n          return (\n            <CommandItem\n              key={index}\n              disabled={item.disabled}\n              className={item.className}\n              onSelect={item.onClick}\n            >\n              {item.children ? (\n                item.children\n              ) : (\n                <>\n                  {item.icon && <item.icon className=\"ds:mr-2 ds:h-4 ds:w-4\" />}\n                  <span>{item.label}</span>\n                  {item.shortcut && (\n                    <CommandShortcut>{item.shortcut}</CommandShortcut>\n                  )}\n                </>\n              )}\n            </CommandItem>\n          );\n        case \"group\":\n          return (\n            <CommandGroup\n              key={index}\n              heading={item.heading}\n              className={item.className}\n            >\n              {item.items.map((subItem, subIndex) => (\n                <CommandItem\n                  key={subIndex}\n                  disabled={subItem.disabled}\n                  className={subItem.className}\n                  onSelect={subItem.onClick}\n                >\n                  {subItem.children ? (\n                    subItem.children\n                  ) : (\n                    <>\n                      {subItem.icon && (\n                        <subItem.icon className=\"ds:mr-2 ds:h-4 ds:w-4\" />\n                      )}\n                      <span>{subItem.label}</span>\n                      {subItem.shortcut && (\n                        <CommandShortcut>{subItem.shortcut}</CommandShortcut>\n                      )}\n                    </>\n                  )}\n                </CommandItem>\n              ))}\n            </CommandGroup>\n          );\n        case \"separator\":\n          return <CommandSeparator key={index} />;\n        default:\n          return null;\n      }\n    });\n  };\n\n  const commandContent = (\n    <SCommand\n      ref={ref}\n      className={cn(\n        \"ds:bg-popover ds:text-popover-foreground ds:flex ds:h-full ds:w-full ds:flex-col ds:overflow-hidden ds:rounded-md\",\n        className\n      )}\n      {...rest}\n    >\n      {search && (\n        <CommandInput\n          placeholder={\n            typeof search === \"string\" ? search : \"Type a command or search...\"\n          }\n        />\n      )}\n      <CommandList>\n        {items ? (\n          <>\n            <CommandEmpty>No results found.</CommandEmpty>\n            {renderItems(items)}\n          </>\n        ) : (\n          children\n        )}\n      </CommandList>\n    </SCommand>\n  );\n\n  // If dialog props are provided, render as dialog\n  if (\n    modal &&\n    (open !== undefined || onOpenChange || defaultOpen !== undefined)\n  ) {\n    return (\n      <CommandDialog\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        modal={modal}\n        title={title}\n        description={description}\n        showCloseButton={showCloseButton}\n      >\n        <Command\n          className={className}\n          items={items}\n          search={search}\n          {...rest}\n        />\n      </CommandDialog>\n    );\n  }\n\n  // Otherwise, render as regular command\n  return commandContent;\n});\n\nCommand.displayName = \"Command\";\n\nexport default Command;\n"],"names":["Command","React","props","ref","className","children","items","search","open","defaultOpen","onOpenChange","modal","title","description","showCloseButton","rest","renderItems","item","index","jsx","CommandItem","jsxs","Fragment","CommandShortcut","CommandGroup","subItem","subIndex","CommandSeparator","commandContent","SCommand","cn","CommandInput","CommandList","CommandEmpty","CommandDialog"],"mappings":"+QAsDMA,EAAUC,EAAM,WAAyC,CAACC,EAAOC,IAAQ,CAC7E,KAAM,CACJ,UAAAC,EACA,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EAAQ,GACR,MAAAC,EAAQ,kBACR,YAAAC,EAAc,iCACd,gBAAAC,EAAkB,GAClB,GAAGC,CAAA,EACDb,EAEEc,EAAeV,GACZA,EAAM,IAAI,CAACW,EAAMC,IAAU,CAChC,OAAQD,EAAK,KAAA,CACX,IAAK,OACH,OACEE,EAAAA,IAACC,EAAAA,YAAA,CAEC,SAAUH,EAAK,SACf,UAAWA,EAAK,UAChB,SAAUA,EAAK,QAEd,SAAAA,EAAK,SACJA,EAAK,SAELI,OAAAC,EAAAA,SAAA,CACG,SAAA,CAAAL,EAAK,MAAQE,MAACF,EAAK,KAAL,CAAU,UAAU,wBAAwB,EAC3DE,EAAAA,IAAC,OAAA,CAAM,SAAAF,EAAK,KAAA,CAAM,EACjBA,EAAK,UACJE,MAACI,EAAAA,gBAAA,CAAiB,WAAK,QAAA,CAAS,CAAA,CAAA,CAEpC,CAAA,EAdGL,CAAA,EAkBX,IAAK,QACH,OACEC,EAAAA,IAACK,EAAAA,aAAA,CAEC,QAASP,EAAK,QACd,UAAWA,EAAK,UAEf,SAAAA,EAAK,MAAM,IAAI,CAACQ,EAASC,IACxBP,EAAAA,IAACC,EAAAA,YAAA,CAEC,SAAUK,EAAQ,SAClB,UAAWA,EAAQ,UACnB,SAAUA,EAAQ,QAEjB,SAAAA,EAAQ,SACPA,EAAQ,SAERJ,OAAAC,EAAAA,SAAA,CACG,SAAA,CAAAG,EAAQ,MACPN,MAACM,EAAQ,KAAR,CAAa,UAAU,wBAAwB,EAElDN,EAAAA,IAAC,OAAA,CAAM,SAAAM,EAAQ,KAAA,CAAM,EACpBA,EAAQ,UACPN,MAACI,EAAAA,gBAAA,CAAiB,WAAQ,QAAA,CAAS,CAAA,CAAA,CAEvC,CAAA,EAhBGG,CAAA,CAmBR,CAAA,EAzBIR,CAAA,EA4BX,IAAK,YACH,OAAOC,MAACQ,EAAAA,oBAAsBT,CAAO,EACvC,QACE,OAAO,IAAA,CAEb,CAAC,EAGGU,EACJP,EAAAA,KAACQ,EAAAA,QAAA,CACC,IAAA1B,EACA,UAAW2B,EAAAA,GACT,oHACA1B,CAAA,EAED,GAAGW,EAEH,SAAA,CAAAR,GACCY,EAAAA,IAACY,EAAAA,aAAA,CACC,YACE,OAAOxB,GAAW,SAAWA,EAAS,6BAAA,CAAA,EAI5CY,EAAAA,IAACa,EAAAA,YAAA,CACE,SAAA1B,EACCe,OAAAC,EAAAA,SAAA,CACE,SAAA,CAAAH,EAAAA,IAACc,EAAAA,cAAa,SAAA,mBAAA,CAAiB,EAC9BjB,EAAYV,CAAK,CAAA,CAAA,CACpB,EAEAD,CAAA,CAEJ,CAAA,CAAA,CAAA,EAKJ,OACEM,IACCH,IAAS,QAAaE,GAAgBD,IAAgB,QAGrDU,EAAAA,IAACe,EAAAA,cAAA,CACC,KAAA1B,EACA,YAAAC,EACA,aAAAC,EACA,MAAAC,EACA,MAAAC,EACA,YAAAC,EACA,gBAAAC,EAEA,SAAAK,EAAAA,IAACnB,EAAA,CACC,UAAAI,EACA,MAAAE,EACA,OAAAC,EACC,GAAGQ,CAAA,CAAA,CACN,CAAA,EAMCa,CACT,CAAC,EAED5B,EAAQ,YAAc"}

package/dist/cjs/components/ContextMenu/ContextMenu.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),N=require("react"),s=require("../../packages/ui/src/components/context-menu.cjs"),a=require("../../packages/ui/src/lib/utils.cjs"),h=N.forwardRef((x,C)=>{const{onOpenChange:c,modal:o=!1,children:t,trigger:u,content:d,items:l,className:b,contentClassName:M,triggerClassName:j}=x;if(t)return n.jsx(s.ContextMenu,{onOpenChange:c,modal:o,children:t});const r=k=>k.map(e=>{switch(e.type){case"separator":return n.jsx(s.ContextMenuSeparator,{},e.key);case"label":return n.jsx(s.ContextMenuLabel,{inset:e.inset,className:e.className,children:e.label},e.key);case"group":return n.jsxs(s.ContextMenuGroup,{children:[e.label&&n.jsx(s.ContextMenuLabel,{children:e.label}),r(e.children)]},e.key);case"checkbox":return n.jsxs(s.ContextMenuCheckboxItem,{checked:e.checked,disabled:e.disabled,className:e.className,onCheckedChange:e.onCheckedChange,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]},e.key);case"radio":return n.jsx(s.ContextMenuRadioGroup,{value:e.value||e.group,children:n.jsxs(s.ContextMenuRadioItem,{value:e.value||e.key,disabled:e.disabled,onClick:e.onClick,className:e.className,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]})},e.key);default:return e.children&&e.children.length>0?n.jsxs(s.ContextMenuSub,{children:[n.jsxs(s.ContextMenuSubTrigger,{disabled:e.disabled,className:a.cn(e.disabled?"opacity-50 cursor-not-allowed":"",e.className),children:[e.icon,e.label]}),n.jsx(s.ContextMenuSubContent,{children:r(e.children)})]},e.key):n.jsxs(s.ContextMenuItem,{disabled:e.disabled,variant:e.variant,onClick:e.onClick,className:e.className,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]},e.key)}}),i=u?n.jsx(s.ContextMenuTrigger,{asChild:!0,className:a.cn(j),children:u}):null,g=d||l?n.jsxs(s.ContextMenuContent,{ref:C,className:a.cn(b,M),children:[d,l&&r(l)]}):null;return n.jsxs(s.ContextMenu,{onOpenChange:c,modal:o,children:[i,g]})});h.displayName="ContextMenu";exports.default=h;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),N=require("react"),s=require("../../packages/ui/src/components/context-menu.cjs"),a=require("../../packages/ui/src/lib/utils.cjs"),h=N.forwardRef((x,C)=>{const{onOpenChange:c,modal:o=!1,children:t,trigger:u,content:d,items:l,className:b,contentClassName:M,triggerClassName:j}=x;if(t)return n.jsx(s.ContextMenu,{onOpenChange:c,modal:o,children:t});const r=k=>k.map(e=>{switch(e.type){case"separator":return n.jsx(s.ContextMenuSeparator,{},e.key);case"label":return n.jsx(s.ContextMenuLabel,{inset:e.inset,className:e.className,children:e.label},e.key);case"group":return n.jsxs(s.ContextMenuGroup,{children:[e.label&&n.jsx(s.ContextMenuLabel,{children:e.label}),r(e.children)]},e.key);case"checkbox":return n.jsxs(s.ContextMenuCheckboxItem,{checked:e.checked,disabled:e.disabled,className:e.className,onCheckedChange:e.onCheckedChange,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]},e.key);case"radio":return n.jsx(s.ContextMenuRadioGroup,{value:e.value||e.group,children:n.jsxs(s.ContextMenuRadioItem,{value:e.value||e.key,disabled:e.disabled,onClick:e.onClick,className:e.className,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]})},e.key);default:return e.children&&e.children.length>0?n.jsxs(s.ContextMenuSub,{children:[n.jsxs(s.ContextMenuSubTrigger,{disabled:e.disabled,className:a.cn(e.disabled?"ds:opacity-50 ds:cursor-not-allowed":"",e.className),children:[e.icon,e.label]}),n.jsx(s.ContextMenuSubContent,{children:r(e.children)})]},e.key):n.jsxs(s.ContextMenuItem,{disabled:e.disabled,variant:e.variant,onClick:e.onClick,className:e.className,children:[e.icon,e.label,e.shortcut&&n.jsx(s.ContextMenuShortcut,{children:e.shortcut})]},e.key)}}),i=u?n.jsx(s.ContextMenuTrigger,{asChild:!0,className:a.cn(j),children:u}):null,g=d||l?n.jsxs(s.ContextMenuContent,{ref:C,className:a.cn(b,M),children:[d,l&&r(l)]}):null;return n.jsxs(s.ContextMenu,{onOpenChange:c,modal:o,children:[i,g]})});h.displayName="ContextMenu";exports.default=h;
 //# sourceMappingURL=ContextMenu.cjs.map

package/dist/cjs/components/ContextMenu/ContextMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.cjs","sources":["../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  ContextMenu as SContextMenu,\n  ContextMenuTrigger as SContextMenuTrigger,\n  ContextMenuContent as SContextMenuContent,\n  ContextMenuItem as SContextMenuItem,\n  ContextMenuCheckboxItem as SContextMenuCheckboxItem,\n  ContextMenuRadioItem as SContextMenuRadioItem,\n  ContextMenuRadioGroup as SContextMenuRadioGroup,\n  ContextMenuLabel as SContextMenuLabel,\n  ContextMenuSeparator as SContextMenuSeparator,\n  ContextMenuGroup as SContextMenuGroup,\n  ContextMenuSub as SContextMenuSub,\n  ContextMenuSubTrigger as SContextMenuSubTrigger,\n  ContextMenuSubContent as SContextMenuSubContent,\n  ContextMenuShortcut as SContextMenuShortcut,\n} from \"@dsui/ui/components/context-menu\";\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nexport type ContextMenuItem =\n  | {\n      key: string;\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      children?: ContextMenuItem[];\n      type?: \"item\";\n      checked?: boolean;\n      disabled?: boolean;\n      variant?: \"default\" | \"destructive\";\n      onClick?: () => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"checkbox\";\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      checked?: boolean;\n      disabled?: boolean;\n      onCheckedChange?: (checked: boolean) => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"radio\";\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      group: string;\n      value?: string;\n      disabled?: boolean;\n      onClick?: () => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"separator\";\n    }\n  | {\n      key: string;\n      type: \"group\";\n      label?: string;\n      children: ContextMenuItem[];\n      disabled?: boolean;\n    }\n  | {\n      key: string;\n      type: \"label\";\n      label: string;\n      inset?: boolean;\n      className?: string;\n    };\n\nexport interface ContextMenuProps {\n  // Core props\n  onOpenChange?: (open: boolean) => void;\n  modal?: boolean;\n\n  // Content\n  children?: React.ReactNode;\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  items?: ContextMenuItem[];\n\n  // Styling\n  className?: string;\n  contentClassName?: string;\n  triggerClassName?: string;\n}\n\nconst ContextMenu = React.forwardRef<HTMLDivElement, ContextMenuProps>(\n  (props, ref) => {\n    const {\n      onOpenChange,\n      modal = false,\n      children,\n      trigger,\n      content,\n      items,\n      className,\n      contentClassName,\n      triggerClassName,\n    } = props;\n\n    // If children are provided (compound pattern), render them directly\n    if (children) {\n      return (\n        <SContextMenu onOpenChange={onOpenChange} modal={modal}>\n          {children}\n        </SContextMenu>\n      );\n    }\n\n    // Render items if provided\n    const renderItems = (menuItems: ContextMenuItem[]): React.ReactNode => {\n      return menuItems.map((item) => {\n        switch (item.type) {\n          case \"separator\":\n            return <SContextMenuSeparator key={item.key} />;\n\n          case \"label\":\n            return (\n              <SContextMenuLabel\n                key={item.key}\n                inset={item.inset}\n                className={item.className}\n              >\n                {item.label}\n              </SContextMenuLabel>\n            );\n\n          case \"group\":\n            return (\n              <SContextMenuGroup key={item.key}>\n                {item.label && (\n                  <SContextMenuLabel>{item.label}</SContextMenuLabel>\n                )}\n                {renderItems(item.children)}\n              </SContextMenuGroup>\n            );\n\n          case \"checkbox\":\n            return (\n              <SContextMenuCheckboxItem\n                key={item.key}\n                checked={item.checked}\n                disabled={item.disabled}\n                className={item.className}\n                onCheckedChange={item.onCheckedChange}\n              >\n                {item.icon}\n                {item.label}\n                {item.shortcut && (\n                  <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                )}\n              </SContextMenuCheckboxItem>\n            );\n\n          case \"radio\":\n            return (\n              <SContextMenuRadioGroup\n                key={item.key}\n                value={item.value || item.group}\n              >\n                <SContextMenuRadioItem\n                  value={item.value || item.key}\n                  disabled={item.disabled}\n                  onClick={item.onClick}\n                  className={item.className}\n                >\n                  {item.icon}\n                  {item.label}\n                  {item.shortcut && (\n                    <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                  )}\n                </SContextMenuRadioItem>\n              </SContextMenuRadioGroup>\n            );\n\n          default: {\n            // item or undefined type\n            if (item.children && item.children.length > 0) {\n              // Submenu\n              return (\n                <SContextMenuSub key={item.key}>\n                  <SContextMenuSubTrigger\n                    disabled={item.disabled}\n                    className={cn(\n                      item.disabled ? \"opacity-50 cursor-not-allowed\" : \"\",\n                      item.className\n                    )}\n                  >\n                    {item.icon}\n                    {item.label}\n                  </SContextMenuSubTrigger>\n                  <SContextMenuSubContent>\n                    {renderItems(item.children)}\n                  </SContextMenuSubContent>\n                </SContextMenuSub>\n              );\n            } else {\n              // Regular item\n              return (\n                <SContextMenuItem\n                  key={item.key}\n                  disabled={item.disabled}\n                  variant={item.variant}\n                  onClick={item.onClick}\n                  className={item.className}\n                >\n                  {item.icon}\n                  {item.label}\n                  {item.shortcut && (\n                    <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                  )}\n                </SContextMenuItem>\n              );\n            }\n          }\n        }\n      });\n    };\n\n    // Props-based pattern with trigger and items\n    const triggerElement = trigger ? (\n      <SContextMenuTrigger asChild className={cn(triggerClassName)}>\n        {trigger}\n      </SContextMenuTrigger>\n    ) : null;\n\n    const contentElement =\n      content || items ? (\n        <SContextMenuContent\n          ref={ref}\n          className={cn(className, contentClassName)}\n        >\n          {content}\n          {items && renderItems(items)}\n        </SContextMenuContent>\n      ) : null;\n\n    return (\n      <SContextMenu onOpenChange={onOpenChange} modal={modal}>\n        {triggerElement}\n        {contentElement}\n      </SContextMenu>\n    );\n  }\n);\n\nContextMenu.displayName = \"ContextMenu\";\n\nexport default ContextMenu;\n"],"names":["ContextMenu","React","props","ref","onOpenChange","modal","children","trigger","content","items","className","contentClassName","triggerClassName","jsx","SContextMenu","renderItems","menuItems","item","SContextMenuSeparator","SContextMenuLabel","SContextMenuGroup","jsxs","SContextMenuCheckboxItem","SContextMenuShortcut","SContextMenuRadioGroup","SContextMenuRadioItem","SContextMenuSub","SContextMenuSubTrigger","cn","SContextMenuSubContent","SContextMenuItem","triggerElement","SContextMenuTrigger","contentElement","SContextMenuContent"],"mappings":"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"}
+{"version":3,"file":"ContextMenu.cjs","sources":["../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  ContextMenu as SContextMenu,\n  ContextMenuTrigger as SContextMenuTrigger,\n  ContextMenuContent as SContextMenuContent,\n  ContextMenuItem as SContextMenuItem,\n  ContextMenuCheckboxItem as SContextMenuCheckboxItem,\n  ContextMenuRadioItem as SContextMenuRadioItem,\n  ContextMenuRadioGroup as SContextMenuRadioGroup,\n  ContextMenuLabel as SContextMenuLabel,\n  ContextMenuSeparator as SContextMenuSeparator,\n  ContextMenuGroup as SContextMenuGroup,\n  ContextMenuSub as SContextMenuSub,\n  ContextMenuSubTrigger as SContextMenuSubTrigger,\n  ContextMenuSubContent as SContextMenuSubContent,\n  ContextMenuShortcut as SContextMenuShortcut,\n} from \"@dsui/ui/components/context-menu\";\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nexport type ContextMenuItem =\n  | {\n      key: string;\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      children?: ContextMenuItem[];\n      type?: \"item\";\n      checked?: boolean;\n      disabled?: boolean;\n      variant?: \"default\" | \"destructive\";\n      onClick?: () => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"checkbox\";\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      checked?: boolean;\n      disabled?: boolean;\n      onCheckedChange?: (checked: boolean) => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"radio\";\n      label?: string;\n      icon?: React.ReactNode;\n      shortcut?: string;\n      group: string;\n      value?: string;\n      disabled?: boolean;\n      onClick?: () => void;\n      className?: string;\n    }\n  | {\n      key: string;\n      type: \"separator\";\n    }\n  | {\n      key: string;\n      type: \"group\";\n      label?: string;\n      children: ContextMenuItem[];\n      disabled?: boolean;\n    }\n  | {\n      key: string;\n      type: \"label\";\n      label: string;\n      inset?: boolean;\n      className?: string;\n    };\n\nexport interface ContextMenuProps {\n  // Core props\n  onOpenChange?: (open: boolean) => void;\n  modal?: boolean;\n\n  // Content\n  children?: React.ReactNode;\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  items?: ContextMenuItem[];\n\n  // Styling\n  className?: string;\n  contentClassName?: string;\n  triggerClassName?: string;\n}\n\nconst ContextMenu = React.forwardRef<HTMLDivElement, ContextMenuProps>(\n  (props, ref) => {\n    const {\n      onOpenChange,\n      modal = false,\n      children,\n      trigger,\n      content,\n      items,\n      className,\n      contentClassName,\n      triggerClassName,\n    } = props;\n\n    // If children are provided (compound pattern), render them directly\n    if (children) {\n      return (\n        <SContextMenu onOpenChange={onOpenChange} modal={modal}>\n          {children}\n        </SContextMenu>\n      );\n    }\n\n    // Render items if provided\n    const renderItems = (menuItems: ContextMenuItem[]): React.ReactNode => {\n      return menuItems.map((item) => {\n        switch (item.type) {\n          case \"separator\":\n            return <SContextMenuSeparator key={item.key} />;\n\n          case \"label\":\n            return (\n              <SContextMenuLabel\n                key={item.key}\n                inset={item.inset}\n                className={item.className}\n              >\n                {item.label}\n              </SContextMenuLabel>\n            );\n\n          case \"group\":\n            return (\n              <SContextMenuGroup key={item.key}>\n                {item.label && (\n                  <SContextMenuLabel>{item.label}</SContextMenuLabel>\n                )}\n                {renderItems(item.children)}\n              </SContextMenuGroup>\n            );\n\n          case \"checkbox\":\n            return (\n              <SContextMenuCheckboxItem\n                key={item.key}\n                checked={item.checked}\n                disabled={item.disabled}\n                className={item.className}\n                onCheckedChange={item.onCheckedChange}\n              >\n                {item.icon}\n                {item.label}\n                {item.shortcut && (\n                  <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                )}\n              </SContextMenuCheckboxItem>\n            );\n\n          case \"radio\":\n            return (\n              <SContextMenuRadioGroup\n                key={item.key}\n                value={item.value || item.group}\n              >\n                <SContextMenuRadioItem\n                  value={item.value || item.key}\n                  disabled={item.disabled}\n                  onClick={item.onClick}\n                  className={item.className}\n                >\n                  {item.icon}\n                  {item.label}\n                  {item.shortcut && (\n                    <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                  )}\n                </SContextMenuRadioItem>\n              </SContextMenuRadioGroup>\n            );\n\n          default: {\n            // item or undefined type\n            if (item.children && item.children.length > 0) {\n              // Submenu\n              return (\n                <SContextMenuSub key={item.key}>\n                  <SContextMenuSubTrigger\n                    disabled={item.disabled}\n                    className={cn(\n                      item.disabled ? \"ds:opacity-50 ds:cursor-not-allowed\" : \"\",\n                      item.className\n                    )}\n                  >\n                    {item.icon}\n                    {item.label}\n                  </SContextMenuSubTrigger>\n                  <SContextMenuSubContent>\n                    {renderItems(item.children)}\n                  </SContextMenuSubContent>\n                </SContextMenuSub>\n              );\n            } else {\n              // Regular item\n              return (\n                <SContextMenuItem\n                  key={item.key}\n                  disabled={item.disabled}\n                  variant={item.variant}\n                  onClick={item.onClick}\n                  className={item.className}\n                >\n                  {item.icon}\n                  {item.label}\n                  {item.shortcut && (\n                    <SContextMenuShortcut>{item.shortcut}</SContextMenuShortcut>\n                  )}\n                </SContextMenuItem>\n              );\n            }\n          }\n        }\n      });\n    };\n\n    // Props-based pattern with trigger and items\n    const triggerElement = trigger ? (\n      <SContextMenuTrigger asChild className={cn(triggerClassName)}>\n        {trigger}\n      </SContextMenuTrigger>\n    ) : null;\n\n    const contentElement =\n      content || items ? (\n        <SContextMenuContent\n          ref={ref}\n          className={cn(className, contentClassName)}\n        >\n          {content}\n          {items && renderItems(items)}\n        </SContextMenuContent>\n      ) : null;\n\n    return (\n      <SContextMenu onOpenChange={onOpenChange} modal={modal}>\n        {triggerElement}\n        {contentElement}\n      </SContextMenu>\n    );\n  }\n);\n\nContextMenu.displayName = \"ContextMenu\";\n\nexport default ContextMenu;\n"],"names":["ContextMenu","React","props","ref","onOpenChange","modal","children","trigger","content","items","className","contentClassName","triggerClassName","jsx","SContextMenu","renderItems","menuItems","item","SContextMenuSeparator","SContextMenuLabel","SContextMenuGroup","jsxs","SContextMenuCheckboxItem","SContextMenuShortcut","SContextMenuRadioGroup","SContextMenuRadioItem","SContextMenuSub","SContextMenuSubTrigger","cn","SContextMenuSubContent","SContextMenuItem","triggerElement","SContextMenuTrigger","contentElement","SContextMenuContent"],"mappings":"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"}