@snowball-tech/fractal/dist/Popover/Popover.types.d.ts

Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS

import { PopoverContentProps, Root } from '@radix-ui/react-popover';
import { AllHTMLAttributes, ReactNode, CSSProperties, ComponentProps } from 'react';
import { Elevations } from '../Paper/Paper.constants.js';

type CombinedRefs = {
    container: HTMLDivElement | null;
    content: HTMLDivElement | null;
    trigger: HTMLElement | null;
};
interface PopoverProps extends AllHTMLAttributes<HTMLDivElement> {
    children: ReactNode;
    align?: PopoverContentProps['align'];
    closeButtonLabel?: string;
    disabled?: boolean;
    elevation?: `${Elevations}`;
    fullWidth?: boolean;
    modal?: boolean;
    open?: boolean;
    popover?: Partial<{
        className?: string;
        style?: CSSProperties;
    } & Omit<PopoverContentProps, 'align' | 'asChild' | 'onInteractOutside' | 'side'>>;
    side?: PopoverContentProps['side'];
    toggleOnTriggerClick?: boolean;
    toggleOnTriggerHover?: boolean;
    trigger?: ReactNode;
    triggerAsButton?: boolean;
    width?: number | string | 'auto' | 'fit' | 'full' | 'trigger';
    withArrow?: boolean;
    withCloseButton?: boolean;
    withScroll?: boolean;
    onClose?: () => void;
    onCloseButtonClick?: () => void;
    onInteractOutside?: PopoverContentProps['onInteractOutside'];
    onOpen?: () => void;
    onOpenChange?: ComponentProps<typeof Root>['onOpenChange'];
}

export type { CombinedRefs, PopoverProps };