@shwfed/nuxt 0.9.1 → 0.10.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.
Files changed (15) hide show
  1. package/dist/module.json +1 -1
  2. package/dist/runtime/components/fields.d.vue.ts +23 -3
  3. package/dist/runtime/components/fields.vue +1 -0
  4. package/dist/runtime/components/fields.vue.d.ts +23 -3
  5. package/dist/runtime/components/ui/field/FieldError.vue +1 -1
  6. package/dist/runtime/components/ui/field/index.js +1 -1
  7. package/dist/runtime/components/ui/fields/Fields.d.vue.ts +43 -2
  8. package/dist/runtime/components/ui/fields/Fields.vue +51 -11
  9. package/dist/runtime/components/ui/fields/Fields.vue.d.ts +43 -2
  10. package/dist/runtime/components/ui/fields/schema.d.ts +30 -2
  11. package/dist/runtime/components/ui/fields/schema.js +16 -1
  12. package/dist/runtime/components/ui/fields-configurator/FieldsConfiguratorDialog.d.vue.ts +18 -0
  13. package/dist/runtime/components/ui/fields-configurator/FieldsConfiguratorDialog.vue +667 -151
  14. package/dist/runtime/components/ui/fields-configurator/FieldsConfiguratorDialog.vue.d.ts +18 -0
  15. package/package.json +1 -1
package/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@shwfed/nuxt",
3
3
  "configKey": "shwfed",
4
- "version": "0.9.1",
4
+ "version": "0.10.0",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "1.0.2",
7
7
  "unbuild": "3.6.1"
package/dist/runtime/components/fields.d.vue.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { Effect } from 'effect';
2
2
  import type { FieldsConfig } from './ui/fields/Fields.vue.js';
3
- export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, StringFieldC, } from './ui/fields/Fields.vue.js';
4
- export type { Field, FieldsConfig } from './ui/fields/Fields.vue.js';
3
+ export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, SlotFieldC, StringFieldC, } from './ui/fields/Fields.vue.js';
4
+ export type { Field, FieldsConfig, SlotField } from './ui/fields/Fields.vue.js';
5
5
  declare const _default: typeof __VLS_export;
6
6
  export default _default;
7
7
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
@@ -12,6 +12,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
12
12
  "update:modelValue": (value: Record<string, unknown>) => any;
13
13
  "update:config": (args_0: Readonly<{
14
14
  fields: readonly ({
15
+ id: string;
15
16
  type: "string";
16
17
  path: string;
17
18
  title: readonly {
@@ -29,6 +30,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
29
30
  message: string;
30
31
  }>[] | undefined;
31
32
  } | {
33
+ id: string;
32
34
  type: "number";
33
35
  path: string;
34
36
  title: readonly {
@@ -47,6 +49,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
47
49
  message: string;
48
50
  }>[] | undefined;
49
51
  } | {
52
+ id: string;
50
53
  type: "select";
51
54
  path: string;
52
55
  title: readonly {
@@ -66,6 +69,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
66
69
  message: string;
67
70
  }>[] | undefined;
68
71
  } | {
72
+ id: string;
69
73
  type: "calendar";
70
74
  path: string;
71
75
  title: readonly {
@@ -84,8 +88,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
84
88
  expression: string;
85
89
  message: string;
86
90
  }>[] | undefined;
91
+ } | {
92
+ id: string;
93
+ type: "slot";
94
+ style?: string | undefined;
87
95
  })[];
88
96
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
97
+ style?: string | undefined;
89
98
  }>) => any;
90
99
  }, string, import("vue").PublicProps, Readonly<{
91
100
  config?: Effect.Effect<FieldsConfig | undefined>;
@@ -95,6 +104,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
95
104
  "onUpdate:modelValue"?: ((value: Record<string, unknown>) => any) | undefined;
96
105
  "onUpdate:config"?: ((args_0: Readonly<{
97
106
  fields: readonly ({
107
+ id: string;
98
108
  type: "string";
99
109
  path: string;
100
110
  title: readonly {
@@ -112,6 +122,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
112
122
  message: string;
113
123
  }>[] | undefined;
114
124
  } | {
125
+ id: string;
115
126
  type: "number";
116
127
  path: string;
117
128
  title: readonly {
@@ -130,6 +141,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
130
141
  message: string;
131
142
  }>[] | undefined;
132
143
  } | {
144
+ id: string;
133
145
  type: "select";
134
146
  path: string;
135
147
  title: readonly {
@@ -149,6 +161,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
149
161
  message: string;
150
162
  }>[] | undefined;
151
163
  } | {
164
+ id: string;
152
165
  type: "calendar";
153
166
  path: string;
154
167
  title: readonly {
@@ -167,11 +180,18 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
167
180
  expression: string;
168
181
  message: string;
169
182
  }>[] | undefined;
183
+ } | {
184
+ id: string;
185
+ type: "slot";
186
+ style?: string | undefined;
170
187
  })[];
171
188
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
189
+ style?: string | undefined;
172
190
  }>) => any) | undefined;
173
191
  }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
174
- [x: string]: ((props: any) => any) | undefined;
192
+ [x: string]: ((props: {
193
+ style: import("vue").CSSProperties;
194
+ }) => any) | undefined;
175
195
  }>;
176
196
  type __VLS_WithSlots<T, S> = T & {
177
197
  new (): {
package/dist/runtime/components/fields.vue CHANGED
@@ -27,6 +27,7 @@ export {
27
27
  FieldsConfigC,
28
28
  NumberFieldC,
29
29
  SelectFieldC,
30
+ SlotFieldC,
30
31
  StringFieldC
31
32
  } from "./ui/fields/Fields.vue";
32
33
  </script>
package/dist/runtime/components/fields.vue.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { Effect } from 'effect';
2
2
  import type { FieldsConfig } from './ui/fields/Fields.vue.js';
3
- export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, StringFieldC, } from './ui/fields/Fields.vue.js';
4
- export type { Field, FieldsConfig } from './ui/fields/Fields.vue.js';
3
+ export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, SlotFieldC, StringFieldC, } from './ui/fields/Fields.vue.js';
4
+ export type { Field, FieldsConfig, SlotField } from './ui/fields/Fields.vue.js';
5
5
  declare const _default: typeof __VLS_export;
6
6
  export default _default;
7
7
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
@@ -12,6 +12,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
12
12
  "update:modelValue": (value: Record<string, unknown>) => any;
13
13
  "update:config": (args_0: Readonly<{
14
14
  fields: readonly ({
15
+ id: string;
15
16
  type: "string";
16
17
  path: string;
17
18
  title: readonly {
@@ -29,6 +30,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
29
30
  message: string;
30
31
  }>[] | undefined;
31
32
  } | {
33
+ id: string;
32
34
  type: "number";
33
35
  path: string;
34
36
  title: readonly {
@@ -47,6 +49,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
47
49
  message: string;
48
50
  }>[] | undefined;
49
51
  } | {
52
+ id: string;
50
53
  type: "select";
51
54
  path: string;
52
55
  title: readonly {
@@ -66,6 +69,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
66
69
  message: string;
67
70
  }>[] | undefined;
68
71
  } | {
72
+ id: string;
69
73
  type: "calendar";
70
74
  path: string;
71
75
  title: readonly {
@@ -84,8 +88,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
84
88
  expression: string;
85
89
  message: string;
86
90
  }>[] | undefined;
91
+ } | {
92
+ id: string;
93
+ type: "slot";
94
+ style?: string | undefined;
87
95
  })[];
88
96
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
97
+ style?: string | undefined;
89
98
  }>) => any;
90
99
  }, string, import("vue").PublicProps, Readonly<{
91
100
  config?: Effect.Effect<FieldsConfig | undefined>;
@@ -95,6 +104,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
95
104
  "onUpdate:modelValue"?: ((value: Record<string, unknown>) => any) | undefined;
96
105
  "onUpdate:config"?: ((args_0: Readonly<{
97
106
  fields: readonly ({
107
+ id: string;
98
108
  type: "string";
99
109
  path: string;
100
110
  title: readonly {
@@ -112,6 +122,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
112
122
  message: string;
113
123
  }>[] | undefined;
114
124
  } | {
125
+ id: string;
115
126
  type: "number";
116
127
  path: string;
117
128
  title: readonly {
@@ -130,6 +141,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
130
141
  message: string;
131
142
  }>[] | undefined;
132
143
  } | {
144
+ id: string;
133
145
  type: "select";
134
146
  path: string;
135
147
  title: readonly {
@@ -149,6 +161,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
149
161
  message: string;
150
162
  }>[] | undefined;
151
163
  } | {
164
+ id: string;
152
165
  type: "calendar";
153
166
  path: string;
154
167
  title: readonly {
@@ -167,11 +180,18 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
167
180
  expression: string;
168
181
  message: string;
169
182
  }>[] | undefined;
183
+ } | {
184
+ id: string;
185
+ type: "slot";
186
+ style?: string | undefined;
170
187
  })[];
171
188
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
189
+ style?: string | undefined;
172
190
  }>) => any) | undefined;
173
191
  }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
174
- [x: string]: ((props: any) => any) | undefined;
192
+ [x: string]: ((props: {
193
+ style: import("vue").CSSProperties;
194
+ }) => any) | undefined;
175
195
  }>;
176
196
  type __VLS_WithSlots<T, S> = T & {
177
197
  new (): {
package/dist/runtime/components/ui/field/FieldError.vue CHANGED
@@ -28,7 +28,7 @@ const content = computed(() => {
28
28
  v-if="$slots.default || content"
29
29
  role="alert"
30
30
  data-slot="field-error"
31
- :class="cn('absolute left-0 top-full z-10 max-w-full pt-1 text-red-600 text-xs leading-tight font-normal', props.class)"
31
+ :class="cn('absolute left-0 top-full z-10 max-w-full pt-0.25 text-red-600 text-xs leading-tight font-normal', props.class)"
32
32
  >
33
33
  <slot v-if="$slots.default" />
34
34
 
package/dist/runtime/components/ui/field/index.js CHANGED
@@ -8,7 +8,7 @@ export const fieldVariants = cva(
8
8
  horizontal: [
9
9
  "flex-row items-center",
10
10
  "*:data-[slot=field-label]:shrink-0 *:data-[slot=field-label]:whitespace-nowrap",
11
- "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
11
+ "has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
12
12
  ],
13
13
  responsive: [
14
14
  "flex-col *:w-full.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto",
package/dist/runtime/components/ui/fields/Fields.d.vue.ts CHANGED
@@ -1,11 +1,13 @@
1
1
  import { Effect } from 'effect';
2
- export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, StringFieldC, ValidationRuleC, validationC, } from './schema.js';
3
- export type { Field, FieldsConfig, ValidationRule } from './schema.js';
2
+ import type { CSSProperties } from 'vue';
3
+ export { CalendarFieldC, FieldC, FieldsConfigC, NumberFieldC, SelectFieldC, SlotFieldC, StringFieldC, ValidationRuleC, validationC, } from './schema.js';
4
+ export type { Field, FieldsConfig, SlotField, ValidationRule } from './schema.js';
4
5
  declare const _default: typeof __VLS_export;
5
6
  export default _default;
6
7
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
7
8
  config: Effect.Effect<Readonly<{
8
9
  fields: readonly ({
10
+ id: string;
9
11
  type: "string";
10
12
  path: string;
11
13
  title: readonly {
@@ -23,6 +25,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
23
25
  message: string;
24
26
  }>[] | undefined;
25
27
  } | {
28
+ id: string;
26
29
  type: "number";
27
30
  path: string;
28
31
  title: readonly {
@@ -41,6 +44,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
41
44
  message: string;
42
45
  }>[] | undefined;
43
46
  } | {
47
+ id: string;
44
48
  type: "select";
45
49
  path: string;
46
50
  title: readonly {
@@ -60,6 +64,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
60
64
  message: string;
61
65
  }>[] | undefined;
62
66
  } | {
67
+ id: string;
63
68
  type: "calendar";
64
69
  path: string;
65
70
  title: readonly {
@@ -78,8 +83,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
78
83
  expression: string;
79
84
  message: string;
80
85
  }>[] | undefined;
86
+ } | {
87
+ id: string;
88
+ type: "slot";
89
+ style?: string | undefined;
81
90
  })[];
82
91
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
92
+ style?: string | undefined;
83
93
  }> | undefined>;
84
94
  } & {
85
95
  modelValue?: Record<string, unknown>;
@@ -87,6 +97,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
87
97
  "update:modelValue": (value: Record<string, unknown>) => any;
88
98
  "update:config": (args_0: Readonly<{
89
99
  fields: readonly ({
100
+ id: string;
90
101
  type: "string";
91
102
  path: string;
92
103
  title: readonly {
@@ -104,6 +115,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
104
115
  message: string;
105
116
  }>[] | undefined;
106
117
  } | {
118
+ id: string;
107
119
  type: "number";
108
120
  path: string;
109
121
  title: readonly {
@@ -122,6 +134,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
122
134
  message: string;
123
135
  }>[] | undefined;
124
136
  } | {
137
+ id: string;
125
138
  type: "select";
126
139
  path: string;
127
140
  title: readonly {
@@ -141,6 +154,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
141
154
  message: string;
142
155
  }>[] | undefined;
143
156
  } | {
157
+ id: string;
144
158
  type: "calendar";
145
159
  path: string;
146
160
  title: readonly {
@@ -159,12 +173,18 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
159
173
  expression: string;
160
174
  message: string;
161
175
  }>[] | undefined;
176
+ } | {
177
+ id: string;
178
+ type: "slot";
179
+ style?: string | undefined;
162
180
  })[];
163
181
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
182
+ style?: string | undefined;
164
183
  }>) => any;
165
184
  }, string, import("vue").PublicProps, Readonly<{
166
185
  config: Effect.Effect<Readonly<{
167
186
  fields: readonly ({
187
+ id: string;
168
188
  type: "string";
169
189
  path: string;
170
190
  title: readonly {
@@ -182,6 +202,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
182
202
  message: string;
183
203
  }>[] | undefined;
184
204
  } | {
205
+ id: string;
185
206
  type: "number";
186
207
  path: string;
187
208
  title: readonly {
@@ -200,6 +221,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
200
221
  message: string;
201
222
  }>[] | undefined;
202
223
  } | {
224
+ id: string;
203
225
  type: "select";
204
226
  path: string;
205
227
  title: readonly {
@@ -219,6 +241,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
219
241
  message: string;
220
242
  }>[] | undefined;
221
243
  } | {
244
+ id: string;
222
245
  type: "calendar";
223
246
  path: string;
224
247
  title: readonly {
@@ -237,8 +260,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
237
260
  expression: string;
238
261
  message: string;
239
262
  }>[] | undefined;
263
+ } | {
264
+ id: string;
265
+ type: "slot";
266
+ style?: string | undefined;
240
267
  })[];
241
268
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
269
+ style?: string | undefined;
242
270
  }> | undefined>;
243
271
  } & {
244
272
  modelValue?: Record<string, unknown>;
@@ -246,6 +274,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
246
274
  "onUpdate:modelValue"?: ((value: Record<string, unknown>) => any) | undefined;
247
275
  "onUpdate:config"?: ((args_0: Readonly<{
248
276
  fields: readonly ({
277
+ id: string;
249
278
  type: "string";
250
279
  path: string;
251
280
  title: readonly {
@@ -263,6 +292,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
263
292
  message: string;
264
293
  }>[] | undefined;
265
294
  } | {
295
+ id: string;
266
296
  type: "number";
267
297
  path: string;
268
298
  title: readonly {
@@ -281,6 +311,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
281
311
  message: string;
282
312
  }>[] | undefined;
283
313
  } | {
314
+ id: string;
284
315
  type: "select";
285
316
  path: string;
286
317
  title: readonly {
@@ -300,6 +331,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
300
331
  message: string;
301
332
  }>[] | undefined;
302
333
  } | {
334
+ id: string;
303
335
  type: "calendar";
304
336
  path: string;
305
337
  title: readonly {
@@ -318,10 +350,19 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
318
350
  expression: string;
319
351
  message: string;
320
352
  }>[] | undefined;
353
+ } | {
354
+ id: string;
355
+ type: "slot";
356
+ style?: string | undefined;
321
357
  })[];
322
358
  orientation?: "vertical" | "horizontal" | "floating" | undefined;
359
+ style?: string | undefined;
323
360
  }>) => any) | undefined;
324
361
  }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
362
+ [x: string]: ((props: {
363
+ style: CSSProperties;
364
+ }) => any) | undefined;
365
+ } & {
325
366
  default?: (props: {}) => any;
326
367
  }>;
327
368
  type __VLS_WithSlots<T, S> = T & {
package/dist/runtime/components/ui/fields/Fields.vue CHANGED
@@ -41,19 +41,52 @@ const displayConfig = ref(defaultConfig);
41
41
  const validationErrors = ref({});
42
42
  const calendarOpen = ref({});
43
43
  function cloneConfig(config2) {
44
- if (config2.orientation) {
45
- return {
46
- orientation: config2.orientation,
47
- fields: config2.fields.slice()
48
- };
49
- }
50
- return {
44
+ const nextConfig = {
51
45
  fields: config2.fields.slice()
52
46
  };
47
+ if (config2.orientation) {
48
+ nextConfig.orientation = config2.orientation;
49
+ }
50
+ if (config2.style) {
51
+ nextConfig.style = config2.style;
52
+ }
53
+ return nextConfig;
53
54
  }
54
55
  function getConfigOrientation(config2) {
55
56
  return config2.orientation ?? "horizontal";
56
57
  }
58
+ function getConfigStyle(config2) {
59
+ const style = {};
60
+ if (!config2.style) {
61
+ return style;
62
+ }
63
+ const styleMap = $dsl.evaluate`${config2.style}`({ form: modelValue.value });
64
+ for (const [key, value] of Object.entries(styleMap)) {
65
+ if (typeof value === "string" || typeof value === "number") {
66
+ Reflect.set(style, key, value);
67
+ }
68
+ }
69
+ return style;
70
+ }
71
+ function getFieldStyle(field) {
72
+ if (!field.style) {
73
+ return {};
74
+ }
75
+ const style = $dsl.evaluate`${field.style}`();
76
+ const normalizedStyle = {};
77
+ if (!style || typeof style !== "object" || Array.isArray(style)) {
78
+ return normalizedStyle;
79
+ }
80
+ for (const [key, value] of Object.entries(style)) {
81
+ if (typeof value === "string" || typeof value === "number") {
82
+ Reflect.set(normalizedStyle, key, value);
83
+ }
84
+ }
85
+ return normalizedStyle;
86
+ }
87
+ function isSlotField(field) {
88
+ return field.type === "slot";
89
+ }
57
90
  function toCalendarDateValue(value, valueFormat) {
58
91
  if (typeof value !== "string") return void 0;
59
92
  const date = parse(value, valueFormat, /* @__PURE__ */ new Date());
@@ -145,7 +178,7 @@ watch(config, (value) => {
145
178
  watchEffect(() => {
146
179
  const activePaths = /* @__PURE__ */ new Set();
147
180
  for (const field of displayConfig.value.fields) {
148
- if (!isFieldHidden(field) && !isFieldDisabled(field)) {
181
+ if (!isSlotField(field) && !isFieldHidden(field) && !isFieldDisabled(field)) {
149
182
  activePaths.add(field.path);
150
183
  }
151
184
  }
@@ -169,6 +202,7 @@ export {
169
202
  FieldsConfigC,
170
203
  NumberFieldC,
171
204
  SelectFieldC,
205
+ SlotFieldC,
172
206
  StringFieldC,
173
207
  ValidationRuleC,
174
208
  validationC
@@ -181,6 +215,7 @@ export {
181
215
  'relative p-1 -m-1 border border-dashed',
182
216
  isCheating ? 'border-(--primary)/20 rounded hover:border-(--primary)/40 transition-colors duration-150 group cursor-pointer' : 'border-transparent'
183
217
  ]"
218
+ :style="getConfigStyle(displayConfig)"
184
219
  >
185
220
  <Button
186
221
  v-if="isCheating"
@@ -208,14 +243,19 @@ export {
208
243
 
209
244
  <template
210
245
  v-for="field in displayConfig.fields"
211
- :key="field.path"
246
+ :key="field.id"
212
247
  >
248
+ <slot
249
+ v-if="field.type === 'slot'"
250
+ :name="field.id"
251
+ :style="getFieldStyle(field)"
252
+ />
213
253
  <Field
214
- v-if="!isFieldHidden(field)"
254
+ v-else-if="!isFieldHidden(field)"
215
255
  :data-disabled="isFieldDisabled(field) ? 'true' : void 0"
216
256
  :data-invalid="isFieldInvalid(field) ? 'true' : void 0"
217
257
  :orientation="getConfigOrientation(displayConfig)"
218
- :style="field.style ? $dsl.evaluate`${field.style}`() : {}"
258
+ :style="getFieldStyle(field)"
219
259
  >
220
260
  <FieldLabel :for="['string', 'number'].includes(field.type) ? `${id}:${field.path}` : void 0">
221
261
  {{ getFieldLabel(field) }}