UNPKG

@buddhacognitivelab/theme-glassmorphic

Version:

Enhanced glassmorphic theme package with dual-mode support, advanced glass effects, interactive UI components, and gesture-based interactions

72 lines (71 loc) 2.64 kB
/** * @fileoverview Enhanced Tooltip Component - Phase 4 * Dual-mode glassmorphic tooltip with advanced theme support */ import React from 'react'; export type TooltipPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'; export type TooltipTrigger = 'hover' | 'click' | 'focus' | 'manual'; export interface EnhancedTooltipProps { /** Tooltip content */ content: React.ReactNode; /** Child element that triggers the tooltip */ children: React.ReactElement; /** Tooltip placement */ placement?: TooltipPlacement; /** Trigger behavior */ trigger?: TooltipTrigger | TooltipTrigger[]; /** Whether tooltip is visible (for manual trigger) */ visible?: boolean; /** Delay before showing tooltip (ms) */ showDelay?: number; /** Delay before hiding tooltip (ms) */ hideDelay?: number; /** Glass effect intensity */ glassIntensity?: 'subtle' | 'prominent' | 'frosted' | 'crystal' | 'ethereal'; /** Glass depth level */ glassDepth?: 'surface' | 'elevated' | 'floating' | 'modal'; /** Tooltip variant */ variant?: 'default' | 'dark' | 'light' | 'error' | 'warning' | 'success' | 'info'; /** Tooltip size */ size?: 'sm' | 'md' | 'lg'; /** Maximum width */ maxWidth?: string; /** Enable arrow */ arrow?: boolean; /** Arrow size */ arrowSize?: number; /** Z-index */ zIndex?: number; /** Enable enhanced hover effects */ enhancedHover?: boolean; /** Enable theme-adaptive styling */ themeAdaptive?: boolean; /** Custom glass tint override */ glassTint?: string; /** Enable gradient border */ gradientBorder?: boolean; /** Animation preset */ animation?: 'none' | 'fade' | 'scale' | 'slide' | 'bounce'; /** Enable backdrop blur */ backdropBlur?: boolean; /** Disable tooltip */ disabled?: boolean; /** Portal container */ portalContainer?: Element; /** Callback when visibility changes */ onVisibilityChange?: (visible: boolean) => void; /** Custom offset from trigger */ offset?: number; /** Enable interactive tooltip */ interactive?: boolean; /** Custom class name */ className?: string; } /** * Enhanced Tooltip Component * * A sophisticated glassmorphic tooltip with dual-mode theme support, * advanced glass effects, and enhanced interactive states. */ export declare const EnhancedTooltip: React.ForwardRefExoticComponent<EnhancedTooltipProps & React.RefAttributes<HTMLDivElement>>; export default EnhancedTooltip;