UNPKG

@nex-ui/react

Version:

🎉 A beautiful, modern, and reliable React component library.

90 lines (87 loc) • 3.15 kB
import { ElementType } from 'react'; import { Interpolation } from '@nex-ui/system'; import { ClassValue } from 'clsx'; import { DOMMotionComponents } from 'motion/react'; import { FocusTrapProps } from '../focusTrap/types.js'; import { PopperTriggerProps, PopperCloseProps, PopperRootProps, PopperProps, PopperContentProps } from '../popper/types.js'; import { OverrideProps, HTMLMotionProps } from '../../types/utils.js'; import { PopoverContentVariants } from '../../theme/recipes/popover.js'; type PopoverOwnProps<RootComponent extends ElementType> = Pick<PopperRootProps, 'container' | 'keepMounted' | 'closeOnEscape' | 'placement' | 'offset' | 'flip' | 'shift' | 'closeOnDetached'> & Omit<PopperProps, 'openDelay' | 'closeDelay'> & Pick<FocusTrapProps, 'restoreFocus'> & { /** * The component or element to render as the root. * * @default m.div */ as?: RootComponent; /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx?: Interpolation; /** * Additional class names to apply to the root. */ className?: ClassValue; /** * The props to modify the framer motion animation. */ motionProps?: HTMLMotionProps<'div'>; /** * The delay in milliseconds before the popover opens. * * @default 0 */ openDelay?: number; /** * The delay in milliseconds before the popover closes. * * @default 0 */ closeDelay?: number; }; interface PopoverPropsOverrides { } type PopoverProps<RootComponent extends ElementType = DOMMotionComponents['div']> = OverrideProps<RootComponent, PopoverOwnProps<RootComponent>, PopoverPropsOverrides>; type PopoverContentOwnProps<RootComponent extends ElementType> = { /** * The component or element to render as the root. * * @default 'div' */ as?: RootComponent; /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx?: Interpolation; /** * Additional class names to apply to the root. */ className?: ClassValue; /** * The radius of the Popover content. * * @default 'md' */ radius?: PopoverContentVariants['radius']; /** * The color of the Popover content. * * @default 'default' */ color?: PopoverContentVariants['color']; /** * The maximum width of the popover content. * * @default 480 */ maxWidth?: PopperContentProps['maxWidth']; /** * The maximum height of the popover content. */ maxHeight?: PopperContentProps['maxHeight']; }; interface PopoverContentPropsOverrides { } type PopoverContentProps<RootComponent extends ElementType = 'div'> = OverrideProps<RootComponent, PopoverContentOwnProps<RootComponent>, PopoverContentPropsOverrides>; type PopoverTriggerProps = Omit<PopperTriggerProps, 'action' | 'elementProps' | 'interactive'>; type PopoverCloseProps = PopperCloseProps; export type { PopoverCloseProps, PopoverContentProps, PopoverContentPropsOverrides, PopoverProps, PopoverPropsOverrides, PopoverTriggerProps };