@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS
100 lines (97 loc) • 3.03 kB
TypeScript
import { AllHTMLAttributes, ReactNode, CSSProperties, ComponentProps } from 'react';
import { Elevations } from '../Paper/Paper.constants.js';
import Popover from '../Popover/Popover.js';
import { Orientations } from './Menu.constants.js';
import '../Popover/Popover.types.js';
import '@radix-ui/react-popover';
import '../Paper/Paper.types.js';
import '../constants-QFINMz1u.js';
type CombinedRefs = {
container: HTMLDivElement | null;
menu: HTMLDivElement | null;
};
type SubMenuCombinedRefs = {
content: HTMLDivElement | null;
trigger: HTMLElement | null;
};
interface MenuProps extends AllHTMLAttributes<HTMLDivElement> {
children: ReactNode;
condensed?: boolean;
disabled?: boolean;
elevation?: `${Elevations}`;
embedded?: boolean;
fullWidth?: boolean;
menu?: {
className?: string;
style?: CSSProperties;
};
orientation?: `${Orientations}`;
rainbow?: boolean;
}
interface MenuItemProps extends AllHTMLAttributes<HTMLDivElement> {
active?: boolean;
children?: ReactNode;
condensed?: boolean;
disabled?: boolean;
href?: string;
icon?: ReactNode;
label?: string;
rainbow?: boolean;
target?: HTMLAnchorElement['target'];
onActivate?: () => void;
}
interface MenuItemGroupProps extends AllHTMLAttributes<HTMLDivElement> {
children: ReactNode;
label: string;
condensed?: boolean;
disabled?: boolean;
rainbow?: boolean;
}
type MenuItemSeparatorProps = AllHTMLAttributes<HTMLDivElement>;
interface SubMenuProps extends Omit<AllHTMLAttributes<HTMLDivElement>, 'content'> {
children: ReactNode;
active?: boolean;
align?: ComponentProps<typeof Popover>['align'];
condensed?: boolean;
condensedItems?: boolean;
defaultOpen?: boolean;
disabled?: boolean;
elevation?: `${Elevations}`;
icon?: ReactNode;
open?: boolean;
popover?: boolean;
popup?: {
className?: string;
content?: {
className?: string;
positionner?: {
className?: string;
style?: CSSProperties;
};
style?: CSSProperties;
wrapper?: {
className?: string;
style?: CSSProperties;
};
};
style?: CSSProperties;
trigger?: {
className?: string;
style?: CSSProperties;
wrapper?: {
className?: string;
style?: CSSProperties;
};
};
};
rainbow?: boolean;
side?: ComponentProps<typeof Popover>['side'];
triggerOnHover?: boolean;
withIndicator?: boolean;
withScroll?: boolean;
onClose?: () => void;
onInteractOutside?: ComponentProps<typeof Popover>['onInteractOutside'];
onOpen?: () => void;
onSubMenuOpenChange?: ComponentProps<typeof Popover>['onOpenChange'];
}
export type { CombinedRefs, MenuItemGroupProps, MenuItemProps, MenuItemSeparatorProps, MenuProps, SubMenuCombinedRefs, SubMenuProps };