its-just-ui/dist/components/Popover/types.d.ts

ITS Just UI - The easiest and best React UI component library. Modern, accessible, and customizable components built with TypeScript and Tailwind CSS. Simple to use, production-ready components for building beautiful user interfaces with ease.

import { default as React } from 'react';
import { PopoverPositionResult } from './positioning';

export type PopoverVariant = 'default' | 'bordered' | 'shadowed' | 'filled' | 'translucent' | 'minimal';
export type PopoverSize = 'sm' | 'md' | 'lg';
export type PopoverPosition = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end' | 'auto';
export type PopoverTransition = 'fade' | 'scale' | 'slide' | 'pop' | 'none';
export type PopoverTrigger = 'click' | 'hover' | 'manual';
export type PopoverTone = 'light' | 'dark' | 'info' | 'danger' | 'success' | 'warning';
export interface PopoverAnimationConfig {
    enterDuration?: number;
    exitDuration?: number;
    easing?: string;
    animationType?: PopoverTransition;
}
export interface PopoverEventHandlers {
    onOpenChange?: (open: boolean) => void;
    onClose?: () => void;
    onOpen?: () => void;
    onEscapeKeyDown?: (event: KeyboardEvent) => void;
    onOutsideClick?: (event: MouseEvent) => void;
    onAnimationStart?: () => void;
    onAnimationEnd?: () => void;
    onEnter?: () => void;
    onExit?: () => void;
    onFocus?: () => void;
    onBlur?: () => void;
    onMouseEnter?: () => void;
    onMouseLeave?: () => void;
}
export interface PopoverContextValue {
    open: boolean;
    setOpen: (open: boolean) => void;
    position: PopoverPosition;
    trigger: PopoverTrigger;
    variant: PopoverVariant;
    size: PopoverSize;
    tone: PopoverTone;
    closeOnBlur: boolean;
    closeOnEscape: boolean;
    closeOnOutsideClick: boolean;
    hasArrow: boolean;
    triggerId: string;
    contentId: string;
    titleId: string;
    descriptionId: string;
    arrowRef: React.RefObject<HTMLDivElement>;
    triggerRef: React.RefObject<HTMLElement>;
    contentRef: React.RefObject<HTMLDivElement>;
    animation: PopoverAnimationConfig;
    positioningResult?: PopoverPositionResult | null;
    onOpenChange?: (open: boolean) => void;
    onClose?: () => void;
    onOpen?: () => void;
    borderColor?: string;
    borderWidth?: string;
    borderRadius?: string;
    borderStyle?: string;
    backgroundColor?: string;
    textColor?: string;
    shadowColor?: string;
    arrowColor?: string;
    fontSize?: string;
    fontWeight?: string;
    fontFamily?: string;
    headingColor?: string;
    descriptionColor?: string;
    padding?: string;
    margin?: string;
    gap?: string;
    offset?: string;
    arrowSize?: string;
    offsetTop?: number;
    offsetBottom?: number;
    offsetLeft?: number;
    offsetRight?: number;
    focusBorderColor?: string;
    focusRingColor?: string;
    focusRingOffset?: string;
    boxShadow?: string;
    hoverShadow?: string;
    focusBoxShadow?: string;
}
export interface PopoverRenderProps {
    open: boolean;
    onOpenChange: (open: boolean) => void;
    position: PopoverPosition;
    variant: PopoverVariant;
    size: PopoverSize;
}
export type RenderContentFunction = (props: PopoverRenderProps) => React.ReactNode;
export type RenderTriggerFunction = (props: PopoverRenderProps) => React.ReactNode;