goobs-frontend/dist/components/Tooltip/index.d.ts

A comprehensive React-based libary for building modern web applications

import { default as React } from 'react';
/**
 * Comprehensive styling options for the tooltip. Theme selects the base
 * palette ('light' default); the rest are caller overrides applied as CSS
 * custom properties, falling back to the theme value when omitted.
 */
export interface TooltipStyles {
    /** Theme variant: 'light' (default), 'dark', or 'sacred'. */
    theme?: 'light' | 'dark' | 'sacred';
    /** Bubble background (also recolors the arrow to match). */
    backgroundColor?: string;
    /** Bubble border color (rendered as a 1px solid border). */
    borderColor?: string;
    /** Bubble border radius. */
    borderRadius?: string;
    /** Bubble box shadow. */
    boxShadow?: string;
    /** Bubble backdrop-filter. */
    backdropFilter?: string;
    /** Bubble font family. */
    fontFamily?: string;
    /** Bubble font size. */
    fontSize?: string;
    /** Bubble font weight. */
    fontWeight?: string | number;
    /** Bubble letter spacing. */
    letterSpacing?: string;
    /** Bubble text color. */
    color?: string;
    /** Bubble text shadow. */
    textShadow?: string;
    /** Bubble padding. */
    padding?: string;
    /** CSS animation shorthand on the bubble. */
    animation?: string;
    /** Bubble z-index — floored at 10000 so tooltips clear modals. */
    zIndex?: number;
    /** Arrow border width in px (default 5; 6 on sacred). Also feeds the anchor offset math. */
    arrowSize?: number;
    /** With transitionEasing, replaces the opacity/transform show transition; ignored alone. */
    transitionDuration?: string;
    /** With transitionDuration, replaces the opacity/transform show transition; ignored alone. */
    transitionEasing?: string;
    /** Bubble scale while hidden/entering. */
    enterScale?: number;
    /** Bubble scale when visible. */
    visibleScale?: number;
}
export interface TooltipProps {
    children: React.ReactNode;
    title: string;
    tooltipplacement?: 'left' | 'right' | 'top' | 'bottom';
    offsetX?: number;
    offsetY?: number;
    /** Comprehensive styling options including theme, custom colors, and layout properties. */
    styles?: TooltipStyles;
    arrow?: boolean;
    open?: boolean;
    onOpen?: () => void;
    onClose?: () => void;
    enterDelay?: number;
    leaveDelay?: number;
    /** Render tooltip in a portal (useful for modals) */
    usePortal?: boolean;
    /** Portal container (defaults to document.body) */
    portalContainer?: Element;
    /** Custom arrow positioning - percentage from left/top edge (0-100) */
    arrowPosition?: number;
}
declare const StyledTooltip: React.FC<TooltipProps>;
export default StyledTooltip;
//# sourceMappingURL=index.d.ts.map