devject-design 0.1.1 → 0.2.1

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 (50) hide show
  1. package/README.md +482 -127
  2. package/dist/core/builtin/advanced.d.ts +1 -0
  3. package/dist/core/builtin/basics.d.ts +1 -0
  4. package/dist/core/builtin/containers.d.ts +1 -0
  5. package/dist/core/builtin/editors.d.ts +1 -0
  6. package/dist/core/builtin/index.d.ts +1 -0
  7. package/dist/core/builtin/utils.d.ts +9 -0
  8. package/dist/core/editors.d.ts +17 -0
  9. package/dist/core/registry.d.ts +38 -0
  10. package/dist/index.d.ts +9 -1
  11. package/dist/index.es.js +11899 -2785
  12. package/dist/index.umd.js +39 -1
  13. package/dist/pages/FormDesigner.d.ts +16 -1
  14. package/dist/style.css +1 -1
  15. package/dist/ui/PaletteItem.d.ts +2 -0
  16. package/dist/ui/PreviewDialog.d.ts +42 -1
  17. package/dist/ui/components/Checkbox.d.ts +11 -0
  18. package/dist/ui/components/Collapse.d.ts +11 -0
  19. package/dist/ui/components/FileUpload.d.ts +11 -0
  20. package/dist/ui/components/FlexRow.d.ts +11 -0
  21. package/dist/ui/components/ImageUpload.d.ts +11 -0
  22. package/dist/ui/components/Input.d.ts +11 -0
  23. package/dist/ui/components/Radio.d.ts +11 -0
  24. package/dist/ui/components/Select.d.ts +11 -0
  25. package/dist/ui/components/StaticTable.d.ts +7 -0
  26. package/dist/ui/components/Switch.d.ts +11 -0
  27. package/dist/ui/components/Table.d.ts +11 -0
  28. package/dist/ui/components/Tabs.d.ts +11 -0
  29. package/dist/ui/components/Textarea.d.ts +11 -0
  30. package/dist/ui/components/Title.d.ts +7 -0
  31. package/dist/ui/components/Tree.d.ts +7 -0
  32. package/dist/ui/editors/CollapseEditor.d.ts +5 -0
  33. package/dist/ui/editors/ExcelIOEditor.d.ts +5 -0
  34. package/dist/ui/editors/FlexLayoutEditor.d.ts +5 -0
  35. package/dist/ui/editors/JsonDataEditor.d.ts +9 -0
  36. package/dist/ui/editors/OptionsEditor.d.ts +9 -0
  37. package/dist/ui/editors/TableColumnsEditor.d.ts +10 -0
  38. package/dist/ui/editors/TabsEditor.d.ts +5 -0
  39. package/dist/ui/hooks/useValidator.d.ts +4 -0
  40. package/dist/ui/preview/FormRenderer.d.ts +15 -2
  41. package/dist/ui/state/designerState.d.ts +30 -1405
  42. package/dist/ui/state/dragState.d.ts +11 -6
  43. package/dist/ui/state/injectionKeys.d.ts +4 -0
  44. package/dist/ui/state/schemaOps.d.ts +1 -3
  45. package/dist/ui/state/types.d.ts +29 -92
  46. package/dist/ui/state/useDragLogic.d.ts +10 -0
  47. package/dist/ui/state/useHotkeys.d.ts +4 -0
  48. package/dist/ui/state/validator.d.ts +36 -0
  49. package/package.json +7 -2
  50. package/dist/ui/state/history.d.ts +0 -8413
package/dist/ui/state/designerState.d.ts CHANGED
@@ -1,11 +1,12 @@
1
1
  import { DragItem, DropTarget, FormDataModel, NodeType } from './types';
2
+ declare function undo(): void;
3
+ declare function redo(): void;
2
4
  declare function applySchema(input: unknown): void;
3
5
  declare function select(nodeId: string | null): void;
4
6
  declare function removeSelected(): void;
5
- declare function beginPaletteDrag(nodeType: NodeType, ev: PointerEvent): void;
6
- declare function beginNodeDrag(nodeId: string, ev: PointerEvent): void;
7
7
  declare function updateNodeProps(nodeId: string, props: Record<string, unknown>): void;
8
8
  declare function updateFlexCols(rowId: string, cols: 1 | 2 | 3 | 4): void;
9
+ declare function updateFlexColWidth(rowId: string, colIndex: number, width: number, unit?: 'fr' | 'px'): void;
9
10
  declare function updateCollapse(collapseId: string, payload: {
10
11
  accordion?: boolean;
11
12
  items?: Array<{
@@ -21,8 +22,6 @@ declare function updateTabs(tabsId: string, payload: {
21
22
  label: string;
22
23
  }>;
23
24
  }): void;
24
- declare function setHover(target: DropTarget | null): void;
25
- declare function bindHotkeys(): void;
26
25
  declare function loadAutoSave(): void;
27
26
  declare function setFormData(next: FormDataModel): void;
28
27
  declare function exportFormData(): FormDataModel;
@@ -31,1424 +30,45 @@ export declare function useDesignerState(): {
31
30
  schema: import('vue').ComputedRef<{
32
31
  version: 1;
33
32
  root: {
34
- children: ({
33
+ children: {
35
34
  id: string;
36
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
37
- meta: {
38
- createdAt: string;
39
- updatedAt: string;
40
- style: Record<string, unknown>;
41
- };
42
- props: {
43
- label: string;
44
- field: string;
45
- placeholder?: string | undefined;
46
- required?: boolean | undefined;
47
- options?: {
48
- label: string;
49
- value: string;
50
- }[] | undefined;
51
- multiple?: boolean | undefined;
52
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
53
- accept?: string | undefined;
54
- limit?: number | undefined;
55
- activeText?: string | undefined;
56
- inactiveText?: string | undefined;
57
- activeValue?: any;
58
- inactiveValue?: any;
59
- };
60
- } | {
61
- id: string;
62
- type: "title";
63
- meta: {
64
- createdAt: string;
65
- updatedAt: string;
66
- style: Record<string, unknown>;
67
- };
68
- props: {
69
- label: string;
70
- fontSize?: number | undefined;
71
- bold?: boolean | undefined;
72
- align?: "left" | "center" | "right" | undefined;
73
- };
74
- } | {
75
- id: string;
76
- type: "flexRow";
77
- meta: {
78
- createdAt: string;
79
- updatedAt: string;
80
- style: Record<string, unknown>;
81
- };
82
- props: {
83
- cols: 1 | 2 | 3 | 4;
84
- gap?: number | undefined;
85
- };
86
- columns: {
35
+ type: string;
36
+ props: Record<string, any>;
37
+ children?: /*elided*/ any[] | undefined;
38
+ columns?: {
87
39
  id: string;
88
- children: ({
89
- id: string;
90
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
91
- meta: {
92
- createdAt: string;
93
- updatedAt: string;
94
- style: Record<string, unknown>;
95
- };
96
- props: {
97
- label: string;
98
- field: string;
99
- placeholder?: string | undefined;
100
- required?: boolean | undefined;
101
- options?: {
102
- label: string;
103
- value: string;
104
- }[] | undefined;
105
- multiple?: boolean | undefined;
106
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
107
- accept?: string | undefined;
108
- limit?: number | undefined;
109
- activeText?: string | undefined;
110
- inactiveText?: string | undefined;
111
- activeValue?: any;
112
- inactiveValue?: any;
113
- };
114
- } | {
115
- id: string;
116
- type: "title";
117
- meta: {
118
- createdAt: string;
119
- updatedAt: string;
120
- style: Record<string, unknown>;
121
- };
122
- props: {
123
- label: string;
124
- fontSize?: number | undefined;
125
- bold?: boolean | undefined;
126
- align?: "left" | "center" | "right" | undefined;
127
- };
128
- } | /*elided*/ any | {
129
- id: string;
130
- type: "collapse";
131
- meta: {
132
- createdAt: string;
133
- updatedAt: string;
134
- style: Record<string, unknown>;
135
- };
136
- props: {
137
- accordion: boolean;
138
- };
139
- items: {
140
- id: string;
141
- title: string;
142
- name: string;
143
- children: ({
144
- id: string;
145
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
146
- meta: {
147
- createdAt: string;
148
- updatedAt: string;
149
- style: Record<string, unknown>;
150
- };
151
- props: {
152
- label: string;
153
- field: string;
154
- placeholder?: string | undefined;
155
- required?: boolean | undefined;
156
- options?: {
157
- label: string;
158
- value: string;
159
- }[] | undefined;
160
- multiple?: boolean | undefined;
161
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
162
- accept?: string | undefined;
163
- limit?: number | undefined;
164
- activeText?: string | undefined;
165
- inactiveText?: string | undefined;
166
- activeValue?: any;
167
- inactiveValue?: any;
168
- };
169
- } | {
170
- id: string;
171
- type: "title";
172
- meta: {
173
- createdAt: string;
174
- updatedAt: string;
175
- style: Record<string, unknown>;
176
- };
177
- props: {
178
- label: string;
179
- fontSize?: number | undefined;
180
- bold?: boolean | undefined;
181
- align?: "left" | "center" | "right" | undefined;
182
- };
183
- } | /*elided*/ any | /*elided*/ any | {
184
- id: string;
185
- type: "tabs";
186
- meta: {
187
- createdAt: string;
188
- updatedAt: string;
189
- style: Record<string, unknown>;
190
- };
191
- props: {
192
- type: "card" | "border-card";
193
- };
194
- tabs: {
195
- id: string;
196
- label: string;
197
- children: ({
198
- id: string;
199
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
200
- meta: {
201
- createdAt: string;
202
- updatedAt: string;
203
- style: Record<string, unknown>;
204
- };
205
- props: {
206
- label: string;
207
- field: string;
208
- placeholder?: string | undefined;
209
- required?: boolean | undefined;
210
- options?: {
211
- label: string;
212
- value: string;
213
- }[] | undefined;
214
- multiple?: boolean | undefined;
215
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
216
- accept?: string | undefined;
217
- limit?: number | undefined;
218
- activeText?: string | undefined;
219
- inactiveText?: string | undefined;
220
- activeValue?: any;
221
- inactiveValue?: any;
222
- };
223
- } | {
224
- id: string;
225
- type: "title";
226
- meta: {
227
- createdAt: string;
228
- updatedAt: string;
229
- style: Record<string, unknown>;
230
- };
231
- props: {
232
- label: string;
233
- fontSize?: number | undefined;
234
- bold?: boolean | undefined;
235
- align?: "left" | "center" | "right" | undefined;
236
- };
237
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
238
- id: string;
239
- type: "table";
240
- meta: {
241
- createdAt: string;
242
- updatedAt: string;
243
- style: Record<string, unknown>;
244
- };
245
- props: {
246
- label: string;
247
- field: string;
248
- columns: {
249
- id: string;
250
- label: string;
251
- prop: string;
252
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
253
- width?: number | undefined;
254
- required?: boolean | undefined;
255
- options?: /*elided*/ any[] | undefined;
256
- multiple?: boolean | undefined;
257
- format?: string | undefined;
258
- valueFormat?: string | undefined;
259
- placeholder?: string | undefined;
260
- filterable?: boolean | undefined;
261
- sortable?: boolean | undefined;
262
- }[];
263
- pagination: boolean;
264
- pageSize: number;
265
- enableExcelImport: boolean;
266
- };
267
- })[];
268
- }[];
269
- } | {
270
- id: string;
271
- type: "table";
272
- meta: {
273
- createdAt: string;
274
- updatedAt: string;
275
- style: Record<string, unknown>;
276
- };
277
- props: {
278
- label: string;
279
- field: string;
280
- columns: {
281
- id: string;
282
- label: string;
283
- prop: string;
284
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
285
- width?: number | undefined;
286
- required?: boolean | undefined;
287
- options?: {
288
- label: string;
289
- value: string;
290
- }[] | undefined;
291
- multiple?: boolean | undefined;
292
- format?: string | undefined;
293
- valueFormat?: string | undefined;
294
- placeholder?: string | undefined;
295
- filterable?: boolean | undefined;
296
- sortable?: boolean | undefined;
297
- }[];
298
- pagination: boolean;
299
- pageSize: number;
300
- enableExcelImport: boolean;
301
- };
302
- })[];
303
- }[];
304
- } | {
305
- id: string;
306
- type: "tabs";
307
- meta: {
308
- createdAt: string;
309
- updatedAt: string;
310
- style: Record<string, unknown>;
311
- };
312
- props: {
313
- type: "card" | "border-card";
314
- };
315
- tabs: {
316
- id: string;
317
- label: string;
318
- children: ({
319
- id: string;
320
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
321
- meta: {
322
- createdAt: string;
323
- updatedAt: string;
324
- style: Record<string, unknown>;
325
- };
326
- props: {
327
- label: string;
328
- field: string;
329
- placeholder?: string | undefined;
330
- required?: boolean | undefined;
331
- options?: {
332
- label: string;
333
- value: string;
334
- }[] | undefined;
335
- multiple?: boolean | undefined;
336
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
337
- accept?: string | undefined;
338
- limit?: number | undefined;
339
- activeText?: string | undefined;
340
- inactiveText?: string | undefined;
341
- activeValue?: any;
342
- inactiveValue?: any;
343
- };
344
- } | {
345
- id: string;
346
- type: "title";
347
- meta: {
348
- createdAt: string;
349
- updatedAt: string;
350
- style: Record<string, unknown>;
351
- };
352
- props: {
353
- label: string;
354
- fontSize?: number | undefined;
355
- bold?: boolean | undefined;
356
- align?: "left" | "center" | "right" | undefined;
357
- };
358
- } | /*elided*/ any | {
359
- id: string;
360
- type: "collapse";
361
- meta: {
362
- createdAt: string;
363
- updatedAt: string;
364
- style: Record<string, unknown>;
365
- };
366
- props: {
367
- accordion: boolean;
368
- };
369
- items: {
370
- id: string;
371
- title: string;
372
- name: string;
373
- children: ({
374
- id: string;
375
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
376
- meta: {
377
- createdAt: string;
378
- updatedAt: string;
379
- style: Record<string, unknown>;
380
- };
381
- props: {
382
- label: string;
383
- field: string;
384
- placeholder?: string | undefined;
385
- required?: boolean | undefined;
386
- options?: {
387
- label: string;
388
- value: string;
389
- }[] | undefined;
390
- multiple?: boolean | undefined;
391
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
392
- accept?: string | undefined;
393
- limit?: number | undefined;
394
- activeText?: string | undefined;
395
- inactiveText?: string | undefined;
396
- activeValue?: any;
397
- inactiveValue?: any;
398
- };
399
- } | {
400
- id: string;
401
- type: "title";
402
- meta: {
403
- createdAt: string;
404
- updatedAt: string;
405
- style: Record<string, unknown>;
406
- };
407
- props: {
408
- label: string;
409
- fontSize?: number | undefined;
410
- bold?: boolean | undefined;
411
- align?: "left" | "center" | "right" | undefined;
412
- };
413
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
414
- id: string;
415
- type: "table";
416
- meta: {
417
- createdAt: string;
418
- updatedAt: string;
419
- style: Record<string, unknown>;
420
- };
421
- props: {
422
- label: string;
423
- field: string;
424
- columns: {
425
- id: string;
426
- label: string;
427
- prop: string;
428
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
429
- width?: number | undefined;
430
- required?: boolean | undefined;
431
- options?: /*elided*/ any[] | undefined;
432
- multiple?: boolean | undefined;
433
- format?: string | undefined;
434
- valueFormat?: string | undefined;
435
- placeholder?: string | undefined;
436
- filterable?: boolean | undefined;
437
- sortable?: boolean | undefined;
438
- }[];
439
- pagination: boolean;
440
- pageSize: number;
441
- enableExcelImport: boolean;
442
- };
443
- })[];
444
- }[];
445
- } | /*elided*/ any | {
446
- id: string;
447
- type: "table";
448
- meta: {
449
- createdAt: string;
450
- updatedAt: string;
451
- style: Record<string, unknown>;
452
- };
453
- props: {
454
- label: string;
455
- field: string;
456
- columns: {
457
- id: string;
458
- label: string;
459
- prop: string;
460
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
461
- width?: number | undefined;
462
- required?: boolean | undefined;
463
- options?: {
464
- label: string;
465
- value: string;
466
- }[] | undefined;
467
- multiple?: boolean | undefined;
468
- format?: string | undefined;
469
- valueFormat?: string | undefined;
470
- placeholder?: string | undefined;
471
- filterable?: boolean | undefined;
472
- sortable?: boolean | undefined;
473
- }[];
474
- pagination: boolean;
475
- pageSize: number;
476
- enableExcelImport: boolean;
477
- };
478
- })[];
479
- }[];
480
- } | {
481
- id: string;
482
- type: "table";
483
- meta: {
484
- createdAt: string;
485
- updatedAt: string;
486
- style: Record<string, unknown>;
487
- };
488
- props: {
489
- label: string;
490
- field: string;
491
- columns: {
492
- id: string;
493
- label: string;
494
- prop: string;
495
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
496
- width?: number | undefined;
497
- required?: boolean | undefined;
498
- options?: {
499
- label: string;
500
- value: string;
501
- }[] | undefined;
502
- multiple?: boolean | undefined;
503
- format?: string | undefined;
504
- valueFormat?: string | undefined;
505
- placeholder?: string | undefined;
506
- filterable?: boolean | undefined;
507
- sortable?: boolean | undefined;
508
- }[];
509
- pagination: boolean;
510
- pageSize: number;
511
- enableExcelImport: boolean;
512
- };
513
- })[];
514
- }[];
515
- } | {
516
- id: string;
517
- type: "collapse";
518
- meta: {
519
- createdAt: string;
520
- updatedAt: string;
521
- style: Record<string, unknown>;
522
- };
523
- props: {
524
- accordion: boolean;
525
- };
526
- items: {
40
+ width?: number | undefined;
41
+ widthType?: "fr" | "px" | undefined;
42
+ children: /*elided*/ any[];
43
+ }[] | undefined;
44
+ items?: {
527
45
  id: string;
528
46
  title: string;
529
47
  name: string;
530
- children: ({
531
- id: string;
532
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
533
- meta: {
534
- createdAt: string;
535
- updatedAt: string;
536
- style: Record<string, unknown>;
537
- };
538
- props: {
539
- label: string;
540
- field: string;
541
- placeholder?: string | undefined;
542
- required?: boolean | undefined;
543
- options?: {
544
- label: string;
545
- value: string;
546
- }[] | undefined;
547
- multiple?: boolean | undefined;
548
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
549
- accept?: string | undefined;
550
- limit?: number | undefined;
551
- activeText?: string | undefined;
552
- inactiveText?: string | undefined;
553
- activeValue?: any;
554
- inactiveValue?: any;
555
- };
556
- } | {
557
- id: string;
558
- type: "title";
559
- meta: {
560
- createdAt: string;
561
- updatedAt: string;
562
- style: Record<string, unknown>;
563
- };
564
- props: {
565
- label: string;
566
- fontSize?: number | undefined;
567
- bold?: boolean | undefined;
568
- align?: "left" | "center" | "right" | undefined;
569
- };
570
- } | {
571
- id: string;
572
- type: "flexRow";
573
- meta: {
574
- createdAt: string;
575
- updatedAt: string;
576
- style: Record<string, unknown>;
577
- };
578
- props: {
579
- cols: 1 | 2 | 3 | 4;
580
- gap?: number | undefined;
581
- };
582
- columns: {
583
- id: string;
584
- children: ({
585
- id: string;
586
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
587
- meta: {
588
- createdAt: string;
589
- updatedAt: string;
590
- style: Record<string, unknown>;
591
- };
592
- props: {
593
- label: string;
594
- field: string;
595
- placeholder?: string | undefined;
596
- required?: boolean | undefined;
597
- options?: {
598
- label: string;
599
- value: string;
600
- }[] | undefined;
601
- multiple?: boolean | undefined;
602
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
603
- accept?: string | undefined;
604
- limit?: number | undefined;
605
- activeText?: string | undefined;
606
- inactiveText?: string | undefined;
607
- activeValue?: any;
608
- inactiveValue?: any;
609
- };
610
- } | {
611
- id: string;
612
- type: "title";
613
- meta: {
614
- createdAt: string;
615
- updatedAt: string;
616
- style: Record<string, unknown>;
617
- };
618
- props: {
619
- label: string;
620
- fontSize?: number | undefined;
621
- bold?: boolean | undefined;
622
- align?: "left" | "center" | "right" | undefined;
623
- };
624
- } | /*elided*/ any | /*elided*/ any | {
625
- id: string;
626
- type: "tabs";
627
- meta: {
628
- createdAt: string;
629
- updatedAt: string;
630
- style: Record<string, unknown>;
631
- };
632
- props: {
633
- type: "card" | "border-card";
634
- };
635
- tabs: {
636
- id: string;
637
- label: string;
638
- children: ({
639
- id: string;
640
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
641
- meta: {
642
- createdAt: string;
643
- updatedAt: string;
644
- style: Record<string, unknown>;
645
- };
646
- props: {
647
- label: string;
648
- field: string;
649
- placeholder?: string | undefined;
650
- required?: boolean | undefined;
651
- options?: {
652
- label: string;
653
- value: string;
654
- }[] | undefined;
655
- multiple?: boolean | undefined;
656
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
657
- accept?: string | undefined;
658
- limit?: number | undefined;
659
- activeText?: string | undefined;
660
- inactiveText?: string | undefined;
661
- activeValue?: any;
662
- inactiveValue?: any;
663
- };
664
- } | {
665
- id: string;
666
- type: "title";
667
- meta: {
668
- createdAt: string;
669
- updatedAt: string;
670
- style: Record<string, unknown>;
671
- };
672
- props: {
673
- label: string;
674
- fontSize?: number | undefined;
675
- bold?: boolean | undefined;
676
- align?: "left" | "center" | "right" | undefined;
677
- };
678
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
679
- id: string;
680
- type: "table";
681
- meta: {
682
- createdAt: string;
683
- updatedAt: string;
684
- style: Record<string, unknown>;
685
- };
686
- props: {
687
- label: string;
688
- field: string;
689
- columns: {
690
- id: string;
691
- label: string;
692
- prop: string;
693
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
694
- width?: number | undefined;
695
- required?: boolean | undefined;
696
- options?: /*elided*/ any[] | undefined;
697
- multiple?: boolean | undefined;
698
- format?: string | undefined;
699
- valueFormat?: string | undefined;
700
- placeholder?: string | undefined;
701
- filterable?: boolean | undefined;
702
- sortable?: boolean | undefined;
703
- }[];
704
- pagination: boolean;
705
- pageSize: number;
706
- enableExcelImport: boolean;
707
- };
708
- })[];
709
- }[];
710
- } | {
711
- id: string;
712
- type: "table";
713
- meta: {
714
- createdAt: string;
715
- updatedAt: string;
716
- style: Record<string, unknown>;
717
- };
718
- props: {
719
- label: string;
720
- field: string;
721
- columns: {
722
- id: string;
723
- label: string;
724
- prop: string;
725
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
726
- width?: number | undefined;
727
- required?: boolean | undefined;
728
- options?: {
729
- label: string;
730
- value: string;
731
- }[] | undefined;
732
- multiple?: boolean | undefined;
733
- format?: string | undefined;
734
- valueFormat?: string | undefined;
735
- placeholder?: string | undefined;
736
- filterable?: boolean | undefined;
737
- sortable?: boolean | undefined;
738
- }[];
739
- pagination: boolean;
740
- pageSize: number;
741
- enableExcelImport: boolean;
742
- };
743
- })[];
744
- }[];
745
- } | /*elided*/ any | {
746
- id: string;
747
- type: "tabs";
748
- meta: {
749
- createdAt: string;
750
- updatedAt: string;
751
- style: Record<string, unknown>;
752
- };
753
- props: {
754
- type: "card" | "border-card";
755
- };
756
- tabs: {
757
- id: string;
758
- label: string;
759
- children: ({
760
- id: string;
761
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
762
- meta: {
763
- createdAt: string;
764
- updatedAt: string;
765
- style: Record<string, unknown>;
766
- };
767
- props: {
768
- label: string;
769
- field: string;
770
- placeholder?: string | undefined;
771
- required?: boolean | undefined;
772
- options?: {
773
- label: string;
774
- value: string;
775
- }[] | undefined;
776
- multiple?: boolean | undefined;
777
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
778
- accept?: string | undefined;
779
- limit?: number | undefined;
780
- activeText?: string | undefined;
781
- inactiveText?: string | undefined;
782
- activeValue?: any;
783
- inactiveValue?: any;
784
- };
785
- } | {
786
- id: string;
787
- type: "title";
788
- meta: {
789
- createdAt: string;
790
- updatedAt: string;
791
- style: Record<string, unknown>;
792
- };
793
- props: {
794
- label: string;
795
- fontSize?: number | undefined;
796
- bold?: boolean | undefined;
797
- align?: "left" | "center" | "right" | undefined;
798
- };
799
- } | {
800
- id: string;
801
- type: "flexRow";
802
- meta: {
803
- createdAt: string;
804
- updatedAt: string;
805
- style: Record<string, unknown>;
806
- };
807
- props: {
808
- cols: 1 | 2 | 3 | 4;
809
- gap?: number | undefined;
810
- };
811
- columns: {
812
- id: string;
813
- children: ({
814
- id: string;
815
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
816
- meta: {
817
- createdAt: string;
818
- updatedAt: string;
819
- style: Record<string, unknown>;
820
- };
821
- props: {
822
- label: string;
823
- field: string;
824
- placeholder?: string | undefined;
825
- required?: boolean | undefined;
826
- options?: {
827
- label: string;
828
- value: string;
829
- }[] | undefined;
830
- multiple?: boolean | undefined;
831
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
832
- accept?: string | undefined;
833
- limit?: number | undefined;
834
- activeText?: string | undefined;
835
- inactiveText?: string | undefined;
836
- activeValue?: any;
837
- inactiveValue?: any;
838
- };
839
- } | {
840
- id: string;
841
- type: "title";
842
- meta: {
843
- createdAt: string;
844
- updatedAt: string;
845
- style: Record<string, unknown>;
846
- };
847
- props: {
848
- label: string;
849
- fontSize?: number | undefined;
850
- bold?: boolean | undefined;
851
- align?: "left" | "center" | "right" | undefined;
852
- };
853
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
854
- id: string;
855
- type: "table";
856
- meta: {
857
- createdAt: string;
858
- updatedAt: string;
859
- style: Record<string, unknown>;
860
- };
861
- props: {
862
- label: string;
863
- field: string;
864
- columns: {
865
- id: string;
866
- label: string;
867
- prop: string;
868
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
869
- width?: number | undefined;
870
- required?: boolean | undefined;
871
- options?: /*elided*/ any[] | undefined;
872
- multiple?: boolean | undefined;
873
- format?: string | undefined;
874
- valueFormat?: string | undefined;
875
- placeholder?: string | undefined;
876
- filterable?: boolean | undefined;
877
- sortable?: boolean | undefined;
878
- }[];
879
- pagination: boolean;
880
- pageSize: number;
881
- enableExcelImport: boolean;
882
- };
883
- })[];
884
- }[];
885
- } | /*elided*/ any | /*elided*/ any | {
886
- id: string;
887
- type: "table";
888
- meta: {
889
- createdAt: string;
890
- updatedAt: string;
891
- style: Record<string, unknown>;
892
- };
893
- props: {
894
- label: string;
895
- field: string;
896
- columns: {
897
- id: string;
898
- label: string;
899
- prop: string;
900
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
901
- width?: number | undefined;
902
- required?: boolean | undefined;
903
- options?: {
904
- label: string;
905
- value: string;
906
- }[] | undefined;
907
- multiple?: boolean | undefined;
908
- format?: string | undefined;
909
- valueFormat?: string | undefined;
910
- placeholder?: string | undefined;
911
- filterable?: boolean | undefined;
912
- sortable?: boolean | undefined;
913
- }[];
914
- pagination: boolean;
915
- pageSize: number;
916
- enableExcelImport: boolean;
917
- };
918
- })[];
919
- }[];
920
- } | {
921
- id: string;
922
- type: "table";
923
- meta: {
924
- createdAt: string;
925
- updatedAt: string;
926
- style: Record<string, unknown>;
927
- };
928
- props: {
929
- label: string;
930
- field: string;
931
- columns: {
932
- id: string;
933
- label: string;
934
- prop: string;
935
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
936
- width?: number | undefined;
937
- required?: boolean | undefined;
938
- options?: {
939
- label: string;
940
- value: string;
941
- }[] | undefined;
942
- multiple?: boolean | undefined;
943
- format?: string | undefined;
944
- valueFormat?: string | undefined;
945
- placeholder?: string | undefined;
946
- filterable?: boolean | undefined;
947
- sortable?: boolean | undefined;
948
- }[];
949
- pagination: boolean;
950
- pageSize: number;
951
- enableExcelImport: boolean;
952
- };
953
- })[];
954
- }[];
955
- } | {
956
- id: string;
957
- type: "tabs";
958
- meta: {
959
- createdAt: string;
960
- updatedAt: string;
961
- style: Record<string, unknown>;
962
- };
963
- props: {
964
- type: "card" | "border-card";
965
- };
966
- tabs: {
48
+ children: /*elided*/ any[];
49
+ }[] | undefined;
50
+ tabs?: {
967
51
  id: string;
968
52
  label: string;
969
- children: ({
970
- id: string;
971
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
972
- meta: {
973
- createdAt: string;
974
- updatedAt: string;
975
- style: Record<string, unknown>;
976
- };
977
- props: {
978
- label: string;
979
- field: string;
980
- placeholder?: string | undefined;
981
- required?: boolean | undefined;
982
- options?: {
983
- label: string;
984
- value: string;
985
- }[] | undefined;
986
- multiple?: boolean | undefined;
987
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
988
- accept?: string | undefined;
989
- limit?: number | undefined;
990
- activeText?: string | undefined;
991
- inactiveText?: string | undefined;
992
- activeValue?: any;
993
- inactiveValue?: any;
994
- };
995
- } | {
996
- id: string;
997
- type: "title";
998
- meta: {
999
- createdAt: string;
1000
- updatedAt: string;
1001
- style: Record<string, unknown>;
1002
- };
1003
- props: {
1004
- label: string;
1005
- fontSize?: number | undefined;
1006
- bold?: boolean | undefined;
1007
- align?: "left" | "center" | "right" | undefined;
1008
- };
1009
- } | {
1010
- id: string;
1011
- type: "flexRow";
1012
- meta: {
1013
- createdAt: string;
1014
- updatedAt: string;
1015
- style: Record<string, unknown>;
1016
- };
1017
- props: {
1018
- cols: 1 | 2 | 3 | 4;
1019
- gap?: number | undefined;
1020
- };
1021
- columns: {
1022
- id: string;
1023
- children: ({
1024
- id: string;
1025
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
1026
- meta: {
1027
- createdAt: string;
1028
- updatedAt: string;
1029
- style: Record<string, unknown>;
1030
- };
1031
- props: {
1032
- label: string;
1033
- field: string;
1034
- placeholder?: string | undefined;
1035
- required?: boolean | undefined;
1036
- options?: {
1037
- label: string;
1038
- value: string;
1039
- }[] | undefined;
1040
- multiple?: boolean | undefined;
1041
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
1042
- accept?: string | undefined;
1043
- limit?: number | undefined;
1044
- activeText?: string | undefined;
1045
- inactiveText?: string | undefined;
1046
- activeValue?: any;
1047
- inactiveValue?: any;
1048
- };
1049
- } | {
1050
- id: string;
1051
- type: "title";
1052
- meta: {
1053
- createdAt: string;
1054
- updatedAt: string;
1055
- style: Record<string, unknown>;
1056
- };
1057
- props: {
1058
- label: string;
1059
- fontSize?: number | undefined;
1060
- bold?: boolean | undefined;
1061
- align?: "left" | "center" | "right" | undefined;
1062
- };
1063
- } | /*elided*/ any | {
1064
- id: string;
1065
- type: "collapse";
1066
- meta: {
1067
- createdAt: string;
1068
- updatedAt: string;
1069
- style: Record<string, unknown>;
1070
- };
1071
- props: {
1072
- accordion: boolean;
1073
- };
1074
- items: {
1075
- id: string;
1076
- title: string;
1077
- name: string;
1078
- children: ({
1079
- id: string;
1080
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
1081
- meta: {
1082
- createdAt: string;
1083
- updatedAt: string;
1084
- style: Record<string, unknown>;
1085
- };
1086
- props: {
1087
- label: string;
1088
- field: string;
1089
- placeholder?: string | undefined;
1090
- required?: boolean | undefined;
1091
- options?: {
1092
- label: string;
1093
- value: string;
1094
- }[] | undefined;
1095
- multiple?: boolean | undefined;
1096
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
1097
- accept?: string | undefined;
1098
- limit?: number | undefined;
1099
- activeText?: string | undefined;
1100
- inactiveText?: string | undefined;
1101
- activeValue?: any;
1102
- inactiveValue?: any;
1103
- };
1104
- } | {
1105
- id: string;
1106
- type: "title";
1107
- meta: {
1108
- createdAt: string;
1109
- updatedAt: string;
1110
- style: Record<string, unknown>;
1111
- };
1112
- props: {
1113
- label: string;
1114
- fontSize?: number | undefined;
1115
- bold?: boolean | undefined;
1116
- align?: "left" | "center" | "right" | undefined;
1117
- };
1118
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
1119
- id: string;
1120
- type: "table";
1121
- meta: {
1122
- createdAt: string;
1123
- updatedAt: string;
1124
- style: Record<string, unknown>;
1125
- };
1126
- props: {
1127
- label: string;
1128
- field: string;
1129
- columns: {
1130
- id: string;
1131
- label: string;
1132
- prop: string;
1133
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1134
- width?: number | undefined;
1135
- required?: boolean | undefined;
1136
- options?: /*elided*/ any[] | undefined;
1137
- multiple?: boolean | undefined;
1138
- format?: string | undefined;
1139
- valueFormat?: string | undefined;
1140
- placeholder?: string | undefined;
1141
- filterable?: boolean | undefined;
1142
- sortable?: boolean | undefined;
1143
- }[];
1144
- pagination: boolean;
1145
- pageSize: number;
1146
- enableExcelImport: boolean;
1147
- };
1148
- })[];
1149
- }[];
1150
- } | /*elided*/ any | {
1151
- id: string;
1152
- type: "table";
1153
- meta: {
1154
- createdAt: string;
1155
- updatedAt: string;
1156
- style: Record<string, unknown>;
1157
- };
1158
- props: {
1159
- label: string;
1160
- field: string;
1161
- columns: {
1162
- id: string;
1163
- label: string;
1164
- prop: string;
1165
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1166
- width?: number | undefined;
1167
- required?: boolean | undefined;
1168
- options?: {
1169
- label: string;
1170
- value: string;
1171
- }[] | undefined;
1172
- multiple?: boolean | undefined;
1173
- format?: string | undefined;
1174
- valueFormat?: string | undefined;
1175
- placeholder?: string | undefined;
1176
- filterable?: boolean | undefined;
1177
- sortable?: boolean | undefined;
1178
- }[];
1179
- pagination: boolean;
1180
- pageSize: number;
1181
- enableExcelImport: boolean;
1182
- };
1183
- })[];
1184
- }[];
1185
- } | {
1186
- id: string;
1187
- type: "collapse";
1188
- meta: {
1189
- createdAt: string;
1190
- updatedAt: string;
1191
- style: Record<string, unknown>;
1192
- };
1193
- props: {
1194
- accordion: boolean;
1195
- };
1196
- items: {
1197
- id: string;
1198
- title: string;
1199
- name: string;
1200
- children: ({
1201
- id: string;
1202
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
1203
- meta: {
1204
- createdAt: string;
1205
- updatedAt: string;
1206
- style: Record<string, unknown>;
1207
- };
1208
- props: {
1209
- label: string;
1210
- field: string;
1211
- placeholder?: string | undefined;
1212
- required?: boolean | undefined;
1213
- options?: {
1214
- label: string;
1215
- value: string;
1216
- }[] | undefined;
1217
- multiple?: boolean | undefined;
1218
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
1219
- accept?: string | undefined;
1220
- limit?: number | undefined;
1221
- activeText?: string | undefined;
1222
- inactiveText?: string | undefined;
1223
- activeValue?: any;
1224
- inactiveValue?: any;
1225
- };
1226
- } | {
1227
- id: string;
1228
- type: "title";
1229
- meta: {
1230
- createdAt: string;
1231
- updatedAt: string;
1232
- style: Record<string, unknown>;
1233
- };
1234
- props: {
1235
- label: string;
1236
- fontSize?: number | undefined;
1237
- bold?: boolean | undefined;
1238
- align?: "left" | "center" | "right" | undefined;
1239
- };
1240
- } | {
1241
- id: string;
1242
- type: "flexRow";
1243
- meta: {
1244
- createdAt: string;
1245
- updatedAt: string;
1246
- style: Record<string, unknown>;
1247
- };
1248
- props: {
1249
- cols: 1 | 2 | 3 | 4;
1250
- gap?: number | undefined;
1251
- };
1252
- columns: {
1253
- id: string;
1254
- children: ({
1255
- id: string;
1256
- type: Exclude<NodeType, "flexRow" | "collapse" | "tabs" | "table" | "title">;
1257
- meta: {
1258
- createdAt: string;
1259
- updatedAt: string;
1260
- style: Record<string, unknown>;
1261
- };
1262
- props: {
1263
- label: string;
1264
- field: string;
1265
- placeholder?: string | undefined;
1266
- required?: boolean | undefined;
1267
- options?: {
1268
- label: string;
1269
- value: string;
1270
- }[] | undefined;
1271
- multiple?: boolean | undefined;
1272
- inputType?: "text" | "number" | "date" | "time" | "datetime" | undefined;
1273
- accept?: string | undefined;
1274
- limit?: number | undefined;
1275
- activeText?: string | undefined;
1276
- inactiveText?: string | undefined;
1277
- activeValue?: any;
1278
- inactiveValue?: any;
1279
- };
1280
- } | {
1281
- id: string;
1282
- type: "title";
1283
- meta: {
1284
- createdAt: string;
1285
- updatedAt: string;
1286
- style: Record<string, unknown>;
1287
- };
1288
- props: {
1289
- label: string;
1290
- fontSize?: number | undefined;
1291
- bold?: boolean | undefined;
1292
- align?: "left" | "center" | "right" | undefined;
1293
- };
1294
- } | /*elided*/ any | /*elided*/ any | /*elided*/ any | {
1295
- id: string;
1296
- type: "table";
1297
- meta: {
1298
- createdAt: string;
1299
- updatedAt: string;
1300
- style: Record<string, unknown>;
1301
- };
1302
- props: {
1303
- label: string;
1304
- field: string;
1305
- columns: {
1306
- id: string;
1307
- label: string;
1308
- prop: string;
1309
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1310
- width?: number | undefined;
1311
- required?: boolean | undefined;
1312
- options?: /*elided*/ any[] | undefined;
1313
- multiple?: boolean | undefined;
1314
- format?: string | undefined;
1315
- valueFormat?: string | undefined;
1316
- placeholder?: string | undefined;
1317
- filterable?: boolean | undefined;
1318
- sortable?: boolean | undefined;
1319
- }[];
1320
- pagination: boolean;
1321
- pageSize: number;
1322
- enableExcelImport: boolean;
1323
- };
1324
- })[];
1325
- }[];
1326
- } | /*elided*/ any | /*elided*/ any | {
1327
- id: string;
1328
- type: "table";
1329
- meta: {
1330
- createdAt: string;
1331
- updatedAt: string;
1332
- style: Record<string, unknown>;
1333
- };
1334
- props: {
1335
- label: string;
1336
- field: string;
1337
- columns: {
1338
- id: string;
1339
- label: string;
1340
- prop: string;
1341
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1342
- width?: number | undefined;
1343
- required?: boolean | undefined;
1344
- options?: {
1345
- label: string;
1346
- value: string;
1347
- }[] | undefined;
1348
- multiple?: boolean | undefined;
1349
- format?: string | undefined;
1350
- valueFormat?: string | undefined;
1351
- placeholder?: string | undefined;
1352
- filterable?: boolean | undefined;
1353
- sortable?: boolean | undefined;
1354
- }[];
1355
- pagination: boolean;
1356
- pageSize: number;
1357
- enableExcelImport: boolean;
1358
- };
1359
- })[];
1360
- }[];
1361
- } | /*elided*/ any | {
1362
- id: string;
1363
- type: "table";
1364
- meta: {
1365
- createdAt: string;
1366
- updatedAt: string;
1367
- style: Record<string, unknown>;
1368
- };
1369
- props: {
1370
- label: string;
1371
- field: string;
1372
- columns: {
1373
- id: string;
1374
- label: string;
1375
- prop: string;
1376
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1377
- width?: number | undefined;
1378
- required?: boolean | undefined;
1379
- options?: {
1380
- label: string;
1381
- value: string;
1382
- }[] | undefined;
1383
- multiple?: boolean | undefined;
1384
- format?: string | undefined;
1385
- valueFormat?: string | undefined;
1386
- placeholder?: string | undefined;
1387
- filterable?: boolean | undefined;
1388
- sortable?: boolean | undefined;
1389
- }[];
1390
- pagination: boolean;
1391
- pageSize: number;
1392
- enableExcelImport: boolean;
1393
- };
1394
- })[];
1395
- }[];
1396
- } | {
1397
- id: string;
1398
- type: "table";
1399
- meta: {
1400
- createdAt: string;
1401
- updatedAt: string;
1402
- style: Record<string, unknown>;
1403
- };
1404
- props: {
1405
- label: string;
1406
- field: string;
1407
- columns: {
1408
- id: string;
1409
- label: string;
1410
- prop: string;
1411
- type: "text" | "number" | "select" | "date" | "time" | "datetime" | "month";
1412
- width?: number | undefined;
1413
- required?: boolean | undefined;
1414
- options?: {
1415
- label: string;
1416
- value: string;
1417
- }[] | undefined;
1418
- multiple?: boolean | undefined;
1419
- format?: string | undefined;
1420
- valueFormat?: string | undefined;
1421
- placeholder?: string | undefined;
1422
- filterable?: boolean | undefined;
1423
- sortable?: boolean | undefined;
1424
- }[];
1425
- pagination: boolean;
1426
- pageSize: number;
1427
- enableExcelImport: boolean;
1428
- };
1429
- })[];
53
+ children: /*elided*/ any[];
54
+ }[] | undefined;
55
+ }[];
1430
56
  };
1431
57
  }>;
1432
- history: {
1433
- canUndo: import('vue').ComputedRef<boolean>;
1434
- canRedo: import('vue').ComputedRef<boolean>;
1435
- undo: () => void;
1436
- redo: () => void;
1437
- };
1438
58
  selection: {
1439
59
  selectedNodeId: import('vue').Ref<string | null, string | null>;
1440
60
  };
1441
61
  drag: {
1442
62
  dragging: import('vue').Ref<{
1443
63
  kind: "palette";
1444
- nodeType: NodeType;
64
+ nodeType: string;
1445
65
  preset?: Record<string, unknown> | undefined;
1446
66
  } | {
1447
67
  kind: "node";
1448
68
  nodeId: string;
1449
69
  } | null, DragItem | {
1450
70
  kind: "palette";
1451
- nodeType: NodeType;
71
+ nodeType: string;
1452
72
  preset?: Record<string, unknown> | undefined;
1453
73
  } | {
1454
74
  kind: "node";
@@ -1503,19 +123,24 @@ export declare function useDesignerState(): {
1503
123
  };
1504
124
  formData: import('vue').Ref<FormDataModel, FormDataModel>;
1505
125
  select: typeof select;
1506
- beginPaletteDrag: typeof beginPaletteDrag;
1507
- beginNodeDrag: typeof beginNodeDrag;
1508
- setHover: typeof setHover;
126
+ beginPaletteDrag: (nodeType: NodeType, ev: PointerEvent) => void;
127
+ beginNodeDrag: (nodeId: string, ev: PointerEvent) => void;
128
+ setHover: (target: DropTarget | null) => void;
1509
129
  applySchema: typeof applySchema;
1510
130
  removeSelected: typeof removeSelected;
1511
131
  updateNodeProps: typeof updateNodeProps;
1512
132
  updateFlexCols: typeof updateFlexCols;
133
+ updateFlexColWidth: typeof updateFlexColWidth;
1513
134
  updateCollapse: typeof updateCollapse;
1514
135
  updateTabs: typeof updateTabs;
1515
- bindHotkeys: typeof bindHotkeys;
136
+ bindHotkeys: () => void;
1516
137
  loadAutoSave: typeof loadAutoSave;
1517
138
  setFormData: typeof setFormData;
1518
139
  exportFormData: typeof exportFormData;
1519
140
  importFormData: typeof importFormData;
141
+ undo: typeof undo;
142
+ redo: typeof redo;
143
+ canUndo: import('vue').ComputedRef<boolean>;
144
+ canRedo: import('vue').ComputedRef<boolean>;
1520
145
  };
1521
146
  export {};