UNPKG

@snowball-tech/fractal

Version:

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

102 lines (99 loc) 4.07 kB
import { DropdownMenuItem, DropdownMenuContentProps, Root, Sub, DropdownMenuSubContentProps, SubTrigger } from '@radix-ui/react-dropdown-menu'; import { AllHTMLAttributes, ComponentProps, ReactNode, CSSProperties, MouseEvent } from 'react'; import { InputRadioGroupProps, InputRadioProps } from '../InputRadio/InputRadio.types.js'; import { PaperProps } from '../Paper/Paper.types.js'; import '@radix-ui/react-radio-group'; import '../InputRadio/InputRadio.constants.js'; import '../constants-QFINMz1u.js'; import '../Paper/Paper.constants.js'; import '../Typography/Typography.constants.js'; type CombinedRefs = { container: HTMLDivElement | null; dropdown: HTMLDivElement | null; trigger: HTMLButtonElement | null; }; type SubDropdownCombinedRefs = { content: HTMLDivElement | null; trigger: HTMLDivElement | null; }; interface DropdownProps extends Omit<AllHTMLAttributes<HTMLDivElement>, 'onClick'> { children: ReactNode; align?: DropdownMenuContentProps['align']; asSelect?: boolean; condensed?: boolean; defaultOpen?: boolean; disabled?: boolean; dropdown?: Partial<{ className?: string; style?: CSSProperties; } & Omit<DropdownMenuContentProps, 'align' | 'asChild' | 'onInteractOutside' | 'side'>>; elevation?: PaperProps['elevation']; fullWidth?: boolean; open?: boolean; rainbow?: boolean; side?: DropdownMenuContentProps['side']; toggleOnTriggerClick?: boolean; trigger?: ReactNode; triggerAsButton?: boolean; width?: number | string | 'auto' | 'fit' | 'full' | 'trigger'; withIndicator?: boolean; withScroll?: boolean; onClick?: (event: MouseEvent<HTMLButtonElement>) => void; onClose?: () => void; onInteractOutside?: DropdownMenuContentProps['onInteractOutside']; onMenuOpenChange?: ComponentProps<typeof Root>['onOpenChange']; onOpen?: () => void; } interface DropdownItemProps extends Omit<AllHTMLAttributes<HTMLAnchorElement> & ComponentProps<typeof DropdownMenuItem>, 'asChild' | 'label' | 'onClick' | 'onSelect'> { active?: boolean; children?: ReactNode; condensed?: boolean; disabled?: boolean; href?: string; icon?: ReactNode; label?: ReactNode; rainbow?: boolean; target?: HTMLAnchorElement['target']; value?: string; onClick?: ComponentProps<typeof DropdownMenuItem>['onSelect']; onSelect?: ComponentProps<typeof DropdownMenuItem>['onSelect']; } interface DropdownItemGroupProps extends Omit<AllHTMLAttributes<HTMLDivElement>, 'label'> { children: ReactNode; label: ReactNode; condensed?: boolean; disabled?: boolean; labelElement?: keyof HTMLElementTagNameMap; rainbow?: boolean; } interface SubDropdownProps extends Omit<AllHTMLAttributes<HTMLDivElement> & ComponentProps<typeof Sub>, 'asChild' | 'content' | 'onClick'> { children: ReactNode; condensed?: boolean; condensedItems?: boolean; content?: Partial<{ className?: string; style?: CSSProperties; } & Omit<DropdownMenuSubContentProps, 'asChild' | 'onInteractOutside'>>; defaultOpen?: boolean; disabled?: boolean; icon?: ReactNode; open?: boolean; rainbow?: boolean; withIndicator?: boolean; withScroll?: boolean; onClick?: ComponentProps<typeof SubTrigger>['onSelect']; onClose?: () => void; onInteractOutside?: DropdownMenuSubContentProps['onInteractOutside']; onOpen?: () => void; onSubMenuOpenChange?: ComponentProps<typeof Sub>['onOpenChange']; } type DropdownRadioGroupProps = { condensed?: boolean; rainbow?: boolean; } & Omit<InputRadioGroupProps, 'fullWidth' | 'orientation' | 'variant'>; type DropdownRadioItemProps = { condensed?: boolean; rainbow?: boolean; } & Omit<InputRadioProps, 'fullWidth'>; type DropdownItemSeparatorProps = AllHTMLAttributes<HTMLDivElement>; export type { CombinedRefs, DropdownItemGroupProps, DropdownItemProps, DropdownItemSeparatorProps, DropdownProps, DropdownRadioGroupProps, DropdownRadioItemProps, SubDropdownCombinedRefs, SubDropdownProps };