@flikk/ui 1.0.0-beta.3 → 1.0.0-beta.31

package/dist/hooks/useSelectPortal.js

@@ -1,19 +1,13 @@
-import { useRef, useState, useCallback, useLayoutEffect, useMemo } from 'react';
+"use client";
+import { useRef, useState, useCallback, useLayoutEffect, useEffect } from 'react';
 
-// Simple debounce utility
-const debounce = (func, wait) => {
-    let timeout;
-    return () => {
-        clearTimeout(timeout);
-        timeout = setTimeout(func, wait);
-    };
-};
+const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
 /**
  * Fixed dropdown positioning hook
  * Uses position: fixed with pure viewport coordinates to properly follow scroll
  * Fixes critical issues: dropdown not following scroll & multiple dropdowns not working
  */
-const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", offset = 4, estimatedWidth, autoWidth = false, }) => {
+const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", offset = 4, estimatedWidth, autoWidth = false, onClose, stickyTracking = false, clampToViewport = true, recalcTrigger, }) => {
     const contentRef = useRef(null);
     const [position, setPosition] = useState({ top: -9999, left: -9999, width: 0 });
     const [cssVariables, setCssVariables] = useState({});
@@ -22,6 +16,7 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
     const [isReady, setIsReady] = useState(false);
     const isInitialRenderRef = useRef(true);
     const rafIdRef = useRef(null);
+    const frozenPlacementRef = useRef(placement);
     // Enhanced measurement system - use actual DOM measurements when available
     const measureDropdownHeight = useCallback(() => {
         if (contentRef.current) {
@@ -130,6 +125,7 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
         }
         setActualPlacement(finalPlacement);
         setIsFlipped(needsFlip);
+        frozenPlacementRef.current = finalPlacement;
         // Calculate position based on final placement
         let top = 0;
         let left = 0;
@@ -174,51 +170,63 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
                 left = rect.right + offset;
             }
         }
-        // Collision detection - handle both horizontal and vertical overflow
-        // Horizontal bounds checking
-        const rightEdge = left + dropdownWidth;
-        const overflow = rightEdge - (viewportWidth - margin);
-        if (overflow > 0) {
-            // Shift left just enough to fit
-            const shiftedLeft = left - overflow;
-            if (shiftedLeft >= margin) {
-                left = shiftedLeft;
+        // Collision detection. Horizontal clamping runs whenever `clampToViewport`
+        // is on (default) — even with stickyTracking — because horizontal position
+        // is independent of vertical scroll and so cannot fight scroll-follow.
+        // Vertical clamping stays gated on `!stickyTracking` so the dropdown can
+        // follow the trigger past the top/bottom viewport edges during scroll.
+        if (clampToViewport) {
+            // Horizontal bounds checking
+            const rightEdge = left + dropdownWidth;
+            const overflow = rightEdge - (viewportWidth - margin);
+            if (overflow > 0) {
+                // Shift left just enough to fit
+                const shiftedLeft = left - overflow;
+                left = shiftedLeft >= margin ? shiftedLeft : margin;
             }
-            else {
-                // Clamp to viewport margin
+            // Handle left edge overflow
+            if (left < margin) {
                 left = margin;
             }
         }
-        // Handle left edge overflow
-        if (left < margin) {
-            left = margin;
-        }
-        // Vertical bounds checking
-        const bottomEdge = top + dropdownHeight;
-        const verticalOverflow = bottomEdge - (viewportHeight - margin);
-        if (verticalOverflow > 0) {
-            // Shift up just enough to fit
-            const shiftedTop = top - verticalOverflow;
-            if (shiftedTop >= margin) {
-                top = shiftedTop;
+        {
+            // Vertical clamp runs on every calculatePosition — initial open, resize,
+            // and the non-sticky scroll path. The sticky scroll-follow path
+            // (updatePositionInDOM) stays unclamped so the popover tracks the trigger
+            // past the top/bottom edges during scroll. Clamping here means a sticky
+            // popover still OPENS fully on-screen even in a short viewport.
+            const bottomEdge = top + dropdownHeight;
+            const verticalOverflow = bottomEdge - (viewportHeight - margin);
+            if (verticalOverflow > 0) {
+                // Shift up just enough to fit
+                const shiftedTop = top - verticalOverflow;
+                if (shiftedTop >= margin) {
+                    top = shiftedTop;
+                }
+                else {
+                    // Clamp to viewport margin
+                    top = margin;
+                }
             }
-            else {
-                // Clamp to viewport margin
+            // Handle top edge overflow
+            if (top < margin) {
                 top = margin;
             }
         }
-        // Handle top edge overflow
-        if (top < margin) {
-            top = margin;
-        }
         setPosition({ top, left, width: dropdownWidth });
-        // Calculate available space based on placement direction
+        // Calculate available space (drives the scrollable max-height var).
+        // Sticky overlays (Popover/Dropdown) clamp their open position to the
+        // viewport, so they can occupy the full usable viewport height regardless
+        // of which side of the trigger they sit on — size against that, not just
+        // the cramped space below. Non-sticky dropdowns (Select) keep per-side
+        // space so they never grow over their trigger.
+        const usableViewportHeight = viewportHeight - margin * 2 - offset;
         let availableSpace = 0;
         if (finalPlacement.startsWith("top")) {
-            availableSpace = spaceAbove - offset;
+            availableSpace = stickyTracking ? usableViewportHeight : spaceAbove - offset;
         }
         else if (finalPlacement.startsWith("bottom")) {
-            availableSpace = spaceBelow - offset;
+            availableSpace = stickyTracking ? usableViewportHeight : spaceBelow - offset;
         }
         else if (finalPlacement.startsWith("left")) {
             availableSpace = spaceLeft - offset;
@@ -242,9 +250,71 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
         }
         setCssVariables(cssVars);
         // Mark initial render as complete after first calculation
-    }, [measureDropdownHeight, measureDropdownWidth, offset, placement, triggerRef]);
+    }, [measureDropdownHeight, measureDropdownWidth, offset, placement, triggerRef, stickyTracking, clampToViewport]);
+    // Direct DOM mutation for stickyTracking — bypasses React state for zero-lag scroll tracking
+    const updatePositionInDOM = useCallback(() => {
+        if (!triggerRef.current || !contentRef.current)
+            return;
+        const rect = triggerRef.current.getBoundingClientRect();
+        const frozen = frozenPlacementRef.current;
+        const dropdownHeight = measureDropdownHeight();
+        const dropdownWidth = measureDropdownWidth();
+        let top = 0;
+        let left = 0;
+        if (frozen.startsWith("top") || frozen.startsWith("bottom")) {
+            if (frozen.includes("start")) {
+                left = rect.left;
+            }
+            else if (frozen.includes("end")) {
+                left = rect.right - dropdownWidth;
+            }
+            else {
+                left = rect.left + (rect.width / 2) - (dropdownWidth / 2);
+            }
+            if (frozen.startsWith("top")) {
+                top = rect.top - dropdownHeight - offset;
+            }
+            else {
+                top = rect.bottom + offset;
+            }
+        }
+        else if (frozen.startsWith("left") || frozen.startsWith("right")) {
+            if (frozen.includes("start")) {
+                top = rect.top;
+            }
+            else if (frozen.includes("end")) {
+                top = rect.bottom - dropdownHeight;
+            }
+            else {
+                top = rect.top + (rect.height / 2) - (dropdownHeight / 2);
+            }
+            if (frozen.startsWith("left")) {
+                left = rect.left - dropdownWidth - offset;
+            }
+            else {
+                left = rect.right + offset;
+            }
+        }
+        // Keep horizontal clamping consistent with calculatePosition so the popover
+        // doesn't re-overflow the right edge when scroll-tracking recomputes position.
+        if (clampToViewport) {
+            const margin = 16;
+            const viewportWidth = window.innerWidth;
+            const overflow = left + dropdownWidth - (viewportWidth - margin);
+            if (overflow > 0) {
+                const shiftedLeft = left - overflow;
+                left = shiftedLeft >= margin ? shiftedLeft : margin;
+            }
+            if (left < margin)
+                left = margin;
+        }
+        contentRef.current.style.top = `${top}px`;
+        contentRef.current.style.left = `${left}px`;
+    }, [triggerRef, measureDropdownHeight, measureDropdownWidth, offset, clampToViewport]);
     // Reset initial render flag when dropdown opens
-    useLayoutEffect(() => {
+    useIsomorphicLayoutEffect(() => {
+        if (typeof window === 'undefined')
+            return;
         if (!isOpen) {
             if (rafIdRef.current !== null) {
                 cancelAnimationFrame(rafIdRef.current);
@@ -274,28 +344,76 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
             }
         };
     }, [isOpen, calculatePosition]);
-    // Initial position calculation
-    useLayoutEffect(() => {
+    // Initial position calculation. `recalcTrigger` is in the deps so triggers
+    // that move on their own (e.g. a dragged slider thumb, with no
+    // scroll/resize/content-resize event to key off of) can force a recalc —
+    // one effect, one calculatePosition per open/trigger change.
+    useIsomorphicLayoutEffect(() => {
+        if (typeof window === 'undefined')
+            return;
         if (!isOpen)
             return;
         calculatePosition();
-    }, [isOpen, calculatePosition]);
-    // Debounced position updates for better performance
-    const debouncedCalculatePosition = useMemo(() => debounce(calculatePosition, 16), // ~60fps
-    [calculatePosition]);
-    // Update position on scroll and resize - debounced for performance
-    useLayoutEffect(() => {
+    }, [isOpen, calculatePosition, recalcTrigger]);
+    // rAF-synced scroll handler: skips internal scrolls, detects off-screen trigger
+    const scrollRafRef = useRef(null);
+    const handleScroll = useCallback((e) => {
+        // Skip if scroll originated inside the popover content
+        if (contentRef.current && contentRef.current.contains(e.target)) {
+            return;
+        }
+        // Close if trigger has scrolled off-screen (skip for stickyTracking)
+        if (!stickyTracking && triggerRef.current) {
+            const rect = triggerRef.current.getBoundingClientRect();
+            const isOffScreen = rect.bottom < 0 || rect.top > window.innerHeight
+                || rect.right < 0 || rect.left > window.innerWidth;
+            if (isOffScreen && onClose) {
+                onClose();
+                return;
+            }
+        }
+        if (stickyTracking) {
+            // Direct DOM mutation — zero-lag tracking, bypasses React state entirely
+            updatePositionInDOM();
+        }
+        else {
+            if (scrollRafRef.current)
+                cancelAnimationFrame(scrollRafRef.current);
+            scrollRafRef.current = requestAnimationFrame(() => {
+                scrollRafRef.current = null;
+                calculatePosition();
+            });
+        }
+    }, [calculatePosition, onClose, triggerRef, stickyTracking, updatePositionInDOM]);
+    const handleResize = useCallback(() => {
+        if (scrollRafRef.current)
+            cancelAnimationFrame(scrollRafRef.current);
+        scrollRafRef.current = requestAnimationFrame(() => {
+            scrollRafRef.current = null;
+            calculatePosition();
+        });
+    }, [calculatePosition]);
+    // Update position on scroll and resize - rAF-synced for smooth tracking
+    useIsomorphicLayoutEffect(() => {
+        if (typeof window === 'undefined')
+            return;
         if (!isOpen)
             return;
-        window.addEventListener("scroll", debouncedCalculatePosition, { passive: true, capture: true });
-        window.addEventListener("resize", debouncedCalculatePosition, { passive: true });
+        window.addEventListener("scroll", handleScroll, { passive: true, capture: true });
+        window.addEventListener("resize", handleResize, { passive: true });
         return () => {
-            window.removeEventListener("scroll", debouncedCalculatePosition, true);
-            window.removeEventListener("resize", debouncedCalculatePosition);
+            window.removeEventListener("scroll", handleScroll, true);
+            window.removeEventListener("resize", handleResize);
+            if (scrollRafRef.current) {
+                cancelAnimationFrame(scrollRafRef.current);
+                scrollRafRef.current = null;
+            }
         };
-    }, [isOpen, debouncedCalculatePosition]);
+    }, [isOpen, handleScroll, handleResize]);
     // Recalculate when dropdown content resizes (e.g. search filtering)
-    useLayoutEffect(() => {
+    useIsomorphicLayoutEffect(() => {
+        if (typeof window === 'undefined')
+            return;
         if (!isOpen)
             return;
         if (!contentRef.current)
@@ -303,6 +421,10 @@ const useSimpleDropdown = ({ triggerRef, isOpen, placement = "bottom-start", off
         if (typeof ResizeObserver === "undefined")
             return;
         const observer = new ResizeObserver(() => {
+            // Content resize (incl. the initial settle right after open) goes through
+            // calculatePosition so the popover re-fits and stays vertically clamped to
+            // the viewport. Only the scroll path uses the unclamped updatePositionInDOM
+            // follow — otherwise the resize-on-open would immediately undo the clamp.
             calculatePosition();
         });
         observer.observe(contentRef.current);

package/dist/hooks/useSlidingNumber.js

@@ -1,3 +1,4 @@
+"use client";
 import { useState, useRef, useEffect, useMemo } from 'react';
 
 /**

package/dist/hooks/useStreamingSSE.d.ts

@@ -1,8 +1,3 @@
-/**
- * useStreamingSSE Hook
- * Handles Server-Sent Events (SSE) streaming for AI/LLM responses
- * Supports OpenAI, Anthropic (Claude), and Google Gemini formats
- */
 import { type SSEFormat, type SSEParser } from '../utils/sseFormatParsers';
 import { type StreamingError } from '../utils/streamingErrors';
 import { type RetryConfig } from '../utils/retryUtils';

package/dist/hooks/useStreamingSSE.js

@@ -1,13 +1,9 @@
+"use client";
 import { useState, useRef, useCallback, useEffect } from 'react';
 import { parseSSELine } from '../utils/sseFormatParsers.js';
 import { StreamingTimeoutError, StreamingServerError, StreamingNetworkError, normalizeError } from '../utils/streamingErrors.js';
 import { shouldRetry, calculateRetryDelay } from '../utils/retryUtils.js';
 
-/**
- * useStreamingSSE Hook
- * Handles Server-Sent Events (SSE) streaming for AI/LLM responses
- * Supports OpenAI, Anthropic (Claude), and Google Gemini formats
- */
 /**
  * Hook for handling SSE streaming from AI/LLM APIs
  *

package/dist/hooks/useTypewriter.js

@@ -1,3 +1,4 @@
+"use client";
 import { useState, useRef, useEffect } from 'react';
 
 /**

package/dist/index.d.ts

@@ -1,9 +1,8 @@
 export * from "./components/core";
 export * from "./components/data-display";
 export * from "./components/forms";
-export * from "./components/charts";
 export * from "./components/layout";
-export * from "./components/effects";
+export * from "./theme";
 export { cn } from "./utils/cn";
 export { debounce } from "./utils/debounce";
 export { useClickOutside } from "./hooks/useClickOutside";

package/dist/index.js

@@ -7,6 +7,7 @@ export { Badge } from './components/core/Badge/Badge.js';
 export { Breadcrumbs } from './components/core/Breadcrumbs/Breadcrumbs.js';
 export { breadcrumbsTheme, breadcrumbsVariants, defaultSeparator } from './components/core/Breadcrumbs/Breadcrumbs.theme.js';
 export { Button } from './components/core/Button/Button.js';
+export { getRippleAnimation, getRippleColorClass, useRipple } from './components/core/Button/Button.ripple.js';
 export { ButtonGroup } from './components/core/ButtonGroup/ButtonGroup.js';
 export { ButtonGroupSeparator } from './components/core/ButtonGroup/ButtonGroupSeparator.js';
 export { ButtonGroupText } from './components/core/ButtonGroup/ButtonGroupText.js';
@@ -16,12 +17,16 @@ export { calendarAnimations } from './components/core/Calendar/Calendar.animatio
 export { CalendarMini } from './components/core/Calendar/CalendarMini/CalendarMini.js';
 export { Card } from './components/core/Card/Card.js';
 export { CardStack } from './components/core/CardStack/CardStack.js';
+export { HERO_CARD_DEFAULT_IMAGE, HeroCard } from './components/core/HeroCard/HeroCard.js';
+export { heroCardTheme } from './components/core/HeroCard/HeroCard.theme.js';
 export { Carousel } from './components/core/Carousel/Carousel.js';
+export { CarouselBody } from './components/core/Carousel/CarouselBody.js';
 export { CommandPalette } from './components/core/CommandPalette/CommandPalette.js';
 export { commandPaletteTheme } from './components/core/CommandPalette/CommandPalette.theme.js';
 export { Separator } from './components/core/Separator/Separator.js';
 export { separatorTheme } from './components/core/Separator/Separator.theme.js';
 export { Drawer } from './components/core/Drawer/Drawer.js';
+export { DrawerBody } from './components/core/Drawer/DrawerBody.js';
 export { Dropdown } from './components/core/Dropdown/Dropdown.js';
 export { DropdownTrigger } from './components/core/Dropdown/DropdownTrigger.js';
 export { DropdownMenu } from './components/core/Dropdown/DropdownMenu.js';
@@ -29,17 +34,19 @@ export { DropdownItem } from './components/core/Dropdown/DropdownItem.js';
 export { DropdownSection } from './components/core/Dropdown/DropdownSection.js';
 export { DropdownSeparator } from './components/core/Dropdown/DropdownSeparator.js';
 export { dropdownTheme } from './components/core/Dropdown/Dropdown.theme.js';
+export { DotSeparator } from './components/core/DotSeparator/DotSeparator.js';
+export { dotSeparatorTheme } from './components/core/DotSeparator/DotSeparator.theme.js';
 export { Kbd } from './components/core/Kbd/Kbd.js';
 export { MenuItem } from './components/core/MenuItem/MenuItem.js';
 export { menuItemTheme } from './components/core/MenuItem/MenuItem.theme.js';
 export { Link } from './components/core/Link/Link.js';
-export { Loader } from './components/core/Loader/Loader.js';
 export { Modal } from './components/core/Modal/Modal.js';
 export { ModalStack } from './components/core/ModalStack/ModalStack.js';
 export { PageHeading } from './components/core/PageHeading/PageHeading.js';
 export { Pagination } from './components/core/Pagination/Pagination.js';
 export { Popover } from './components/core/Popover/Popover.js';
 export { PopoverContext, usePopoverContext } from './components/core/Popover/PopoverContext.js';
+export { PopoverBody } from './components/core/Popover/PopoverBody.js';
 export { Progress } from './components/core/Progress/Progress.js';
 export { Rating } from './components/core/Rating/Rating.js';
 export { ScrollArea } from './components/core/ScrollArea/ScrollArea.js';
@@ -51,7 +58,7 @@ export { SlidingNumber } from './components/core/SlidingNumber/SlidingNumber.js'
 export { Tabs } from './components/core/Tabs/Tabs.js';
 export { TabsList } from './components/core/Tabs/TabsList.js';
 export { TabsTrigger } from './components/core/Tabs/TabsTrigger.js';
-export { TabsContent } from './components/core/Tabs/TabsContent.js';
+export { TabsBody } from './components/core/Tabs/TabsBody.js';
 export { TabsContext, useTabsContext } from './components/core/Tabs/TabsContext.js';
 export { Tooltip } from './components/core/Tooltip/Tooltip.js';
 export { baseTooltipVariants, getTooltipVariants, tooltipSpringConfig } from './components/core/Tooltip/Tooltip.animations.js';
@@ -70,6 +77,16 @@ export { Message } from './components/core/Message/Message.js';
 export { messageTheme } from './components/core/Message/Message.theme.js';
 export { messageListTheme } from './components/core/Message/MessageList.theme.js';
 export { TypeWriter } from './components/core/Message/TypeWriter.js';
+export { MessageBody } from './components/core/Message/MessageBody.js';
+export { MessageStatusIndicator } from './components/core/Message/MessageStatusIndicator.js';
+export { MessageSenderName } from './components/core/Message/MessageSenderName.js';
+export { MessageFile } from './components/core/Message/MessageFile.js';
+export { MessageImage } from './components/core/Message/MessageImage.js';
+export { MessageAudio } from './components/core/Message/MessageAudio.js';
+export { MessageLink } from './components/core/Message/MessageLink.js';
+export { MessageReply } from './components/core/Message/MessageReply.js';
+export { MessageReactions } from './components/core/Message/MessageReactions.js';
+export { MessageDateDivider } from './components/core/Message/MessageDateDivider.js';
 export { Empty } from './components/core/Empty/Empty.js';
 export { emptyTheme } from './components/core/Empty/Empty.theme.js';
 export { Masonry } from './components/core/Masonry/Masonry.js';
@@ -83,16 +100,22 @@ export { SidebarContent } from './components/core/Sidebar/SidebarContent.js';
 export { SidebarFooter } from './components/core/Sidebar/SidebarFooter.js';
 export { SidebarNav } from './components/core/Sidebar/SidebarNav.js';
 export { SidebarNavGroup } from './components/core/Sidebar/SidebarNavGroup.js';
-export { SidebarSubmenu } from './components/core/Sidebar/SidebarSubmenu.js';
 export { SidebarToggle } from './components/core/Sidebar/SidebarToggle.js';
-export { useSidebarContext } from './components/core/Sidebar/SidebarContext.js';
+export { SidebarMobileTrigger } from './components/core/Sidebar/SidebarMobileTrigger.js';
+export { SidebarUserProfile } from './components/core/Sidebar/SidebarUserProfile.js';
+export { SidebarLogo } from './components/core/Sidebar/SidebarLogo.js';
+export { SidebarSearch } from './components/core/Sidebar/SidebarSearch.js';
+export { SidebarCard } from './components/core/Sidebar/SidebarCard.js';
+export { SidebarProvider, useSidebarContext } from './components/core/Sidebar/SidebarContext.js';
 export { OfflineIndicator } from './components/core/OfflineIndicator/OfflineIndicator.js';
 export { offlineIndicatorTheme } from './components/core/OfflineIndicator/OfflineIndicator.theme.js';
 export { ContextMenu } from './components/core/ContextMenu/ContextMenu.js';
 export { contextMenuTheme } from './components/core/ContextMenu/ContextMenu.theme.js';
 export { Pill } from './components/core/Pill/Pill.js';
 export { pillTheme } from './components/core/Pill/Pill.theme.js';
-export { SocialIcon } from './components/core/SocialIcon/SocialIcon.js';
+export { Icon } from './components/core/Icon/Icon.js';
+export { fileTypes } from './components/core/Icon/data/fileTypes.js';
+export { ImagePlaceholder } from './components/core/ImagePlaceholder/ImagePlaceholder.js';
 export { Table } from './components/data-display/Table/index.js';
 export { KPI } from './components/data-display/KPI/KPI.js';
 export { kpiTheme } from './components/data-display/KPI/KPI.theme.js';
@@ -105,6 +128,7 @@ export { GanttChart } from './components/data-display/GanttChart/GanttChart.js';
 export { ganttChartTheme } from './components/data-display/GanttChart/GanttChart.theme.js';
 export { Input } from './components/forms/Input/Input.js';
 export { inputTheme } from './components/forms/Input/Input.theme.js';
+export { isValidExpiryDate } from './components/forms/Input/inputMasks.js';
 export { Select, SelectButton, SelectOption, SelectOptions } from './components/forms/Select/Select.js';
 export { selectTheme } from './components/forms/Select/Select.theme.js';
 export { Textarea } from './components/forms/Textarea/Textarea.js';
@@ -119,15 +143,23 @@ export { Switch } from './components/forms/Switch/Switch.js';
 export { switchTheme } from './components/forms/Switch/Switch.theme.js';
 export { DatePicker } from './components/forms/DatePicker/DatePicker.js';
 export { datePickerTheme } from './components/forms/DatePicker/DatePicker.theme.js';
+export { DateRangePicker } from './components/forms/DateRangePicker/DateRangePicker.js';
+export { dateRangePickerTheme } from './components/forms/DateRangePicker/DateRangePicker.theme.js';
+export { DEFAULT_DATE_RANGE_PRESETS } from './components/forms/DateRangePicker/dateRangePresets.js';
 export { FileUpload } from './components/forms/FileUpload/FileUpload.js';
 export { fileUploadTheme } from './components/forms/FileUpload/FileUpload.theme.js';
+export { FileUploadProgress } from './components/forms/FileUpload/FileUploadProgress.js';
+export { fileUploadProgressTheme } from './components/forms/FileUpload/FileUploadProgress.theme.js';
 export { TimePicker } from './components/forms/TimePicker/TimePicker.js';
 import 'react/jsx-runtime';
 import 'react';
-import '@heroicons/react/24/outline';
+import '@phosphor-icons/react';
 export { cn } from './utils/cn.js';
+import './components/forms/TimePicker/TimePickerContext.js';
 export { AnimatePresence } from 'motion/react';
 import 'react-dom';
+import './components/forms/Select/Select.animations.js';
+export { Surface, SurfaceProvider, liftLevel, resolveElevation, surfaceClasses, useSurfaceElevation, useSurfaceLevel } from './theme/SurfaceContext.js';
 import './components/forms/TimePicker/WheelColumn.js';
 export { timePickerTheme } from './components/forms/TimePicker/TimePicker.theme.js';
 export { Slider } from './components/forms/Slider/Slider.js';
@@ -151,9 +183,10 @@ export { InputTag } from './components/forms/InputTag/InputTag.js';
 export { inputTagTheme } from './components/forms/InputTag/InputTag.theme.js';
 export { Combobox } from './components/forms/Combobox/Combobox.js';
 export { comboboxTheme } from './components/forms/Combobox/Combobox.theme.js';
-export { ColorPicker, ColorPickerContext, useColorPicker } from './components/forms/ColorPicker/ColorPicker.js';
+export { ColorPicker } from './components/forms/ColorPicker/ColorPicker.js';
+export { useColorPicker } from './components/forms/ColorPicker/ColorPickerContext.js';
 export { ColorPickerTrigger } from './components/forms/ColorPicker/ColorPickerTrigger.js';
-export { ColorPickerContent } from './components/forms/ColorPicker/ColorPickerContent.js';
+export { ColorPickerBody } from './components/forms/ColorPicker/ColorPickerBody.js';
 export { ColorPicker2DCanvas } from './components/forms/ColorPicker/ColorPicker2DCanvas.js';
 export { ColorPickerSwatch } from './components/forms/ColorPicker/ColorPickerSwatch.js';
 export { ColorPickerSliders } from './components/forms/ColorPicker/ColorPickerSliders.js';
@@ -161,88 +194,43 @@ export { ColorPickerInput } from './components/forms/ColorPicker/ColorPickerInpu
 export { ColorPickerFormatSelector } from './components/forms/ColorPicker/ColorPickerFormatSelector.js';
 export { ColorPickerEyeDropper } from './components/forms/ColorPicker/ColorPickerEyeDropper.js';
 export { ColorPickerPresets } from './components/forms/ColorPicker/ColorPickerPresets.js';
+export { ColorPickerSavedColors } from './components/forms/ColorPicker/ColorPickerSavedColors.js';
+export { ColorPickerHeader } from './components/forms/ColorPicker/ColorPickerHeader.js';
+export { ColorPickerGradient } from './components/forms/ColorPicker/ColorPickerGradient.js';
+export { ColorPickerImage } from './components/forms/ColorPicker/ColorPickerImage.js';
 export { formatHex, formatHsl, formatRgb, hexToRgb, hslToRgb, hsvToRgb, parseColor, rgbToHex, rgbToHsl, rgbToHsv, validateHex, validateRgb } from './components/forms/ColorPicker/colorUtils.js';
 export { SelectableCard } from './components/forms/SelectableCard/SelectableCard.js';
 export { selectableCardTheme } from './components/forms/SelectableCard/SelectableCard.theme.js';
-export { TransferList } from './components/forms/TransferList/TransferList.js';
-export { transferListTheme } from './components/forms/TransferList/TransferList.theme.js';
 export { Mention } from './components/forms/Mention/Mention.js';
 export { mentionTheme } from './components/forms/Mention/Mention.theme.js';
-export { CronInput } from './components/forms/CronInput/CronInput.js';
-export { cronInputTheme } from './components/forms/CronInput/CronInput.theme.js';
-export { CRON_PRESETS, cronToDescription, fieldsToCron, formatNextRun, getNextRuns, parseCron, validateCron } from './components/forms/CronInput/CronInput.utils.js';
-export { ChartContainer } from './components/charts/ChartContainer.js';
-export { BarChart } from './components/charts/BarChart/BarChart.js';
-export { StackedBarChart } from './components/charts/StackedBarChart/StackedBarChart.js';
-export { STACKED_BAR_CHART_DEFAULTS } from './components/charts/StackedBarChart/StackedBarChart.types.js';
-export { LineChart } from './components/charts/LineChart/LineChart.js';
-export { AreaChart } from './components/charts/AreaChart/AreaChart.js';
-export { DonutChart } from './components/charts/DonutChart/DonutChart.js';
-export { MultiSegmentDonutChart } from './components/charts/DonutChart/MultiSegmentDonutChart.js';
-export { Heatmap } from './components/charts/Heatmap/Heatmap.js';
-import './components/charts/Heatmap/HeatmapCell.js';
-export { calculateIntensity, createGridMatrix, formatAxisLabel, generateSampleData, getDefaultTooltipContent, processHeatmapData } from './components/charts/Heatmap/utils/heatmapUtils.js';
-export { FunnelChart } from './components/charts/FunnelChart/FunnelChart.js';
-export { ScatterPlot } from './components/charts/ScatterPlot/ScatterPlot.js';
-export { RadarChart } from './components/charts/RadarChart/RadarChart.js';
-export { ComboChart } from './components/charts/ComboChart/ComboChart.js';
-export { ActivityRings } from './components/charts/ActivityRings/ActivityRings.js';
-export { ChartTooltip } from './components/charts/shared/ChartTooltip/ChartTooltip.js';
-export { ChartLegend } from './components/charts/shared/ChartLegend/ChartLegend.js';
-export { ChartLegendContent } from './components/charts/shared/ChartLegend/ChartLegendContent.js';
-export { XAxis } from './components/charts/shared/ChartAxis/XAxis.js';
-export { YAxis } from './components/charts/shared/ChartAxis/YAxis.js';
-export { ChartText } from './components/charts/shared/ChartText/ChartText.js';
-export { ChartMarker } from './components/charts/shared/ChartMarker/ChartMarker.js';
-export { ChartCrosshair } from './components/charts/shared/ChartCrosshair/ChartCrosshair.js';
-export { HorizontalGrid } from './components/charts/shared/ChartGrid/HorizontalGrid.js';
-export { useChartTheme } from './components/charts/hooks/useChartTheme.js';
-export { useTooltipPosition } from './components/charts/hooks/useTooltipPosition.js';
-export { useChartAccessibility } from './components/charts/hooks/useChartAccessibility.js';
-export { useChartValidation } from './components/charts/hooks/useChartValidation.js';
-export { DEFAULT_CHART_COLORS, EXTENDED_CHART_COLORS, MINIMAL_CHART_COLORS, colorClassToVariable, combineClasses, createColorClass, extractFillClass, extractStrokeClass, generateColorPalette, generateSeriesColors, getContrastColor } from './components/charts/utils/color-utils.js';
-export { chartTheme } from './components/charts/theme/chart.theme.js';
-export { SafeMath, calculateSafeScaleRange, generateNiceTicks, niceNum, sanitizeChartData, validateChart, validateChartConfig, validateChartData } from './components/charts/utils/chart-validation.js';
-export { BAR_CHART_DEFAULTS } from './components/charts/BarChart/BarChart.types.js';
-export { LINE_CHART_DEFAULTS } from './components/charts/LineChart/LineChart.types.js';
-export { AREA_CHART_DEFAULTS } from './components/charts/AreaChart/AreaChart.types.js';
-export { ChartErrorBoundary } from './components/charts/shared/ChartErrorBoundary/ChartErrorBoundary.js';
 export { FormLayout } from './components/layout/FormLayout/FormLayout.js';
 export { formLayoutTheme } from './components/layout/FormLayout/FormLayout.theme.js';
-export { PageLayout } from './components/layout/PageLayout/PageLayout.js';
-export { pageLayoutTheme } from './components/layout/PageLayout/PageLayout.theme.js';
-export { CustomCursor } from './components/effects/CustomCursor/CustomCursor.js';
-export { GlassEffect } from './components/effects/GlassEffect/GlassEffect.js';
-export { Overlay } from './components/effects/Overlay/Overlay.js';
-export { SpotlightBorder } from './components/effects/SpotlightBorder/SpotlightBorder.js';
-export { GlassSurface } from './components/effects/GlassSurface/GlassSurface.js';
-export { AIOrb } from './components/effects/AIOrb/AIOrb.js';
-export { Animated } from './components/effects/Animated/Animated.js';
-export { ProgressiveBlur } from './components/effects/ProgressiveBlur/ProgressiveBlur.js';
-export { Aurora } from './components/effects/Aurora/Aurora.js';
-export { MagneticElement } from './components/effects/MagneticElement/MagneticElement.js';
-export { MorphingText } from './components/effects/MorphingText/MorphingText.js';
-export { GridPattern } from './components/effects/GridPattern/GridPattern.js';
-export { DotPattern } from './components/effects/DotPattern/DotPattern.js';
-export { NoiseOverlay } from './components/effects/NoiseOverlay/NoiseOverlay.js';
-export { Spotlight } from './components/effects/Spotlight/Spotlight.js';
-export { Particles } from './components/effects/Particles/Particles.js';
-export { ParallaxSection } from './components/effects/ParallaxSection/ParallaxSection.js';
-export { ScrollReveal } from './components/effects/ScrollReveal/ScrollReveal.js';
-export { StickyScroll } from './components/effects/StickyScroll/StickyScroll.js';
+export { AppShell } from './components/layout/AppShell/AppShell.js';
+export { appShellTheme, getAppShellTheme } from './components/layout/AppShell/AppShell.theme.js';
+export { Grid } from './components/layout/Grid/Grid.js';
+export { gridTheme } from './components/layout/Grid/Grid.theme.js';
+export { Stack } from './components/layout/Stack/Stack.js';
+export { stackTheme } from './components/layout/Stack/Stack.theme.js';
+export { Section } from './components/layout/Section/Section.js';
+export { sectionTheme } from './components/layout/Section/Section.theme.js';
+export { ThemeProvider, useTheme } from './theme/ThemeContext.js';
+export { easings, getExpandCollapseVariants, getOverlayMenuVariants, overlayBackdropAnimations, springs } from './theme/animations.js';
 export { debounce } from './utils/debounce.js';
 export { useClickOutside } from './hooks/useClickOutside.js';
 export { useOverlay } from './hooks/useOverlay.js';
 export { useSlidingNumber } from './hooks/useSlidingNumber.js';
 export { useTypewriter } from './hooks/useTypewriter.js';
-export { CardContent } from './components/core/Card/CardContent.js';
+export { CardBody } from './components/core/Card/CardBody.js';
 export { CardFooter } from './components/core/Card/CardFooter.js';
 export { CardHeader } from './components/core/Card/CardHeader.js';
 export { CardSubtitle } from './components/core/Card/CardSubtitle.js';
 export { CardTitle } from './components/core/Card/CardTitle.js';
-export { DatePickerContent } from './components/forms/DatePicker/DatePickerContent.js';
+export { DatePickerBody } from './components/forms/DatePicker/DatePickerBody.js';
 export { DatePickerPresets } from './components/forms/DatePicker/DatePickerPresets.js';
 export { DatePickerTrigger } from './components/forms/DatePicker/DatePickerTrigger.js';
+export { DateRangePickerBody } from './components/forms/DateRangePicker/DateRangePickerBody.js';
+export { DateRangePickerPresets } from './components/forms/DateRangePicker/DateRangePickerPresets.js';
+export { DateRangePickerTrigger } from './components/forms/DateRangePicker/DateRangePickerTrigger.js';
 export { PageHeadingActions } from './components/core/PageHeading/PageHeadingActions.js';
 export { PageHeadingBackButton } from './components/core/PageHeading/PageHeadingBackButton.js';
 export { PageHeadingIcon } from './components/core/PageHeading/PageHeadingIcon.js';