@flikk/ui 1.0.0-beta.1

package/dist/components/core/Toast/ToastProvider.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ToastProviderProps, ToastContextValue } from './Toast.types';
+export declare const ToastProvider: React.FC<ToastProviderProps>;
+export declare const useToastContext: () => ToastContextValue;

package/dist/components/core/Toast/ToastProvider.js

@@ -0,0 +1,104 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React__default, { createContext, useState, useCallback, useMemo, useContext } from 'react';
+import { AnimatePresence } from 'motion/react';
+import { createPortal } from 'react-dom';
+import { Toast } from './Toast.js';
+import { toastTheme } from './Toast.theme.js';
+import { cn } from '../../../utils/cn.js';
+import { useIsClient } from '../../../hooks/useIsClient.js';
+
+const ToastContext = createContext(undefined);
+const positionStyles = {
+    'top-left': 'top-4 left-4',
+    'top-center': 'top-4 left-1/2 -translate-x-1/2',
+    'top-right': 'top-4 right-4',
+    'bottom-left': 'bottom-4 left-4',
+    'bottom-center': 'bottom-4 left-1/2 -translate-x-1/2',
+    'bottom-right': 'bottom-4 right-4',
+};
+const ToastProvider = ({ children, position = 'top-right', maxToasts = 5, defaultDuration = 5000, darkMode = false, }) => {
+    const isClient = useIsClient();
+    const [toasts, setToasts] = useState([]);
+    const [isHovered, setIsHovered] = useState(false);
+    const [toastHeights, setToastHeights] = useState({});
+    const hoverTimeoutRef = React__default.useRef(null);
+    const addToast = useCallback((toastData) => {
+        var _a;
+        const id = Math.random().toString(36).substring(2, 9);
+        const newToast = {
+            ...toastData,
+            id,
+            duration: (_a = toastData.duration) !== null && _a !== void 0 ? _a : defaultDuration,
+        };
+        setToasts(current => {
+            const updated = [newToast, ...current];
+            // Limit the number of toasts
+            return updated.slice(0, maxToasts);
+        });
+        return id;
+    }, [maxToasts, defaultDuration]);
+    const removeToast = useCallback((id) => {
+        setToasts(current => current.filter(toast => toast.id !== id));
+        setToastHeights(current => {
+            const next = { ...current };
+            delete next[id];
+            return next;
+        });
+    }, []);
+    const removeAllToasts = useCallback(() => {
+        setToasts([]);
+    }, []);
+    const handleMouseEnter = useCallback(() => {
+        if (hoverTimeoutRef.current) {
+            clearTimeout(hoverTimeoutRef.current);
+            hoverTimeoutRef.current = null;
+        }
+        setIsHovered(true);
+    }, []);
+    const handleMouseLeave = useCallback(() => {
+        // Add a small delay before collapsing to prevent flickering
+        hoverTimeoutRef.current = setTimeout(() => {
+            setIsHovered(false);
+        }, 150);
+    }, []);
+    const handleToastHeight = useCallback((id, height) => {
+        setToastHeights(current => {
+            if (current[id] === height)
+                return current;
+            return { ...current, [id]: height };
+        });
+    }, []);
+    const getExpandedOffset = useCallback((index) => {
+        var _a;
+        const gap = 8;
+        let offset = 0;
+        for (let i = 0; i < index; i++) {
+            const toastId = (_a = toasts[i]) === null || _a === void 0 ? void 0 : _a.id;
+            const h = toastId ? toastHeights[toastId] : undefined;
+            offset += (h !== null && h !== void 0 ? h : 64) + gap;
+        }
+        return offset;
+    }, [toasts, toastHeights]);
+    // Calculate total expanded height for padding (covers gaps between toasts)
+    const totalExpandedHeight = React__default.useMemo(() => {
+        if (!isHovered || toasts.length <= 1)
+            return 0;
+        return getExpandedOffset(toasts.length);
+    }, [isHovered, toasts.length, getExpandedOffset]);
+    const contextValue = useMemo(() => ({
+        toasts,
+        addToast,
+        removeToast,
+        removeAllToasts,
+    }), [toasts, addToast, removeToast, removeAllToasts]);
+    return (jsxs(ToastContext.Provider, { value: contextValue, children: [children, isClient && createPortal(jsx("div", { className: cn(toastTheme.containerStyle, positionStyles[position]), "aria-live": "polite", "aria-label": "Notifications", children: jsx("div", { className: "relative w-80", style: { paddingBottom: isHovered && toasts.length > 1 ? totalExpandedHeight : undefined }, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: jsx(AnimatePresence, { mode: "popLayout", children: toasts.map((toast, index) => (jsx(Toast, { toast: toast, onDismiss: removeToast, index: index, isExpanded: isHovered, totalToasts: toasts.length, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onHeightChange: handleToastHeight, expandedOffset: getExpandedOffset(index), darkMode: darkMode }, toast.id))) }) }) }), document.body)] }));
+};
+const useToastContext = () => {
+    const context = useContext(ToastContext);
+    if (!context) {
+        throw new Error('useToastContext must be used within a ToastProvider');
+    }
+    return context;
+};
+
+export { ToastProvider, useToastContext };

package/dist/components/core/Toast/index.d.ts

@@ -0,0 +1,5 @@
+export { Toast } from './Toast';
+export { ToastProvider, useToastContext } from './ToastProvider';
+export { useToast } from './useToast';
+export type { ToastProps, ToastData, ToastProviderProps, ToastTheme, ToastThemeOverrides, ToastVariant, UseToastReturn, UseToastOptions, } from './Toast.types';
+export { toastTheme } from './Toast.theme';

package/dist/components/core/Toast/useToast.d.ts

@@ -0,0 +1,2 @@
+import { UseToastReturn } from './Toast.types';
+export declare const useToast: () => UseToastReturn;

package/dist/components/core/Toast/useToast.js

@@ -0,0 +1,103 @@
+import React__default, { useCallback } from 'react';
+import { InformationCircleIcon, ExclamationTriangleIcon, XCircleIcon, CheckCircleIcon } from '@heroicons/react/24/solid';
+import { useToastContext } from './ToastProvider.js';
+
+const createSemanticIcon = (IconComponent, colorClass) => {
+    return React__default.createElement(IconComponent, {
+        className: `w-5 h-5 ${colorClass}`,
+    });
+};
+const useToast = () => {
+    const { addToast, removeToast, removeAllToasts } = useToastContext();
+    const toast = useCallback((title, options) => {
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: (options === null || options === void 0 ? void 0 : options.state) || 'default',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: options === null || options === void 0 ? void 0 : options.duration,
+            dismissible: options === null || options === void 0 ? void 0 : options.dismissible,
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: options === null || options === void 0 ? void 0 : options.icon,
+        });
+    }, [addToast]);
+    const success = useCallback((title, options) => {
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: (options === null || options === void 0 ? void 0 : options.state) || 'default',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: options === null || options === void 0 ? void 0 : options.duration,
+            dismissible: options === null || options === void 0 ? void 0 : options.dismissible,
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: (options === null || options === void 0 ? void 0 : options.icon) || createSemanticIcon(CheckCircleIcon, 'text-[var(--color-success)]'),
+        });
+    }, [addToast]);
+    const error = useCallback((title, options) => {
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: (options === null || options === void 0 ? void 0 : options.state) || 'default',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: options === null || options === void 0 ? void 0 : options.duration,
+            dismissible: options === null || options === void 0 ? void 0 : options.dismissible,
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: (options === null || options === void 0 ? void 0 : options.icon) || createSemanticIcon(XCircleIcon, 'text-[var(--color-danger)]'),
+        });
+    }, [addToast]);
+    const warning = useCallback((title, options) => {
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: (options === null || options === void 0 ? void 0 : options.state) || 'default',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: options === null || options === void 0 ? void 0 : options.duration,
+            dismissible: options === null || options === void 0 ? void 0 : options.dismissible,
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: (options === null || options === void 0 ? void 0 : options.icon) || createSemanticIcon(ExclamationTriangleIcon, 'text-[var(--color-warning)]'),
+        });
+    }, [addToast]);
+    const info = useCallback((title, options) => {
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: (options === null || options === void 0 ? void 0 : options.state) || 'default',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: options === null || options === void 0 ? void 0 : options.duration,
+            dismissible: options === null || options === void 0 ? void 0 : options.dismissible,
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: (options === null || options === void 0 ? void 0 : options.icon) || createSemanticIcon(InformationCircleIcon, 'text-[var(--color-primary)]'),
+        });
+    }, [addToast]);
+    const loading = useCallback((title, options) => {
+        var _a, _b;
+        return addToast({
+            title,
+            variant: options === null || options === void 0 ? void 0 : options.variant,
+            state: 'loading',
+            description: options === null || options === void 0 ? void 0 : options.description,
+            duration: (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 0, // Loading toasts don't auto-dismiss by default
+            dismissible: (_b = options === null || options === void 0 ? void 0 : options.dismissible) !== null && _b !== void 0 ? _b : false, // Loading toasts are not dismissible by default
+            action: options === null || options === void 0 ? void 0 : options.action,
+            icon: options === null || options === void 0 ? void 0 : options.icon,
+        });
+    }, [addToast]);
+    const dismiss = useCallback((id) => {
+        removeToast(id);
+    }, [removeToast]);
+    const dismissAll = useCallback(() => {
+        removeAllToasts();
+    }, [removeAllToasts]);
+    return {
+        toast,
+        success,
+        error,
+        warning,
+        info,
+        loading,
+        dismiss,
+        dismissAll,
+    };
+};
+
+export { useToast };

package/dist/components/core/Tooltip/Tooltip.animations.d.ts

@@ -0,0 +1,32 @@
+import { Variants } from 'motion/react';
+import { TooltipPlacement } from './Tooltip.types';
+/**
+ * Base animation variants for the tooltip - optimized for smooth positioning
+ */
+export declare const baseTooltipVariants: Variants;
+/**
+ * Get animation variants based on tooltip placement
+ * @param placement - Tooltip placement (top, right, bottom, left)
+ * @returns Animation variants for the specified placement
+ */
+export declare const getTooltipVariants: (placement: TooltipPlacement) => Variants;
+/**
+ * Spring animation configuration options
+ */
+export declare const tooltipSpringConfig: {
+    light: {
+        type: "spring";
+        stiffness: number;
+        damping: number;
+    };
+    medium: {
+        type: "spring";
+        stiffness: number;
+        damping: number;
+    };
+    bouncy: {
+        type: "spring";
+        stiffness: number;
+        damping: number;
+    };
+};

package/dist/components/core/Tooltip/Tooltip.animations.js

@@ -0,0 +1,80 @@
+// Define optimized spring configurations
+const springConfig = {
+    type: "spring",
+    stiffness: 500,
+    damping: 30
+};
+/**
+ * Base animation variants for the tooltip - optimized for smooth positioning
+ */
+const baseTooltipVariants = {
+    initial: {
+        opacity: 0,
+        transition: { duration: 0.1 }
+    },
+    animate: {
+        opacity: 1,
+        transition: { ...springConfig, duration: 0.2 }
+    },
+    exit: {
+        opacity: 0,
+        transition: { duration: 0.15, damping: 35 }
+    }
+};
+/**
+ * Get animation variants based on tooltip placement
+ * @param placement - Tooltip placement (top, right, bottom, left)
+ * @returns Animation variants for the specified placement
+ */
+const getTooltipVariants = (placement) => {
+    switch (placement) {
+        case 'top':
+            return {
+                ...baseTooltipVariants,
+                initial: { ...baseTooltipVariants.initial, y: 2 },
+                animate: { ...baseTooltipVariants.animate, y: 0 },
+                exit: { ...baseTooltipVariants.exit, y: 2 }
+            };
+        case 'right':
+            return {
+                ...baseTooltipVariants,
+                initial: { ...baseTooltipVariants.initial, x: -2 },
+                animate: { ...baseTooltipVariants.animate, x: 0 },
+                exit: { ...baseTooltipVariants.exit, x: -2 }
+            };
+        case 'bottom':
+            return {
+                ...baseTooltipVariants,
+                initial: { ...baseTooltipVariants.initial, y: -2 },
+                animate: { ...baseTooltipVariants.animate, y: 0 },
+                exit: { ...baseTooltipVariants.exit, y: -2 }
+            };
+        case 'left':
+            return {
+                ...baseTooltipVariants,
+                initial: { ...baseTooltipVariants.initial, x: 2 },
+                animate: { ...baseTooltipVariants.animate, x: 0 },
+                exit: { ...baseTooltipVariants.exit, x: 2 }
+            };
+        default:
+            return baseTooltipVariants;
+    }
+};
+/**
+ * Spring animation configuration options
+ */
+const tooltipSpringConfig = {
+    light: {
+        type: "spring",
+        stiffness: 200,
+        damping: 25
+    },
+    medium: springConfig,
+    bouncy: {
+        type: "spring",
+        stiffness: 400,
+        damping: 15
+    }
+};
+
+export { baseTooltipVariants, getTooltipVariants, tooltipSpringConfig };

package/dist/components/core/Tooltip/Tooltip.d.ts

@@ -0,0 +1,6 @@
+import { TooltipProps } from "./Tooltip.types";
+declare const Tooltip: {
+    ({ content, children, placement, delay, disabled, className, maxWidth, minWidth, showOnFocus, wrapText, id, theme: themeOverrides, "aria-label": ariaLabel, role, offset, darkMode, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Tooltip };

package/dist/components/core/Tooltip/Tooltip.js

@@ -0,0 +1,132 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { useReducedMotion, AnimatePresence, motion } from 'motion/react';
+import { createPortal } from 'react-dom';
+import { cn } from '../../../utils/cn.js';
+import { tooltipTheme } from './Tooltip.theme.js';
+import { getTooltipVariants } from './Tooltip.animations.js';
+import { useSelectPortal } from '../../../hooks/useSelectPortal.js';
+import { useIsClient } from '../../../hooks/useIsClient.js';
+
+/**
+ * Hook to detect dark mode state from document
+ */
+const useDarkMode = () => {
+    const [isDark, setIsDark] = useState(false);
+    useEffect(() => {
+        if (typeof document === "undefined")
+            return;
+        const checkDarkMode = () => {
+            const hasDarkClass = document.documentElement.classList.contains("dark") ||
+                document.body.classList.contains("dark") ||
+                document.querySelector(".dark") !== null;
+            setIsDark(hasDarkClass);
+        };
+        checkDarkMode();
+        // Observe class changes on html and body
+        const observer = new MutationObserver(checkDarkMode);
+        observer.observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ["class"],
+        });
+        observer.observe(document.body, {
+            attributes: true,
+            attributeFilter: ["class"],
+        });
+        return () => observer.disconnect();
+    }, []);
+    return isDark;
+};
+const Tooltip = ({ content, children, placement = "top", delay = 300, disabled = false, className, maxWidth = "360px", minWidth = "fit-content", showOnFocus = true, wrapText = false, id, theme: themeOverrides, "aria-label": ariaLabel, role = "tooltip", offset = 8, darkMode = false, }) => {
+    const [isVisible, setIsVisible] = useState(false);
+    const tooltipRef = useRef(null);
+    const triggerRef = useRef(null);
+    const timerRef = useRef(null);
+    const shouldReduceMotion = useReducedMotion();
+    // Detect dark mode for portal content
+    const isDarkMode = useDarkMode();
+    const isClient = useIsClient();
+    // Merge global theme with component-specific overrides
+    const theme = {
+        ...tooltipTheme,
+        ...(themeOverrides || {}),
+    };
+    // Use the same positioning hook as Popover/Select for consistent behavior
+    const { position, cssVariables, contentRef: portalContentRef} = useSelectPortal({
+        triggerRef,
+        isOpen: isVisible,
+        placement: placement, // TooltipPlacement matches SelectPlacement subset
+        offset,
+        autoWidth: true,
+    });
+    // Event handlers - simplified timer management
+    const handleShowTooltip = useCallback(() => {
+        if (disabled)
+            return;
+        if (timerRef.current) {
+            clearTimeout(timerRef.current);
+        }
+        timerRef.current = setTimeout(() => {
+            setIsVisible(true);
+        }, delay);
+    }, [disabled, delay]);
+    const handleHideTooltip = useCallback(() => {
+        if (timerRef.current) {
+            clearTimeout(timerRef.current);
+        }
+        // Immediate hide for better responsiveness
+        setIsVisible(false);
+    }, []);
+    // Clean up timeout on unmount
+    useEffect(() => {
+        return () => {
+            if (timerRef.current) {
+                clearTimeout(timerRef.current);
+            }
+        };
+    }, []);
+    // Keyboard handler
+    const handleKeyDown = useCallback((e) => {
+        if (e.key === "Escape") {
+            handleHideTooltip();
+        }
+    }, [handleHideTooltip]);
+    // Event handlers for trigger element
+    const triggerHandlers = {
+        onMouseEnter: handleShowTooltip,
+        onMouseLeave: handleHideTooltip,
+        ...(showOnFocus && {
+            onFocus: handleShowTooltip,
+            onBlur: handleHideTooltip,
+        }),
+        onKeyDown: handleKeyDown,
+    };
+    // Combine refs for portal positioning
+    const handleRef = useCallback((el) => {
+        tooltipRef.current = el;
+        if (portalContentRef &&
+            typeof portalContentRef === "object" &&
+            "current" in portalContentRef) {
+            portalContentRef.current = el;
+        }
+    }, [portalContentRef]);
+    // Computed values
+    const textOverflowClass = wrapText
+        ? ""
+        : "text-ellipsis overflow-hidden whitespace-nowrap";
+    const widthClasses = cn(minWidth === "fit-content" ? "w-fit" : "min-w-fit", textOverflowClass);
+    const tooltipContent = (jsx(AnimatePresence, { children: isVisible && (jsx(motion.div, { id: id, role: role, ref: handleRef, style: {
+                maxWidth,
+                minWidth: minWidth !== "fit-content" ? minWidth : undefined,
+                width: "max-content",
+                ...cssVariables,
+                top: `${position.top}px`,
+                left: `${position.left}px`,
+            }, className: cn(theme.baseStyle, widthClasses, className), "aria-hidden": !isVisible, "aria-label": ariaLabel, "aria-live": role === "tooltip" ? "polite" : undefined, variants: shouldReduceMotion ? {} : getTooltipVariants(placement), initial: shouldReduceMotion ? undefined : "initial", animate: shouldReduceMotion ? undefined : "animate", exit: shouldReduceMotion ? undefined : "exit", children: content })) }));
+    return (jsxs("div", { className: "relative inline-block", ref: triggerRef, ...triggerHandlers, tabIndex: showOnFocus ? 0 : undefined, "aria-describedby": isVisible && id ? id : undefined, children: [children, isClient &&
+                createPortal(jsx("div", { className: darkMode || isDarkMode ? "dark" : undefined, children: tooltipContent }), document.body)] }));
+};
+// Set display name for dev tools and Storybook
+Tooltip.displayName = "Tooltip";
+
+export { Tooltip };

package/dist/components/core/Tooltip/Tooltip.theme.d.ts

@@ -0,0 +1,3 @@
+export declare const tooltipTheme: {
+    baseStyle: string;
+};

package/dist/components/core/Tooltip/Tooltip.theme.js

@@ -0,0 +1,7 @@
+const tooltipTheme = {
+    // Base style for the tooltip - using fixed positioning for portal rendering
+    baseStyle: "fixed z-[99] rounded-[var(--tooltip-radius)] py-1 px-2 text-xs text-[var(--color-text-primary)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-primary)] focus-visible:ring-offset-2 pointer-events-none bg-white/60 backdrop-blur-md outline outline-[var(--color-border)] shadow-lg border-t-[1px] border-white " +
+        "dark:bg-neutral-800/80 dark:outline-[var(--color-border)]/80 dark:border-[var(--color-border)]",
+};
+
+export { tooltipTheme };

package/dist/components/core/Tooltip/Tooltip.types.d.ts

@@ -0,0 +1,98 @@
+import { ReactNode } from "react";
+export type TooltipPlacement = "top" | "right" | "bottom" | "left";
+export interface TooltipThemeOverrides {
+    /**
+     * Base style for the tooltip container
+     */
+    baseStyle?: string;
+    /**
+     * Placement styles
+     */
+    top?: string;
+    right?: string;
+    bottom?: string;
+    left?: string;
+}
+export interface TooltipProps {
+    /**
+     * Content to display in the tooltip
+     */
+    content: ReactNode;
+    /**
+     * The element that triggers the tooltip
+     */
+    children: ReactNode;
+    /**
+     * Tooltip placement relative to the child element
+     * @default "top"
+     */
+    placement?: TooltipPlacement;
+    /**
+     * Delay before showing tooltip (in ms)
+     * @default 300
+     */
+    delay?: number;
+    /**
+     * Whether the tooltip is disabled
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Additional classes for the tooltip container
+     */
+    className?: string;
+    /**
+     * Max width for the tooltip content
+     * @default "360px"
+     */
+    maxWidth?: string;
+    /**
+     * Min width for the tooltip content
+     * @default "fit-content"
+     */
+    minWidth?: string | 'fit-content';
+    /**
+     * Whether the tooltip should be shown on focus (improves keyboard accessibility)
+     * @default true
+     */
+    showOnFocus?: boolean;
+    /**
+     * Whether to allow text wrapping for longer content
+     * @default false
+     */
+    wrapText?: boolean;
+    /**
+     * ID to be applied to the tooltip element (important for ARIA)
+     */
+    id?: string;
+    /**
+     * Theme overrides following shadcn patterns
+     */
+    theme?: TooltipThemeOverrides;
+    /**
+     * Custom ARIA label for the tooltip (enhances screen reader support)
+     */
+    'aria-label'?: string;
+    /**
+     * Role override for specific accessibility contexts
+     * @default "tooltip"
+     */
+    role?: 'tooltip' | 'dialog' | 'region';
+    /**
+     * Distance offset between the tooltip and trigger element (in pixels)
+     * Positive values increase the gap, negative values decrease it (can overlap)
+     * The offset is applied based on placement direction:
+     * - top/bottom: affects Y axis
+     * - left/right: affects X axis
+     * @default 8
+     */
+    offset?: number;
+    /**
+     * Force dark mode styling for the component. Use when placing the component
+     * on a dark background while the page is in light mode. This applies the
+     * 'dark' class to the container, making text, borders, and other elements
+     * use light colors for visibility.
+     * @default false
+     */
+    darkMode?: boolean;
+}

package/dist/components/core/Tooltip/index.d.ts

@@ -0,0 +1,3 @@
+export { Tooltip } from './Tooltip';
+export type { TooltipProps, TooltipThemeOverrides, TooltipPlacement } from './Tooltip.types';
+export { baseTooltipVariants, getTooltipVariants, tooltipSpringConfig } from './Tooltip.animations';

package/dist/components/core/Tooltip/useTooltipPositioning.d.ts

@@ -0,0 +1,12 @@
+type Placement = 'top' | 'right' | 'bottom' | 'left';
+interface UseTooltipPositioningProps {
+    tooltipRef: React.RefObject<HTMLDivElement | null>;
+    triggerRef: React.RefObject<HTMLDivElement | null>;
+    placement: Placement;
+    isVisible: boolean;
+}
+export declare const useTooltipPositioning: ({ tooltipRef, triggerRef, placement, isVisible, }: UseTooltipPositioningProps) => {
+    positionTooltip: () => void;
+    debouncedPositioning: () => void;
+};
+export {};

package/dist/components/core/Tree/Tree.animations.d.ts

@@ -0,0 +1,6 @@
+import { Variants, Transition } from 'motion/react';
+export declare const treeNodeVariants: Variants;
+export declare const expandIconVariants: Variants;
+export declare const childrenStagger: Transition;
+export declare const childNodeVariants: Variants;
+export declare const getReducedMotionVariants: (originalVariants: Variants) => Variants;