import type { DialogRootProps, DialogRootEmits, DialogContentProps, DialogContentEmits } from 'reka-ui'; import type { VNode } from 'vue'; import type { AppConfig } from '@nuxt/schema'; import theme from '#build/b24ui/modal'; import type { ButtonProps, IconComponent, LinkPropsKeys } from '../types'; import type { EmitsToProps } from '../types/utils'; import type { ComponentConfig } from '../types/tv'; type Modal = ComponentConfig; export interface ModalProps extends DialogRootProps { title?: string; description?: string; /** The content of the modal. */ content?: Omit & Partial>; /** * Render an overlay behind the modal. * @defaultValue true */ overlay?: boolean; /** * Render an overlay blur behind the modal. * `auto` use `motion-safe`. * @defaultValue 'auto' */ overlayBlur?: Modal['variants']['overlayBlur']; /** * When `true`, enables scrollable overlay mode where content scrolls within the overlay. * @defaultValue false */ scrollable?: boolean; /** * Animate the modal when opening or closing. * @defaultValue true */ transition?: boolean; /** * When `true`, the modal will take up the full screen. * @defaultValue false */ fullscreen?: boolean; /** * Render the modal in a portal. * @defaultValue true */ portal?: boolean | string | HTMLElement; /** * Display a close button to dismiss the modal. * `{ size: 'xs', color: 'air-tertiary-no-accent' }`{lang="ts-type"} * @defaultValue true */ close?: boolean | Omit; /** * The icon displayed in the close button. * @defaultValue icons.close * @IconComponent */ closeIcon?: IconComponent; /** * When `false`, the modal will not close when clicking outside or pressing escape. * @defaultValue false */ dismissible?: boolean; /** * @defaultValue true */ scrollbarThin?: boolean; class?: any; b24ui?: Modal['slots']; } export interface ModalEmits extends DialogRootEmits { 'after:leave': []; 'after:enter': []; 'close:prevent': []; } export interface ModalSlots { default?(props: { open: boolean; }): VNode[]; content?(props: { close: () => void; }): VNode[]; header?(props: { close: () => void; }): VNode[]; title?(props?: {}): VNode[]; description?(props?: {}): VNode[]; actions?(props?: {}): VNode[]; close?(props: { b24ui: Modal['b24ui']; }): VNode[]; body?(props: { close: () => void; }): VNode[]; footer?(props: { close: () => void; }): VNode[]; } declare const _default: typeof __VLS_export; export default _default; declare const __VLS_export: __VLS_WithSlots any; "after:leave": () => any; "after:enter": () => any; "close:prevent": () => any; }, string, import("vue").PublicProps, Readonly & Readonly<{ "onUpdate:open"?: ((value: boolean) => any) | undefined; "onAfter:leave"?: (() => any) | undefined; "onAfter:enter"?: (() => any) | undefined; "onClose:prevent"?: (() => any) | undefined; }>, { close: boolean | Omit; overlay: boolean; transition: boolean; modal: boolean; portal: boolean | string | HTMLElement; overlayBlur: Modal["variants"]["overlayBlur"]; dismissible: boolean; scrollbarThin: boolean; }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ModalSlots>; type __VLS_WithSlots = T & { new (): { $slots: S; }; };