npm - @sth87/shadcn-design-system - Versions diffs - 0.0.35 → 0.1.0 - Mend

@sth87/shadcn-design-system 0.0.35 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (421) hide show

package/dist/esm/components/Carousel/Carousel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Carousel.js","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","rect","percentage","targetIndex","dragWidth","scrollPosition","getSlideTransform","slideElement","cloneElement","ChevronLeft","ChevronUp","ChevronRight","ChevronDown","ImageViewer","style","props"],"mappings":"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"}
1	+ {"version":3,"file":"Carousel.js","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","rect","percentage","targetIndex","dragWidth","scrollPosition","getSlideTransform","slideElement","cloneElement","ChevronLeft","ChevronUp","ChevronRight","ChevronDown","ImageViewer","style","props"],"mappings":"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"}

package/dist/esm/components/Checkbox/Checkbox.js CHANGED Viewed

@@ -38,35 +38,35 @@ import { ConfettiPiece as q } from "../../utils/css.js";
 const B = u.forwardRef(
   (C, N) => {
     const {
-      label: i,
-      infoTooltip: r,
-      helperText: s,
+      label: s,
+      infoTooltip: i,
+      helperText: r,
       state: m,
       variant: w = "default",
       size: v = "default",
       color: k,
       labelPosition: t = "right",
-      labelAlignment: c = "center",
+      labelAlignment: d = "center",
       icon: y,
       animation: T,
       id: I,
-      onCheckedChange: p,
+      onCheckedChange: c,
       ...j
-    } = C, [z, d] = D(!1), A = u.useId(), n = I || A, P = {
-      default: "text-muted-foreground",
-      success: "text-success",
-      warning: "text-warning",
-      error: "text-error"
+    } = C, [z, p] = D(!1), A = u.useId(), n = I || A, P = {
+      default: "ds:text-muted-foreground",
+      success: "ds:text-success",
+      warning: "ds:text-warning",
+      error: "ds:text-error"
     }, S = (a) => {
-      a && (d(!0), setTimeout(() => d(!1), 800)), p?.(a);
-    }, f = t === "top" || t === "bottom", _ = f ? "flex-col" : "flex-row", F = f ? "gap-1.5" : "gap-2", R = c === "start" ? "items-start" : c === "center" ? "items-center" : "items-end", h = "flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";
-    return /* @__PURE__ */ o("div", { className: l("flex flex-col gap-1.5 relative", {}), children: [
-      /* @__PURE__ */ o("div", { className: l("flex", _, F, R), children: [
-        (t === "top" || t === "left") && i && /* @__PURE__ */ o("label", { htmlFor: n, className: h, children: [
-          i,
-          r && /* @__PURE__ */ e(b, { content: r, children: /* @__PURE__ */ e(g, { className: "size-3.5 min-w-3.5" }) })
+      a && (p(!0), setTimeout(() => p(!1), 800)), c?.(a);
+    }, f = t === "top" || t === "bottom", _ = f ? "flex-col" : "flex-row", F = f ? "gap-1.5" : "gap-2", R = d === "start" ? "items-start" : d === "center" ? "items-center" : "items-end", h = "flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";
+    return /* @__PURE__ */ o("div", { className: l("ds:flex ds:flex-col ds:gap-1.5 ds:relative", {}), children: [
+      /* @__PURE__ */ o("div", { className: l("ds:flex", _, F, R), children: [
+        (t === "top" || t === "left") && s && /* @__PURE__ */ o("label", { htmlFor: n, className: h, children: [
+          s,
+          i && /* @__PURE__ */ e(b, { content: i, children: /* @__PURE__ */ e(g, { className: "ds:size-3.5 ds:min-w-3.5" }) })
         ] }),
-        /* @__PURE__ */ o("div", { className: "relative inline-flex", children: [
+        /* @__PURE__ */ o("div", { className: "ds:relative ds:inline-flex", children: [
           /* @__PURE__ */ e(
             L,
             {
@@ -77,24 +77,24 @@ const B = u.forwardRef(
               size: v,
               color: k,
               icon: y,
-              onCheckedChange: T ? S : p
+              onCheckedChange: T ? S : c
             }
           ),
-          /* @__PURE__ */ e($, { children: z && /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0", children: [...Array(12)].map((a, x) => /* @__PURE__ */ e(q, { index: x }, x)) }) })
+          /* @__PURE__ */ e($, { children: z && /* @__PURE__ */ e("div", { className: "ds:pointer-events-none ds:absolute ds:inset-0", children: [...Array(12)].map((a, x) => /* @__PURE__ */ e(q, { index: x }, x)) }) })
         ] }),
-        (t === "bottom" || t === "right") && i && /* @__PURE__ */ o(V, { htmlFor: n, className: h, children: [
-          i,
-          r && /* @__PURE__ */ e(b, { content: r, children: /* @__PURE__ */ e(g, { className: "size-3.5 min-w-3.5" }) })
+        (t === "bottom" || t === "right") && s && /* @__PURE__ */ o(V, { htmlFor: n, className: h, children: [
+          s,
+          i && /* @__PURE__ */ e(b, { content: i, children: /* @__PURE__ */ e(g, { className: "ds:size-3.5 ds:min-w-3.5" }) })
         ] })
       ] }),
-      s && /* @__PURE__ */ e("div", { className: "flex items-center justify-between text-xs gap-2", children: s && /* @__PURE__ */ e(
+      r && /* @__PURE__ */ e("div", { className: "ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2", children: r && /* @__PURE__ */ e(
         "p",
         {
           className: l(
-            "text-xs",
+            "ds:text-xs",
             m ? P?.[m] : ""
           ),
-          children: s
+          children: r
         }
       ) })
     ] });

package/dist/esm/components/Checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAMA,IAAWC,EAAM;AAAA,EACrB,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,OAAAC;AAAA,MACA,aAAAC;AAAA,MACA,YAAAC;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC,IAAU;AAAA,MACV,MAAAC,IAAO;AAAA,MACP,OAAAC;AAAA,MACA,eAAAC,IAAgB;AAAA,MAChB,gBAAAC,IAAiB;AAAA,MACjB,MAAAC;AAAA,MACA,WAAAC;AAAA,MACA,IAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDf,GACE,CAACgB,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChDC,IAAcpB,EAAM,MAAA,GACpBqB,IAAUP,KAAMM,GAGhBE,IAAmB;AAAA,MACvB,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,IAAA,GAGHC,IAAsB,CAACC,MAA0B;AACrD,MAAIA,MACFN,EAAgB,EAAI,GACpB,WAAW,MAAMA,EAAgB,EAAK,GAAG,GAAG,IAE9CH,IAAkBS,CAAO;AAAA,IAC3B,GAEMC,IAAaf,MAAkB,SAASA,MAAkB,UAC1DgB,IAAgBD,IAAa,aAAa,YAC1CE,IAAWF,IAAa,YAAY,SAEpCG,IACJjB,MAAmB,UACf,gBACAA,MAAmB,WACjB,iBACA,aAEFkB,IACJ;AAEF,6BACG,OAAA,EAAI,WAAWC,EAAG,~~kCAAkC~~,CAAA,CAAE,~~GACrD~~,UAAA;AAAA,MAAA,gBAAAC,EAAC,SAAI,WAAWD,EAAG,~~QAAQJ~~,GAAeC,GAAUC,CAAc,~~GAC9D~~,UAAA;AAAA,SAAAlB,MAAkB,SAASA,MAAkB,WAAWP,uBACvD,SAAA,EAAM,SAASkB,GAAS,WAAWQ,GACjC,UAAA;AAAA,UAAA1B;AAAA,UACAC,uBACE4B,GAAA,EAAQ,SAAS5B,GAChB,UAAA,gBAAA6B,EAACC,GAAA,EAAK,WAAU,~~qBAAA~~,~~CAAqB~~,EAAA,~~CACvC~~;AAAA,QAAA,GAEJ;AAAA,QAGF,gBAAAH,EAAC,OAAA,EAAI,WAAU,~~wBACb~~,UAAA;AAAA,UAAA,gBAAAE;AAAA,YAACE;AAAAA,YAAA;AAAA,cACC,KAAAjC;AAAA,cACA,IAAImB;AAAA,cACH,GAAGL;AAAA,cACJ,SAAAT;AAAA,cACA,MAAAC;AAAA,cACA,OAAAC;AAAA,cACA,MAAAG;AAAA,cACA,iBACEC,IAAYU,IAAsBR;AAAA,YAAA;AAAA,UAAA;AAAA,UAItC,gBAAAkB,EAACG,GAAA,EACE,UAAAnB,KACC,gBAAAgB,EAAC,OAAA,EAAI,WAAU,~~wCACZ~~,UAAA,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,IAAI,CAACI,GAAGC,MACtB,gBAAAL,EAACM,GAAA,EAAsB,OAAOD,EAAA,GAAVA,CAAa,CAClC,EAAA,CACH,EAAA,CAEJ;AAAA,QAAA,GACF;AAAA,SAEE5B,MAAkB,YAAYA,MAAkB,YAChDP,uBACGqC,GAAA,EAAM,SAASnB,GAAS,WAAWQ,GACjC,UAAA;AAAA,UAAA1B;AAAA,UACAC,uBACE4B,GAAA,EAAQ,SAAS5B,GAChB,UAAA,gBAAA6B,EAACC,GAAA,EAAK,WAAU,~~qBAAA~~,~~CAAqB~~,EAAA,~~CACvC~~;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA,GAEN;AAAA,MAEC7B,KACC,gBAAA4B,EAAC,OAAA,EAAI,WAAU,~~mDACZ~~,UAAA5B,KACC,gBAAA4B;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWH;AAAA,YACT;AAAA,YACAxB,IAAQgB,IAAmBhB,CAAK,IAAI;AAAA,UAAA;AAAA,UAGrC,UAAAD;AAAA,QAAA;AAAA,MAAA,EACH,CAEJ;AAAA,IAAA,GAEJ;AAAA,EAEJ;AACF;AAEAN,EAAS,cAAc;"}
1	+ {"version":3,"file":"Checkbox.js","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":"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"}

package/dist/esm/components/Collapsible/Collapsible.js CHANGED Viewed

@@ -1,98 +1,98 @@
-import { jsx as t, jsxs as C } from "react/jsx-runtime";
-import a from "react";
+import { jsx as e, jsxs as C } from "react/jsx-runtime";
+import n from "react";
 import { Collapsible as x, CollapsibleTrigger as S, CollapsibleContent as z } from "../../packages/ui/src/components/collapsible.js";
-import { cn as e } from "../../packages/ui/src/lib/utils.js";
+import { cn as s } from "../../packages/ui/src/lib/utils.js";
 import { ChevronDown as y } from "lucide-react";
-const I = a.forwardRef((N, s) => {
+const I = n.forwardRef((N, d) => {
   const {
-    trigger: l,
-    content: i,
-    showIcon: c = !0,
-    iconPosition: p = "right",
-    iconRotation: d = !0,
+    trigger: a,
+    content: l,
+    showIcon: i = !0,
+    iconPosition: c = "right",
+    iconRotation: p = !0,
     triggerClassName: v,
     contentClassName: O,
     variant: w = "default",
     className: g,
-    open: n,
+    open: r,
     defaultOpen: j,
     onOpenChange: R,
     children: m,
     ...f
-  } = N, [o, h] = a.useState(j ?? !1);
-  a.useEffect(() => {
-    n !== void 0 && h(n);
-  }, [n]);
+  } = N, [t, h] = n.useState(j ?? !1);
+  n.useEffect(() => {
+    r !== void 0 && h(r);
+  }, [r]);
   const u = (b) => {
     h(b), R?.(b);
-  }, r = {
+  }, o = {
     default: {
-      root: "rounded-lg border bg-card",
-      trigger: "px-4 py-3 hover:bg-accent/50",
-      content: "px-4 py-3 border-t"
+      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: "rounded-lg border-2",
-      trigger: "px-4 py-3 font-semibold hover:bg-accent",
-      content: "px-4 py-3 border-t-2"
+      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: "px-2 py-2 hover:bg-accent/30 rounded-md",
-      content: "px-2 py-2"
+      trigger: "ds:px-2 ds:py-2 ds:hover:bg-accent/30 ds:rounded-md",
+      content: "ds:px-2 ds:py-2"
     }
   }[w];
-  return m && !l && !i ? /* @__PURE__ */ t(
+  return m && !a && !l ? /* @__PURE__ */ e(
     x,
     {
-      ref: s,
-      open: o,
+      ref: d,
+      open: t,
       onOpenChange: u,
-      className: e(r.root, g),
+      className: s(o.root, g),
       ...f,
       children: m
     }
   ) : /* @__PURE__ */ C(
     x,
     {
-      ref: s,
-      open: o,
+      ref: d,
+      open: t,
       onOpenChange: u,
-      className: e(r.root, g),
+      className: s(o.root, g),
       ...f,
       children: [
         /* @__PURE__ */ C(
           S,
           {
-            className: e(
-              "flex w-full items-center justify-between transition-colors",
-              r.trigger,
+            className: s(
+              "ds:flex ds:w-full ds:items-center ds:justify-between ds:transition-colors",
+              o.trigger,
               v
             ),
             children: [
-              p === "left" && c && /* @__PURE__ */ t(
+              c === "left" && i && /* @__PURE__ */ e(
                 y,
                 {
-                  className: e(
-                    "size-4 transition-transform duration-200",
-                    d && o && "rotate-180"
+                  className: s(
+                    "ds:size-4 ds:transition-transform ds:duration-200",
+                    p && t && "ds:rotate-180"
                   )
                 }
               ),
-              /* @__PURE__ */ t("span", { className: "flex-1 text-left", children: l }),
-              p === "right" && c && /* @__PURE__ */ t(
+              /* @__PURE__ */ e("span", { className: "ds:flex-1 ds:text-left", children: a }),
+              c === "right" && i && /* @__PURE__ */ e(
                 y,
                 {
-                  className: e(
-                    "size-4 transition-transform duration-200",
-                    d && o && "rotate-180"
+                  className: s(
+                    "ds:size-4 ds:transition-transform ds:duration-200",
+                    p && t && "ds:rotate-180"
                   )
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ t(z, { className: e(r.content, O), children: i })
+        /* @__PURE__ */ e(z, { className: s(o.content, O), children: l })
       ]
     }
   );

package/dist/esm/components/Collapsible/Collapsible.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Collapsible.js","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":";;;;;AA2BA,MAAMA,IAAcC,EAAM,WAGxB,CAACC,GAAOC,MAAQ;AAChB,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,cAAAC,IAAe;AAAA,IACf,cAAAC,IAAe;AAAA,IACf,kBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDf,GAEE,CAACgB,GAAQC,CAAS,IAAIlB,EAAM,SAASa,KAAe,EAAK;AAE/Db,EAAAA,EAAM,UAAU,MAAM;AACpB,IAAIY,MAAS,UACXM,EAAUN,CAAI;AAAA,EAElB,GAAG,CAACA,CAAI,CAAC;AAET,QAAMO,IAAmB,CAACC,MAAqB;AAC7C,IAAAF,EAAUE,CAAO,GACjBN,IAAeM,CAAO;AAAA,EACxB,GAoBMC,IAlBgB;AAAA,IACpB,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,EACX,EAG2BX,CAAO;AAGpC,SAAIK,KAAY,CAACZ,KAAW,CAACC,IAEzB,gBAAAkB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAArB;AAAA,MACA,MAAMe;AAAA,MACN,cAAcE;AAAA,MACd,WAAWK,EAAGH,EAAO,MAAMV,CAAS;AAAA,MACnC,GAAGK;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA,IAOL,gBAAAU;AAAA,IAACF;AAAAA,IAAA;AAAA,MACC,KAAArB;AAAA,MACA,MAAMe;AAAA,MACN,cAAcE;AAAA,MACd,WAAWK,EAAGH,EAAO,MAAMV,CAAS;AAAA,MACnC,GAAGK;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAS;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWF;AAAA,cACT;AAAA,cACAH,EAAO;AAAA,cACPb;AAAA,YAAA;AAAA,YAGD,UAAA;AAAA,cAAAF,MAAiB,UAAUD,KAC1B,gBAAAiB;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACC,WAAWH;AAAA,oBACT;AAAA,oBACAjB,KAAgBU,KAAU;AAAA,kBAAA;AAAA,gBAC5B;AAAA,cAAA;AAAA,cAGJ,gBAAAK,EAAC,QAAA,EAAK,WAAU,~~oBAAoB~~,UAAAnB,GAAQ;AAAA,~~cAC3CG~~,MAAiB,WAAWD,KAC3B,gBAAAiB;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACC,WAAWH;AAAA,oBACT;AAAA,oBACAjB,KAAgBU,KAAU;AAAA,kBAAA;AAAA,gBAC5B;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,gBAAAK,EAACM,KAAmB,WAAWJ,EAAGH,EAAO,SAASZ,CAAgB,GAC/D,UAAAL,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;AAEDL,EAAY,cAAc;"}
1	+ {"version":3,"file":"Collapsible.js","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":";;;;;AA2BA,MAAMA,IAAcC,EAAM,WAGxB,CAACC,GAAOC,MAAQ;AAChB,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,cAAAC,IAAe;AAAA,IACf,cAAAC,IAAe;AAAA,IACf,kBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDf,GAEE,CAACgB,GAAQC,CAAS,IAAIlB,EAAM,SAASa,KAAe,EAAK;AAE/Db,EAAAA,EAAM,UAAU,MAAM;AACpB,IAAIY,MAAS,UACXM,EAAUN,CAAI;AAAA,EAElB,GAAG,CAACA,CAAI,CAAC;AAET,QAAMO,IAAmB,CAACC,MAAqB;AAC7C,IAAAF,EAAUE,CAAO,GACjBN,IAAeM,CAAO;AAAA,EACxB,GAoBMC,IAlBgB;AAAA,IACpB,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,IAEX,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,IAAA;AAAA,EACX,EAG2BX,CAAO;AAGpC,SAAIK,KAAY,CAACZ,KAAW,CAACC,IAEzB,gBAAAkB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAArB;AAAA,MACA,MAAMe;AAAA,MACN,cAAcE;AAAA,MACd,WAAWK,EAAGH,EAAO,MAAMV,CAAS;AAAA,MACnC,GAAGK;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA,IAOL,gBAAAU;AAAA,IAACF;AAAAA,IAAA;AAAA,MACC,KAAArB;AAAA,MACA,MAAMe;AAAA,MACN,cAAcE;AAAA,MACd,WAAWK,EAAGH,EAAO,MAAMV,CAAS;AAAA,MACnC,GAAGK;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAS;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWF;AAAA,cACT;AAAA,cACAH,EAAO;AAAA,cACPb;AAAA,YAAA;AAAA,YAGD,UAAA;AAAA,cAAAF,MAAiB,UAAUD,KAC1B,gBAAAiB;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACC,WAAWH;AAAA,oBACT;AAAA,oBACAjB,KAAgBU,KAAU;AAAA,kBAAA;AAAA,gBAC5B;AAAA,cAAA;AAAA,cAGJ,gBAAAK,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAAnB,GAAQ;AAAA,cACjDG,MAAiB,WAAWD,KAC3B,gBAAAiB;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACC,WAAWH;AAAA,oBACT;AAAA,oBACAjB,KAAgBU,KAAU;AAAA,kBAAA;AAAA,gBAC5B;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJ,gBAAAK,EAACM,KAAmB,WAAWJ,EAAGH,EAAO,SAASZ,CAAgB,GAC/D,UAAAL,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;AAEDL,EAAY,cAAc;"}