@una-ui/nuxt-edge 0.63.1-29258224.a4c2a98 → 0.63.1-29258321.57251f3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/module.json +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/components/stepper/Stepper.vue +163 -0
- package/dist/runtime/components/stepper/Stepper.vue.d.ts +62 -0
- package/dist/runtime/components/stepper/StepperContainer.vue +21 -0
- package/dist/runtime/components/stepper/StepperContainer.vue.d.ts +15 -0
- package/dist/runtime/components/stepper/StepperDescription.vue +28 -0
- package/dist/runtime/components/stepper/StepperDescription.vue.d.ts +13 -0
- package/dist/runtime/components/stepper/StepperHeader.vue +21 -0
- package/dist/runtime/components/stepper/StepperHeader.vue.d.ts +15 -0
- package/dist/runtime/components/stepper/StepperIndicator.vue +34 -0
- package/dist/runtime/components/stepper/StepperIndicator.vue.d.ts +15 -0
- package/dist/runtime/components/stepper/StepperItem.vue +44 -0
- package/dist/runtime/components/stepper/StepperItem.vue.d.ts +15 -0
- package/dist/runtime/components/stepper/StepperSeparator.vue +29 -0
- package/dist/runtime/components/stepper/StepperSeparator.vue.d.ts +6 -0
- package/dist/runtime/components/stepper/StepperTitle.vue +27 -0
- package/dist/runtime/components/stepper/StepperTitle.vue.d.ts +13 -0
- package/dist/runtime/components/stepper/StepperTrigger.vue +29 -0
- package/dist/runtime/components/stepper/StepperTrigger.vue.d.ts +15 -0
- package/dist/runtime/components/stepper/StepperWrapper.vue +21 -0
- package/dist/runtime/components/stepper/StepperWrapper.vue.d.ts +15 -0
- package/dist/runtime/types/index.d.ts +1 -0
- package/dist/runtime/types/index.js +1 -0
- package/dist/runtime/types/stepper.d.ts +129 -0
- package/dist/runtime/types/stepper.js +0 -0
- package/package.json +3 -3
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -0,0 +1,163 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperRoot, useForwardPropsEmits } from "reka-ui";
|
|
4
|
+
import { computed, useTemplateRef } from "vue";
|
|
5
|
+
import { cn } from "../../utils";
|
|
6
|
+
import Icon from "../elements/Icon.vue";
|
|
7
|
+
import StepperContainer from "./StepperContainer.vue";
|
|
8
|
+
import StepperDescription from "./StepperDescription.vue";
|
|
9
|
+
import StepperHeader from "./StepperHeader.vue";
|
|
10
|
+
import StepperIndicator from "./StepperIndicator.vue";
|
|
11
|
+
import StepperItem from "./StepperItem.vue";
|
|
12
|
+
import StepperSeparator from "./StepperSeparator.vue";
|
|
13
|
+
import StepperTitle from "./StepperTitle.vue";
|
|
14
|
+
import StepperTrigger from "./StepperTrigger.vue";
|
|
15
|
+
import StepperWrapper from "./StepperWrapper.vue";
|
|
16
|
+
const props = defineProps({
|
|
17
|
+
items: { type: Array, required: false },
|
|
18
|
+
stepper: { type: String, required: false, default: "solid-primary" },
|
|
19
|
+
_stepperItem: { type: Object, required: false },
|
|
20
|
+
_stepperTrigger: { type: Object, required: false },
|
|
21
|
+
_stepperSeparator: { type: Object, required: false },
|
|
22
|
+
_stepperTitle: { type: Object, required: false },
|
|
23
|
+
_stepperDescription: { type: Object, required: false },
|
|
24
|
+
_stepperIndicator: { type: Object, required: false },
|
|
25
|
+
_stepperHeader: { type: Object, required: false },
|
|
26
|
+
_stepperWrapper: { type: Object, required: false },
|
|
27
|
+
_stepperContainer: { type: Object, required: false },
|
|
28
|
+
una: { type: Object, required: false },
|
|
29
|
+
defaultValue: { type: Number, required: false },
|
|
30
|
+
orientation: { type: String, required: false, default: "horizontal" },
|
|
31
|
+
dir: { type: String, required: false },
|
|
32
|
+
modelValue: { type: Number, required: false },
|
|
33
|
+
linear: { type: Boolean, required: false },
|
|
34
|
+
asChild: { type: Boolean, required: false },
|
|
35
|
+
as: { type: [String, Object, Function], required: false },
|
|
36
|
+
disabled: { type: Boolean, required: false },
|
|
37
|
+
class: { type: null, required: false },
|
|
38
|
+
size: { type: null, required: false }
|
|
39
|
+
});
|
|
40
|
+
const emits = defineEmits(["update:modelValue", "next", "prev"]);
|
|
41
|
+
const modelValue = defineModel({ type: [String, Number] });
|
|
42
|
+
const delegatedProps = reactiveOmit(props, [
|
|
43
|
+
"class",
|
|
44
|
+
"una"
|
|
45
|
+
]);
|
|
46
|
+
const forwarded = useForwardPropsEmits(delegatedProps, emits);
|
|
47
|
+
const stepper = useTemplateRef("stepper");
|
|
48
|
+
const currentStepIndex = computed({
|
|
49
|
+
get() {
|
|
50
|
+
const value = modelValue.value ?? props.defaultValue;
|
|
51
|
+
return (typeof value === "string" ? props.items?.findIndex((item) => item.value === value) : value) ?? 0;
|
|
52
|
+
},
|
|
53
|
+
set(value) {
|
|
54
|
+
modelValue.value = props.items?.[value]?.value ?? value;
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
const currentStep = computed(() => props.items?.[currentStepIndex.value]);
|
|
58
|
+
const isEveryItemHasStep = computed(() => props.items?.every((item) => item.step));
|
|
59
|
+
const hasNextStep = computed(() => currentStepIndex.value < props.items.length - 1);
|
|
60
|
+
const hasPrevStep = computed(() => currentStepIndex.value > 0);
|
|
61
|
+
defineExpose({
|
|
62
|
+
goToStep: (step) => {
|
|
63
|
+
currentStepIndex.value = step;
|
|
64
|
+
stepper.value?.goToStep(step);
|
|
65
|
+
},
|
|
66
|
+
nextStep: () => {
|
|
67
|
+
if (!hasNextStep.value)
|
|
68
|
+
return;
|
|
69
|
+
currentStepIndex.value += 1;
|
|
70
|
+
stepper.value?.nextStep();
|
|
71
|
+
emits("next", currentStep.value);
|
|
72
|
+
},
|
|
73
|
+
prevStep: () => {
|
|
74
|
+
if (!hasPrevStep.value)
|
|
75
|
+
return;
|
|
76
|
+
currentStepIndex.value -= 1;
|
|
77
|
+
stepper.value?.prevStep();
|
|
78
|
+
emits("prev", currentStep.value);
|
|
79
|
+
},
|
|
80
|
+
hasNext: () => stepper.value?.hasNext(),
|
|
81
|
+
hasPrev: () => stepper.value?.hasPrev()
|
|
82
|
+
});
|
|
83
|
+
</script>
|
|
84
|
+
|
|
85
|
+
<template>
|
|
86
|
+
<StepperRoot
|
|
87
|
+
ref="stepper"
|
|
88
|
+
v-slot="slotProps"
|
|
89
|
+
v-bind="forwarded"
|
|
90
|
+
v-model="currentStepIndex"
|
|
91
|
+
:class="cn(
|
|
92
|
+
'stepper',
|
|
93
|
+
orientation === 'horizontal' && 'stepper-horizontal',
|
|
94
|
+
props.class
|
|
95
|
+
)"
|
|
96
|
+
:una
|
|
97
|
+
>
|
|
98
|
+
<slot v-bind="slotProps">
|
|
99
|
+
<StepperWrapper :una v-bind="props._stepperWrapper" :orientation>
|
|
100
|
+
<slot name="wrapper" :items>
|
|
101
|
+
<StepperItem
|
|
102
|
+
v-for="(item, idx) in items"
|
|
103
|
+
:key="isEveryItemHasStep ? item.step : idx"
|
|
104
|
+
:step="isEveryItemHasStep ? item.step : idx"
|
|
105
|
+
:disabled="item.disabled ?? props.disabled"
|
|
106
|
+
:una
|
|
107
|
+
v-bind="props._stepperItem"
|
|
108
|
+
:orientation
|
|
109
|
+
>
|
|
110
|
+
<slot name="item" :item="item" :step="isEveryItemHasStep ? item.step : idx">
|
|
111
|
+
<StepperContainer :orientation :una v-bind="props._stepperContainer">
|
|
112
|
+
<StepperTrigger v-bind="props._stepperTrigger" :una :stepper="props.stepper" :size="size ?? item.size">
|
|
113
|
+
<slot name="trigger" :item="item">
|
|
114
|
+
<StepperIndicator
|
|
115
|
+
v-slot="{ step }"
|
|
116
|
+
v-bind="props._stepperIndicator"
|
|
117
|
+
:una
|
|
118
|
+
:size="size ?? item.size"
|
|
119
|
+
:stepper="props.stepper"
|
|
120
|
+
>
|
|
121
|
+
<slot name="indicator" :item :step>
|
|
122
|
+
<Icon v-if="item.icon" :name="item.icon" :size="size ?? item.size" />
|
|
123
|
+
<template v-else>
|
|
124
|
+
{{ idx + 1 }}
|
|
125
|
+
</template>
|
|
126
|
+
</slot>
|
|
127
|
+
</StepperIndicator>
|
|
128
|
+
</slot>
|
|
129
|
+
</StepperTrigger>
|
|
130
|
+
<StepperSeparator
|
|
131
|
+
v-if="items && idx < items.length - 1"
|
|
132
|
+
v-bind="props._stepperSeparator"
|
|
133
|
+
:una
|
|
134
|
+
:stepper="props.stepper"
|
|
135
|
+
:orientation
|
|
136
|
+
/>
|
|
137
|
+
</StepperContainer>
|
|
138
|
+
<StepperHeader :una v-bind="props._stepperHeader" :orientation>
|
|
139
|
+
<slot name="header" :item="item">
|
|
140
|
+
<StepperTitle v-if="item.title" :una v-bind="props._stepperTitle" :size="size ?? item.size">
|
|
141
|
+
<slot name="title" :item="item">
|
|
142
|
+
{{ item.title }}
|
|
143
|
+
</slot>
|
|
144
|
+
</StepperTitle>
|
|
145
|
+
<StepperDescription v-if="item.description" :una v-bind="props._stepperDescription" :size="size ?? item.size">
|
|
146
|
+
<slot name="description" :item="item">
|
|
147
|
+
{{ item.description }}
|
|
148
|
+
</slot>
|
|
149
|
+
</StepperDescription>
|
|
150
|
+
</slot>
|
|
151
|
+
</StepperHeader>
|
|
152
|
+
</slot>
|
|
153
|
+
</StepperItem>
|
|
154
|
+
</slot>
|
|
155
|
+
</StepperWrapper>
|
|
156
|
+
<slot
|
|
157
|
+
v-if="!!$slots.content || currentStep?.slot"
|
|
158
|
+
:name="currentStep?.slot ?? 'content'"
|
|
159
|
+
:item="currentStep"
|
|
160
|
+
/>
|
|
161
|
+
</slot>
|
|
162
|
+
</StepperRoot>
|
|
163
|
+
</template>
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import type { NStepperItemProps, NStepperProps } from '../../types/index.js';
|
|
2
|
+
declare const _default: <T extends Partial<NStepperItemProps>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
|
+
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
4
|
+
readonly "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
|
|
5
|
+
readonly onNext?: ((payload: T) => any) | undefined;
|
|
6
|
+
readonly onPrev?: ((payload: T) => any) | undefined;
|
|
7
|
+
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onNext" | "onPrev"> & (NStepperProps<T> & {
|
|
8
|
+
modelValue?: string | number;
|
|
9
|
+
}) & Partial<{}>> & import("vue").PublicProps;
|
|
10
|
+
expose(exposed: import("vue").ShallowUnwrapRef<{
|
|
11
|
+
goToStep: (step: number) => void;
|
|
12
|
+
nextStep: () => void;
|
|
13
|
+
prevStep: () => void;
|
|
14
|
+
hasNext: () => boolean | undefined;
|
|
15
|
+
hasPrev: () => boolean | undefined;
|
|
16
|
+
}>): void;
|
|
17
|
+
attrs: any;
|
|
18
|
+
slots: {
|
|
19
|
+
[x: string]: ((props: {
|
|
20
|
+
item: any;
|
|
21
|
+
}) => any) | undefined;
|
|
22
|
+
} & {
|
|
23
|
+
default?: (props: any) => any;
|
|
24
|
+
} & {
|
|
25
|
+
wrapper?: (props: {
|
|
26
|
+
items: any;
|
|
27
|
+
}) => any;
|
|
28
|
+
} & {
|
|
29
|
+
item?: (props: {
|
|
30
|
+
item: any;
|
|
31
|
+
step: any;
|
|
32
|
+
}) => any;
|
|
33
|
+
} & {
|
|
34
|
+
trigger?: (props: {
|
|
35
|
+
item: any;
|
|
36
|
+
}) => any;
|
|
37
|
+
} & {
|
|
38
|
+
indicator?: (props: {
|
|
39
|
+
item: any;
|
|
40
|
+
step: any;
|
|
41
|
+
}) => any;
|
|
42
|
+
} & {
|
|
43
|
+
header?: (props: {
|
|
44
|
+
item: any;
|
|
45
|
+
}) => any;
|
|
46
|
+
} & {
|
|
47
|
+
title?: (props: {
|
|
48
|
+
item: any;
|
|
49
|
+
}) => any;
|
|
50
|
+
} & {
|
|
51
|
+
description?: (props: {
|
|
52
|
+
item: any;
|
|
53
|
+
}) => any;
|
|
54
|
+
};
|
|
55
|
+
emit: (((evt: "update:modelValue", payload: number | undefined) => void) & ((evt: "next", payload: T) => void) & ((evt: "prev", payload: T) => void)) & ((evt: "update:modelValue", value: string | number | undefined) => void);
|
|
56
|
+
}>) => import("vue").VNode & {
|
|
57
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
58
|
+
};
|
|
59
|
+
export default _default;
|
|
60
|
+
type __VLS_PrettifyLocal<T> = {
|
|
61
|
+
[K in keyof T]: T[K];
|
|
62
|
+
} & {};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
una: { type: Object, required: false },
|
|
5
|
+
class: { type: null, required: false },
|
|
6
|
+
orientation: { type: String, required: false, default: "horizontal" }
|
|
7
|
+
});
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div
|
|
12
|
+
:class="cn(
|
|
13
|
+
'stepper-container',
|
|
14
|
+
orientation === 'horizontal' && 'stepper-container-horizontal',
|
|
15
|
+
props.class,
|
|
16
|
+
props.una?.stepperContainer
|
|
17
|
+
)"
|
|
18
|
+
>
|
|
19
|
+
<slot />
|
|
20
|
+
</div>
|
|
21
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperContainerProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperContainerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperContainerProps> & Readonly<{}>, {
|
|
7
|
+
orientation: "vertical" | "horizontal";
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperDescription, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
una: { type: Object, required: false },
|
|
7
|
+
asChild: { type: Boolean, required: false },
|
|
8
|
+
as: { type: [String, Object, Function], required: false },
|
|
9
|
+
class: { type: null, required: false },
|
|
10
|
+
size: { type: null, required: false }
|
|
11
|
+
});
|
|
12
|
+
const delegatedProps = reactiveOmit(props, "class", "una");
|
|
13
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
14
|
+
</script>
|
|
15
|
+
|
|
16
|
+
<template>
|
|
17
|
+
<StepperDescription
|
|
18
|
+
v-slot="slotProps"
|
|
19
|
+
v-bind="forwarded"
|
|
20
|
+
:class="cn(
|
|
21
|
+
'stepper-description',
|
|
22
|
+
props.class,
|
|
23
|
+
props.una?.stepperDescription
|
|
24
|
+
)"
|
|
25
|
+
>
|
|
26
|
+
<slot v-bind="slotProps" />
|
|
27
|
+
</StepperDescription>
|
|
28
|
+
</template>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { NStepperDescriptionProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_6: any;
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_6) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperDescriptionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperDescriptionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
8
|
+
export default _default;
|
|
9
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
10
|
+
new (): {
|
|
11
|
+
$slots: S;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
una: { type: Object, required: false },
|
|
5
|
+
class: { type: null, required: false },
|
|
6
|
+
orientation: { type: String, required: false, default: "horizontal" }
|
|
7
|
+
});
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div
|
|
12
|
+
:class="cn(
|
|
13
|
+
'stepper-header',
|
|
14
|
+
orientation === 'horizontal' && 'stepper-header-horizontal',
|
|
15
|
+
props.class,
|
|
16
|
+
props.una?.stepperHeader
|
|
17
|
+
)"
|
|
18
|
+
>
|
|
19
|
+
<slot />
|
|
20
|
+
</div>
|
|
21
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperHeaderProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperHeaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperHeaderProps> & Readonly<{}>, {
|
|
7
|
+
orientation: "vertical" | "horizontal";
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperIndicator, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
una: { type: Object, required: false },
|
|
7
|
+
asChild: { type: Boolean, required: false },
|
|
8
|
+
as: { type: [String, Object, Function], required: false },
|
|
9
|
+
stepper: { type: String, required: false, default: "solid-primary" },
|
|
10
|
+
class: { type: null, required: false },
|
|
11
|
+
size: { type: null, required: false }
|
|
12
|
+
});
|
|
13
|
+
const delegatedProps = reactiveOmit(props, [
|
|
14
|
+
"class",
|
|
15
|
+
"una",
|
|
16
|
+
"stepper"
|
|
17
|
+
]);
|
|
18
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<template>
|
|
22
|
+
<StepperIndicator
|
|
23
|
+
v-slot="slotProps"
|
|
24
|
+
v-bind="forwarded"
|
|
25
|
+
:class="cn(
|
|
26
|
+
'stepper-indicator',
|
|
27
|
+
props.class,
|
|
28
|
+
props.una?.stepperIndicator
|
|
29
|
+
)"
|
|
30
|
+
:stepper
|
|
31
|
+
>
|
|
32
|
+
<slot v-bind="slotProps" />
|
|
33
|
+
</StepperIndicator>
|
|
34
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperIndicatorProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_6: any;
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_6) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperIndicatorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperIndicatorProps> & Readonly<{}>, {
|
|
7
|
+
stepper: string;
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperItem, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
slot: { type: String, required: false },
|
|
7
|
+
title: { type: String, required: false },
|
|
8
|
+
description: { type: String, required: false },
|
|
9
|
+
value: { type: [String, Number], required: false },
|
|
10
|
+
icon: { type: String, required: false },
|
|
11
|
+
una: { type: Object, required: false },
|
|
12
|
+
step: { type: Number, required: true },
|
|
13
|
+
disabled: { type: Boolean, required: false },
|
|
14
|
+
completed: { type: Boolean, required: false },
|
|
15
|
+
asChild: { type: Boolean, required: false },
|
|
16
|
+
as: { type: [String, Object, Function], required: false },
|
|
17
|
+
orientation: { type: String, required: false, default: "horizontal" },
|
|
18
|
+
class: { type: null, required: false },
|
|
19
|
+
size: { type: null, required: false }
|
|
20
|
+
});
|
|
21
|
+
const delegatedProps = reactiveOmit(props, [
|
|
22
|
+
"class",
|
|
23
|
+
"una",
|
|
24
|
+
"title",
|
|
25
|
+
"description",
|
|
26
|
+
"slot"
|
|
27
|
+
]);
|
|
28
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
29
|
+
</script>
|
|
30
|
+
|
|
31
|
+
<template>
|
|
32
|
+
<StepperItem
|
|
33
|
+
v-slot="slotProps"
|
|
34
|
+
v-bind="forwarded"
|
|
35
|
+
:class="cn(
|
|
36
|
+
'group stepper-item',
|
|
37
|
+
orientation === 'vertical' && 'stepper-item-vertical',
|
|
38
|
+
props.class,
|
|
39
|
+
props.una?.stepperItem
|
|
40
|
+
)"
|
|
41
|
+
>
|
|
42
|
+
<slot v-bind="slotProps" />
|
|
43
|
+
</StepperItem>
|
|
44
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperItemProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_6: any;
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_6) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperItemProps> & Readonly<{}>, {
|
|
7
|
+
orientation: "vertical" | "horizontal";
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperSeparator, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
una: { type: Object, required: false },
|
|
7
|
+
orientation: { type: String, required: false, default: "horizontal" },
|
|
8
|
+
decorative: { type: Boolean, required: false },
|
|
9
|
+
asChild: { type: Boolean, required: false },
|
|
10
|
+
as: { type: [String, Object, Function], required: false },
|
|
11
|
+
stepper: { type: String, required: false, default: "solid-primary" },
|
|
12
|
+
class: { type: null, required: false }
|
|
13
|
+
});
|
|
14
|
+
const delegatedProps = reactiveOmit(props, "class", "una");
|
|
15
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
16
|
+
</script>
|
|
17
|
+
|
|
18
|
+
<template>
|
|
19
|
+
<StepperSeparator
|
|
20
|
+
v-bind="forwarded"
|
|
21
|
+
:class="cn(
|
|
22
|
+
'stepper-separator',
|
|
23
|
+
orientation === 'vertical' ? 'stepper-separator-vertical' : 'stepper-separator-horizontal',
|
|
24
|
+
props.class,
|
|
25
|
+
props.una?.stepperSeparator
|
|
26
|
+
)"
|
|
27
|
+
:stepper
|
|
28
|
+
/>
|
|
29
|
+
</template>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { NStepperSeparatorProps } from '../../types/index.js';
|
|
2
|
+
declare const _default: import("vue").DefineComponent<NStepperSeparatorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperSeparatorProps> & Readonly<{}>, {
|
|
3
|
+
orientation: "vertical" | "horizontal";
|
|
4
|
+
stepper: string;
|
|
5
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
|
+
export default _default;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperTitle, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
una: { type: Object, required: false },
|
|
7
|
+
asChild: { type: Boolean, required: false },
|
|
8
|
+
as: { type: [String, Object, Function], required: false },
|
|
9
|
+
class: { type: null, required: false },
|
|
10
|
+
size: { type: null, required: false }
|
|
11
|
+
});
|
|
12
|
+
const delegatedProps = reactiveOmit(props, "class", "una");
|
|
13
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
14
|
+
</script>
|
|
15
|
+
|
|
16
|
+
<template>
|
|
17
|
+
<StepperTitle
|
|
18
|
+
v-bind="forwarded"
|
|
19
|
+
:class="cn(
|
|
20
|
+
'stepper-title',
|
|
21
|
+
props.class,
|
|
22
|
+
props.una?.stepperTitle
|
|
23
|
+
)"
|
|
24
|
+
>
|
|
25
|
+
<slot />
|
|
26
|
+
</StepperTitle>
|
|
27
|
+
</template>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { NStepperTitleProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_6: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_6) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperTitleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperTitleProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
8
|
+
export default _default;
|
|
9
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
10
|
+
new (): {
|
|
11
|
+
$slots: S;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { reactiveOmit } from "@vueuse/core";
|
|
3
|
+
import { StepperTrigger, useForwardProps } from "reka-ui";
|
|
4
|
+
import { cn } from "../../utils";
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
una: { type: Object, required: false },
|
|
7
|
+
asChild: { type: Boolean, required: false },
|
|
8
|
+
as: { type: [String, Object, Function], required: false },
|
|
9
|
+
stepper: { type: String, required: false, default: "solid-primary" },
|
|
10
|
+
class: { type: null, required: false },
|
|
11
|
+
size: { type: null, required: false }
|
|
12
|
+
});
|
|
13
|
+
const delegatedProps = reactiveOmit(props, "class", "una");
|
|
14
|
+
const forwarded = useForwardProps(delegatedProps);
|
|
15
|
+
</script>
|
|
16
|
+
|
|
17
|
+
<template>
|
|
18
|
+
<StepperTrigger
|
|
19
|
+
v-bind="forwarded"
|
|
20
|
+
:class="cn(
|
|
21
|
+
'stepper-trigger',
|
|
22
|
+
props.class,
|
|
23
|
+
props.una?.stepperTrigger
|
|
24
|
+
)"
|
|
25
|
+
:stepper
|
|
26
|
+
>
|
|
27
|
+
<slot />
|
|
28
|
+
</StepperTrigger>
|
|
29
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperTriggerProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_6: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_6) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperTriggerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperTriggerProps> & Readonly<{}>, {
|
|
7
|
+
stepper: string;
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { cn } from "../../utils";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
una: { type: Object, required: false },
|
|
5
|
+
class: { type: null, required: false },
|
|
6
|
+
orientation: { type: String, required: false, default: "horizontal" }
|
|
7
|
+
});
|
|
8
|
+
</script>
|
|
9
|
+
|
|
10
|
+
<template>
|
|
11
|
+
<div
|
|
12
|
+
:class="cn(
|
|
13
|
+
'stepper-wrapper',
|
|
14
|
+
orientation === 'vertical' && 'stepper-wrapper-vertical',
|
|
15
|
+
props.class,
|
|
16
|
+
props.una?.stepperWrapper
|
|
17
|
+
)"
|
|
18
|
+
>
|
|
19
|
+
<slot />
|
|
20
|
+
</div>
|
|
21
|
+
</template>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { NStepperWrapperProps } from '../../types/index.js';
|
|
2
|
+
declare var __VLS_1: {};
|
|
3
|
+
type __VLS_Slots = {} & {
|
|
4
|
+
default?: (props: typeof __VLS_1) => any;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_component: import("vue").DefineComponent<NStepperWrapperProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NStepperWrapperProps> & Readonly<{}>, {
|
|
7
|
+
orientation: "vertical" | "horizontal";
|
|
8
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
9
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
10
|
+
export default _default;
|
|
11
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
12
|
+
new (): {
|
|
13
|
+
$slots: S;
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import type { StepperDescriptionProps, StepperIndicatorProps, StepperItemProps, StepperRootEmits, StepperRootProps, StepperSeparatorProps, StepperTitleProps, StepperTriggerProps } from 'reka-ui';
|
|
2
|
+
import type { HTMLAttributes } from 'vue';
|
|
3
|
+
interface BaseExtensions {
|
|
4
|
+
/** CSS class for the component */
|
|
5
|
+
class?: HTMLAttributes['class'];
|
|
6
|
+
/** Size of the component */
|
|
7
|
+
size?: HTMLAttributes['class'];
|
|
8
|
+
}
|
|
9
|
+
export interface NStepperProps<T> extends StepperRootProps, Pick<StepperItemProps, 'disabled'>, BaseExtensions {
|
|
10
|
+
/**
|
|
11
|
+
* The array of steps that is passed to the stepper.
|
|
12
|
+
*
|
|
13
|
+
* @default []
|
|
14
|
+
*/
|
|
15
|
+
items?: T[];
|
|
16
|
+
/**
|
|
17
|
+
* Allows you to add `UnaUI` stepper preset properties,
|
|
18
|
+
* Think of it as a shortcut for adding options or variants to the preset if available.
|
|
19
|
+
*
|
|
20
|
+
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/stepper.ts
|
|
21
|
+
* @example
|
|
22
|
+
* stepper="solid-yellow"
|
|
23
|
+
*/
|
|
24
|
+
stepper?: string;
|
|
25
|
+
/** Props for the stepper item */
|
|
26
|
+
_stepperItem?: Partial<NStepperItemProps>;
|
|
27
|
+
/** Props for the stepper trigger */
|
|
28
|
+
_stepperTrigger?: Partial<NStepperTriggerProps>;
|
|
29
|
+
/** Props for the stepper separator */
|
|
30
|
+
_stepperSeparator?: Partial<NStepperSeparatorProps>;
|
|
31
|
+
/** Props for the stepper title */
|
|
32
|
+
_stepperTitle?: Partial<NStepperTitleProps>;
|
|
33
|
+
/** Props for the stepper description */
|
|
34
|
+
_stepperDescription?: Partial<NStepperDescriptionProps>;
|
|
35
|
+
/** Props for the stepper indicator */
|
|
36
|
+
_stepperIndicator?: Partial<NStepperIndicatorProps>;
|
|
37
|
+
/** Props for the stepper header */
|
|
38
|
+
_stepperHeader?: Partial<NStepperHeaderProps>;
|
|
39
|
+
/** Props for the stepper wrapper */
|
|
40
|
+
_stepperWrapper?: Partial<NStepperWrapperProps>;
|
|
41
|
+
/** Props for the stepper container */
|
|
42
|
+
_stepperContainer?: Partial<NStepperContainerProps>;
|
|
43
|
+
/**
|
|
44
|
+
* `UnaUI` preset configuration
|
|
45
|
+
*
|
|
46
|
+
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/stepper.ts
|
|
47
|
+
*/
|
|
48
|
+
una?: NStepperUnaProps;
|
|
49
|
+
}
|
|
50
|
+
export type NStepperEmits<T> = StepperRootEmits & {
|
|
51
|
+
next: [payload: T];
|
|
52
|
+
prev: [payload: T];
|
|
53
|
+
};
|
|
54
|
+
export interface NStepperItemProps extends StepperItemProps, Pick<NStepperProps<NStepperItemProps>, 'orientation'>, BaseExtensions {
|
|
55
|
+
/** Slot of the stepper item */
|
|
56
|
+
slot?: string;
|
|
57
|
+
/** Title of the stepper item. */
|
|
58
|
+
title?: string;
|
|
59
|
+
/** Description of the stepper item. */
|
|
60
|
+
description?: string;
|
|
61
|
+
value?: string | number;
|
|
62
|
+
/**
|
|
63
|
+
* Icon name
|
|
64
|
+
* @see @IconifyIcon
|
|
65
|
+
*
|
|
66
|
+
* @example
|
|
67
|
+
* 'i-heroicons-book-open-20-solid'
|
|
68
|
+
*/
|
|
69
|
+
icon?: string;
|
|
70
|
+
/** Additional properties for the una component */
|
|
71
|
+
una?: Pick<NStepperUnaProps, 'stepperItem'>;
|
|
72
|
+
}
|
|
73
|
+
export interface NStepperTriggerProps extends StepperTriggerProps, Pick<NStepperProps<StepperItemProps>, 'stepper'>, BaseExtensions {
|
|
74
|
+
/** Additional properties for the una component */
|
|
75
|
+
una?: Pick<NStepperUnaProps, 'stepperTrigger' | 'stepperMenuDefaultVariant'>;
|
|
76
|
+
}
|
|
77
|
+
export interface NStepperSeparatorProps extends StepperSeparatorProps, Pick<NStepperProps<StepperItemProps>, 'stepper'>, Pick<BaseExtensions, 'class'> {
|
|
78
|
+
/** Additional properties for the una component */
|
|
79
|
+
una?: Pick<NStepperUnaProps, 'stepperSeparator'>;
|
|
80
|
+
}
|
|
81
|
+
export interface NStepperIndicatorProps extends StepperIndicatorProps, Pick<NStepperProps<StepperItemProps>, 'stepper'>, BaseExtensions {
|
|
82
|
+
/** Additional properties for the una component */
|
|
83
|
+
una?: Pick<NStepperUnaProps, 'stepperIndicator'>;
|
|
84
|
+
}
|
|
85
|
+
export interface NStepperHeaderProps extends Pick<BaseExtensions, 'class'>, Pick<NStepperProps<StepperItemProps>, 'orientation'> {
|
|
86
|
+
/** Additional properties for the una component */
|
|
87
|
+
una?: Pick<NStepperUnaProps, 'stepperHeader'>;
|
|
88
|
+
}
|
|
89
|
+
export interface NStepperTitleProps extends StepperTitleProps, BaseExtensions {
|
|
90
|
+
/** Additional properties for the una component */
|
|
91
|
+
una?: Pick<NStepperUnaProps, 'stepperTitle'>;
|
|
92
|
+
}
|
|
93
|
+
export interface NStepperDescriptionProps extends StepperDescriptionProps, BaseExtensions {
|
|
94
|
+
/** Additional properties for the una component */
|
|
95
|
+
una?: Pick<NStepperUnaProps, 'stepperDescription'>;
|
|
96
|
+
}
|
|
97
|
+
export interface NStepperContainerProps extends Pick<BaseExtensions, 'class'>, Pick<NStepperProps<StepperItemProps>, 'orientation'> {
|
|
98
|
+
/** Additional properties for the una component */
|
|
99
|
+
una?: Pick<NStepperUnaProps, 'stepperContainer'>;
|
|
100
|
+
}
|
|
101
|
+
export interface NStepperWrapperProps extends Pick<BaseExtensions, 'class'>, Pick<NStepperProps<StepperItemProps>, 'orientation'> {
|
|
102
|
+
/** Additional properties for the una component */
|
|
103
|
+
una?: Pick<NStepperUnaProps, 'stepperWrapper'>;
|
|
104
|
+
}
|
|
105
|
+
interface NStepperUnaProps {
|
|
106
|
+
/** CSS class for the stepper */
|
|
107
|
+
stepper?: HTMLAttributes['class'];
|
|
108
|
+
/** CSS class for the stepper trigger */
|
|
109
|
+
stepperTrigger?: HTMLAttributes['class'];
|
|
110
|
+
/** CSS class for the stepper trigger default variant */
|
|
111
|
+
stepperMenuDefaultVariant?: HTMLAttributes['class'];
|
|
112
|
+
/** CSS class for the stepper item */
|
|
113
|
+
stepperItem?: HTMLAttributes['class'];
|
|
114
|
+
/** CSS class for the stepper title */
|
|
115
|
+
stepperTitle?: HTMLAttributes['class'];
|
|
116
|
+
/** CSS class for the stepper description */
|
|
117
|
+
stepperDescription?: HTMLAttributes['class'];
|
|
118
|
+
/** CSS class for the stepper indicator */
|
|
119
|
+
stepperIndicator?: HTMLAttributes['class'];
|
|
120
|
+
/** CSS class for the stepper separator */
|
|
121
|
+
stepperSeparator?: HTMLAttributes['class'];
|
|
122
|
+
/** CSS class for the stepper header */
|
|
123
|
+
stepperHeader?: HTMLAttributes['class'];
|
|
124
|
+
/** CSS class for the stepper container */
|
|
125
|
+
stepperContainer?: HTMLAttributes['class'];
|
|
126
|
+
/** CSS class for the stepper wrapper */
|
|
127
|
+
stepperWrapper?: HTMLAttributes['class'];
|
|
128
|
+
}
|
|
129
|
+
export {};
|
|
File without changes
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@una-ui/nuxt-edge",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.63.1-
|
|
4
|
+
"version": "0.63.1-29258321.57251f3",
|
|
5
5
|
"description": "Nuxt module for @una-ui",
|
|
6
6
|
"author": "Phojie Rengel <phojrengel@gmail.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -41,8 +41,8 @@
|
|
|
41
41
|
"@nuxt/kit": "^3.18.1",
|
|
42
42
|
"@nuxtjs/color-mode": "^3.5.2",
|
|
43
43
|
"@tanstack/vue-table": "^8.21.3",
|
|
44
|
-
"@una-ui/extractor-vue-script": "npm:@una-ui/extractor-vue-script-edge@0.63.1-
|
|
45
|
-
"@una-ui/preset": "npm:@una-ui/preset-edge@0.63.1-
|
|
44
|
+
"@una-ui/extractor-vue-script": "npm:@una-ui/extractor-vue-script-edge@0.63.1-29258321.57251f3",
|
|
45
|
+
"@una-ui/preset": "npm:@una-ui/preset-edge@0.63.1-29258321.57251f3",
|
|
46
46
|
"@unocss/core": "^66.4.2",
|
|
47
47
|
"@unocss/nuxt": "^66.4.2",
|
|
48
48
|
"@unocss/preset-attributify": "^66.4.2",
|