@jsonforms/vue-vuetify
Version:
Vue Vuetify renderers for JSON Forms
1,270 lines (1,269 loc) • 456 kB
TypeScript
import { ControlElement, JsonSchema, JsonFormsRendererRegistryEntry, JsonFormsCellRendererRegistryEntry, Translator, RankedTester } from '@jsonforms/core';
import { MaskOptions, MaskaDetail } from 'maska';
import { IconValue, IconAliases } from '../icons';
import { DefineComponent, Ref, ComputedRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, CreateComponentPublicInstanceWithMixins, StyleValue, VNodeChild, VNodeProps, AllowedComponentProps, ComponentCustomProps, SlotsType, VNode, GlobalComponents, GlobalDirectives, ComponentOptionsBase, PropType, InjectionKey, ExtractPropTypes, RendererNode, RendererElement, TransitionProps, Component, ComponentPublicInstance, ShallowRef, ComponentInternalInstance, DebuggerEvent, nextTick, WatchOptions, WatchStopHandle, ShallowUnwrapRef, ComponentCustomProperties, Prop, ObjectDirective, FunctionDirective } from 'vue';
import { Styles } from '..';
import { AppliedOptions, ControlWrapperType, ControlWrapperProps } from '../util';
import { JSXComponent, Anchor, FilterPropsOptions, TemplateRef } from 'vuetify/lib/util/index.mjs';
import { Density } from 'vuetify/lib/composables/density.mjs';
import { RouteLocationAsRelativeGeneric, RouteLocationAsPathGeneric, RouteLocationRaw } from 'vue-router';
import { IconValue } from 'vuetify/lib/composables/icons.mjs';
import { GroupItemProvide, GroupProvide } from 'vuetify/lib/composables/group.mjs';
import { JSXComponent, Anchor, LocationStrategyFunction, ScrollStrategyFunction, ValidationRule, DisplayBreakpoint } from 'vuetify/lib/types.mjs';
import { FilterPropsOptions, GenericProps } from 'vuetify/lib/util/defineComponent.mjs';
import { Variant } from 'vuetify/lib/composables/variant.mjs';
import { ClassValue } from 'vuetify/lib/composables/component.mjs';
import { RippleDirectiveBinding } from 'vuetify/directives/ripple';
import { CalendarWeekdays } from 'vuetify/lib/composables/calendar.mjs';
import { VDatePickerSlots } from 'vuetify/lib/components/VDatePicker/VDatePicker.mjs';
import { VTimePickerViewMode } from 'vuetify/lib/components/VTimePicker/shared.mjs';
import { AllowFunction, Period } from 'vuetify/lib/components/VTimePicker/VTimePicker.mjs';
import { LocationStrategyFunction, StrategyProps } from 'vuetify/lib/components/VOverlay/locationStrategies.mjs';
import { ScrollStrategyFunction, StrategyProps } from 'vuetify/lib/components/VOverlay/scrollStrategies.mjs';
import { OnCleanup } from '@vue/reactivity';
import { ValidationResult, ValidationProps } from 'vuetify/lib/composables/validation.mjs';
import { VMessageSlot } from 'vuetify/lib/components/VMessages/VMessages.mjs';
import { DefaultInputSlot, VFieldSlot, VFieldSlots } from 'vuetify/lib/components/VField/VField.mjs';
import { VInputSlot, VInputSlots } from 'vuetify/lib/components/VInput/VInput.mjs';
import { LoaderSlotProps } from 'vuetify/lib/composables/loader.mjs';
import { VCounterSlot } from 'vuetify/lib/components/VCounter/VCounter.mjs';
import { ValidationAlias } from 'vuetify/labs/rules';
import { ALIGN_CONTENT_VALUES, ALIGN_VALUES } from 'vuetify/lib/components/VGrid/VRow.mjs';
import { ALIGN_SELF_VALUES } from 'vuetify/lib/components/VGrid/VCol.mjs';
import { VTabsSlot, TabItem, VTabsSlots } from 'vuetify/lib/components/VTabs/VTabs.mjs';
import { TouchHandlers } from 'vuetify/directives/touch';
import { ControlProps, VWindowSlots } from 'vuetify/lib/components/VWindow/VWindow.mjs';
import { VConfirmEditSlots } from 'vuetify/lib/components/VConfirmEdit/VConfirmEdit.mjs';
declare const controlRenderer: DefineComponent<{
schema: JsonSchema;
uischema: ControlElement;
path: string;
enabled?: boolean | undefined;
renderers?: JsonFormsRendererRegistryEntry[] | undefined;
cells?: JsonFormsCellRendererRegistryEntry[] | undefined;
config?: any;
}, {
showMenu: Ref<boolean, boolean>;
t: ComputedRef<Translator>;
adaptValue: (value: any) => any;
activeTab: Ref<"time" | "date", "time" | "date">;
mobile: ComputedRef<boolean>;
icons: {
current: ComputedRef<IconAliases>;
};
dateTimeFormat: ComputedRef<string>;
options: ComputedRef<MaskOptions> | null;
useMask: boolean;
maska: {
masked: string;
unmasked: string;
completed: boolean;
};
control: ComputedRef<{
uischema: ControlElement;
schema: NonNullable<JsonSchema>;
path: string;
enabled: boolean;
renderers: JsonFormsRendererRegistryEntry[];
cells: JsonFormsCellRendererRegistryEntry[] & {
tester: RankedTester;
cell: any;
}[];
config: any;
label: string;
description: string;
required: NonNullable<boolean | undefined>;
i18nKeyPrefix: string;
errors: string;
data: any;
rootSchema: NonNullable<JsonSchema>;
id: string;
visible: boolean;
}> & ComputedRef<{
uischema: ControlElement;
path: string;
config: any;
label: string;
description: string;
required: boolean;
errors: string;
id: string;
visible: boolean;
enabled: boolean;
} & {
errors: string;
}>;
handleChange(path: string, value: any): void;
styles: Styles;
isFocused: Ref<boolean, boolean>;
appliedOptions: ComputedRef<any>;
controlWrapper: ComputedRef<{
id: string;
description: string;
errors: string;
label: string;
visible: boolean;
required: boolean;
}>;
onChange: (value: any) => void;
vuetifyProps: (path: string) => any;
persistentHint: () => boolean;
computedLabel: ComputedRef<string>;
clearable: ComputedRef<any>;
touched: Ref<boolean, boolean>;
handleBlur: () => void;
handleFocus: () => void;
rawErrors: ComputedRef<string>;
}, {}, {
pickerIcon(): IconValue;
useTabLayout(): boolean;
dateTimeSaveFormat(): string;
formats(): string[];
useSeconds(): boolean;
ampm(): boolean;
minDate(): string | undefined;
maxDate(): string | undefined;
minTime(): string | undefined;
maxTime(): string | undefined;
inputModel: {
get(): string | null;
set(val: string | null): void;
};
pickerValue: {
get(): {
date: Date | undefined;
time: string | undefined;
};
set(val: {
date: Date | undefined;
time: string | undefined;
}): void;
};
cancelLabel(): string;
okLabel(): string;
showActions(): boolean;
}, {
onPickerChange(dateValue?: Date, timeValue?: string): void;
}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{
schema: JsonSchema;
uischema: ControlElement;
path: string;
enabled?: boolean | undefined;
renderers?: JsonFormsRendererRegistryEntry[] | undefined;
cells?: JsonFormsCellRendererRegistryEntry[] | undefined;
config?: any;
}> & Readonly<{}>, {
enabled: boolean;
renderers: JsonFormsRendererRegistryEntry[];
cells: JsonFormsCellRendererRegistryEntry[];
config: Record<string, any>;
}, {}, {
ControlWrapper: DefineComponent<{
id?: string | undefined;
description?: string | undefined;
errors?: string | undefined;
label?: string | undefined;
visible?: boolean | undefined;
required?: boolean | undefined;
isFocused?: boolean | undefined;
styles?: Styles | undefined;
appliedOptions?: AppliedOptions | undefined;
}, {
WrapperComponent: ControlWrapperType;
props: ControlWrapperProps;
}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{
id?: string | undefined;
description?: string | undefined;
errors?: string | undefined;
label?: string | undefined;
visible?: boolean | undefined;
required?: boolean | undefined;
isFocused?: boolean | undefined;
styles?: Styles | undefined;
appliedOptions?: AppliedOptions | undefined;
}> & Readonly<{}>, {
visible: boolean;
required: boolean;
isFocused: boolean;
}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
VBtn: {
new (...args: any[]): CreateComponentPublicInstanceWithMixins<{
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
style: StyleValue;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
} & {
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: boolean | undefined;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
value?: any;
loading?: string | boolean | undefined;
text?: string | number | boolean | undefined;
class?: any;
theme?: string | undefined;
to?: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric | undefined;
icon?: boolean | IconValue | undefined;
href?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
baseColor?: string | undefined;
selectedClass?: string | undefined;
activeColor?: string | undefined;
prependIcon?: IconValue | undefined;
appendIcon?: IconValue | undefined;
} & {
$children?: VNodeChild | (() => VNodeChild) | {
default?: (() => VNodeChild) | undefined;
prepend?: (() => VNodeChild) | undefined;
append?: (() => VNodeChild) | undefined;
loader?: (() => VNodeChild) | undefined;
};
"v-slots"?: {
default?: false | (() => VNodeChild) | undefined;
prepend?: false | (() => VNodeChild) | undefined;
append?: false | (() => VNodeChild) | undefined;
loader?: false | (() => VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => VNodeChild) | undefined;
"v-slot:prepend"?: false | (() => VNodeChild) | undefined;
"v-slot:append"?: false | (() => VNodeChild) | undefined;
"v-slot:loader"?: false | (() => VNodeChild) | undefined;
} & {
"onGroup:selected"?: ((val: {
value: boolean;
}) => any) | undefined;
}, {
group: GroupItemProvide | null;
}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
"group:selected": (val: {
value: boolean;
}) => true;
}, VNodeProps & AllowedComponentProps & ComponentCustomProps, {
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
active: boolean;
style: StyleValue;
text: string | number | boolean;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
rounded: string | number | boolean;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
}, true, {}, SlotsType<Partial<{
default: () => VNode[];
prepend: () => VNode[];
append: () => VNode[];
loader: () => VNode[];
}>>, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, {
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
style: StyleValue;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
} & {
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: boolean | undefined;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
value?: any;
loading?: string | boolean | undefined;
text?: string | number | boolean | undefined;
class?: any;
theme?: string | undefined;
to?: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric | undefined;
icon?: boolean | IconValue | undefined;
href?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
baseColor?: string | undefined;
selectedClass?: string | undefined;
activeColor?: string | undefined;
prependIcon?: IconValue | undefined;
appendIcon?: IconValue | undefined;
} & {
$children?: VNodeChild | (() => VNodeChild) | {
default?: (() => VNodeChild) | undefined;
prepend?: (() => VNodeChild) | undefined;
append?: (() => VNodeChild) | undefined;
loader?: (() => VNodeChild) | undefined;
};
"v-slots"?: {
default?: false | (() => VNodeChild) | undefined;
prepend?: false | (() => VNodeChild) | undefined;
append?: false | (() => VNodeChild) | undefined;
loader?: false | (() => VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => VNodeChild) | undefined;
"v-slot:prepend"?: false | (() => VNodeChild) | undefined;
"v-slot:append"?: false | (() => VNodeChild) | undefined;
"v-slot:loader"?: false | (() => VNodeChild) | undefined;
} & {
"onGroup:selected"?: ((val: {
value: boolean;
}) => any) | undefined;
}, {
group: GroupItemProvide | null;
}, {}, {}, {}, {
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
active: boolean;
style: StyleValue;
text: string | number | boolean;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
rounded: string | number | boolean;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & ComponentOptionsBase<{
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
style: StyleValue;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
} & {
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: boolean | undefined;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
value?: any;
loading?: string | boolean | undefined;
text?: string | number | boolean | undefined;
class?: any;
theme?: string | undefined;
to?: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric | undefined;
icon?: boolean | IconValue | undefined;
href?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
baseColor?: string | undefined;
selectedClass?: string | undefined;
activeColor?: string | undefined;
prependIcon?: IconValue | undefined;
appendIcon?: IconValue | undefined;
} & {
$children?: VNodeChild | (() => VNodeChild) | {
default?: (() => VNodeChild) | undefined;
prepend?: (() => VNodeChild) | undefined;
append?: (() => VNodeChild) | undefined;
loader?: (() => VNodeChild) | undefined;
};
'v-slots'?: {
default?: false | (() => VNodeChild) | undefined;
prepend?: false | (() => VNodeChild) | undefined;
append?: false | (() => VNodeChild) | undefined;
loader?: false | (() => VNodeChild) | undefined;
} | undefined;
} & {
"v-slot:default"?: false | (() => VNodeChild) | undefined;
"v-slot:prepend"?: false | (() => VNodeChild) | undefined;
"v-slot:append"?: false | (() => VNodeChild) | undefined;
"v-slot:loader"?: false | (() => VNodeChild) | undefined;
} & {
"onGroup:selected"?: ((val: {
value: boolean;
}) => any) | undefined;
}, {
group: GroupItemProvide | null;
}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
'group:selected': (val: {
value: boolean;
}) => true;
}, string, {
symbol: any;
replace: boolean;
flat: boolean;
variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
exact: boolean;
block: boolean;
active: boolean;
style: StyleValue;
text: string | number | boolean;
disabled: boolean;
size: string | number;
readonly: boolean;
tag: string | JSXComponent;
density: Density;
rounded: string | number | boolean;
tile: boolean;
slim: boolean;
stacked: boolean;
ripple: boolean | {
class?: string;
keys?: number[];
} | undefined;
}, {}, string, SlotsType<Partial<{
default: () => VNode[];
prepend: () => VNode[];
append: () => VNode[];
loader: () => VNode[];
}>>, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & FilterPropsOptions<{
color: StringConstructor;
variant: Omit<{
type: PropType<Variant>;
default: string;
validator: (v: any) => boolean;
}, "type" | "default"> & {
type: PropType<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
default: NonNullable<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
};
theme: StringConstructor;
tag: Omit<{
type: PropType<string | JSXComponent>;
default: string;
}, "type" | "default"> & {
type: PropType<string | JSXComponent>;
default: NonNullable<string | JSXComponent>;
};
size: {
type: (StringConstructor | NumberConstructor)[];
default: string;
};
href: StringConstructor;
replace: BooleanConstructor;
to: PropType<RouteLocationRaw>;
exact: BooleanConstructor;
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
position: {
type: PropType<"fixed" | "absolute" | "relative" | "static" | "sticky">;
validator: (v: any) => boolean;
};
location: PropType< Anchor | null>;
loading: (StringConstructor | BooleanConstructor)[];
value: null;
disabled: BooleanConstructor;
selectedClass: StringConstructor;
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
height: (StringConstructor | NumberConstructor)[];
maxHeight: (StringConstructor | NumberConstructor)[];
maxWidth: (StringConstructor | NumberConstructor)[];
minHeight: (StringConstructor | NumberConstructor)[];
minWidth: (StringConstructor | NumberConstructor)[];
width: (StringConstructor | NumberConstructor)[];
density: {
type: PropType<Density>;
default: string;
validator: (v: any) => boolean;
};
class: PropType<ClassValue>;
style: {
type: PropType<StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
active: {
type: BooleanConstructor;
default: undefined;
};
activeColor: StringConstructor;
baseColor: StringConstructor;
symbol: {
type: null;
default: InjectionKey<GroupProvide>;
};
flat: BooleanConstructor;
icon: PropType<boolean | IconValue>;
prependIcon: PropType<IconValue>;
appendIcon: PropType<IconValue>;
block: BooleanConstructor;
readonly: BooleanConstructor;
slim: BooleanConstructor;
stacked: BooleanConstructor;
ripple: {
type: PropType< RippleDirectiveBinding["value"]>;
default: boolean;
};
text: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
}, ExtractPropTypes<{
color: StringConstructor;
variant: Omit<{
type: PropType<Variant>;
default: string;
validator: (v: any) => boolean;
}, "type" | "default"> & {
type: PropType<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
default: NonNullable<"flat" | "text" | "elevated" | "tonal" | "outlined" | "plain">;
};
theme: StringConstructor;
tag: Omit<{
type: PropType<string | JSXComponent>;
default: string;
}, "type" | "default"> & {
type: PropType<string | JSXComponent>;
default: NonNullable<string | JSXComponent>;
};
size: {
type: (StringConstructor | NumberConstructor)[];
default: string;
};
href: StringConstructor;
replace: BooleanConstructor;
to: PropType<RouteLocationRaw>;
exact: BooleanConstructor;
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
position: {
type: PropType<"fixed" | "absolute" | "relative" | "static" | "sticky">;
validator: (v: any) => boolean;
};
location: PropType< Anchor | null>;
loading: (StringConstructor | BooleanConstructor)[];
value: null;
disabled: BooleanConstructor;
selectedClass: StringConstructor;
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
height: (StringConstructor | NumberConstructor)[];
maxHeight: (StringConstructor | NumberConstructor)[];
maxWidth: (StringConstructor | NumberConstructor)[];
minHeight: (StringConstructor | NumberConstructor)[];
minWidth: (StringConstructor | NumberConstructor)[];
width: (StringConstructor | NumberConstructor)[];
density: {
type: PropType<Density>;
default: string;
validator: (v: any) => boolean;
};
class: PropType<ClassValue>;
style: {
type: PropType<StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
active: {
type: BooleanConstructor;
default: undefined;
};
activeColor: StringConstructor;
baseColor: StringConstructor;
symbol: {
type: null;
default: InjectionKey<GroupProvide>;
};
flat: BooleanConstructor;
icon: PropType<boolean | IconValue>;
prependIcon: PropType<IconValue>;
appendIcon: PropType<IconValue>;
block: BooleanConstructor;
readonly: BooleanConstructor;
slim: BooleanConstructor;
stacked: BooleanConstructor;
ripple: {
type: PropType< RippleDirectiveBinding["value"]>;
default: boolean;
};
text: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
}>>;
VDatePicker: {
new (...args: any[]): CreateComponentPublicInstanceWithMixins<{
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
hideWeekdays: boolean;
showWeek: boolean;
} & {
max?: unknown;
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: string | string[] | undefined;
min?: unknown;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
text?: string | undefined;
month?: string | number | undefined;
year?: number | undefined;
class?: any;
theme?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
bgColor?: string | undefined;
controlHeight?: string | number | undefined;
headerColor?: string | undefined;
firstDayOfWeek?: string | number | undefined;
allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
weekdayFormat?: "long" | "short" | "narrow" | undefined;
allowedMonths?: number[] | ((date: number) => boolean) | undefined;
allowedYears?: number[] | ((date: number) => boolean) | undefined;
} & {
"onUpdate:month"?: ((date: any) => any) | undefined;
"onUpdate:year"?: ((date: any) => any) | undefined;
"onUpdate:viewMode"?: ((date: any) => any) | undefined;
}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Omit<{
"update:modelValue": (date: any) => true;
"update:month": (date: any) => true;
"update:year": (date: any) => true;
"update:viewMode": (date: any) => true;
}, "multiple" | "$children" | "v-slots" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:actions" | "v-slot:title" | "v-slot:header" | "v-slot:day" | "v-slot:month" | "v-slot:year">, VNodeProps & AllowedComponentProps & ComponentCustomProps, {
active: string | string[];
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
rounded: string | number | boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
firstDayOfWeek: string | number;
hideWeekdays: boolean;
showWeek: boolean;
}, true, {}, SlotsType<Partial<{
title: () => VNode[];
actions: () => VNode[];
append: () => VNode[];
prepend: () => VNode[];
year: (arg: {
year: {
text: string;
value: number;
};
i: number;
props: {
active: boolean;
color?: string;
rounded: boolean;
text: string;
variant: "flat" | "text";
onClick: () => void;
};
}) => VNode[];
month: (arg: {
month: {
text: string;
value: number;
};
i: number;
props: {
onClick: () => void;
};
}) => VNode[];
day: (arg: {
props: {
onClick: () => void;
};
item: any;
i: number;
}) => VNode[];
header: (arg: {
header: string;
transition: string;
}) => VNode[];
}>>, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, {
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
hideWeekdays: boolean;
showWeek: boolean;
} & {
max?: unknown;
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: string | string[] | undefined;
min?: unknown;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
text?: string | undefined;
month?: string | number | undefined;
year?: number | undefined;
class?: any;
theme?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
bgColor?: string | undefined;
controlHeight?: string | number | undefined;
headerColor?: string | undefined;
firstDayOfWeek?: string | number | undefined;
allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
weekdayFormat?: "long" | "short" | "narrow" | undefined;
allowedMonths?: number[] | ((date: number) => boolean) | undefined;
allowedYears?: number[] | ((date: number) => boolean) | undefined;
} & {
"onUpdate:month"?: ((date: any) => any) | undefined;
"onUpdate:year"?: ((date: any) => any) | undefined;
"onUpdate:viewMode"?: ((date: any) => any) | undefined;
}, {}, {}, {}, {}, {
active: string | string[];
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
rounded: string | number | boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
firstDayOfWeek: string | number;
hideWeekdays: boolean;
showWeek: boolean;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & ComponentOptionsBase<{
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
hideWeekdays: boolean;
showWeek: boolean;
} & {
max?: unknown;
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
active?: string | string[] | undefined;
min?: unknown;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
text?: string | undefined;
month?: string | number | undefined;
year?: number | undefined;
class?: any;
theme?: string | undefined;
elevation?: string | number | undefined;
rounded?: string | number | boolean | undefined;
bgColor?: string | undefined;
controlHeight?: string | number | undefined;
headerColor?: string | undefined;
firstDayOfWeek?: string | number | undefined;
allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
weekdayFormat?: "long" | "short" | "narrow" | undefined;
allowedMonths?: number[] | ((date: number) => boolean) | undefined;
allowedYears?: number[] | ((date: number) => boolean) | undefined;
} & {
"onUpdate:month"?: ((date: any) => any) | undefined;
"onUpdate:year"?: ((date: any) => any) | undefined;
"onUpdate:viewMode"?: ((date: any) => any) | undefined;
}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Omit<{
'update:modelValue': (date: any) => true;
'update:month': (date: any) => true;
'update:year': (date: any) => true;
'update:viewMode': (date: any) => true;
}, "multiple" | "$children" | "v-slots" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:title" | "v-slot:header" | "v-slot:actions" | "v-slot:day" | "v-slot:month" | "v-slot:year">, string, {
active: string | string[];
transition: string;
header: string;
style: StyleValue;
title: string;
disabled: boolean;
tag: string | JSXComponent;
landscape: boolean;
rounded: string | number | boolean;
tile: boolean;
divided: boolean;
nextIcon: IconValue;
prevIcon: IconValue;
reverseTransition: string;
hideHeader: boolean;
modeIcon: IconValue;
viewMode: "month" | "year" | "months";
showAdjacentMonths: boolean;
weekdays: CalendarWeekdays[];
weeksInMonth: "static" | "dynamic";
firstDayOfWeek: string | number;
hideWeekdays: boolean;
showWeek: boolean;
}, {}, string, SlotsType<Partial<{
title: () => VNode[];
actions: () => VNode[];
append: () => VNode[];
prepend: () => VNode[];
year: (arg: {
year: {
text: string;
value: number;
};
i: number;
props: {
active: boolean;
color?: string;
rounded: boolean;
text: string;
variant: "flat" | "text";
onClick: () => void;
};
}) => VNode[];
month: (arg: {
month: {
text: string;
value: number;
};
i: number;
props: {
onClick: () => void;
};
}) => VNode[];
day: (arg: {
props: {
onClick: () => void;
};
item: any;
i: number;
}) => VNode[];
header: (arg: {
header: string;
transition: string;
}) => VNode[];
}>>, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new <T, Multiple extends boolean | "range" | number | (string & {}) = false, TModel = Multiple extends string | number | true ? T[] : T>(props: {
modelValue?: TModel;
"onUpdate:modelValue"?: (value: TModel) => void;
multiple?: Multiple;
}, slots: VDatePickerSlots) => GenericProps<typeof props, typeof slots>) & FilterPropsOptions<{
modelValue: null;
theme: StringConstructor;
tag: {
type: PropType<string | JSXComponent>;
default: string;
};
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
position: {
type: PropType<"fixed" | "absolute" | "relative" | "static" | "sticky">;
validator: (v: any) => boolean;
};
location: PropType< Anchor | null>;
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
height: (StringConstructor | NumberConstructor)[];
maxHeight: (StringConstructor | NumberConstructor)[];
maxWidth: (StringConstructor | NumberConstructor)[];
minHeight: (StringConstructor | NumberConstructor)[];
minWidth: (StringConstructor | NumberConstructor)[];
width: (StringConstructor | NumberConstructor)[];
class: PropType<ClassValue>;
style: {
type: PropType<StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
color: StringConstructor;
bgColor: StringConstructor;
divided: BooleanConstructor;
landscape: BooleanConstructor;
title: {
type: PropType<string>;
default: string;
};
hideHeader: BooleanConstructor;
max: PropType<unknown>;
min: PropType<unknown>;
allowedYears: PropType<number[] | ((date: number) => boolean)>;
year: NumberConstructor;
allowedMonths: PropType<number[] | ((date: number) => boolean)>;
disabled: {
type: BooleanConstructor;
default: null;
};
month: (StringConstructor | NumberConstructor)[];
showAdjacentMonths: BooleanConstructor;
weekdays: {
type: PropType< CalendarWeekdays[]>;
default: () => number[];
};
weeksInMonth: Omit<{
type: PropType<"dynamic" | "static">;
default: string;
}, "type" | "default"> & {
type: PropType<"static" | "dynamic">;
default: NonNullable<"static" | "dynamic">;
};
firstDayOfWeek: {
type: (StringConstructor | NumberConstructor)[];
default: undefined;
};
allowedDates: PropType<unknown[] | ((date: unknown) => boolean)>;
weekdayFormat: PropType<"long" | "short" | "narrow" | undefined>;
hideWeekdays: BooleanConstructor;
multiple: PropType<boolean | "range" | number | (string & {})>;
showWeek: BooleanConstructor;
transition: {
type: StringConstructor;
default: string;
};
reverseTransition: {
type: StringConstructor;
default: string;
};
active: {
type: PropType<string | string[]>;
default: undefined;
};
controlHeight: (StringConstructor | NumberConstructor)[];
nextIcon: {
type: PropType<IconValue>;
default: string;
};
prevIcon: {
type: PropType<IconValue>;
default: string;
};
modeIcon: {
type: PropType<IconValue>;
default: string;
};
text: StringConstructor;
viewMode: {
type: PropType<"month" | "months" | "year">;
default: string;
};
header: {
type: StringConstructor;
default: string;
};
headerColor: StringConstructor;
}, ExtractPropTypes<{
modelValue: null;
theme: StringConstructor;
tag: {
type: PropType<string | JSXComponent>;
default: string;
};
rounded: {
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
default: undefined;
};
tile: BooleanConstructor;
position: {
type: PropType<"fixed" | "absolute" | "relative" | "static" | "sticky">;
validator: (v: any) => boolean;
};
location: PropType< Anchor | null>;
elevation: {
type: (StringConstructor | NumberConstructor)[];
validator(v: any): boolean;
};
height: (StringConstructor | NumberConstructor)[];
maxHeight: (StringConstructor | NumberConstructor)[];
maxWidth: (StringConstructor | NumberConstructor)[];
minHeight: (StringConstructor | NumberConstructor)[];
minWidth: (StringConstructor | NumberConstructor)[];
width: (StringConstructor | NumberConstructor)[];
class: PropType<ClassValue>;
style: {
type: PropType<StyleValue>;
default: null;
};
border: (StringConstructor | BooleanConstructor | NumberConstructor)[];
color: StringConstructor;
bgColor: StringConstructor;
divided: BooleanConstructor;
landscape: BooleanConstructor;
title: {
type: PropType<string>;
default: string;
};
hideHeader: BooleanConstructor;
max: PropType<unknown>;
min: PropType<unknown>;
allowedYears: PropType<number[] | ((date: number) => boolean)>;
year: NumberConstructor;
allowedMonths: PropType<number[] | ((date: number) => boolean)>;
disabled: {
type: BooleanConstructor;
default: null;
};
month: (StringConstructor | NumberConstructor)[];
showAdjacentMonths: BooleanConstructor;
weekdays: {
type: PropType< CalendarWeekdays[]>;
default: () => number[];
};
weeksInMonth: Omit<{
type: PropType<"dynamic" | "static">;
default: string;
}, "type" | "default"> & {
type: PropType<"static" | "dynamic">;
default: NonNullable<"static" | "dynamic">;
};
firstDayOfWeek: {
type: (StringConstructor | NumberConstructor)[];
default: undefined;
};
allowedDates: PropType<unknown[] | ((date: unknown) => boolean)>;
weekdayFormat: PropType<"long" | "short" | "narrow" | undefined>;
hideWeekdays: BooleanConstructor;
multiple: PropType<boolean | "range" | number | (string & {})>;
showWeek: BooleanConstructor;
transition: {
type: StringConstructor;
default: string;
};
reverseTransition: {
type: StringConstructor;
default: string;
};
active: {
type: PropType<string | string[]>;
default: undefined;
};
controlHeight: (StringConstructor | NumberConstructor)[];
nextIcon: {
type: PropType<IconValue>;
default: string;
};
prevIcon: {
type: PropType<IconValue>;
default: string;
};
modeIcon: {
type: PropType<IconValue>;
default: string;
};
text: StringConstructor;
viewMode: {
type: PropType<"month" | "months" | "year">;
default: string;
};
header: {
type: StringConstructor;
default: string;
};
headerColor: StringConstructor;
}>>;
VTimePicker: {
new (...args: any[]): CreateComponentPublicInstanceWithMixins<{
style: StyleValue;
title: string;
disabled: boolean;
readonly: boolean;
format: "ampm" | "24hr";
tag: string | JSXComponent;
tile: boolean;
divided: boolean;
scrollable: boolean;
hideHeader: boolean;
viewMode: VTimePickerViewMode;
useSeconds: boolean;
} & {
max?: string | undefined;
location?: Anchor | null | undefined;
height?: string | number | undefined;
width?: string | number | undefined;
min?: string | undefined;
border?: string | number | boolean | undefined;
color?: string | undefined;
maxHeight?: string | number | undefined;
maxWidth?: string | number | undefined;
minHeight?: string | number | undefined;
minWidth?: string | number | undefined;
position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
class?: any;
theme?: string | undefined;
elevation?: string | number | undefined;
modelValue?: any;
rounded?: string | number | boolean | undefined;
bgColor?: string | undefined;
allowedHours?: number[] | AllowFunction | undefined;
allowedMinutes?: number[] |