npm - @sth87/shadcn-design-system - Versions diffs - 0.0.1 - Mend

@sth87/shadcn-design-system 0.0.1

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 (760) hide show

package/dist/cjs/components/Tabs/Tabs.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Tabs.cjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n Tabs as STabs,\n TabsList as STabsList,\n TabsTrigger as STabsTrigger,\n TabsContent as STabsContent,\n} from \"@dsui/ui/components/tabs\";\nimport { motion } from \"motion/react\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ScrollArea, ScrollBar } from \"../ScrollArea/ScrollArea\";\nimport Popover from \"../Popover/Popover\";\nimport { MoreHorizontal } from \"lucide-react\";\nimport type {\n TabAlignment,\n TabColor,\n TabItem,\n TabOverflowMode,\n TabPosition,\n TabSize,\n TabVariant,\n} from \"./types\";\nimport {\n alignmentClasses,\n getColorClasses,\n getEnclosedFillTriggerClasses,\n getEnclosedTriggerClasses,\n getListBorderClasses,\n getUnderlinedTriggerClasses,\n positionClasses,\n sizeClasses,\n variantClasses,\n} from \"./classes\";\n\nexport interface TabsProps {\n // Core props\n items: TabItem[];\n defaultActiveKey?: string;\n activeKey?: string;\n onChange?: (key: string) => void;\n\n // Layout\n tabPosition?: TabPosition;\n size?: TabSize;\n alignment?: TabAlignment;\n fullWidth?: boolean;\n\n // Overflow handling\n overflowMode?: TabOverflowMode;\n\n // Styling\n variant?: TabVariant;\n color?: TabColor;\n className?: string;\n tabListClassName?: string;\n tabContentClassName?: string;\n tabTriggerClassName?: string;\n}\n\nconst Tabs = React.forwardRef<HTMLDivElement, TabsProps>((props, ref) => {\n const {\n items,\n defaultActiveKey,\n activeKey,\n onChange,\n tabPosition = \"top\",\n size = \"md\",\n alignment = \"start\",\n fullWidth = false,\n overflowMode = \"scroll\",\n variant = \"solid\",\n color = \"muted\",\n className,\n tabListClassName,\n tabContentClassName,\n tabTriggerClassName,\n } = props;\n\n const tabRefs = React.useRef<(HTMLButtonElement | null)[]>([]);\n const tabsListRef = React.useRef<HTMLDivElement | null>(null);\n const containerRef = React.useRef<HTMLDivElement | null>(null);\n const scrollAreaRef = React.useRef<HTMLDivElement | null>(null);\n\n const [indicatorStyle, setIndicatorStyle] = React.useState<{\n left: number;\n width: number;\n top: number;\n height: number;\n }>({\n left: 0,\n width: 0,\n top: 0,\n height: 0,\n });\n\n const [internalActiveKey, setInternalActiveKey] = React.useState<\n string | undefined\n >(activeKey || defaultActiveKey || items[0]?.key);\n\n // Overflow state management\n const [isOverflowing, setIsOverflowing] = React.useState(false);\n const [visibleTabsCount, setVisibleTabsCount] = React.useState(items.length);\n const [dropdownOpen, setDropdownOpen] = React.useState(false);\n\n // Fade state management for scroll position\n const [showStartFade, setShowStartFade] = React.useState(false);\n const [showEndFade, setShowEndFade] = React.useState(false);\n\n const currentActiveKey =\n activeKey !== undefined ? activeKey : internalActiveKey;\n\n const isVertical = tabPosition === \"left\" || tabPosition === \"right\";\n\n // Check if tabs are overflowing (for scroll and fade modes)\n React.useLayoutEffect(() => {\n if (!overflowMode || overflowMode === \"dropdown\") return;\n\n const checkOverflow = () => {\n const container = containerRef.current;\n const listElement = tabsListRef.current;\n\n if (!container || !listElement) return;\n\n const containerSize = isVertical\n ? container.clientHeight\n : container.clientWidth;\n const listSize = isVertical\n ? listElement.scrollHeight\n : listElement.scrollWidth;\n\n const hasOverflow = listSize > containerSize;\n setIsOverflowing(hasOverflow);\n };\n\n // Initial check\n checkOverflow();\n\n // Use ResizeObserver for responsive updates\n const resizeObserver = new ResizeObserver(checkOverflow);\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n if (tabsListRef.current) {\n resizeObserver.observe(tabsListRef.current);\n }\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [items, overflowMode, isVertical]);\n\n // Calculate visible tabs for dropdown mode\n React.useLayoutEffect(() => {\n if (overflowMode !== \"dropdown\") return;\n\n const calculateVisibleTabs = () => {\n const container = containerRef.current;\n if (!container) return;\n\n const containerSize = isVertical\n ? container.clientHeight\n : container.clientWidth;\n\n // Calculate how many tabs can fit including the [...] button\n let totalSize = 0;\n const dropdownButtonSize = 48; // Size of [...] button with gap\n const listPadding = 6; // p-[3px] = 6px total padding for some variants\n const gap =\n variant === \"enclosed-fill\" ||\n variant === \"bordered\" ||\n variant === \"pills\" ||\n variant === \"pill-stroke\" ||\n variant === \"text\" ||\n variant === \"outline\"\n ? 4\n : 0; // gap-1 = 4px\n\n let count = 0;\n for (let i = 0; i < tabRefs.current.length; i++) {\n const tab = tabRefs.current[i];\n if (!tab) break;\n\n const tabSize = isVertical ? tab.offsetHeight : tab.offsetWidth;\n const withGap = i > 0 ? gap : 0;\n\n // Check if we can fit this tab + [...] button if there are more tabs\n const hasMoreTabs = i < tabRefs.current.length - 1;\n const requiredSize =\n totalSize +\n tabSize +\n withGap +\n (hasMoreTabs ? dropdownButtonSize : 0) +\n listPadding;\n\n if (requiredSize <= containerSize) {\n totalSize += tabSize + withGap;\n count++;\n } else {\n break;\n }\n }\n\n // Only show overflow if we can't fit all tabs\n const hasHiddenTabs = count < items.length;\n setIsOverflowing(hasHiddenTabs);\n setVisibleTabsCount(Math.max(1, count));\n };\n\n // Initial calculation\n calculateVisibleTabs();\n\n // Use ResizeObserver for responsive updates\n const resizeObserver = new ResizeObserver(calculateVisibleTabs);\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n // Also observe each tab for size changes\n tabRefs.current.forEach((tab) => {\n if (tab) resizeObserver.observe(tab);\n });\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [items, overflowMode, isVertical, variant]);\n\n React.useLayoutEffect(() => {\n const activeIndex = items.findIndex((tab) => tab.key === currentActiveKey);\n const activeTabElement = tabRefs.current[activeIndex];\n const listElement = tabsListRef.current;\n\n if (activeTabElement && listElement) {\n const listRect = listElement.getBoundingClientRect();\n const tabRect = activeTabElement.getBoundingClientRect();\n\n // Calculate relative position within the list\n const left = tabRect.left - listRect.left;\n const top = tabRect.top - listRect.top;\n\n setIndicatorStyle({\n left: left,\n width: tabRect.width,\n top: top,\n height: tabRect.height,\n });\n\n // Auto-scroll to active tab in fade mode\n if (overflowMode === \"fade\" && scrollAreaRef.current) {\n const scrollAreaViewport = scrollAreaRef.current.querySelector(\n \"[data-radix-scroll-area-viewport]\",\n ) as HTMLElement;\n\n if (scrollAreaViewport) {\n const viewportRect = scrollAreaViewport.getBoundingClientRect();\n const tabRectInViewport = activeTabElement.getBoundingClientRect();\n const fadeWidth = 96; // 24 * 4 = 96px (w-24 class)\n\n if (isVertical) {\n // Scroll vertically\n const scrollTop = scrollAreaViewport.scrollTop;\n const scrollHeight = scrollAreaViewport.scrollHeight;\n const viewportHeight = viewportRect.height;\n const tabTop = tabRectInViewport.top - viewportRect.top + scrollTop;\n const tabHeight = tabRectInViewport.height;\n\n // If it's the first tab, scroll to the very top\n if (activeIndex === 0) {\n scrollAreaViewport.scrollTo({\n top: 0,\n behavior: \"smooth\",\n });\n }\n // If it's the last tab, scroll to the very bottom\n else if (activeIndex === items.length - 1) {\n scrollAreaViewport.scrollTo({\n top: scrollHeight - viewportHeight,\n behavior: \"smooth\",\n });\n }\n // For middle tabs, try to center them with padding to avoid fade\n else {\n const targetScrollTop =\n tabTop - viewportHeight / 2 + tabHeight / 2;\n const maxScroll = scrollHeight - viewportHeight;\n\n // Ensure we don't scroll beyond bounds and leave space for fade\n const clampedScroll = Math.max(\n fadeWidth / 2,\n Math.min(targetScrollTop, maxScroll - fadeWidth / 2),\n );\n\n scrollAreaViewport.scrollTo({\n top: clampedScroll,\n behavior: \"smooth\",\n });\n }\n } else {\n // Scroll horizontally\n const scrollLeft = scrollAreaViewport.scrollLeft;\n const scrollWidth = scrollAreaViewport.scrollWidth;\n const viewportWidth = viewportRect.width;\n const tabLeft =\n tabRectInViewport.left - viewportRect.left + scrollLeft;\n const tabWidth = tabRectInViewport.width;\n\n // If it's the first tab, scroll to the very left\n if (activeIndex === 0) {\n scrollAreaViewport.scrollTo({\n left: 0,\n behavior: \"smooth\",\n });\n }\n // If it's the last tab, scroll to the very right\n else if (activeIndex === items.length - 1) {\n scrollAreaViewport.scrollTo({\n left: scrollWidth - viewportWidth,\n behavior: \"smooth\",\n });\n }\n // For middle tabs, try to center them with padding to avoid fade\n else {\n const targetScrollLeft =\n tabLeft - viewportWidth / 2 + tabWidth / 2;\n const maxScroll = scrollWidth - viewportWidth;\n\n // Ensure we don't scroll beyond bounds and leave space for fade\n const clampedScroll = Math.max(\n fadeWidth / 2,\n Math.min(targetScrollLeft, maxScroll - fadeWidth / 2),\n );\n\n scrollAreaViewport.scrollTo({\n left: clampedScroll,\n behavior: \"smooth\",\n });\n }\n }\n }\n }\n }\n }, [currentActiveKey, items, isVertical, overflowMode]);\n\n // Handle scroll events for fade mode to show/hide fade gradients\n React.useEffect(() => {\n if (overflowMode !== \"fade\" || !scrollAreaRef.current) return;\n\n const scrollAreaViewport = scrollAreaRef.current.querySelector(\n \"[data-radix-scroll-area-viewport]\",\n ) as HTMLElement;\n\n if (!scrollAreaViewport) return;\n\n let rafId: number | null = null;\n\n const handleScroll = () => {\n // Cancel previous frame if still pending\n if (rafId !== null) {\n cancelAnimationFrame(rafId);\n }\n\n // Use requestAnimationFrame for smooth updates\n rafId = requestAnimationFrame(() => {\n const threshold = 5; // Small threshold to account for floating point precision\n\n if (isVertical) {\n const scrollTop = scrollAreaViewport.scrollTop;\n const scrollHeight = scrollAreaViewport.scrollHeight;\n const clientHeight = scrollAreaViewport.clientHeight;\n\n setShowStartFade(scrollTop > threshold);\n setShowEndFade(scrollTop < scrollHeight - clientHeight - threshold);\n } else {\n const scrollLeft = scrollAreaViewport.scrollLeft;\n const scrollWidth = scrollAreaViewport.scrollWidth;\n const clientWidth = scrollAreaViewport.clientWidth;\n\n setShowStartFade(scrollLeft > threshold);\n setShowEndFade(scrollLeft < scrollWidth - clientWidth - threshold);\n }\n\n // Update indicator position smoothly during scroll\n const activeIndex = items.findIndex(\n (tab) => tab.key === currentActiveKey,\n );\n const activeTabElement = tabRefs.current[activeIndex];\n const listElement = tabsListRef.current;\n\n if (activeTabElement && listElement) {\n const listRect = listElement.getBoundingClientRect();\n const tabRect = activeTabElement.getBoundingClientRect();\n\n const left = tabRect.left - listRect.left;\n const top = tabRect.top - listRect.top;\n\n setIndicatorStyle({\n left: left,\n width: tabRect.width,\n top: top,\n height: tabRect.height,\n });\n }\n\n rafId = null;\n });\n };\n\n // Initial check\n handleScroll();\n\n // Add scroll listener\n scrollAreaViewport.addEventListener(\"scroll\", handleScroll, {\n passive: true,\n });\n\n // Recheck on resize\n const resizeObserver = new ResizeObserver(handleScroll);\n resizeObserver.observe(scrollAreaViewport);\n\n return () => {\n if (rafId !== null) {\n cancelAnimationFrame(rafId);\n }\n scrollAreaViewport.removeEventListener(\"scroll\", handleScroll);\n resizeObserver.disconnect();\n };\n }, [overflowMode, isVertical, isOverflowing, items, currentActiveKey]);\n\n const handleValueChange = (key: string) => {\n if (activeKey === undefined) {\n setInternalActiveKey(key);\n }\n onChange?.(key);\n };\n\n const orientation = isVertical ? \"vertical\" : \"horizontal\";\n\n // Get variant classes\n const variantConfig = variantClasses[variant];\n const listVariantClass =\n variantConfig.list[isVertical ? \"vertical\" : \"horizontal\"];\n\n // Get trigger variant class based on variant type\n let triggerVariantClass =\n variantConfig.trigger[isVertical ? \"vertical\" : \"horizontal\"];\n\n // For underlined and enclosed variants, use dynamic classes based on position\n if (variant === \"underlined\") {\n triggerVariantClass = getUnderlinedTriggerClasses(tabPosition);\n } else if (variant === \"enclosed\") {\n triggerVariantClass = getEnclosedTriggerClasses(tabPosition);\n } else if (variant === \"enclosed-fill\") {\n triggerVariantClass = getEnclosedFillTriggerClasses(tabPosition);\n }\n\n // Get color classes based on variant\n const triggerColorClass = getColorClasses(variant, color);\n const listBorderClass = getListBorderClasses(variant, color, tabPosition);\n\n // Determine which tabs to show based on overflow mode\n const visibleTabs =\n overflowMode === \"dropdown\" && isOverflowing\n ? items.slice(0, visibleTabsCount)\n : items;\n\n const overflowTabs =\n overflowMode === \"dropdown\" && isOverflowing\n ? items.slice(visibleTabsCount)\n : overflowMode === \"fade\" && isOverflowing\n ? items\n : [];\n\n // For dropdown mode: show [...] button only if there are hidden tabs\n const showDropdownButton =\n overflowMode === \"dropdown\" && isOverflowing && overflowTabs.length > 0;\n\n // Check if active tab is in overflow (hidden) tabs\n const isActiveTabInOverflow =\n overflowMode === \"dropdown\" &&\n isOverflowing &&\n overflowTabs.some((tab) => tab.key === currentActiveKey);\n\n const renderTabTriggers = (tabItems: TabItem[], startIndex = 0) => (\n <>\n {tabItems.map((item, index) => {\n const actualIndex = startIndex + index;\n return (\n <STabsTrigger\n key={item.key}\n ref={(el) => {\n tabRefs.current[actualIndex] = el;\n }}\n value={item.key}\n disabled={item.disabled}\n className={cn(\n triggerVariantClass,\n // Apply styles based on variant\n {\n // For sliding indicator variants, remove default background\n \"relative z-10 bg-transparent data-[state=active]:bg-transparent\":\n variant === \"solid\" ||\n variant === \"bordered\" ||\n variant === \"pills\",\n // Apply text color for active state with sliding indicator\n \"data-[state=active]:text-primary-foreground\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"primary\",\n \"data-[state=active]:text-secondary-foreground\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"secondary\",\n \"data-[state=active]:text-muted-foreground\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"muted\",\n \"data-[state=active]:text-accent-foreground\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"accent\",\n \"data-[state=active]:text-destructive-foreground\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"destructive\",\n \"data-[state=active]:text-white\":\n (variant === \"bordered\" || variant === \"pills\") &&\n (color === \"success\" || color === \"warning\"),\n \"flex-1\": fullWidth && !isVertical,\n \"w-full justify-start\": isVertical,\n },\n // For other variants, apply normal color classes\n !(\n variant === \"solid\" ||\n variant === \"bordered\" ||\n variant === \"pills\"\n ) && triggerColorClass,\n item.className,\n tabTriggerClassName,\n )}\n >\n {item.icon && (\n <span className=\"mr-2 inline-flex items-center\">{item.icon}</span>\n )}\n {item.label}\n </STabsTrigger>\n );\n })}\n </>\n );\n\n const renderTabsList = () => {\n const tabsListContent = (\n <STabsList\n ref={tabsListRef}\n className={cn(\n positionClasses[tabPosition].list,\n sizeClasses[size][isVertical ? \"vertical\" : \"horizontal\"],\n listVariantClass,\n listBorderClass,\n tabListClassName,\n \"relative\",\n {\n \"overflow-hidden\": overflowMode === \"fade\" && isOverflowing,\n \"max-w-full\": overflowMode === \"fade\", // Limit width for fade mode\n // For overflow modes, allow natural width expansion\n \"w-auto\": overflowMode === \"dropdown\" || overflowMode === \"fade\",\n },\n )}\n >\n {renderTabTriggers(visibleTabs)}\n\n {/* Sliding indicator for underlined variant */}\n {variant === \"underlined\" &&\n indicatorStyle.width > 0 &&\n !isActiveTabInOverflow && (\n <motion.div\n className={cn(\"absolute rounded-full z-10\", {\n // Horizontal positions (top/bottom)\n \"h-0.5 bottom-0\": tabPosition === \"top\",\n \"h-0.5 top-0\": tabPosition === \"bottom\",\n // Vertical positions (left/right)\n \"w-0.5 right-0\": tabPosition === \"left\",\n \"w-0.5 left-0\": tabPosition === \"right\",\n // Colors\n \"bg-primary\": color === \"primary\",\n \"bg-secondary\": color === \"secondary\",\n \"bg-muted-foreground\": color === \"muted\",\n \"bg-accent\": color === \"accent\",\n \"bg-destructive\": color === \"destructive\",\n \"bg-success\": color === \"success\",\n \"bg-warning\": color === \"warning\",\n })}\n animate={\n isVertical\n ? {\n top: indicatorStyle.top,\n height: indicatorStyle.height,\n }\n : {\n left: indicatorStyle.left,\n width: indicatorStyle.width,\n }\n }\n transition={{\n type: \"spring\",\n stiffness: 300,\n damping: 30,\n }}\n />\n )}\n\n {/* Sliding indicator for solid, bordered, pills variants */}\n {(variant === \"solid\" ||\n variant === \"bordered\" ||\n variant === \"pills\" ||\n variant === \"pill-stroke\") &&\n indicatorStyle.width > 0 &&\n !isActiveTabInOverflow && (\n <motion.div\n className={cn(\"absolute rounded-md pointer-events-none z-0\", {\n \"bg-background shadow-sm\": variant === \"solid\",\n\n \"bg-primary\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"primary\",\n \"bg-secondary\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"secondary\",\n \"bg-muted\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"muted\",\n \"bg-accent\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"accent\",\n \"bg-destructive\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"destructive\",\n \"bg-success\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"success\",\n \"bg-warning\":\n (variant === \"bordered\" || variant === \"pills\") &&\n color === \"warning\",\n\n \"border rounded-full border-primary\":\n variant === \"pill-stroke\" && color === \"primary\",\n \"border rounded-full border-secondary\":\n variant === \"pill-stroke\" && color === \"secondary\",\n \"rounded-full border-muted\":\n variant === \"pill-stroke\" && color === \"muted\",\n \"border rounded-full border-accent\":\n variant === \"pill-stroke\" && color === \"accent\",\n \"border rounded-full border-destructive\":\n variant === \"pill-stroke\" && color === \"destructive\",\n \"border rounded-full border-success\":\n variant === \"pill-stroke\" && color === \"success\",\n \"border rounded-full border-warning\":\n variant === \"pill-stroke\" && color === \"warning\",\n })}\n animate={{\n left: indicatorStyle.left,\n width: indicatorStyle.width,\n top: indicatorStyle.top,\n height: indicatorStyle.height,\n }}\n transition={{\n type: \"spring\",\n stiffness: 300,\n damping: 30,\n }}\n />\n )}\n </STabsList>\n );\n\n // Mode 1: Scroll - wrap in ScrollArea with ScrollBar\n if (overflowMode === \"scroll\") {\n return (\n <ScrollArea\n ref={scrollAreaRef}\n className={cn({\n \"w-full\": !isVertical,\n \"pb-2\": !isVertical && isOverflowing,\n \"max-h-[300px] *:data-radix-scroll-area-viewport:h-full *:data-radix-scroll-area-viewport:max-h-[inherit]\":\n isVertical,\n })}\n >\n {tabsListContent}\n <ScrollBar orientation={isVertical ? \"vertical\" : \"horizontal\"} />\n </ScrollArea>\n );\n }\n\n // Mode 2: Dropdown - show visible tabs + [...] button for overflow tabs\n if (overflowMode === \"dropdown\" && showDropdownButton) {\n return (\n <div\n className={cn(\"relative flex items-start gap-1\", {\n \"flex-col\": isVertical,\n })}\n >\n {/* Show only visible tabs */}\n {tabsListContent}\n\n {/* Overflow menu button - only show if there are hidden tabs */}\n <Popover\n open={dropdownOpen}\n onOpenChange={setDropdownOpen}\n trigger={\n <button\n className={cn(\n \"inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"hover:bg-accent hover:text-accent-foreground\",\n \"h-9 px-3 shrink-0\",\n {\n \"bg-accent text-accent-foreground\": dropdownOpen,\n },\n )}\n aria-label=\"More tabs\"\n >\n <MoreHorizontal className=\"h-4 w-4\" />\n </button>\n }\n content={\n <div className={cn(\"flex flex-col gap-1 p-1\")}>\n {overflowTabs.map((item) => (\n <button\n key={item.key}\n onClick={() => {\n handleValueChange(item.key);\n setDropdownOpen(false);\n }}\n disabled={item.disabled}\n className={cn(\n \"flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm\",\n \"hover:bg-accent hover:text-accent-foreground\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"text-left\",\n {\n \"bg-accent text-accent-foreground\":\n item.key === currentActiveKey,\n },\n )}\n >\n {item.icon && (\n <span className=\"inline-flex items-center\">\n {item.icon}\n </span>\n )}\n {item.label}\n </button>\n ))}\n </div>\n }\n side={isVertical ? \"right\" : \"bottom\"}\n align=\"end\"\n className=\"w-auto min-w-32 max-w-sm max-h-96 overflow-auto p-0\"\n />\n </div>\n );\n }\n\n // Mode 3: Fade with overflow button\n if (overflowMode === \"fade\" && isOverflowing) {\n return (\n <div\n className={cn(\"relative flex items-start gap-1\", {\n \"flex-col\": isVertical,\n \"flex-1 w-full\": true, // Take full width for fade mode\n })}\n >\n {/* Fade effect for mode 3 */}\n <div\n className={cn(\"relative flex-1 overflow-hidden\", {\n \"w-full\": !isVertical,\n \"h-full\": isVertical,\n })}\n >\n <ScrollArea\n ref={scrollAreaRef}\n className={cn({\n \"w-full\": !isVertical,\n \"h-full\": isVertical,\n })}\n >\n {tabsListContent}\n <ScrollBar orientation={isVertical ? \"vertical\" : \"horizontal\"} />\n </ScrollArea>\n\n {/* Start gradient overlay (left/top) - only show when scrolled */}\n {showStartFade && (\n <div\n className={cn(\"absolute pointer-events-none z-20\", {\n \"top-0 left-0 bottom-0 w-24 bg-linear-to-r from-background to-transparent\":\n !isVertical,\n \"left-0 right-0 top-0 h-24 bg-linear-to-b from-background to-transparent\":\n isVertical,\n })}\n />\n )}\n\n {/* End gradient overlay (right/bottom) - only show when not at end */}\n {showEndFade && (\n <div\n className={cn(\"absolute pointer-events-none z-20\", {\n \"top-0 right-0 bottom-0 w-24 bg-linear-to-l from-background to-transparent\":\n !isVertical,\n \"left-0 right-0 bottom-0 h-24 bg-linear-to-t from-background to-transparent\":\n isVertical,\n })}\n />\n )}\n </div>\n\n {/* Overflow menu button - shows all tabs */}\n <Popover\n open={dropdownOpen}\n onOpenChange={setDropdownOpen}\n trigger={\n <button\n className={cn(\n \"inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"hover:bg-accent hover:text-accent-foreground\",\n \"h-9 px-3 shrink-0\",\n {\n \"bg-accent text-accent-foreground\": dropdownOpen,\n },\n )}\n aria-label=\"More tabs\"\n >\n <MoreHorizontal className=\"h-4 w-4\" />\n </button>\n }\n content={\n // <div className={cn(\"flex flex-col gap-1 min-w-[150px]\")}>\n <ScrollArea\n className=\"min-w-[150px] max-h-[256px] [&_[data-radix-scroll-area-viewport]]:max-h-[256px]\"\n snapType=\"y\"\n >\n {items.map((item) => (\n <button\n key={item.key}\n onClick={() => {\n handleValueChange(item.key);\n setDropdownOpen(false);\n }}\n disabled={item.disabled}\n className={cn(\n \"snap-start\",\n \"w-full flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm\",\n \"hover:bg-accent hover:text-accent-foreground\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"text-left\",\n {\n \"bg-accent text-accent-foreground\":\n item.key === currentActiveKey,\n },\n )}\n >\n {item.icon && (\n <span className=\"inline-flex items-center\">\n {item.icon}\n </span>\n )}\n {item.label}\n </button>\n ))}\n </ScrollArea>\n // </div>\n }\n side={isVertical ? \"right\" : \"bottom\"}\n align=\"end\"\n />\n </div>\n );\n }\n\n return tabsListContent;\n };\n\n return (\n <STabs\n ref={ref}\n defaultValue={defaultActiveKey}\n value={currentActiveKey}\n onValueChange={handleValueChange}\n orientation={orientation}\n className={cn(\"gap-2\", positionClasses[tabPosition].root, className)}\n >\n <div\n ref={containerRef}\n className={cn(\"flex\", {\n [alignmentClasses[alignment].horizontal]: !isVertical,\n [alignmentClasses[alignment].vertical]: isVertical,\n \"w-full\":\n (fullWidth ||\n overflowMode === \"dropdown\" ||\n overflowMode === \"fade\") &&\n !isVertical,\n \"overflow-hidden\":\n overflowMode === \"dropdown\" || overflowMode === \"fade\",\n })}\n >\n {renderTabsList()}\n </div>\n {items.map((item) => (\n <STabsContent\n key={item.key}\n value={item.key}\n className={cn(tabContentClassName)}\n >\n {item.children}\n </STabsContent>\n ))}\n </STabs>\n );\n});\n\nTabs.displayName = \"Tabs\";\n\nexport default Tabs;\n"],"names":["Tabs","React","props","ref","items","defaultActiveKey","activeKey","onChange","tabPosition","size","alignment","fullWidth","overflowMode","variant","color","className","tabListClassName","tabContentClassName","tabTriggerClassName","tabRefs","tabsListRef","containerRef","scrollAreaRef","indicatorStyle","setIndicatorStyle","internalActiveKey","setInternalActiveKey","isOverflowing","setIsOverflowing","visibleTabsCount","setVisibleTabsCount","dropdownOpen","setDropdownOpen","showStartFade","setShowStartFade","showEndFade","setShowEndFade","currentActiveKey","isVertical","checkOverflow","container","listElement","containerSize","hasOverflow","resizeObserver","calculateVisibleTabs","totalSize","dropdownButtonSize","listPadding","gap","count","i","tab","tabSize","withGap","hasMoreTabs","hasHiddenTabs","activeIndex","activeTabElement","listRect","tabRect","left","top","scrollAreaViewport","viewportRect","tabRectInViewport","fadeWidth","scrollTop","scrollHeight","viewportHeight","tabTop","tabHeight","targetScrollTop","maxScroll","clampedScroll","scrollLeft","scrollWidth","viewportWidth","tabLeft","tabWidth","targetScrollLeft","rafId","handleScroll","clientHeight","clientWidth","handleValueChange","key","orientation","variantConfig","variantClasses","listVariantClass","triggerVariantClass","getUnderlinedTriggerClasses","getEnclosedTriggerClasses","getEnclosedFillTriggerClasses","triggerColorClass","getColorClasses","listBorderClass","getListBorderClasses","visibleTabs","overflowTabs","showDropdownButton","isActiveTabInOverflow","renderTabTriggers","tabItems","startIndex","item","index","actualIndex","jsxs","STabsTrigger","el","cn","jsx","renderTabsList","tabsListContent","STabsList","positionClasses","sizeClasses","motion","ScrollArea","ScrollBar","Popover","MoreHorizontal","STabs","alignmentClasses","STabsContent"],"mappings":"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"}

package/dist/cjs/components/Tabs/classes.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@dsui/ui/index"),s={sm:{horizontal:"text-xs h-7 [&>button]:px-2",vertical:"text-xs [&>button]:py-0.5"},md:{horizontal:"text-sm h-9 [&>button]:px-3",vertical:"text-sm [&>button]:py-1"},lg:{horizontal:"text-base h-11 [&>button]:px-4",vertical:"text-base [&>button]:py-1.5"}},c={start:{horizontal:"justify-start",vertical:"items-start"},center:{horizontal:"justify-center",vertical:"items-center"},end:{horizontal:"justify-end",vertical:"items-end"}},n={top:{root:"flex flex-col",list:"flex-row"},bottom:{root:"flex flex-col-reverse",list:"flex-row"},left:{root:"flex flex-row",list:"flex-col h-fit"},right:{root:"flex flex-row-reverse",list:"flex-col h-fit"}},i=(a,t)=>{const e={primary:{bg:"data-[state=active]:bg-primary dark:data-[state=active]:bg-primary data-[state=active]:text-primary-foreground dark:data-[state=active]:text-primary-foreground",text:"data-[state=active]:text-primary dark:data-[state=active]:text-primary",border:"data-[state=active]:border-primary dark:data-[state=active]:border-primary"},secondary:{bg:"data-[state=active]:bg-secondary dark:data-[state=active]:bg-secondary data-[state=active]:text-secondary-foreground dark:data-[state=active]:text-secondary-foreground",text:"data-[state=active]:text-secondary dark:data-[state=active]:text-secondary",border:"data-[state=active]:border-secondary dark:data-[state=active]:border-secondary"},muted:{bg:"data-[state=active]:bg-muted dark:data-[state=active]:bg-muted data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground",text:"data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground",border:"data-[state=active]:border-border dark:data-[state=active]:border-border"},accent:{bg:"data-[state=active]:bg-accent dark:data-[state=active]:bg-accent data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground",text:"data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground",border:"data-[state=active]:border-accent dark:data-[state=active]:border-accent"},destructive:{bg:"data-[state=active]:bg-destructive dark:data-[state=active]:bg-destructive data-[state=active]:text-destructive-foreground dark:data-[state=active]:text-destructive-foreground",text:"data-[state=active]:text-destructive dark:data-[state=active]:text-destructive",border:"data-[state=active]:border-destructive dark:data-[state=active]:border-destructive"},success:{bg:"data-[state=active]:bg-success dark:data-[state=active]:bg-success data-[state=active]:text-success-foreground dark:data-[state=active]:text-success-foreground",text:"data-[state=active]:text-success dark:data-[state=active]:text-success",border:"data-[state=active]:border-success dark:data-[state=active]:border-success"},warning:{bg:"data-[state=active]:bg-warning dark:data-[state=active]:bg-warning data-[state=active]:text-warning-foreground dark:data-[state=active]:text-warning-foreground",text:"data-[state=active]:text-warning dark:data-[state=active]:text-warning",border:"data-[state=active]:border-warning dark:data-[state=active]:border-warning"}}[t];switch(a){case"bordered":case"pills":return`${e.bg} dark:data-[state=active]:border-transparent`;case"pill-stroke":return"data-[state=active]:bg-transparent dark:data-[state=active]:bg-transparent";case"text":return e.text;case"outline":return e.border;case"underlined":return o.cn(e.border,e.text);case"enclosed":return o.cn(e.border,e.text);case"enclosed-fill":return o.cn(e.border,e.text);default:return""}},b=(a,t,r)=>{if(a==="underlined")return{top:"border-b",bottom:"border-t",left:"border-r",right:"border-l"}[r];if(a==="enclosed"){const e={top:"border-b",bottom:"border-t",left:"border-r",right:"border-l"},d={top:{primary:"border-b-primary",secondary:"border-b-secondary",muted:"border-b-border",accent:"border-b-accent",destructive:"border-b-destructive",success:"border-b-success",warning:"border-b-warning"},bottom:{primary:"border-t-primary",secondary:"border-t-secondary",muted:"border-t-border",accent:"border-t-accent",destructive:"border-t-destructive",success:"border-t-success",warning:"border-t-warning"},left:{primary:"border-r-primary",secondary:"border-r-secondary",muted:"border-r-border",accent:"border-r-accent",destructive:"border-r-destructive",success:"border-r-success",warning:"border-r-warning"},right:{primary:"border-l-primary",secondary:"border-l-secondary",muted:"border-l-border",accent:"border-l-accent",destructive:"border-l-destructive",success:"border-l-success",warning:"border-l-warning"}};return`${e[r]} ${d[r][t]}`}if(a==="enclosed-fill"){const e={top:"border-b",bottom:"border-t",left:"border-r",right:"border-l"},d={top:{primary:"border-b-primary",secondary:"border-b-secondary",muted:"border-b-border",accent:"border-b-accent",destructive:"border-b-destructive",success:"border-b-success",warning:"border-b-warning"},bottom:{primary:"border-t-primary",secondary:"border-t-secondary",muted:"border-t-border",accent:"border-t-accent",destructive:"border-t-destructive",success:"border-t-success",warning:"border-t-warning"},left:{primary:"border-r-primary",secondary:"border-r-secondary",muted:"border-r-border",accent:"border-r-accent",destructive:"border-r-destructive",success:"border-r-success",warning:"border-r-warning"},right:{primary:"border-l-primary",secondary:"border-l-secondary",muted:"border-l-border",accent:"border-l-accent",destructive:"border-l-destructive",success:"border-l-success",warning:"border-l-warning"}};return`${e[r]} ${d[r][t]}`}return""},l=a=>{const t="bg-background dark:bg-background rounded-none border-0 border-transparent data-[state=active]:shadow-none";return{top:`${t} border-b-2 h-full`,bottom:`${t} border-t-2 h-full`,left:`${t} border-r-2 w-full`,right:`${t} border-l-2 w-full`}[a]},g=a=>{const t="bg-background dark:bg-background border border-transparent data-[state=active]:shadow-none rounded-none";return{top:`${t} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,bottom:`${t} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,left:`${t} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,right:`${t} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`}[a]},u=a=>{const t="bg-muted dark:bg-muted border border-transparent data-[state=active]:bg-background dark:data-[state=active]:bg-background data-[state=active]:shadow-none rounded-none";return{top:`${t} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,bottom:`${t} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,left:`${t} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,right:`${t} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`}[a]},v={solid:{list:{horizontal:"bg-muted dark:bg-muted rounded-lg p-[3px]",vertical:"bg-muted dark:bg-muted rounded-lg p-[3px]"},trigger:{horizontal:"",vertical:""}},bordered:{list:{horizontal:"bg-background dark:bg-background border p-1 gap-1 rounded-lg",vertical:"bg-background dark:bg-background border p-1 gap-1 rounded-lg"},trigger:{horizontal:"",vertical:""}},pills:{list:{horizontal:"bg-transparent p-0 gap-1",vertical:"bg-transparent p-0 gap-1"},trigger:{horizontal:"",vertical:""}},"pill-stroke":{list:{horizontal:"bg-transparent p-0 gap-1",vertical:"bg-transparent p-0 gap-1"},trigger:{horizontal:"border border-border rounded-full bg-transparent",vertical:"border border-border rounded-full bg-transparent"}},text:{list:{horizontal:"bg-transparent p-0 gap-1",vertical:"bg-transparent p-0 gap-1"},trigger:{horizontal:"bg-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none",vertical:"bg-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none"}},outline:{list:{horizontal:"bg-transparent p-0 gap-1",vertical:"bg-transparent p-0 gap-1"},trigger:{horizontal:"bg-transparent border border-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none",vertical:"bg-transparent border border-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none"}},underlined:{list:{horizontal:"bg-background dark:bg-background rounded-none p-0",vertical:"bg-background dark:bg-background rounded-none p-0"},trigger:{horizontal:"",vertical:""}},enclosed:{list:{horizontal:"bg-background dark:bg-background justify-start rounded-none p-0",vertical:"bg-background dark:bg-background items-start rounded-none p-0"},trigger:{horizontal:"",vertical:""}},"enclosed-fill":{list:{horizontal:"bg-background dark:bg-background justify-start rounded-none p-0 gap-1",vertical:"bg-background dark:bg-background items-start rounded-none p-0 gap-1"},trigger:{horizontal:"",vertical:""}}};exports.alignmentClasses=c;exports.getColorClasses=i;exports.getEnclosedFillTriggerClasses=u;exports.getEnclosedTriggerClasses=g;exports.getListBorderClasses=b;exports.getUnderlinedTriggerClasses=l;exports.positionClasses=n;exports.sizeClasses=s;exports.variantClasses=v;
2	+ //# sourceMappingURL=classes.cjs.map

package/dist/cjs/components/Tabs/classes.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"classes.cjs","sources":["../../../../src/components/Tabs/classes.ts"],"sourcesContent":["import { cn } from \"@dsui/ui/index\";\nimport type {\n TabAlignment,\n TabColor,\n TabPosition,\n TabSize,\n TabVariant,\n} from \"./types\";\n\nexport const sizeClasses: Record<\n TabSize,\n { horizontal: string; vertical: string }\n> = {\n sm: {\n horizontal: \"text-xs h-7 [&>button]:px-2\",\n vertical: \"text-xs [&>button]:py-0.5\",\n },\n md: {\n horizontal: \"text-sm h-9 [&>button]:px-3\",\n vertical: \"text-sm [&>button]:py-1\",\n },\n lg: {\n horizontal: \"text-base h-11 [&>button]:px-4\",\n vertical: \"text-base [&>button]:py-1.5\",\n },\n};\n\nexport const alignmentClasses: Record<\n TabAlignment,\n { horizontal: string; vertical: string }\n> = {\n start: {\n horizontal: \"justify-start\",\n vertical: \"items-start\",\n },\n center: {\n horizontal: \"justify-center\",\n vertical: \"items-center\",\n },\n end: {\n horizontal: \"justify-end\",\n vertical: \"items-end\",\n },\n};\n\nexport const positionClasses: Record<\n TabPosition,\n { root: string; list: string }\n> = {\n top: {\n root: \"flex flex-col\",\n list: \"flex-row\",\n },\n bottom: {\n root: \"flex flex-col-reverse\",\n list: \"flex-row\",\n },\n left: {\n root: \"flex flex-row\",\n list: \"flex-col h-fit\",\n },\n right: {\n root: \"flex flex-row-reverse\",\n list: \"flex-col h-fit\",\n },\n};\n\n// Color classes for backgrounds, text, and borders\nexport const getColorClasses = (\n variant: TabVariant,\n color: TabColor,\n): string => {\n // Helper to generate color-specific classes based on variant\n const colorMap: Record<\n TabColor,\n { bg: string; text: string; border: string }\n > = {\n primary: {\n bg: \"data-[state=active]:bg-primary dark:data-[state=active]:bg-primary data-[state=active]:text-primary-foreground dark:data-[state=active]:text-primary-foreground\",\n text: \"data-[state=active]:text-primary dark:data-[state=active]:text-primary\",\n border:\n \"data-[state=active]:border-primary dark:data-[state=active]:border-primary\",\n },\n secondary: {\n bg: \"data-[state=active]:bg-secondary dark:data-[state=active]:bg-secondary data-[state=active]:text-secondary-foreground dark:data-[state=active]:text-secondary-foreground\",\n text: \"data-[state=active]:text-secondary dark:data-[state=active]:text-secondary\",\n border:\n \"data-[state=active]:border-secondary dark:data-[state=active]:border-secondary\",\n },\n muted: {\n bg: \"data-[state=active]:bg-muted dark:data-[state=active]:bg-muted data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground\",\n text: \"data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground\",\n border:\n \"data-[state=active]:border-border dark:data-[state=active]:border-border\",\n },\n accent: {\n bg: \"data-[state=active]:bg-accent dark:data-[state=active]:bg-accent data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground\",\n text: \"data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground\",\n border:\n \"data-[state=active]:border-accent dark:data-[state=active]:border-accent\",\n },\n destructive: {\n bg: \"data-[state=active]:bg-destructive dark:data-[state=active]:bg-destructive data-[state=active]:text-destructive-foreground dark:data-[state=active]:text-destructive-foreground\",\n text: \"data-[state=active]:text-destructive dark:data-[state=active]:text-destructive\",\n border:\n \"data-[state=active]:border-destructive dark:data-[state=active]:border-destructive\",\n },\n success: {\n bg: \"data-[state=active]:bg-success dark:data-[state=active]:bg-success data-[state=active]:text-success-foreground dark:data-[state=active]:text-success-foreground\",\n text: \"data-[state=active]:text-success dark:data-[state=active]:text-success\",\n border:\n \"data-[state=active]:border-success dark:data-[state=active]:border-success\",\n },\n warning: {\n bg: \"data-[state=active]:bg-warning dark:data-[state=active]:bg-warning data-[state=active]:text-warning-foreground dark:data-[state=active]:text-warning-foreground\",\n text: \"data-[state=active]:text-warning dark:data-[state=active]:text-warning\",\n border:\n \"data-[state=active]:border-warning dark:data-[state=active]:border-warning\",\n },\n };\n\n const colors = colorMap[color];\n\n switch (variant) {\n case \"bordered\":\n case \"pills\":\n // Background color on active state\n return `${colors.bg} dark:data-[state=active]:border-transparent`;\n case \"pill-stroke\":\n // Border color on active state, no background\n return `data-[state=active]:bg-transparent dark:data-[state=active]:bg-transparent`;\n case \"text\":\n // Text color only on active state\n return colors.text;\n case \"outline\":\n // Border color on active state\n return colors.border;\n case \"underlined\":\n // Bottom/side border color on active state\n return cn(colors.border, colors.text);\n case \"enclosed\":\n // Border color on active state (except bottom/side)\n return cn(colors.border, colors.text);\n case \"enclosed-fill\":\n // Border color on active state (except bottom/side)\n return cn(colors.border, colors.text);\n default:\n return \"\";\n }\n};\n\n// Get TabsList border classes based on position\nexport const getListBorderClasses = (\n variant: TabVariant,\n color: TabColor,\n tabPosition: TabPosition,\n): string => {\n if (variant === \"underlined\") {\n // Underlined variant: border on the opposite side from where tabs connect\n const borderMap: Record<TabPosition, string> = {\n top: \"border-b\",\n bottom: \"border-t\",\n left: \"border-r\",\n right: \"border-l\",\n };\n return borderMap[tabPosition];\n }\n\n if (variant === \"enclosed\") {\n // Enclosed variant: colored border on the opposite side\n const borderBaseMap: Record<TabPosition, string> = {\n top: \"border-b\",\n bottom: \"border-t\",\n left: \"border-r\",\n right: \"border-l\",\n };\n\n const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n top: {\n primary: \"border-b-primary\",\n secondary: \"border-b-secondary\",\n muted: \"border-b-border\",\n accent: \"border-b-accent\",\n destructive: \"border-b-destructive\",\n success: \"border-b-success\",\n warning: \"border-b-warning\",\n },\n bottom: {\n primary: \"border-t-primary\",\n secondary: \"border-t-secondary\",\n muted: \"border-t-border\",\n accent: \"border-t-accent\",\n destructive: \"border-t-destructive\",\n success: \"border-t-success\",\n warning: \"border-t-warning\",\n },\n left: {\n primary: \"border-r-primary\",\n secondary: \"border-r-secondary\",\n muted: \"border-r-border\",\n accent: \"border-r-accent\",\n destructive: \"border-r-destructive\",\n success: \"border-r-success\",\n warning: \"border-r-warning\",\n },\n right: {\n primary: \"border-l-primary\",\n secondary: \"border-l-secondary\",\n muted: \"border-l-border\",\n accent: \"border-l-accent\",\n destructive: \"border-l-destructive\",\n success: \"border-l-success\",\n warning: \"border-l-warning\",\n },\n };\n return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n }\n\n if (variant === \"enclosed-fill\") {\n // Enclosed-fill variant: colored border on the opposite side\n const borderBaseMap: Record<TabPosition, string> = {\n top: \"border-b\",\n bottom: \"border-t\",\n left: \"border-r\",\n right: \"border-l\",\n };\n\n const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n top: {\n primary: \"border-b-primary\",\n secondary: \"border-b-secondary\",\n muted: \"border-b-border\",\n accent: \"border-b-accent\",\n destructive: \"border-b-destructive\",\n success: \"border-b-success\",\n warning: \"border-b-warning\",\n },\n bottom: {\n primary: \"border-t-primary\",\n secondary: \"border-t-secondary\",\n muted: \"border-t-border\",\n accent: \"border-t-accent\",\n destructive: \"border-t-destructive\",\n success: \"border-t-success\",\n warning: \"border-t-warning\",\n },\n left: {\n primary: \"border-r-primary\",\n secondary: \"border-r-secondary\",\n muted: \"border-r-border\",\n accent: \"border-r-accent\",\n destructive: \"border-r-destructive\",\n success: \"border-r-success\",\n warning: \"border-r-warning\",\n },\n right: {\n primary: \"border-l-primary\",\n secondary: \"border-l-secondary\",\n muted: \"border-l-border\",\n accent: \"border-l-accent\",\n destructive: \"border-l-destructive\",\n success: \"border-l-success\",\n warning: \"border-l-warning\",\n },\n };\n return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n }\n\n return \"\";\n};\n\n// Get trigger border classes for underlined variant based on position\nexport const getUnderlinedTriggerClasses = (\n tabPosition: TabPosition,\n): string => {\n const baseClasses =\n \"bg-background dark:bg-background rounded-none border-0 border-transparent data-[state=active]:shadow-none\";\n\n const positionMap: Record<TabPosition, string> = {\n top: `${baseClasses} border-b-2 h-full`,\n bottom: `${baseClasses} border-t-2 h-full`,\n left: `${baseClasses} border-r-2 w-full`,\n right: `${baseClasses} border-l-2 w-full`,\n };\n\n return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed variant based on position\nexport const getEnclosedTriggerClasses = (tabPosition: TabPosition): string => {\n const baseClasses =\n \"bg-background dark:bg-background border border-transparent data-[state=active]:shadow-none rounded-none\";\n\n const positionMap: Record<TabPosition, string> = {\n top: `${baseClasses} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,\n bottom: `${baseClasses} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,\n left: `${baseClasses} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,\n right: `${baseClasses} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`,\n };\n\n return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed-fill variant based on position\nexport const getEnclosedFillTriggerClasses = (\n tabPosition: TabPosition,\n): string => {\n const baseClasses =\n \"bg-muted dark:bg-muted border border-transparent data-[state=active]:bg-background dark:data-[state=active]:bg-background data-[state=active]:shadow-none rounded-none\";\n\n const positionMap: Record<TabPosition, string> = {\n top: `${baseClasses} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,\n bottom: `${baseClasses} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,\n left: `${baseClasses} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,\n right: `${baseClasses} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`,\n };\n\n return positionMap[tabPosition];\n};\n\nexport const variantClasses: Record<\n TabVariant,\n {\n list: { horizontal: string; vertical: string };\n trigger: { horizontal: string; vertical: string };\n }\n> = {\n // Solid: Default style (muted background, active has white background)\n solid: {\n list: {\n horizontal: \"bg-muted dark:bg-muted rounded-lg p-[3px]\",\n vertical: \"bg-muted dark:bg-muted rounded-lg p-[3px]\",\n },\n trigger: {\n horizontal: \"\",\n vertical: \"\",\n },\n },\n\n // Bordered: With border on group and colored active background\n bordered: {\n list: {\n horizontal:\n \"bg-background dark:bg-background border p-1 gap-1 rounded-lg\",\n vertical: \"bg-background dark:bg-background border p-1 gap-1 rounded-lg\",\n },\n trigger: {\n horizontal: \"\",\n vertical: \"\",\n },\n },\n\n // Pills: No border/background on group, colored background on active button\n pills: {\n list: {\n horizontal: \"bg-transparent p-0 gap-1\",\n vertical: \"bg-transparent p-0 gap-1\",\n },\n trigger: {\n horizontal: \"\",\n vertical: \"\",\n },\n },\n\n // Pill-stroke: Pill-style with stroke border, stronger border radius, no background on active\n \"pill-stroke\": {\n list: {\n horizontal: \"bg-transparent p-0 gap-1\",\n vertical: \"bg-transparent p-0 gap-1\",\n },\n trigger: {\n horizontal: \"border border-border rounded-full bg-transparent\",\n vertical: \"border border-border rounded-full bg-transparent\",\n },\n },\n\n // Text: No border/background on group, colored text on active button\n text: {\n list: {\n horizontal: \"bg-transparent p-0 gap-1\",\n vertical: \"bg-transparent p-0 gap-1\",\n },\n trigger: {\n horizontal:\n \"bg-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none\",\n vertical:\n \"bg-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none\",\n },\n },\n\n // Outline: No border/background on group, colored border (stroke) on active button\n outline: {\n list: {\n horizontal: \"bg-transparent p-0 gap-1\",\n vertical: \"bg-transparent p-0 gap-1\",\n },\n trigger: {\n horizontal:\n \"bg-transparent border border-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none\",\n vertical:\n \"bg-transparent border border-transparent data-[state=active]:bg-transparent data-[state=active]:shadow-none\",\n },\n },\n\n // Underlined: Bottom border on group, bottom border on active tab\n underlined: {\n list: {\n horizontal: \"bg-background dark:bg-background rounded-none p-0\",\n vertical: \"bg-background dark:bg-background rounded-none p-0\",\n },\n trigger: {\n horizontal: \"\", // Will be set dynamically\n vertical: \"\", // Will be set dynamically\n },\n },\n\n // Enclosed: Border on active tab except bottom border (tab style)\n enclosed: {\n list: {\n horizontal:\n \"bg-background dark:bg-background justify-start rounded-none p-0\",\n vertical: \"bg-background dark:bg-background items-start rounded-none p-0\",\n },\n trigger: {\n horizontal: \"\", // Will be set dynamically\n vertical: \"\", // Will be set dynamically\n },\n },\n\n // Enclosed-fill: Border on active tab except bottom border with background on inactive tabs\n \"enclosed-fill\": {\n list: {\n horizontal:\n \"bg-background dark:bg-background justify-start rounded-none p-0 gap-1\",\n vertical:\n \"bg-background dark:bg-background items-start rounded-none p-0 gap-1\",\n },\n trigger: {\n horizontal: \"\", // Will be set dynamically\n vertical: \"\", // Will be set dynamically\n },\n },\n};\n"],"names":["sizeClasses","alignmentClasses","positionClasses","getColorClasses","variant","color","colors","cn","getListBorderClasses","tabPosition","borderBaseMap","colorBorderMap","getUnderlinedTriggerClasses","baseClasses","getEnclosedTriggerClasses","getEnclosedFillTriggerClasses","variantClasses"],"mappings":"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"}

package/dist/cjs/components/Textarea/Textarea.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),C=require("@dsui/ui/components/textarea"),u=require("@dsui/ui/lib/utils"),b=require("lucide-react"),S=require("../Tooltip/Tooltip.cjs"),T=require("../FloatLabel.cjs"),p=l.forwardRef(({className:N,label:d,helperText:i,state:o,size:t="normal",isFloatLabel:r,maxLength:a,showCharCount:g,infoTooltip:x,clearable:h,onClear:v,placeholder:y=" ",...n},q)=>{const[f,j]=l.useState(()=>typeof n.value=="string"?n.value.length:typeof n.defaultValue=="string"?n.defaultValue.length:0),w=c=>{j(c.target.value.length),n.onChange&&n.onChange(c)},m=l.useId(),s=l.useRef(null);l.useImperativeHandle(q,()=>s.current);const I=()=>{if(s.current){s.current.value="",j(0);const c=new Event("input",{bubbles:!0});s.current.dispatchEvent(c),v&&v()}},R={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"};return e.jsx("div",{className:N,children:e.jsxs("div",{className:u.cn("flex flex-col gap-1.5 relative",{"floating-label":r}),children:[!r&&d&&e.jsxs("label",{htmlFor:m,className:"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",children:[d,x&&e.jsx(S.Tooltip,{content:x,children:e.jsx(b.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative",children:[e.jsx(C.Textarea,{ref:s,id:m,className:u.cn("peer resize-y",{"pt-6 pb-2":r&&(t==="lg"\|\|t==="xl"),"pt-6 pb-1":r&&t!=="lg"&&t!=="xl","text-lg":(t==="xl"\|\|t==="lg")&&!r},h&&f>0&&"pr-10"),placeholder:y,maxLength:a,onChange:w,state:o,size:r?t==="xl"\|\|t==="lg"?t:"xl":t,...n}),r&&e.jsx(T.FloatingLabel,{htmlFor:m,size:t,infoTooltip:x,className:"peer-placeholder-shown:items-start",children:d}),h&&f>0&&e.jsx("button",{type:"button",tabIndex:-1,className:u.cn("absolute top-2 right-2 p-1 rounded hover:bg-accent transition-colors"),onClick:I,disabled:n.disabled,children:e.jsx(b.X,{className:"size-4"})})]}),(i\|\|g&&typeof a=="number")&&e.jsxs("div",{className:"flex items-center justify-between text-xs gap-2",children:[i&&e.jsx("p",{className:u.cn("text-xs",o?R?.[o]:""),children:i}),g&&typeof a=="number"&&e.jsxs("span",{className:"ml-auto text-muted-foreground",children:[f," / ",a]})]})]})})});p.displayName="Textarea";exports.default=p;
2	+ //# sourceMappingURL=Textarea.cjs.map

package/dist/cjs/components/Textarea/Textarea.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Textarea.cjs","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n Textarea as STextarea,\n type TextareaProps as STextareaProps,\n} from \"@dsui/ui/components/textarea\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { Info, X } from \"lucide-react\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\n\nexport type TextareaProps = STextareaProps & {\n label?: string;\n helperText?: React.ReactNode;\n isFloatLabel?: boolean;\n maxLength?: number;\n showCharCount?: boolean;\n infoTooltip?: React.ReactNode;\n clearable?: boolean;\n onClear?: () => void;\n size?: \"xs\" | \"sm\" | \"normal\" | \"lg\" | \"xl\";\n state?: \"default\" | \"success\" | \"warning\" | \"error\";\n};\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (\n {\n className,\n label,\n helperText,\n state,\n size = \"normal\",\n isFloatLabel,\n maxLength,\n showCharCount,\n infoTooltip,\n clearable,\n onClear,\n placeholder = \" \",\n ...props\n },\n ref,\n ) => {\n // Character count state\n const [charCount, setCharCount] = React.useState(() => {\n if (typeof props.value === \"string\") return props.value.length;\n if (typeof props.defaultValue === \"string\")\n return props.defaultValue.length;\n return 0;\n });\n\n const handleInput = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setCharCount(e.target.value.length);\n if (props.onChange) props.onChange(e);\n };\n\n const textareaId = React.useId();\n const innerRef = React.useRef<HTMLTextAreaElement>(null);\n\n // Combine refs\n React.useImperativeHandle(ref, () => innerRef.current!);\n\n const handleClear = () => {\n if (innerRef.current) {\n innerRef.current.value = \"\";\n setCharCount(0);\n const event = new Event(\"input\", { bubbles: true });\n innerRef.current.dispatchEvent(event);\n if (onClear) onClear();\n }\n };\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 return (\n <div className={className}>\n <div\n className={cn(\"flex flex-col gap-1.5 relative\", {\n \"floating-label\": isFloatLabel,\n })}\n >\n {!isFloatLabel && label && (\n <label\n htmlFor={textareaId}\n className=\"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n >\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\">\n <STextarea\n ref={innerRef}\n id={textareaId}\n className={cn(\n \"peer resize-y\",\n {\n \"pt-6 pb-2\": isFloatLabel && (size === \"lg\" || size === \"xl\"),\n \"pt-6 pb-1\": isFloatLabel && size !== \"lg\" && size !== \"xl\",\n \"text-lg\": (size === \"xl\" || size === \"lg\") && !isFloatLabel,\n },\n clearable && charCount > 0 && \"pr-10\",\n // className\n )}\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={handleInput}\n state={state}\n size={\n isFloatLabel\n ? size === \"xl\" || size === \"lg\"\n ? size\n : \"xl\"\n : size\n }\n {...props}\n />\n {isFloatLabel && (\n <FloatingLabel\n htmlFor={textareaId}\n size={size}\n infoTooltip={infoTooltip}\n className=\"peer-placeholder-shown:items-start\"\n >\n {label}\n </FloatingLabel>\n )}\n\n {/* Clear Button */}\n {clearable && charCount > 0 && (\n <button\n type=\"button\"\n tabIndex={-1}\n className={cn(\n \"absolute top-2 right-2 p-1 rounded hover:bg-accent transition-colors\",\n )}\n onClick={handleClear}\n disabled={props.disabled}\n >\n <X className=\"size-4\" />\n </button>\n )}\n </div>\n\n {(helperText || (showCharCount && typeof maxLength === \"number\")) && (\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 {showCharCount && typeof maxLength === \"number\" && (\n <span className=\"ml-auto text-muted-foreground\">\n {charCount} / {maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n </div>\n );\n },\n);\n\nTextarea.displayName = \"Textarea\";\nexport default Textarea;\n"],"names":["Textarea","React","className","label","helperText","state","size","isFloatLabel","maxLength","showCharCount","infoTooltip","clearable","onClear","placeholder","props","ref","charCount","setCharCount","handleInput","e","textareaId","innerRef","handleClear","event","helperTextStyles","jsx","jsxs","cn","Tooltip","Info","STextarea","FloatingLabel","X"],"mappings":"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"}

package/dist/cjs/components/TimeGridView.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),d=require("react"),O=require("@dsui/ui/index"),S=require("./Button/Button.cjs");function $(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(o,n,s.get?s:{enumerable:!0,get:()=>e[n]})}}return o.default=e,Object.freeze(o)}const h=$(d),a=e=>String(e).padStart(2,"0"),q=(e="primary")=>({primary:{bg:"bg-primary",text:"text-primary-foreground"},secondary:{bg:"bg-secondary",text:"text-secondary-foreground"},accent:{bg:"bg-accent",text:"text-accent-foreground"},destructive:{bg:"bg-destructive",text:"text-destructive-foreground"},muted:{bg:"bg-muted",text:"text-muted-foreground"},success:{bg:"bg-success",text:"text-success-foreground"},error:{bg:"bg-error",text:"text-error-foreground"},warning:{bg:"bg-warning",text:"text-warning-foreground"},foreground:{bg:"bg-foreground",text:"text-background"}})[e],f=d.memo(h.forwardRef(({HOURS:e,MINUTES:o,hours:n,minutes:s,disabled:b,isTimeDisabled:u,onTimeSelect:x,color:m="primary"},p)=>{const y=d.useMemo(()=>{const t=[];for(const r of e)for(const c of o)t.push({h:r,m:c,display:`${a(r)}:${a(c)}`});return t},[e,o]),v=n!==void 0&&s!==void 0?`${a(n)}:${a(s)}`:"",j=(t,r)=>{u(t,r,0)\|\|x(t,r)};return i.jsx("div",{className:"flex flex-col gap-2",children:i.jsx("div",{ref:p,className:"flex flex-col gap-1 h-64 overflow-y-auto p-2 rounded-md",children:y.map(({h:t,m:r,display:c})=>{const w=u(t,r,0),g=c===v,l=q(m);return i.jsx(S.default,{type:"button",variant:"outline",onClick:()=>j(t,r),"data-selected":g\|\|void 0,disabled:b\|\|w,size:"sm",className:O.cn(g?`${l.bg} ${l.text} font-semibold`:"text-foreground"),children:c},c)})})})}));f.displayName="TimeGridView";exports.TimeGridView=f;
2	+ //# sourceMappingURL=TimeGridView.cjs.map

package/dist/cjs/components/TimeGridView.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TimeGridView.cjs","sources":["../../../src/components/TimeGridView.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { memo, useMemo } from \"react\";\nimport { cn } from \"@dsui/ui/index\";\nimport Button from \"./Button/Button\";\nimport type { CalendarColor } from \"./Calendar/Calendar\";\n\nconst pad = (num: number): string => String(num).padStart(2, \"0\");\n\n// Color variants for time grid items\nconst getColorClasses = (color: CalendarColor = \"primary\") => {\n const colorMap = {\n primary: {\n bg: \"bg-primary\",\n text: \"text-primary-foreground\",\n },\n secondary: {\n bg: \"bg-secondary\",\n text: \"text-secondary-foreground\",\n },\n accent: {\n bg: \"bg-accent\",\n text: \"text-accent-foreground\",\n },\n destructive: {\n bg: \"bg-destructive\",\n text: \"text-destructive-foreground\",\n },\n muted: {\n bg: \"bg-muted\",\n text: \"text-muted-foreground\",\n },\n success: {\n bg: \"bg-success\",\n text: \"text-success-foreground\",\n },\n error: {\n bg: \"bg-error\",\n text: \"text-error-foreground\",\n },\n warning: {\n bg: \"bg-warning\",\n text: \"text-warning-foreground\",\n },\n foreground: {\n bg: \"bg-foreground\",\n text: \"text-background\",\n },\n };\n return colorMap[color];\n};\n\ntype TimeGridViewProps = {\n HOURS: number[];\n MINUTES: number[];\n hours: number | undefined;\n minutes: number | undefined;\n disabled: boolean;\n isTimeDisabled: (h: number, m: number, s: number) => boolean;\n onTimeSelect: (h: number, m: number) => void;\n color?: CalendarColor;\n};\n\nexport const TimeGridView = memo(\n React.forwardRef<HTMLDivElement, TimeGridViewProps>(\n (\n {\n HOURS,\n MINUTES,\n hours,\n minutes,\n disabled,\n isTimeDisabled,\n onTimeSelect,\n color = \"primary\",\n },\n ref,\n ) => {\n // Generate all time combinations based on intervals (always HH:mm, never shows seconds)\n const timeOptions = useMemo(() => {\n const options: Array<{ h: number; m: number; display: string }> = [];\n\n for (const h of HOURS) {\n for (const m of MINUTES) {\n options.push({\n h,\n m,\n display: `${pad(h)}:${pad(m)}`,\n });\n }\n }\n\n return options;\n }, [HOURS, MINUTES]);\n\n const currentValue =\n hours !== undefined && minutes !== undefined\n ? `${pad(hours)}:${pad(minutes)}`\n : \"\";\n\n const handleTimeSelect = (h: number, m: number) => {\n // Always set seconds to 0 in grid mode\n if (!isTimeDisabled(h, m, 0)) {\n onTimeSelect(h, m);\n }\n };\n\n return (\n <div className=\"flex flex-col gap-2\">\n <div\n ref={ref}\n className=\"flex flex-col gap-1 h-64 overflow-y-auto p-2 rounded-md\"\n >\n {timeOptions.map(({ h, m, display }) => {\n const itemDisabled = isTimeDisabled(h, m, 0);\n const isSelected = display === currentValue;\n const colorClasses = getColorClasses(color);\n\n return (\n <Button\n key={display}\n type=\"button\"\n variant=\"outline\"\n onClick={() => handleTimeSelect(h, m)}\n data-selected={isSelected || undefined}\n disabled={disabled || itemDisabled}\n size=\"sm\"\n className={cn(\n isSelected\n ? `${colorClasses.bg} ${colorClasses.text} font-semibold`\n : \"text-foreground\",\n )}\n >\n {display}\n </Button>\n );\n })}\n </div>\n </div>\n );\n },\n ),\n);\n\nTimeGridView.displayName = \"TimeGridView\";\n"],"names":["pad","num","getColorClasses","color","TimeGridView","memo","React","HOURS","MINUTES","hours","minutes","disabled","isTimeDisabled","onTimeSelect","ref","timeOptions","useMemo","options","h","m","currentValue","handleTimeSelect","jsx","display","itemDisabled","isSelected","colorClasses","Button","cn"],"mappings":"+dAMMA,EAAOC,GAAwB,OAAOA,CAAG,EAAE,SAAS,EAAG,GAAG,EAG1DC,EAAkB,CAACC,EAAuB,aAC7B,CACf,QAAS,CACP,GAAI,aACJ,KAAM,yBAAA,EAER,UAAW,CACT,GAAI,eACJ,KAAM,2BAAA,EAER,OAAQ,CACN,GAAI,YACJ,KAAM,wBAAA,EAER,YAAa,CACX,GAAI,iBACJ,KAAM,6BAAA,EAER,MAAO,CACL,GAAI,WACJ,KAAM,uBAAA,EAER,QAAS,CACP,GAAI,aACJ,KAAM,yBAAA,EAER,MAAO,CACL,GAAI,WACJ,KAAM,uBAAA,EAER,QAAS,CACP,GAAI,aACJ,KAAM,yBAAA,EAER,WAAY,CACV,GAAI,gBACJ,KAAM,iBAAA,CACR,GAEcA,CAAK,EAcVC,EAAeC,EAAAA,KAC1BC,EAAM,WACJ,CACE,CACE,MAAAC,EACA,QAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,eAAAC,EACA,aAAAC,EACA,MAAAV,EAAQ,SAAA,EAEVW,IACG,CAEH,MAAMC,EAAcC,EAAAA,QAAQ,IAAM,CAChC,MAAMC,EAA4D,CAAA,EAElE,UAAWC,KAAKX,EACd,UAAWY,KAAKX,EACdS,EAAQ,KAAK,CACX,EAAAC,EACA,EAAAC,EACA,QAAS,GAAGnB,EAAIkB,CAAC,CAAC,IAAIlB,EAAImB,CAAC,CAAC,EAAA,CAC7B,EAIL,OAAOF,CACT,EAAG,CAACV,EAAOC,CAAO,CAAC,EAEbY,EACJX,IAAU,QAAaC,IAAY,OAC/B,GAAGV,EAAIS,CAAK,CAAC,IAAIT,EAAIU,CAAO,CAAC,GAC7B,GAEAW,EAAmB,CAACH,EAAWC,IAAc,CAE5CP,EAAeM,EAAGC,EAAG,CAAC,GACzBN,EAAaK,EAAGC,CAAC,CAErB,EAEA,OACEG,EAAAA,IAAC,MAAA,CAAI,UAAU,sBACb,SAAAA,EAAAA,IAAC,MAAA,CACC,IAAAR,EACA,UAAU,0DAET,WAAY,IAAI,CAAC,CAAE,EAAAI,EAAG,EAAAC,EAAG,QAAAI,KAAc,CACtC,MAAMC,EAAeZ,EAAeM,EAAGC,EAAG,CAAC,EACrCM,EAAaF,IAAYH,EACzBM,EAAexB,EAAgBC,CAAK,EAE1C,OACEmB,EAAAA,IAACK,EAAAA,QAAA,CAEC,KAAK,SACL,QAAQ,UACR,QAAS,IAAMN,EAAiBH,EAAGC,CAAC,EACpC,gBAAeM,GAAc,OAC7B,SAAUd,GAAYa,EACtB,KAAK,KACL,UAAWI,EAAAA,GACTH,EACI,GAAGC,EAAa,EAAE,IAAIA,EAAa,IAAI,iBACvC,iBAAA,EAGL,SAAAH,CAAA,EAbIA,CAAA,CAgBX,CAAC,CAAA,CAAA,EAEL,CAEJ,CAAA,CAEJ,EAEAnB,EAAa,YAAc"}

package/dist/cjs/components/Toast/Toast.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("sonner"),n=require("lucide-react"),m=require("@dsui/ui/index"),l={default:"bg-neutral-800 text-white border border-neutral-700",success:"bg-success text-white border border-success/20",error:"bg-error text-white border border-error/20",warning:"bg-warning text-black border border-warning/20",info:"bg-info text-foreground",primary:"bg-primary text-primary-foreground border border-primary/20",secondary:"bg-secondary text-secondary-foreground border border-secondary/20"},b={success:t.jsx(n.CheckCircle,{className:"w-4 h-4 shrink-0"}),error:t.jsx(n.XCircle,{className:"w-4 h-4 shrink-0"}),warning:t.jsx(n.AlertTriangle,{className:"w-4 h-4 shrink-0"}),info:t.jsx(n.Info,{className:"w-4 h-4 shrink-0"}),default:null,primary:t.jsx(n.Info,{className:"w-4 h-4 shrink-0"}),secondary:t.jsx(n.Info,{className:"w-4 h-4 shrink-0"})},o=(e,r)=>t.jsxs("div",{className:m.cn("flex items-center gap-2 rounded-md px-3 py-2 shadow-md text-sm font-medium",l[e]),children:[b[e],t.jsx("span",{children:r})]}),f=Object.assign((...e)=>{const[r]=e,a=typeof r=="function"?r():r??"Notification";return s.toast.custom(()=>o("default",a))},{success:(e,r)=>s.toast.custom(()=>o("success",e),r),error:(e,r)=>s.toast.custom(()=>o("error",e),r),warning:(e,r)=>s.toast.custom(()=>o("warning",e),r),info:(e,r)=>s.toast.custom(()=>o("info",e),r),primary:(e,r)=>s.toast.custom(()=>o("primary",e),r),secondary:(e,r)=>s.toast.custom(()=>o("secondary",e),r)});function g({position:e="top-right",richColors:r=!0,closeButton:a=!1,expand:c=!1,visibleToasts:i=3,duration:d=4e3,...u}){return t.jsx(s.Toaster,{...u,position:e,richColors:r,closeButton:a,expand:c,visibleToasts:i,toastOptions:{duration:d,classNames:{toast:"rounded-md shadow-md border-none text-sm font-medium backdrop-blur-sm text-black dark:text-white",description:"text-muted-foreground",actionButton:"bg-white/10"}}})}exports.Toaster=g;exports.toast=f;
2	+ //# sourceMappingURL=Toast.cjs.map

package/dist/cjs/components/Toast/Toast.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Toast.cjs","sources":["../../../../src/components/Toast/Toast.tsx"],"sourcesContent":["import {\n Toaster as SonnerToaster,\n toast as sonnerToast,\n type ToasterProps as SonnerToasterProps,\n} from \"sonner\";\nimport { CheckCircle, XCircle, Info, AlertTriangle } from \"lucide-react\";\nimport { cn } from \"@dsui/ui/index\";\n\nconst variantStyles = {\n default: \"bg-neutral-800 text-white border border-neutral-700\",\n success: \"bg-success text-white border border-success/20\",\n error: \"bg-error text-white border border-error/20\",\n warning: \"bg-warning text-black border border-warning/20\",\n info: \"bg-info text-foreground\",\n primary: \"bg-primary text-primary-foreground border border-primary/20\",\n secondary:\n \"bg-secondary text-secondary-foreground border border-secondary/20\",\n};\n\nconst variantIcons = {\n success: <CheckCircle className=\"w-4 h-4 shrink-0\" />,\n error: <XCircle className=\"w-4 h-4 shrink-0\" />,\n warning: <AlertTriangle className=\"w-4 h-4 shrink-0\" />,\n info: <Info className=\"w-4 h-4 shrink-0\" />,\n default: null,\n primary: <Info className=\"w-4 h-4 shrink-0\" />,\n secondary: <Info className=\"w-4 h-4 shrink-0\" />,\n};\n\ntype Variant = keyof typeof variantStyles;\n\nconst renderToastContent = (variant: Variant, message: React.ReactNode) => (\n <div\n className={cn(\n \"flex items-center gap-2 rounded-md px-3 py-2 shadow-md text-sm font-medium\",\n variantStyles[variant],\n )}\n >\n {variantIcons[variant]}\n <span>{message}</span>\n </div>\n);\n\nconst toast = Object.assign(\n (...args: Parameters<typeof sonnerToast>) => {\n const [message] = args;\n const content =\n typeof message === \"function\" ? message() : (message ?? \"Notification\");\n\n return sonnerToast.custom(() => renderToastContent(\"default\", content));\n },\n {\n success: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) => sonnerToast.custom(() => renderToastContent(\"success\", message), opts),\n\n error: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) => sonnerToast.custom(() => renderToastContent(\"error\", message), opts),\n\n warning: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) => sonnerToast.custom(() => renderToastContent(\"warning\", message), opts),\n\n info: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) => sonnerToast.custom(() => renderToastContent(\"info\", message), opts),\n\n primary: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) => sonnerToast.custom(() => renderToastContent(\"primary\", message), opts),\n\n secondary: (\n message: React.ReactNode,\n opts?: Parameters<typeof sonnerToast>[1],\n ) =>\n sonnerToast.custom(() => renderToastContent(\"secondary\", message), opts),\n },\n);\n\nfunction Toaster({\n position = \"top-right\",\n richColors = true,\n closeButton = false,\n expand = false,\n visibleToasts = 3,\n duration = 4000,\n ...props\n}: SonnerToasterProps) {\n return (\n <SonnerToaster\n {...props}\n position={position}\n richColors={richColors}\n closeButton={closeButton}\n expand={expand}\n visibleToasts={visibleToasts}\n toastOptions={{\n duration: duration,\n classNames: {\n toast:\n \"rounded-md shadow-md border-none text-sm font-medium backdrop-blur-sm text-black dark:text-white\",\n description: \"text-muted-foreground\",\n actionButton: \"bg-white/10\",\n },\n }}\n />\n );\n}\n\nexport { toast, Toaster };\n"],"names":["variantStyles","variantIcons","jsx","CheckCircle","XCircle","AlertTriangle","Info","renderToastContent","variant","message","jsxs","cn","toast","args","content","sonnerToast","opts","Toaster","position","richColors","closeButton","expand","visibleToasts","duration","props","SonnerToaster"],"mappings":"+LAQMA,EAAgB,CACpB,QAAS,sDACT,QAAS,iDACT,MAAO,6CACP,QAAS,iDACT,KAAM,0BACN,QAAS,8DACT,UACE,mEACJ,EAEMC,EAAe,CACnB,QAASC,EAAAA,IAACC,EAAAA,YAAA,CAAY,UAAU,kBAAA,CAAmB,EACnD,MAAOD,EAAAA,IAACE,EAAAA,QAAA,CAAQ,UAAU,kBAAA,CAAmB,EAC7C,QAASF,EAAAA,IAACG,EAAAA,cAAA,CAAc,UAAU,kBAAA,CAAmB,EACrD,KAAMH,EAAAA,IAACI,EAAAA,KAAA,CAAK,UAAU,kBAAA,CAAmB,EACzC,QAAS,KACT,QAASJ,EAAAA,IAACI,EAAAA,KAAA,CAAK,UAAU,kBAAA,CAAmB,EAC5C,UAAWJ,EAAAA,IAACI,EAAAA,KAAA,CAAK,UAAU,kBAAA,CAAmB,CAChD,EAIMC,EAAqB,CAACC,EAAkBC,IAC5CC,EAAAA,KAAC,MAAA,CACC,UAAWC,EAAAA,GACT,6EACAX,EAAcQ,CAAO,CAAA,EAGtB,SAAA,CAAAP,EAAaO,CAAO,EACrBN,EAAAA,IAAC,QAAM,SAAAO,CAAA,CAAQ,CAAA,CAAA,CACjB,EAGIG,EAAQ,OAAO,OACnB,IAAIC,IAAyC,CAC3C,KAAM,CAACJ,CAAO,EAAII,EACZC,EACJ,OAAOL,GAAY,WAAaA,EAAA,EAAaA,GAAW,eAE1D,OAAOM,EAAAA,MAAY,OAAO,IAAMR,EAAmB,UAAWO,CAAO,CAAC,CACxE,EACA,CACE,QAAS,CACPL,EACAO,IACGD,QAAY,OAAO,IAAMR,EAAmB,UAAWE,CAAO,EAAGO,CAAI,EAE1E,MAAO,CACLP,EACAO,IACGD,QAAY,OAAO,IAAMR,EAAmB,QAASE,CAAO,EAAGO,CAAI,EAExE,QAAS,CACPP,EACAO,IACGD,QAAY,OAAO,IAAMR,EAAmB,UAAWE,CAAO,EAAGO,CAAI,EAE1E,KAAM,CACJP,EACAO,IACGD,QAAY,OAAO,IAAMR,EAAmB,OAAQE,CAAO,EAAGO,CAAI,EAEvE,QAAS,CACPP,EACAO,IACGD,QAAY,OAAO,IAAMR,EAAmB,UAAWE,CAAO,EAAGO,CAAI,EAE1E,UAAW,CACTP,EACAO,IAEAD,EAAAA,MAAY,OAAO,IAAMR,EAAmB,YAAaE,CAAO,EAAGO,CAAI,CAAA,CAE7E,EAEA,SAASC,EAAQ,CACf,SAAAC,EAAW,YACX,WAAAC,EAAa,GACb,YAAAC,EAAc,GACd,OAAAC,EAAS,GACT,cAAAC,EAAgB,EAChB,SAAAC,EAAW,IACX,GAAGC,CACL,EAAuB,CACrB,OACEtB,EAAAA,IAACuB,EAAAA,QAAA,CACE,GAAGD,EACJ,SAAAN,EACA,WAAAC,EACA,YAAAC,EACA,OAAAC,EACA,cAAAC,EACA,aAAc,CACZ,SAAAC,EACA,WAAY,CACV,MACE,mGACF,YAAa,wBACb,aAAc,aAAA,CAChB,CACF,CAAA,CAGN"}

package/dist/cjs/components/Toggle/Toggle.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),i=require("react"),g=require("@dsui/ui/components/toggle"),e=i.forwardRef((t,r)=>{const{variant:o="default",size:l="default",color:s,...u}=t;return a.jsx(g.Toggle,{ref:r,...u,variant:o,size:l,color:s})});e.displayName="Toggle";exports.default=e;
2	+ //# sourceMappingURL=Toggle.cjs.map

package/dist/cjs/components/Toggle/Toggle.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Toggle.cjs","sources":["../../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import React from \"react\";\nimport { Toggle as SToggle } from \"@dsui/ui/components/toggle\";\n\nexport type ToggleProps = React.ComponentProps<typeof SToggle>;\n\nconst Toggle = React.forwardRef<HTMLButtonElement, ToggleProps>(\n (props, ref) => {\n const { variant = \"default\", size = \"default\", color, ...rest } = props;\n\n return (\n <SToggle\n ref={ref}\n {...rest}\n variant={variant}\n size={size}\n color={color}\n />\n );\n }\n);\n\nToggle.displayName = \"Toggle\";\nexport default Toggle;\n"],"names":["Toggle","React","props","ref","variant","size","color","rest","jsx","SToggle"],"mappings":"4MAKMA,EAASC,EAAM,WACnB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAE,QAAAC,EAAU,UAAW,KAAAC,EAAO,UAAW,MAAAC,EAAO,GAAGC,GAASL,EAElE,OACEM,EAAAA,IAACC,EAAAA,OAAA,CACC,IAAAN,EACC,GAAGI,EACJ,QAAAH,EACA,KAAAC,EACA,MAAAC,CAAA,CAAA,CAGN,CACF,EAEAN,EAAO,YAAc"}

package/dist/cjs/components/Tooltip/Tooltip.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),i=require("@dsui/ui/components/tooltip"),l=require("@dsui/ui/index"),r=require("motion/react"),O=require("../../utils/animations.cjs");function S(s){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const t in s)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(s,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>s[t]})}}return n.default=s,Object.freeze(n)}const b=S(c),_=b.memo(function({content:n,children:t,sideOffset:o=4,delayDuration:v=0,className:u,childClassName:x,position:h="top",noArrow:y=!1,animation:d,...g}){const f={stiffness:100,damping:5},w=c.useMemo(()=>O.animationClass(d,u),[d,u]),p=c.useMemo(()=>{switch(g.color){case"primary":return"bg-primary text-primary-foreground [&>span>svg]:bg-primary [&>span>svg]:fill-primary";case"secondary":return"bg-secondary text-secondary-foreground [&>span>svg]:bg-secondary [&>span>svg]:fill-secondary";case"dark":return"";case"light":return"bg-neutral-200 text-neutral-950 [&_svg]:bg-neutral-200 [&_svg]:fill-neutral-200";case"inverted":return"dark:bg-white dark:text-black dark:[&_svg]:bg-white dark:[&_svg]:fill-white";case"success":return"bg-success text-success-foreground [&>span>svg]:bg-success [&>span>svg]:fill-success";case"warning":return"bg-warning text-warning-foreground [&>span>svg]:bg-warning [&>span>svg]:fill-warning";case"error":return"bg-error text-error-foreground [&>span>svg]:bg-error [&>span>svg]:fill-error";case"glass":return"bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>span>svg]:bg-white/15 [&>span>svg]:fill-white/15";default:return"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance"}},[g?.color]),a=r.useMotionValue(0),j=r.useSpring(r.useTransform(a,[-100,100],[-45,45]),f),k=r.useSpring(r.useTransform(a,[-100,100],[-50,50]),f),T=c.useCallback(m=>{const C=m.target.offsetWidth/2;a.set(m.nativeEvent.offsetX-C)},[a]),M=b.memo(()=>t?e.jsx("span",{onMouseMove:T,className:l.cn("inline-block",x),children:t}):e.jsx(e.Fragment,{}));return d==="spec"?e.jsxs(r.motion.div,{className:l.cn("relative -me-2.5 inline-block",u),whileHover:"hover",initial:"initial",children:[e.jsx(r.motion.div,{variants:{initial:{opacity:0,y:20,scale:0},hover:{opacity:1,y:-5,scale:1,transition:{type:"tween",duration:.2,ease:"easeOut"}}},style:{translateX:k,rotate:j,whiteSpace:"nowrap"},className:l.cn("absolute -top-2 left-1/2 z-50 flex -translate-x-1/2 -translate-y-full flex-col items-center justify-center rounded-md px-4 py-2 text-xs shadow-xl",p),children:e.jsx("div",{className:"relative z-1",children:n})}),e.jsx(M,{})]}):e.jsx(i.TooltipProvider,{delayDuration:v,children:e.jsxs(i.Tooltip,{children:[e.jsx(i.TooltipTrigger,{asChild:!0,children:t}),e.jsx(i.TooltipContent,{...g,side:h,sideOffset:o,className:l.cn(w?.className,p,{"[&>span>svg]:invisible":y}),children:n})]})})});exports.Tooltip=_;
2	+ //# sourceMappingURL=Tooltip.cjs.map

package/dist/cjs/components/Tooltip/Tooltip.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Tooltip.cjs","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n Tooltip as DsTooltip,\n TooltipTrigger,\n TooltipContent,\n TooltipProvider,\n type TooltipContentProps,\n} from \"@dsui/ui/components/tooltip\";\nimport { cn } from \"@dsui/ui/index\";\nimport { motion, useMotionValue, useSpring, useTransform } from \"motion/react\";\nimport type { BasicAnimation, BasicColor } from \"@/types/variables\";\nimport { useMemo, useCallback } from \"react\";\nimport { animationClass } from \"@/utils/animations\";\n\ntype Color = BasicColor | \"dark\" | \"light\" | \"inverted\";\n\nexport type TooltipProps = TooltipContentProps & {\n content: React.ReactNode;\n children: React.ReactNode;\n sideOffset?: number;\n delayDuration?: number;\n position?: \"top\" | \"right\" | \"bottom\" | \"left\";\n className?: string;\n childClassName?: string;\n noArrow?: boolean;\n animation?: BasicAnimation;\n color?: Color;\n};\n\nexport const Tooltip = React.memo(function Tooltip({\n content,\n children,\n sideOffset = 4,\n delayDuration = 0,\n className,\n childClassName,\n position = \"top\",\n noArrow = false,\n animation,\n ...props\n}: TooltipProps) {\n const springConfig = { stiffness: 100, damping: 5 };\n\n const tooltipAnimation = useMemo<{ className?: string } | null>(() => {\n return animationClass(animation, className);\n }, [animation, className]);\n\n const tooltipColor = useMemo<string>(() => {\n switch (props.color) {\n case \"primary\":\n return \"bg-primary text-primary-foreground [&>span>svg]:bg-primary [&>span>svg]:fill-primary\";\n case \"secondary\":\n return \"bg-secondary text-secondary-foreground [&>span>svg]:bg-secondary [&>span>svg]:fill-secondary\";\n case \"dark\":\n return \"\";\n case \"light\":\n return \"bg-neutral-200 text-neutral-950 [&_svg]:bg-neutral-200 [&_svg]:fill-neutral-200\";\n case \"inverted\":\n return \"dark:bg-white dark:text-black dark:[&_svg]:bg-white dark:[&_svg]:fill-white\";\n case \"success\":\n return \"bg-success text-success-foreground [&>span>svg]:bg-success [&>span>svg]:fill-success\";\n case \"warning\":\n return \"bg-warning text-warning-foreground [&>span>svg]:bg-warning [&>span>svg]:fill-warning\";\n case \"error\":\n return \"bg-error text-error-foreground [&>span>svg]:bg-error [&>span>svg]:fill-error\";\n case \"glass\":\n return \"bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>span>svg]:bg-white/15 [&>span>svg]:fill-white/15\";\n default:\n return \"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance\";\n }\n }, [props?.color]);\n\n // on mouse move\n const x = useMotionValue(0);\n // rotate the tooltip\n const rotate = useSpring(\n useTransform(x, [-100, 100], [-45, 45]),\n springConfig,\n );\n // translate the tooltip\n const translateX = useSpring(\n useTransform(x, [-100, 100], [-50, 50]),\n springConfig,\n );\n\n const handleMouseMove = useCallback(\n (event: React.MouseEvent) => {\n const halfWidth = (event.target as HTMLElement).offsetWidth / 2;\n x.set(event.nativeEvent.offsetX - halfWidth);\n },\n [x],\n );\n\n const ChildComp = React.memo(() => {\n if (!children) return <></>;\n\n return (\n <span\n onMouseMove={handleMouseMove}\n className={cn(\"inline-block\", childClassName)}\n >\n {children}\n </span>\n );\n });\n\n if (animation === \"spec\") {\n return (\n <motion.div\n className={cn(\"relative -me-2.5 inline-block\", className)}\n whileHover=\"hover\"\n initial=\"initial\"\n >\n <motion.div\n variants={{\n initial: { opacity: 0, y: 20, scale: 0 },\n hover: {\n opacity: 1,\n y: -5,\n scale: 1,\n transition: {\n type: \"tween\",\n duration: 0.2,\n ease: \"easeOut\",\n },\n },\n }}\n style={{\n translateX: translateX,\n rotate: rotate,\n whiteSpace: \"nowrap\",\n }}\n className={cn(\n \"absolute -top-2 left-1/2 z-50 flex -translate-x-1/2 -translate-y-full flex-col items-center justify-center rounded-md px-4 py-2 text-xs shadow-xl\",\n tooltipColor,\n )}\n >\n <div className=\"relative z-1\">{content}</div>\n </motion.div>\n\n <ChildComp />\n </motion.div>\n );\n }\n\n return (\n <TooltipProvider delayDuration={delayDuration}>\n <DsTooltip>\n <TooltipTrigger asChild>{children}</TooltipTrigger>\n <TooltipContent\n {...props}\n side={position}\n sideOffset={sideOffset}\n className={cn(tooltipAnimation?.className, tooltipColor, {\n \"[&>span>svg]:invisible\": noArrow,\n })}\n >\n {content}\n </TooltipContent>\n </DsTooltip>\n </TooltipProvider>\n );\n});\n"],"names":["Tooltip","React","content","children","sideOffset","delayDuration","className","childClassName","position","noArrow","animation","props","springConfig","tooltipAnimation","useMemo","animationClass","tooltipColor","x","useMotionValue","rotate","useSpring","useTransform","translateX","handleMouseMove","useCallback","event","halfWidth","ChildComp","jsx","cn","Fragment","jsxs","motion","TooltipProvider","DsTooltip","TooltipTrigger","TooltipContent"],"mappings":"yiBA6BaA,EAAUC,EAAM,KAAK,SAAiB,CACjD,QAAAC,EACA,SAAAC,EACA,WAAAC,EAAa,EACb,cAAAC,EAAgB,EAChB,UAAAC,EACA,eAAAC,EACA,SAAAC,EAAW,MACX,QAAAC,EAAU,GACV,UAAAC,EACA,GAAGC,CACL,EAAiB,CACf,MAAMC,EAAe,CAAE,UAAW,IAAK,QAAS,CAAA,EAE1CC,EAAmBC,EAAAA,QAAuC,IACvDC,EAAAA,eAAeL,EAAWJ,CAAS,EACzC,CAACI,EAAWJ,CAAS,CAAC,EAEnBU,EAAeF,EAAAA,QAAgB,IAAM,CACzC,OAAQH,EAAM,MAAA,CACZ,IAAK,UACH,MAAO,uFACT,IAAK,YACH,MAAO,+FACT,IAAK,OACH,MAAO,GACT,IAAK,QACH,MAAO,kFACT,IAAK,WACH,MAAO,8EACT,IAAK,UACH,MAAO,uFACT,IAAK,UACH,MAAO,uFACT,IAAK,QACH,MAAO,+EACT,IAAK,QACH,MAAO,6GACT,QACE,MAAO,maAAA,CAEb,EAAG,CAACA,GAAO,KAAK,CAAC,EAGXM,EAAIC,EAAAA,eAAe,CAAC,EAEpBC,EAASC,EAAAA,UACbC,EAAAA,aAAaJ,EAAG,CAAC,KAAM,GAAG,EAAG,CAAC,IAAK,EAAE,CAAC,EACtCL,CAAA,EAGIU,EAAaF,EAAAA,UACjBC,EAAAA,aAAaJ,EAAG,CAAC,KAAM,GAAG,EAAG,CAAC,IAAK,EAAE,CAAC,EACtCL,CAAA,EAGIW,EAAkBC,EAAAA,YACrBC,GAA4B,CAC3B,MAAMC,EAAaD,EAAM,OAAuB,YAAc,EAC9DR,EAAE,IAAIQ,EAAM,YAAY,QAAUC,CAAS,CAC7C,EACA,CAACT,CAAC,CAAA,EAGEU,EAAY1B,EAAM,KAAK,IACtBE,EAGHyB,EAAAA,IAAC,OAAA,CACC,YAAaL,EACb,UAAWM,EAAAA,GAAG,eAAgBtB,CAAc,EAE3C,SAAAJ,CAAA,CAAA,EAPiByB,MAAAE,EAAAA,SAAA,CAAA,CAAE,CAUzB,EAED,OAAIpB,IAAc,OAEdqB,EAAAA,KAACC,EAAAA,OAAO,IAAP,CACC,UAAWH,EAAAA,GAAG,gCAAiCvB,CAAS,EACxD,WAAW,QACX,QAAQ,UAER,SAAA,CAAAsB,EAAAA,IAACI,EAAAA,OAAO,IAAP,CACC,SAAU,CACR,QAAS,CAAE,QAAS,EAAG,EAAG,GAAI,MAAO,CAAA,EACrC,MAAO,CACL,QAAS,EACT,EAAG,GACH,MAAO,EACP,WAAY,CACV,KAAM,QACN,SAAU,GACV,KAAM,SAAA,CACR,CACF,EAEF,MAAO,CACL,WAAAV,EACA,OAAAH,EACA,WAAY,QAAA,EAEd,UAAWU,EAAAA,GACT,oJACAb,CAAA,EAGF,SAAAY,EAAAA,IAAC,MAAA,CAAI,UAAU,eAAgB,SAAA1B,CAAA,CAAQ,CAAA,CAAA,QAGxCyB,EAAA,CAAA,CAAU,CAAA,CAAA,CAAA,EAMfC,EAAAA,IAACK,EAAAA,gBAAA,CAAgB,cAAA5B,EACf,SAAA0B,OAACG,EAAAA,QAAA,CACC,SAAA,CAAAN,EAAAA,IAACO,EAAAA,eAAA,CAAe,QAAO,GAAE,SAAAhC,CAAA,CAAS,EAClCyB,EAAAA,IAACQ,EAAAA,eAAA,CACE,GAAGzB,EACJ,KAAMH,EACN,WAAAJ,EACA,UAAWyB,EAAAA,GAAGhB,GAAkB,UAAWG,EAAc,CACvD,yBAA0BP,CAAA,CAC3B,EAEA,SAAAP,CAAA,CAAA,CACH,CAAA,CACF,CAAA,CACF,CAEJ,CAAC"}

package/dist/cjs/components/Tour/Tour.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),C=require("@dsui/ui/index"),H=require("@floating-ui/react-dom"),de=require("lucide-react"),lt=require("react"),at=require("react-dom"),fe=require("../Button/Button.cjs");function be(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const c=be(lt),dt=be(at),pe="Tour",ft="TourPortal",ae="TourStep",pt="TourArrow",mt="TourHeader",gt="TourTitle",ht="TourDescription",vt="TourClose",xt="TourPrev",Et="TourNext",Ct="TourSkip",we="TourFooter",wt="tour.pointerDownOutside",Se="tour.interactOutside",Pe="tour.openAutoFocus",Q="tour.closeAutoFocus",U={bubbles:!1,cancelable:!0},St=0,Pt=16,ye=4,Tt={top:"bottom",right:"left",bottom:"top",left:"right"},X=typeof window>"u"?c.useEffect:c.useLayoutEffect;function G(e){const t=c.useRef(e);return X(()=>{t.current=e}),t}function re(e){const t=c.useRef(null);return t.current===null&&(t.current=e()),t}let ue=0;function Te(){const e=document.createElement("span");return e.setAttribute("data-tour-focus-guard",""),e.tabIndex=0,e.style.outline="none",e.style.opacity="0",e.style.position="fixed",e.style.pointerEvents="none",e}function bt(){c.useEffect(()=>{const e=document.querySelectorAll("[data-tour-focus-guard]");return document.body.insertAdjacentElement("afterbegin",e[0]??Te()),document.body.insertAdjacentElement("beforeend",e[1]??Te()),ue++,()=>{if(ue===1){const t=document.querySelectorAll("[data-tour-focus-guard]");for(const n of t)n.remove()}ue--}},[])}function yt(e,t,n,r,s){const u=c.useRef(null),l=G(r),o=G(s),f=G(n);c.useEffect(()=>{if(!t)return;const i=e.current;if(!i)return;const P=document.activeElement;function N(){if(!i)return[];const a=[],d=document.createTreeWalker(i,NodeFilter.SHOW_ELEMENT,{acceptNode:x=>{const g=x,h=g.tagName==="INPUT"&&g.type==="hidden";return g.hidden\|\|h?NodeFilter.FILTER_SKIP:g.tabIndex>=0?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP}});for(;d.nextNode();)a.push(d.currentNode);return a}function L(){const a=N(),d=a[0],x=a[a.length-1];return[d,x]}function v(a){if(!i)return;const d=a.target;i.contains(d)?u.current=d:(u.current??N()[0])?.focus({preventScroll:!0})}function k(a){if(a.key!=="Tab"\|\|a.altKey\|\|a.ctrlKey\|\|a.metaKey)return;const[d,x]=L();if(!(d&&x)){document.activeElement===i&&a.preventDefault();return}!a.shiftKey&&document.activeElement===x?(a.preventDefault(),d?.focus({preventScroll:!0})):a.shiftKey&&document.activeElement===d&&(a.preventDefault(),x?.focus({preventScroll:!0}))}const T=new CustomEvent(Pe,U);if(l.current&&i.addEventListener(Pe,l.current,{once:!0}),i.dispatchEvent(T),!T.defaultPrevented){const a=N();a.length>0?a[0]?.focus({preventScroll:!0}):i.focus({preventScroll:!0})}return document.addEventListener("focusin",v),i.addEventListener("keydown",k),()=>{document.removeEventListener("focusin",v),i.removeEventListener("keydown",k),f.current\|\|setTimeout(()=>{const a=new CustomEvent(Q,U);o.current&&i.addEventListener(Q,o.current,{once:!0}),i.dispatchEvent(a),a.defaultPrevented\|\|P&&document.body.contains(P)&&P.focus({preventScroll:!0}),o.current&&i.removeEventListener(Q,o.current)},0)}},[e,t,l,o,f])}const Ot=c.createContext(void 0);function Rt(e){const t=c.useContext(Ot);return e??t??"ltr"}function Oe(e){return e?"open":"closed"}function F(e){const t=K("useStore"),n=c.useCallback(()=>e(t.getState()),[t,e]);return c.useSyncExternalStore(t.subscribe,n,n)}function Re(e){return typeof e=="string"?document.querySelector(e):e&&"current"in e?e.current:e instanceof HTMLElement?e:null}function Ae(){return typeof window>"u"?"smooth":window.matchMedia("(prefers-reduced-motion: reduce)").matches?"auto":"smooth"}function At(e,t=Ae(),n){const r={top:100,bottom:100,left:0,right:0,...n},s=e.getBoundingClientRect(),u=window.innerHeight,l=window.innerWidth;if(!(s.top>=r.top&&s.bottom<=u-r.bottom&&s.left>=r.left&&s.right<=l-r.right)){const i=s.top+window.scrollY-r.top;window.scrollTo({top:Math.max(0,i),behavior:t})}}function Ft(e){const[t,n="center"]=e.split("-");return[t,n]}function Nt(e,t){return t==="center"?e:`${e}-${t}`}function le(e,t,n=ye){const r=t.getBoundingClientRect(),s=window.innerWidth,u=window.innerHeight,l=Math.max(0,r.left-n),o=Math.max(0,r.top-n),f=Math.min(s-l,r.width+n2),i=Math.min(u-o,r.height+n2),P=`polygon(0% 0%, 0% 100%, ${l}px 100%, ${l}px ${o}px, ${l+f}px ${o}px, ${l+f}px ${o+i}px, ${l}px ${o+i}px, ${l}px 100%, 100% 100%, 100% 0%)`;e.setState("maskPath",P),e.setState("spotlightRect",{x:l,y:o,width:f,height:i})}const Fe=c.createContext(null);function K(e){const t=c.useContext(Fe);if(!t)throw new Error(`\`${e}\` must be used within \`${pe}\``);return t}const Ne=c.createContext(null);function Z(e){const t=c.useContext(Ne);if(!t)throw new Error(`\`${e}\` must be used within \`${pe}\``);return t}const ke=c.createContext(null);function De(e){const t=c.useContext(ke);if(!t)throw new Error(`\`${e}\` must be used within \`${ae}\``);return t}const Ie=c.createContext(!1),Le=c.createContext(null);function kt(e){const t=c.useContext(Le);if(!t)throw new Error(`\`${e}\` must be used within \`${pe}\``);return t}function Dt(e){c.useEffect(()=>{if(!e)return;const t=window.getComputedStyle(document.body).overflow,n=window.innerWidth-document.documentElement.clientWidth;return document.body.style.overflow="hidden",n>0&&(document.body.style.paddingRight=`${n}px`),()=>{document.body.style.overflow=t,document.body.style.paddingRight=""}},[e])}function _e(e){const{open:t,defaultOpen:n=!1,onOpenChange:r,value:s,defaultValue:u=0,onValueChange:l,onComplete:o,onSkip:f,autoScroll:i=!0,scrollBehavior:P=Ae(),scrollOffset:N,...L}=e,v=re(()=>({open:t??n,value:s??u,steps:[],maskPath:"",spotlightRect:null})),k=re(()=>new Set),T=re(()=>new Map),a=re(()=>({current:0})),d=G({valueProp:s,onOpenChange:r,onValueChange:l,onComplete:o,onSkip:f,autoScroll:i,scrollBehavior:P,scrollOffset:N}),x=c.useMemo(()=>({subscribe:g=>(k.current.add(g),()=>k.current.delete(g)),getState:()=>v.current,setState:(g,h)=>{if(!Object.is(v.current[g],h)){if(v.current[g]=h,g==="open"&&typeof h=="boolean")d.current.onOpenChange?.(h),h?v.current.steps.length>0&&v.current.value>=v.current.steps.length&&x.setState("value",0):v.current.value<(v.current.steps.length\|\|0)-1&&d.current.onSkip?.();else if(g==="value"&&typeof h=="number"){const R=v.current.steps[v.current.value],b=v.current.steps[h];if(R?.onStepLeave?.(),b?.onStepEnter?.(),h>=v.current.steps.length){d.current.onComplete?.(),d.current.valueProp!==void 0&&d.current.onValueChange?.(h),x.setState("open",!1);return}if(d.current.valueProp!==void 0){d.current.onValueChange?.(h);return}if(d.current.onValueChange?.(h),b&&d.current.autoScroll){const q=Re(b.target);q&&At(q,d.current.scrollBehavior,d.current.scrollOffset)}}x.notify()}},notify:()=>{k.current.forEach(g=>{g()})},addStep:g=>{const h=`step-${a.current.current++}`,R=v.current.steps.length;return T.current.set(h,R),v.current.steps=[...v.current.steps,g],x.notify(),{id:h,index:R}},removeStep:g=>{const h=T.current.get(g);if(h!==void 0){v.current.steps=v.current.steps.filter((R,b)=>b!==h),T.current.delete(g);for(const[R,b]of T.current.entries())b>h&&T.current.set(R,b-1);x.notify()}}}),[v,k,T,a,d]);return X(()=>{t!==void 0&&x.setState("open",t)},[t,x]),X(()=>{s!==void 0&&x.setState("value",s)},[s,x]),p.jsx(Fe.Provider,{value:x,children:p.jsx(It,{...L})})}function It(e){const{onEscapeKeyDown:t,onPointerDownOutside:n,onInteractOutside:r,onOpenAutoFocus:s,onCloseAutoFocus:u,dir:l,alignOffset:o=St,sideOffset:f=Pt,spotlightPadding:i=ye,dismissible:P=!0,modal:N=!0,stepFooter:L,asChild:v,...k}=e,T=K("TourRootImpl"),a=Rt(l),[d,x]=c.useState(null),g=c.useRef(null),h=G(t),R=G(u);c.useEffect(()=>{function _(j){if(T.getState().open&&j.key==="Escape"){if(h.current&&(h.current(j),j.defaultPrevented))return;T.setState("open",!1)}}return document.addEventListener("keydown",_),()=>document.removeEventListener("keydown",_)},[T,h]);const b=F(_=>_.open),q=c.useRef(void 0);X(()=>{const _=q.current;b&&!_?g.current=document.activeElement:!b&&_&&setTimeout(()=>{const j=d??document.body,W=new CustomEvent(Q,U);if(R.current&&j.addEventListener(Q,R.current,{once:!0}),j.dispatchEvent(W),!W.defaultPrevented){const V=g.current;V&&document.body.contains(V)&&V.focus({preventScroll:!0})}g.current=null},0),q.current=b},[b,d,R]);const A=c.useMemo(()=>({dir:a,alignOffset:o,sideOffset:f,spotlightPadding:i,dismissible:P,modal:N,stepFooter:L,onPointerDownOutside:n,onInteractOutside:r,onOpenAutoFocus:s,onCloseAutoFocus:u}),[a,o,f,i,P,N,L,n,r,s,u]),Y=c.useMemo(()=>({portal:d,onPortalChange:x}),[d]);Dt(b&&N);const se=v?C.Slot:"div";return p.jsx(Ne.Provider,{value:A,children:p.jsx(Le.Provider,{value:Y,children:p.jsx(se,{"data-slot":"tour",dir:a,...k})})})}function je(e){const{target:t,side:n="bottom",sideOffset:r,align:s="center",alignOffset:u,collisionBoundary:l=[],collisionPadding:o=0,arrowPadding:f=0,sticky:i="partial",hideWhenDetached:P=!1,avoidCollisions:N=!0,required:L=!1,forceMount:v=!1,onStepEnter:k,onStepLeave:T,onPointerDownCapture:a,onFocusCapture:d,onBlurCapture:x,children:g,className:h,style:R,asChild:b,...q}=e,A=K(ae),[Y,se]=c.useState(null),[_,j]=c.useState(null),W=c.useRef(null),V=c.useRef(""),me=c.useRef(-1),ee=c.useRef(!1),J=c.useRef(!1),D=F(m=>m.open),ge=F(m=>m.value),Je=F(m=>m.steps),S=Z(ae),te=r??S.sideOffset,ne=u??S.alignOffset;X(()=>{const{id:m,index:O}=A.addStep({target:t,align:s,alignOffset:ne,side:n,sideOffset:te,collisionBoundary:l,collisionPadding:o,arrowPadding:f,sticky:i,hideWhenDetached:P,avoidCollisions:N,onStepEnter:k,onStepLeave:T,required:L});return V.current=m,me.current=O,()=>{A.removeStep(V.current)}},[t,n,te,s,ne,o,f,i,P,N,L,k,T,A]);const E=Je[ge],w=E?Re(E.target):null,I=me.current===ge,Qe=c.useMemo(()=>{if(!E)return[];const m=E.sideOffset??te,O=E.alignOffset??ne,y=typeof E.collisionPadding=="number"?E.collisionPadding:{top:E.collisionPadding?.top??0,right:E.collisionPadding?.right??0,bottom:E.collisionPadding?.bottom??0,left:E.collisionPadding?.left??0},M=Array.isArray(E.collisionBoundary)?E.collisionBoundary:E.collisionBoundary?[E.collisionBoundary]:[],$=M.length>0,B={padding:y,boundary:M.filter(z=>z!==null),altBoundary:$};return[H.offset({mainAxis:m,alignmentAxis:O}),E.avoidCollisions&&H.shift({mainAxis:!0,crossAxis:!1,limiter:E.sticky==="partial"?H.limitShift():void 0,...B}),E.avoidCollisions&&H.flip({...B}),Y&&H.arrow({element:Y,padding:E.arrowPadding}),E.hideWhenDetached&&H.hide({strategy:"referenceHidden",...B})].filter(Boolean)},[E,te,ne,Y]),Ze=Nt(E?.side??n,E?.align??s),{refs:et,floatingStyles:tt,placement:nt,middlewareData:oe}=H.useFloating({placement:Ze,middleware:Qe,strategy:"fixed",whileElementsMounted:H.autoUpdate,elements:{reference:w}}),ot=C.useComposedRefs(et.setFloating,W),[ie,ce]=Ft(nt),he=oe.arrow?.x,ve=oe.arrow?.y,xe=oe.arrow?.centerOffset!==0,Ee=P&&oe.hide?.referenceHidden,rt=c.useMemo(()=>({arrowX:he,arrowY:ve,placedAlign:ce,placedSide:ie,shouldHideArrow:xe,onArrowChange:se,onFooterChange:j}),[he,ve,ie,ce,xe]);c.useEffect(()=>{if(D&&w&&I){let m=function(){w&&le(A,w,S.spotlightPadding)},O=function(){y===null&&(y=requestAnimationFrame(()=>{w&&le(A,w,S.spotlightPadding),y=null}))};le(A,w,S.spotlightPadding);let y=null;return window.addEventListener("resize",m),window.addEventListener("scroll",O,{passive:!0}),()=>{window.removeEventListener("resize",m),window.removeEventListener("scroll",O),y!==null&&cancelAnimationFrame(y)}}},[D,w,I,A,S.spotlightPadding]),c.useEffect(()=>{if(!D\|\|!I)return;const m=W.current;if(!m)return;const O=m.ownerDocument;function y($){if($.target&&!ee.current){const B=new CustomEvent(wt,{...U,detail:{originalEvent:$}});S.onPointerDownOutside?.(B);const z=new CustomEvent(Se,{...U,detail:{originalEvent:$}});S.onInteractOutside?.(z),!B.defaultPrevented&&!z.defaultPrevented&&S.dismissible&&A.setState("open",!1)}ee.current=!1}const M=window.setTimeout(()=>{O.addEventListener("pointerdown",y)},0);return()=>{window.clearTimeout(M),O.removeEventListener("pointerdown",y)}},[D,I,A,S]),c.useEffect(()=>{if(!D\|\|!I)return;const m=W.current;if(!m)return;const O=m.ownerDocument;function y(M){const $=M.target,B=m?.contains($),z=w?.contains($);if(M.target&&!J.current&&!B&&!z){const Ce=new CustomEvent(Se,{...U,detail:{originalEvent:M}});S.onInteractOutside?.(Ce),!Ce.defaultPrevented&&S.dismissible&&A.setState("open",!1)}}return O.addEventListener("focusin",y),()=>{O.removeEventListener("focusin",y)}},[D,I,A,S,w]);const st=c.useCallback(m=>{a?.(m),ee.current=!0},[a]),it=c.useCallback(m=>{d?.(m),J.current=!0},[d]),ct=c.useCallback(m=>{x?.(m),J.current=!1},[x]);if(c.useEffect(()=>{if(!D\|\|!I\|\|!w)return;function m(){ee.current=!0}function O(){J.current=!0}function y(){J.current=!1}return w.addEventListener("pointerdown",m,!0),w.addEventListener("focus",O,!0),w.addEventListener("blur",y,!0),()=>{w.removeEventListener("pointerdown",m,!0),w.removeEventListener("focus",O,!0),w.removeEventListener("blur",y,!0)}},[D,I,w]),bt(),yt(W,D&&I,D,S.onOpenAutoFocus,S.onCloseAutoFocus),!D\|\|!E\|\|!w&&!v\|\|!I)return null;const ut=b?C.Slot:"div";return p.jsx(ke.Provider,{value:rt,children:p.jsxs(ut,{ref:ot,"data-slot":"tour-step","data-side":ie,"data-align":ce,dir:S.dir,tabIndex:-1,...q,onPointerDownCapture:st,onFocusCapture:it,onBlurCapture:ct,className:C.cn("fixed z-50 flex w-80 flex-col gap-4 rounded-lg border bg-popover p-4 text-popover-foreground shadow-md outline-none",h),style:{...R,...tt,visibility:Ee?"hidden":void 0,pointerEvents:Ee?"none":void 0},children:[g,!_&&p.jsx(Ie.Provider,{value:!0,children:S.stepFooter})]})})}function Me(e){const{asChild:t,className:n,style:r,forceMount:s=!1,...u}=e,l=F(i=>i.open),o=F(i=>i.maskPath);if(!l&&!s)return null;const f=t?C.Slot:"div";return p.jsx(f,{"data-slot":"tour-spotlight","data-state":Oe(l),...u,className:C.cn("data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-40 bg-black/80 data-[state=closed]:animate-out data-[state=open]:animate-in",n),style:{clipPath:o,...r}})}function $e(e){const{asChild:t,className:n,style:r,forceMount:s=!1,...u}=e,l=F(i=>i.open),o=F(i=>i.spotlightRect);if(!l&&!s\|\|!o)return null;const f=t?C.Slot:"div";return p.jsx(f,{"data-slot":"tour-spotlight-ring","data-state":Oe(l),...u,className:C.cn("pointer-events-none fixed z-40 border-ring ring-[3px] ring-ring/50",n),style:{left:o.x,top:o.y,width:o.width,height:o.height,...r}})}function Be(e){const{children:t,container:n}=e,r=kt(ft),[s,u]=c.useState(!1);if(X(()=>{u(!0);const o=n??document.body;return r?.onPortalChange(o),()=>{r?.onPortalChange(null)}},[n,r]),!s)return null;const l=n??r?.portal??document.body;return dt.createPortal(t,l)}function He(e){const{width:t=10,height:n=5,className:r,children:s,asChild:u,...l}=e,o=De(pt),f=Tt[o.placedSide];return p.jsx("span",{ref:o.onArrowChange,"data-slot":"tour-arrow",style:{position:"absolute",left:o.arrowX!=null?`${o.arrowX}px`:void 0,top:o.arrowY!=null?`${o.arrowY}px`:void 0,[f]:0,transformOrigin:{top:"",right:"0 0",bottom:"center 0",left:"100% 0"}[o.placedSide],transform:{top:"translateY(100%)",right:"translateY(50%) rotate(90deg) translateX(-50%)",bottom:"rotate(180deg)",left:"translateY(50%) rotate(-90deg) translateX(50%)"}[o.placedSide],visibility:o.shouldHideArrow?"hidden":void 0},children:p.jsx("svg",{viewBox:"0 0 30 10",preserveAspectRatio:"none",width:t,height:n,...l,className:C.cn("block fill-popover stroke-border",r),children:u?s:p.jsx("polygon",{points:"0,0 30,0 15,10"})})})}function qe(e){const{asChild:t,className:n,...r}=e,s=Z(mt),u=t?C.Slot:"div";return p.jsx(u,{"data-slot":"tour-header",dir:s.dir,...r,className:C.cn("flex flex-col gap-1.5 text-center sm:text-left",n)})}function We(e){const{asChild:t,className:n,...r}=e,s=Z(gt),u=t?C.Slot:"div";return p.jsx(u,{"data-slot":"tour-title",dir:s.dir,...r,className:C.cn("font-semibold text-lg leading-none tracking-tight",n)})}function Ke(e){const{asChild:t,className:n,...r}=e,s=Z(ht),u=t?C.Slot:"div";return p.jsx(u,{"data-slot":"tour-description",dir:s.dir,...r,className:C.cn("text-muted-foreground text-sm",n)})}function Ve(e){const{asChild:t,className:n,onClick:r,...s}=e,u=K(vt),l=c.useCallback(f=>{r?.(f),!f.defaultPrevented&&u.setState("open",!1)},[u,r]),o=t?C.Slot:"button";return p.jsx(o,{type:"button","aria-label":"Close tour",className:C.cn("absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",n),onClick:l,...s,children:p.jsx(de.X,{className:"size-4"})})}function ze(e){const{children:t,onClick:n,...r}=e,s=K(xt),u=F(o=>o.value),l=c.useCallback(o=>{n?.(o),!o.defaultPrevented&&u>0&&s.setState("value",u-1)},[u,s,n]);return p.jsx(fe.default,{type:"button","aria-label":"Previous step","data-slot":"tour-prev",variant:"outline",...r,onClick:l,disabled:u===0,children:t??p.jsxs(p.Fragment,{children:[p.jsx(de.ChevronLeft,{}),"Previous"]})})}function Ue(e){const{children:t,onClick:n,...r}=e,s=K(Et),u=F(i=>i.value),l=F(i=>i.steps),o=u===l.length-1,f=c.useCallback(i=>{n?.(i),!i.defaultPrevented&&s.setState("value",u+1)},[u,s,n]);return p.jsx(fe.default,{type:"button","aria-label":"Next step","data-slot":"tour-next",...r,onClick:f,children:t??p.jsxs(p.Fragment,{children:[o?"Finish":"Next",!o&&p.jsx(de.ChevronRight,{})]})})}function Ge(e){const{children:t,onClick:n,...r}=e,s=K(Ct),u=c.useCallback(l=>{n?.(l),!l.defaultPrevented&&s.setState("open",!1)},[s,n]);return p.jsx(fe.default,{type:"button","aria-label":"Skip tour","data-slot":"tour-skip",variant:"outline",...r,onClick:u,children:t??"Skip"})}function Xe(e){const{format:t=(i,P)=>`${i} / ${P}`,asChild:n,className:r,children:s,...u}=e,l=F(i=>i.value),o=F(i=>i.steps),f=n?C.Slot:"div";return p.jsx(f,{"data-slot":"tour-step-counter",...u,className:C.cn("text-muted-foreground text-sm",r),children:s??t(l+1,o.length)})}function Ye(e){const{asChild:t,className:n,ref:r,...s}=e,u=De(we),l=c.useContext(Ie),o=Z(we),f=C.useComposedRefs(r,l?void 0:u.onFooterChange),i=t?C.Slot:"div";return p.jsx(i,{"data-slot":"tour-footer",dir:o.dir,...s,ref:f,className:C.cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",n)})}exports.Arrow=He;exports.Close=Ve;exports.Description=Ke;exports.Footer=Ye;exports.Header=qe;exports.Next=Ue;exports.Portal=Be;exports.Prev=ze;exports.Root=_e;exports.Skip=Ge;exports.Spotlight=Me;exports.SpotlightRing=$e;exports.Step=je;exports.StepCounter=Xe;exports.Title=We;exports.Tour=_e;exports.TourArrow=He;exports.TourClose=Ve;exports.TourDescription=Ke;exports.TourFooter=Ye;exports.TourHeader=qe;exports.TourNext=Ue;exports.TourPortal=Be;exports.TourPrev=ze;exports.TourSkip=Ge;exports.TourSpotlight=Me;exports.TourSpotlightRing=$e;exports.TourStep=je;exports.TourStepCounter=Xe;exports.TourTitle=We;
2	+ //# sourceMappingURL=Tour.cjs.map