@cladd-ui/react 0.0.10 → 0.0.12

package/components/Tooltip.d.ts

@@ -1,48 +1,32 @@
-import { ReactNode, Ref } from 'react';
-import { Color } from '../types';
-import { SurfaceProps } from './Surface';
-type OffsetValue = number | string;
-export type TooltipPosition = 'top' | 'bottom';
-interface TooltipOwnProps {
-    /** Controlled open state. Default `false`. Pair with `onOpenChange`. */
-    open?: boolean;
-    /** Fires whenever the open state should change. */
-    onOpenChange?: (open: boolean) => void;
-    /** Tailwind z-index utility for the tooltip surface. Default `'z-50'`. */
-    zIndex?: string;
-    /** Extra classes applied to the tooltip root `Surface`. */
-    className?: string;
-    /** Extra classes applied to the inner content area. Default includes `px-2 py-1`. */
-    contentClassName?: string;
-    /** Ref to the element the tooltip should anchor against (CSS anchor positioning). */
-    anchorRef?: React.RefObject<HTMLElement | null>;
-    /** Portal target selector. Default `'#app, #__next, #root'`. */
-    root?: string;
-    /** Anchor side. Default `'top'`. */
-    position?: TooltipPosition;
+import { ReactNode } from 'react';
+import { TooltipPrimitiveProps, TooltipPosition } from './TooltipPrimitive';
+export type { TooltipPosition };
+export interface TooltipProps extends Omit<TooltipPrimitiveProps, 'children' | 'ref'> {
     /**
-     * Forwarded to the underlying `Surface` as `level`. Default depends on theme:
-     * `1` for light theme, `5` for dark theme - so the tooltip pops on top of any surface.
+     * When provided, the component acts as a wrapper around `children` (a single element)
+     * and shows this content as a tooltip on hover/focus/touch. When omitted, the component
+     * forwards all props to the underlying `TooltipPrimitive` and `children` is rendered as
+     * the tooltip content (controlled mode via `open`/`anchorRef`).
+     */
+    tooltip?: ReactNode;
+    /**
+     * Wrapper mode: the single element to attach the tooltip to.
+     * Primitive mode: the tooltip content.
      */
-    surfaceLevel?: number;
-    /** Distance from anchor in pixels (number) or any CSS length (`'8px'`, `'50%'`). Default `4`. */
-    offset?: OffsetValue;
-    /** Accent color token. Sets the tooltip's `color-{name}` class. */
-    color?: Color;
-    /** Tooltip content. */
     children?: ReactNode;
-    /** Fires when the open transition begins. */
-    onOpen?: () => void;
-    /** Fires after the open transition completes. */
-    onOpened?: () => void;
-    /** Fires when the close transition begins. */
-    onClose?: () => void;
-    /** Fires after the close transition completes. */
-    onClosed?: () => void;
-    /** Forwarded to the tooltip surface root. */
-    ref?: Ref<HTMLDivElement>;
+    /**
+     * Wrapper mode only. When `true` (default), delays showing the tooltip (500ms on touch,
+     * 1000ms on mouse) and uses a shared global timer so successive hovers feel snappier -
+     * same UX as system tooltips. When `false`, the tooltip appears immediately on pointer enter.
+     */
+    timeout?: boolean;
+    /** Wrapper mode only. Composed onto the wrapped child element's `onClick`. */
+    onClick?: (e: React.MouseEvent) => void;
+    /**
+     * Wrapper mode: composed onto the wrapped child's ref (alongside the internal anchor ref).
+     * Primitive mode: forwarded to the tooltip surface root.
+     */
+    ref?: React.Ref<any>;
 }
-export type TooltipProps = TooltipOwnProps & Omit<SurfaceProps, keyof TooltipOwnProps>;
-export declare const Tooltip: ({ open, onOpenChange, ...rest }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const Tooltip: (props: TooltipProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Tooltip.d.ts.map

package/components/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAM1D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,OAAO,EAAW,YAAY,EAAE,MAAM,WAAW,CAAC;AAElD,KAAK,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAEnC,MAAM,MAAM,eAAe,GAAG,KAAK,GAAG,QAAQ,CAAC;AAW/C,UAAU,eAAe;IACvB,wEAAwE;IACxE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,mDAAmD;IACnD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,0EAA0E;IAC1E,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qFAAqF;IACrF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,qFAAqF;IACrF,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAChD,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iGAAiG;IACjG,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,mEAAmE;IACnE,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6CAA6C;IAC7C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,YAAY,GAAG,eAAe,GACxC,IAAI,CAAC,YAAY,EAAE,MAAM,eAAe,CAAC,CAAC;AAoI5C,eAAO,MAAM,OAAO,GAAI,iCAIrB,YAAY,4CAId,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6C,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7E,OAAO,EAEL,qBAAqB,EACrB,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAE5B,YAAY,EAAE,eAAe,EAAE,CAAC;AAiBhC,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,qBAAqB,EACrB,UAAU,GAAG,KAAK,CACnB;IACC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8EAA8E;IAC9E,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CACtB;AA4JD,eAAO,MAAM,OAAO,GAAI,OAAO,YAAY,4CAW1C,CAAC"}

package/components/Tooltip.js

@@ -1,90 +1,145 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useRef } from 'react';
-import { createPortal } from 'react-dom';
-import { useModalUtils } from '../hooks/use-modal-utils';
-import { useTheme } from '../hooks/use-theme';
-import { cn } from '../shared/cn';
-import { ModalController } from './ModalController';
-import { Surface } from './Surface';
-const resolveOffset = (value) => {
-    if (typeof value === 'number')
-        return `${value}px`;
-    if (value.endsWith('%')) {
-        const fraction = parseFloat(value) / 100;
-        return `calc(anchor-size(height) * ${fraction})`;
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { cloneElement, useEffect, useRef, useState } from 'react';
+import { useDevice } from '../hooks/use-device';
+import { TooltipPrimitive, } from './TooltipPrimitive';
+let tooltipGlobalTimeout = 0;
+let tooltipGlobalTimeoutId = 0;
+const resetGlobalTimeout = () => {
+    const device = useDevice();
+    tooltipGlobalTimeout = device.mobile ? 500 : 1000;
+};
+const getGlobalTimeout = () => {
+    if (tooltipGlobalTimeout === null) {
+        resetGlobalTimeout();
     }
-    return value;
+    return tooltipGlobalTimeout;
 };
-const TooltipRoot = (props) => {
-    const theme = useTheme();
-    const { phase = 'closed', onPhaseChange = () => { }, zIndex = 'z-50', className = '', contentClassName = '', anchorRef, root = '#app, #__next, #root', position = 'top', offset = 4, surfaceLevel = theme === 'light' ? 1 : 5, color, children, onOpen = () => { }, onOpened = () => { }, onClose = () => { }, onClosed = () => { }, ref, ...rest } = props;
-    const anchorNameRef = useRef('');
-    // Reuse existing anchor-name if target already has one (e.g. from Popover),
-    // otherwise generate a shared one
-    if (anchorRef?.current) {
-        const existing = anchorRef.current.style.getPropertyValue('anchor-name');
-        if (existing) {
-            anchorNameRef.current = existing;
+const TooltipWrapper = ({ tooltip, children: originalChild, timeout = true, onClick: forwardedOnClick, ref: forwardedRef, ...primitiveProps }) => {
+    const [modalState, setModalState] = useState(false);
+    const elRef = useRef(null);
+    const tooltipVisibleRef = useRef(false);
+    const preventContextMenuRef = useRef(false);
+    const pointerTimeoutRef = useRef(null);
+    const newRef = (el) => {
+        elRef.current = el;
+        const originalChildRef = originalChild?.props?.ref;
+        if (originalChildRef && typeof originalChildRef === 'function')
+            originalChildRef(el);
+        else if (originalChildRef &&
+            Object.keys(originalChildRef).includes('current')) {
+            originalChildRef.current = el;
         }
-        else if (!anchorNameRef.current) {
-            anchorNameRef.current = `--anchor-${Math.random().toString(36).slice(2, 8)}`;
+        if (typeof forwardedRef === 'function')
+            forwardedRef(el);
+        else if (forwardedRef &&
+            typeof forwardedRef === 'object' &&
+            'current' in forwardedRef) {
+            forwardedRef.current = el;
         }
-    }
-    const anchorName = anchorNameRef.current;
-    const elRef = useRef(null);
-    const containerElRef = useRef(null);
-    const { opened, open, close } = useModalUtils({
-        phase,
-        onPhaseChange,
-        onOpen,
-        onOpened,
-        onClose,
-        onClosed,
-        transitionEndElRef: elRef,
-        closeOnEscape() {
-            if (containerElRef.current && containerElRef.current.nextElementSibling) {
-                const nextEl = containerElRef.current.nextElementSibling;
-                if (nextEl.matches('.popover, .dialog')) {
-                    return false;
-                }
+    };
+    const showTooltip = () => {
+        if (!tooltip)
+            return;
+        clearTimeout(tooltipGlobalTimeoutId);
+        pointerTimeoutRef.current = setTimeout(() => {
+            tooltipVisibleRef.current = true;
+            setModalState(true);
+            if (timeout) {
+                tooltipGlobalTimeout = 0;
             }
-            return true;
-        },
-    });
-    // Set anchor-name on target element if not already set
-    useEffect(() => {
-        const anchorEl = anchorRef?.current;
-        if (!anchorEl || !anchorName)
+        }, timeout ? getGlobalTimeout() : 0);
+    };
+    const hideTooltip = () => {
+        if (!tooltip)
             return;
-        if (!anchorEl.style.getPropertyValue('anchor-name')) {
-            anchorEl.style.setProperty('anchor-name', anchorName);
+        tooltipVisibleRef.current = false;
+        setModalState(false);
+        clearTimeout(pointerTimeoutRef.current);
+        if (timeout) {
+            tooltipGlobalTimeoutId = setTimeout(() => {
+                resetGlobalTimeout();
+            }, 1000);
         }
-    }, [anchorRef, anchorName]);
-    useEffect(() => {
-        requestAnimationFrame(() => {
-            open();
-        });
-    }, []);
-    useEffect(() => {
-        if (containerElRef.current) {
-            containerElRef.current.__Tooltip = { close };
+    };
+    const onContextMenu = (e) => {
+        if (!tooltip)
+            return;
+        if (preventContextMenuRef.current) {
+            e.preventDefault();
+        }
+    };
+    const onClick = (_e) => {
+        if (!tooltip)
+            return;
+        if (tooltipVisibleRef.current) {
+            hideTooltip();
         }
-    }, []);
-    const isTop = position === 'top';
-    const tooltipStyle = {
-        positionAnchor: anchorName,
-        positionArea: isTop ? 'top center' : 'bottom center',
-        positionTryFallbacks: 'flip-block',
-        ...(offset
-            ? { [isTop ? 'marginBottom' : 'marginTop']: resolveOffset(offset) }
-            : {}),
     };
-    const content = (_jsx("div", { className: "tooltip pointer-events-none", ref: containerElRef, children: _jsx(Surface, { ref: (el) => {
-                elRef.current = el;
-                if (ref)
-                    ref.current = el;
-            }, style: tooltipStyle, level: surfaceLevel, outline: true, variant: "gradient", contentClassName: cn('px-2 py-1', contentClassName), className: cn('pointer-events-none fixed max-h-[50vh] w-max max-w-50 overflow-auto rounded-xl text-xs leading-normal font-medium transition-[opacity,transform,scale]', color && `color-` + color, opened ? 'scale-100 opacity-100' : '', phase === 'opened' && 'duration-200', phase === 'closing' && 'duration-200', (phase === 'closing' || !opened) && 'scale-50 opacity-0', zIndex, isTop ? 'origin-bottom' : 'origin-top', className), ...rest, children: children }) }));
-    return root ? createPortal(content, document.querySelector(root)) : content;
+    const onPointer = (e) => {
+        if (!tooltip)
+            return;
+        const mouseEvents = ['pointerenter', 'pointerleave', 'pointercancel'];
+        const touchEvents = ['pointerdown', 'pointerup', 'pointercancel'];
+        if ((e.pointerType === 'mouse' && !mouseEvents.includes(e.type)) ||
+            (e.pointerType === 'touch' && !touchEvents.includes(e.type))) {
+            return;
+        }
+        if (e.type === 'pointerenter') {
+            showTooltip();
+        }
+        if (e.type === 'pointerleave' || e.type === 'pointercancel') {
+            preventContextMenuRef.current = false;
+            hideTooltip();
+        }
+        if (e.type === 'pointerdown' && !tooltipVisibleRef.current) {
+            preventContextMenuRef.current = true;
+            showTooltip();
+        }
+        if (e.type === 'pointerup') {
+            preventContextMenuRef.current = false;
+            hideTooltip();
+        }
+    };
+    useEffect(() => {
+        const el = elRef.current;
+        if (el) {
+            el.addEventListener('click', onClick);
+            el.addEventListener('contextmenu', onContextMenu);
+            el.addEventListener('pointerenter', onPointer);
+            el.addEventListener('pointerdown', onPointer);
+            document.addEventListener('pointerup', onPointer);
+            document.addEventListener('pointercancel', onPointer);
+            el.addEventListener('pointerleave', onPointer);
+        }
+        return () => {
+            if (el) {
+                el.removeEventListener('click', onClick);
+                el.removeEventListener('contextmenu', onContextMenu);
+                el.removeEventListener('pointerenter', onPointer);
+                el.removeEventListener('pointerdown', onPointer);
+                document.removeEventListener('pointerup', onPointer);
+                document.removeEventListener('pointercancel', onPointer);
+                el.removeEventListener('pointerleave', onPointer);
+            }
+        };
+    });
+    const cloneProps = { ref: newRef };
+    if (forwardedOnClick) {
+        const originalOnClick = originalChild?.props?.onClick;
+        cloneProps.onClick = (e) => {
+            forwardedOnClick(e);
+            if (originalOnClick)
+                originalOnClick(e);
+        };
+    }
+    const newChild = cloneElement(originalChild, cloneProps);
+    return (_jsxs(_Fragment, { children: [newChild, tooltip && (_jsx(TooltipPrimitive, { ...primitiveProps, open: modalState, onOpenChange: setModalState, anchorRef: elRef, children: tooltip }))] }));
+};
+export const Tooltip = (props) => {
+    if (props.tooltip === undefined) {
+        const { tooltip: _t, timeout: _to, onClick: _oc, ...primitiveProps } = props;
+        return _jsx(TooltipPrimitive, { ...primitiveProps });
+    }
+    return _jsx(TooltipWrapper, { ...props });
 };
-export const Tooltip = ({ open = false, onOpenChange = () => { }, ...rest }) => (_jsx(ModalController, { open: open, onOpenChange: onOpenChange, children: _jsx(TooltipRoot, { ...rest }) }));
 //# sourceMappingURL=Tooltip.js.map

package/components/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"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"}

package/components/TooltipPrimitive.d.ts

@@ -0,0 +1,48 @@
+import { ReactNode, Ref } from 'react';
+import { Color } from '../types';
+import { SurfaceProps } from './Surface';
+type OffsetValue = number | string;
+export type TooltipPosition = 'top' | 'bottom';
+interface TooltipPrimitiveOwnProps {
+    /** Controlled open state. Default `false`. Pair with `onOpenChange`. */
+    open?: boolean;
+    /** Fires whenever the open state should change. */
+    onOpenChange?: (open: boolean) => void;
+    /** Tailwind z-index utility for the tooltip surface. Default `'z-50'`. */
+    zIndex?: string;
+    /** Extra classes applied to the tooltip root `Surface`. */
+    className?: string;
+    /** Extra classes applied to the inner content area. Default includes `px-2 py-1`. */
+    contentClassName?: string;
+    /** Ref to the element the tooltip should anchor against (CSS anchor positioning). */
+    anchorRef?: React.RefObject<HTMLElement | null>;
+    /** Portal target selector. Default `'#app, #__next, #root'`. */
+    root?: string;
+    /** Anchor side. Default `'top'`. */
+    position?: TooltipPosition;
+    /**
+     * Forwarded to the underlying `Surface` as `level`. Default depends on theme:
+     * `1` for light theme, `5` for dark theme - so the tooltip pops on top of any surface.
+     */
+    surfaceLevel?: number | string;
+    /** Distance from anchor in pixels (number) or any CSS length (`'8px'`, `'50%'`). Default `4`. */
+    offset?: OffsetValue;
+    /** Accent color token. Sets the tooltip's `color-{name}` class. */
+    color?: Color;
+    /** Tooltip content. */
+    children?: ReactNode;
+    /** Fires when the open transition begins. */
+    onOpen?: () => void;
+    /** Fires after the open transition completes. */
+    onOpened?: () => void;
+    /** Fires when the close transition begins. */
+    onClose?: () => void;
+    /** Fires after the close transition completes. */
+    onClosed?: () => void;
+    /** Forwarded to the tooltip surface root. */
+    ref?: Ref<HTMLDivElement>;
+}
+export type TooltipPrimitiveProps = TooltipPrimitiveOwnProps & Omit<SurfaceProps, keyof TooltipPrimitiveOwnProps>;
+export declare const TooltipPrimitive: ({ open, onOpenChange, ...rest }: TooltipPrimitiveProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=TooltipPrimitive.d.ts.map

package/components/TooltipPrimitive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipPrimitive.d.ts","sourceRoot":"","sources":["../../../src/components/TooltipPrimitive.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAM1D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,OAAO,EAAW,YAAY,EAAE,MAAM,WAAW,CAAC;AAElD,KAAK,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAEnC,MAAM,MAAM,eAAe,GAAG,KAAK,GAAG,QAAQ,CAAC;AAW/C,UAAU,wBAAwB;IAChC,wEAAwE;IACxE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,mDAAmD;IACnD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,0EAA0E;IAC1E,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qFAAqF;IACrF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,qFAAqF;IACrF,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAChD,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,iGAAiG;IACjG,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,mEAAmE;IACnE,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6CAA6C;IAC7C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,qBAAqB,GAAG,wBAAwB,GAC1D,IAAI,CAAC,YAAY,EAAE,MAAM,wBAAwB,CAAC,CAAC;AAuIrD,eAAO,MAAM,gBAAgB,GAAI,iCAI9B,qBAAqB,4CAIvB,CAAC"}

package/components/TooltipPrimitive.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import { createPortal } from 'react-dom';
+import { useModalUtils } from '../hooks/use-modal-utils';
+import { useTheme } from '../hooks/use-theme';
+import { cn } from '../shared/cn';
+import { ModalController } from './ModalController';
+import { Surface } from './Surface';
+const resolveOffset = (value) => {
+    if (typeof value === 'number')
+        return `${value}px`;
+    if (value.endsWith('%')) {
+        const fraction = parseFloat(value) / 100;
+        return `calc(anchor-size(height) * ${fraction})`;
+    }
+    return value;
+};
+const TooltipPrimitiveRoot = (props) => {
+    const theme = useTheme();
+    const { phase = 'closed', onPhaseChange = () => { }, zIndex = 'z-50', className = '', contentClassName = '', anchorRef, root = '#app, #__next, #root', position = 'top', offset = 4, surfaceLevel = theme === 'light' ? 1 : 5, color, children, onOpen = () => { }, onOpened = () => { }, onClose = () => { }, onClosed = () => { }, ref, ...rest } = props;
+    const anchorNameRef = useRef('');
+    // Reuse existing anchor-name if target already has one (e.g. from Popover),
+    // otherwise generate a shared one
+    if (anchorRef?.current) {
+        const existing = anchorRef.current.style.getPropertyValue('anchor-name');
+        if (existing) {
+            anchorNameRef.current = existing;
+        }
+        else if (!anchorNameRef.current) {
+            anchorNameRef.current = `--anchor-${Math.random().toString(36).slice(2, 8)}`;
+        }
+    }
+    const anchorName = anchorNameRef.current;
+    const elRef = useRef(null);
+    const containerElRef = useRef(null);
+    const { opened, open, close } = useModalUtils({
+        phase,
+        onPhaseChange,
+        onOpen,
+        onOpened,
+        onClose,
+        onClosed,
+        transitionEndElRef: elRef,
+        closeOnEscape() {
+            if (containerElRef.current && containerElRef.current.nextElementSibling) {
+                const nextEl = containerElRef.current.nextElementSibling;
+                if (nextEl.matches('.popover, .dialog')) {
+                    return false;
+                }
+            }
+            return true;
+        },
+    });
+    // Set anchor-name on target element if not already set
+    useEffect(() => {
+        const anchorEl = anchorRef?.current;
+        if (!anchorEl || !anchorName)
+            return;
+        if (!anchorEl.style.getPropertyValue('anchor-name')) {
+            anchorEl.style.setProperty('anchor-name', anchorName);
+        }
+    }, [anchorRef, anchorName]);
+    useEffect(() => {
+        requestAnimationFrame(() => {
+            open();
+        });
+    }, []);
+    useEffect(() => {
+        if (containerElRef.current) {
+            containerElRef.current.__TooltipPrimitive = { close };
+        }
+    }, []);
+    const isTop = position === 'top';
+    const tooltipStyle = {
+        positionAnchor: anchorName,
+        positionArea: isTop ? 'top center' : 'bottom center',
+        positionTryFallbacks: 'flip-block',
+        ...(offset
+            ? { [isTop ? 'marginBottom' : 'marginTop']: resolveOffset(offset) }
+            : {}),
+    };
+    const content = (_jsx("div", { className: "tooltip pointer-events-none", ref: containerElRef, children: _jsx(Surface, { ref: (el) => {
+                elRef.current = el;
+                if (ref)
+                    ref.current = el;
+            }, style: tooltipStyle, level: surfaceLevel, outline: true, variant: "gradient", contentClassName: cn('px-2 py-1', contentClassName), className: cn('pointer-events-none fixed max-h-[50vh] w-max max-w-50 overflow-auto rounded-xl text-xs leading-normal font-medium transition-[opacity,transform,scale]', color && `color-` + color, opened ? 'scale-100 opacity-100' : '', phase === 'opened' && 'duration-200', phase === 'closing' && 'duration-200', (phase === 'closing' || !opened) && 'scale-50 opacity-0', zIndex, isTop ? 'origin-bottom' : 'origin-top', className), ...rest, children: children }) }));
+    return root ? createPortal(content, document.querySelector(root)) : content;
+};
+export const TooltipPrimitive = ({ open = false, onOpenChange = () => { }, ...rest }) => (_jsx(ModalController, { open: open, onOpenChange: onOpenChange, children: _jsx(TooltipPrimitiveRoot, { ...rest }) }));
+//# sourceMappingURL=TooltipPrimitive.js.map

package/components/TooltipPrimitive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipPrimitive.js","sourceRoot":"","sources":["../../../src/components/TooltipPrimitive.tsx"],"names":[],"mappings":"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"}

package/hooks/use-device.js

@@ -1,7 +1,7 @@
 let deviceCalculated = null;
 function calcDevice({ userAgent } = {}) {
-    const supportTouch = typeof window !== "undefined" &&
-        ("ontouchstart" in window ||
+    const supportTouch = typeof window !== 'undefined' &&
+        ('ontouchstart' in window ||
             (window.DocumentTouch &&
                 document instanceof window.DocumentTouch));
     const platform = window.navigator.platform;
@@ -19,19 +19,19 @@ function calcDevice({ userAgent } = {}) {
     let ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
     const ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
     const iphone = !ipad && ua.match(/(iPhone\sOS|iOS|iPhone;\sCPU\sOS)\s([\d_]+)/);
-    const electron = ua.toLowerCase().indexOf("electron") >= 0;
-    const nwjs = typeof window.nw !== "undefined" &&
+    const electron = ua.toLowerCase().indexOf('electron') >= 0;
+    const nwjs = typeof window.nw !== 'undefined' &&
         // @ts-ignore
-        typeof process !== "undefined" &&
+        typeof process !== 'undefined' &&
         // @ts-ignore
-        typeof process.versions !== "undefined" &&
+        typeof process.versions !== 'undefined' &&
         // @ts-ignore
-        typeof process.versions.nw !== "undefined";
-    let macos = platform === "MacIntel";
+        typeof process.versions.nw !== 'undefined';
+    let macos = platform === 'MacIntel';
     if (!ipad && macos && supportTouch) {
         ipad = ua.match(/(Version)\/([\d.]+)/);
         if (!ipad)
-            ipad = ["", "Version", "13_0_0"];
+            ipad = ['', 'Version', '13_0_0'];
         macos = false;
     }
     // Android

package/hooks/use-modal-utils.d.ts

@@ -1,4 +1,4 @@
-import { ModalPhase } from "../components/ModalController";
+import { ModalPhase } from '../components/ModalController';
 export declare const useModalUtils: ({ phase, onPhaseChange, lazy, onClose, onClosed, onOpen, onOpened, transitionEndElRef, closeOnEscape, }: {
     phase: ModalPhase;
     onPhaseChange?: (phase: ModalPhase) => void;