@nuxt/ui 3.0.0-alpha.10 → 3.0.0-alpha.11
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/.nuxt/ui/alert.ts +75 -58
- package/.nuxt/ui/avatar-group.ts +13 -1
- package/.nuxt/ui/avatar.ts +13 -1
- package/.nuxt/ui/badge.ts +102 -65
- package/.nuxt/ui/button-group.ts +13 -0
- package/.nuxt/ui/button.ts +124 -92
- package/.nuxt/ui/calendar.ts +20 -2
- package/.nuxt/ui/carousel.ts +5 -3
- package/.nuxt/ui/checkbox.ts +27 -9
- package/.nuxt/ui/chip.ts +36 -7
- package/.nuxt/ui/color-picker.ts +9 -1
- package/.nuxt/ui/context-menu.ts +32 -14
- package/.nuxt/ui/drawer.ts +11 -4
- package/.nuxt/ui/dropdown-menu.ts +32 -14
- package/.nuxt/ui/form-field.ts +9 -1
- package/.nuxt/ui/input-menu.ts +110 -75
- package/.nuxt/ui/input-number.ts +82 -51
- package/.nuxt/ui/input.ts +88 -53
- package/.nuxt/ui/kbd.ts +14 -2
- package/.nuxt/ui/navigation-menu.ts +114 -68
- package/.nuxt/ui/pin-input.ts +57 -31
- package/.nuxt/ui/popover.ts +1 -1
- package/.nuxt/ui/progress.ts +93 -54
- package/.nuxt/ui/radio-group.ts +25 -2
- package/.nuxt/ui/select-menu.ts +89 -54
- package/.nuxt/ui/select.ts +89 -54
- package/.nuxt/ui/separator.ts +52 -23
- package/.nuxt/ui/slideover.ts +11 -4
- package/.nuxt/ui/slider.ts +45 -22
- package/.nuxt/ui/stepper.ts +45 -23
- package/.nuxt/ui/switch.ts +20 -2
- package/.nuxt/ui/table.ts +30 -13
- package/.nuxt/ui/tabs.ts +67 -39
- package/.nuxt/ui/textarea.ts +88 -53
- package/.nuxt/ui/toast.ts +11 -1
- package/.nuxt/ui/toaster.ts +27 -11
- package/.nuxt/ui/tooltip.ts +1 -1
- package/README.md +8 -1
- package/cli/commands/make/component.mjs +12 -0
- package/cli/package.json +2 -2
- package/cli/templates.mjs +17 -12
- package/dist/client/devtools/200.html +1 -1
- package/dist/client/devtools/404.html +1 -1
- package/dist/client/devtools/_nuxt/CQ-XZFu7.js +54 -0
- package/dist/client/devtools/_nuxt/DNZFyo26.js +1 -0
- package/dist/client/devtools/_nuxt/Dtz-o9GB.js +1 -0
- package/dist/client/devtools/_nuxt/builds/latest.json +1 -1
- package/dist/client/devtools/_nuxt/builds/meta/1f5fbd7b-9d97-480e-9ae4-e02b4ff7018b.json +1 -0
- package/dist/client/devtools/_nuxt/entry.qOdop8tq.css +1 -0
- package/dist/client/devtools/_nuxt/error-404.D-rS9BDk.css +1 -0
- package/dist/client/devtools/_nuxt/error-500.CfcCHs91.css +1 -0
- package/dist/client/devtools/index.html +1 -1
- package/dist/module.cjs +1 -1
- package/dist/module.json +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/components/Accordion.vue +2 -1
- package/dist/runtime/components/Alert.vue +3 -2
- package/dist/runtime/components/Avatar.vue +5 -4
- package/dist/runtime/components/AvatarGroup.vue +2 -1
- package/dist/runtime/components/Badge.vue +2 -1
- package/dist/runtime/components/Breadcrumb.vue +1 -1
- package/dist/runtime/components/Button.vue +2 -1
- package/dist/runtime/components/ButtonGroup.vue +2 -1
- package/dist/runtime/components/Calendar.vue +2 -1
- package/dist/runtime/components/Card.vue +1 -1
- package/dist/runtime/components/Carousel.vue +2 -1
- package/dist/runtime/components/Checkbox.vue +2 -1
- package/dist/runtime/components/Chip.vue +3 -2
- package/dist/runtime/components/Collapsible.vue +4 -2
- package/dist/runtime/components/ColorPicker.vue +2 -1
- package/dist/runtime/components/CommandPalette.vue +12 -5
- package/dist/runtime/components/Container.vue +1 -1
- package/dist/runtime/components/ContextMenu.vue +2 -1
- package/dist/runtime/components/ContextMenuContent.vue +3 -3
- package/dist/runtime/components/Drawer.vue +7 -2
- package/dist/runtime/components/DropdownMenu.vue +2 -1
- package/dist/runtime/components/DropdownMenuContent.vue +3 -3
- package/dist/runtime/components/Form.vue +15 -14
- package/dist/runtime/components/FormField.vue +2 -1
- package/dist/runtime/components/Input.vue +3 -2
- package/dist/runtime/components/InputMenu.vue +13 -2
- package/dist/runtime/components/InputNumber.vue +2 -1
- package/dist/runtime/components/Kbd.vue +2 -1
- package/dist/runtime/components/Link.vue +1 -1
- package/dist/runtime/components/Modal.vue +8 -13
- package/dist/runtime/components/NavigationMenu.vue +14 -9
- package/dist/runtime/components/Pagination.vue +1 -1
- package/dist/runtime/components/PinInput.vue +4 -3
- package/dist/runtime/components/Popover.vue +7 -6
- package/dist/runtime/components/Progress.vue +4 -3
- package/dist/runtime/components/RadioGroup.vue +2 -1
- package/dist/runtime/components/Select.vue +3 -2
- package/dist/runtime/components/SelectMenu.vue +20 -4
- package/dist/runtime/components/Separator.vue +2 -1
- package/dist/runtime/components/Skeleton.vue +1 -1
- package/dist/runtime/components/Slideover.vue +8 -12
- package/dist/runtime/components/Slider.vue +2 -1
- package/dist/runtime/components/Stepper.vue +6 -4
- package/dist/runtime/components/Switch.vue +2 -1
- package/dist/runtime/components/Table.vue +2 -1
- package/dist/runtime/components/Tabs.vue +3 -1
- package/dist/runtime/components/Textarea.vue +3 -2
- package/dist/runtime/components/Toast.vue +2 -1
- package/dist/runtime/components/Toaster.vue +2 -1
- package/dist/runtime/components/Tooltip.vue +1 -1
- package/dist/runtime/composables/defineShortcuts.js +1 -1
- package/dist/runtime/composables/useFormField.d.ts +1 -1
- package/dist/runtime/composables/useFormField.js +6 -3
- package/dist/runtime/locale/ar.js +3 -1
- package/dist/runtime/locale/cs.js +3 -1
- package/dist/runtime/locale/da.d.ts +2 -0
- package/dist/runtime/locale/da.js +54 -0
- package/dist/runtime/locale/de.js +3 -1
- package/dist/runtime/locale/el.d.ts +2 -0
- package/dist/runtime/locale/el.js +54 -0
- package/dist/runtime/locale/en.js +3 -1
- package/dist/runtime/locale/es.js +3 -1
- package/dist/runtime/locale/et.d.ts +2 -0
- package/dist/runtime/locale/et.js +54 -0
- package/dist/runtime/locale/fa_ir.js +3 -1
- package/dist/runtime/locale/fi.d.ts +2 -0
- package/dist/runtime/locale/fi.js +54 -0
- package/dist/runtime/locale/fr.js +3 -1
- package/dist/runtime/locale/id.d.ts +2 -0
- package/dist/runtime/locale/id.js +54 -0
- package/dist/runtime/locale/index.d.ts +9 -0
- package/dist/runtime/locale/index.js +9 -0
- package/dist/runtime/locale/it.js +3 -1
- package/dist/runtime/locale/ja.js +3 -1
- package/dist/runtime/locale/ko.js +3 -1
- package/dist/runtime/locale/nl.js +3 -1
- package/dist/runtime/locale/pl.js +3 -1
- package/dist/runtime/locale/pt.js +3 -1
- package/dist/runtime/locale/pt_br.js +3 -1
- package/dist/runtime/locale/ru.js +3 -1
- package/dist/runtime/locale/sk.js +3 -1
- package/dist/runtime/locale/sv.d.ts +2 -0
- package/dist/runtime/locale/sv.js +54 -0
- package/dist/runtime/locale/th.d.ts +2 -0
- package/dist/runtime/locale/th.js +54 -0
- package/dist/runtime/locale/tr.js +3 -1
- package/dist/runtime/locale/uk.d.ts +2 -0
- package/dist/runtime/locale/uk.js +54 -0
- package/dist/runtime/locale/vi.d.ts +2 -0
- package/dist/runtime/locale/vi.js +54 -0
- package/dist/runtime/locale/zh_hans.js +3 -1
- package/dist/runtime/locale/zh_hant.js +11 -9
- package/dist/runtime/types/form.d.ts +2 -2
- package/dist/runtime/types/form.js +2 -2
- package/dist/runtime/types/locale.d.ts +2 -0
- package/dist/runtime/utils/form.d.ts +2 -2
- package/dist/runtime/utils/form.js +3 -3
- package/dist/runtime/utils/tv.d.ts +1 -0
- package/dist/runtime/utils/tv.js +4 -0
- package/dist/runtime/vue/components/Icon.vue +2 -2
- package/dist/runtime/vue/plugins/head.d.ts +1 -1
- package/dist/runtime/vue/plugins/head.js +3 -3
- package/dist/shared/{ui.D_93iuwH.mjs → ui.BKsd22-Q.mjs} +63 -36
- package/dist/shared/{ui.CwmIkD_Y.cjs → ui.DCjJwb6l.cjs} +63 -36
- package/dist/unplugin.cjs +5 -5
- package/dist/unplugin.mjs +5 -5
- package/dist/vite.cjs +1 -1
- package/dist/vite.mjs +1 -1
- package/package.json +49 -44
- package/dist/client/devtools/_nuxt/B1fTd_Rf.js +0 -1
- package/dist/client/devtools/_nuxt/CSUxkedg.js +0 -1
- package/dist/client/devtools/_nuxt/CbRTGpb7.js +0 -1
- package/dist/client/devtools/_nuxt/YQTlxbcT.js +0 -53
- package/dist/client/devtools/_nuxt/builds/meta/b3465abc-0a92-4ee7-ba6b-e5174891fcc0.json +0 -1
- package/dist/client/devtools/_nuxt/entry.DXXceQev.css +0 -1
- package/dist/client/devtools/_nuxt/error-404.BJpkZFyY.css +0 -1
- package/dist/client/devtools/_nuxt/error-500.D3i9VDlt.css +0 -1
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { defineLocale } from "../composables/defineLocale.js";
|
|
2
|
+
export default defineLocale({
|
|
3
|
+
name: "Ti\u1EBFng Vi\u1EC7t",
|
|
4
|
+
code: "vi",
|
|
5
|
+
messages: {
|
|
6
|
+
inputMenu: {
|
|
7
|
+
noMatch: "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3 ph\xF9 h\u1EE3p",
|
|
8
|
+
noData: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u",
|
|
9
|
+
create: 'T\u1EA1o "{label}"'
|
|
10
|
+
},
|
|
11
|
+
calendar: {
|
|
12
|
+
prevYear: "N\u0103m tr\u01B0\u1EDBc",
|
|
13
|
+
nextYear: "N\u0103m sau",
|
|
14
|
+
prevMonth: "Th\xE1ng tr\u01B0\u1EDBc",
|
|
15
|
+
nextMonth: "Th\xE1ng sau"
|
|
16
|
+
},
|
|
17
|
+
inputNumber: {
|
|
18
|
+
increment: "T\u0103ng",
|
|
19
|
+
decrement: "Gi\u1EA3m"
|
|
20
|
+
},
|
|
21
|
+
commandPalette: {
|
|
22
|
+
placeholder: "Nh\u1EADp l\u1EC7nh ho\u1EB7c t\xECm ki\u1EBFm...",
|
|
23
|
+
noMatch: "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3 ph\xF9 h\u1EE3p",
|
|
24
|
+
noData: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u",
|
|
25
|
+
close: "\u0110\xF3ng"
|
|
26
|
+
},
|
|
27
|
+
selectMenu: {
|
|
28
|
+
noMatch: "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3 ph\xF9 h\u1EE3p",
|
|
29
|
+
noData: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u",
|
|
30
|
+
create: 'T\u1EA1o "{label}"',
|
|
31
|
+
search: "T\xECm ki\u1EBFm..."
|
|
32
|
+
},
|
|
33
|
+
toast: {
|
|
34
|
+
close: "\u0110\xF3ng"
|
|
35
|
+
},
|
|
36
|
+
carousel: {
|
|
37
|
+
prev: "Tr\u01B0\u1EDBc",
|
|
38
|
+
next: "Sau",
|
|
39
|
+
goto: "\u0110i t\u1EDBi \xF4 {slide}"
|
|
40
|
+
},
|
|
41
|
+
modal: {
|
|
42
|
+
close: "\u0110\xF3ng"
|
|
43
|
+
},
|
|
44
|
+
slideover: {
|
|
45
|
+
close: "\u0110\xF3ng"
|
|
46
|
+
},
|
|
47
|
+
alert: {
|
|
48
|
+
close: "\u0110\xF3ng"
|
|
49
|
+
},
|
|
50
|
+
table: {
|
|
51
|
+
noData: "Kh\xF4ng c\xF3 d\u1EEF li\u1EC7u"
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
});
|
|
@@ -19,6 +19,7 @@ export default defineLocale({
|
|
|
19
19
|
decrement: "\u51CF\u5C11"
|
|
20
20
|
},
|
|
21
21
|
commandPalette: {
|
|
22
|
+
placeholder: "\u8F93\u5165\u547D\u4EE4\u6216\u641C\u7D22...",
|
|
22
23
|
noMatch: "\u6CA1\u6709\u5339\u914D\u7684\u6570\u636E",
|
|
23
24
|
noData: "\u6CA1\u6709\u6570\u636E",
|
|
24
25
|
close: "\u5173\u95ED"
|
|
@@ -26,7 +27,8 @@ export default defineLocale({
|
|
|
26
27
|
selectMenu: {
|
|
27
28
|
noMatch: "\u6CA1\u6709\u5339\u914D\u7684\u6570\u636E",
|
|
28
29
|
noData: "\u6CA1\u6709\u6570\u636E",
|
|
29
|
-
create: '\u521B\u5EFA "{label}"'
|
|
30
|
+
create: '\u521B\u5EFA "{label}"',
|
|
31
|
+
search: "\u641C\u7D22..."
|
|
30
32
|
},
|
|
31
33
|
toast: {
|
|
32
34
|
close: "\u5173\u95ED"
|
|
@@ -1,32 +1,34 @@
|
|
|
1
1
|
import { defineLocale } from "../composables/defineLocale.js";
|
|
2
2
|
export default defineLocale({
|
|
3
|
-
name: "\u7E41\
|
|
3
|
+
name: "\u7E41\u9AD4\u4E2D\u6587",
|
|
4
4
|
code: "zh-Hant",
|
|
5
5
|
messages: {
|
|
6
6
|
inputMenu: {
|
|
7
|
-
noMatch: "\u6C92\u6709\
|
|
7
|
+
noMatch: "\u6C92\u6709\u76F8\u7B26\u7684\u8CC7\u6599",
|
|
8
8
|
noData: "\u6C92\u6709\u8CC7\u6599",
|
|
9
|
-
create:
|
|
9
|
+
create: "\u5EFA\u7ACB\u300C{label}\u300D"
|
|
10
10
|
},
|
|
11
11
|
calendar: {
|
|
12
12
|
prevYear: "\u53BB\u5E74",
|
|
13
13
|
nextYear: "\u660E\u5E74",
|
|
14
|
-
prevMonth: "\u4E0A\
|
|
15
|
-
nextMonth: "\u4E0B\
|
|
14
|
+
prevMonth: "\u4E0A\u500B\u6708",
|
|
15
|
+
nextMonth: "\u4E0B\u500B\u6708"
|
|
16
16
|
},
|
|
17
17
|
inputNumber: {
|
|
18
18
|
increment: "\u589E\u52A0",
|
|
19
|
-
decrement: "\
|
|
19
|
+
decrement: "\u6E1B\u5C11"
|
|
20
20
|
},
|
|
21
21
|
commandPalette: {
|
|
22
|
-
|
|
22
|
+
placeholder: "\u8F38\u5165\u547D\u4EE4\u6216\u641C\u5C0B...",
|
|
23
|
+
noMatch: "\u6C92\u6709\u76F8\u7B26\u7684\u8CC7\u6599",
|
|
23
24
|
noData: "\u6C92\u6709\u8CC7\u6599",
|
|
24
25
|
close: "\u95DC\u9589"
|
|
25
26
|
},
|
|
26
27
|
selectMenu: {
|
|
27
|
-
noMatch: "\u6C92\u6709\
|
|
28
|
+
noMatch: "\u6C92\u6709\u76F8\u7B26\u7684\u8CC7\u6599",
|
|
28
29
|
noData: "\u6C92\u6709\u8CC7\u6599",
|
|
29
|
-
create:
|
|
30
|
+
create: "\u5EFA\u7ACB\u300C{label}\u300D",
|
|
31
|
+
search: "\u641C\u5C0B..."
|
|
30
32
|
},
|
|
31
33
|
toast: {
|
|
32
34
|
close: "\u95DC\u9589"
|
|
@@ -33,7 +33,7 @@ export type FormSubmitEvent<T> = SubmitEvent & {
|
|
|
33
33
|
};
|
|
34
34
|
export type FormValidationError = {
|
|
35
35
|
errors: FormErrorWithId[];
|
|
36
|
-
|
|
36
|
+
children?: FormValidationError[];
|
|
37
37
|
};
|
|
38
38
|
export type FormErrorEvent = SubmitEvent & FormValidationError;
|
|
39
39
|
export type FormEventType = FormInputEvents;
|
|
@@ -70,6 +70,6 @@ export interface ValidateReturnSchema<T> {
|
|
|
70
70
|
export declare class FormValidationException extends Error {
|
|
71
71
|
formId: string | number;
|
|
72
72
|
errors: FormErrorWithId[];
|
|
73
|
-
|
|
73
|
+
children?: FormValidationException[];
|
|
74
74
|
constructor(formId: string | number, errors: FormErrorWithId[], childErrors: FormValidationException[]);
|
|
75
75
|
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
export class FormValidationException extends Error {
|
|
2
2
|
formId;
|
|
3
3
|
errors;
|
|
4
|
-
|
|
4
|
+
children;
|
|
5
5
|
constructor(formId, errors, childErrors) {
|
|
6
6
|
super("Form validation exception");
|
|
7
7
|
this.formId = formId;
|
|
8
8
|
this.errors = errors;
|
|
9
|
-
this.
|
|
9
|
+
this.children = childErrors;
|
|
10
10
|
Object.setPrototypeOf(this, FormValidationException.prototype);
|
|
11
11
|
}
|
|
12
12
|
}
|
|
@@ -15,6 +15,7 @@ export type Messages = {
|
|
|
15
15
|
decrement: string;
|
|
16
16
|
};
|
|
17
17
|
commandPalette: {
|
|
18
|
+
placeholder: string;
|
|
18
19
|
noMatch: string;
|
|
19
20
|
noData: string;
|
|
20
21
|
close: string;
|
|
@@ -23,6 +24,7 @@ export type Messages = {
|
|
|
23
24
|
noMatch: string;
|
|
24
25
|
noData: string;
|
|
25
26
|
create: string;
|
|
27
|
+
search: string;
|
|
26
28
|
};
|
|
27
29
|
toast: {
|
|
28
30
|
close: string;
|
|
@@ -13,5 +13,5 @@ export declare function isJoiSchema(schema: any): schema is JoiSchema;
|
|
|
13
13
|
export declare function isJoiError(error: any): error is JoiError;
|
|
14
14
|
export declare function isValibotSchema(schema: any): schema is ValibotSchema | ValibotSchemaAsync | ValibotSafeParser<any, any> | ValibotSafeParserAsync<any, any>;
|
|
15
15
|
export declare function isStandardSchema(schema: any): schema is StandardSchemaV1;
|
|
16
|
-
export declare function
|
|
17
|
-
export declare function
|
|
16
|
+
export declare function validateStandardSchema(state: any, schema: StandardSchemaV1): Promise<ValidateReturnSchema<typeof state>>;
|
|
17
|
+
export declare function validateSchema<T extends object>(state: T, schema: FormSchema<T>): Promise<ValidateReturnSchema<typeof state>>;
|
|
@@ -22,7 +22,7 @@ export function isValibotSchema(schema) {
|
|
|
22
22
|
export function isStandardSchema(schema) {
|
|
23
23
|
return "~standard" in schema;
|
|
24
24
|
}
|
|
25
|
-
export async function
|
|
25
|
+
export async function validateStandardSchema(state, schema) {
|
|
26
26
|
const result = await schema["~standard"].validate({
|
|
27
27
|
value: state
|
|
28
28
|
});
|
|
@@ -136,7 +136,7 @@ async function validateValibotSchema(state, schema) {
|
|
|
136
136
|
result: null
|
|
137
137
|
};
|
|
138
138
|
}
|
|
139
|
-
export function
|
|
139
|
+
export function validateSchema(state, schema) {
|
|
140
140
|
if (isZodSchema(schema)) {
|
|
141
141
|
return validateZodSchema(state, schema);
|
|
142
142
|
} else if (isJoiSchema(schema)) {
|
|
@@ -148,7 +148,7 @@ export function parseSchema(state, schema) {
|
|
|
148
148
|
} else if (isSuperStructSchema(schema)) {
|
|
149
149
|
return validateSuperstructSchema(state, schema);
|
|
150
150
|
} else if (isStandardSchema(schema)) {
|
|
151
|
-
return
|
|
151
|
+
return validateStandardSchema(state, schema);
|
|
152
152
|
} else {
|
|
153
153
|
throw new Error("Form validation failed: Unsupported form schema");
|
|
154
154
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const tv: import("tailwind-variants").CreateTV<boolean | (string | number | symbol)[] | {} | undefined>;
|
|
@@ -5,11 +5,11 @@ export interface IconProps {
|
|
|
5
5
|
</script>
|
|
6
6
|
|
|
7
7
|
<script setup lang="ts">
|
|
8
|
-
import { Icon } from '@iconify/vue'
|
|
8
|
+
import { Icon as IconifyIcon } from '@iconify/vue'
|
|
9
9
|
|
|
10
10
|
defineProps<IconProps>()
|
|
11
11
|
</script>
|
|
12
12
|
|
|
13
13
|
<template>
|
|
14
|
-
<
|
|
14
|
+
<IconifyIcon :icon="name.replace(/^i-/, '')" />
|
|
15
15
|
</template>
|
|
@@ -40,7 +40,7 @@ const defaultOptions = {
|
|
|
40
40
|
fonts: true,
|
|
41
41
|
colorMode: true,
|
|
42
42
|
theme: {
|
|
43
|
-
colors:
|
|
43
|
+
colors: undefined,
|
|
44
44
|
transitions: true
|
|
45
45
|
},
|
|
46
46
|
devtools: {
|
|
@@ -247,7 +247,7 @@ const avatarGroup = {
|
|
|
247
247
|
|
|
248
248
|
const badge = (options) => ({
|
|
249
249
|
slots: {
|
|
250
|
-
base: "
|
|
250
|
+
base: "font-medium inline-flex items-center",
|
|
251
251
|
label: "truncate",
|
|
252
252
|
leadingIcon: "shrink-0",
|
|
253
253
|
leadingAvatar: "shrink-0",
|
|
@@ -266,23 +266,35 @@ const badge = (options) => ({
|
|
|
266
266
|
subtle: ""
|
|
267
267
|
},
|
|
268
268
|
size: {
|
|
269
|
+
xs: {
|
|
270
|
+
base: "text-[8px]/3 px-1 py-0.5 gap-1 rounded-[calc(var(--ui-radius))]",
|
|
271
|
+
leadingIcon: "size-3",
|
|
272
|
+
leadingAvatarSize: "3xs",
|
|
273
|
+
trailingIcon: "size-3"
|
|
274
|
+
},
|
|
269
275
|
sm: {
|
|
270
|
-
base: "text-
|
|
271
|
-
leadingIcon: "size-
|
|
276
|
+
base: "text-[10px]/3 px-1.5 py-1 gap-1 rounded-[calc(var(--ui-radius))]",
|
|
277
|
+
leadingIcon: "size-3",
|
|
272
278
|
leadingAvatarSize: "3xs",
|
|
273
|
-
trailingIcon: "size-
|
|
279
|
+
trailingIcon: "size-3"
|
|
274
280
|
},
|
|
275
281
|
md: {
|
|
276
|
-
base: "text-xs px-2 py-1 gap-1",
|
|
282
|
+
base: "text-xs px-2 py-1 gap-1 rounded-[calc(var(--ui-radius)*1.5)]",
|
|
277
283
|
leadingIcon: "size-4",
|
|
278
284
|
leadingAvatarSize: "3xs",
|
|
279
285
|
trailingIcon: "size-4"
|
|
280
286
|
},
|
|
281
287
|
lg: {
|
|
282
|
-
base: "text-sm px-2 py-1 gap-1.5",
|
|
288
|
+
base: "text-sm px-2 py-1 gap-1.5 rounded-[calc(var(--ui-radius)*1.5)]",
|
|
283
289
|
leadingIcon: "size-5",
|
|
284
290
|
leadingAvatarSize: "2xs",
|
|
285
291
|
trailingIcon: "size-5"
|
|
292
|
+
},
|
|
293
|
+
xl: {
|
|
294
|
+
base: "text-base px-2.5 py-1 gap-1.5 rounded-[calc(var(--ui-radius)*1.5)]",
|
|
295
|
+
leadingIcon: "size-6",
|
|
296
|
+
leadingAvatarSize: "2xs",
|
|
297
|
+
trailingIcon: "size-6"
|
|
286
298
|
}
|
|
287
299
|
}
|
|
288
300
|
},
|
|
@@ -671,9 +683,6 @@ const carousel = (options) => ({
|
|
|
671
683
|
dot: "bg-[var(--ui-border-inverted)]"
|
|
672
684
|
}
|
|
673
685
|
}
|
|
674
|
-
},
|
|
675
|
-
defaultVariants: {
|
|
676
|
-
orientation: "horizontal"
|
|
677
686
|
}
|
|
678
687
|
});
|
|
679
688
|
|
|
@@ -906,7 +915,7 @@ const container = {
|
|
|
906
915
|
|
|
907
916
|
const contextMenu = (options) => ({
|
|
908
917
|
slots: {
|
|
909
|
-
content: "min-w-32 bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] overflow-y-auto scroll-py-1 data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
918
|
+
content: "min-w-32 bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] overflow-y-auto scroll-py-1 data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] pointer-events-auto",
|
|
910
919
|
group: "p-1 isolate",
|
|
911
920
|
label: "w-full flex items-center font-semibold text-[var(--ui-text-highlighted)]",
|
|
912
921
|
separator: "-mx-1 my-1 h-px bg-[var(--ui-border)]",
|
|
@@ -1058,7 +1067,7 @@ const drawer = {
|
|
|
1058
1067
|
|
|
1059
1068
|
const dropdownMenu = (options) => ({
|
|
1060
1069
|
slots: {
|
|
1061
|
-
content: "min-w-32 bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] overflow-y-auto scroll-py-1 data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
1070
|
+
content: "min-w-32 bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] overflow-y-auto scroll-py-1 data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] pointer-events-auto",
|
|
1062
1071
|
arrow: "fill-[var(--ui-border)]",
|
|
1063
1072
|
group: "p-1 isolate",
|
|
1064
1073
|
label: "w-full flex items-center font-semibold text-[var(--ui-text-highlighted)]",
|
|
@@ -1362,7 +1371,7 @@ const inputMenu = (options) => {
|
|
|
1362
1371
|
base: () => ["rounded-[calc(var(--ui-radius)*1.5)]", options.theme.transitions && "transition-colors"],
|
|
1363
1372
|
trailing: "group absolute inset-y-0 end-0 flex items-center disabled:cursor-not-allowed disabled:opacity-75",
|
|
1364
1373
|
arrow: "fill-[var(--ui-border)]",
|
|
1365
|
-
content: "max-h-60 w-[var(--reka-popper-anchor-width)] bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] overflow-hidden data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
1374
|
+
content: "max-h-60 w-[var(--reka-popper-anchor-width)] bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] overflow-hidden data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] pointer-events-auto",
|
|
1366
1375
|
viewport: "divide-y divide-[var(--ui-border)] scroll-py-1",
|
|
1367
1376
|
group: "p-1 isolate",
|
|
1368
1377
|
empty: "py-2 text-center text-sm text-[var(--ui-text-muted)]",
|
|
@@ -1647,7 +1656,7 @@ const navigationMenu = (options) => ({
|
|
|
1647
1656
|
linkLeadingAvatar: "shrink-0",
|
|
1648
1657
|
linkLeadingAvatarSize: "2xs",
|
|
1649
1658
|
linkTrailing: "ms-auto inline-flex gap-1.5 items-center",
|
|
1650
|
-
linkTrailingBadge: "shrink-0
|
|
1659
|
+
linkTrailingBadge: "shrink-0",
|
|
1651
1660
|
linkTrailingBadgeSize: "sm",
|
|
1652
1661
|
linkTrailingIcon: "size-5 transform shrink-0 group-data-[state=open]:rotate-180 transition-transform duration-200",
|
|
1653
1662
|
linkLabel: "truncate",
|
|
@@ -1664,7 +1673,7 @@ const navigationMenu = (options) => ({
|
|
|
1664
1673
|
viewportWrapper: "absolute top-full left-0 flex w-full justify-center",
|
|
1665
1674
|
viewport: "relative overflow-hidden bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] h-[var(--reka-navigation-menu-viewport-height)] w-full transition-[width,height] origin-[top_center] data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
1666
1675
|
content: "absolute top-0 left-0 w-full data-[motion=from-start]:animate-[enter-from-left_200ms_ease] data-[motion=from-end]:animate-[enter-from-right_200ms_ease] data-[motion=to-start]:animate-[exit-to-left_200ms_ease] data-[motion=to-end]:animate-[exit-to-right_200ms_ease]",
|
|
1667
|
-
indicator: "data-[state=visible]:animate-[fade-in_100ms_ease-out] data-[state=hidden]:animate-[fade-out_100ms_ease-in] bottom-0 z-[1] flex h-2.5 items-end justify-center overflow-hidden transition-
|
|
1676
|
+
indicator: "absolute data-[state=visible]:animate-[fade-in_100ms_ease-out] data-[state=hidden]:animate-[fade-out_100ms_ease-in] data-[state=hidden]:opacity-0 bottom-0 z-[1] w-[var(--reka-navigation-menu-indicator-size)] translate-x-[var(--reka-navigation-menu-indicator-position)] flex h-2.5 items-end justify-center overflow-hidden transition-[translate,width] duration-200",
|
|
1668
1677
|
arrow: "relative top-[50%] size-2.5 rotate-45 border border-[var(--ui-border)] bg-[var(--ui-bg)] z-[1] rounded-[calc(var(--ui-radius)/2)]"
|
|
1669
1678
|
},
|
|
1670
1679
|
variants: {
|
|
@@ -1688,7 +1697,7 @@ const navigationMenu = (options) => ({
|
|
|
1688
1697
|
},
|
|
1689
1698
|
orientation: {
|
|
1690
1699
|
horizontal: {
|
|
1691
|
-
root: "
|
|
1700
|
+
root: "items-center justify-between",
|
|
1692
1701
|
list: "flex items-center",
|
|
1693
1702
|
item: "py-2",
|
|
1694
1703
|
link: "px-2.5 py-1.5 before:inset-x-px before:inset-y-0",
|
|
@@ -1720,21 +1729,24 @@ const navigationMenu = (options) => ({
|
|
|
1720
1729
|
},
|
|
1721
1730
|
highlight: {
|
|
1722
1731
|
true: ""
|
|
1732
|
+
},
|
|
1733
|
+
level: {
|
|
1734
|
+
true: ""
|
|
1723
1735
|
}
|
|
1724
1736
|
},
|
|
1725
1737
|
compoundVariants: [{
|
|
1726
|
-
highlight: true,
|
|
1727
1738
|
orientation: "horizontal",
|
|
1739
|
+
highlight: true,
|
|
1728
1740
|
class: {
|
|
1729
1741
|
item: "-mb-px",
|
|
1730
|
-
link: "after:absolute after:-bottom-2 after:inset-x-2.5 after:block after:h-px after:rounded-full"
|
|
1742
|
+
link: ["after:absolute after:-bottom-2 after:inset-x-2.5 after:block after:h-px after:rounded-full", options.theme.transitions && "after:transition-colors"]
|
|
1731
1743
|
}
|
|
1732
1744
|
}, {
|
|
1733
|
-
highlight: true,
|
|
1734
1745
|
orientation: "vertical",
|
|
1746
|
+
highlight: true,
|
|
1747
|
+
level: true,
|
|
1735
1748
|
class: {
|
|
1736
|
-
|
|
1737
|
-
link: "after:absolute after:-start-1.5 after:inset-y-0.5 after:block after:w-px after:rounded-full"
|
|
1749
|
+
link: ["after:absolute after:-start-1.5 after:inset-y-0.5 after:block after:w-px after:rounded-full", options.theme.transitions && "after:transition-colors"]
|
|
1738
1750
|
}
|
|
1739
1751
|
}, {
|
|
1740
1752
|
disabled: false,
|
|
@@ -1767,7 +1779,7 @@ const navigationMenu = (options) => ({
|
|
|
1767
1779
|
active: true,
|
|
1768
1780
|
class: {
|
|
1769
1781
|
link: `text-[var(--ui-${color})]`,
|
|
1770
|
-
linkLeadingIcon: `text-[var(--ui-${color})]`
|
|
1782
|
+
linkLeadingIcon: `text-[var(--ui-${color})] group-data-[state=open]:text-[var(--ui-${color})]`
|
|
1771
1783
|
}
|
|
1772
1784
|
})), {
|
|
1773
1785
|
color: "neutral",
|
|
@@ -1775,7 +1787,7 @@ const navigationMenu = (options) => ({
|
|
|
1775
1787
|
active: true,
|
|
1776
1788
|
class: {
|
|
1777
1789
|
link: "text-[var(--ui-text-highlighted)]",
|
|
1778
|
-
linkLeadingIcon: "text-[var(--ui-text-highlighted)]"
|
|
1790
|
+
linkLeadingIcon: "text-[var(--ui-text-highlighted)] group-data-[state=open]:text-[var(--ui-text-highlighted)]"
|
|
1779
1791
|
}
|
|
1780
1792
|
}, {
|
|
1781
1793
|
variant: "pill",
|
|
@@ -1805,7 +1817,7 @@ const navigationMenu = (options) => ({
|
|
|
1805
1817
|
active: true,
|
|
1806
1818
|
class: {
|
|
1807
1819
|
link: `text-[var(--ui-${color})]`,
|
|
1808
|
-
linkLeadingIcon: `text-[var(--ui-${color})]`
|
|
1820
|
+
linkLeadingIcon: `text-[var(--ui-${color})] group-data-[state=open]:text-[var(--ui-${color})]`
|
|
1809
1821
|
}
|
|
1810
1822
|
})), {
|
|
1811
1823
|
color: "neutral",
|
|
@@ -1813,11 +1825,12 @@ const navigationMenu = (options) => ({
|
|
|
1813
1825
|
active: true,
|
|
1814
1826
|
class: {
|
|
1815
1827
|
link: "text-[var(--ui-text-highlighted)]",
|
|
1816
|
-
linkLeadingIcon: "text-[var(--ui-text-highlighted)]"
|
|
1828
|
+
linkLeadingIcon: "text-[var(--ui-text-highlighted)] group-data-[state=open]:text-[var(--ui-text-highlighted)]"
|
|
1817
1829
|
}
|
|
1818
1830
|
}, ...(options.theme.colors || []).map((highlightColor) => ({
|
|
1819
1831
|
highlightColor,
|
|
1820
1832
|
highlight: true,
|
|
1833
|
+
level: true,
|
|
1821
1834
|
active: true,
|
|
1822
1835
|
class: {
|
|
1823
1836
|
link: `after:bg-[var(--ui-${highlightColor})]`
|
|
@@ -1825,6 +1838,7 @@ const navigationMenu = (options) => ({
|
|
|
1825
1838
|
})), {
|
|
1826
1839
|
highlightColor: "neutral",
|
|
1827
1840
|
highlight: true,
|
|
1841
|
+
level: true,
|
|
1828
1842
|
active: true,
|
|
1829
1843
|
class: {
|
|
1830
1844
|
link: "after:bg-[var(--ui-bg-inverted)]"
|
|
@@ -1910,7 +1924,7 @@ const pinInput = (options) => ({
|
|
|
1910
1924
|
|
|
1911
1925
|
const popover = {
|
|
1912
1926
|
slots: {
|
|
1913
|
-
content: "bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] focus:outline-none",
|
|
1927
|
+
content: "bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] focus:outline-none pointer-events-auto",
|
|
1914
1928
|
arrow: "fill-[var(--ui-border)]"
|
|
1915
1929
|
}
|
|
1916
1930
|
};
|
|
@@ -2225,12 +2239,12 @@ const radioGroup = (options) => ({
|
|
|
2225
2239
|
const select = (options) => {
|
|
2226
2240
|
return defuFn({
|
|
2227
2241
|
slots: {
|
|
2228
|
-
root: () =>
|
|
2242
|
+
root: () => undefined,
|
|
2229
2243
|
base: () => ["relative group rounded-[calc(var(--ui-radius)*1.5)] inline-flex items-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-75", options.theme.transitions && "transition-colors"],
|
|
2230
2244
|
value: "truncate pointer-events-none",
|
|
2231
2245
|
placeholder: "truncate text-[var(--ui-text-dimmed)]",
|
|
2232
2246
|
arrow: "fill-[var(--ui-border)]",
|
|
2233
|
-
content: "max-h-60 w-[var(--reka-popper-anchor-width)] bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] overflow-hidden data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
2247
|
+
content: "max-h-60 w-[var(--reka-popper-anchor-width)] bg-[var(--ui-bg)] shadow-lg rounded-[calc(var(--ui-radius)*1.5)] ring ring-[var(--ui-border)] overflow-hidden data-[state=open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] pointer-events-auto",
|
|
2234
2248
|
viewport: "divide-y divide-[var(--ui-border)] scroll-py-1",
|
|
2235
2249
|
group: "p-1 isolate",
|
|
2236
2250
|
empty: "py-2 text-center text-sm text-[var(--ui-text-muted)]",
|
|
@@ -2701,7 +2715,6 @@ const stepper = (options) => ({
|
|
|
2701
2715
|
class: { separator: "top-[62px]", item: "gap-3.5" }
|
|
2702
2716
|
}],
|
|
2703
2717
|
defaultVariants: {
|
|
2704
|
-
orientation: "horizontal",
|
|
2705
2718
|
size: "md",
|
|
2706
2719
|
color: "primary"
|
|
2707
2720
|
}
|
|
@@ -3114,7 +3127,7 @@ const toaster = {
|
|
|
3114
3127
|
|
|
3115
3128
|
const tooltip = {
|
|
3116
3129
|
slots: {
|
|
3117
|
-
content: "flex items-center gap-1 bg-[var(--ui-bg)] text-[var(--ui-text-highlighted)] shadow-sm rounded-[var(--ui-radius)] ring ring-[var(--ui-border)] h-6 px-2 py-1 text-xs select-none data-[state=delayed-open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in]",
|
|
3130
|
+
content: "flex items-center gap-1 bg-[var(--ui-bg)] text-[var(--ui-text-highlighted)] shadow-sm rounded-[var(--ui-radius)] ring ring-[var(--ui-border)] h-6 px-2 py-1 text-xs select-none data-[state=delayed-open]:animate-[scale-in_100ms_ease-out] data-[state=closed]:animate-[scale-out_100ms_ease-in] pointer-events-auto",
|
|
3118
3131
|
arrow: "fill-[var(--ui-border)]",
|
|
3119
3132
|
text: "truncate",
|
|
3120
3133
|
kbds: `hidden lg:inline-flex items-center shrink-0 gap-0.5 before:content-['\xB7'] before:me-0.5`,
|
|
@@ -3189,16 +3202,28 @@ function getTemplates(options, uiConfig) {
|
|
|
3189
3202
|
getContents: async () => {
|
|
3190
3203
|
const template = theme[component];
|
|
3191
3204
|
const result = typeof template === "function" ? template(options) : template;
|
|
3192
|
-
const variants = Object.
|
|
3205
|
+
const variants = Object.entries(result.variants || {}).filter(([_, values]) => {
|
|
3206
|
+
const keys = Object.keys(values);
|
|
3207
|
+
return keys.some((key) => key !== "true" && key !== "false");
|
|
3208
|
+
}).map(([key]) => key);
|
|
3193
3209
|
let json = JSON.stringify(result, null, 2);
|
|
3194
3210
|
for (const variant of variants) {
|
|
3195
|
-
json = json.replace(new RegExp(`("${variant}": "[^"]+")`, "g"),
|
|
3211
|
+
json = json.replace(new RegExp(`("${variant}": "[^"]+")`, "g"), `$1 as typeof ${variant}[number]`);
|
|
3196
3212
|
json = json.replace(new RegExp(`("${variant}": \\[\\s*)((?:"[^"]+",?\\s*)+)(\\])`, "g"), (_, before, match, after) => {
|
|
3197
|
-
const replaced = match.replace(/("[^"]+")/g,
|
|
3213
|
+
const replaced = match.replace(/("[^"]+")/g, `$1 as typeof ${variant}[number]`);
|
|
3198
3214
|
return `${before}${replaced}${after}`;
|
|
3199
3215
|
});
|
|
3200
3216
|
}
|
|
3201
|
-
|
|
3217
|
+
function generateVariantDeclarations(variants2) {
|
|
3218
|
+
return variants2.map((variant) => {
|
|
3219
|
+
const keys = Object.keys(result.variants[variant]);
|
|
3220
|
+
return `const ${variant} = ${JSON.stringify(keys, null, 2)} as const`;
|
|
3221
|
+
});
|
|
3222
|
+
}
|
|
3223
|
+
return [
|
|
3224
|
+
...generateVariantDeclarations(variants),
|
|
3225
|
+
`export default ${json}`
|
|
3226
|
+
].join("\n\n");
|
|
3202
3227
|
}
|
|
3203
3228
|
});
|
|
3204
3229
|
}
|
|
@@ -3211,12 +3236,13 @@ function getTemplates(options, uiConfig) {
|
|
|
3211
3236
|
filename: "types/ui.d.ts",
|
|
3212
3237
|
getContents: () => `import * as ui from '#build/ui'
|
|
3213
3238
|
import type { DeepPartial } from '#ui/types/utils'
|
|
3239
|
+
import type { defaultConfig } from 'tailwind-variants'
|
|
3214
3240
|
import colors from 'tailwindcss/colors'
|
|
3215
3241
|
|
|
3216
3242
|
const icons = ${JSON.stringify(uiConfig.icons)};
|
|
3217
3243
|
|
|
3218
|
-
type NeutralColor = 'slate' | 'gray' | 'zinc' | 'neutral' | 'stone'
|
|
3219
|
-
type Color = Exclude<keyof typeof colors, 'inherit' | 'current' | 'transparent' | 'black' | 'white' | NeutralColor>
|
|
3244
|
+
type NeutralColor = 'slate' | 'gray' | 'zinc' | 'neutral' | 'stone' | (string & {})
|
|
3245
|
+
type Color = Exclude<keyof typeof colors, 'inherit' | 'current' | 'transparent' | 'black' | 'white' | NeutralColor> | (string & {})
|
|
3220
3246
|
|
|
3221
3247
|
type AppConfigUI = {
|
|
3222
3248
|
colors?: {
|
|
@@ -3224,6 +3250,7 @@ type AppConfigUI = {
|
|
|
3224
3250
|
neutral?: NeutralColor
|
|
3225
3251
|
}
|
|
3226
3252
|
icons?: Partial<typeof icons>
|
|
3253
|
+
tv?: typeof defaultConfig
|
|
3227
3254
|
} & DeepPartial<typeof ui>
|
|
3228
3255
|
|
|
3229
3256
|
declare module '@nuxt/schema' {
|