UNPKG

@bitrix24/b24ui-nuxt

Version:

Bitrix24 UI-Kit for developing web applications REST API for NUXT & VUE

534 lines (533 loc) 15.4 kB
import type { VariantProps } from 'tailwind-variants'; import type { DropdownMenuRootProps, DropdownMenuRootEmits, DropdownMenuContentProps, DropdownMenuContentEmits, DropdownMenuArrowProps } from 'reka-ui'; import type { AvatarProps, KbdProps, LinkProps, IconComponent } from '../types'; import type { ArrayOrNested, DynamicSlots, MergeTypes, NestedItem, PartialString, EmitsToProps } from '../types/utils'; declare const dropdownMenu: import("tailwind-variants").TVReturnType<{ color: { default: string; danger: string; success: string; warning: string; primary: string; secondary: string; collab: string; ai: string; }; active: { false: { item: string; itemLeadingIcon: string; }; true: { item: string; itemLeadingIcon: string; }; }; loading: { true: { itemLeadingIcon: string; }; }; size: { xs: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; sm: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; md: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; lg: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; }; }, { content: string; arrow: string; group: string; label: string; separator: string; item: string; itemLeadingIcon: string; itemLeadingAvatar: string; itemLeadingAvatarSize: string; itemTrailing: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; itemLabel: string; itemLabelExternalIcon: string; }, undefined, { color: { default: string; danger: string; success: string; warning: string; primary: string; secondary: string; collab: string; ai: string; }; active: { false: { item: string; itemLeadingIcon: string; }; true: { item: string; itemLeadingIcon: string; }; }; loading: { true: { itemLeadingIcon: string; }; }; size: { xs: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; sm: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; md: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; lg: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; }; }, { content: string; arrow: string; group: string; label: string; separator: string; item: string; itemLeadingIcon: string; itemLeadingAvatar: string; itemLeadingAvatarSize: string; itemTrailing: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; itemLabel: string; itemLabelExternalIcon: string; }, import("tailwind-variants").TVReturnType<{ color: { default: string; danger: string; success: string; warning: string; primary: string; secondary: string; collab: string; ai: string; }; active: { false: { item: string; itemLeadingIcon: string; }; true: { item: string; itemLeadingIcon: string; }; }; loading: { true: { itemLeadingIcon: string; }; }; size: { xs: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; sm: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; md: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; lg: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; }; }, { content: string; arrow: string; group: string; label: string; separator: string; item: string; itemLeadingIcon: string; itemLeadingAvatar: string; itemLeadingAvatarSize: string; itemTrailing: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; itemLabel: string; itemLabelExternalIcon: string; }, undefined, { color: { default: string; danger: string; success: string; warning: string; primary: string; secondary: string; collab: string; ai: string; }; active: { false: { item: string; itemLeadingIcon: string; }; true: { item: string; itemLeadingIcon: string; }; }; loading: { true: { itemLeadingIcon: string; }; }; size: { xs: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; sm: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; md: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; lg: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; }; }, { content: string; arrow: string; group: string; label: string; separator: string; item: string; itemLeadingIcon: string; itemLeadingAvatar: string; itemLeadingAvatarSize: string; itemTrailing: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; itemLabel: string; itemLabelExternalIcon: string; }, import("tailwind-variants").TVReturnType<{ color: { default: string; danger: string; success: string; warning: string; primary: string; secondary: string; collab: string; ai: string; }; active: { false: { item: string; itemLeadingIcon: string; }; true: { item: string; itemLeadingIcon: string; }; }; loading: { true: { itemLeadingIcon: string; }; }; size: { xs: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; sm: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; md: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; lg: { label: string; item: string; itemLeadingIcon: string; itemLeadingAvatarSize: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; }; }; }, { content: string; arrow: string; group: string; label: string; separator: string; item: string; itemLeadingIcon: string; itemLeadingAvatar: string; itemLeadingAvatarSize: string; itemTrailing: string; itemTrailingIcon: string; itemTrailingKbds: string; itemTrailingKbdsSize: string; itemLabel: string; itemLabelExternalIcon: string; }, undefined, unknown, unknown, undefined>>>; type DropdownMenuVariants = VariantProps<typeof dropdownMenu>; export interface DropdownMenuItem extends Omit<LinkProps, 'type' | 'raw' | 'custom'> { label?: string; /** * Display an icon on the left side. * @IconComponent */ icon?: IconComponent; color?: DropdownMenuVariants['color']; avatar?: AvatarProps; content?: Omit<DropdownMenuContentProps, 'as' | 'asChild' | 'forceMount'> & Partial<EmitsToProps<DropdownMenuContentEmits>>; kbds?: KbdProps['value'][] | KbdProps[]; /** * The item type. * @defaultValue 'link' */ type?: 'label' | 'separator' | 'link' | 'checkbox'; slot?: string; loading?: boolean; disabled?: boolean; checked?: boolean; open?: boolean; defaultOpen?: boolean; children?: ArrayOrNested<DropdownMenuItem>; onSelect?(e: Event): void; onUpdateChecked?(checked: boolean): void; [key: string]: any; } export interface DropdownMenuProps<T extends ArrayOrNested<DropdownMenuItem> = ArrayOrNested<DropdownMenuItem>> extends Omit<DropdownMenuRootProps, 'dir'> { /** * @defaultValue 'md' */ size?: DropdownMenuVariants['size']; items?: T; /** * The icon displayed when an item is checked. * @defaultValue icons.check * @IconComponent */ checkedIcon?: IconComponent; /** * The icon displayed when the item is an external link. * Set to `false` to hide the external icon. * @defaultValue icons.external * @IconComponent */ externalIcon?: boolean | IconComponent; /** * The content of the menu. * @defaultValue { side: 'bottom', sideOffset: 8, collisionPadding: 8 } */ content?: Omit<DropdownMenuContentProps, 'as' | 'asChild' | 'forceMount'> & Partial<EmitsToProps<DropdownMenuContentEmits>>; /** * Display an arrow alongside the menu. * @defaultValue false */ arrow?: boolean | Omit<DropdownMenuArrowProps, 'as' | 'asChild'>; /** * Render the menu in a portal. * @defaultValue true */ portal?: boolean; /** * The key used to get the label from the item. * @defaultValue 'label' */ labelKey?: keyof NestedItem<T>; /** * @defaultValue false */ disabled?: boolean; class?: any; b24ui?: PartialString<typeof dropdownMenu.slots>; } export interface DropdownMenuEmits extends DropdownMenuRootEmits { } type SlotProps<T extends DropdownMenuItem> = (props: { item: T; active?: boolean; index: number; }) => any; export type DropdownMenuSlots<A extends ArrayOrNested<DropdownMenuItem> = ArrayOrNested<DropdownMenuItem>, T extends NestedItem<A> = NestedItem<A>> = { 'default'(props: { open: boolean; }): any; 'item': SlotProps<T>; 'item-leading': SlotProps<T>; 'item-label': SlotProps<T>; 'item-trailing': SlotProps<T>; } & DynamicSlots<MergeTypes<T>, 'leading' | 'label' | 'trailing', { active?: boolean; index: number; }>; declare const _default: <T extends ArrayOrNested<DropdownMenuItem>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{ props: __VLS_PrettifyLocal<any & DropdownMenuProps<T> & Partial<{}>> & (import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps); expose(exposed: import("vue").ShallowUnwrapRef<{}>): void; attrs: any; slots: Readonly<{ default(props: { open: boolean; }): any; item: SlotProps<NestedItem<T>>; 'item-leading': SlotProps<NestedItem<T>>; 'item-label': SlotProps<NestedItem<T>>; 'item-trailing': SlotProps<NestedItem<T>>; } & DynamicSlots<MergeTypes<NestedItem<T>>, "label" | "trailing" | "leading", { active?: boolean; index: number; }>> & { default(props: { open: boolean; }): any; item: SlotProps<NestedItem<T>>; 'item-leading': SlotProps<NestedItem<T>>; 'item-label': SlotProps<NestedItem<T>>; 'item-trailing': SlotProps<NestedItem<T>>; } & DynamicSlots<MergeTypes<NestedItem<T>>, "label" | "trailing" | "leading", { active?: boolean; index: number; }>; emit: (evt: "update:open", payload: boolean) => void; }>) => import("vue").VNode & { __ctx?: Awaited<typeof __VLS_setup>; }; export default _default; type __VLS_PrettifyLocal<T> = { [K in keyof T]: T[K]; } & {};