routie dev init since i didn't adhere to any proper guidance up until now
This commit is contained in:
+63
@@ -0,0 +1,63 @@
|
||||
@layer vuetify-components {
|
||||
.v-carousel {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
.v-carousel__controls {
|
||||
align-items: center;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
height: 50px;
|
||||
justify-content: center;
|
||||
list-style-type: none;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.v-carousel__controls {
|
||||
background: color-mix(in srgb, rgb(var(--v-theme-surface-variant)) 30%, transparent);
|
||||
color: rgb(var(--v-theme-on-surface-variant));
|
||||
}
|
||||
.v-carousel__controls > .v-item-group {
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
.v-carousel__controls__item {
|
||||
margin: 0 8px;
|
||||
}
|
||||
.v-carousel__controls__item .v-icon {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.v-carousel__controls__item--active .v-icon {
|
||||
opacity: 1;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.v-carousel__controls__item:hover {
|
||||
background: none;
|
||||
}
|
||||
.v-carousel__controls__item:hover .v-icon {
|
||||
opacity: 0.8;
|
||||
}
|
||||
.v-carousel__progress {
|
||||
margin: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
.v-carousel-item {
|
||||
display: block;
|
||||
height: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.v-carousel-item > .v-img {
|
||||
height: inherit;
|
||||
}
|
||||
.v-carousel--hide-delimiter-background .v-carousel__controls {
|
||||
background: transparent;
|
||||
}
|
||||
.v-carousel--vertical-delimiters .v-carousel__controls {
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
+632
@@ -0,0 +1,632 @@
|
||||
|
||||
import { IconValue } from '../../composables/icons.js';
|
||||
import type { PropType } from 'vue';
|
||||
import type { VWindowSlots } from '../VWindow/VWindow.js';
|
||||
import type { GroupProvide } from '../../composables/group.js';
|
||||
import type { GenericProps } from '../../util/index.js';
|
||||
export declare const makeVCarouselProps: <Defaults extends {
|
||||
theme?: unknown;
|
||||
class?: unknown;
|
||||
style?: unknown;
|
||||
tag?: unknown;
|
||||
continuous?: unknown;
|
||||
nextIcon?: unknown;
|
||||
prevIcon?: unknown;
|
||||
reverse?: unknown;
|
||||
showArrows?: unknown;
|
||||
verticalArrows?: unknown;
|
||||
touch?: unknown;
|
||||
direction?: unknown;
|
||||
modelValue?: unknown;
|
||||
disabled?: unknown;
|
||||
selectedClass?: unknown;
|
||||
mandatory?: unknown;
|
||||
crossfade?: unknown;
|
||||
transitionDuration?: unknown;
|
||||
color?: unknown;
|
||||
cycle?: unknown;
|
||||
delimiterIcon?: unknown;
|
||||
height?: unknown;
|
||||
hideDelimiters?: unknown;
|
||||
hideDelimiterBackground?: unknown;
|
||||
interval?: unknown;
|
||||
progress?: unknown;
|
||||
verticalDelimiters?: 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>;
|
||||
};
|
||||
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>;
|
||||
};
|
||||
continuous: unknown extends Defaults["continuous"] ? {
|
||||
type: PropType<boolean>;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean>;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["continuous"] ? boolean : boolean | Defaults["continuous"]>;
|
||||
default: unknown extends Defaults["continuous"] ? boolean : boolean | Defaults["continuous"];
|
||||
};
|
||||
nextIcon: unknown extends Defaults["nextIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["nextIcon"] ? IconValue : Defaults["nextIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["nextIcon"] ? IconValue : Defaults["nextIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
prevIcon: unknown extends Defaults["prevIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["prevIcon"] ? IconValue : Defaults["prevIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["prevIcon"] ? IconValue : Defaults["prevIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
reverse: unknown extends Defaults["reverse"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"]>;
|
||||
default: unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"];
|
||||
};
|
||||
showArrows: unknown extends Defaults["showArrows"] ? Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | boolean>;
|
||||
default: NonNullable<string | boolean>;
|
||||
} : Omit<Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | boolean>;
|
||||
default: NonNullable<string | boolean>;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["showArrows"] ? string | boolean : string | boolean | Defaults["showArrows"]>;
|
||||
default: unknown extends Defaults["showArrows"] ? string | boolean : Defaults["showArrows"] | NonNullable<string | boolean>;
|
||||
};
|
||||
verticalArrows: unknown extends Defaults["verticalArrows"] ? PropType<"left" | "right" | boolean> : {
|
||||
type: 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>;
|
||||
};
|
||||
touch: unknown extends Defaults["touch"] ? {
|
||||
type: PropType<boolean | import("../../directives/touch/index.js").TouchHandlers>;
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | import("../../directives/touch/index.js").TouchHandlers>;
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["touch"] ? boolean | import("../../directives/touch/index.js").TouchHandlers : boolean | import("../../directives/touch/index.js").TouchHandlers | Defaults["touch"]>;
|
||||
default: unknown extends Defaults["touch"] ? boolean | import("../../directives/touch/index.js").TouchHandlers : Defaults["touch"] | NonNullable<boolean | import("../../directives/touch/index.js").TouchHandlers>;
|
||||
};
|
||||
direction: unknown extends Defaults["direction"] ? {
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: 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: PropType<unknown extends Defaults["modelValue"] ? any : any>;
|
||||
default: unknown extends Defaults["modelValue"] ? 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"] ? {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"]>;
|
||||
default: unknown extends Defaults["selectedClass"] ? string : string | Defaults["selectedClass"];
|
||||
};
|
||||
mandatory: unknown extends Defaults["mandatory"] ? Omit<{
|
||||
type: PropType<boolean | 'force'>;
|
||||
default: 'force';
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
} : Omit<Omit<{
|
||||
type: PropType<boolean | 'force'>;
|
||||
default: 'force';
|
||||
}, "default" | "type"> & {
|
||||
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>;
|
||||
};
|
||||
crossfade: unknown extends Defaults["crossfade"] ? BooleanConstructor : {
|
||||
type: 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: PropType<unknown extends Defaults["transitionDuration"] ? number : number | Defaults["transitionDuration"]>;
|
||||
default: unknown extends Defaults["transitionDuration"] ? number : number | Defaults["transitionDuration"];
|
||||
};
|
||||
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"];
|
||||
};
|
||||
cycle: unknown extends Defaults["cycle"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["cycle"] ? boolean : boolean | Defaults["cycle"]>;
|
||||
default: unknown extends Defaults["cycle"] ? boolean : boolean | Defaults["cycle"];
|
||||
};
|
||||
delimiterIcon: unknown extends Defaults["delimiterIcon"] ? {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["delimiterIcon"] ? IconValue : Defaults["delimiterIcon"] | IconValue>;
|
||||
default: unknown extends Defaults["delimiterIcon"] ? IconValue : Defaults["delimiterIcon"] | NonNullable<IconValue>;
|
||||
};
|
||||
height: unknown extends Defaults["height"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["height"] ? string | number : string | number | Defaults["height"]>;
|
||||
default: unknown extends Defaults["height"] ? string | number : Defaults["height"] | NonNullable<string | number>;
|
||||
};
|
||||
hideDelimiters: unknown extends Defaults["hideDelimiters"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["hideDelimiters"] ? boolean : boolean | Defaults["hideDelimiters"]>;
|
||||
default: unknown extends Defaults["hideDelimiters"] ? boolean : boolean | Defaults["hideDelimiters"];
|
||||
};
|
||||
hideDelimiterBackground: unknown extends Defaults["hideDelimiterBackground"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["hideDelimiterBackground"] ? boolean : boolean | Defaults["hideDelimiterBackground"]>;
|
||||
default: unknown extends Defaults["hideDelimiterBackground"] ? boolean : boolean | Defaults["hideDelimiterBackground"];
|
||||
};
|
||||
interval: unknown extends Defaults["interval"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
validator: (value: string | number) => boolean;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
validator: (value: string | number) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["interval"] ? string | number : string | number | Defaults["interval"]>;
|
||||
default: unknown extends Defaults["interval"] ? string | number : Defaults["interval"] | NonNullable<string | number>;
|
||||
};
|
||||
progress: unknown extends Defaults["progress"] ? (BooleanConstructor | StringConstructor)[] : {
|
||||
type: PropType<unknown extends Defaults["progress"] ? string | boolean : string | boolean | Defaults["progress"]>;
|
||||
default: unknown extends Defaults["progress"] ? string | boolean : Defaults["progress"] | NonNullable<string | boolean>;
|
||||
};
|
||||
verticalDelimiters: unknown extends Defaults["verticalDelimiters"] ? PropType<"left" | "right" | boolean> : {
|
||||
type: PropType<unknown extends Defaults["verticalDelimiters"] ? "left" | "right" | boolean : "left" | "right" | boolean | Defaults["verticalDelimiters"]>;
|
||||
default: unknown extends Defaults["verticalDelimiters"] ? "left" | "right" | boolean : Defaults["verticalDelimiters"] | NonNullable<"left" | "right" | boolean>;
|
||||
};
|
||||
};
|
||||
type VCarouselSlots = Omit<VWindowSlots, 'additional'> & {
|
||||
item: {
|
||||
props: Record<string, any>;
|
||||
item: {
|
||||
id: string;
|
||||
value: unknown;
|
||||
disabled: boolean | undefined;
|
||||
};
|
||||
};
|
||||
};
|
||||
export declare const VCarousel: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
touch?: boolean | import("../../directives/touch/index.js").TouchHandlers | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
color?: string | undefined;
|
||||
progress?: string | boolean | undefined;
|
||||
verticalDelimiters?: "left" | "right" | boolean | undefined;
|
||||
} & {}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (value: any) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:default" | "v-slot:item" | "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;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
touch: boolean | import("../../directives/touch/index.js").TouchHandlers;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
}, true, {}, import("vue").SlotsType<Partial<{
|
||||
default: (arg: {
|
||||
group: GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: (arg: {
|
||||
props: {
|
||||
icon: IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
icon: IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
item: (arg: {
|
||||
props: Record<string, any>;
|
||||
item: {
|
||||
id: string;
|
||||
value: unknown;
|
||||
disabled: boolean | undefined;
|
||||
};
|
||||
}) => 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;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
touch?: boolean | import("../../directives/touch/index.js").TouchHandlers | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
color?: string | undefined;
|
||||
progress?: string | boolean | undefined;
|
||||
verticalDelimiters?: "left" | "right" | boolean | undefined;
|
||||
} & {}, {}, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
touch: boolean | import("../../directives/touch/index.js").TouchHandlers;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
}>;
|
||||
__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;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
} & {
|
||||
theme?: string | undefined;
|
||||
class?: any;
|
||||
verticalArrows?: "left" | "right" | boolean | undefined;
|
||||
touch?: boolean | import("../../directives/touch/index.js").TouchHandlers | undefined;
|
||||
transitionDuration?: number | undefined;
|
||||
color?: string | undefined;
|
||||
progress?: string | boolean | undefined;
|
||||
verticalDelimiters?: "left" | "right" | boolean | undefined;
|
||||
} & {}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Omit<{
|
||||
'update:modelValue': (value: any) => true;
|
||||
}, "$children" | "modelValue" | "update:modelValue" | "v-slot:default" | "v-slot:item" | "v-slot:next" | "v-slot:prev" | "v-slots">, string, {
|
||||
style: import("vue").StyleValue;
|
||||
tag: string | import("../../util/index.js").JSXComponent;
|
||||
continuous: boolean;
|
||||
nextIcon: IconValue;
|
||||
prevIcon: IconValue;
|
||||
reverse: boolean;
|
||||
showArrows: string | boolean;
|
||||
touch: boolean | import("../../directives/touch/index.js").TouchHandlers;
|
||||
direction: "horizontal" | "vertical";
|
||||
disabled: boolean;
|
||||
selectedClass: string;
|
||||
mandatory: "force" | boolean;
|
||||
crossfade: boolean;
|
||||
cycle: boolean;
|
||||
delimiterIcon: IconValue;
|
||||
height: string | number;
|
||||
hideDelimiters: boolean;
|
||||
hideDelimiterBackground: boolean;
|
||||
interval: string | number;
|
||||
}, {}, string, import("vue").SlotsType<Partial<{
|
||||
default: (arg: {
|
||||
group: GroupProvide;
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
prev: (arg: {
|
||||
props: {
|
||||
icon: IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
next: (arg: {
|
||||
props: {
|
||||
icon: IconValue;
|
||||
class: string;
|
||||
onClick: () => void;
|
||||
'aria-label': string;
|
||||
};
|
||||
}) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
item: (arg: {
|
||||
props: Record<string, any>;
|
||||
item: {
|
||||
id: string;
|
||||
value: unknown;
|
||||
disabled: boolean | undefined;
|
||||
};
|
||||
}) => 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 <T>(props: {
|
||||
modelValue?: T;
|
||||
'onUpdate:modelValue'?: (value: T) => void;
|
||||
}, slots: VCarouselSlots) => 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;
|
||||
};
|
||||
tag: {
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
continuous: {
|
||||
type: PropType<boolean>;
|
||||
default: boolean;
|
||||
};
|
||||
nextIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
prevIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
reverse: BooleanConstructor;
|
||||
showArrows: Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | boolean>;
|
||||
default: NonNullable<string | boolean>;
|
||||
};
|
||||
verticalArrows: PropType<boolean | 'left' | 'right'>;
|
||||
touch: {
|
||||
type: PropType<boolean | import("../../directives/touch/index.js").TouchHandlers>;
|
||||
default: undefined;
|
||||
};
|
||||
direction: {
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
};
|
||||
modelValue: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
mandatory: Omit<{
|
||||
type: PropType<boolean | 'force'>;
|
||||
default: 'force';
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
};
|
||||
crossfade: BooleanConstructor;
|
||||
transitionDuration: NumberConstructor;
|
||||
color: StringConstructor;
|
||||
cycle: BooleanConstructor;
|
||||
delimiterIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
height: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
};
|
||||
hideDelimiters: BooleanConstructor;
|
||||
hideDelimiterBackground: BooleanConstructor;
|
||||
interval: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
validator: (value: string | number) => boolean;
|
||||
};
|
||||
progress: (BooleanConstructor | StringConstructor)[];
|
||||
verticalDelimiters: PropType<boolean | 'left' | 'right'>;
|
||||
}, import("vue").ExtractPropTypes<{
|
||||
theme: StringConstructor;
|
||||
class: PropType<import("../../composables/component.js").ClassValue>;
|
||||
style: {
|
||||
type: PropType<import("vue").StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
tag: {
|
||||
type: PropType<string | import("../../util/index.js").JSXComponent>;
|
||||
default: string;
|
||||
};
|
||||
continuous: {
|
||||
type: PropType<boolean>;
|
||||
default: boolean;
|
||||
};
|
||||
nextIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
prevIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
reverse: BooleanConstructor;
|
||||
showArrows: Omit<{
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | boolean>;
|
||||
default: NonNullable<string | boolean>;
|
||||
};
|
||||
verticalArrows: PropType<boolean | 'left' | 'right'>;
|
||||
touch: {
|
||||
type: PropType<boolean | import("../../directives/touch/index.js").TouchHandlers>;
|
||||
default: undefined;
|
||||
};
|
||||
direction: {
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
};
|
||||
modelValue: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: {
|
||||
type: StringConstructor;
|
||||
default: string;
|
||||
};
|
||||
mandatory: Omit<{
|
||||
type: PropType<boolean | 'force'>;
|
||||
default: 'force';
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<"force" | boolean>;
|
||||
default: NonNullable<"force" | boolean>;
|
||||
};
|
||||
crossfade: BooleanConstructor;
|
||||
transitionDuration: NumberConstructor;
|
||||
color: StringConstructor;
|
||||
cycle: BooleanConstructor;
|
||||
delimiterIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
height: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
};
|
||||
hideDelimiters: BooleanConstructor;
|
||||
hideDelimiterBackground: BooleanConstructor;
|
||||
interval: {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
validator: (value: string | number) => boolean;
|
||||
};
|
||||
progress: (BooleanConstructor | StringConstructor)[];
|
||||
verticalDelimiters: PropType<boolean | 'left' | 'right'>;
|
||||
}>>;
|
||||
export type VCarousel = InstanceType<typeof VCarousel>;
|
||||
|
||||
+143
@@ -0,0 +1,143 @@
|
||||
import { Fragment as _Fragment, mergeProps as _mergeProps, createVNode as _createVNode, createElementVNode as _createElementVNode } from "vue";
|
||||
// Styles
|
||||
import "./VCarousel.css";
|
||||
|
||||
// Components
|
||||
import { VBtn } from "../VBtn/index.js";
|
||||
import { VDefaultsProvider } from "../VDefaultsProvider/index.js";
|
||||
import { VProgressLinear } from "../VProgressLinear/index.js";
|
||||
import { makeVWindowProps, VWindow } from "../VWindow/VWindow.js"; // Composables
|
||||
import { IconValue } from "../../composables/icons.js";
|
||||
import { useLocale } from "../../composables/locale.js";
|
||||
import { useProxiedModel } from "../../composables/proxiedModel.js"; // Utilities
|
||||
import { nextTick, onMounted, ref, watch } from 'vue';
|
||||
import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeVCarouselProps = propsFactory({
|
||||
color: String,
|
||||
cycle: Boolean,
|
||||
delimiterIcon: {
|
||||
type: IconValue,
|
||||
default: '$delimiter'
|
||||
},
|
||||
height: {
|
||||
type: [Number, String],
|
||||
default: 500
|
||||
},
|
||||
hideDelimiters: Boolean,
|
||||
hideDelimiterBackground: Boolean,
|
||||
interval: {
|
||||
type: [Number, String],
|
||||
default: 6000,
|
||||
validator: value => Number(value) > 0
|
||||
},
|
||||
progress: [Boolean, String],
|
||||
verticalDelimiters: [Boolean, String],
|
||||
...makeVWindowProps({
|
||||
continuous: true,
|
||||
mandatory: 'force',
|
||||
showArrows: true
|
||||
})
|
||||
}, 'VCarousel');
|
||||
export const VCarousel = genericComponent()({
|
||||
name: 'VCarousel',
|
||||
props: makeVCarouselProps(),
|
||||
emits: {
|
||||
'update:modelValue': value => true
|
||||
},
|
||||
setup(props, {
|
||||
slots
|
||||
}) {
|
||||
const model = useProxiedModel(props, 'modelValue');
|
||||
const {
|
||||
t
|
||||
} = useLocale();
|
||||
const windowRef = ref();
|
||||
let slideTimeout = -1;
|
||||
watch(model, restartTimeout);
|
||||
watch(() => props.interval, restartTimeout);
|
||||
watch(() => props.cycle, val => {
|
||||
if (val) restartTimeout();else window.clearTimeout(slideTimeout);
|
||||
});
|
||||
onMounted(startTimeout);
|
||||
function startTimeout() {
|
||||
if (!props.cycle || !windowRef.value) return;
|
||||
slideTimeout = window.setTimeout(windowRef.value.group.next, Number(props.interval) > 0 ? Number(props.interval) : 6000);
|
||||
}
|
||||
function restartTimeout() {
|
||||
window.clearTimeout(slideTimeout);
|
||||
window.requestAnimationFrame(startTimeout);
|
||||
}
|
||||
function onDelimiterKeyDown(e, group) {
|
||||
if (props.direction === 'horizontal' && e.key === 'ArrowLeft' || props.direction === 'vertical' && e.key === 'ArrowUp') {
|
||||
e.preventDefault();
|
||||
group.prev();
|
||||
nextTick(() => windowRef.value?.$el.querySelector('.v-btn--active')?.focus());
|
||||
}
|
||||
if (props.direction === 'horizontal' && e.key === 'ArrowRight' || props.direction === 'vertical' && e.key === 'ArrowDown') {
|
||||
e.preventDefault();
|
||||
group.next();
|
||||
nextTick(() => windowRef.value?.$el.querySelector('.v-btn--active')?.focus());
|
||||
}
|
||||
}
|
||||
useRender(() => {
|
||||
const windowProps = VWindow.filterProps(props);
|
||||
return _createVNode(VWindow, _mergeProps({
|
||||
"ref": windowRef
|
||||
}, windowProps, {
|
||||
"modelValue": model.value,
|
||||
"onUpdate:modelValue": $event => model.value = $event,
|
||||
"class": ['v-carousel', {
|
||||
'v-carousel--hide-delimiter-background': props.hideDelimiterBackground,
|
||||
'v-carousel--vertical-delimiters': props.verticalDelimiters
|
||||
}, props.class],
|
||||
"style": [{
|
||||
height: convertToUnit(props.height)
|
||||
}, props.style]
|
||||
}), {
|
||||
default: slots.default,
|
||||
additional: ({
|
||||
group
|
||||
}) => _createElementVNode(_Fragment, null, [!props.hideDelimiters && _createElementVNode("div", {
|
||||
"class": "v-carousel__controls",
|
||||
"style": {
|
||||
left: props.verticalDelimiters === 'left' && props.verticalDelimiters ? 0 : 'auto',
|
||||
right: props.verticalDelimiters === 'right' ? 0 : 'auto'
|
||||
}
|
||||
}, [group.items.value.length > 0 && _createVNode(VDefaultsProvider, {
|
||||
"defaults": {
|
||||
VBtn: {
|
||||
color: props.color,
|
||||
icon: props.delimiterIcon,
|
||||
size: 'x-small',
|
||||
variant: 'text'
|
||||
}
|
||||
},
|
||||
"scoped": true
|
||||
}, {
|
||||
default: () => [group.items.value.map((item, index) => {
|
||||
const props = {
|
||||
id: `carousel-item-${item.id}`,
|
||||
'aria-label': t('$vuetify.carousel.ariaLabel.delimiter', index + 1, group.items.value.length),
|
||||
class: ['v-carousel__controls__item', group.isSelected(item.id) && 'v-btn--active'],
|
||||
onClick: () => group.select(item.id, true),
|
||||
onKeydown: e => onDelimiterKeyDown(e, group)
|
||||
};
|
||||
return slots.item ? slots.item({
|
||||
props,
|
||||
item
|
||||
}) : _createVNode(VBtn, _mergeProps(item, props), null);
|
||||
})]
|
||||
})]), props.progress && _createVNode(VProgressLinear, {
|
||||
"absolute": true,
|
||||
"class": "v-carousel__progress",
|
||||
"color": typeof props.progress === 'string' ? props.progress : undefined,
|
||||
"modelValue": (group.getItemIndex(model.value) + 1) / group.items.value.length * 100
|
||||
}, null)]),
|
||||
prev: slots.prev,
|
||||
next: slots.next
|
||||
});
|
||||
});
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VCarousel.js.map
|
||||
+1
File diff suppressed because one or more lines are too long
+67
@@ -0,0 +1,67 @@
|
||||
@use '../../styles/tools'
|
||||
@use './variables' as *
|
||||
|
||||
@include tools.layer('components')
|
||||
.v-carousel
|
||||
overflow: hidden
|
||||
position: relative
|
||||
width: 100%
|
||||
|
||||
&__controls
|
||||
align-items: center
|
||||
bottom: 0
|
||||
display: flex
|
||||
height: $carousel-controls-size
|
||||
justify-content: center
|
||||
list-style-type: none
|
||||
position: absolute
|
||||
width: 100%
|
||||
z-index: 1
|
||||
|
||||
@include tools.theme($carousel-controls-theme...)
|
||||
|
||||
> .v-item-group
|
||||
flex: 0 1 auto
|
||||
|
||||
&__item
|
||||
margin: $carousel-dot-margin
|
||||
|
||||
.v-icon
|
||||
opacity: $carousel-dot-inactive-opacity
|
||||
|
||||
&--active
|
||||
.v-icon
|
||||
opacity: $carousel-dot-active-opacity
|
||||
vertical-align: middle
|
||||
|
||||
&:hover
|
||||
background: none
|
||||
|
||||
.v-icon
|
||||
opacity: $carousel-dot-hover-opacity
|
||||
|
||||
// Element
|
||||
.v-carousel__progress
|
||||
margin: 0
|
||||
bottom: 0
|
||||
left: 0
|
||||
right: 0
|
||||
|
||||
.v-carousel-item
|
||||
display: block
|
||||
height: inherit
|
||||
text-decoration: none
|
||||
|
||||
& > .v-img
|
||||
height: inherit
|
||||
|
||||
// Modifier
|
||||
.v-carousel--hide-delimiter-background
|
||||
.v-carousel__controls
|
||||
background: transparent
|
||||
|
||||
.v-carousel--vertical-delimiters
|
||||
.v-carousel__controls
|
||||
flex-direction: column
|
||||
height: 100%
|
||||
width: $carousel-controls-size
|
||||
+593
@@ -0,0 +1,593 @@
|
||||
export declare const makeVCarouselItemProps: <Defaults extends {
|
||||
class?: unknown;
|
||||
style?: unknown;
|
||||
rounded?: unknown;
|
||||
tile?: unknown;
|
||||
value?: unknown;
|
||||
disabled?: unknown;
|
||||
selectedClass?: unknown;
|
||||
height?: unknown;
|
||||
maxHeight?: unknown;
|
||||
maxWidth?: unknown;
|
||||
minHeight?: unknown;
|
||||
minWidth?: unknown;
|
||||
width?: unknown;
|
||||
aspectRatio?: unknown;
|
||||
contentClass?: unknown;
|
||||
inline?: unknown;
|
||||
absolute?: unknown;
|
||||
alt?: unknown;
|
||||
cover?: unknown;
|
||||
color?: unknown;
|
||||
draggable?: unknown;
|
||||
gradient?: unknown;
|
||||
imageClass?: unknown;
|
||||
lazySrc?: unknown;
|
||||
options?: unknown;
|
||||
sizes?: unknown;
|
||||
src?: unknown;
|
||||
crossorigin?: unknown;
|
||||
referrerpolicy?: unknown;
|
||||
srcset?: unknown;
|
||||
position?: 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>;
|
||||
};
|
||||
rounded: unknown extends Defaults["rounded"] ? {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").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: import("vue").PropType<unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"]>;
|
||||
default: unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"];
|
||||
};
|
||||
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"];
|
||||
};
|
||||
height: unknown extends Defaults["height"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: import("vue").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: import("vue").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: import("vue").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: import("vue").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: import("vue").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: import("vue").PropType<unknown extends Defaults["width"] ? string | number : string | number | Defaults["width"]>;
|
||||
default: unknown extends Defaults["width"] ? string | number : Defaults["width"] | NonNullable<string | number>;
|
||||
};
|
||||
aspectRatio: unknown extends Defaults["aspectRatio"] ? (NumberConstructor | StringConstructor)[] : {
|
||||
type: import("vue").PropType<unknown extends Defaults["aspectRatio"] ? string | number : string | number | Defaults["aspectRatio"]>;
|
||||
default: unknown extends Defaults["aspectRatio"] ? string | number : Defaults["aspectRatio"] | NonNullable<string | number>;
|
||||
};
|
||||
contentClass: unknown extends Defaults["contentClass"] ? null : {
|
||||
type: import("vue").PropType<unknown extends Defaults["contentClass"] ? any : any>;
|
||||
default: unknown extends Defaults["contentClass"] ? any : any;
|
||||
};
|
||||
inline: unknown extends Defaults["inline"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["inline"] ? boolean : boolean | Defaults["inline"]>;
|
||||
default: unknown extends Defaults["inline"] ? boolean : boolean | Defaults["inline"];
|
||||
};
|
||||
absolute: unknown extends Defaults["absolute"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["absolute"] ? boolean : boolean | Defaults["absolute"]>;
|
||||
default: unknown extends Defaults["absolute"] ? boolean : boolean | Defaults["absolute"];
|
||||
};
|
||||
alt: unknown extends Defaults["alt"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["alt"] ? string : string | Defaults["alt"]>;
|
||||
default: unknown extends Defaults["alt"] ? string : string | Defaults["alt"];
|
||||
};
|
||||
cover: unknown extends Defaults["cover"] ? BooleanConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["cover"] ? boolean : boolean | Defaults["cover"]>;
|
||||
default: unknown extends Defaults["cover"] ? boolean : boolean | Defaults["cover"];
|
||||
};
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
draggable: unknown extends Defaults["draggable"] ? {
|
||||
type: import("vue").PropType<"false" | "true" | boolean>;
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<"false" | "true" | boolean>;
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["draggable"] ? "false" | "true" | boolean : "false" | "true" | boolean | Defaults["draggable"]>;
|
||||
default: unknown extends Defaults["draggable"] ? "false" | "true" | boolean : Defaults["draggable"] | NonNullable<"false" | "true" | boolean>;
|
||||
};
|
||||
gradient: unknown extends Defaults["gradient"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["gradient"] ? string : string | Defaults["gradient"]>;
|
||||
default: unknown extends Defaults["gradient"] ? string : string | Defaults["gradient"];
|
||||
};
|
||||
imageClass: unknown extends Defaults["imageClass"] ? null : {
|
||||
type: import("vue").PropType<unknown extends Defaults["imageClass"] ? any : any>;
|
||||
default: unknown extends Defaults["imageClass"] ? any : any;
|
||||
};
|
||||
lazySrc: unknown extends Defaults["lazySrc"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["lazySrc"] ? string : string | Defaults["lazySrc"]>;
|
||||
default: unknown extends Defaults["lazySrc"] ? string : string | Defaults["lazySrc"];
|
||||
};
|
||||
options: unknown extends Defaults["options"] ? {
|
||||
type: import("vue").PropType<IntersectionObserverInit>;
|
||||
default: () => {
|
||||
root: undefined;
|
||||
rootMargin: undefined;
|
||||
threshold: undefined;
|
||||
};
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<IntersectionObserverInit>;
|
||||
default: () => {
|
||||
root: undefined;
|
||||
rootMargin: undefined;
|
||||
threshold: undefined;
|
||||
};
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["options"] ? IntersectionObserverInit : IntersectionObserverInit | Defaults["options"]>;
|
||||
default: unknown extends Defaults["options"] ? IntersectionObserverInit : IntersectionObserverInit | Defaults["options"];
|
||||
};
|
||||
sizes: unknown extends Defaults["sizes"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["sizes"] ? string : string | Defaults["sizes"]>;
|
||||
default: unknown extends Defaults["sizes"] ? string : string | Defaults["sizes"];
|
||||
};
|
||||
src: unknown extends Defaults["src"] ? {
|
||||
type: import("vue").PropType<string | import("../VImg/VImg.js").srcObject>;
|
||||
default: string;
|
||||
} : Omit<{
|
||||
type: import("vue").PropType<string | import("../VImg/VImg.js").srcObject>;
|
||||
default: string;
|
||||
}, "default" | "type"> & {
|
||||
type: import("vue").PropType<unknown extends Defaults["src"] ? string | import("../VImg/VImg.js").srcObject : string | import("../VImg/VImg.js").srcObject | Defaults["src"]>;
|
||||
default: unknown extends Defaults["src"] ? string | import("../VImg/VImg.js").srcObject : Defaults["src"] | NonNullable<string | import("../VImg/VImg.js").srcObject>;
|
||||
};
|
||||
crossorigin: unknown extends Defaults["crossorigin"] ? import("vue").PropType<"" | "anonymous" | "use-credentials"> : {
|
||||
type: import("vue").PropType<unknown extends Defaults["crossorigin"] ? "" | "anonymous" | "use-credentials" : "" | "anonymous" | "use-credentials" | Defaults["crossorigin"]>;
|
||||
default: unknown extends Defaults["crossorigin"] ? "" | "anonymous" | "use-credentials" : Defaults["crossorigin"] | NonNullable<"" | "anonymous" | "use-credentials">;
|
||||
};
|
||||
referrerpolicy: unknown extends Defaults["referrerpolicy"] ? import("vue").PropType<"no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url"> : {
|
||||
type: import("vue").PropType<unknown extends Defaults["referrerpolicy"] ? "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" : "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | Defaults["referrerpolicy"]>;
|
||||
default: unknown extends Defaults["referrerpolicy"] ? "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" : Defaults["referrerpolicy"] | NonNullable<"no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url">;
|
||||
};
|
||||
srcset: unknown extends Defaults["srcset"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["srcset"] ? string : string | Defaults["srcset"]>;
|
||||
default: unknown extends Defaults["srcset"] ? string : string | Defaults["srcset"];
|
||||
};
|
||||
position: unknown extends Defaults["position"] ? StringConstructor : {
|
||||
type: import("vue").PropType<unknown extends Defaults["position"] ? string : string | Defaults["position"]>;
|
||||
default: unknown extends Defaults["position"] ? string : string | Defaults["position"];
|
||||
};
|
||||
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 VCarouselItem: {
|
||||
new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
|
||||
style: string | false | import("vue").StyleValue[] | import("vue").CSSProperties | null;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
value?: any;
|
||||
selectedClass?: string | 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;
|
||||
aspectRatio?: string | number | undefined;
|
||||
contentClass?: any;
|
||||
alt?: string | undefined;
|
||||
color?: string | undefined;
|
||||
draggable?: "false" | "true" | boolean | undefined;
|
||||
gradient?: string | undefined;
|
||||
imageClass?: any;
|
||||
lazySrc?: string | undefined;
|
||||
sizes?: string | undefined;
|
||||
crossorigin?: "" | "anonymous" | "use-credentials" | undefined;
|
||||
referrerpolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
|
||||
srcset?: string | undefined;
|
||||
position?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: (() => import("vue").VNodeChild) | undefined;
|
||||
error?: (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
error?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:error"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:placeholder"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:sources"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
||||
style: import("vue").StyleValue;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
draggable: "false" | "true" | boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
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;
|
||||
}>[];
|
||||
placeholder: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
error: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
sources: () => 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;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
value?: any;
|
||||
selectedClass?: string | 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;
|
||||
aspectRatio?: string | number | undefined;
|
||||
contentClass?: any;
|
||||
alt?: string | undefined;
|
||||
color?: string | undefined;
|
||||
draggable?: "false" | "true" | boolean | undefined;
|
||||
gradient?: string | undefined;
|
||||
imageClass?: any;
|
||||
lazySrc?: string | undefined;
|
||||
sizes?: string | undefined;
|
||||
crossorigin?: "" | "anonymous" | "use-credentials" | undefined;
|
||||
referrerpolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
|
||||
srcset?: string | undefined;
|
||||
position?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: (() => import("vue").VNodeChild) | undefined;
|
||||
error?: (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
error?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:error"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:placeholder"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:sources"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, {}, {}, {}, {}, {
|
||||
style: import("vue").StyleValue;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
draggable: "false" | "true" | boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
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;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
eager: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
value?: any;
|
||||
selectedClass?: string | 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;
|
||||
aspectRatio?: string | number | undefined;
|
||||
contentClass?: any;
|
||||
alt?: string | undefined;
|
||||
color?: string | undefined;
|
||||
draggable?: "false" | "true" | boolean | undefined;
|
||||
gradient?: string | undefined;
|
||||
imageClass?: any;
|
||||
lazySrc?: string | undefined;
|
||||
sizes?: string | undefined;
|
||||
crossorigin?: "" | "anonymous" | "use-credentials" | undefined;
|
||||
referrerpolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
|
||||
srcset?: string | undefined;
|
||||
position?: string | undefined;
|
||||
reverseTransition?: string | boolean | undefined;
|
||||
transition?: string | boolean | undefined;
|
||||
} & {
|
||||
$children?: {
|
||||
default?: (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: (() => import("vue").VNodeChild) | undefined;
|
||||
error?: (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: (() => import("vue").VNodeChild) | undefined;
|
||||
} | {
|
||||
$stable?: boolean;
|
||||
} | (() => import("vue").VNodeChild) | import("vue").VNodeChild;
|
||||
'v-slots'?: {
|
||||
default?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
placeholder?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
error?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
sources?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:error"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:placeholder"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
"v-slot:sources"?: false | (() => import("vue").VNodeChild) | undefined;
|
||||
}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
|
||||
style: import("vue").StyleValue;
|
||||
rounded: string | number | boolean;
|
||||
tile: boolean;
|
||||
disabled: boolean;
|
||||
inline: boolean;
|
||||
absolute: boolean;
|
||||
cover: boolean;
|
||||
draggable: "false" | "true" | boolean;
|
||||
options: IntersectionObserverInit;
|
||||
src: string | import("../VImg/VImg.js").srcObject;
|
||||
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;
|
||||
}>[];
|
||||
placeholder: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
error: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
sources: () => 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;
|
||||
};
|
||||
rounded: {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
tile: BooleanConstructor;
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
height: (NumberConstructor | StringConstructor)[];
|
||||
maxHeight: (NumberConstructor | StringConstructor)[];
|
||||
maxWidth: (NumberConstructor | StringConstructor)[];
|
||||
minHeight: (NumberConstructor | StringConstructor)[];
|
||||
minWidth: (NumberConstructor | StringConstructor)[];
|
||||
width: (NumberConstructor | StringConstructor)[];
|
||||
aspectRatio: (NumberConstructor | StringConstructor)[];
|
||||
contentClass: null;
|
||||
inline: BooleanConstructor;
|
||||
absolute: BooleanConstructor;
|
||||
alt: StringConstructor;
|
||||
cover: BooleanConstructor;
|
||||
color: StringConstructor;
|
||||
draggable: {
|
||||
type: import("vue").PropType<"false" | "true" | boolean>;
|
||||
default: undefined;
|
||||
};
|
||||
gradient: StringConstructor;
|
||||
imageClass: null;
|
||||
lazySrc: StringConstructor;
|
||||
options: {
|
||||
type: import("vue").PropType<IntersectionObserverInit>;
|
||||
default: () => {
|
||||
root: undefined;
|
||||
rootMargin: undefined;
|
||||
threshold: undefined;
|
||||
};
|
||||
};
|
||||
sizes: StringConstructor;
|
||||
src: {
|
||||
type: import("vue").PropType<string | import("../VImg/VImg.js").srcObject>;
|
||||
default: string;
|
||||
};
|
||||
crossorigin: import("vue").PropType<"" | "anonymous" | "use-credentials">;
|
||||
referrerpolicy: import("vue").PropType<"no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url">;
|
||||
srcset: StringConstructor;
|
||||
position: 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;
|
||||
};
|
||||
rounded: {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
tile: BooleanConstructor;
|
||||
value: null;
|
||||
disabled: BooleanConstructor;
|
||||
selectedClass: StringConstructor;
|
||||
height: (NumberConstructor | StringConstructor)[];
|
||||
maxHeight: (NumberConstructor | StringConstructor)[];
|
||||
maxWidth: (NumberConstructor | StringConstructor)[];
|
||||
minHeight: (NumberConstructor | StringConstructor)[];
|
||||
minWidth: (NumberConstructor | StringConstructor)[];
|
||||
width: (NumberConstructor | StringConstructor)[];
|
||||
aspectRatio: (NumberConstructor | StringConstructor)[];
|
||||
contentClass: null;
|
||||
inline: BooleanConstructor;
|
||||
absolute: BooleanConstructor;
|
||||
alt: StringConstructor;
|
||||
cover: BooleanConstructor;
|
||||
color: StringConstructor;
|
||||
draggable: {
|
||||
type: import("vue").PropType<"false" | "true" | boolean>;
|
||||
default: undefined;
|
||||
};
|
||||
gradient: StringConstructor;
|
||||
imageClass: null;
|
||||
lazySrc: StringConstructor;
|
||||
options: {
|
||||
type: import("vue").PropType<IntersectionObserverInit>;
|
||||
default: () => {
|
||||
root: undefined;
|
||||
rootMargin: undefined;
|
||||
threshold: undefined;
|
||||
};
|
||||
};
|
||||
sizes: StringConstructor;
|
||||
src: {
|
||||
type: import("vue").PropType<string | import("../VImg/VImg.js").srcObject>;
|
||||
default: string;
|
||||
};
|
||||
crossorigin: import("vue").PropType<"" | "anonymous" | "use-credentials">;
|
||||
referrerpolicy: import("vue").PropType<"no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url">;
|
||||
srcset: StringConstructor;
|
||||
position: StringConstructor;
|
||||
eager: BooleanConstructor;
|
||||
reverseTransition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
transition: {
|
||||
type: (BooleanConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
}>>;
|
||||
export type VCarouselItem = InstanceType<typeof VCarouselItem>;
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
|
||||
// Components
|
||||
import { makeVImgProps, VImg } from "../VImg/VImg.js";
|
||||
import { makeVWindowItemProps, VWindowItem } from "../VWindow/VWindowItem.js"; // Utilities
|
||||
import { genericComponent, propsFactory, useRender } from "../../util/index.js"; // Types
|
||||
export const makeVCarouselItemProps = propsFactory({
|
||||
...makeVImgProps(),
|
||||
...makeVWindowItemProps()
|
||||
}, 'VCarouselItem');
|
||||
export const VCarouselItem = genericComponent()({
|
||||
name: 'VCarouselItem',
|
||||
inheritAttrs: false,
|
||||
props: makeVCarouselItemProps(),
|
||||
setup(props, {
|
||||
slots,
|
||||
attrs
|
||||
}) {
|
||||
useRender(() => {
|
||||
const imgProps = VImg.filterProps(props);
|
||||
const windowItemProps = VWindowItem.filterProps(props);
|
||||
return _createVNode(VWindowItem, _mergeProps({
|
||||
"class": ['v-carousel-item', props.class]
|
||||
}, windowItemProps), {
|
||||
default: () => [_createVNode(VImg, _mergeProps(attrs, imgProps), slots)]
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VCarouselItem.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"VCarouselItem.js","names":["makeVImgProps","VImg","makeVWindowItemProps","VWindowItem","genericComponent","propsFactory","useRender","makeVCarouselItemProps","VCarouselItem","name","inheritAttrs","props","setup","slots","attrs","imgProps","filterProps","windowItemProps","_createVNode","_mergeProps","class","default"],"sources":["../../../src/components/VCarousel/VCarouselItem.tsx"],"sourcesContent":["// Components\nimport { makeVImgProps, VImg } from '@/components/VImg/VImg'\nimport { makeVWindowItemProps, VWindowItem } from '@/components/VWindow/VWindowItem'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { VImgSlots } from '@/components/VImg/VImg'\n\nexport const makeVCarouselItemProps = propsFactory({\n ...makeVImgProps(),\n ...makeVWindowItemProps(),\n}, 'VCarouselItem')\n\nexport const VCarouselItem = genericComponent<VImgSlots>()({\n name: 'VCarouselItem',\n\n inheritAttrs: false,\n\n props: makeVCarouselItemProps(),\n\n setup (props, { slots, attrs }) {\n useRender(() => {\n const imgProps = VImg.filterProps(props)\n const windowItemProps = VWindowItem.filterProps(props)\n\n return (\n <VWindowItem\n class={[\n 'v-carousel-item',\n props.class,\n ]}\n { ...windowItemProps }\n >\n <VImg\n { ...attrs }\n { ...imgProps }\n v-slots={ slots }\n />\n </VWindowItem>\n )\n })\n },\n})\n\nexport type VCarouselItem = InstanceType<typeof VCarouselItem>\n"],"mappings":";AAAA;AAAA,SACSA,aAAa,EAAEC,IAAI;AAAA,SACnBC,oBAAoB,EAAEC,WAAW,qCAE1C;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS,+BAElD;AAGA,OAAO,MAAMC,sBAAsB,GAAGF,YAAY,CAAC;EACjD,GAAGL,aAAa,CAAC,CAAC;EAClB,GAAGE,oBAAoB,CAAC;AAC1B,CAAC,EAAE,eAAe,CAAC;AAEnB,OAAO,MAAMM,aAAa,GAAGJ,gBAAgB,CAAY,CAAC,CAAC;EACzDK,IAAI,EAAE,eAAe;EAErBC,YAAY,EAAE,KAAK;EAEnBC,KAAK,EAAEJ,sBAAsB,CAAC,CAAC;EAE/BK,KAAKA,CAAED,KAAK,EAAE;IAAEE,KAAK;IAAEC;EAAM,CAAC,EAAE;IAC9BR,SAAS,CAAC,MAAM;MACd,MAAMS,QAAQ,GAAGd,IAAI,CAACe,WAAW,CAACL,KAAK,CAAC;MACxC,MAAMM,eAAe,GAAGd,WAAW,CAACa,WAAW,CAACL,KAAK,CAAC;MAEtD,OAAAO,YAAA,CAAAf,WAAA,EAAAgB,WAAA;QAAA,SAEW,CACL,iBAAiB,EACjBR,KAAK,CAACS,KAAK;MACZ,GACIH,eAAe;QAAAI,OAAA,EAAAA,CAAA,MAAAH,YAAA,CAAAjB,IAAA,EAAAkB,WAAA,CAGbL,KAAK,EACLC,QAAQ,GACHF,KAAK;MAAA;IAIvB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC","ignoreList":[]}
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
@use '../../styles/tools';
|
||||
|
||||
// VCarousel
|
||||
$carousel-controls-bg: tools.theme-color('surface-variant', .3) !default;
|
||||
$carousel-controls-color: rgb(var(--v-theme-on-surface-variant)) !default;
|
||||
$carousel-controls-size: 50px !default;
|
||||
$carousel-dot-margin: 0 8px !default;
|
||||
$carousel-dot-inactive-opacity: .5 !default;
|
||||
$carousel-dot-active-opacity: 1 !default;
|
||||
$carousel-dot-hover-opacity: .8 !default;
|
||||
|
||||
$carousel-controls-theme: (
|
||||
$carousel-controls-bg,
|
||||
$carousel-controls-color
|
||||
) !default;
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
export { VCarousel } from './VCarousel.js';
|
||||
export { VCarouselItem } from './VCarouselItem.js';
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
export { VCarousel } from "./VCarousel.js";
|
||||
export { VCarouselItem } from "./VCarouselItem.js";
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","names":["VCarousel","VCarouselItem"],"sources":["../../../src/components/VCarousel/index.ts"],"sourcesContent":["export { VCarousel } from './VCarousel'\nexport { VCarouselItem } from './VCarouselItem'\n"],"mappings":"SAASA,SAAS;AAAA,SACTC,aAAa","ignoreList":[]}
|
||||
Reference in New Issue
Block a user