routie dev init since i didn't adhere to any proper guidance up until now
This commit is contained in:
+59
@@ -0,0 +1,59 @@
|
||||
@layer vuetify-components {
|
||||
.v-stepper.v-sheet {
|
||||
overflow: hidden;
|
||||
}
|
||||
.v-stepper.v-sheet {
|
||||
box-shadow: 0px 1px 2px 0px rgba(var(--v-shadow-color), var(--v-shadow-key-opacity, 0.3)), 0px 1px 3px 1px rgba(var(--v-shadow-color), var(--v-shadow-ambient-opacity, 0.15));
|
||||
--v-elevation-overlay: color-mix(in srgb, var(--v-elevation-overlay-color) 2%, transparent);
|
||||
}
|
||||
.v-stepper.v-sheet {
|
||||
border-radius: 4px;
|
||||
}
|
||||
.v-stepper.v-sheet.v-stepper--flat {
|
||||
box-shadow: 0px 0px 0px 0px rgba(var(--v-shadow-color), var(--v-shadow-key-opacity, 0.3)), 0px 0px 0px 0px rgba(var(--v-shadow-color), var(--v-shadow-ambient-opacity, 0.15));
|
||||
--v-elevation-overlay: color-mix(in srgb, var(--v-elevation-overlay-color) 0%, transparent);
|
||||
}
|
||||
.v-stepper-header {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
position: relative;
|
||||
overflow-x: auto;
|
||||
justify-content: space-between;
|
||||
z-index: 1;
|
||||
}
|
||||
.v-stepper-header {
|
||||
box-shadow: 0px 1px 2px 0px rgba(var(--v-shadow-color), var(--v-shadow-key-opacity, 0.3)), 0px 1px 3px 1px rgba(var(--v-shadow-color), var(--v-shadow-ambient-opacity, 0.15));
|
||||
--v-elevation-overlay: color-mix(in srgb, var(--v-elevation-overlay-color) 2%, transparent);
|
||||
}
|
||||
.v-stepper-header .v-divider {
|
||||
margin: 0 -16px;
|
||||
}
|
||||
.v-stepper-header .v-divider:last-child {
|
||||
margin-inline-end: 0;
|
||||
}
|
||||
.v-stepper-header .v-divider:first-child {
|
||||
margin-inline-start: 0;
|
||||
}
|
||||
.v-stepper--alt-labels .v-stepper-header {
|
||||
height: auto;
|
||||
}
|
||||
.v-stepper--alt-labels .v-stepper-header .v-divider {
|
||||
align-self: flex-start;
|
||||
margin: 35px -67px 0;
|
||||
}
|
||||
.v-stepper-window {
|
||||
margin: 1.5rem;
|
||||
}
|
||||
.v-stepper-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1rem;
|
||||
}
|
||||
.v-stepper .v-stepper-actions {
|
||||
padding: 0 1.5rem 1rem;
|
||||
}
|
||||
.v-stepper-window-item .v-stepper-actions {
|
||||
padding: 1.5rem 0 0;
|
||||
}
|
||||
}
|
||||
+887
@@ -0,0 +1,887 @@
|
||||
|
||||
import { IconValue } from '../../composables/icons.js';
|
||||
import type { PropType } from 'vue';
|
||||
import type { StepperItem, StepperItemSlot } from './VStepperItem.js';
|
||||
import type { GenericProps, SelectItemKey } from '../../util/index.js';
|
||||
export type VStepperSlot = {
|
||||
prev: () => void;
|
||||
next: () => void;
|
||||
};
|
||||
export type VStepperSlots = {
|
||||
actions: VStepperSlot;
|
||||
default: VStepperSlot;
|
||||
header: StepperItem;
|
||||
'header-item': StepperItemSlot;
|
||||
icon: StepperItemSlot;
|
||||
title: StepperItemSlot;
|
||||
subtitle: StepperItemSlot;
|
||||
item: StepperItem;
|
||||
prev: never;
|
||||
next: never;
|
||||
} & {
|
||||
[key: `header-item.${string}`]: StepperItemSlot;
|
||||
[key: `item.${string}`]: StepperItem;
|
||||
};
|
||||
export declare const makeStepperProps: <Defaults extends {
|
||||
mobile?: unknown;
|
||||
mobileBreakpoint?: unknown;
|
||||
altLabels?: unknown;
|
||||
bgColor?: unknown;
|
||||
completeIcon?: unknown;
|
||||
editIcon?: unknown;
|
||||
editable?: unknown;
|
||||
errorIcon?: unknown;
|
||||
hideActions?: unknown;
|
||||
items?: unknown;
|
||||
itemTitle?: unknown;
|
||||
itemValue?: unknown;
|
||||
itemProps?: unknown;
|
||||
nonLinear?: unknown;
|
||||
flat?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
mobile: unknown extends Defaults["mobile"] ? {
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["mobile"] ? boolean | null : boolean | Defaults["mobile"] | null>;
|
||||
default: unknown extends Defaults["mobile"] ? boolean | null : Defaults["mobile"] | NonNullable<boolean | null>;
|
||||
};
|
||||
mobileBreakpoint: unknown extends Defaults["mobileBreakpoint"] ? PropType<number | import("../../types.js").DisplayBreakpoint> : {
|
||||
type: PropType<unknown extends Defaults["mobileBreakpoint"] ? number | import("../../types.js").DisplayBreakpoint : number | Defaults["mobileBreakpoint"] | import("../../types.js").DisplayBreakpoint>;
|
||||
default: unknown extends Defaults["mobileBreakpoint"] ? number | import("../../types.js").DisplayBreakpoint : Defaults["mobileBreakpoint"] | NonNullable<number | import("../../types.js").DisplayBreakpoint>;
|
||||
};
|
||||
altLabels: unknown extends Defaults["altLabels"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["altLabels"] ? boolean : boolean | Defaults["altLabels"]>;
|
||||
default: unknown extends Defaults["altLabels"] ? boolean : boolean | Defaults["altLabels"];
|
||||
};
|
||||
bgColor: unknown extends Defaults["bgColor"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["bgColor"] ? string : string | Defaults["bgColor"]>;
|
||||
default: unknown extends Defaults["bgColor"] ? string : string | Defaults["bgColor"];
|
||||
};
|
||||
completeIcon: unknown extends Defaults["completeIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editIcon: unknown extends Defaults["editIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editable: unknown extends Defaults["editable"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"]>;
|
||||
default: unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"];
|
||||
};
|
||||
errorIcon: unknown extends Defaults["errorIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
hideActions: unknown extends Defaults["hideActions"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["hideActions"] ? boolean : boolean | Defaults["hideActions"]>;
|
||||
default: unknown extends Defaults["hideActions"] ? boolean : boolean | Defaults["hideActions"];
|
||||
};
|
||||
items: unknown extends Defaults["items"] ? {
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
} : Omit<{
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["items"] ? readonly StepperItem[] : readonly StepperItem[] | Defaults["items"]>;
|
||||
default: unknown extends Defaults["items"] ? readonly StepperItem[] : readonly StepperItem[] | Defaults["items"];
|
||||
};
|
||||
itemTitle: unknown extends Defaults["itemTitle"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemTitle"] ? SelectItemKey : Defaults["itemTitle"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemTitle"] ? SelectItemKey : Defaults["itemTitle"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
itemValue: unknown extends Defaults["itemValue"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemValue"] ? SelectItemKey : Defaults["itemValue"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemValue"] ? SelectItemKey : Defaults["itemValue"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
itemProps: unknown extends Defaults["itemProps"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemProps"] ? SelectItemKey : Defaults["itemProps"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemProps"] ? SelectItemKey : Defaults["itemProps"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
nonLinear: unknown extends Defaults["nonLinear"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["nonLinear"] ? boolean : boolean | Defaults["nonLinear"]>;
|
||||
default: unknown extends Defaults["nonLinear"] ? boolean : boolean | Defaults["nonLinear"];
|
||||
};
|
||||
flat: unknown extends Defaults["flat"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["flat"] ? boolean : boolean | Defaults["flat"]>;
|
||||
default: unknown extends Defaults["flat"] ? boolean : boolean | Defaults["flat"];
|
||||
};
|
||||
};
|
||||
export declare const makeVStepperProps: <Defaults extends {
|
||||
theme?: unknown;
|
||||
class?: unknown;
|
||||
style?: unknown;
|
||||
mobile?: unknown;
|
||||
mobileBreakpoint?: unknown;
|
||||
border?: unknown;
|
||||
elevation?: unknown;
|
||||
rounded?: unknown;
|
||||
tile?: unknown;
|
||||
tag?: unknown;
|
||||
modelValue?: unknown;
|
||||
multiple?: unknown;
|
||||
mandatory?: unknown;
|
||||
max?: unknown;
|
||||
selectedClass?: unknown;
|
||||
disabled?: unknown;
|
||||
height?: unknown;
|
||||
maxHeight?: unknown;
|
||||
maxWidth?: unknown;
|
||||
minHeight?: unknown;
|
||||
minWidth?: unknown;
|
||||
width?: unknown;
|
||||
location?: unknown;
|
||||
position?: unknown;
|
||||
color?: unknown;
|
||||
prevText?: unknown;
|
||||
nextText?: unknown;
|
||||
altLabels?: unknown;
|
||||
bgColor?: unknown;
|
||||
completeIcon?: unknown;
|
||||
editIcon?: unknown;
|
||||
editable?: unknown;
|
||||
errorIcon?: unknown;
|
||||
hideActions?: unknown;
|
||||
items?: unknown;
|
||||
itemTitle?: unknown;
|
||||
itemValue?: unknown;
|
||||
itemProps?: unknown;
|
||||
nonLinear?: unknown;
|
||||
flat?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
theme: unknown extends Defaults["theme"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["theme"] ? string : string | Defaults["theme"]>;
|
||||
default: unknown extends Defaults["theme"] ? string : string | Defaults["theme"];
|
||||
};
|
||||
class: unknown extends Defaults["class"] ? PropType<any> : {
|
||||
type: PropType<unknown extends Defaults["class"] ? any : any>;
|
||||
default: unknown extends Defaults["class"] ? any : any;
|
||||
};
|
||||
style: unknown extends Defaults["style"] ? {
|
||||
type: PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
} : Omit<{
|
||||
type: PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | import("vue").StyleValue>;
|
||||
default: unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | NonNullable<import("vue").StyleValue>;
|
||||
};
|
||||
mobile: unknown extends Defaults["mobile"] ? {
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["mobile"] ? boolean | null : boolean | Defaults["mobile"] | null>;
|
||||
default: unknown extends Defaults["mobile"] ? boolean | null : Defaults["mobile"] | NonNullable<boolean | null>;
|
||||
};
|
||||
mobileBreakpoint: unknown extends Defaults["mobileBreakpoint"] ? PropType<number | import("../../types.js").DisplayBreakpoint> : {
|
||||
type: PropType<unknown extends Defaults["mobileBreakpoint"] ? number | import("../../types.js").DisplayBreakpoint : number | Defaults["mobileBreakpoint"] | import("../../types.js").DisplayBreakpoint>;
|
||||
default: unknown extends Defaults["mobileBreakpoint"] ? number | import("../../types.js").DisplayBreakpoint : Defaults["mobileBreakpoint"] | NonNullable<number | import("../../types.js").DisplayBreakpoint>;
|
||||
};
|
||||
border: unknown extends Defaults["border"] ? (BooleanConstructor | NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["border"] ? string | number | boolean : string | number | boolean | Defaults["border"]>;
|
||||
default: unknown extends Defaults["border"] ? string | number | boolean : Defaults["border"] | NonNullable<string | number | boolean>;
|
||||
};
|
||||
elevation: unknown extends Defaults["elevation"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["elevation"] ? string | number : string | number | Defaults["elevation"]>;
|
||||
default: unknown extends Defaults["elevation"] ? string | number : Defaults["elevation"] | NonNullable<string | number>;
|
||||
};
|
||||
rounded: unknown extends Defaults["rounded"] ? {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["rounded"] ? string | number | boolean : string | number | boolean | Defaults["rounded"]>;
|
||||
default: unknown extends Defaults["rounded"] ? string | number | boolean : Defaults["rounded"] | NonNullable<string | number | boolean>;
|
||||
};
|
||||
tile: unknown extends Defaults["tile"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"]>;
|
||||
default: unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"];
|
||||
};
|
||||
tag: unknown extends Defaults["tag"] ? {
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : string | Defaults["tag"] | import("../../util/index.js").JSXComponent>;
|
||||
default: unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : Defaults["tag"] | NonNullable<string | import("../../util/index.js").JSXComponent>;
|
||||
};
|
||||
modelValue: unknown extends Defaults["modelValue"] ? {
|
||||
type: null;
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: null;
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["modelValue"] ? any : any>;
|
||||
default: unknown extends Defaults["modelValue"] ? any : any;
|
||||
};
|
||||
multiple: unknown extends Defaults["multiple"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["multiple"] ? boolean : boolean | Defaults["multiple"]>;
|
||||
default: unknown extends Defaults["multiple"] ? boolean : boolean | Defaults["multiple"];
|
||||
};
|
||||
mandatory: unknown extends Defaults["mandatory"] ? {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
} : Omit<{
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["mandatory"] ? "force" | boolean : "force" | boolean | Defaults["mandatory"]>;
|
||||
default: unknown extends Defaults["mandatory"] ? "force" | boolean : Defaults["mandatory"] | NonNullable<"force" | boolean>;
|
||||
};
|
||||
max: unknown extends Defaults["max"] ? NumberConstructor : {
|
||||
type: PropType<unknown extends Defaults["max"] ? number : number | Defaults["max"]>;
|
||||
default: unknown extends Defaults["max"] ? number : number | Defaults["max"];
|
||||
};
|
||||
selectedClass: unknown extends Defaults["selectedClass"] ? {
|
||||
type: PropType<string>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<string>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"]>;
|
||||
default: unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"];
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"]>;
|
||||
default: unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"];
|
||||
};
|
||||
height: unknown extends Defaults["height"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["height"] ? string | number : string | number | Defaults["height"]>;
|
||||
default: unknown extends Defaults["height"] ? string | number : Defaults["height"] | NonNullable<string | number>;
|
||||
};
|
||||
maxHeight: unknown extends Defaults["maxHeight"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["maxHeight"] ? string | number : string | number | Defaults["maxHeight"]>;
|
||||
default: unknown extends Defaults["maxHeight"] ? string | number : Defaults["maxHeight"] | NonNullable<string | number>;
|
||||
};
|
||||
maxWidth: unknown extends Defaults["maxWidth"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["maxWidth"] ? string | number : string | number | Defaults["maxWidth"]>;
|
||||
default: unknown extends Defaults["maxWidth"] ? string | number : Defaults["maxWidth"] | NonNullable<string | number>;
|
||||
};
|
||||
minHeight: unknown extends Defaults["minHeight"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["minHeight"] ? string | number : string | number | Defaults["minHeight"]>;
|
||||
default: unknown extends Defaults["minHeight"] ? string | number : Defaults["minHeight"] | NonNullable<string | number>;
|
||||
};
|
||||
minWidth: unknown extends Defaults["minWidth"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["minWidth"] ? string | number : string | number | Defaults["minWidth"]>;
|
||||
default: unknown extends Defaults["minWidth"] ? string | number : Defaults["minWidth"] | NonNullable<string | number>;
|
||||
};
|
||||
width: unknown extends Defaults["width"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["width"] ? string | number : string | number | Defaults["width"]>;
|
||||
default: unknown extends Defaults["width"] ? string | number : Defaults["width"] | NonNullable<string | number>;
|
||||
};
|
||||
location: unknown extends Defaults["location"] ? PropType<import("../../util/index.js").Anchor | null> : {
|
||||
type: PropType<unknown extends Defaults["location"] ? import("../../util/index.js").Anchor | null : Defaults["location"] | import("../../util/index.js").Anchor | null>;
|
||||
default: unknown extends Defaults["location"] ? import("../../util/index.js").Anchor | null : Defaults["location"] | NonNullable<import("../../util/index.js").Anchor | null>;
|
||||
};
|
||||
position: unknown extends Defaults["position"] ? {
|
||||
type: PropType<"absolute" | "fixed" | "relative" | "static" | "sticky">;
|
||||
validator: (v: any) => boolean;
|
||||
} : Omit<{
|
||||
type: PropType<"absolute" | "fixed" | "relative" | "static" | "sticky">;
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["position"] ? "absolute" | "fixed" | "relative" | "static" | "sticky" : "absolute" | "fixed" | "relative" | "static" | "sticky" | Defaults["position"]>;
|
||||
default: unknown extends Defaults["position"] ? "absolute" | "fixed" | "relative" | "static" | "sticky" : Defaults["position"] | NonNullable<"absolute" | "fixed" | "relative" | "static" | "sticky">;
|
||||
};
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
prevText: unknown extends Defaults["prevText"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["prevText"] ? string : string | Defaults["prevText"]>;
|
||||
default: unknown extends Defaults["prevText"] ? string : string | Defaults["prevText"];
|
||||
};
|
||||
nextText: unknown extends Defaults["nextText"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["nextText"] ? string : string | Defaults["nextText"]>;
|
||||
default: unknown extends Defaults["nextText"] ? string : string | Defaults["nextText"];
|
||||
};
|
||||
altLabels: unknown extends Defaults["altLabels"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["altLabels"] ? boolean : boolean | Defaults["altLabels"]>;
|
||||
default: unknown extends Defaults["altLabels"] ? boolean : boolean | Defaults["altLabels"];
|
||||
};
|
||||
bgColor: unknown extends Defaults["bgColor"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["bgColor"] ? string : string | Defaults["bgColor"]>;
|
||||
default: unknown extends Defaults["bgColor"] ? string : string | Defaults["bgColor"];
|
||||
};
|
||||
completeIcon: unknown extends Defaults["completeIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editIcon: unknown extends Defaults["editIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editable: unknown extends Defaults["editable"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"]>;
|
||||
default: unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"];
|
||||
};
|
||||
errorIcon: unknown extends Defaults["errorIcon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
hideActions: unknown extends Defaults["hideActions"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["hideActions"] ? boolean : boolean | Defaults["hideActions"]>;
|
||||
default: unknown extends Defaults["hideActions"] ? boolean : boolean | Defaults["hideActions"];
|
||||
};
|
||||
items: unknown extends Defaults["items"] ? {
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
} : Omit<{
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["items"] ? readonly StepperItem[] : readonly StepperItem[] | Defaults["items"]>;
|
||||
default: unknown extends Defaults["items"] ? readonly StepperItem[] : readonly StepperItem[] | Defaults["items"];
|
||||
};
|
||||
itemTitle: unknown extends Defaults["itemTitle"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemTitle"] ? SelectItemKey : Defaults["itemTitle"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemTitle"] ? SelectItemKey : Defaults["itemTitle"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
itemValue: unknown extends Defaults["itemValue"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemValue"] ? SelectItemKey : Defaults["itemValue"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemValue"] ? SelectItemKey : Defaults["itemValue"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
itemProps: unknown extends Defaults["itemProps"] ? {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["itemProps"] ? SelectItemKey : Defaults["itemProps"] | SelectItemKey>;
|
||||
default: unknown extends Defaults["itemProps"] ? SelectItemKey : Defaults["itemProps"] | NonNullable<SelectItemKey>;
|
||||
};
|
||||
nonLinear: unknown extends Defaults["nonLinear"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["nonLinear"] ? boolean : boolean | Defaults["nonLinear"]>;
|
||||
default: unknown extends Defaults["nonLinear"] ? boolean : boolean | Defaults["nonLinear"];
|
||||
};
|
||||
flat: unknown extends Defaults["flat"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["flat"] ? boolean : boolean | Defaults["flat"]>;
|
||||
default: unknown extends Defaults["flat"] ? boolean : boolean | Defaults["flat"];
|
||||
};
|
||||
};
|
||||
export declare const VStepper: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
mobile: boolean | null;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemValue: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemProps: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
mobileBreakpoint?: number | import("../../types.js").DisplayBreakpoint | undefined;
|
||||
border?: string | number | boolean | undefined;
|
||||
elevation?: string | number | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
max?: number | undefined;
|
||||
height?: string | number | undefined;
|
||||
maxHeight?: string | number | undefined;
|
||||
maxWidth?: string | number | undefined;
|
||||
minHeight?: string | number | undefined;
|
||||
minWidth?: string | number | undefined;
|
||||
width?: string | number | undefined;
|
||||
location?: import("../../util/index.js").Anchor | null | undefined;
|
||||
position?: "absolute" | "fixed" | "relative" | "static" | "sticky" | undefined;
|
||||
color?: string | undefined;
|
||||
bgColor?: string | undefined;
|
||||
completeIcon?: IconValue | undefined;
|
||||
editIcon?: IconValue | undefined;
|
||||
errorIcon?: IconValue | undefined;
|
||||
} & {}, {
|
||||
prev: () => void;
|
||||
next: () => void;
|
||||
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (v: unknown) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:actions" | "v-slot:default" | "v-slot:header" | "v-slot:header-item" | "v-slot:icon" | "v-slot:item" | "v-slot:next" | "v-slot:prev" | "v-slot:subtitle" | "v-slot:title" | "v-slots" | `v-slot:header-item.${string}` | `v-slot:item.${string}`>, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
style: import("vue").StyleValue;
|
||||
mobile: boolean | null;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: SelectItemKey;
|
||||
itemValue: SelectItemKey;
|
||||
itemProps: SelectItemKey;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
[x: `header-item.${string}`]: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
[x: `item.${string}`]: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
actions: (arg: VStepperSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
default: (arg: VStepperSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
header: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'header-item': (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
icon: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
title: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
subtitle: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
item: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
mobile: boolean | null;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemValue: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemProps: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
mobileBreakpoint?: number | import("../../types.js").DisplayBreakpoint | undefined;
|
||||
border?: string | number | boolean | undefined;
|
||||
elevation?: string | number | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
max?: number | undefined;
|
||||
height?: string | number | undefined;
|
||||
maxHeight?: string | number | undefined;
|
||||
maxWidth?: string | number | undefined;
|
||||
minHeight?: string | number | undefined;
|
||||
minWidth?: string | number | undefined;
|
||||
width?: string | number | undefined;
|
||||
location?: import("../../util/index.js").Anchor | null | undefined;
|
||||
position?: "absolute" | "fixed" | "relative" | "static" | "sticky" | undefined;
|
||||
color?: string | undefined;
|
||||
bgColor?: string | undefined;
|
||||
completeIcon?: IconValue | undefined;
|
||||
editIcon?: IconValue | undefined;
|
||||
errorIcon?: IconValue | undefined;
|
||||
} & {}, {
|
||||
prev: () => void;
|
||||
next: () => void;
|
||||
}, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
mobile: boolean | null;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: SelectItemKey;
|
||||
itemValue: SelectItemKey;
|
||||
itemProps: SelectItemKey;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
mobile: boolean | null;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemValue: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
itemProps: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
mobileBreakpoint?: number | import("../../types.js").DisplayBreakpoint | undefined;
|
||||
border?: string | number | boolean | undefined;
|
||||
elevation?: string | number | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
max?: number | undefined;
|
||||
height?: string | number | undefined;
|
||||
maxHeight?: string | number | undefined;
|
||||
maxWidth?: string | number | undefined;
|
||||
minHeight?: string | number | undefined;
|
||||
minWidth?: string | number | undefined;
|
||||
width?: string | number | undefined;
|
||||
location?: import("../../util/index.js").Anchor | null | undefined;
|
||||
position?: "absolute" | "fixed" | "relative" | "static" | "sticky" | undefined;
|
||||
color?: string | undefined;
|
||||
bgColor?: string | undefined;
|
||||
completeIcon?: IconValue | undefined;
|
||||
editIcon?: IconValue | undefined;
|
||||
errorIcon?: IconValue | undefined;
|
||||
} & {}, {
|
||||
prev: () => void;
|
||||
next: () => void;
|
||||
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (v: unknown) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:actions" | "v-slot:default" | "v-slot:header" | "v-slot:header-item" | "v-slot:icon" | "v-slot:item" | "v-slot:next" | "v-slot:prev" | "v-slot:subtitle" | "v-slot:title" | "v-slots" | `v-slot:header-item.${string}` | `v-slot:item.${string}`>, string, {
|
||||
style: import("vue").StyleValue;
|
||||
mobile: boolean | null;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
multiple: boolean;
|
||||
mandatory: "force" | boolean;
|
||||
selectedClass: string;
|
||||
disabled: boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
altLabels: boolean;
|
||||
editable: boolean;
|
||||
hideActions: boolean;
|
||||
items: readonly StepperItem[];
|
||||
itemTitle: SelectItemKey;
|
||||
itemValue: SelectItemKey;
|
||||
itemProps: SelectItemKey;
|
||||
nonLinear: boolean;
|
||||
flat: boolean;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
[x: `header-item.${string}`]: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
[x: `item.${string}`]: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
actions: (arg: VStepperSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
default: (arg: VStepperSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
header: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'header-item': (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
icon: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
title: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
subtitle: (arg: StepperItemSlot) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
item: (arg: StepperItem) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new <TModel>(props: {
|
||||
modelValue?: TModel;
|
||||
'onUpdate:modelValue'?: (value: TModel) => void;
|
||||
}, slots: VStepperSlots) => GenericProps<typeof props, typeof slots>) & import("../../util/index.js").FilterPropsOptions<{
|
||||
theme: StringConstructor;
|
||||
class: PropType<import("../../composables/component.js").ClassValue>;
|
||||
style: {
|
||||
type: PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
mobile: {
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
};
|
||||
mobileBreakpoint: PropType<number | import("../../types.js").DisplayBreakpoint>;
|
||||
border: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
elevation: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
};
|
||||
rounded: {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
tile: BooleanConstructor;
|
||||
tag: {
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
modelValue: {
|
||||
type: null;
|
||||
default: undefined;
|
||||
};
|
||||
multiple: BooleanConstructor;
|
||||
mandatory: {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
};
|
||||
max: NumberConstructor;
|
||||
selectedClass: {
|
||||
type: PropType<string>;
|
||||
default: string;
|
||||
};
|
||||
disabled: BooleanConstructor;
|
||||
height: (NumberConstructor | StringConstructor)[];
|
||||
maxHeight: (NumberConstructor | StringConstructor)[];
|
||||
maxWidth: (NumberConstructor | StringConstructor)[];
|
||||
minHeight: (NumberConstructor | StringConstructor)[];
|
||||
minWidth: (NumberConstructor | StringConstructor)[];
|
||||
width: (NumberConstructor | StringConstructor)[];
|
||||
location: PropType<import("../../util/index.js").Anchor | null>;
|
||||
position: {
|
||||
type: PropType<"absolute" | "fixed" | "relative" | "static" | "sticky">;
|
||||
validator: (v: any) => boolean;
|
||||
};
|
||||
color: StringConstructor;
|
||||
prevText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
nextText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
altLabels: BooleanConstructor;
|
||||
bgColor: StringConstructor;
|
||||
completeIcon: PropType<IconValue>;
|
||||
editIcon: PropType<IconValue>;
|
||||
editable: BooleanConstructor;
|
||||
errorIcon: PropType<IconValue>;
|
||||
hideActions: BooleanConstructor;
|
||||
items: {
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
};
|
||||
itemTitle: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
itemValue: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
itemProps: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
nonLinear: BooleanConstructor;
|
||||
flat: BooleanConstructor;
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
theme: StringConstructor;
|
||||
class: PropType<import("../../composables/component.js").ClassValue>;
|
||||
style: {
|
||||
type: PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
mobile: {
|
||||
type: PropType<boolean | null>;
|
||||
default: boolean;
|
||||
};
|
||||
mobileBreakpoint: PropType<number | import("../../types.js").DisplayBreakpoint>;
|
||||
border: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
elevation: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
};
|
||||
rounded: {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
tile: BooleanConstructor;
|
||||
tag: {
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
modelValue: {
|
||||
type: null;
|
||||
default: undefined;
|
||||
};
|
||||
multiple: BooleanConstructor;
|
||||
mandatory: {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
};
|
||||
max: NumberConstructor;
|
||||
selectedClass: {
|
||||
type: PropType<string>;
|
||||
default: string;
|
||||
};
|
||||
disabled: BooleanConstructor;
|
||||
height: (NumberConstructor | StringConstructor)[];
|
||||
maxHeight: (NumberConstructor | StringConstructor)[];
|
||||
maxWidth: (NumberConstructor | StringConstructor)[];
|
||||
minHeight: (NumberConstructor | StringConstructor)[];
|
||||
minWidth: (NumberConstructor | StringConstructor)[];
|
||||
width: (NumberConstructor | StringConstructor)[];
|
||||
location: PropType<import("../../util/index.js").Anchor | null>;
|
||||
position: {
|
||||
type: PropType<"absolute" | "fixed" | "relative" | "static" | "sticky">;
|
||||
validator: (v: any) => boolean;
|
||||
};
|
||||
color: StringConstructor;
|
||||
prevText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
nextText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
altLabels: BooleanConstructor;
|
||||
bgColor: StringConstructor;
|
||||
completeIcon: PropType<IconValue>;
|
||||
editIcon: PropType<IconValue>;
|
||||
editable: BooleanConstructor;
|
||||
errorIcon: PropType<IconValue>;
|
||||
hideActions: BooleanConstructor;
|
||||
items: {
|
||||
type: PropType<readonly StepperItem[]>;
|
||||
default: () => never[];
|
||||
};
|
||||
itemTitle: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
itemValue: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
itemProps: {
|
||||
type: PropType<SelectItemKey>;
|
||||
default: string;
|
||||
};
|
||||
nonLinear: BooleanConstructor;
|
||||
flat: BooleanConstructor;
|
||||
}>>;
|
||||
export type VStepper = InstanceType<typeof VStepper>;
|
||||
+180
@@ -0,0 +1,180 @@
|
||||
import { Fragment as _Fragment, createVNode as _createVNode, createElementVNode as _createElementVNode, mergeProps as _mergeProps } from "vue";
|
||||
// Styles
|
||||
import "./VStepper.css";
|
||||
|
||||
// Components
|
||||
import { VStepperSymbol } from "./shared.js";
|
||||
import { makeVStepperActionsProps, VStepperActions } from "./VStepperActions.js";
|
||||
import { VStepperHeader } from "./VStepperHeader.js";
|
||||
import { VStepperItem } from "./VStepperItem.js";
|
||||
import { VStepperWindow } from "./VStepperWindow.js";
|
||||
import { VStepperWindowItem } from "./VStepperWindowItem.js";
|
||||
import { VDivider } from "../VDivider/index.js";
|
||||
import { makeVSheetProps, VSheet } from "../VSheet/VSheet.js"; // Composables
|
||||
import { provideDefaults } from "../../composables/defaults.js";
|
||||
import { makeDisplayProps, useDisplay } from "../../composables/display.js";
|
||||
import { makeGroupProps, useGroup } from "../../composables/group.js";
|
||||
import { IconValue } from "../../composables/icons.js"; // Utilities
|
||||
import { computed, toRefs } from 'vue';
|
||||
import { genericComponent, getPropertyFromItem, pick, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeStepperProps = propsFactory({
|
||||
altLabels: Boolean,
|
||||
bgColor: String,
|
||||
completeIcon: IconValue,
|
||||
editIcon: IconValue,
|
||||
editable: Boolean,
|
||||
errorIcon: IconValue,
|
||||
hideActions: Boolean,
|
||||
items: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
itemTitle: {
|
||||
type: [String, Array, Function],
|
||||
default: 'title'
|
||||
},
|
||||
itemValue: {
|
||||
type: [String, Array, Function],
|
||||
default: 'value'
|
||||
},
|
||||
itemProps: {
|
||||
type: [Boolean, String, Array, Function],
|
||||
default: 'props'
|
||||
},
|
||||
nonLinear: Boolean,
|
||||
flat: Boolean,
|
||||
...makeDisplayProps()
|
||||
}, 'Stepper');
|
||||
export const makeVStepperProps = propsFactory({
|
||||
...makeStepperProps(),
|
||||
...makeGroupProps({
|
||||
mandatory: 'force',
|
||||
selectedClass: 'v-stepper-item--selected'
|
||||
}),
|
||||
...makeVSheetProps(),
|
||||
...pick(makeVStepperActionsProps(), ['prevText', 'nextText'])
|
||||
}, 'VStepper');
|
||||
export const VStepper = genericComponent()({
|
||||
name: 'VStepper',
|
||||
props: makeVStepperProps(),
|
||||
emits: {
|
||||
'update:modelValue': v => true
|
||||
},
|
||||
setup(props, {
|
||||
slots
|
||||
}) {
|
||||
const {
|
||||
items: _items,
|
||||
next,
|
||||
prev,
|
||||
selected
|
||||
} = useGroup(props, VStepperSymbol);
|
||||
const {
|
||||
displayClasses,
|
||||
mobile
|
||||
} = useDisplay(props);
|
||||
const {
|
||||
completeIcon,
|
||||
editIcon,
|
||||
errorIcon,
|
||||
color,
|
||||
editable,
|
||||
prevText,
|
||||
nextText
|
||||
} = toRefs(props);
|
||||
const items = computed(() => props.items.map((item, index) => {
|
||||
const title = getPropertyFromItem(item, props.itemTitle, item);
|
||||
const value = getPropertyFromItem(item, props.itemValue, index + 1);
|
||||
const itemProps = props.itemProps === true ? item : getPropertyFromItem(item, props.itemProps);
|
||||
const _props = {
|
||||
title,
|
||||
value,
|
||||
...itemProps
|
||||
};
|
||||
return {
|
||||
title: _props.title,
|
||||
value: _props.value,
|
||||
props: _props,
|
||||
raw: item
|
||||
};
|
||||
}));
|
||||
const activeIndex = computed(() => {
|
||||
return _items.value.findIndex(item => selected.value.includes(item.id));
|
||||
});
|
||||
const disabled = computed(() => {
|
||||
if (props.disabled) return props.disabled;
|
||||
if (activeIndex.value === 0) return 'prev';
|
||||
if (activeIndex.value === _items.value.length - 1) return 'next';
|
||||
return false;
|
||||
});
|
||||
provideDefaults({
|
||||
VStepperItem: {
|
||||
editable,
|
||||
errorIcon,
|
||||
completeIcon,
|
||||
editIcon,
|
||||
prevText,
|
||||
nextText
|
||||
},
|
||||
VStepperActions: {
|
||||
color,
|
||||
disabled,
|
||||
prevText,
|
||||
nextText
|
||||
}
|
||||
});
|
||||
useRender(() => {
|
||||
const sheetProps = VSheet.filterProps(props);
|
||||
const hasHeader = !!(slots.header || props.items.length);
|
||||
const hasWindow = props.items.length > 0;
|
||||
const hasActions = !props.hideActions && !!(hasWindow || slots.actions);
|
||||
return _createVNode(VSheet, _mergeProps(sheetProps, {
|
||||
"color": props.bgColor,
|
||||
"class": ['v-stepper', {
|
||||
'v-stepper--alt-labels': props.altLabels,
|
||||
'v-stepper--flat': props.flat,
|
||||
'v-stepper--non-linear': props.nonLinear,
|
||||
'v-stepper--mobile': mobile.value
|
||||
}, displayClasses.value, props.class],
|
||||
"style": props.style
|
||||
}), {
|
||||
default: () => [hasHeader && _createVNode(VStepperHeader, {
|
||||
"key": "stepper-header"
|
||||
}, {
|
||||
default: () => [items.value.map(({
|
||||
raw,
|
||||
...item
|
||||
}, index) => _createElementVNode(_Fragment, null, [!!index && _createVNode(VDivider, null, null), _createVNode(VStepperItem, item.props, {
|
||||
default: slots[`header-item.${item.value}`] ?? slots.header,
|
||||
icon: slots.icon,
|
||||
title: slots.title,
|
||||
subtitle: slots.subtitle
|
||||
})]))]
|
||||
}), hasWindow && _createVNode(VStepperWindow, {
|
||||
"key": "stepper-window"
|
||||
}, {
|
||||
default: () => [items.value.map(item => _createVNode(VStepperWindowItem, {
|
||||
"value": item.value
|
||||
}, {
|
||||
default: () => slots[`item.${item.value}`]?.(item) ?? slots.item?.(item)
|
||||
}))]
|
||||
}), slots.default?.({
|
||||
prev,
|
||||
next
|
||||
}), hasActions && (slots.actions?.({
|
||||
next,
|
||||
prev
|
||||
}) ?? _createVNode(VStepperActions, {
|
||||
"key": "stepper-actions",
|
||||
"onClick:prev": prev,
|
||||
"onClick:next": next
|
||||
}, slots))]
|
||||
});
|
||||
});
|
||||
return {
|
||||
prev,
|
||||
next
|
||||
};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VStepper.js.map
|
||||
+1
File diff suppressed because one or more lines are too long
+52
@@ -0,0 +1,52 @@
|
||||
@use '../../styles/settings'
|
||||
@use '../../styles/tools'
|
||||
@use './variables' as *
|
||||
|
||||
@include tools.layer('components')
|
||||
.v-stepper.v-sheet
|
||||
overflow: hidden
|
||||
@include tools.elevation($stepper-elevation)
|
||||
@include tools.rounded($stepper-border-radius)
|
||||
|
||||
&.v-stepper--flat
|
||||
@include tools.elevation(0)
|
||||
|
||||
.v-stepper-header
|
||||
align-items: center
|
||||
display: flex
|
||||
position: relative
|
||||
overflow-x: auto
|
||||
justify-content: space-between
|
||||
z-index: 1
|
||||
@include tools.elevation($stepper-header-elevation)
|
||||
|
||||
.v-divider
|
||||
margin: $stepper-header-divider-margin
|
||||
|
||||
&:last-child
|
||||
margin-inline-end: 0
|
||||
|
||||
&:first-child
|
||||
margin-inline-start: 0
|
||||
|
||||
.v-stepper--alt-labels &
|
||||
height: auto
|
||||
|
||||
.v-divider
|
||||
align-self: flex-start
|
||||
margin: $stepper-alt-labels-header-divider
|
||||
|
||||
.v-stepper-window
|
||||
margin: $stepper-window-margin
|
||||
|
||||
.v-stepper-actions
|
||||
display: flex
|
||||
align-items: center
|
||||
justify-content: space-between
|
||||
padding: $stepper-actions-padding
|
||||
|
||||
.v-stepper &
|
||||
padding: $stepper-actions-stepper-padding
|
||||
|
||||
.v-stepper-window-item &
|
||||
padding: $stepper-actions-stepper-window-item-padding
|
||||
+285
@@ -0,0 +1,285 @@
|
||||
import type { PropType } from 'vue';
|
||||
export type VStepperActionsSlots = {
|
||||
prev: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
};
|
||||
next: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
};
|
||||
};
|
||||
export declare const makeVStepperActionsProps: <Defaults extends {
|
||||
color?: unknown;
|
||||
disabled?: unknown;
|
||||
prevText?: unknown;
|
||||
nextText?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? {
|
||||
type: PropType<boolean | 'next' | 'prev'>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | 'next' | 'prev'>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["disabled"] ? "next" | "prev" | boolean : "next" | "prev" | boolean | Defaults["disabled"]>;
|
||||
default: unknown extends Defaults["disabled"] ? "next" | "prev" | boolean : Defaults["disabled"] | NonNullable<"next" | "prev" | boolean>;
|
||||
};
|
||||
prevText: unknown extends Defaults["prevText"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["prevText"] ? string : string | Defaults["prevText"]>;
|
||||
default: unknown extends Defaults["prevText"] ? string : string | Defaults["prevText"];
|
||||
};
|
||||
nextText: unknown extends Defaults["nextText"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["nextText"] ? string : string | Defaults["nextText"]>;
|
||||
default: unknown extends Defaults["nextText"] ? string : string | Defaults["nextText"];
|
||||
};
|
||||
};
|
||||
export declare const VStepperActions: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
} & {
|
||||
color?: string | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
prev?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | {} | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
prev?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:next"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:prev"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onClick:next"?: (() => any) | undefined;
|
||||
"onClick:prev"?: (() => any) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
||||
'click:prev': () => true;
|
||||
'click:next': () => true;
|
||||
}, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
prev: (arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
} & {
|
||||
color?: string | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
prev?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | {} | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
prev?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:next"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:prev"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onClick:next"?: (() => any) | undefined;
|
||||
"onClick:prev"?: (() => any) | undefined;
|
||||
}, {}, {}, {}, {}, {
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
} & {
|
||||
color?: string | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
prev?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | {} | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
prev?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
next?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:next"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:prev"?: false | ((arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onClick:next"?: (() => any) | undefined;
|
||||
"onClick:prev"?: (() => any) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
||||
'click:prev': () => true;
|
||||
'click:next': () => true;
|
||||
}, string, {
|
||||
disabled: "next" | "prev" | boolean;
|
||||
prevText: string;
|
||||
nextText: string;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
prev: (arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
onClick: () => void;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("../../util/index.js").FilterPropsOptions<{
|
||||
color: StringConstructor;
|
||||
disabled: {
|
||||
type: PropType<boolean | 'next' | 'prev'>;
|
||||
default: boolean;
|
||||
};
|
||||
prevText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
nextText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
color: StringConstructor;
|
||||
disabled: {
|
||||
type: PropType<boolean | 'next' | 'prev'>;
|
||||
default: boolean;
|
||||
};
|
||||
prevText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
nextText: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
}>>;
|
||||
export type VStepperActions = InstanceType<typeof VStepperActions>;
|
||||
+81
@@ -0,0 +1,81 @@
|
||||
import { createVNode as _createVNode, createElementVNode as _createElementVNode } from "vue";
|
||||
// Components
|
||||
import { VBtn } from "../VBtn/VBtn.js";
|
||||
import { VDefaultsProvider } from "../VDefaultsProvider/VDefaultsProvider.js"; // Composables
|
||||
import { useLocale } from "../../composables/locale.js"; // Utilities
|
||||
import { genericComponent, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeVStepperActionsProps = propsFactory({
|
||||
color: String,
|
||||
disabled: {
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
prevText: {
|
||||
type: String,
|
||||
default: '$vuetify.stepper.prev'
|
||||
},
|
||||
nextText: {
|
||||
type: String,
|
||||
default: '$vuetify.stepper.next'
|
||||
}
|
||||
}, 'VStepperActions');
|
||||
export const VStepperActions = genericComponent()({
|
||||
name: 'VStepperActions',
|
||||
props: makeVStepperActionsProps(),
|
||||
emits: {
|
||||
'click:prev': () => true,
|
||||
'click:next': () => true
|
||||
},
|
||||
setup(props, {
|
||||
emit,
|
||||
slots
|
||||
}) {
|
||||
const {
|
||||
t
|
||||
} = useLocale();
|
||||
function onClickPrev() {
|
||||
emit('click:prev');
|
||||
}
|
||||
function onClickNext() {
|
||||
emit('click:next');
|
||||
}
|
||||
useRender(() => {
|
||||
const prevSlotProps = {
|
||||
onClick: onClickPrev
|
||||
};
|
||||
const nextSlotProps = {
|
||||
onClick: onClickNext
|
||||
};
|
||||
return _createElementVNode("div", {
|
||||
"class": "v-stepper-actions"
|
||||
}, [_createVNode(VDefaultsProvider, {
|
||||
"defaults": {
|
||||
VBtn: {
|
||||
disabled: ['prev', true].includes(props.disabled),
|
||||
text: t(props.prevText),
|
||||
variant: 'text'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
default: () => [slots.prev?.({
|
||||
props: prevSlotProps
|
||||
}) ?? _createVNode(VBtn, prevSlotProps, null)]
|
||||
}), _createVNode(VDefaultsProvider, {
|
||||
"defaults": {
|
||||
VBtn: {
|
||||
color: props.color,
|
||||
disabled: ['next', true].includes(props.disabled),
|
||||
text: t(props.nextText),
|
||||
variant: 'tonal'
|
||||
}
|
||||
}
|
||||
}, {
|
||||
default: () => [slots.next?.({
|
||||
props: nextSlotProps
|
||||
}) ?? _createVNode(VBtn, nextSlotProps, null)]
|
||||
})]);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VStepperActions.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"VStepperActions.js","names":["VBtn","VDefaultsProvider","useLocale","genericComponent","propsFactory","useRender","makeVStepperActionsProps","color","String","disabled","type","Boolean","default","prevText","nextText","VStepperActions","name","props","emits","click:prev","click:next","setup","emit","slots","t","onClickPrev","onClickNext","prevSlotProps","onClick","nextSlotProps","_createElementVNode","_createVNode","includes","text","variant","prev","next"],"sources":["../../../src/components/VStepper/VStepperActions.tsx"],"sourcesContent":["// Components\nimport { VBtn } from '@/components/VBtn/VBtn'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider/VDefaultsProvider'\n\n// Composables\nimport { useLocale } from '@/composables/locale'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VStepperActionsSlots = {\n prev: {\n props: { onClick: () => void }\n }\n next: {\n props: { onClick: () => void }\n }\n}\n\nexport const makeVStepperActionsProps = propsFactory({\n color: String,\n disabled: {\n type: [Boolean, String] as PropType<boolean | 'next' | 'prev'>,\n default: false,\n },\n prevText: {\n type: String,\n default: '$vuetify.stepper.prev',\n },\n nextText: {\n type: String,\n default: '$vuetify.stepper.next',\n },\n}, 'VStepperActions')\n\nexport const VStepperActions = genericComponent<VStepperActionsSlots>()({\n name: 'VStepperActions',\n\n props: makeVStepperActionsProps(),\n\n emits: {\n 'click:prev': () => true,\n 'click:next': () => true,\n },\n\n setup (props, { emit, slots }) {\n const { t } = useLocale()\n function onClickPrev () {\n emit('click:prev')\n }\n\n function onClickNext () {\n emit('click:next')\n }\n\n useRender(() => {\n const prevSlotProps = {\n onClick: onClickPrev,\n }\n const nextSlotProps = {\n onClick: onClickNext,\n }\n\n return (\n <div class=\"v-stepper-actions\">\n <VDefaultsProvider\n defaults={{\n VBtn: {\n disabled: ['prev', true].includes(props.disabled),\n text: t(props.prevText),\n variant: 'text',\n },\n }}\n >\n { slots.prev?.({ props: prevSlotProps }) ?? (\n <VBtn { ...prevSlotProps } />\n )}\n </VDefaultsProvider>\n\n <VDefaultsProvider\n defaults={{\n VBtn: {\n color: props.color,\n disabled: ['next', true].includes(props.disabled),\n text: t(props.nextText),\n variant: 'tonal',\n },\n }}\n >\n { slots.next?.({ props: nextSlotProps }) ?? (\n <VBtn { ...nextSlotProps } />\n )}\n </VDefaultsProvider>\n </div>\n )\n })\n\n return {}\n },\n})\n\nexport type VStepperActions = InstanceType<typeof VStepperActions>\n"],"mappings":";AAAA;AAAA,SACSA,IAAI;AAAA,SACJC,iBAAiB,qDAE1B;AAAA,SACSC,SAAS,uCAElB;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS,+BAElD;AAYA,OAAO,MAAMC,wBAAwB,GAAGF,YAAY,CAAC;EACnDG,KAAK,EAAEC,MAAM;EACbC,QAAQ,EAAE;IACRC,IAAI,EAAE,CAACC,OAAO,EAAEH,MAAM,CAAwC;IAC9DI,OAAO,EAAE;EACX,CAAC;EACDC,QAAQ,EAAE;IACRH,IAAI,EAAEF,MAAM;IACZI,OAAO,EAAE;EACX,CAAC;EACDE,QAAQ,EAAE;IACRJ,IAAI,EAAEF,MAAM;IACZI,OAAO,EAAE;EACX;AACF,CAAC,EAAE,iBAAiB,CAAC;AAErB,OAAO,MAAMG,eAAe,GAAGZ,gBAAgB,CAAuB,CAAC,CAAC;EACtEa,IAAI,EAAE,iBAAiB;EAEvBC,KAAK,EAAEX,wBAAwB,CAAC,CAAC;EAEjCY,KAAK,EAAE;IACL,YAAY,EAAEC,CAAA,KAAM,IAAI;IACxB,YAAY,EAAEC,CAAA,KAAM;EACtB,CAAC;EAEDC,KAAKA,CAAEJ,KAAK,EAAE;IAAEK,IAAI;IAAEC;EAAM,CAAC,EAAE;IAC7B,MAAM;MAAEC;IAAE,CAAC,GAAGtB,SAAS,CAAC,CAAC;IACzB,SAASuB,WAAWA,CAAA,EAAI;MACtBH,IAAI,CAAC,YAAY,CAAC;IACpB;IAEA,SAASI,WAAWA,CAAA,EAAI;MACtBJ,IAAI,CAAC,YAAY,CAAC;IACpB;IAEAjB,SAAS,CAAC,MAAM;MACd,MAAMsB,aAAa,GAAG;QACpBC,OAAO,EAAEH;MACX,CAAC;MACD,MAAMI,aAAa,GAAG;QACpBD,OAAO,EAAEF;MACX,CAAC;MAED,OAAAI,mBAAA;QAAA;MAAA,IAAAC,YAAA,CAAA9B,iBAAA;QAAA,YAGgB;UACRD,IAAI,EAAE;YACJS,QAAQ,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAACuB,QAAQ,CAACf,KAAK,CAACR,QAAQ,CAAC;YACjDwB,IAAI,EAAET,CAAC,CAACP,KAAK,CAACJ,QAAQ,CAAC;YACvBqB,OAAO,EAAE;UACX;QACF;MAAC;QAAAtB,OAAA,EAAAA,CAAA,MAECW,KAAK,CAACY,IAAI,GAAG;UAAElB,KAAK,EAAEU;QAAc,CAAC,CAAC,IAAAI,YAAA,CAAA/B,IAAA,EAC3B2B,aAAa,OACzB;MAAA,IAAAI,YAAA,CAAA9B,iBAAA;QAAA,YAIS;UACRD,IAAI,EAAE;YACJO,KAAK,EAAEU,KAAK,CAACV,KAAK;YAClBE,QAAQ,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAACuB,QAAQ,CAACf,KAAK,CAACR,QAAQ,CAAC;YACjDwB,IAAI,EAAET,CAAC,CAACP,KAAK,CAACH,QAAQ,CAAC;YACvBoB,OAAO,EAAE;UACX;QACF;MAAC;QAAAtB,OAAA,EAAAA,CAAA,MAECW,KAAK,CAACa,IAAI,GAAG;UAAEnB,KAAK,EAAEY;QAAc,CAAC,CAAC,IAAAE,YAAA,CAAA/B,IAAA,EAC3B6B,aAAa,OACzB;MAAA;IAIT,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC","ignoreList":[]}
|
||||
+105
@@ -0,0 +1,105 @@
|
||||
export declare const VStepperHeader: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string;
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("../../util/index.js").FilterPropsOptions<{
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
tag: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
tag: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
}>>;
|
||||
export type VStepperHeader = InstanceType<typeof VStepperHeader>;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
// Utilities
|
||||
import { createSimpleFunctional } from "../../util/index.js";
|
||||
export const VStepperHeader = createSimpleFunctional('v-stepper-header');
|
||||
//# sourceMappingURL=VStepperHeader.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"VStepperHeader.js","names":["createSimpleFunctional","VStepperHeader"],"sources":["../../../src/components/VStepper/VStepperHeader.ts"],"sourcesContent":["// Utilities\nimport { createSimpleFunctional } from '@/util'\n\nexport const VStepperHeader = createSimpleFunctional('v-stepper-header')\n\nexport type VStepperHeader = InstanceType<typeof VStepperHeader>\n"],"mappings":"AAAA;AAAA,SACSA,sBAAsB;AAE/B,OAAO,MAAMC,cAAc,GAAGD,sBAAsB,CAAC,kBAAkB,CAAC","ignoreList":[]}
|
||||
+128
@@ -0,0 +1,128 @@
|
||||
@layer vuetify-components {
|
||||
.v-stepper-item {
|
||||
margin: 0;
|
||||
font: inherit;
|
||||
overflow: visible;
|
||||
text-transform: none;
|
||||
background-color: transparent;
|
||||
border-style: none;
|
||||
color: inherit;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
display: inline-flex;
|
||||
flex: none;
|
||||
outline: none;
|
||||
opacity: var(--v-medium-emphasis-opacity);
|
||||
padding: 1.5rem;
|
||||
position: relative;
|
||||
transition-duration: 0.2s;
|
||||
transition-property: opacity;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.v-stepper-item:hover > .v-stepper-item__overlay {
|
||||
opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
.v-stepper-item:focus-visible > .v-stepper-item__overlay {
|
||||
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
@supports not selector(:focus-visible) {
|
||||
.v-stepper-item:focus > .v-stepper-item__overlay {
|
||||
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
}
|
||||
.v-stepper-item--active > .v-stepper-item__overlay, .v-stepper-item[aria-haspopup=menu][aria-expanded=true] > .v-stepper-item__overlay {
|
||||
opacity: calc(var(--v-activated-opacity) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
.v-stepper-item--active:hover > .v-stepper-item__overlay, .v-stepper-item[aria-haspopup=menu][aria-expanded=true]:hover > .v-stepper-item__overlay {
|
||||
opacity: calc((var(--v-activated-opacity) + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
.v-stepper-item--active:focus-visible > .v-stepper-item__overlay, .v-stepper-item[aria-haspopup=menu][aria-expanded=true]:focus-visible > .v-stepper-item__overlay {
|
||||
opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
@supports not selector(:focus-visible) {
|
||||
.v-stepper-item--active:focus > .v-stepper-item__overlay, .v-stepper-item[aria-haspopup=menu][aria-expanded=true]:focus > .v-stepper-item__overlay {
|
||||
opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
}
|
||||
.v-stepper--non-linear .v-stepper-item {
|
||||
opacity: var(--v-high-emphasis-opacity);
|
||||
}
|
||||
.v-stepper-item--selected {
|
||||
opacity: 1;
|
||||
}
|
||||
.v-stepper-item--error {
|
||||
color: rgb(var(--v-theme-error));
|
||||
}
|
||||
.v-stepper-item--disabled {
|
||||
opacity: var(--v-medium-emphasis-opacity);
|
||||
}
|
||||
.v-stepper-item[disabled], .v-stepper-item--disabled {
|
||||
pointer-events: none;
|
||||
}
|
||||
.v-stepper--alt-labels .v-stepper-item {
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-basis: 175px;
|
||||
}
|
||||
.v-stepper-item__avatar.v-avatar {
|
||||
background: color-mix(in srgb, rgb(var(--v-theme-surface-variant)) calc(var(--v-medium-emphasis-opacity) * 100%), transparent);
|
||||
color: rgb(var(--v-theme-on-surface-variant));
|
||||
font-size: 0.75rem;
|
||||
margin-inline-end: 8px;
|
||||
}
|
||||
.v-stepper--mobile .v-stepper-item__avatar.v-avatar {
|
||||
margin-inline-end: 0;
|
||||
}
|
||||
.v-stepper-item__avatar.v-avatar .v-icon {
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.v-stepper-item--selected .v-stepper-item__avatar.v-avatar, .v-stepper-item--complete .v-stepper-item__avatar.v-avatar {
|
||||
background: rgb(var(--v-theme-surface-variant));
|
||||
}
|
||||
.v-stepper-item--error .v-stepper-item__avatar.v-avatar {
|
||||
background: rgb(var(--v-theme-error));
|
||||
}
|
||||
.v-stepper--alt-labels .v-stepper-item__avatar.v-avatar {
|
||||
margin-bottom: 16px;
|
||||
margin-inline-end: 0;
|
||||
}
|
||||
.v-stepper-item__content {
|
||||
text-align: start;
|
||||
}
|
||||
.v-stepper--alt-labels .v-stepper-item__content {
|
||||
text-align: center;
|
||||
}
|
||||
.v-stepper-item__title {
|
||||
line-height: 1;
|
||||
}
|
||||
.v-stepper--mobile .v-stepper-item__title {
|
||||
display: none;
|
||||
}
|
||||
.v-stepper-item__subtitle {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1;
|
||||
opacity: var(--v-medium-emphasis-opacity);
|
||||
}
|
||||
.v-stepper--mobile .v-stepper-item__subtitle {
|
||||
display: none;
|
||||
}
|
||||
.v-stepper-item__overlay {
|
||||
background-color: currentColor;
|
||||
border-radius: inherit;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease-in-out;
|
||||
}
|
||||
.v-stepper-item__overlay,
|
||||
.v-stepper-item__underlay {
|
||||
pointer-events: none;
|
||||
}
|
||||
.v-stepper-item__overlay,
|
||||
.v-stepper-item__underlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
+526
@@ -0,0 +1,526 @@
|
||||
|
||||
import { IconValue } from '../../composables/icons.js';
|
||||
import type { PropType } from 'vue';
|
||||
import type { RippleDirectiveBinding } from '../../directives/ripple/index.js';
|
||||
export type StepperItem = string | Record<string, any>;
|
||||
export type StepperItemSlot<T = any> = {
|
||||
canEdit: boolean;
|
||||
hasError: boolean;
|
||||
hasCompleted: boolean;
|
||||
title?: string | number;
|
||||
subtitle?: string | number;
|
||||
step: T;
|
||||
};
|
||||
export type VStepperItemSlots<T = any> = {
|
||||
default: StepperItemSlot<T>;
|
||||
icon: StepperItemSlot<T>;
|
||||
title: StepperItemSlot<T>;
|
||||
subtitle: StepperItemSlot<T>;
|
||||
};
|
||||
export type ValidationRule = () => string | boolean;
|
||||
export declare const makeStepperItemProps: <Defaults extends {
|
||||
color?: unknown;
|
||||
title?: unknown;
|
||||
subtitle?: unknown;
|
||||
complete?: unknown;
|
||||
completeIcon?: unknown;
|
||||
editable?: unknown;
|
||||
editIcon?: unknown;
|
||||
error?: unknown;
|
||||
errorIcon?: unknown;
|
||||
icon?: unknown;
|
||||
ripple?: unknown;
|
||||
rules?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
title: unknown extends Defaults["title"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["title"] ? string : string | Defaults["title"]>;
|
||||
default: unknown extends Defaults["title"] ? string : string | Defaults["title"];
|
||||
};
|
||||
subtitle: unknown extends Defaults["subtitle"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["subtitle"] ? string : string | Defaults["subtitle"]>;
|
||||
default: unknown extends Defaults["subtitle"] ? string : string | Defaults["subtitle"];
|
||||
};
|
||||
complete: unknown extends Defaults["complete"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["complete"] ? boolean : boolean | Defaults["complete"]>;
|
||||
default: unknown extends Defaults["complete"] ? boolean : boolean | Defaults["complete"];
|
||||
};
|
||||
completeIcon: unknown extends Defaults["completeIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editable: unknown extends Defaults["editable"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"]>;
|
||||
default: unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"];
|
||||
};
|
||||
editIcon: unknown extends Defaults["editIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
error: unknown extends Defaults["error"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"]>;
|
||||
default: unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"];
|
||||
};
|
||||
errorIcon: unknown extends Defaults["errorIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
icon: unknown extends Defaults["icon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["icon"] ? IconValue : Defaults["icon"] | IconValue>;
|
||||
default: unknown extends Defaults["icon"] ? IconValue : Defaults["icon"] | NonNullable<IconValue>;
|
||||
};
|
||||
ripple: unknown extends Defaults["ripple"] ? {
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["ripple"] ? boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined : boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | Defaults["ripple"] | undefined>;
|
||||
default: unknown extends Defaults["ripple"] ? boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined : Defaults["ripple"] | NonNullable<boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined>;
|
||||
};
|
||||
rules: unknown extends Defaults["rules"] ? {
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
} : Omit<{
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["rules"] ? readonly ValidationRule[] : readonly ValidationRule[] | Defaults["rules"]>;
|
||||
default: unknown extends Defaults["rules"] ? readonly ValidationRule[] : readonly ValidationRule[] | Defaults["rules"];
|
||||
};
|
||||
};
|
||||
export declare const makeVStepperItemProps: <Defaults extends {
|
||||
value?: unknown;
|
||||
disabled?: unknown;
|
||||
selectedClass?: unknown;
|
||||
color?: unknown;
|
||||
title?: unknown;
|
||||
subtitle?: unknown;
|
||||
complete?: unknown;
|
||||
completeIcon?: unknown;
|
||||
editable?: unknown;
|
||||
editIcon?: unknown;
|
||||
error?: unknown;
|
||||
errorIcon?: unknown;
|
||||
icon?: unknown;
|
||||
ripple?: unknown;
|
||||
rules?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
value: unknown extends Defaults["value"] ? null : {
|
||||
type: PropType<unknown extends Defaults["value"] ? any : any>;
|
||||
default: unknown extends Defaults["value"] ? any : any;
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"]>;
|
||||
default: unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"];
|
||||
};
|
||||
selectedClass: unknown extends Defaults["selectedClass"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"]>;
|
||||
default: unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"];
|
||||
};
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
title: unknown extends Defaults["title"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["title"] ? string : string | Defaults["title"]>;
|
||||
default: unknown extends Defaults["title"] ? string : string | Defaults["title"];
|
||||
};
|
||||
subtitle: unknown extends Defaults["subtitle"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["subtitle"] ? string : string | Defaults["subtitle"]>;
|
||||
default: unknown extends Defaults["subtitle"] ? string : string | Defaults["subtitle"];
|
||||
};
|
||||
complete: unknown extends Defaults["complete"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["complete"] ? boolean : boolean | Defaults["complete"]>;
|
||||
default: unknown extends Defaults["complete"] ? boolean : boolean | Defaults["complete"];
|
||||
};
|
||||
completeIcon: unknown extends Defaults["completeIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["completeIcon"] ? IconValue : Defaults["completeIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
editable: unknown extends Defaults["editable"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"]>;
|
||||
default: unknown extends Defaults["editable"] ? boolean : boolean | Defaults["editable"];
|
||||
};
|
||||
editIcon: unknown extends Defaults["editIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["editIcon"] ? IconValue : Defaults["editIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
error: unknown extends Defaults["error"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"]>;
|
||||
default: unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"];
|
||||
};
|
||||
errorIcon: unknown extends Defaults["errorIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["errorIcon"] ? IconValue : Defaults["errorIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
icon: unknown extends Defaults["icon"] ? PropType<IconValue> : {
|
||||
type: PropType<unknown extends Defaults["icon"] ? IconValue : Defaults["icon"] | IconValue>;
|
||||
default: unknown extends Defaults["icon"] ? IconValue : Defaults["icon"] | NonNullable<IconValue>;
|
||||
};
|
||||
ripple: unknown extends Defaults["ripple"] ? {
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["ripple"] ? boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined : boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | Defaults["ripple"] | undefined>;
|
||||
default: unknown extends Defaults["ripple"] ? boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined : Defaults["ripple"] | NonNullable<boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined>;
|
||||
};
|
||||
rules: unknown extends Defaults["rules"] ? {
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
} : Omit<{
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["rules"] ? readonly ValidationRule[] : readonly ValidationRule[] | Defaults["rules"]>;
|
||||
default: unknown extends Defaults["rules"] ? readonly ValidationRule[] : readonly ValidationRule[] | Defaults["rules"];
|
||||
};
|
||||
};
|
||||
export declare const VStepperItem: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
};
|
||||
rules: readonly ValidationRule[];
|
||||
} & {
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
color?: string | undefined;
|
||||
title?: string | undefined;
|
||||
subtitle?: string | undefined;
|
||||
icon?: IconValue | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:icon"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:subtitle"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:title"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onGroup:selected"?: ((val: {
|
||||
value: boolean;
|
||||
}) => any) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
||||
'group:selected': (val: {
|
||||
value: boolean;
|
||||
}) => true;
|
||||
}, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined;
|
||||
rules: readonly ValidationRule[];
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
default: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
icon: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
title: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
subtitle: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
};
|
||||
rules: readonly ValidationRule[];
|
||||
} & {
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
color?: string | undefined;
|
||||
title?: string | undefined;
|
||||
subtitle?: string | undefined;
|
||||
icon?: IconValue | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:icon"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:subtitle"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:title"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onGroup:selected"?: ((val: {
|
||||
value: boolean;
|
||||
}) => any) | undefined;
|
||||
}, {}, {}, {}, {}, {
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined;
|
||||
rules: readonly ValidationRule[];
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
};
|
||||
rules: readonly ValidationRule[];
|
||||
} & {
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
color?: string | undefined;
|
||||
title?: string | undefined;
|
||||
subtitle?: string | undefined;
|
||||
icon?: IconValue | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
icon?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
title?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
subtitle?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:icon"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:subtitle"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:title"?: false | ((arg: StepperItemSlot<any>) => import("vue").VNodeChild) | undefined;
|
||||
} & {
|
||||
"onGroup:selected"?: ((val: {
|
||||
value: boolean;
|
||||
}) => any) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
||||
'group:selected': (val: {
|
||||
value: boolean;
|
||||
}) => true;
|
||||
}, string, {
|
||||
disabled: boolean;
|
||||
complete: boolean;
|
||||
completeIcon: IconValue;
|
||||
editable: boolean;
|
||||
editIcon: IconValue;
|
||||
error: boolean;
|
||||
errorIcon: IconValue;
|
||||
ripple: boolean | {
|
||||
class?: string;
|
||||
keys?: string[];
|
||||
} | undefined;
|
||||
rules: readonly ValidationRule[];
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
default: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
icon: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
title: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
subtitle: (arg: StepperItemSlot<any>) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("../../util/index.js").FilterPropsOptions<{
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
color: StringConstructor;
|
||||
title: StringConstructor;
|
||||
subtitle: StringConstructor;
|
||||
complete: BooleanConstructor;
|
||||
completeIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
editable: BooleanConstructor;
|
||||
editIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
error: BooleanConstructor;
|
||||
errorIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
icon: PropType<IconValue>;
|
||||
ripple: {
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
};
|
||||
rules: {
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
};
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
color: StringConstructor;
|
||||
title: StringConstructor;
|
||||
subtitle: StringConstructor;
|
||||
complete: BooleanConstructor;
|
||||
completeIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
editable: BooleanConstructor;
|
||||
editIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
error: BooleanConstructor;
|
||||
errorIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
icon: PropType<IconValue>;
|
||||
ripple: {
|
||||
type: PropType<RippleDirectiveBinding['value']>;
|
||||
default: boolean;
|
||||
};
|
||||
rules: {
|
||||
type: PropType<readonly ValidationRule[]>;
|
||||
default: () => never[];
|
||||
};
|
||||
}>>;
|
||||
export type VStepperItem = InstanceType<typeof VStepperItem>;
|
||||
+120
@@ -0,0 +1,120 @@
|
||||
import { createVNode as _createVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, withDirectives as _withDirectives } from "vue";
|
||||
// Styles
|
||||
import "./VStepperItem.css";
|
||||
|
||||
// Components
|
||||
import { VAvatar } from "../VAvatar/VAvatar.js";
|
||||
import { VIcon } from "../VIcon/VIcon.js"; // Composables
|
||||
import { makeGroupItemProps, useGroupItem } from "../../composables/group.js";
|
||||
import { IconValue } from "../../composables/icons.js";
|
||||
import { genOverlays } from "../../composables/variant.js"; // Directives
|
||||
import vRipple from "../../directives/ripple/index.js"; // Utilities
|
||||
import { computed } from 'vue';
|
||||
import { VStepperSymbol } from "./shared.js";
|
||||
import { genericComponent, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeStepperItemProps = propsFactory({
|
||||
color: String,
|
||||
title: String,
|
||||
subtitle: String,
|
||||
complete: Boolean,
|
||||
completeIcon: {
|
||||
type: IconValue,
|
||||
default: '$complete'
|
||||
},
|
||||
editable: Boolean,
|
||||
editIcon: {
|
||||
type: IconValue,
|
||||
default: '$edit'
|
||||
},
|
||||
error: Boolean,
|
||||
errorIcon: {
|
||||
type: IconValue,
|
||||
default: '$error'
|
||||
},
|
||||
icon: IconValue,
|
||||
ripple: {
|
||||
type: [Boolean, Object],
|
||||
default: true
|
||||
},
|
||||
rules: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
}, 'StepperItem');
|
||||
export const makeVStepperItemProps = propsFactory({
|
||||
...makeStepperItemProps(),
|
||||
...makeGroupItemProps()
|
||||
}, 'VStepperItem');
|
||||
export const VStepperItem = genericComponent()({
|
||||
name: 'VStepperItem',
|
||||
directives: {
|
||||
vRipple
|
||||
},
|
||||
props: makeVStepperItemProps(),
|
||||
emits: {
|
||||
'group:selected': val => true
|
||||
},
|
||||
setup(props, {
|
||||
slots
|
||||
}) {
|
||||
const group = useGroupItem(props, VStepperSymbol, true);
|
||||
const step = computed(() => group?.value.value ?? props.value);
|
||||
const isValid = computed(() => props.rules.every(handler => handler() === true));
|
||||
const isClickable = computed(() => !props.disabled && props.editable);
|
||||
const canEdit = computed(() => !props.disabled && props.editable);
|
||||
const hasError = computed(() => props.error || !isValid.value);
|
||||
const hasCompleted = computed(() => props.complete || props.rules.length > 0 && isValid.value);
|
||||
const icon = computed(() => {
|
||||
if (hasError.value) return props.errorIcon;
|
||||
if (hasCompleted.value) return props.completeIcon;
|
||||
if (group.isSelected.value && props.editable) return props.editIcon;
|
||||
return props.icon;
|
||||
});
|
||||
const slotProps = computed(() => ({
|
||||
canEdit: canEdit.value,
|
||||
hasError: hasError.value,
|
||||
hasCompleted: hasCompleted.value,
|
||||
title: props.title,
|
||||
subtitle: props.subtitle,
|
||||
step: step.value,
|
||||
value: props.value
|
||||
}));
|
||||
useRender(() => {
|
||||
const hasColor = (!group || group.isSelected.value || hasCompleted.value || canEdit.value) && !hasError.value && !props.disabled;
|
||||
const hasTitle = !!(props.title != null || slots.title);
|
||||
const hasSubtitle = !!(props.subtitle != null || slots.subtitle);
|
||||
function onClick() {
|
||||
group?.toggle();
|
||||
}
|
||||
return _withDirectives(_createElementVNode("button", {
|
||||
"class": _normalizeClass(['v-stepper-item', {
|
||||
'v-stepper-item--complete': hasCompleted.value,
|
||||
'v-stepper-item--disabled': props.disabled,
|
||||
'v-stepper-item--error': hasError.value
|
||||
}, group?.selectedClass.value]),
|
||||
"disabled": !props.editable,
|
||||
"type": "button",
|
||||
"onClick": onClick
|
||||
}, [isClickable.value && genOverlays(true, 'v-stepper-item'), _createVNode(VAvatar, {
|
||||
"key": "stepper-avatar",
|
||||
"class": "v-stepper-item__avatar",
|
||||
"color": hasColor ? props.color : undefined,
|
||||
"size": 24
|
||||
}, {
|
||||
default: () => [slots.icon?.(slotProps.value) ?? (icon.value ? _createVNode(VIcon, {
|
||||
"icon": icon.value
|
||||
}, null) : step.value)]
|
||||
}), _createElementVNode("div", {
|
||||
"class": "v-stepper-item__content"
|
||||
}, [hasTitle && _createElementVNode("div", {
|
||||
"key": "title",
|
||||
"class": "v-stepper-item__title"
|
||||
}, [slots.title?.(slotProps.value) ?? props.title]), hasSubtitle && _createElementVNode("div", {
|
||||
"key": "subtitle",
|
||||
"class": "v-stepper-item__subtitle"
|
||||
}, [slots.subtitle?.(slotProps.value) ?? props.subtitle]), slots.default?.(slotProps.value)])]), [[vRipple, props.editable && props.ripple, null]]);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VStepperItem.js.map
|
||||
+1
File diff suppressed because one or more lines are too long
+102
@@ -0,0 +1,102 @@
|
||||
@use '../../styles/settings'
|
||||
@use '../../styles/tools'
|
||||
@use './variables' as *
|
||||
|
||||
@include tools.layer('components')
|
||||
.v-stepper-item
|
||||
margin: 0
|
||||
font: inherit
|
||||
overflow: visible
|
||||
text-transform: none
|
||||
background-color: transparent
|
||||
border-style: none
|
||||
color: inherit
|
||||
align-items: center
|
||||
align-self: stretch
|
||||
display: inline-flex
|
||||
flex: none
|
||||
outline: none
|
||||
opacity: $stepper-item-opacity
|
||||
padding: $stepper-item-padding
|
||||
position: relative
|
||||
transition-duration: $stepper-item-transition-duration
|
||||
transition-property: $stepper-item-transition-property
|
||||
transition-timing-function: $stepper-item-transition-timing-function
|
||||
|
||||
@include tools.states('.v-stepper-item__overlay')
|
||||
|
||||
.v-stepper--non-linear &
|
||||
opacity: var(--v-high-emphasis-opacity)
|
||||
|
||||
&--selected
|
||||
opacity: 1
|
||||
|
||||
&--error
|
||||
color: rgb(var(--v-theme-error))
|
||||
|
||||
&--disabled
|
||||
opacity: var(--v-medium-emphasis-opacity)
|
||||
|
||||
&[disabled],
|
||||
&--disabled
|
||||
pointer-events: none
|
||||
|
||||
.v-stepper--alt-labels &
|
||||
flex-direction: column
|
||||
justify-content: flex-start
|
||||
align-items: center
|
||||
flex-basis: $stepper-alt-labels-flex-basis
|
||||
|
||||
.v-stepper-item__avatar.v-avatar
|
||||
background: $stepper-item-avatar-background
|
||||
color: $stepper-item-avatar-color
|
||||
font-size: $stepper-item-avatar-font-size
|
||||
margin-inline-end: $stepper-item-avatar-margin-inline-end
|
||||
|
||||
.v-stepper--mobile &
|
||||
margin-inline-end: 0
|
||||
|
||||
.v-icon
|
||||
font-size: $stepper-item-avatar-icon-font-size
|
||||
|
||||
.v-stepper-item--selected &,
|
||||
.v-stepper-item--complete &
|
||||
background: rgb(var(--v-theme-surface-variant))
|
||||
|
||||
.v-stepper-item--error &
|
||||
background: rgb(var(--v-theme-error))
|
||||
|
||||
.v-stepper--alt-labels &
|
||||
margin-bottom: $stepper-item-alt-labels-margin-bottom
|
||||
margin-inline-end: 0
|
||||
|
||||
.v-stepper-item__content
|
||||
text-align: start
|
||||
|
||||
.v-stepper--alt-labels &
|
||||
text-align: center
|
||||
|
||||
.v-stepper-item__title
|
||||
line-height: $stepper-item-title-line-height
|
||||
|
||||
.v-stepper--mobile &
|
||||
display: none
|
||||
|
||||
.v-stepper-item__subtitle
|
||||
font-size: $stepper-item-subtitle-font-size
|
||||
line-height: $stepper-item-subtitle-line-height
|
||||
opacity: $stepper-item-subtitle-opacity
|
||||
|
||||
.v-stepper--mobile &
|
||||
display: none
|
||||
|
||||
.v-stepper-item__overlay
|
||||
background-color: currentColor
|
||||
border-radius: inherit
|
||||
opacity: 0
|
||||
transition: opacity .2s ease-in-out
|
||||
|
||||
.v-stepper-item__overlay,
|
||||
.v-stepper-item__underlay
|
||||
pointer-events: none
|
||||
@include tools.absolute()
|
||||
+285
@@ -0,0 +1,285 @@
|
||||
import type { VWindowSlots } from '../VWindow/VWindow.js';
|
||||
import type { GenericProps } from '../../util/index.js';
|
||||
export declare const makeVStepperWindowProps: <Defaults extends {
|
||||
theme?: unknown;
|
||||
class?: unknown;
|
||||
style?: unknown;
|
||||
tag?: unknown;
|
||||
reverse?: unknown;
|
||||
verticalArrows?: unknown;
|
||||
direction?: unknown;
|
||||
modelValue?: unknown;
|
||||
disabled?: unknown;
|
||||
selectedClass?: unknown;
|
||||
crossfade?: unknown;
|
||||
transitionDuration?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
theme: unknown extends Defaults["theme"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["theme"] ? string : string | Defaults["theme"]>;
|
||||
default: unknown extends Defaults["theme"] ? string : string | Defaults["theme"];
|
||||
};
|
||||
class: unknown extends Defaults["class"] ? import("vue").PropType<any> : {
|
||||
type: import("vue").PropType<unknown extends Defaults["class"] ? any : any>;
|
||||
default: unknown extends Defaults["class"] ? any : any;
|
||||
};
|
||||
style: unknown extends Defaults["style"] ? {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | import("vue").StyleValue>;
|
||||
default: unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | NonNullable<import("vue").StyleValue>;
|
||||
};
|
||||
tag: unknown extends Defaults["tag"] ? {
|
||||
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : string | Defaults["tag"] | import("../../util/index.js").JSXComponent>;
|
||||
default: unknown extends Defaults["tag"] ? string | import("../../util/index.js").JSXComponent : Defaults["tag"] | NonNullable<string | import("../../util/index.js").JSXComponent>;
|
||||
};
|
||||
reverse: unknown extends Defaults["reverse"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"]>;
|
||||
default: unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"];
|
||||
};
|
||||
verticalArrows: unknown extends Defaults["verticalArrows"] ? import("vue").PropType<"left" | "right" | boolean> : {
|
||||
type: import("vue").PropType<unknown extends Defaults["verticalArrows"] ? "left" | "right" | boolean : "left" | "right" | boolean | Defaults["verticalArrows"]>;
|
||||
default: unknown extends Defaults["verticalArrows"] ? "left" | "right" | boolean : Defaults["verticalArrows"] | NonNullable<"left" | "right" | boolean>;
|
||||
};
|
||||
direction: unknown extends Defaults["direction"] ? {
|
||||
type: import("vue").PropType<"horizontal" | "vertical">;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<"horizontal" | "vertical">;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["direction"] ? "horizontal" | "vertical" : "horizontal" | "vertical" | Defaults["direction"]>;
|
||||
default: unknown extends Defaults["direction"] ? "horizontal" | "vertical" : Defaults["direction"] | NonNullable<"horizontal" | "vertical">;
|
||||
};
|
||||
modelValue: unknown extends Defaults["modelValue"] ? null : {
|
||||
type: import("vue").PropType<unknown extends Defaults["modelValue"] ? any : any>;
|
||||
default: unknown extends Defaults["modelValue"] ? any : any;
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"]>;
|
||||
default: unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"];
|
||||
};
|
||||
selectedClass: unknown extends Defaults["selectedClass"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"]>;
|
||||
default: unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"];
|
||||
};
|
||||
crossfade: unknown extends Defaults["crossfade"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["crossfade"] ? boolean : boolean | Defaults["crossfade"]>;
|
||||
default: unknown extends Defaults["crossfade"] ? boolean : boolean | Defaults["crossfade"];
|
||||
};
|
||||
transitionDuration: unknown extends Defaults["transitionDuration"] ? NumberConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["transitionDuration"] ? number : number | Defaults["transitionDuration"]>;
|
||||
default: unknown extends Defaults["transitionDuration"] ? number : number | Defaults["transitionDuration"];
|
||||
};
|
||||
};
|
||||
export declare const VStepperWindow: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
} & {}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (v: unknown) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:additional" | "v-slot:default" | "v-slot:next" | "v-slot:prev" | "v-slots">, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
default: (arg: {
|
||||
group: import("../../composables/group.js").GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
additional: (arg: {
|
||||
group: import("../../composables/group.js").GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: (arg: {
|
||||
props: {
|
||||
icon: import("../../composables/icons.js").IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
icon: import("../../composables/icons.js").IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
} & {}, {}, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
} & {}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (v: unknown) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:additional" | "v-slot:default" | "v-slot:next" | "v-slot:prev" | "v-slots">, string, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
reverse: boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
crossfade: boolean;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
default: (arg: {
|
||||
group: import("../../composables/group.js").GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
additional: (arg: {
|
||||
group: import("../../composables/group.js").GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: (arg: {
|
||||
props: {
|
||||
icon: import("../../composables/icons.js").IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
icon: import("../../composables/icons.js").IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new <TModel>(props: {
|
||||
modelValue?: TModel;
|
||||
'onUpdate:modelValue'?: (value: TModel) => void;
|
||||
}, slots: VWindowSlots) => GenericProps<typeof props, typeof slots>) & import("../../util/index.js").FilterPropsOptions<{
|
||||
theme: StringConstructor;
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
tag: {
|
||||
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
reverse: BooleanConstructor;
|
||||
verticalArrows: import("vue").PropType<"left" | "right" | boolean>;
|
||||
direction: {
|
||||
type: import("vue").PropType<"horizontal" | "vertical">;
|
||||
default: string;
|
||||
};
|
||||
modelValue: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
crossfade: BooleanConstructor;
|
||||
transitionDuration: NumberConstructor;
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
theme: StringConstructor;
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
tag: {
|
||||
type: import("vue").PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
reverse: BooleanConstructor;
|
||||
verticalArrows: import("vue").PropType<"left" | "right" | boolean>;
|
||||
direction: {
|
||||
type: import("vue").PropType<"horizontal" | "vertical">;
|
||||
default: string;
|
||||
};
|
||||
modelValue: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
crossfade: BooleanConstructor;
|
||||
transitionDuration: NumberConstructor;
|
||||
}>>;
|
||||
export type VStepperWindow = InstanceType<typeof VStepperWindow>;
|
||||
+52
@@ -0,0 +1,52 @@
|
||||
import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
|
||||
// Components
|
||||
import { VStepperSymbol } from "./shared.js";
|
||||
import { makeVWindowProps, VWindow } from "../VWindow/VWindow.js"; // Composables
|
||||
import { useProxiedModel } from "../../composables/proxiedModel.js"; // Utilities
|
||||
import { computed, inject } from 'vue';
|
||||
import { genericComponent, omit, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeVStepperWindowProps = propsFactory({
|
||||
...omit(makeVWindowProps(), ['continuous', 'nextIcon', 'prevIcon', 'showArrows', 'touch', 'mandatory'])
|
||||
}, 'VStepperWindow');
|
||||
export const VStepperWindow = genericComponent()({
|
||||
name: 'VStepperWindow',
|
||||
props: makeVStepperWindowProps(),
|
||||
emits: {
|
||||
'update:modelValue': v => true
|
||||
},
|
||||
setup(props, {
|
||||
slots
|
||||
}) {
|
||||
const group = inject(VStepperSymbol, null);
|
||||
const _model = useProxiedModel(props, 'modelValue');
|
||||
const model = computed({
|
||||
get() {
|
||||
// Always return modelValue if defined
|
||||
// or if not within a VStepper group
|
||||
if (_model.value != null || !group) return _model.value;
|
||||
|
||||
// If inside of a VStepper, find the currently selected
|
||||
// item by id. Item value may be assigned by its index
|
||||
return group.items.value.find(item => group.selected.value.includes(item.id))?.value;
|
||||
},
|
||||
set(val) {
|
||||
_model.value = val;
|
||||
}
|
||||
});
|
||||
useRender(() => {
|
||||
const windowProps = VWindow.filterProps(props);
|
||||
return _createVNode(VWindow, _mergeProps({
|
||||
"_as": "VStepperWindow"
|
||||
}, windowProps, {
|
||||
"modelValue": model.value,
|
||||
"onUpdate:modelValue": $event => model.value = $event,
|
||||
"class": ['v-stepper-window', props.class],
|
||||
"style": props.style,
|
||||
"mandatory": false,
|
||||
"touch": false
|
||||
}), slots);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VStepperWindow.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"VStepperWindow.js","names":["VStepperSymbol","makeVWindowProps","VWindow","useProxiedModel","computed","inject","genericComponent","omit","propsFactory","useRender","makeVStepperWindowProps","VStepperWindow","name","props","emits","v","setup","slots","group","_model","model","get","value","items","find","item","selected","includes","id","set","val","windowProps","filterProps","_createVNode","_mergeProps","$event","class","style"],"sources":["../../../src/components/VStepper/VStepperWindow.tsx"],"sourcesContent":["// Components\nimport { VStepperSymbol } from './shared'\nimport { makeVWindowProps, VWindow } from '@/components/VWindow/VWindow'\n\n// Composables\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { genericComponent, omit, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { VWindowSlots } from '@/components/VWindow/VWindow'\nimport type { GenericProps } from '@/util'\n\nexport const makeVStepperWindowProps = propsFactory({\n ...omit(makeVWindowProps(), ['continuous', 'nextIcon', 'prevIcon', 'showArrows', 'touch', 'mandatory']),\n}, 'VStepperWindow')\n\nexport const VStepperWindow = genericComponent<new <TModel>(\n props: {\n modelValue?: TModel\n 'onUpdate:modelValue'?: (value: TModel) => void\n },\n slots: VWindowSlots\n) => GenericProps<typeof props, typeof slots>>()({\n name: 'VStepperWindow',\n\n props: makeVStepperWindowProps(),\n\n emits: {\n 'update:modelValue': (v: unknown) => true,\n },\n\n setup (props, { slots }) {\n const group = inject(VStepperSymbol, null)\n const _model = useProxiedModel(props, 'modelValue')\n\n const model = computed({\n get () {\n // Always return modelValue if defined\n // or if not within a VStepper group\n if (_model.value != null || !group) return _model.value\n\n // If inside of a VStepper, find the currently selected\n // item by id. Item value may be assigned by its index\n return group.items.value.find(item => group.selected.value.includes(item.id))?.value\n },\n set (val) {\n _model.value = val\n },\n })\n\n useRender(() => {\n const windowProps = VWindow.filterProps(props)\n\n return (\n <VWindow\n _as=\"VStepperWindow\"\n { ...windowProps }\n v-model={ model.value }\n class={[\n 'v-stepper-window',\n props.class,\n ]}\n style={ props.style }\n mandatory={ false }\n touch={ false }\n v-slots={ slots }\n />\n )\n })\n\n return {}\n },\n})\n\nexport type VStepperWindow = InstanceType<typeof VStepperWindow>\n"],"mappings":";AAAA;AAAA,SACSA,cAAc;AAAA,SACdC,gBAAgB,EAAEC,OAAO,iCAElC;AAAA,SACSC,eAAe,6CAExB;AACA,SAASC,QAAQ,EAAEC,MAAM,QAAQ,KAAK;AAAA,SAC7BC,gBAAgB,EAAEC,IAAI,EAAEC,YAAY,EAAEC,SAAS,+BAExD;AAIA,OAAO,MAAMC,uBAAuB,GAAGF,YAAY,CAAC;EAClD,GAAGD,IAAI,CAACN,gBAAgB,CAAC,CAAC,EAAE,CAAC,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW,CAAC;AACxG,CAAC,EAAE,gBAAgB,CAAC;AAEpB,OAAO,MAAMU,cAAc,GAAGL,gBAAgB,CAMC,CAAC,CAAC;EAC/CM,IAAI,EAAE,gBAAgB;EAEtBC,KAAK,EAAEH,uBAAuB,CAAC,CAAC;EAEhCI,KAAK,EAAE;IACL,mBAAmB,EAAGC,CAAU,IAAK;EACvC,CAAC;EAEDC,KAAKA,CAAEH,KAAK,EAAE;IAAEI;EAAM,CAAC,EAAE;IACvB,MAAMC,KAAK,GAAGb,MAAM,CAACL,cAAc,EAAE,IAAI,CAAC;IAC1C,MAAMmB,MAAM,GAAGhB,eAAe,CAACU,KAAK,EAAE,YAAY,CAAC;IAEnD,MAAMO,KAAK,GAAGhB,QAAQ,CAAC;MACrBiB,GAAGA,CAAA,EAAI;QACL;QACA;QACA,IAAIF,MAAM,CAACG,KAAK,IAAI,IAAI,IAAI,CAACJ,KAAK,EAAE,OAAOC,MAAM,CAACG,KAAK;;QAEvD;QACA;QACA,OAAOJ,KAAK,CAACK,KAAK,CAACD,KAAK,CAACE,IAAI,CAACC,IAAI,IAAIP,KAAK,CAACQ,QAAQ,CAACJ,KAAK,CAACK,QAAQ,CAACF,IAAI,CAACG,EAAE,CAAC,CAAC,EAAEN,KAAK;MACtF,CAAC;MACDO,GAAGA,CAAEC,GAAG,EAAE;QACRX,MAAM,CAACG,KAAK,GAAGQ,GAAG;MACpB;IACF,CAAC,CAAC;IAEFrB,SAAS,CAAC,MAAM;MACd,MAAMsB,WAAW,GAAG7B,OAAO,CAAC8B,WAAW,CAACnB,KAAK,CAAC;MAE9C,OAAAoB,YAAA,CAAA/B,OAAA,EAAAgC,WAAA;QAAA;MAAA,GAGSH,WAAW;QAAA,cACNX,KAAK,CAACE,KAAK;QAAA,uBAAAa,MAAA,IAAXf,KAAK,CAACE,KAAK,GAAAa,MAAA;QAAA,SACd,CACL,kBAAkB,EAClBtB,KAAK,CAACuB,KAAK,CACZ;QAAA,SACOvB,KAAK,CAACwB,KAAK;QAAA,aACP,KAAK;QAAA,SACT;MAAK,IACHpB,KAAK;IAGrB,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC","ignoreList":[]}
|
||||
+200
@@ -0,0 +1,200 @@
|
||||
export declare const makeVStepperWindowItemProps: <Defaults extends {
|
||||
class?: unknown;
|
||||
style?: unknown;
|
||||
value?: unknown;
|
||||
disabled?: unknown;
|
||||
selectedClass?: unknown;
|
||||
eager?: unknown;
|
||||
reverseTransition?: unknown;
|
||||
transition?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
class: unknown extends Defaults["class"] ? import("vue").PropType<any> : {
|
||||
type: import("vue").PropType<unknown extends Defaults["class"] ? any : any>;
|
||||
default: unknown extends Defaults["class"] ? any : any;
|
||||
};
|
||||
style: unknown extends Defaults["style"] ? {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | import("vue").StyleValue>;
|
||||
default: unknown extends Defaults["style"] ? import("vue").StyleValue : Defaults["style"] | NonNullable<import("vue").StyleValue>;
|
||||
};
|
||||
value: unknown extends Defaults["value"] ? null : {
|
||||
type: import("vue").PropType<unknown extends Defaults["value"] ? any : any>;
|
||||
default: unknown extends Defaults["value"] ? any : any;
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"]>;
|
||||
default: unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"];
|
||||
};
|
||||
selectedClass: unknown extends Defaults["selectedClass"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"]>;
|
||||
default: unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"];
|
||||
};
|
||||
eager: unknown extends Defaults["eager"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["eager"] ? boolean : boolean | Defaults["eager"]>;
|
||||
default: unknown extends Defaults["eager"] ? boolean : boolean | Defaults["eager"];
|
||||
};
|
||||
reverseTransition: unknown extends Defaults["reverseTransition"] ? {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["reverseTransition"] ? string | boolean : string | boolean | Defaults["reverseTransition"]>;
|
||||
default: unknown extends Defaults["reverseTransition"] ? string | boolean : Defaults["reverseTransition"] | NonNullable<string | boolean>;
|
||||
};
|
||||
transition: unknown extends Defaults["transition"] ? {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["transition"] ? string | boolean : string | boolean | Defaults["transition"]>;
|
||||
default: unknown extends Defaults["transition"] ? string | boolean : Defaults["transition"] | NonNullable<string | boolean>;
|
||||
};
|
||||
};
|
||||
export declare const VStepperWindowItem: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
style: import("vue").StyleValue;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
reverseTransition: string | boolean;
|
||||
transition: string | boolean;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, {}, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
reverseTransition: string | boolean;
|
||||
transition: string | boolean;
|
||||
}>;
|
||||
__isFragment?: never;
|
||||
__isTeleport?: never;
|
||||
__isSuspense?: never;
|
||||
} & import("vue").ComponentOptionsBase<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
value?: any;
|
||||
selectedClass?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
|
||||
style: import("vue").StyleValue;
|
||||
disabled: boolean;
|
||||
eager: boolean;
|
||||
reverseTransition: string | boolean;
|
||||
transition: string | boolean;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
default: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("../../util/index.js").FilterPropsOptions<{
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
eager: BooleanConstructor;
|
||||
reverseTransition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
transition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
class: import("vue").PropType<any>;
|
||||
style: {
|
||||
type: import("vue").PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
eager: BooleanConstructor;
|
||||
reverseTransition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
transition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
}>>;
|
||||
export type VStepperWindowItem = InstanceType<typeof VStepperWindowItem>;
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
|
||||
// Components
|
||||
import { makeVWindowItemProps, VWindowItem } from "../VWindow/VWindowItem.js"; // Utilities
|
||||
import { genericComponent, propsFactory, useRender } from "../../util/index.js";
|
||||
export const makeVStepperWindowItemProps = propsFactory({
|
||||
...makeVWindowItemProps()
|
||||
}, 'VStepperWindowItem');
|
||||
export const VStepperWindowItem = genericComponent()({
|
||||
name: 'VStepperWindowItem',
|
||||
props: makeVStepperWindowItemProps(),
|
||||
setup(props, {
|
||||
slots
|
||||
}) {
|
||||
useRender(() => {
|
||||
const windowItemProps = VWindowItem.filterProps(props);
|
||||
return _createVNode(VWindowItem, _mergeProps({
|
||||
"_as": "VStepperWindowItem"
|
||||
}, windowItemProps, {
|
||||
"class": ['v-stepper-window-item', props.class],
|
||||
"style": props.style
|
||||
}), slots);
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VStepperWindowItem.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"VStepperWindowItem.js","names":["makeVWindowItemProps","VWindowItem","genericComponent","propsFactory","useRender","makeVStepperWindowItemProps","VStepperWindowItem","name","props","setup","slots","windowItemProps","filterProps","_createVNode","_mergeProps","class","style"],"sources":["../../../src/components/VStepper/VStepperWindowItem.tsx"],"sourcesContent":["// Components\nimport { makeVWindowItemProps, VWindowItem } from '@/components/VWindow/VWindowItem'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVStepperWindowItemProps = propsFactory({\n ...makeVWindowItemProps(),\n}, 'VStepperWindowItem')\n\nexport const VStepperWindowItem = genericComponent()({\n name: 'VStepperWindowItem',\n\n props: makeVStepperWindowItemProps(),\n\n setup (props, { slots }) {\n useRender(() => {\n const windowItemProps = VWindowItem.filterProps(props)\n\n return (\n <VWindowItem\n _as=\"VStepperWindowItem\"\n { ...windowItemProps }\n class={[\n 'v-stepper-window-item',\n props.class,\n ]}\n style={ props.style }\n v-slots={ slots }\n />\n )\n })\n\n return {}\n },\n})\n\nexport type VStepperWindowItem = InstanceType<typeof VStepperWindowItem>\n"],"mappings":";AAAA;AAAA,SACSA,oBAAoB,EAAEC,WAAW,qCAE1C;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,2BAA2B,GAAGF,YAAY,CAAC;EACtD,GAAGH,oBAAoB,CAAC;AAC1B,CAAC,EAAE,oBAAoB,CAAC;AAExB,OAAO,MAAMM,kBAAkB,GAAGJ,gBAAgB,CAAC,CAAC,CAAC;EACnDK,IAAI,EAAE,oBAAoB;EAE1BC,KAAK,EAAEH,2BAA2B,CAAC,CAAC;EAEpCI,KAAKA,CAAED,KAAK,EAAE;IAAEE;EAAM,CAAC,EAAE;IACvBN,SAAS,CAAC,MAAM;MACd,MAAMO,eAAe,GAAGV,WAAW,CAACW,WAAW,CAACJ,KAAK,CAAC;MAEtD,OAAAK,YAAA,CAAAZ,WAAA,EAAAa,WAAA;QAAA;MAAA,GAGSH,eAAe;QAAA,SACb,CACL,uBAAuB,EACvBH,KAAK,CAACO,KAAK,CACZ;QAAA,SACOP,KAAK,CAACQ;MAAK,IACTN,KAAK;IAGrB,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC","ignoreList":[]}
|
||||
+28
@@ -0,0 +1,28 @@
|
||||
@use '../../styles/settings';
|
||||
@use '../../styles/tools';
|
||||
|
||||
$stepper-actions-padding: 1rem !default;
|
||||
$stepper-actions-stepper-padding: 0 1.5rem 1rem !default;
|
||||
$stepper-actions-stepper-window-item-padding: 1.5rem 0 0 !default;
|
||||
$stepper-alt-labels-flex-basis : 175px !default;
|
||||
$stepper-alt-labels-header-divider: 35px -67px 0 !default;
|
||||
$stepper-border-radius: 4px !default;
|
||||
$stepper-elevation: 1 !default;
|
||||
$stepper-item-opacity: var(--v-medium-emphasis-opacity) !default;
|
||||
$stepper-item-padding: 1.5rem !default;
|
||||
$stepper-item-transition-duration: .2s !default;
|
||||
$stepper-item-transition-property: opacity !default;
|
||||
$stepper-item-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;
|
||||
$stepper-header-divider-margin: 0 -16px !default;
|
||||
$stepper-header-elevation: 1 !default;
|
||||
$stepper-window-margin: 1.5rem !default;
|
||||
$stepper-item-avatar-background: tools.theme-color('surface-variant', var(--v-medium-emphasis-opacity)) !default;
|
||||
$stepper-item-avatar-color: rgb(var(--v-theme-on-surface-variant)) !default;
|
||||
$stepper-item-avatar-font-size: .75rem !default;
|
||||
$stepper-item-avatar-margin-inline-end: 8px !default;
|
||||
$stepper-item-avatar-icon-font-size: .875rem !default;
|
||||
$stepper-item-alt-labels-margin-bottom: 16px !default;
|
||||
$stepper-item-title-line-height: 1 !default;
|
||||
$stepper-item-subtitle-font-size: .75rem !default;
|
||||
$stepper-item-subtitle-line-height: 1 !default;
|
||||
$stepper-item-subtitle-opacity: var(--v-medium-emphasis-opacity) !default;
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
export { VStepper } from './VStepper.js';
|
||||
export { VStepperActions } from './VStepperActions.js';
|
||||
export { VStepperHeader } from './VStepperHeader.js';
|
||||
export { VStepperItem } from './VStepperItem.js';
|
||||
export { VStepperWindow } from './VStepperWindow.js';
|
||||
export { VStepperWindowItem } from './VStepperWindowItem.js';
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
export { VStepper } from "./VStepper.js";
|
||||
export { VStepperActions } from "./VStepperActions.js";
|
||||
export { VStepperHeader } from "./VStepperHeader.js";
|
||||
export { VStepperItem } from "./VStepperItem.js";
|
||||
export { VStepperWindow } from "./VStepperWindow.js";
|
||||
export { VStepperWindowItem } from "./VStepperWindowItem.js";
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","names":["VStepper","VStepperActions","VStepperHeader","VStepperItem","VStepperWindow","VStepperWindowItem"],"sources":["../../../src/components/VStepper/index.ts"],"sourcesContent":["export { VStepper } from './VStepper'\nexport { VStepperActions } from './VStepperActions'\nexport { VStepperHeader } from './VStepperHeader'\nexport { VStepperItem } from './VStepperItem'\nexport { VStepperWindow } from './VStepperWindow'\nexport { VStepperWindowItem } from './VStepperWindowItem'\n"],"mappings":"SAASA,QAAQ;AAAA,SACRC,eAAe;AAAA,SACfC,cAAc;AAAA,SACdC,YAAY;AAAA,SACZC,cAAc;AAAA,SACdC,kBAAkB","ignoreList":[]}
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import type { InjectionKey } from 'vue';
|
||||
import type { GroupProvide } from '../../composables/group.js';
|
||||
export declare const VStepperSymbol: InjectionKey<GroupProvide>;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
// Types
|
||||
|
||||
export const VStepperSymbol = Symbol.for('vuetify:v-stepper');
|
||||
//# sourceMappingURL=shared.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"shared.js","names":["VStepperSymbol","Symbol","for"],"sources":["../../../src/components/VStepper/shared.ts"],"sourcesContent":["// Types\nimport type { InjectionKey } from 'vue'\nimport type { GroupProvide } from '@/composables/group'\n\nexport const VStepperSymbol: InjectionKey<GroupProvide> = Symbol.for('vuetify:v-stepper')\n"],"mappings":"AAAA;;AAIA,OAAO,MAAMA,cAA0C,GAAGC,MAAM,CAACC,GAAG,CAAC,mBAAmB,CAAC","ignoreList":[]}
|
||||
Reference in New Issue
Block a user