@nuxt/ui 2.13.0 → 2.14.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/README.md +8 -8
- package/dist/module.d.mts +61 -2
- package/dist/module.d.ts +61 -2
- package/dist/module.json +2 -2
- package/dist/module.mjs +131 -144
- package/dist/runtime/components/data/Table.vue +16 -4
- package/dist/runtime/components/data/Table.vue.d.ts +21 -3
- package/dist/runtime/components/elements/Accordion.vue +11 -2
- package/dist/runtime/components/elements/Accordion.vue.d.ts +1 -1
- package/dist/runtime/components/elements/Alert.vue +2 -2
- package/dist/runtime/components/elements/Alert.vue.d.ts +4 -3
- package/dist/runtime/components/elements/Avatar.vue.d.ts +1 -1
- package/dist/runtime/components/elements/AvatarGroup.d.ts +1 -1
- package/dist/runtime/components/elements/Badge.vue.d.ts +2 -2
- package/dist/runtime/components/elements/Button.vue.d.ts +63 -37
- package/dist/runtime/components/elements/ButtonGroup.d.ts +1 -1
- package/dist/runtime/components/elements/Carousel.vue +19 -12
- package/dist/runtime/components/elements/Carousel.vue.d.ts +4 -4
- package/dist/runtime/components/elements/Chip.vue.d.ts +2 -2
- package/dist/runtime/components/elements/Dropdown.vue +3 -1
- package/dist/runtime/components/elements/Dropdown.vue.d.ts +3 -3
- package/dist/runtime/components/elements/Icon.vue.d.ts +1 -1
- package/dist/runtime/components/elements/Kbd.vue.d.ts +1 -1
- package/dist/runtime/components/elements/Link.vue +1 -1
- package/dist/runtime/components/elements/Link.vue.d.ts +62 -36
- package/dist/runtime/components/elements/Meter.vue +4 -0
- package/dist/runtime/components/elements/Meter.vue.d.ts +1 -1
- package/dist/runtime/components/elements/MeterGroup.d.ts +1 -1
- package/dist/runtime/components/elements/Progress.vue +4 -1
- package/dist/runtime/components/elements/Progress.vue.d.ts +5 -5
- package/dist/runtime/components/forms/Checkbox.vue +1 -6
- package/dist/runtime/components/forms/Checkbox.vue.d.ts +6 -15
- package/dist/runtime/components/forms/Form.vue +6 -3
- package/dist/runtime/components/forms/Form.vue.d.ts +1 -1
- package/dist/runtime/components/forms/FormGroup.vue +20 -17
- package/dist/runtime/components/forms/FormGroup.vue.d.ts +2 -2
- package/dist/runtime/components/forms/Input.vue +1 -0
- package/dist/runtime/components/forms/Input.vue.d.ts +6 -6
- package/dist/runtime/components/forms/InputMenu.vue +4 -1
- package/dist/runtime/components/forms/InputMenu.vue.d.ts +7 -7
- package/dist/runtime/components/forms/Radio.vue +5 -11
- package/dist/runtime/components/forms/Radio.vue.d.ts +6 -6
- package/dist/runtime/components/forms/RadioGroup.vue +1 -0
- package/dist/runtime/components/forms/RadioGroup.vue.d.ts +4 -4
- package/dist/runtime/components/forms/Range.vue.d.ts +4 -4
- package/dist/runtime/components/forms/Select.vue.d.ts +6 -6
- package/dist/runtime/components/forms/SelectMenu.vue +4 -1
- package/dist/runtime/components/forms/SelectMenu.vue.d.ts +7 -7
- package/dist/runtime/components/forms/Textarea.vue +5 -1
- package/dist/runtime/components/forms/Textarea.vue.d.ts +15 -6
- package/dist/runtime/components/forms/Toggle.vue +3 -1
- package/dist/runtime/components/forms/Toggle.vue.d.ts +4 -4
- package/dist/runtime/components/layout/Card.vue +1 -1
- package/dist/runtime/components/layout/Card.vue.d.ts +1 -1
- package/dist/runtime/components/layout/Container.vue.d.ts +1 -1
- package/dist/runtime/components/layout/Divider.vue +8 -1
- package/dist/runtime/components/layout/Divider.vue.d.ts +15 -4
- package/dist/runtime/components/layout/Skeleton.vue.d.ts +1 -1
- package/dist/runtime/components/navigation/Breadcrumb.vue.d.ts +1 -1
- package/dist/runtime/components/navigation/CommandPalette.vue +3 -1
- package/dist/runtime/components/navigation/CommandPalette.vue.d.ts +2 -2
- package/dist/runtime/components/navigation/CommandPaletteGroup.vue +3 -1
- package/dist/runtime/components/navigation/CommandPaletteGroup.vue.d.ts +1 -1
- package/dist/runtime/components/navigation/HorizontalNavigation.vue.d.ts +1 -1
- package/dist/runtime/components/navigation/Pagination.vue.d.ts +1 -1
- package/dist/runtime/components/navigation/Tabs.vue +8 -8
- package/dist/runtime/components/navigation/Tabs.vue.d.ts +10 -1
- package/dist/runtime/components/navigation/VerticalNavigation.vue.d.ts +1 -1
- package/dist/runtime/components/overlays/ContextMenu.vue.d.ts +3 -3
- package/dist/runtime/components/overlays/Modal.vue +3 -1
- package/dist/runtime/components/overlays/Modal.vue.d.ts +5 -5
- package/dist/runtime/components/overlays/Modals.client.vue +12 -0
- package/dist/runtime/components/overlays/Notification.vue +2 -2
- package/dist/runtime/components/overlays/Notification.vue.d.ts +4 -3
- package/dist/runtime/components/overlays/Notifications.vue.d.ts +1 -1
- package/dist/runtime/components/overlays/Popover.vue +3 -1
- package/dist/runtime/components/overlays/Popover.vue.d.ts +3 -3
- package/dist/runtime/components/overlays/Slideover.vue +3 -1
- package/dist/runtime/components/overlays/Slideover.vue.d.ts +5 -5
- package/dist/runtime/components/overlays/Tooltip.vue.d.ts +2 -2
- package/dist/runtime/composables/useFormGroup.d.ts +1 -1
- package/dist/runtime/composables/useFormGroup.mjs +9 -12
- package/dist/runtime/composables/useModal.d.ts +12 -0
- package/dist/runtime/composables/useModal.mjs +37 -0
- package/dist/runtime/plugins/modals.d.ts +2 -0
- package/dist/runtime/plugins/modals.mjs +10 -0
- package/dist/runtime/types/component.d.ts +14 -0
- package/dist/runtime/types/divider.d.ts +3 -0
- package/dist/runtime/types/form.d.ts +2 -1
- package/dist/runtime/types/index.d.ts +2 -0
- package/dist/runtime/types/modal.d.ts +18 -0
- package/dist/runtime/types/progress.d.ts +2 -0
- package/dist/runtime/types/range.d.ts +2 -0
- package/dist/runtime/types/toggle.d.ts +2 -0
- package/dist/runtime/ui.config/data/table.d.ts +7 -0
- package/dist/runtime/ui.config/data/table.mjs +10 -3
- package/dist/runtime/ui.config/elements/accordion.d.ts +1 -0
- package/dist/runtime/ui.config/elements/accordion.mjs +1 -0
- package/dist/runtime/ui.config/forms/formGroup.d.ts +1 -0
- package/dist/runtime/ui.config/forms/formGroup.mjs +1 -0
- package/dist/runtime/ui.config/forms/input.d.ts +11 -0
- package/dist/runtime/ui.config/forms/input.mjs +11 -0
- package/dist/runtime/ui.config/forms/select.d.ts +11 -0
- package/dist/runtime/ui.config/forms/textarea.d.ts +11 -0
- package/dist/runtime/ui.config/layout/divider.d.ts +19 -2
- package/dist/runtime/ui.config/layout/divider.mjs +20 -3
- package/dist/runtime/utils/colors.d.ts +3 -0
- package/dist/runtime/utils/colors.mjs +261 -0
- package/dist/runtime/utils/index.mjs +9 -0
- package/dist/runtime/utils/link.d.ts +24 -11
- package/dist/runtime/utils/link.mjs +26 -13
- package/package.json +21 -19
- package/dist/runtime/utils/uid.d.ts +0 -1
- package/dist/runtime/utils/uid.mjs +0 -5
|
@@ -34,61 +34,74 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
34
34
|
to: {
|
|
35
35
|
readonly type: import("vue").PropType<RouteLocationRaw>;
|
|
36
36
|
readonly default: undefined;
|
|
37
|
+
readonly required: false;
|
|
37
38
|
};
|
|
38
39
|
href: {
|
|
39
40
|
readonly type: import("vue").PropType<RouteLocationRaw>;
|
|
40
41
|
readonly default: undefined;
|
|
42
|
+
readonly required: false;
|
|
41
43
|
};
|
|
42
44
|
target: {
|
|
43
|
-
readonly type: import("vue").PropType<
|
|
45
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
44
46
|
readonly default: undefined;
|
|
47
|
+
readonly required: false;
|
|
45
48
|
};
|
|
46
49
|
rel: {
|
|
47
|
-
readonly type: import("vue").PropType<
|
|
50
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
48
51
|
readonly default: undefined;
|
|
52
|
+
readonly required: false;
|
|
49
53
|
};
|
|
50
54
|
noRel: {
|
|
51
|
-
readonly type:
|
|
55
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
52
56
|
readonly default: undefined;
|
|
57
|
+
readonly required: false;
|
|
53
58
|
};
|
|
54
59
|
prefetch: {
|
|
55
|
-
readonly type:
|
|
60
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
56
61
|
readonly default: undefined;
|
|
62
|
+
readonly required: false;
|
|
57
63
|
};
|
|
58
64
|
noPrefetch: {
|
|
59
|
-
readonly type:
|
|
65
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
60
66
|
readonly default: undefined;
|
|
67
|
+
readonly required: false;
|
|
61
68
|
};
|
|
62
69
|
activeClass: {
|
|
63
|
-
readonly type:
|
|
70
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
64
71
|
readonly default: undefined;
|
|
72
|
+
readonly required: false;
|
|
65
73
|
};
|
|
66
74
|
exactActiveClass: {
|
|
67
|
-
readonly type:
|
|
75
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
68
76
|
readonly default: undefined;
|
|
77
|
+
readonly required: false;
|
|
69
78
|
};
|
|
70
79
|
prefetchedClass: {
|
|
71
|
-
readonly type:
|
|
80
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
72
81
|
readonly default: undefined;
|
|
82
|
+
readonly required: false;
|
|
73
83
|
};
|
|
74
84
|
replace: {
|
|
75
|
-
readonly type:
|
|
85
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
76
86
|
readonly default: undefined;
|
|
87
|
+
readonly required: false;
|
|
77
88
|
};
|
|
78
89
|
ariaCurrentValue: {
|
|
79
|
-
readonly type:
|
|
90
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
80
91
|
readonly default: undefined;
|
|
92
|
+
readonly required: false;
|
|
81
93
|
};
|
|
82
94
|
external: {
|
|
83
|
-
readonly type:
|
|
95
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
84
96
|
readonly default: undefined;
|
|
97
|
+
readonly required: false;
|
|
85
98
|
};
|
|
86
99
|
}, {
|
|
87
100
|
resolveLinkClass: (route: any, $route: any, { isActive, isExactActive }: {
|
|
88
101
|
isActive: boolean;
|
|
89
102
|
isExactActive: boolean;
|
|
90
|
-
}) =>
|
|
91
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").
|
|
103
|
+
}) => any;
|
|
104
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
92
105
|
as: {
|
|
93
106
|
type: StringConstructor;
|
|
94
107
|
default: string;
|
|
@@ -124,72 +137,85 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
124
137
|
to: {
|
|
125
138
|
readonly type: import("vue").PropType<RouteLocationRaw>;
|
|
126
139
|
readonly default: undefined;
|
|
140
|
+
readonly required: false;
|
|
127
141
|
};
|
|
128
142
|
href: {
|
|
129
143
|
readonly type: import("vue").PropType<RouteLocationRaw>;
|
|
130
144
|
readonly default: undefined;
|
|
145
|
+
readonly required: false;
|
|
131
146
|
};
|
|
132
147
|
target: {
|
|
133
|
-
readonly type: import("vue").PropType<
|
|
148
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
134
149
|
readonly default: undefined;
|
|
150
|
+
readonly required: false;
|
|
135
151
|
};
|
|
136
152
|
rel: {
|
|
137
|
-
readonly type: import("vue").PropType<
|
|
153
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
138
154
|
readonly default: undefined;
|
|
155
|
+
readonly required: false;
|
|
139
156
|
};
|
|
140
157
|
noRel: {
|
|
141
|
-
readonly type:
|
|
158
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
142
159
|
readonly default: undefined;
|
|
160
|
+
readonly required: false;
|
|
143
161
|
};
|
|
144
162
|
prefetch: {
|
|
145
|
-
readonly type:
|
|
163
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
146
164
|
readonly default: undefined;
|
|
165
|
+
readonly required: false;
|
|
147
166
|
};
|
|
148
167
|
noPrefetch: {
|
|
149
|
-
readonly type:
|
|
168
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
150
169
|
readonly default: undefined;
|
|
170
|
+
readonly required: false;
|
|
151
171
|
};
|
|
152
172
|
activeClass: {
|
|
153
|
-
readonly type:
|
|
173
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
154
174
|
readonly default: undefined;
|
|
175
|
+
readonly required: false;
|
|
155
176
|
};
|
|
156
177
|
exactActiveClass: {
|
|
157
|
-
readonly type:
|
|
178
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
158
179
|
readonly default: undefined;
|
|
180
|
+
readonly required: false;
|
|
159
181
|
};
|
|
160
182
|
prefetchedClass: {
|
|
161
|
-
readonly type:
|
|
183
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
162
184
|
readonly default: undefined;
|
|
185
|
+
readonly required: false;
|
|
163
186
|
};
|
|
164
187
|
replace: {
|
|
165
|
-
readonly type:
|
|
188
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
166
189
|
readonly default: undefined;
|
|
190
|
+
readonly required: false;
|
|
167
191
|
};
|
|
168
192
|
ariaCurrentValue: {
|
|
169
|
-
readonly type:
|
|
193
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
170
194
|
readonly default: undefined;
|
|
195
|
+
readonly required: false;
|
|
171
196
|
};
|
|
172
197
|
external: {
|
|
173
|
-
readonly type:
|
|
198
|
+
readonly type: import("vue").PropType<NuxtLinkProps>;
|
|
174
199
|
readonly default: undefined;
|
|
200
|
+
readonly required: false;
|
|
175
201
|
};
|
|
176
202
|
}>>, {
|
|
177
203
|
type: string;
|
|
178
|
-
|
|
179
|
-
|
|
204
|
+
target: NuxtLinkProps;
|
|
205
|
+
rel: NuxtLinkProps;
|
|
206
|
+
noRel: NuxtLinkProps;
|
|
207
|
+
prefetch: NuxtLinkProps;
|
|
208
|
+
noPrefetch: NuxtLinkProps;
|
|
209
|
+
activeClass: NuxtLinkProps;
|
|
210
|
+
exactActiveClass: NuxtLinkProps;
|
|
211
|
+
prefetchedClass: NuxtLinkProps;
|
|
212
|
+
replace: NuxtLinkProps;
|
|
213
|
+
ariaCurrentValue: NuxtLinkProps;
|
|
214
|
+
external: NuxtLinkProps;
|
|
180
215
|
disabled: boolean;
|
|
216
|
+
as: string;
|
|
181
217
|
to: RouteLocationRaw;
|
|
182
218
|
href: RouteLocationRaw;
|
|
183
|
-
target: (string & {}) | "_blank" | "_parent" | "_self" | "_top" | null;
|
|
184
|
-
rel: string | null;
|
|
185
|
-
noRel: boolean;
|
|
186
|
-
prefetch: boolean;
|
|
187
|
-
noPrefetch: boolean;
|
|
188
|
-
activeClass: string;
|
|
189
|
-
exactActiveClass: string;
|
|
190
|
-
prefetchedClass: string;
|
|
191
|
-
ariaCurrentValue: string;
|
|
192
|
-
external: boolean;
|
|
193
219
|
active: boolean;
|
|
194
220
|
exact: boolean;
|
|
195
221
|
exactQuery: boolean;
|
|
@@ -30,12 +30,16 @@
|
|
|
30
30
|
<script>
|
|
31
31
|
import { computed, defineComponent, toRef } from "vue";
|
|
32
32
|
import { twJoin } from "tailwind-merge";
|
|
33
|
+
import UIcon from "./Icon.vue";
|
|
33
34
|
import { useUI } from "../../composables/useUI";
|
|
34
35
|
import { mergeConfig } from "../../utils";
|
|
35
36
|
import appConfig from "#build/app.config";
|
|
36
37
|
import { meter } from "#ui/ui.config";
|
|
37
38
|
const config = mergeConfig(appConfig.ui.strategy, appConfig.ui.meter, meter);
|
|
38
39
|
export default defineComponent({
|
|
40
|
+
components: {
|
|
41
|
+
UIcon
|
|
42
|
+
},
|
|
39
43
|
inheritAttrs: false,
|
|
40
44
|
slots: Object,
|
|
41
45
|
props: {
|
|
@@ -56,7 +56,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
56
56
|
normalizedMin: import("vue").ComputedRef<number>;
|
|
57
57
|
normalizedMax: import("vue").ComputedRef<number>;
|
|
58
58
|
percent: import("vue").ComputedRef<number>;
|
|
59
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").
|
|
59
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
60
60
|
value: {
|
|
61
61
|
type: NumberConstructor;
|
|
62
62
|
default: number;
|
|
@@ -31,7 +31,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
31
31
|
};
|
|
32
32
|
}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
33
33
|
[key: string]: any;
|
|
34
|
-
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").
|
|
34
|
+
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
35
35
|
min: {
|
|
36
36
|
type: NumberConstructor;
|
|
37
37
|
default: number;
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
</slot>
|
|
10
10
|
|
|
11
11
|
<progress :class="progressClass" v-bind="{ value, max: realMax }">
|
|
12
|
-
{{ Math.round(percent) }}
|
|
12
|
+
{{ percent !== undefined ? `${Math.round(percent)}%` : undefined }}
|
|
13
13
|
</progress>
|
|
14
14
|
|
|
15
15
|
<div v-if="isSteps" :class="stepsClass">
|
|
@@ -163,6 +163,9 @@ export default defineComponent({
|
|
|
163
163
|
return Number(props.max);
|
|
164
164
|
});
|
|
165
165
|
const percent = computed(() => {
|
|
166
|
+
if (isIndeterminate.value) {
|
|
167
|
+
return void 0;
|
|
168
|
+
}
|
|
166
169
|
switch (true) {
|
|
167
170
|
case props.value < 0:
|
|
168
171
|
return 0;
|
|
@@ -36,7 +36,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
36
36
|
validator(value: string): boolean;
|
|
37
37
|
};
|
|
38
38
|
color: {
|
|
39
|
-
type:
|
|
39
|
+
type: PropType<any>;
|
|
40
40
|
default: () => any;
|
|
41
41
|
validator(value: string): any;
|
|
42
42
|
};
|
|
@@ -61,8 +61,8 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
61
61
|
isIndeterminate: import("vue").ComputedRef<boolean>;
|
|
62
62
|
isSteps: import("vue").ComputedRef<boolean>;
|
|
63
63
|
realMax: import("vue").ComputedRef<number | null>;
|
|
64
|
-
percent: import("vue").ComputedRef<number>;
|
|
65
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").
|
|
64
|
+
percent: import("vue").ComputedRef<number | undefined>;
|
|
65
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
66
66
|
value: {
|
|
67
67
|
type: NumberConstructor;
|
|
68
68
|
default: null;
|
|
@@ -99,7 +99,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
99
99
|
validator(value: string): boolean;
|
|
100
100
|
};
|
|
101
101
|
color: {
|
|
102
|
-
type:
|
|
102
|
+
type: PropType<any>;
|
|
103
103
|
default: () => any;
|
|
104
104
|
validator(value: string): any;
|
|
105
105
|
};
|
|
@@ -115,7 +115,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
115
115
|
size: "sm" | "2xs" | "md" | "xs" | "lg" | "xl" | "2xl";
|
|
116
116
|
ui: any;
|
|
117
117
|
value: number;
|
|
118
|
-
color:
|
|
118
|
+
color: any;
|
|
119
119
|
class: any;
|
|
120
120
|
max: number | any[];
|
|
121
121
|
indicator: boolean;
|
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
:required="required"
|
|
9
9
|
:value="value"
|
|
10
10
|
:disabled="disabled"
|
|
11
|
-
:checked="checked"
|
|
12
11
|
:indeterminate="indeterminate"
|
|
13
12
|
type="checkbox"
|
|
14
13
|
:class="inputClass"
|
|
@@ -60,13 +59,9 @@ export default defineComponent({
|
|
|
60
59
|
type: Boolean,
|
|
61
60
|
default: false
|
|
62
61
|
},
|
|
63
|
-
checked: {
|
|
64
|
-
type: Boolean,
|
|
65
|
-
default: false
|
|
66
|
-
},
|
|
67
62
|
indeterminate: {
|
|
68
63
|
type: Boolean,
|
|
69
|
-
default:
|
|
64
|
+
default: void 0
|
|
70
65
|
},
|
|
71
66
|
help: {
|
|
72
67
|
type: String,
|
|
@@ -20,13 +20,9 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
20
20
|
type: BooleanConstructor;
|
|
21
21
|
default: boolean;
|
|
22
22
|
};
|
|
23
|
-
checked: {
|
|
24
|
-
type: BooleanConstructor;
|
|
25
|
-
default: boolean;
|
|
26
|
-
};
|
|
27
23
|
indeterminate: {
|
|
28
24
|
type: BooleanConstructor;
|
|
29
|
-
default:
|
|
25
|
+
default: undefined;
|
|
30
26
|
};
|
|
31
27
|
help: {
|
|
32
28
|
type: StringConstructor;
|
|
@@ -63,11 +59,11 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
63
59
|
[x: string]: unknown;
|
|
64
60
|
}, string>>;
|
|
65
61
|
toggle: import("vue").WritableComputedRef<boolean | unknown[]>;
|
|
66
|
-
inputId: import("vue").
|
|
62
|
+
inputId: import("vue").ComputedRef<string | undefined>;
|
|
67
63
|
name: import("vue").ComputedRef<string | undefined>;
|
|
68
64
|
inputClass: import("vue").ComputedRef<string>;
|
|
69
65
|
onChange: (event: Event) => void;
|
|
70
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").
|
|
66
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
71
67
|
id: {
|
|
72
68
|
type: StringConstructor;
|
|
73
69
|
default: () => null;
|
|
@@ -88,13 +84,9 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
88
84
|
type: BooleanConstructor;
|
|
89
85
|
default: boolean;
|
|
90
86
|
};
|
|
91
|
-
checked: {
|
|
92
|
-
type: BooleanConstructor;
|
|
93
|
-
default: boolean;
|
|
94
|
-
};
|
|
95
87
|
indeterminate: {
|
|
96
88
|
type: BooleanConstructor;
|
|
97
|
-
default:
|
|
89
|
+
default: undefined;
|
|
98
90
|
};
|
|
99
91
|
help: {
|
|
100
92
|
type: StringConstructor;
|
|
@@ -133,14 +125,13 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
133
125
|
value: string | number | boolean | Record<string, any>;
|
|
134
126
|
id: string;
|
|
135
127
|
color: any;
|
|
136
|
-
name: string;
|
|
137
128
|
class: any;
|
|
129
|
+
name: string;
|
|
138
130
|
label: string;
|
|
131
|
+
disabled: boolean;
|
|
139
132
|
modelValue: boolean | unknown[];
|
|
140
133
|
indeterminate: boolean;
|
|
141
|
-
disabled: boolean;
|
|
142
134
|
required: boolean;
|
|
143
|
-
checked: boolean;
|
|
144
135
|
help: string;
|
|
145
136
|
inputClass: string;
|
|
146
137
|
}, {}>;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
<script>
|
|
8
8
|
import { provide, ref, defineComponent, onUnmounted, onMounted } from "vue";
|
|
9
9
|
import { useEventBus } from "@vueuse/core";
|
|
10
|
-
import {
|
|
10
|
+
import { useId } from "#imports";
|
|
11
11
|
class FormException extends Error {
|
|
12
12
|
constructor(message) {
|
|
13
13
|
super(message);
|
|
@@ -36,7 +36,8 @@ export default defineComponent({
|
|
|
36
36
|
},
|
|
37
37
|
emits: ["submit", "error"],
|
|
38
38
|
setup(props, { expose, emit }) {
|
|
39
|
-
const
|
|
39
|
+
const formId = useId();
|
|
40
|
+
const bus = useEventBus(`form-${formId}`);
|
|
40
41
|
onMounted(() => {
|
|
41
42
|
bus.on(async (event) => {
|
|
42
43
|
if (event.type !== "submit" && props.validateOn?.includes(event.type)) {
|
|
@@ -85,7 +86,9 @@ export default defineComponent({
|
|
|
85
86
|
} else {
|
|
86
87
|
errors.value = await getErrors();
|
|
87
88
|
}
|
|
88
|
-
if (
|
|
89
|
+
if (errors.value.length > 0) {
|
|
90
|
+
if (opts.silent)
|
|
91
|
+
return false;
|
|
89
92
|
throw new FormException(
|
|
90
93
|
`Form validation failed: ${JSON.stringify(errors.value, null, 2)}`
|
|
91
94
|
);
|
|
@@ -23,7 +23,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
23
23
|
};
|
|
24
24
|
}, {
|
|
25
25
|
onSubmit: (payload: Event) => Promise<void>;
|
|
26
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "submit")[], "error" | "submit", import("vue").
|
|
26
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "submit")[], "error" | "submit", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
27
27
|
schema: {
|
|
28
28
|
type: PropType<ZodSchema<any, import("zod").ZodTypeDef, any>> | PropType<YupObjectSchema<any, import("yup").AnyObject, any, "">> | PropType<JoiSchema> | PropType<ValibotObjectSchema<any>>;
|
|
29
29
|
default: undefined;
|
|
@@ -1,22 +1,24 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div :class="ui.wrapper" v-bind="attrs">
|
|
3
|
-
<div
|
|
4
|
-
<
|
|
5
|
-
<
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
<
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
3
|
+
<div :class="ui.inner">
|
|
4
|
+
<div v-if="label || $slots.label" :class="[ui.label.wrapper, size]">
|
|
5
|
+
<label :for="inputId" :class="[ui.label.base, required ? ui.label.required : '']">
|
|
6
|
+
<slot v-if="$slots.label" name="label" v-bind="{ error, label, name, hint, description, help }" />
|
|
7
|
+
<template v-else>{{ label }}</template>
|
|
8
|
+
</label>
|
|
9
|
+
<span v-if="hint || $slots.hint" :class="[ui.hint]">
|
|
10
|
+
<slot v-if="$slots.hint" name="hint" v-bind="{ error, label, name, hint, description, help }" />
|
|
11
|
+
<template v-else>{{ hint }}</template>
|
|
12
|
+
</span>
|
|
13
|
+
</div>
|
|
13
14
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
<p v-if="description || $slots.description" :class="[ui.description, size]">
|
|
16
|
+
<slot v-if="$slots.description" name="description" v-bind="{ error, label, name, hint, description, help }" />
|
|
17
|
+
<template v-else>
|
|
18
|
+
{{ description }}
|
|
19
|
+
</template>
|
|
20
|
+
</p>
|
|
21
|
+
</div>
|
|
20
22
|
|
|
21
23
|
<div :class="[label ? ui.container : '']">
|
|
22
24
|
<slot v-bind="{ error }" />
|
|
@@ -43,6 +45,7 @@ import { useUI } from "../../composables/useUI";
|
|
|
43
45
|
import { mergeConfig } from "../../utils";
|
|
44
46
|
import appConfig from "#build/app.config";
|
|
45
47
|
import { formGroup } from "#ui/ui.config";
|
|
48
|
+
import { useId } from "#imports";
|
|
46
49
|
const config = mergeConfig(appConfig.ui.strategy, appConfig.ui.formGroup, formGroup);
|
|
47
50
|
export default defineComponent({
|
|
48
51
|
inheritAttrs: false,
|
|
@@ -102,7 +105,7 @@ export default defineComponent({
|
|
|
102
105
|
return props.error && typeof props.error === "string" || typeof props.error === "boolean" ? props.error : formErrors?.value?.find((error2) => error2.path === props.name)?.message;
|
|
103
106
|
});
|
|
104
107
|
const size = computed(() => ui.value.size[props.size ?? config.default.size]);
|
|
105
|
-
const inputId = ref();
|
|
108
|
+
const inputId = ref(useId());
|
|
106
109
|
provide("form-group", {
|
|
107
110
|
error,
|
|
108
111
|
inputId,
|
|
@@ -54,7 +54,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
54
54
|
inputId: Ref<any>;
|
|
55
55
|
size: import("vue").ComputedRef<any>;
|
|
56
56
|
error: import("vue").ComputedRef<string | boolean | undefined>;
|
|
57
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").
|
|
57
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
58
58
|
name: {
|
|
59
59
|
type: StringConstructor;
|
|
60
60
|
default: null;
|
|
@@ -105,8 +105,8 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
105
105
|
size: FormGroupSize;
|
|
106
106
|
ui: any;
|
|
107
107
|
description: string;
|
|
108
|
-
name: string;
|
|
109
108
|
class: any;
|
|
109
|
+
name: string;
|
|
110
110
|
label: string;
|
|
111
111
|
required: boolean;
|
|
112
112
|
help: string;
|
|
@@ -211,6 +211,7 @@ export default defineComponent({
|
|
|
211
211
|
ui.value.form,
|
|
212
212
|
rounded.value,
|
|
213
213
|
ui.value.placeholder,
|
|
214
|
+
props.type === "file" && [ui.value.file.base, ui.value.file.padding[size.value]],
|
|
214
215
|
ui.value.size[size.value],
|
|
215
216
|
props.padded ? ui.value.padding[size.value] : "p-0",
|
|
216
217
|
variant?.replaceAll("{color}", color.value),
|
|
@@ -110,7 +110,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
110
110
|
[x: string]: unknown;
|
|
111
111
|
}, string>>;
|
|
112
112
|
name: import("vue").ComputedRef<string | undefined>;
|
|
113
|
-
inputId: import("vue").
|
|
113
|
+
inputId: import("vue").ComputedRef<string | undefined>;
|
|
114
114
|
input: import("vue").Ref<HTMLInputElement | null>;
|
|
115
115
|
isLeading: import("vue").ComputedRef<string | true>;
|
|
116
116
|
isTrailing: import("vue").ComputedRef<string | true>;
|
|
@@ -124,7 +124,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
124
124
|
onInput: (event: Event) => void;
|
|
125
125
|
onChange: (event: Event) => void;
|
|
126
126
|
onBlur: (event: FocusEvent) => void;
|
|
127
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("blur" | "update:modelValue")[], "blur" | "update:modelValue", import("vue").
|
|
127
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("blur" | "update:modelValue")[], "blur" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
128
128
|
modelValue: {
|
|
129
129
|
type: (NumberConstructor | StringConstructor)[];
|
|
130
130
|
default: string;
|
|
@@ -238,20 +238,20 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
238
238
|
icon: string;
|
|
239
239
|
color: any;
|
|
240
240
|
type: string;
|
|
241
|
+
class: any;
|
|
241
242
|
name: string;
|
|
242
243
|
leading: boolean;
|
|
243
|
-
|
|
244
|
+
variant: InputVariant;
|
|
245
|
+
disabled: boolean;
|
|
244
246
|
modelValue: string | number;
|
|
245
247
|
loading: boolean;
|
|
246
|
-
disabled: boolean;
|
|
247
|
-
variant: InputVariant;
|
|
248
|
-
required: boolean;
|
|
249
248
|
placeholder: string;
|
|
250
249
|
padded: boolean;
|
|
251
250
|
loadingIcon: string;
|
|
252
251
|
leadingIcon: string;
|
|
253
252
|
trailingIcon: string;
|
|
254
253
|
trailing: boolean;
|
|
254
|
+
required: boolean;
|
|
255
255
|
autofocus: boolean;
|
|
256
256
|
inputClass: string;
|
|
257
257
|
autofocusDelay: number;
|
|
@@ -97,7 +97,8 @@ import {
|
|
|
97
97
|
ComboboxButton as HComboboxButton,
|
|
98
98
|
ComboboxOptions as HComboboxOptions,
|
|
99
99
|
ComboboxOption as HComboboxOption,
|
|
100
|
-
ComboboxInput as HComboboxInput
|
|
100
|
+
ComboboxInput as HComboboxInput,
|
|
101
|
+
provideUseId
|
|
101
102
|
} from "@headlessui/vue";
|
|
102
103
|
import { computedAsync, useDebounceFn } from "@vueuse/core";
|
|
103
104
|
import { defu } from "defu";
|
|
@@ -111,6 +112,7 @@ import { get, mergeConfig } from "../../utils";
|
|
|
111
112
|
import { useInjectButtonGroup } from "../../composables/useButtonGroup";
|
|
112
113
|
import appConfig from "#build/app.config";
|
|
113
114
|
import { input, inputMenu } from "#ui/ui.config";
|
|
115
|
+
import { useId } from "#imports";
|
|
114
116
|
const config = mergeConfig(appConfig.ui.strategy, appConfig.ui.input, input);
|
|
115
117
|
const configMenu = mergeConfig(appConfig.ui.strategy, appConfig.ui.inputMenu, inputMenu);
|
|
116
118
|
export default defineComponent({
|
|
@@ -392,6 +394,7 @@ export default defineComponent({
|
|
|
392
394
|
function onChange(event) {
|
|
393
395
|
query.value = event.target.value;
|
|
394
396
|
}
|
|
397
|
+
provideUseId(() => useId());
|
|
395
398
|
return {
|
|
396
399
|
// eslint-disable-next-line vue/no-dupe-keys
|
|
397
400
|
ui,
|
|
@@ -142,7 +142,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
142
142
|
[x: string]: unknown;
|
|
143
143
|
}, string>>;
|
|
144
144
|
name: import("vue").ComputedRef<string | undefined>;
|
|
145
|
-
inputId: import("vue").
|
|
145
|
+
inputId: import("vue").ComputedRef<string | undefined>;
|
|
146
146
|
popper: import("vue").ComputedRef<PopperOptions>;
|
|
147
147
|
trigger: import("vue").Ref<import("@vueuse/core").MaybeElement>;
|
|
148
148
|
container: import("vue").Ref<import("@vueuse/core").MaybeElement>;
|
|
@@ -160,7 +160,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
160
160
|
query: import("vue").WritableComputedRef<string>;
|
|
161
161
|
onUpdate: (event: any) => void;
|
|
162
162
|
onChange: (event: any) => void;
|
|
163
|
-
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "update:modelValue" | "open" | "update:query")[], "change" | "close" | "update:modelValue" | "open" | "update:query", import("vue").
|
|
163
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "update:modelValue" | "open" | "update:query")[], "change" | "close" | "update:modelValue" | "open" | "update:query", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
164
164
|
modelValue: {
|
|
165
165
|
type: (ObjectConstructor | NumberConstructor | StringConstructor | ArrayConstructor)[];
|
|
166
166
|
default: string;
|
|
@@ -296,9 +296,9 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
296
296
|
default: () => {};
|
|
297
297
|
};
|
|
298
298
|
}>> & {
|
|
299
|
+
onClose?: ((...args: any[]) => any) | undefined;
|
|
299
300
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
300
301
|
onChange?: ((...args: any[]) => any) | undefined;
|
|
301
|
-
onClose?: ((...args: any[]) => any) | undefined;
|
|
302
302
|
onOpen?: ((...args: any[]) => any) | undefined;
|
|
303
303
|
"onUpdate:query"?: ((...args: any[]) => any) | undefined;
|
|
304
304
|
}, {
|
|
@@ -307,6 +307,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
307
307
|
id: string;
|
|
308
308
|
icon: string;
|
|
309
309
|
color: any;
|
|
310
|
+
class: any;
|
|
310
311
|
options: string[] | {
|
|
311
312
|
[key: string]: any;
|
|
312
313
|
disabled?: boolean | undefined;
|
|
@@ -315,19 +316,18 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
315
316
|
name: string;
|
|
316
317
|
leading: boolean;
|
|
317
318
|
search: (query: string) => Promise<any[]> | any[];
|
|
318
|
-
|
|
319
|
+
variant: InputVariant;
|
|
320
|
+
disabled: boolean;
|
|
319
321
|
modelValue: string | number | unknown[] | Record<string, any>;
|
|
320
322
|
by: string;
|
|
321
323
|
loading: boolean;
|
|
322
|
-
disabled: boolean;
|
|
323
|
-
variant: InputVariant;
|
|
324
|
-
required: boolean;
|
|
325
324
|
placeholder: string;
|
|
326
325
|
padded: boolean;
|
|
327
326
|
loadingIcon: string;
|
|
328
327
|
leadingIcon: string;
|
|
329
328
|
trailingIcon: string;
|
|
330
329
|
trailing: boolean;
|
|
330
|
+
required: boolean;
|
|
331
331
|
inputClass: string;
|
|
332
332
|
nullable: boolean;
|
|
333
333
|
query: string;
|