@nuxt/ui 2.16.0 → 2.17.0
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.d.mts +3 -0
- package/dist/module.d.ts +3 -0
- package/dist/module.json +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/components/elements/Alert.vue +11 -7
- package/dist/runtime/components/forms/Form.vue +8 -11
- package/dist/runtime/components/forms/Form.vue.d.ts +5 -10
- package/dist/runtime/components/forms/Input.vue +1 -1
- package/dist/runtime/components/forms/Select.vue +2 -2
- package/dist/runtime/components/forms/SelectMenu.vue +1 -1
- package/dist/runtime/components/navigation/Breadcrumb.vue +1 -1
- package/dist/runtime/components/navigation/CommandPalette.vue +5 -1
- package/dist/runtime/components/navigation/Tabs.vue +5 -1
- package/dist/runtime/components/navigation/Tabs.vue.d.ts +9 -0
- package/dist/runtime/components/overlays/Notification.vue +4 -3
- package/dist/runtime/components/overlays/Slideover.vue +43 -6
- package/dist/runtime/components/overlays/Slideover.vue.d.ts +4 -3
- package/dist/runtime/composables/useCarouselScroll.mjs +2 -0
- package/dist/runtime/types/link.d.ts +1 -1
- package/dist/runtime/ui.config/overlays/slideover.d.ts +3 -0
- package/dist/runtime/ui.config/overlays/slideover.mjs +4 -1
- package/package.json +19 -16
package/dist/module.d.mts
CHANGED
|
@@ -1790,10 +1790,13 @@ declare const _default$6: {
|
|
|
1790
1790
|
padding: string;
|
|
1791
1791
|
shadow: string;
|
|
1792
1792
|
width: string;
|
|
1793
|
+
height: string;
|
|
1793
1794
|
translate: {
|
|
1794
1795
|
base: string;
|
|
1795
1796
|
left: string;
|
|
1796
1797
|
right: string;
|
|
1798
|
+
top: string;
|
|
1799
|
+
bottom: string;
|
|
1797
1800
|
};
|
|
1798
1801
|
transition: {
|
|
1799
1802
|
enter: string;
|
package/dist/module.d.ts
CHANGED
|
@@ -1790,10 +1790,13 @@ declare const _default$6: {
|
|
|
1790
1790
|
padding: string;
|
|
1791
1791
|
shadow: string;
|
|
1792
1792
|
width: string;
|
|
1793
|
+
height: string;
|
|
1793
1794
|
translate: {
|
|
1794
1795
|
base: string;
|
|
1795
1796
|
left: string;
|
|
1796
1797
|
right: string;
|
|
1798
|
+
top: string;
|
|
1799
|
+
bottom: string;
|
|
1797
1800
|
};
|
|
1798
1801
|
transition: {
|
|
1799
1802
|
enter: string;
|
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -15,7 +15,7 @@ const __filename = __cjs_url__.fileURLToPath(import.meta.url);
|
|
|
15
15
|
const __dirname = __cjs_path__.dirname(__filename);
|
|
16
16
|
const require = __cjs_mod__.createRequire(import.meta.url);
|
|
17
17
|
const name = "@nuxt/ui";
|
|
18
|
-
const version = "2.
|
|
18
|
+
const version = "2.17.0";
|
|
19
19
|
|
|
20
20
|
function createTemplates(nuxt = useNuxt()) {
|
|
21
21
|
const template = addTemplate({
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<div :class="alertClass" v-bind="attrs">
|
|
3
3
|
<div class="flex" :class="[ui.gap, { 'items-start': (description || $slots.description), 'items-center': !description && !$slots.description }]">
|
|
4
4
|
<slot name="icon" :icon="icon">
|
|
5
|
-
<UIcon v-if="icon" :name="icon" :
|
|
5
|
+
<UIcon v-if="icon" :name="icon" :class="ui.icon.base" />
|
|
6
6
|
</slot>
|
|
7
7
|
<slot name="avatar" :avatar="avatar">
|
|
8
8
|
<UAvatar v-if="avatar" v-bind="{ size: ui.avatar.size, ...avatar }" :class="ui.avatar.base" />
|
|
@@ -14,19 +14,23 @@
|
|
|
14
14
|
{{ title }}
|
|
15
15
|
</slot>
|
|
16
16
|
</p>
|
|
17
|
-
<
|
|
17
|
+
<div v-if="description || $slots.description" :class="twMerge(ui.description, !(title && $slots.title) && 'mt-0 leading-5')">
|
|
18
18
|
<slot name="description" :description="description">
|
|
19
19
|
{{ description }}
|
|
20
20
|
</slot>
|
|
21
|
-
</
|
|
21
|
+
</div>
|
|
22
22
|
|
|
23
|
-
<div v-if="(description || $slots.description) && actions.length" :class="ui.actions">
|
|
24
|
-
<
|
|
23
|
+
<div v-if="(description || $slots.description) && (actions.length || $slots.actions)" :class="ui.actions">
|
|
24
|
+
<slot name="actions">
|
|
25
|
+
<UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...(ui.default.actionButton || {}), ...action }" @click.stop="onAction(action)" />
|
|
26
|
+
</slot>
|
|
25
27
|
</div>
|
|
26
28
|
</div>
|
|
27
29
|
<div v-if="closeButton || (!description && !$slots.description && actions.length)" :class="twMerge(ui.actions, 'mt-0')">
|
|
28
|
-
<template v-if="!description && !$slots.description && actions.length">
|
|
29
|
-
<
|
|
30
|
+
<template v-if="!description && !$slots.description && (actions.length || $slots.actions)">
|
|
31
|
+
<slot name="actions">
|
|
32
|
+
<UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...(ui.default.actionButton || {}), ...action }" @click.stop="onAction(action)" />
|
|
33
|
+
</slot>
|
|
30
34
|
</template>
|
|
31
35
|
|
|
32
36
|
<UButton v-if="closeButton" aria-label="Close" v-bind="{ ...(ui.default.closeButton || {}), ...closeButton }" @click.stop="$emit('close')" />
|
|
@@ -18,7 +18,7 @@ class FormException extends Error {
|
|
|
18
18
|
export default defineComponent({
|
|
19
19
|
props: {
|
|
20
20
|
schema: {
|
|
21
|
-
type: Object,
|
|
21
|
+
type: [Object, Function],
|
|
22
22
|
default: void 0
|
|
23
23
|
},
|
|
24
24
|
state: {
|
|
@@ -124,7 +124,6 @@ export default defineComponent({
|
|
|
124
124
|
validate,
|
|
125
125
|
errors,
|
|
126
126
|
setErrors(errs, path) {
|
|
127
|
-
errors.value = errs;
|
|
128
127
|
if (path) {
|
|
129
128
|
errors.value = errors.value.filter(
|
|
130
129
|
(error) => error.path !== path
|
|
@@ -211,16 +210,14 @@ async function getJoiErrors(state, schema) {
|
|
|
211
210
|
}
|
|
212
211
|
}
|
|
213
212
|
function isValibotSchema(schema) {
|
|
214
|
-
return
|
|
213
|
+
return "_parse" in schema || "_run" in schema || typeof schema === "function" && "schema" in schema;
|
|
215
214
|
}
|
|
216
215
|
async function getValibotError(state, schema) {
|
|
217
|
-
const result = await schema._parse(state);
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
}
|
|
224
|
-
return [];
|
|
216
|
+
const result = await ("_parse" in schema ? schema._parse(state) : "_run" in schema ? schema._run({ typed: false, value: state }, {}) : schema(state));
|
|
217
|
+
return result.issues?.map((issue) => ({
|
|
218
|
+
// We know that the key for a form schema is always a string or a number
|
|
219
|
+
path: issue.path?.map((item) => item.key).join(".") || "",
|
|
220
|
+
message: issue.message
|
|
221
|
+
})) || [];
|
|
225
222
|
}
|
|
226
223
|
</script>
|
|
@@ -2,13 +2,12 @@ import { type PropType } from 'vue';
|
|
|
2
2
|
import type { ZodSchema } from 'zod';
|
|
3
3
|
import type { Schema as JoiSchema } from 'joi';
|
|
4
4
|
import type { ObjectSchema as YupObjectSchema } from 'yup';
|
|
5
|
-
import type {
|
|
5
|
+
import type { BaseSchema as ValibotSchema30, BaseSchemaAsync as ValibotSchemaAsync30 } from 'valibot30';
|
|
6
|
+
import type { GenericSchema as ValibotSchema, GenericSchemaAsync as ValibotSchemaAsync, SafeParser as ValibotSafeParser, SafeParserAsync as ValibotSafeParserAsync } from 'valibot';
|
|
6
7
|
import type { FormError, FormEventType } from '../../types/form';
|
|
7
8
|
declare const _default: import("vue").DefineComponent<{
|
|
8
9
|
schema: {
|
|
9
|
-
type: PropType<ZodSchema<any, import("zod").ZodTypeDef, any>> | PropType<YupObjectSchema<any, import("yup").AnyObject, any, "">> | PropType<JoiSchema> | PropType<
|
|
10
|
-
[x: string]: any;
|
|
11
|
-
}>>;
|
|
10
|
+
type: PropType<ZodSchema<any, import("zod").ZodTypeDef, any>> | PropType<YupObjectSchema<any, import("yup").AnyObject, any, "">> | PropType<JoiSchema> | PropType<ValibotSchema30<any, any> | ValibotSchemaAsync30<any, any>> | PropType<ValibotSchema<unknown, unknown, import("valibot").BaseIssue<unknown>> | ValibotSchemaAsync<unknown, unknown, import("valibot").BaseIssue<unknown>>> | PropType<ValibotSafeParser<any, any> | ValibotSafeParserAsync<any, any>>;
|
|
12
11
|
default: undefined;
|
|
13
12
|
};
|
|
14
13
|
state: {
|
|
@@ -27,9 +26,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
27
26
|
onSubmit: (payload: Event) => Promise<void>;
|
|
28
27
|
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("submit" | "error")[], "submit" | "error", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
29
28
|
schema: {
|
|
30
|
-
type: PropType<ZodSchema<any, import("zod").ZodTypeDef, any>> | PropType<YupObjectSchema<any, import("yup").AnyObject, any, "">> | PropType<JoiSchema> | PropType<
|
|
31
|
-
[x: string]: any;
|
|
32
|
-
}>>;
|
|
29
|
+
type: PropType<ZodSchema<any, import("zod").ZodTypeDef, any>> | PropType<YupObjectSchema<any, import("yup").AnyObject, any, "">> | PropType<JoiSchema> | PropType<ValibotSchema30<any, any> | ValibotSchemaAsync30<any, any>> | PropType<ValibotSchema<unknown, unknown, import("valibot").BaseIssue<unknown>> | ValibotSchemaAsync<unknown, unknown, import("valibot").BaseIssue<unknown>>> | PropType<ValibotSafeParser<any, any> | ValibotSafeParserAsync<any, any>>;
|
|
33
30
|
default: undefined;
|
|
34
31
|
};
|
|
35
32
|
state: {
|
|
@@ -48,9 +45,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
48
45
|
onSubmit?: ((...args: any[]) => any) | undefined;
|
|
49
46
|
onError?: ((...args: any[]) => any) | undefined;
|
|
50
47
|
}, {
|
|
51
|
-
schema: ZodSchema<any, import("zod").ZodTypeDef, any> | YupObjectSchema<any, import("yup").AnyObject, any, ""> | import("joi").AnySchema<any> |
|
|
52
|
-
[x: string]: any;
|
|
53
|
-
}>;
|
|
48
|
+
schema: ZodSchema<any, import("zod").ZodTypeDef, any> | YupObjectSchema<any, import("yup").AnyObject, any, ""> | import("joi").AnySchema<any> | ValibotSchema30<any, any> | ValibotSchemaAsync30<any, any> | ValibotSchema<unknown, unknown, import("valibot").BaseIssue<unknown>> | ValibotSchemaAsync<unknown, unknown, import("valibot").BaseIssue<unknown>> | ValibotSafeParser<any, any> | ValibotSafeParserAsync<any, any>;
|
|
54
49
|
validate: ((state: any) => Promise<FormError[]>) | ((state: any) => FormError[]);
|
|
55
50
|
validateOn: FormEventType[];
|
|
56
51
|
}, {}>;
|
|
@@ -188,10 +188,10 @@ export default defineComponent({
|
|
|
188
188
|
emitFormChange();
|
|
189
189
|
};
|
|
190
190
|
const guessOptionValue = (option) => {
|
|
191
|
-
return get(option, props.valueAttribute,
|
|
191
|
+
return get(option, props.valueAttribute, "");
|
|
192
192
|
};
|
|
193
193
|
const guessOptionText = (option) => {
|
|
194
|
-
return get(option, props.optionAttribute,
|
|
194
|
+
return get(option, props.optionAttribute, "");
|
|
195
195
|
};
|
|
196
196
|
const normalizeOption = (option) => {
|
|
197
197
|
if (["string", "number", "boolean"].includes(typeof option)) {
|
|
@@ -376,7 +376,7 @@ export default defineComponent({
|
|
|
376
376
|
variant?.replaceAll("{color}", color.value),
|
|
377
377
|
(isLeading.value || slots.leading) && ui.value.leading.padding[size.value],
|
|
378
378
|
(isTrailing.value || slots.trailing) && ui.value.trailing.padding[size.value]
|
|
379
|
-
), props.placeholder &&
|
|
379
|
+
), props.placeholder && !props.modelValue && ui.value.placeholder, props.selectClass);
|
|
380
380
|
});
|
|
381
381
|
const isLeading = computed(() => {
|
|
382
382
|
return props.icon && props.leading || props.icon && !props.trailing || props.loading && !props.trailing || props.leadingIcon;
|
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
<ULink
|
|
6
6
|
as="span"
|
|
7
7
|
:class="[ui.base, index === links.length - 1 ? ui.active : !!link.to ? ui.inactive : '']"
|
|
8
|
-
v-bind="getULinkProps(link)"
|
|
9
8
|
:aria-current="index === links.length - 1 ? 'page' : undefined"
|
|
9
|
+
v-bind="getULinkProps(link)"
|
|
10
10
|
@click="link.click"
|
|
11
11
|
>
|
|
12
12
|
<slot name="icon" :link="link" :index="index" :is-active="index === links.length - 1">
|
|
@@ -283,7 +283,11 @@ export default defineComponent({
|
|
|
283
283
|
(props.loading || isLoading.value) && props.loadingIcon && ui.value.input.icon.loading
|
|
284
284
|
);
|
|
285
285
|
});
|
|
286
|
-
const emptyState = computed(() =>
|
|
286
|
+
const emptyState = computed(() => {
|
|
287
|
+
if (props.emptyState === null)
|
|
288
|
+
return null;
|
|
289
|
+
return { ...ui.value.default.emptyState, ...props.emptyState };
|
|
290
|
+
});
|
|
287
291
|
function activateFirstOption() {
|
|
288
292
|
setTimeout(() => {
|
|
289
293
|
comboboxInput.value?.$el.dispatchEvent(new KeyboardEvent("keydown", { key: "PageUp" }));
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
</HTab>
|
|
33
33
|
</HTabList>
|
|
34
34
|
|
|
35
|
-
<HTabPanels :class="ui.container">
|
|
35
|
+
<HTabPanels v-if="content" :class="ui.container">
|
|
36
36
|
<HTabPanel v-for="(item, index) of items" :key="index" v-slot="{ selected }" :class="ui.base" :unmount="unmount">
|
|
37
37
|
<slot :name="item.slot || 'item'" :item="item" :index="index" :selected="selected">
|
|
38
38
|
{{ item.content }}
|
|
@@ -83,6 +83,10 @@ export default defineComponent({
|
|
|
83
83
|
type: Boolean,
|
|
84
84
|
default: false
|
|
85
85
|
},
|
|
86
|
+
content: {
|
|
87
|
+
type: Boolean,
|
|
88
|
+
default: true
|
|
89
|
+
},
|
|
86
90
|
class: {
|
|
87
91
|
type: [String, Object, Array],
|
|
88
92
|
default: () => ""
|
|
@@ -22,6 +22,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
22
22
|
type: BooleanConstructor;
|
|
23
23
|
default: boolean;
|
|
24
24
|
};
|
|
25
|
+
content: {
|
|
26
|
+
type: BooleanConstructor;
|
|
27
|
+
default: boolean;
|
|
28
|
+
};
|
|
25
29
|
class: {
|
|
26
30
|
type: PropType<any>;
|
|
27
31
|
default: () => string;
|
|
@@ -62,6 +66,10 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
62
66
|
type: BooleanConstructor;
|
|
63
67
|
default: boolean;
|
|
64
68
|
};
|
|
69
|
+
content: {
|
|
70
|
+
type: BooleanConstructor;
|
|
71
|
+
default: boolean;
|
|
72
|
+
};
|
|
65
73
|
class: {
|
|
66
74
|
type: PropType<any>;
|
|
67
75
|
default: () => string;
|
|
@@ -75,6 +83,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
75
83
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
76
84
|
}, {
|
|
77
85
|
class: any;
|
|
86
|
+
content: boolean;
|
|
78
87
|
orientation: "horizontal" | "vertical";
|
|
79
88
|
ui: any;
|
|
80
89
|
modelValue: number;
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
{{ title }}
|
|
19
19
|
</slot>
|
|
20
20
|
</p>
|
|
21
|
-
<
|
|
21
|
+
<div v-if="(description || $slots.description)" :class="twMerge(ui.description, !(title && $slots.title) && 'mt-0 leading-5')">
|
|
22
22
|
<slot name="description" :description="description">
|
|
23
23
|
{{ description }}
|
|
24
24
|
</slot>
|
|
25
|
-
</
|
|
25
|
+
</div>
|
|
26
26
|
|
|
27
27
|
<div v-if="(description || $slots.description) && actions.length" :class="ui.actions">
|
|
28
28
|
<UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...(ui.default.actionButton || {}), ...action }" @click.stop="onAction(action)" />
|
|
@@ -124,7 +124,8 @@ export default defineComponent({
|
|
|
124
124
|
ui.value.wrapper,
|
|
125
125
|
ui.value.background?.replaceAll("{color}", props.color),
|
|
126
126
|
ui.value.rounded,
|
|
127
|
-
ui.value.shadow
|
|
127
|
+
ui.value.shadow,
|
|
128
|
+
ui.value.ring?.replaceAll("{color}", props.color)
|
|
128
129
|
), props.class);
|
|
129
130
|
});
|
|
130
131
|
const progressClass = computed(() => {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<TransitionRoot as="template" :appear="appear" :show="isOpen" @after-leave="onAfterLeave">
|
|
3
|
-
<HDialog :class="[ui.wrapper, { 'justify-end': side === 'right' }]" v-bind="attrs" @close="close">
|
|
3
|
+
<HDialog :class="[ui.wrapper, { 'justify-end': side === 'right' }, { 'items-end': side === 'bottom' }]" v-bind="attrs" @close="close">
|
|
4
4
|
<TransitionChild v-if="overlay" as="template" :appear="appear" v-bind="ui.overlay.transition">
|
|
5
5
|
<div :class="[ui.overlay.base, ui.overlay.background]" />
|
|
6
6
|
</TransitionChild>
|
|
7
7
|
|
|
8
8
|
<TransitionChild as="template" :appear="appear" v-bind="transitionClass">
|
|
9
|
-
<HDialogPanel :class="[ui.base, ui.width, ui.background, ui.ring, ui.padding]">
|
|
9
|
+
<HDialogPanel :class="[ui.base, sideType === 'horizontal' ? [ui.width, 'h-full'] : [ui.height, 'w-full'], ui.background, ui.ring, ui.padding]">
|
|
10
10
|
<slot />
|
|
11
11
|
</HDialogPanel>
|
|
12
12
|
</TransitionChild>
|
|
@@ -43,7 +43,7 @@ export default defineComponent({
|
|
|
43
43
|
side: {
|
|
44
44
|
type: String,
|
|
45
45
|
default: "right",
|
|
46
|
-
validator: (value) => ["left", "right"].includes(value)
|
|
46
|
+
validator: (value) => ["left", "right", "top", "bottom"].includes(value)
|
|
47
47
|
},
|
|
48
48
|
overlay: {
|
|
49
49
|
type: Boolean,
|
|
@@ -81,14 +81,50 @@ export default defineComponent({
|
|
|
81
81
|
if (!props.transition) {
|
|
82
82
|
return {};
|
|
83
83
|
}
|
|
84
|
+
let enterFrom, leaveTo;
|
|
85
|
+
switch (props.side) {
|
|
86
|
+
case "left":
|
|
87
|
+
enterFrom = ui.value.translate.left;
|
|
88
|
+
leaveTo = ui.value.translate.left;
|
|
89
|
+
break;
|
|
90
|
+
case "right":
|
|
91
|
+
enterFrom = ui.value.translate.right;
|
|
92
|
+
leaveTo = ui.value.translate.right;
|
|
93
|
+
break;
|
|
94
|
+
case "top":
|
|
95
|
+
enterFrom = ui.value.translate.top;
|
|
96
|
+
leaveTo = ui.value.translate.top;
|
|
97
|
+
break;
|
|
98
|
+
case "bottom":
|
|
99
|
+
enterFrom = ui.value.translate.bottom;
|
|
100
|
+
leaveTo = ui.value.translate.bottom;
|
|
101
|
+
break;
|
|
102
|
+
default:
|
|
103
|
+
enterFrom = ui.value.translate.right;
|
|
104
|
+
leaveTo = ui.value.translate.right;
|
|
105
|
+
}
|
|
84
106
|
return {
|
|
85
107
|
...ui.value.transition,
|
|
86
|
-
enterFrom
|
|
108
|
+
enterFrom,
|
|
87
109
|
enterTo: ui.value.translate.base,
|
|
88
110
|
leaveFrom: ui.value.translate.base,
|
|
89
|
-
leaveTo
|
|
111
|
+
leaveTo
|
|
90
112
|
};
|
|
91
113
|
});
|
|
114
|
+
const sideType = computed(() => {
|
|
115
|
+
switch (props.side) {
|
|
116
|
+
case "left":
|
|
117
|
+
return "horizontal";
|
|
118
|
+
case "right":
|
|
119
|
+
return "horizontal";
|
|
120
|
+
case "top":
|
|
121
|
+
return "vertical";
|
|
122
|
+
case "bottom":
|
|
123
|
+
return "vertical";
|
|
124
|
+
default:
|
|
125
|
+
return "right";
|
|
126
|
+
}
|
|
127
|
+
});
|
|
92
128
|
function close(value) {
|
|
93
129
|
if (props.preventClose) {
|
|
94
130
|
emit("close-prevented");
|
|
@@ -107,9 +143,10 @@ export default defineComponent({
|
|
|
107
143
|
attrs,
|
|
108
144
|
isOpen,
|
|
109
145
|
transitionClass,
|
|
146
|
+
sideType,
|
|
110
147
|
onAfterLeave,
|
|
111
148
|
close
|
|
112
149
|
};
|
|
113
150
|
}
|
|
114
151
|
});
|
|
115
|
-
</script>
|
|
152
|
+
</script>
|
|
@@ -9,7 +9,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
9
9
|
default: boolean;
|
|
10
10
|
};
|
|
11
11
|
side: {
|
|
12
|
-
type: PropType<"left" | "right">;
|
|
12
|
+
type: PropType<"bottom" | "left" | "right" | "top">;
|
|
13
13
|
default: string;
|
|
14
14
|
validator: (value: string) => boolean;
|
|
15
15
|
};
|
|
@@ -40,6 +40,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
40
40
|
}, string>>;
|
|
41
41
|
isOpen: WritableComputedRef<boolean>;
|
|
42
42
|
transitionClass: import("vue").ComputedRef<any>;
|
|
43
|
+
sideType: import("vue").ComputedRef<"right" | "horizontal" | "vertical">;
|
|
43
44
|
onAfterLeave: () => void;
|
|
44
45
|
close: (value: boolean) => void;
|
|
45
46
|
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "close" | "close-prevented" | "after-leave")[], "update:modelValue" | "close" | "close-prevented" | "after-leave", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
@@ -52,7 +53,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
52
53
|
default: boolean;
|
|
53
54
|
};
|
|
54
55
|
side: {
|
|
55
|
-
type: PropType<"left" | "right">;
|
|
56
|
+
type: PropType<"bottom" | "left" | "right" | "top">;
|
|
56
57
|
default: string;
|
|
57
58
|
validator: (value: string) => boolean;
|
|
58
59
|
};
|
|
@@ -89,6 +90,6 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
89
90
|
appear: boolean;
|
|
90
91
|
overlay: boolean;
|
|
91
92
|
preventClose: boolean;
|
|
92
|
-
side: "left" | "right";
|
|
93
|
+
side: "bottom" | "left" | "right" | "top";
|
|
93
94
|
}, {}>;
|
|
94
95
|
export default _default;
|
|
@@ -11,11 +11,13 @@ export const useCarouselScroll = (el) => {
|
|
|
11
11
|
function onMouseUp() {
|
|
12
12
|
el.value.style.removeProperty("scroll-behavior");
|
|
13
13
|
el.value.style.removeProperty("scroll-snap-type");
|
|
14
|
+
el.value.style.removeProperty("pointer-events");
|
|
14
15
|
window.removeEventListener("mousemove", onMouseMove);
|
|
15
16
|
window.removeEventListener("mouseup", onMouseUp);
|
|
16
17
|
}
|
|
17
18
|
function onMouseMove(e) {
|
|
18
19
|
e.preventDefault();
|
|
20
|
+
el.value.style.pointerEvents = "none";
|
|
19
21
|
const delta = e.pageX - x.value;
|
|
20
22
|
x.value = e.pageX;
|
|
21
23
|
el.value.scrollBy(-delta, 0);
|
|
@@ -19,10 +19,13 @@ declare const _default: {
|
|
|
19
19
|
padding: string;
|
|
20
20
|
shadow: string;
|
|
21
21
|
width: string;
|
|
22
|
+
height: string;
|
|
22
23
|
translate: {
|
|
23
24
|
base: string;
|
|
24
25
|
left: string;
|
|
25
26
|
right: string;
|
|
27
|
+
top: string;
|
|
28
|
+
bottom: string;
|
|
26
29
|
};
|
|
27
30
|
transition: {
|
|
28
31
|
enter: string;
|
|
@@ -20,10 +20,13 @@ export default {
|
|
|
20
20
|
padding: "",
|
|
21
21
|
shadow: "shadow-xl",
|
|
22
22
|
width: "w-screen max-w-md",
|
|
23
|
+
height: "h-screen max-h-96",
|
|
23
24
|
translate: {
|
|
24
25
|
base: "translate-x-0",
|
|
25
26
|
left: "-translate-x-full rtl:translate-x-full",
|
|
26
|
-
right: "translate-x-full rtl:-translate-x-full"
|
|
27
|
+
right: "translate-x-full rtl:-translate-x-full",
|
|
28
|
+
top: "-translate-y-full",
|
|
29
|
+
bottom: "translate-y-full"
|
|
27
30
|
},
|
|
28
31
|
// Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
|
|
29
32
|
transition: {
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nuxt/ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.17.0",
|
|
4
|
+
"packageManager": "pnpm@9.1.1",
|
|
4
5
|
"repository": "nuxt/ui",
|
|
5
6
|
"homepage": "https://ui.nuxt.com",
|
|
6
7
|
"type": "module",
|
|
@@ -33,11 +34,11 @@
|
|
|
33
34
|
"test": "vitest"
|
|
34
35
|
},
|
|
35
36
|
"dependencies": {
|
|
36
|
-
"@egoist/tailwindcss-icons": "^1.8.
|
|
37
|
-
"@headlessui/tailwindcss": "^0.2.
|
|
38
|
-
"@headlessui/vue": "^1.7.
|
|
37
|
+
"@egoist/tailwindcss-icons": "^1.8.1",
|
|
38
|
+
"@headlessui/tailwindcss": "^0.2.1",
|
|
39
|
+
"@headlessui/vue": "^1.7.22",
|
|
39
40
|
"@iconify-json/heroicons": "^1.1.21",
|
|
40
|
-
"@nuxt/kit": "^3.
|
|
41
|
+
"@nuxt/kit": "^3.12.1",
|
|
41
42
|
"@nuxtjs/color-mode": "^3.4.1",
|
|
42
43
|
"@nuxtjs/tailwindcss": "^6.12.0",
|
|
43
44
|
"@popperjs/core": "^2.11.8",
|
|
@@ -45,9 +46,9 @@
|
|
|
45
46
|
"@tailwindcss/container-queries": "^0.1.1",
|
|
46
47
|
"@tailwindcss/forms": "^0.5.7",
|
|
47
48
|
"@tailwindcss/typography": "^0.5.13",
|
|
48
|
-
"@vueuse/core": "^10.
|
|
49
|
-
"@vueuse/integrations": "^10.
|
|
50
|
-
"@vueuse/math": "^10.
|
|
49
|
+
"@vueuse/core": "^10.11.0",
|
|
50
|
+
"@vueuse/integrations": "^10.11.0",
|
|
51
|
+
"@vueuse/math": "^10.11.0",
|
|
51
52
|
"defu": "^6.1.4",
|
|
52
53
|
"fuse.js": "^6.6.2",
|
|
53
54
|
"nuxt-icon": "^0.6.10",
|
|
@@ -55,30 +56,32 @@
|
|
|
55
56
|
"pathe": "^1.1.2",
|
|
56
57
|
"scule": "^1.3.0",
|
|
57
58
|
"tailwind-merge": "^2.3.0",
|
|
58
|
-
"tailwindcss": "^3.4.
|
|
59
|
+
"tailwindcss": "^3.4.4"
|
|
59
60
|
},
|
|
60
61
|
"devDependencies": {
|
|
61
|
-
"@nuxt/eslint-config": "^0.3.
|
|
62
|
+
"@nuxt/eslint-config": "^0.3.13",
|
|
62
63
|
"@nuxt/module-builder": "^0.5.5",
|
|
63
|
-
"@nuxt/test-utils": "^3.
|
|
64
|
+
"@nuxt/test-utils": "^3.13.1",
|
|
64
65
|
"@release-it/conventional-changelog": "^8.0.1",
|
|
65
66
|
"@vue/test-utils": "^2.4.6",
|
|
66
67
|
"eslint": "^8.57.0",
|
|
67
68
|
"happy-dom": "^14.10.1",
|
|
68
69
|
"joi": "^17.13.1",
|
|
69
|
-
"nuxt": "^3.
|
|
70
|
-
"release-it": "^17.
|
|
70
|
+
"nuxt": "^3.12.1",
|
|
71
|
+
"release-it": "^17.3.0",
|
|
71
72
|
"typescript": "^5.4.5",
|
|
72
73
|
"unbuild": "^2.0.0",
|
|
73
|
-
"
|
|
74
|
+
"valibot30": "npm:valibot@0.30.0",
|
|
75
|
+
"valibot": "^0.31.1",
|
|
74
76
|
"vitest": "^1.6.0",
|
|
75
77
|
"vitest-environment-nuxt": "^1.0.0",
|
|
76
78
|
"vue-tsc": "^2.0.16",
|
|
77
79
|
"yup": "^1.4.0",
|
|
78
|
-
"zod": "^3.23.
|
|
80
|
+
"zod": "^3.23.8"
|
|
79
81
|
},
|
|
80
82
|
"resolutions": {
|
|
81
83
|
"@nuxt/ui": "workspace:*",
|
|
82
|
-
"@nuxt/module-builder": "0.5.5"
|
|
84
|
+
"@nuxt/module-builder": "0.5.5",
|
|
85
|
+
"vue-tsc": "2.0.16"
|
|
83
86
|
}
|
|
84
87
|
}
|