@shwfed/nuxt 0.8.2 → 0.9.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.
@@ -1,175 +1,327 @@
1
1
  import { Effect } from 'effect';
2
- import z from 'zod';
3
- import { FieldC } from './schema.js';
4
- export { CalendarFieldC, FieldC, NumberFieldC, SelectFieldC, StringFieldC, ValidationRuleC, validationC, } from './schema.js';
5
- export type { Field, ValidationRule } from './schema.js';
2
+ export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, StringFieldC, ValidationRuleC, validationC, } from './schema.js';
3
+ export type { Field, FieldsConfig, ValidationRule } from './schema.js';
6
4
  declare const _default: typeof __VLS_export;
7
5
  export default _default;
8
6
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
9
- orientation?: "horizontal" | "vertical" | "floating";
10
- fields: Effect.Effect<ReadonlyArray<z.infer<typeof FieldC>>>;
7
+ config: Effect.Effect<Readonly<{
8
+ orientation: "vertical" | "horizontal" | "floating";
9
+ fields: readonly ({
10
+ type: "string";
11
+ path: string;
12
+ title: readonly {
13
+ locale: "zh" | "ja" | "en" | "ko";
14
+ message: string;
15
+ }[];
16
+ icon?: string | undefined;
17
+ style?: string | undefined;
18
+ discardEmptyString?: boolean | undefined;
19
+ maxLength?: string | undefined;
20
+ hidden?: string | undefined;
21
+ disabled?: string | undefined;
22
+ validation?: readonly Readonly<{
23
+ expression: string;
24
+ message: string;
25
+ }>[] | undefined;
26
+ } | {
27
+ type: "number";
28
+ path: string;
29
+ title: readonly {
30
+ locale: "zh" | "ja" | "en" | "ko";
31
+ message: string;
32
+ }[];
33
+ icon?: string | undefined;
34
+ style?: string | undefined;
35
+ min?: string | undefined;
36
+ max?: string | undefined;
37
+ step?: string | undefined;
38
+ hidden?: string | undefined;
39
+ disabled?: string | undefined;
40
+ validation?: readonly Readonly<{
41
+ expression: string;
42
+ message: string;
43
+ }>[] | undefined;
44
+ } | {
45
+ type: "select";
46
+ path: string;
47
+ title: readonly {
48
+ locale: "zh" | "ja" | "en" | "ko";
49
+ message: string;
50
+ }[];
51
+ options: string;
52
+ label: string;
53
+ value: string;
54
+ key: string;
55
+ icon?: string | undefined;
56
+ style?: string | undefined;
57
+ hidden?: string | undefined;
58
+ disabled?: string | undefined;
59
+ validation?: readonly Readonly<{
60
+ expression: string;
61
+ message: string;
62
+ }>[] | undefined;
63
+ } | {
64
+ type: "calendar";
65
+ path: string;
66
+ title: readonly {
67
+ locale: "zh" | "ja" | "en" | "ko";
68
+ message: string;
69
+ }[];
70
+ mode: "date" | "month" | "year";
71
+ value: string;
72
+ icon?: string | undefined;
73
+ style?: string | undefined;
74
+ display?: string | undefined;
75
+ disableDate?: string | undefined;
76
+ hidden?: string | undefined;
77
+ disabled?: string | undefined;
78
+ validation?: readonly Readonly<{
79
+ expression: string;
80
+ message: string;
81
+ }>[] | undefined;
82
+ })[];
83
+ }>>;
11
84
  } & {
12
85
  modelValue?: Record<string, unknown>;
13
86
  }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
14
87
  "update:modelValue": (value: Record<string, unknown>) => any;
15
- "update:fields": (args_0: readonly ({
16
- type: "string";
17
- path: string;
18
- title: readonly {
19
- locale: "zh" | "ja" | "en" | "ko";
20
- message: string;
21
- }[];
22
- icon?: string | undefined;
23
- style?: string | undefined;
24
- discardEmptyString?: boolean | undefined;
25
- maxLength?: string | undefined;
26
- hidden?: string | undefined;
27
- disabled?: string | undefined;
28
- validation?: readonly Readonly<{
29
- expression: string;
30
- message: string;
31
- }>[] | undefined;
32
- } | {
33
- type: "number";
34
- path: string;
35
- title: readonly {
36
- locale: "zh" | "ja" | "en" | "ko";
37
- message: string;
38
- }[];
39
- icon?: string | undefined;
40
- style?: string | undefined;
41
- min?: string | undefined;
42
- max?: string | undefined;
43
- step?: string | undefined;
44
- hidden?: string | undefined;
45
- disabled?: string | undefined;
46
- validation?: readonly Readonly<{
47
- expression: string;
48
- message: string;
49
- }>[] | undefined;
50
- } | {
51
- type: "select";
52
- path: string;
53
- title: readonly {
54
- locale: "zh" | "ja" | "en" | "ko";
55
- message: string;
56
- }[];
57
- options: string;
58
- label: string;
59
- value: string;
60
- key: string;
61
- icon?: string | undefined;
62
- style?: string | undefined;
63
- hidden?: string | undefined;
64
- disabled?: string | undefined;
65
- validation?: readonly Readonly<{
66
- expression: string;
67
- message: string;
68
- }>[] | undefined;
69
- } | {
70
- type: "calendar";
71
- path: string;
72
- title: readonly {
73
- locale: "zh" | "ja" | "en" | "ko";
74
- message: string;
75
- }[];
76
- mode: "date" | "month" | "year";
77
- value: string;
78
- icon?: string | undefined;
79
- style?: string | undefined;
80
- display?: string | undefined;
81
- disableDate?: string | undefined;
82
- hidden?: string | undefined;
83
- disabled?: string | undefined;
84
- validation?: readonly Readonly<{
85
- expression: string;
86
- message: string;
87
- }>[] | undefined;
88
- })[]) => any;
88
+ "update:config": (args_0: Readonly<{
89
+ orientation: "vertical" | "horizontal" | "floating";
90
+ fields: readonly ({
91
+ type: "string";
92
+ path: string;
93
+ title: readonly {
94
+ locale: "zh" | "ja" | "en" | "ko";
95
+ message: string;
96
+ }[];
97
+ icon?: string | undefined;
98
+ style?: string | undefined;
99
+ discardEmptyString?: boolean | undefined;
100
+ maxLength?: string | undefined;
101
+ hidden?: string | undefined;
102
+ disabled?: string | undefined;
103
+ validation?: readonly Readonly<{
104
+ expression: string;
105
+ message: string;
106
+ }>[] | undefined;
107
+ } | {
108
+ type: "number";
109
+ path: string;
110
+ title: readonly {
111
+ locale: "zh" | "ja" | "en" | "ko";
112
+ message: string;
113
+ }[];
114
+ icon?: string | undefined;
115
+ style?: string | undefined;
116
+ min?: string | undefined;
117
+ max?: string | undefined;
118
+ step?: string | undefined;
119
+ hidden?: string | undefined;
120
+ disabled?: string | undefined;
121
+ validation?: readonly Readonly<{
122
+ expression: string;
123
+ message: string;
124
+ }>[] | undefined;
125
+ } | {
126
+ type: "select";
127
+ path: string;
128
+ title: readonly {
129
+ locale: "zh" | "ja" | "en" | "ko";
130
+ message: string;
131
+ }[];
132
+ options: string;
133
+ label: string;
134
+ value: string;
135
+ key: string;
136
+ icon?: string | undefined;
137
+ style?: string | undefined;
138
+ hidden?: string | undefined;
139
+ disabled?: string | undefined;
140
+ validation?: readonly Readonly<{
141
+ expression: string;
142
+ message: string;
143
+ }>[] | undefined;
144
+ } | {
145
+ type: "calendar";
146
+ path: string;
147
+ title: readonly {
148
+ locale: "zh" | "ja" | "en" | "ko";
149
+ message: string;
150
+ }[];
151
+ mode: "date" | "month" | "year";
152
+ value: string;
153
+ icon?: string | undefined;
154
+ style?: string | undefined;
155
+ display?: string | undefined;
156
+ disableDate?: string | undefined;
157
+ hidden?: string | undefined;
158
+ disabled?: string | undefined;
159
+ validation?: readonly Readonly<{
160
+ expression: string;
161
+ message: string;
162
+ }>[] | undefined;
163
+ })[];
164
+ }>) => any;
89
165
  }, string, import("vue").PublicProps, Readonly<{
90
- orientation?: "horizontal" | "vertical" | "floating";
91
- fields: Effect.Effect<ReadonlyArray<z.infer<typeof FieldC>>>;
166
+ config: Effect.Effect<Readonly<{
167
+ orientation: "vertical" | "horizontal" | "floating";
168
+ fields: readonly ({
169
+ type: "string";
170
+ path: string;
171
+ title: readonly {
172
+ locale: "zh" | "ja" | "en" | "ko";
173
+ message: string;
174
+ }[];
175
+ icon?: string | undefined;
176
+ style?: string | undefined;
177
+ discardEmptyString?: boolean | undefined;
178
+ maxLength?: string | undefined;
179
+ hidden?: string | undefined;
180
+ disabled?: string | undefined;
181
+ validation?: readonly Readonly<{
182
+ expression: string;
183
+ message: string;
184
+ }>[] | undefined;
185
+ } | {
186
+ type: "number";
187
+ path: string;
188
+ title: readonly {
189
+ locale: "zh" | "ja" | "en" | "ko";
190
+ message: string;
191
+ }[];
192
+ icon?: string | undefined;
193
+ style?: string | undefined;
194
+ min?: string | undefined;
195
+ max?: string | undefined;
196
+ step?: string | undefined;
197
+ hidden?: string | undefined;
198
+ disabled?: string | undefined;
199
+ validation?: readonly Readonly<{
200
+ expression: string;
201
+ message: string;
202
+ }>[] | undefined;
203
+ } | {
204
+ type: "select";
205
+ path: string;
206
+ title: readonly {
207
+ locale: "zh" | "ja" | "en" | "ko";
208
+ message: string;
209
+ }[];
210
+ options: string;
211
+ label: string;
212
+ value: string;
213
+ key: string;
214
+ icon?: string | undefined;
215
+ style?: string | undefined;
216
+ hidden?: string | undefined;
217
+ disabled?: string | undefined;
218
+ validation?: readonly Readonly<{
219
+ expression: string;
220
+ message: string;
221
+ }>[] | undefined;
222
+ } | {
223
+ type: "calendar";
224
+ path: string;
225
+ title: readonly {
226
+ locale: "zh" | "ja" | "en" | "ko";
227
+ message: string;
228
+ }[];
229
+ mode: "date" | "month" | "year";
230
+ value: string;
231
+ icon?: string | undefined;
232
+ style?: string | undefined;
233
+ display?: string | undefined;
234
+ disableDate?: string | undefined;
235
+ hidden?: string | undefined;
236
+ disabled?: string | undefined;
237
+ validation?: readonly Readonly<{
238
+ expression: string;
239
+ message: string;
240
+ }>[] | undefined;
241
+ })[];
242
+ }>>;
92
243
  } & {
93
244
  modelValue?: Record<string, unknown>;
94
245
  }> & Readonly<{
95
246
  "onUpdate:modelValue"?: ((value: Record<string, unknown>) => any) | undefined;
96
- "onUpdate:fields"?: ((args_0: readonly ({
97
- type: "string";
98
- path: string;
99
- title: readonly {
100
- locale: "zh" | "ja" | "en" | "ko";
101
- message: string;
102
- }[];
103
- icon?: string | undefined;
104
- style?: string | undefined;
105
- discardEmptyString?: boolean | undefined;
106
- maxLength?: string | undefined;
107
- hidden?: string | undefined;
108
- disabled?: string | undefined;
109
- validation?: readonly Readonly<{
110
- expression: string;
111
- message: string;
112
- }>[] | undefined;
113
- } | {
114
- type: "number";
115
- path: string;
116
- title: readonly {
117
- locale: "zh" | "ja" | "en" | "ko";
118
- message: string;
119
- }[];
120
- icon?: string | undefined;
121
- style?: string | undefined;
122
- min?: string | undefined;
123
- max?: string | undefined;
124
- step?: string | undefined;
125
- hidden?: string | undefined;
126
- disabled?: string | undefined;
127
- validation?: readonly Readonly<{
128
- expression: string;
129
- message: string;
130
- }>[] | undefined;
131
- } | {
132
- type: "select";
133
- path: string;
134
- title: readonly {
135
- locale: "zh" | "ja" | "en" | "ko";
136
- message: string;
137
- }[];
138
- options: string;
139
- label: string;
140
- value: string;
141
- key: string;
142
- icon?: string | undefined;
143
- style?: string | undefined;
144
- hidden?: string | undefined;
145
- disabled?: string | undefined;
146
- validation?: readonly Readonly<{
147
- expression: string;
148
- message: string;
149
- }>[] | undefined;
150
- } | {
151
- type: "calendar";
152
- path: string;
153
- title: readonly {
154
- locale: "zh" | "ja" | "en" | "ko";
155
- message: string;
156
- }[];
157
- mode: "date" | "month" | "year";
158
- value: string;
159
- icon?: string | undefined;
160
- style?: string | undefined;
161
- display?: string | undefined;
162
- disableDate?: string | undefined;
163
- hidden?: string | undefined;
164
- disabled?: string | undefined;
165
- validation?: readonly Readonly<{
166
- expression: string;
167
- message: string;
168
- }>[] | undefined;
169
- })[]) => any) | undefined;
170
- }>, {
171
- orientation: "horizontal" | "vertical" | "floating";
172
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
247
+ "onUpdate:config"?: ((args_0: Readonly<{
248
+ orientation: "vertical" | "horizontal" | "floating";
249
+ fields: readonly ({
250
+ type: "string";
251
+ path: string;
252
+ title: readonly {
253
+ locale: "zh" | "ja" | "en" | "ko";
254
+ message: string;
255
+ }[];
256
+ icon?: string | undefined;
257
+ style?: string | undefined;
258
+ discardEmptyString?: boolean | undefined;
259
+ maxLength?: string | undefined;
260
+ hidden?: string | undefined;
261
+ disabled?: string | undefined;
262
+ validation?: readonly Readonly<{
263
+ expression: string;
264
+ message: string;
265
+ }>[] | undefined;
266
+ } | {
267
+ type: "number";
268
+ path: string;
269
+ title: readonly {
270
+ locale: "zh" | "ja" | "en" | "ko";
271
+ message: string;
272
+ }[];
273
+ icon?: string | undefined;
274
+ style?: string | undefined;
275
+ min?: string | undefined;
276
+ max?: string | undefined;
277
+ step?: string | undefined;
278
+ hidden?: string | undefined;
279
+ disabled?: string | undefined;
280
+ validation?: readonly Readonly<{
281
+ expression: string;
282
+ message: string;
283
+ }>[] | undefined;
284
+ } | {
285
+ type: "select";
286
+ path: string;
287
+ title: readonly {
288
+ locale: "zh" | "ja" | "en" | "ko";
289
+ message: string;
290
+ }[];
291
+ options: string;
292
+ label: string;
293
+ value: string;
294
+ key: string;
295
+ icon?: string | undefined;
296
+ style?: string | undefined;
297
+ hidden?: string | undefined;
298
+ disabled?: string | undefined;
299
+ validation?: readonly Readonly<{
300
+ expression: string;
301
+ message: string;
302
+ }>[] | undefined;
303
+ } | {
304
+ type: "calendar";
305
+ path: string;
306
+ title: readonly {
307
+ locale: "zh" | "ja" | "en" | "ko";
308
+ message: string;
309
+ }[];
310
+ mode: "date" | "month" | "year";
311
+ value: string;
312
+ icon?: string | undefined;
313
+ style?: string | undefined;
314
+ display?: string | undefined;
315
+ disableDate?: string | undefined;
316
+ hidden?: string | undefined;
317
+ disabled?: string | undefined;
318
+ validation?: readonly Readonly<{
319
+ expression: string;
320
+ message: string;
321
+ }>[] | undefined;
322
+ })[];
323
+ }>) => any) | undefined;
324
+ }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
173
325
  default?: (props: {}) => any;
174
326
  }>;
175
327
  type __VLS_WithSlots<T, S> = T & {
@@ -9,7 +9,6 @@ import { format, parse } from "date-fns";
9
9
  import { deleteProperty, getProperty, hasProperty, setProperty } from "dot-prop";
10
10
  import { ref, toRaw, useId, watch, watchEffect } from "vue";
11
11
  import { useI18n } from "vue-i18n";
12
- import z from "zod";
13
12
  import { useCheating } from "#imports";
14
13
  import { Calendar } from "../calendar";
15
14
  import { Button } from "../button";
@@ -21,14 +20,17 @@ import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from "../popov
21
20
  import { Skeleton } from "../skeleton";
22
21
  import { Tooltip, TooltipContent, TooltipTrigger } from "../tooltip";
23
22
  import { getLocalizedText } from "../../../utils/coders";
24
- import { FieldC } from "./schema";
23
+ import { FieldsConfigC } from "./schema";
25
24
  const id = useId();
25
+ const defaultConfig = {
26
+ orientation: "horizontal",
27
+ fields: []
28
+ };
26
29
  const props = defineProps({
27
- orientation: { type: String, required: false, default: "horizontal" },
28
- fields: { type: null, required: true }
30
+ config: { type: null, required: true }
29
31
  });
30
- const emit = defineEmits(["update:fields"]);
31
- const fields = computedAsync(async () => z.array(FieldC).readonly().parse(await props.fields.pipe(Effect.runPromise)));
32
+ const emit = defineEmits(["update:config"]);
33
+ const config = computedAsync(async () => FieldsConfigC.parse(await props.config.pipe(Effect.runPromise)));
32
34
  const { t, locale } = useI18n();
33
35
  const { $dsl, $md } = useNuxtApp();
34
36
  const modelValue = defineModel("modelValue", { type: Object, ...{
@@ -36,7 +38,7 @@ const modelValue = defineModel("modelValue", { type: Object, ...{
36
38
  } });
37
39
  const isCheating = useCheating();
38
40
  const isConfiguratorOpen = ref(false);
39
- const displayFields = ref([]);
41
+ const displayConfig = ref(defaultConfig);
40
42
  const validationErrors = ref({});
41
43
  const calendarOpen = ref({});
42
44
  function toCalendarDateValue(value, valueFormat) {
@@ -117,16 +119,25 @@ function handleCalendarBlur(field) {
117
119
  }
118
120
  }, 0);
119
121
  }
120
- function handleConfiguratorConfirm(nextFields) {
121
- displayFields.value = nextFields.slice();
122
- emit("update:fields", nextFields);
122
+ function handleConfiguratorConfirm(nextConfig) {
123
+ displayConfig.value = {
124
+ orientation: nextConfig.orientation,
125
+ fields: nextConfig.fields.slice()
126
+ };
127
+ emit("update:config", nextConfig);
123
128
  }
124
- watch(fields, (value) => {
125
- displayFields.value = (value ?? []).slice();
129
+ watch(config, (value) => {
130
+ if (!value) {
131
+ return;
132
+ }
133
+ displayConfig.value = {
134
+ orientation: value.orientation,
135
+ fields: value.fields.slice()
136
+ };
126
137
  }, { immediate: true });
127
138
  watchEffect(() => {
128
139
  const activePaths = /* @__PURE__ */ new Set();
129
- for (const field of displayFields.value) {
140
+ for (const field of displayConfig.value.fields) {
130
141
  if (!isFieldHidden(field) && !isFieldDisabled(field)) {
131
142
  activePaths.add(field.path);
132
143
  }
@@ -148,6 +159,7 @@ watchEffect(() => {
148
159
  export {
149
160
  CalendarFieldC,
150
161
  FieldC,
162
+ FieldsConfigC,
151
163
  NumberFieldC,
152
164
  SelectFieldC,
153
165
  StringFieldC,
@@ -176,26 +188,26 @@ export {
176
188
  </Button>
177
189
 
178
190
  <FieldsConfiguratorDialog
179
- v-if="fields"
191
+ v-if="config"
180
192
  v-model:open="isConfiguratorOpen"
181
- :fields="displayFields"
193
+ :config="displayConfig"
182
194
  @confirm="handleConfiguratorConfirm"
183
195
  />
184
196
 
185
197
  <Skeleton
186
- v-if="fields === void 0"
198
+ v-if="config === void 0"
187
199
  class="absolute inset-0 z-10 w-full h-full"
188
200
  />
189
201
 
190
202
  <template
191
- v-for="field in displayFields"
203
+ v-for="field in displayConfig.fields"
192
204
  :key="field.path"
193
205
  >
194
206
  <Field
195
207
  v-if="!isFieldHidden(field)"
196
208
  :data-disabled="isFieldDisabled(field) ? 'true' : void 0"
197
209
  :data-invalid="isFieldInvalid(field) ? 'true' : void 0"
198
- :orientation="orientation"
210
+ :orientation="displayConfig.orientation"
199
211
  :style="field.style ? $dsl.evaluate`${field.style}`() : {}"
200
212
  >
201
213
  <FieldLabel :for="['string', 'number'].includes(field.type) ? `${id}:${field.path}` : void 0">
@@ -229,7 +241,7 @@ export {
229
241
  <InputGroupAddon
230
242
  v-if="hasProperty(modelValue, field.path)"
231
243
  align="inline-end"
232
- :class="orientation === 'floating' ? 'group-data-[disabled=true]/input-group:hidden' : void 0"
244
+ :class="displayConfig.orientation === 'floating' ? 'group-data-[disabled=true]/input-group:hidden' : void 0"
233
245
  >
234
246
  <Tooltip :delay-duration="800">
235
247
  <TooltipTrigger>
@@ -334,7 +346,7 @@ export {
334
346
  <InputGroupAddon
335
347
  v-if="hasProperty(modelValue, field.path)"
336
348
  align="inline-end"
337
- :class="orientation === 'floating' ? 'group-data-[disabled=true]/input-group:hidden' : void 0"
349
+ :class="displayConfig.orientation === 'floating' ? 'group-data-[disabled=true]/input-group:hidden' : void 0"
338
350
  >
339
351
  <Tooltip :delay-duration="800">
340
352
  <TooltipTrigger>