UNPKG

vuetify

Version:

Vue Material Component Framework

737 lines (727 loc) 28.4 kB
import * as vue from 'vue'; import { ComponentPropsOptions, ExtractPropTypes, ComponentPublicInstance, Ref, EffectScope, PropType } from 'vue'; type ClassValue = any; declare const block: readonly ["top", "bottom"]; declare const inline: readonly ["start", "end", "left", "right"]; type Tblock = typeof block[number]; type Tinline = typeof inline[number]; type Anchor = Tblock | Tinline | 'center' | 'center center' | `${Tblock} ${Tinline | 'center'}` | `${Tinline} ${Tblock | 'center'}`; declare class Box { x: number; y: number; width: number; height: number; constructor({ x, y, width, height }: { x: number; y: number; width: number; height: number; }); get top(): number; get bottom(): number; get left(): number; get right(): number; } interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> { filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): Partial<Pick<T, U>>; } type TemplateRef = { (target: Element | ComponentPublicInstance | null): void; value: HTMLElement | ComponentPublicInstance | null | undefined; readonly el: HTMLElement | undefined; }; interface LocationStrategyData { contentEl: Ref<HTMLElement | undefined>; target: Ref<HTMLElement | [x: number, y: number] | undefined>; isActive: Ref<boolean>; isRtl: Ref<boolean>; } type LocationStrategyFn = (data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }; declare const locationStrategies: { static: typeof staticLocationStrategy; connected: typeof connectedLocationStrategy; }; interface StrategyProps$1 { locationStrategy: keyof typeof locationStrategies | LocationStrategyFn; location: Anchor; origin: Anchor | 'auto' | 'overlap'; offset?: number | string | number[]; maxHeight?: number | string; maxWidth?: number | string; minHeight?: number | string; minWidth?: number | string; } declare function staticLocationStrategy(): void; declare function connectedLocationStrategy(data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>): { updateLocation: () => { available: { x: number; y: number; }; contentBox: Box; } | undefined; }; interface ScrollStrategyData { root: Ref<HTMLElement | undefined>; contentEl: Ref<HTMLElement | undefined>; targetEl: Ref<HTMLElement | undefined>; isActive: Ref<boolean>; updateLocation: Ref<((e: Event) => void) | undefined>; } type ScrollStrategyFn = (data: ScrollStrategyData, props: StrategyProps, scope: EffectScope) => void; declare const scrollStrategies: { none: null; close: typeof closeScrollStrategy; block: typeof blockScrollStrategy; reposition: typeof repositionScrollStrategy; }; interface StrategyProps { scrollStrategy: keyof typeof scrollStrategies | ScrollStrategyFn; contained: boolean | undefined; } declare function closeScrollStrategy(data: ScrollStrategyData): void; declare function blockScrollStrategy(data: ScrollStrategyData, props: StrategyProps): void; declare function repositionScrollStrategy(data: ScrollStrategyData, props: StrategyProps, scope: EffectScope): void; declare const VOverlay: { new (...args: any[]): vue.CreateComponentPublicInstance<{ absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnHover: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; } & { offset?: string | number | number[] | undefined; height?: string | number | undefined; width?: string | number | undefined; maxHeight?: string | number | undefined; maxWidth?: string | number | undefined; minHeight?: string | number | undefined; minWidth?: string | number | undefined; opacity?: string | number | undefined; target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined; class?: any; theme?: string | undefined; contentClass?: any; activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined; closeDelay?: string | number | undefined; openDelay?: string | number | undefined; openOnClick?: boolean | undefined; openOnFocus?: boolean | undefined; contentProps?: any; attach?: string | boolean | Element | undefined; } & { $children?: vue.VNodeChild | { default?: ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild); 'v-slots'?: { default?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | undefined; } & { "v-slot:default"?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; "v-slot:activator"?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } & { onAfterEnter?: (() => any) | undefined; onAfterLeave?: (() => any) | undefined; "onUpdate:modelValue"?: ((value: boolean) => any) | undefined; "onClick:outside"?: ((e: MouseEvent) => any) | undefined; }, { activatorEl: Ref<HTMLElement | undefined>; scrimEl: Ref<HTMLElement | undefined>; target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>; animateClick: () => void; contentEl: Ref<HTMLElement | undefined>; globalTop: Readonly<Ref<boolean>>; localTop: vue.ComputedRef<boolean>; updateLocation: Ref<((e: Event) => void) | undefined>; }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, { 'click:outside': (e: MouseEvent) => true; 'update:modelValue': (value: boolean) => true; afterEnter: () => true; afterLeave: () => true; }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & { absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnHover: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; } & { offset?: string | number | number[] | undefined; height?: string | number | undefined; width?: string | number | undefined; maxHeight?: string | number | undefined; maxWidth?: string | number | undefined; minHeight?: string | number | undefined; minWidth?: string | number | undefined; opacity?: string | number | undefined; target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined; class?: any; theme?: string | undefined; contentClass?: any; activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined; closeDelay?: string | number | undefined; openDelay?: string | number | undefined; openOnClick?: boolean | undefined; openOnFocus?: boolean | undefined; contentProps?: any; attach?: string | boolean | Element | undefined; } & { $children?: vue.VNodeChild | { default?: ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild); 'v-slots'?: { default?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | undefined; } & { "v-slot:default"?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; "v-slot:activator"?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } & { onAfterEnter?: (() => any) | undefined; onAfterLeave?: (() => any) | undefined; "onUpdate:modelValue"?: ((value: boolean) => any) | undefined; "onClick:outside"?: ((e: MouseEvent) => any) | undefined; }, { absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnClick: boolean; openOnHover: boolean; openOnFocus: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; }, true, {}, vue.SlotsType<Partial<{ default: (arg: { isActive: Ref<boolean>; }) => vue.VNode[]; activator: (arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNode[]; }>>, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, { absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnHover: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; } & { offset?: string | number | number[] | undefined; height?: string | number | undefined; width?: string | number | undefined; maxHeight?: string | number | undefined; maxWidth?: string | number | undefined; minHeight?: string | number | undefined; minWidth?: string | number | undefined; opacity?: string | number | undefined; target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined; class?: any; theme?: string | undefined; contentClass?: any; activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined; closeDelay?: string | number | undefined; openDelay?: string | number | undefined; openOnClick?: boolean | undefined; openOnFocus?: boolean | undefined; contentProps?: any; attach?: string | boolean | Element | undefined; } & { $children?: vue.VNodeChild | { default?: ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild); 'v-slots'?: { default?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | undefined; } & { "v-slot:default"?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; "v-slot:activator"?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } & { onAfterEnter?: (() => any) | undefined; onAfterLeave?: (() => any) | undefined; "onUpdate:modelValue"?: ((value: boolean) => any) | undefined; "onClick:outside"?: ((e: MouseEvent) => any) | undefined; }, { activatorEl: Ref<HTMLElement | undefined>; scrimEl: Ref<HTMLElement | undefined>; target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>; animateClick: () => void; contentEl: Ref<HTMLElement | undefined>; globalTop: Readonly<Ref<boolean>>; localTop: vue.ComputedRef<boolean>; updateLocation: Ref<((e: Event) => void) | undefined>; }, {}, {}, {}, { absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnClick: boolean; openOnHover: boolean; openOnFocus: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; }>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & vue.ComponentOptionsBase<{ absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnHover: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; } & { offset?: string | number | number[] | undefined; height?: string | number | undefined; width?: string | number | undefined; maxHeight?: string | number | undefined; maxWidth?: string | number | undefined; minHeight?: string | number | undefined; minWidth?: string | number | undefined; opacity?: string | number | undefined; target?: Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined; class?: any; theme?: string | undefined; contentClass?: any; activator?: Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined; closeDelay?: string | number | undefined; openDelay?: string | number | undefined; openOnClick?: boolean | undefined; openOnFocus?: boolean | undefined; contentProps?: any; attach?: string | boolean | Element | undefined; } & { $children?: vue.VNodeChild | { default?: ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild); 'v-slots'?: { default?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; activator?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } | undefined; } & { "v-slot:default"?: false | ((arg: { isActive: Ref<boolean>; }) => vue.VNodeChild) | undefined; "v-slot:activator"?: false | ((arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNodeChild) | undefined; } & { onAfterEnter?: (() => any) | undefined; onAfterLeave?: (() => any) | undefined; "onUpdate:modelValue"?: ((value: boolean) => any) | undefined; "onClick:outside"?: ((e: MouseEvent) => any) | undefined; }, { activatorEl: Ref<HTMLElement | undefined>; scrimEl: Ref<HTMLElement | undefined>; target: vue.ComputedRef<HTMLElement | [x: number, y: number] | undefined>; animateClick: () => void; contentEl: Ref<HTMLElement | undefined>; globalTop: Readonly<Ref<boolean>>; localTop: vue.ComputedRef<boolean>; updateLocation: Ref<((e: Event) => void) | undefined>; }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, { 'click:outside': (e: MouseEvent) => true; 'update:modelValue': (value: boolean) => true; afterEnter: () => true; afterLeave: () => true; }, string, { absolute: boolean; location: Anchor; origin: "auto" | Anchor | "overlap"; transition: string | boolean | (vue.TransitionProps & { component?: vue.Component; }); zIndex: string | number; style: vue.StyleValue; eager: boolean; disabled: boolean; modelValue: boolean; locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps$1, contentStyles: Ref<Record<string, string>>) => undefined | { updateLocation: (e?: Event) => void; }); scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps, scope: vue.EffectScope) => void) | "reposition"; activatorProps: Record<string, any>; openOnClick: boolean; openOnHover: boolean; openOnFocus: boolean; closeOnContentClick: boolean; closeOnBack: boolean; contained: boolean; noClickAnimation: boolean; persistent: boolean; scrim: string | boolean; _disableGlobalStack: boolean; }, {}, string, vue.SlotsType<Partial<{ default: (arg: { isActive: Ref<boolean>; }) => vue.VNode[]; activator: (arg: { isActive: boolean; props: Record<string, any>; targetRef: TemplateRef; }) => vue.VNode[]; }>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{ transition: { type: PropType<string | boolean | (vue.TransitionProps & { component?: vue.Component; })>; default: string; validator: (val: unknown) => boolean; }; theme: StringConstructor; scrollStrategy: { type: PropType<StrategyProps["scrollStrategy"]>; default: string; validator: (val: any) => boolean; }; locationStrategy: { type: PropType<StrategyProps$1["locationStrategy"]>; default: string; validator: (val: any) => boolean; }; location: { type: PropType<StrategyProps$1["location"]>; default: string; }; origin: { type: PropType<StrategyProps$1["origin"]>; default: string; }; offset: PropType<StrategyProps$1["offset"]>; eager: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; width: (StringConstructor | NumberConstructor)[]; class: PropType<ClassValue>; style: { type: PropType<vue.StyleValue>; default: null; }; closeDelay: (StringConstructor | NumberConstructor)[]; openDelay: (StringConstructor | NumberConstructor)[]; target: PropType<Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined>; activator: PropType<Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined>; activatorProps: { type: PropType<Record<string, any>>; default: () => {}; }; openOnClick: { type: BooleanConstructor; default: undefined; }; openOnHover: BooleanConstructor; openOnFocus: { type: BooleanConstructor; default: undefined; }; closeOnContentClick: BooleanConstructor; absolute: BooleanConstructor; attach: PropType<boolean | string | Element>; closeOnBack: { type: BooleanConstructor; default: boolean; }; contained: BooleanConstructor; contentClass: null; contentProps: null; disabled: BooleanConstructor; opacity: (StringConstructor | NumberConstructor)[]; noClickAnimation: BooleanConstructor; modelValue: BooleanConstructor; persistent: BooleanConstructor; scrim: { type: (StringConstructor | BooleanConstructor)[]; default: boolean; }; zIndex: { type: (StringConstructor | NumberConstructor)[]; default: number; }; _disableGlobalStack: BooleanConstructor; }, vue.ExtractPropTypes<{ transition: { type: PropType<string | boolean | (vue.TransitionProps & { component?: vue.Component; })>; default: string; validator: (val: unknown) => boolean; }; theme: StringConstructor; scrollStrategy: { type: PropType<StrategyProps["scrollStrategy"]>; default: string; validator: (val: any) => boolean; }; locationStrategy: { type: PropType<StrategyProps$1["locationStrategy"]>; default: string; validator: (val: any) => boolean; }; location: { type: PropType<StrategyProps$1["location"]>; default: string; }; origin: { type: PropType<StrategyProps$1["origin"]>; default: string; }; offset: PropType<StrategyProps$1["offset"]>; eager: BooleanConstructor; height: (StringConstructor | NumberConstructor)[]; maxHeight: (StringConstructor | NumberConstructor)[]; maxWidth: (StringConstructor | NumberConstructor)[]; minHeight: (StringConstructor | NumberConstructor)[]; minWidth: (StringConstructor | NumberConstructor)[]; width: (StringConstructor | NumberConstructor)[]; class: PropType<ClassValue>; style: { type: PropType<vue.StyleValue>; default: null; }; closeDelay: (StringConstructor | NumberConstructor)[]; openDelay: (StringConstructor | NumberConstructor)[]; target: PropType<Element | "cursor" | "parent" | (string & {}) | vue.ComponentPublicInstance | [x: number, y: number] | undefined>; activator: PropType<Element | "parent" | (string & {}) | vue.ComponentPublicInstance | undefined>; activatorProps: { type: PropType<Record<string, any>>; default: () => {}; }; openOnClick: { type: BooleanConstructor; default: undefined; }; openOnHover: BooleanConstructor; openOnFocus: { type: BooleanConstructor; default: undefined; }; closeOnContentClick: BooleanConstructor; absolute: BooleanConstructor; attach: PropType<boolean | string | Element>; closeOnBack: { type: BooleanConstructor; default: boolean; }; contained: BooleanConstructor; contentClass: null; contentProps: null; disabled: BooleanConstructor; opacity: (StringConstructor | NumberConstructor)[]; noClickAnimation: BooleanConstructor; modelValue: BooleanConstructor; persistent: BooleanConstructor; scrim: { type: (StringConstructor | BooleanConstructor)[]; default: boolean; }; zIndex: { type: (StringConstructor | NumberConstructor)[]; default: number; }; _disableGlobalStack: BooleanConstructor; }>>; type VOverlay = InstanceType<typeof VOverlay>; export { VOverlay };