@12-apps/ui 6.17.0 → 6.17.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 (64) hide show
  1. package/dist/_internal/components/data-display/DataViews/DataViewsGrid.js +7 -7
  2. package/dist/_internal/components/data-display/DataViews/DataViewsTableBase.js +8 -8
  3. package/dist/_internal/components/data-display/DataViews/data-views-category-pill.js +3 -3
  4. package/dist/_internal/components/data-display/DataViews/data-views-filter-panel.js +4 -4
  5. package/dist/_internal/components/data-display/DataViews/data-views-grid-parts.js +6 -6
  6. package/dist/_internal/components/data-display/DataViews/data-views-inline-bar.js +4 -4
  7. package/dist/_internal/components/form/CategorySelect/CategorySelect.js +2 -2
  8. package/dist/_internal/components/form/CepField/CepField.js +2 -2
  9. package/dist/_internal/components/form/CreatableSelect/CreatableSelect.js +2 -2
  10. package/dist/_internal/components/form/Form/Form.js +1 -1
  11. package/dist/_internal/components/form/index.js +2 -2
  12. package/dist/_internal/components/form/total-form/Fields/CategoryField.js +3 -3
  13. package/dist/_internal/components/form/total-form/Fields/CepField.js +3 -3
  14. package/dist/_internal/components/form/total-form/Fields/SelectField.js +2 -2
  15. package/dist/_internal/components/form/total-form/Fields/TextField.js +2 -2
  16. package/dist/_internal/components/form/total-form/Fields/ToggleField.js +2 -2
  17. package/dist/_internal/components/form/total-form/Fields/index.js +9 -9
  18. package/dist/_internal/components/form/total-form/FormContainer.js +2 -2
  19. package/dist/_internal/components/index.js +2 -2
  20. package/dist/{chunk-3ORFVLI3.js → chunk-37YPZHAG.js} +2 -2
  21. package/dist/{chunk-DGMR3IMM.js → chunk-CBPQJAHX.js} +2 -2
  22. package/dist/{chunk-ENK4XGKF.js → chunk-CLNTJM3F.js} +2 -2
  23. package/dist/{chunk-OK5BHFZE.js → chunk-E6OILRUU.js} +2 -2
  24. package/dist/{chunk-O3OU2PPT.js → chunk-ES2RN7YV.js} +2 -2
  25. package/dist/{chunk-RX6DWIIW.js → chunk-FWCUELBU.js} +2 -2
  26. package/dist/{chunk-QETBO7EC.js → chunk-GCJLMX63.js} +2 -2
  27. package/dist/{chunk-VZO7VREP.js → chunk-IPPTOL53.js} +2 -2
  28. package/dist/chunk-IPPTOL53.js.map +1 -0
  29. package/dist/{chunk-LIQHOLDQ.js → chunk-LYMAMKJT.js} +2 -2
  30. package/dist/{chunk-TPUIIZN2.js → chunk-MD6T7MDT.js} +3 -3
  31. package/dist/{chunk-LUWATXU4.js → chunk-OAXAF4VY.js} +2 -2
  32. package/dist/{chunk-45N6LXUU.js → chunk-OI3HOI74.js} +2 -2
  33. package/dist/{chunk-TUAIPMU7.js → chunk-SRMWCN5D.js} +2 -2
  34. package/dist/{chunk-WFX5GASM.js → chunk-VOOPGAQO.js} +2 -2
  35. package/dist/{chunk-PLK7UGO6.js → chunk-WME2F2YY.js} +2 -2
  36. package/dist/{chunk-EE2LBAJH.js → chunk-WPR2HS5B.js} +6 -6
  37. package/dist/{chunk-KNNBIXWJ.js → chunk-ZBOFBRZC.js} +2 -2
  38. package/dist/data-display/DataViews.js +8 -8
  39. package/dist/form/CategorySelect.js +2 -2
  40. package/dist/form/CepField.js +2 -2
  41. package/dist/form/CreatableSelect.js +2 -2
  42. package/dist/form/Form.js +1 -1
  43. package/dist/form/total-form.js +10 -10
  44. package/dist/types/components/form/Form/Form.d.ts.map +1 -1
  45. package/package.json +1 -1
  46. package/src/components/form/Form/Form.md +46 -1
  47. package/src/components/form/Form/Form.tsx +40 -1
  48. package/dist/chunk-VZO7VREP.js.map +0 -1
  49. /package/dist/{chunk-3ORFVLI3.js.map → chunk-37YPZHAG.js.map} +0 -0
  50. /package/dist/{chunk-DGMR3IMM.js.map → chunk-CBPQJAHX.js.map} +0 -0
  51. /package/dist/{chunk-ENK4XGKF.js.map → chunk-CLNTJM3F.js.map} +0 -0
  52. /package/dist/{chunk-OK5BHFZE.js.map → chunk-E6OILRUU.js.map} +0 -0
  53. /package/dist/{chunk-O3OU2PPT.js.map → chunk-ES2RN7YV.js.map} +0 -0
  54. /package/dist/{chunk-RX6DWIIW.js.map → chunk-FWCUELBU.js.map} +0 -0
  55. /package/dist/{chunk-QETBO7EC.js.map → chunk-GCJLMX63.js.map} +0 -0
  56. /package/dist/{chunk-LIQHOLDQ.js.map → chunk-LYMAMKJT.js.map} +0 -0
  57. /package/dist/{chunk-TPUIIZN2.js.map → chunk-MD6T7MDT.js.map} +0 -0
  58. /package/dist/{chunk-LUWATXU4.js.map → chunk-OAXAF4VY.js.map} +0 -0
  59. /package/dist/{chunk-45N6LXUU.js.map → chunk-OI3HOI74.js.map} +0 -0
  60. /package/dist/{chunk-TUAIPMU7.js.map → chunk-SRMWCN5D.js.map} +0 -0
  61. /package/dist/{chunk-WFX5GASM.js.map → chunk-VOOPGAQO.js.map} +0 -0
  62. /package/dist/{chunk-PLK7UGO6.js.map → chunk-WME2F2YY.js.map} +0 -0
  63. /package/dist/{chunk-EE2LBAJH.js.map → chunk-WPR2HS5B.js.map} +0 -0
  64. /package/dist/{chunk-KNNBIXWJ.js.map → chunk-ZBOFBRZC.js.map} +0 -0
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
  import {
3
3
  DataViewsGrid
4
- } from "../../../../chunk-PLK7UGO6.js";
5
- import "../../../../chunk-TPUIIZN2.js";
6
- import "../../../../chunk-ENK4XGKF.js";
4
+ } from "../../../../chunk-WME2F2YY.js";
5
+ import "../../../../chunk-MD6T7MDT.js";
6
+ import "../../../../chunk-CLNTJM3F.js";
7
7
  import "../../../../chunk-4Y65Q3CR.js";
8
- import "../../../../chunk-DGMR3IMM.js";
8
+ import "../../../../chunk-CBPQJAHX.js";
9
9
  import "../../../../chunk-5WNQJ5KS.js";
10
- import "../../../../chunk-O3OU2PPT.js";
10
+ import "../../../../chunk-ES2RN7YV.js";
11
11
  import "../../../../chunk-A4YWFX5C.js";
12
12
  import "../../../../chunk-ELYLG4F7.js";
13
13
  import "../../../../chunk-3DQP6OPC.js";
@@ -73,7 +73,7 @@ import "../../../../chunk-XJKMH3RX.js";
73
73
  import "../../../../chunk-D2HKCPEH.js";
74
74
  import "../../../../chunk-UCU5FCYE.js";
75
75
  import "../../../../chunk-N5ZWC6CB.js";
76
- import "../../../../chunk-LUWATXU4.js";
76
+ import "../../../../chunk-OAXAF4VY.js";
77
77
  import "../../../../chunk-MHFJBNDP.js";
78
78
  import "../../../../chunk-PU3AAKRR.js";
79
79
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -90,7 +90,7 @@ import "../../../../chunk-ZBNTFWTG.js";
90
90
  import "../../../../chunk-DMNZD3Q7.js";
91
91
  import "../../../../chunk-FCOEJCUP.js";
92
92
  import "../../../../chunk-C3UKR3NT.js";
93
- import "../../../../chunk-VZO7VREP.js";
93
+ import "../../../../chunk-IPPTOL53.js";
94
94
  import "../../../../chunk-CN46HGXE.js";
95
95
  import "../../../../chunk-YRUCIKPO.js";
96
96
  import "../../../../chunk-JN3PGXRJ.js";
@@ -1,16 +1,16 @@
1
1
  "use client";
2
2
  import {
3
3
  DataViewsTableBase
4
- } from "../../../../chunk-TUAIPMU7.js";
5
- import "../../../../chunk-PLK7UGO6.js";
4
+ } from "../../../../chunk-SRMWCN5D.js";
5
+ import "../../../../chunk-WME2F2YY.js";
6
6
  import "../../../../chunk-HEDOL2RV.js";
7
7
  import "../../../../chunk-ZOLAYP2D.js";
8
- import "../../../../chunk-TPUIIZN2.js";
9
- import "../../../../chunk-ENK4XGKF.js";
8
+ import "../../../../chunk-MD6T7MDT.js";
9
+ import "../../../../chunk-CLNTJM3F.js";
10
10
  import "../../../../chunk-4Y65Q3CR.js";
11
- import "../../../../chunk-DGMR3IMM.js";
11
+ import "../../../../chunk-CBPQJAHX.js";
12
12
  import "../../../../chunk-5WNQJ5KS.js";
13
- import "../../../../chunk-O3OU2PPT.js";
13
+ import "../../../../chunk-ES2RN7YV.js";
14
14
  import "../../../../chunk-A4YWFX5C.js";
15
15
  import "../../../../chunk-ELYLG4F7.js";
16
16
  import "../../../../chunk-3DQP6OPC.js";
@@ -88,7 +88,7 @@ import "../../../../chunk-XJKMH3RX.js";
88
88
  import "../../../../chunk-D2HKCPEH.js";
89
89
  import "../../../../chunk-UCU5FCYE.js";
90
90
  import "../../../../chunk-N5ZWC6CB.js";
91
- import "../../../../chunk-LUWATXU4.js";
91
+ import "../../../../chunk-OAXAF4VY.js";
92
92
  import "../../../../chunk-MHFJBNDP.js";
93
93
  import "../../../../chunk-PU3AAKRR.js";
94
94
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -109,7 +109,7 @@ import "../../../../chunk-M3RIC6JI.js";
109
109
  import "../../../../chunk-RMSH2I3O.js";
110
110
  import "../../../../chunk-SL6454K7.js";
111
111
  import "../../../../chunk-C3UKR3NT.js";
112
- import "../../../../chunk-VZO7VREP.js";
112
+ import "../../../../chunk-IPPTOL53.js";
113
113
  import "../../../../chunk-KFJKOVDD.js";
114
114
  import "../../../../chunk-S5LE2ARG.js";
115
115
  import "../../../../chunk-6PRA45LC.js";
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  PillControl,
4
4
  emitPillDiff
5
- } from "../../../../chunk-O3OU2PPT.js";
5
+ } from "../../../../chunk-ES2RN7YV.js";
6
6
  import "../../../../chunk-KHG57NAE.js";
7
7
  import "../../../../chunk-MOLQGQEQ.js";
8
8
  import "../../../../chunk-TSPHRZ4U.js";
@@ -14,7 +14,7 @@ import "../../../../chunk-4T6W43TO.js";
14
14
  import "../../../../chunk-YB6MDGPR.js";
15
15
  import "../../../../chunk-LVCUJ7YU.js";
16
16
  import "../../../../chunk-N5ZWC6CB.js";
17
- import "../../../../chunk-LUWATXU4.js";
17
+ import "../../../../chunk-OAXAF4VY.js";
18
18
  import "../../../../chunk-MHFJBNDP.js";
19
19
  import "../../../../chunk-PU3AAKRR.js";
20
20
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -31,7 +31,7 @@ import "../../../../chunk-ZBNTFWTG.js";
31
31
  import "../../../../chunk-DMNZD3Q7.js";
32
32
  import "../../../../chunk-FCOEJCUP.js";
33
33
  import "../../../../chunk-C3UKR3NT.js";
34
- import "../../../../chunk-VZO7VREP.js";
34
+ import "../../../../chunk-IPPTOL53.js";
35
35
  import "../../../../chunk-MLOWPVVW.js";
36
36
  import "../../../../chunk-MFU4Y25U.js";
37
37
  import "../../../../chunk-PZ5AY32C.js";
@@ -2,8 +2,8 @@
2
2
  import {
3
3
  FilterDialog,
4
4
  GridFilterPanel
5
- } from "../../../../chunk-ENK4XGKF.js";
6
- import "../../../../chunk-O3OU2PPT.js";
5
+ } from "../../../../chunk-CLNTJM3F.js";
6
+ import "../../../../chunk-ES2RN7YV.js";
7
7
  import "../../../../chunk-QZBUGUOY.js";
8
8
  import "../../../../chunk-F4RR4666.js";
9
9
  import "../../../../chunk-FV36LFPX.js";
@@ -24,7 +24,7 @@ import "../../../../chunk-YB6MDGPR.js";
24
24
  import "../../../../chunk-LVCUJ7YU.js";
25
25
  import "../../../../chunk-UCU5FCYE.js";
26
26
  import "../../../../chunk-N5ZWC6CB.js";
27
- import "../../../../chunk-LUWATXU4.js";
27
+ import "../../../../chunk-OAXAF4VY.js";
28
28
  import "../../../../chunk-MHFJBNDP.js";
29
29
  import "../../../../chunk-PU3AAKRR.js";
30
30
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -41,7 +41,7 @@ import "../../../../chunk-ZBNTFWTG.js";
41
41
  import "../../../../chunk-DMNZD3Q7.js";
42
42
  import "../../../../chunk-FCOEJCUP.js";
43
43
  import "../../../../chunk-C3UKR3NT.js";
44
- import "../../../../chunk-VZO7VREP.js";
44
+ import "../../../../chunk-IPPTOL53.js";
45
45
  import "../../../../chunk-CN46HGXE.js";
46
46
  import "../../../../chunk-YRUCIKPO.js";
47
47
  import "../../../../chunk-JN3PGXRJ.js";
@@ -1,12 +1,12 @@
1
1
  "use client";
2
2
  import {
3
3
  GridShell
4
- } from "../../../../chunk-TPUIIZN2.js";
5
- import "../../../../chunk-ENK4XGKF.js";
4
+ } from "../../../../chunk-MD6T7MDT.js";
5
+ import "../../../../chunk-CLNTJM3F.js";
6
6
  import "../../../../chunk-4Y65Q3CR.js";
7
- import "../../../../chunk-DGMR3IMM.js";
7
+ import "../../../../chunk-CBPQJAHX.js";
8
8
  import "../../../../chunk-5WNQJ5KS.js";
9
- import "../../../../chunk-O3OU2PPT.js";
9
+ import "../../../../chunk-ES2RN7YV.js";
10
10
  import "../../../../chunk-A4YWFX5C.js";
11
11
  import "../../../../chunk-ELYLG4F7.js";
12
12
  import "../../../../chunk-3DQP6OPC.js";
@@ -66,7 +66,7 @@ import "../../../../chunk-XJKMH3RX.js";
66
66
  import "../../../../chunk-D2HKCPEH.js";
67
67
  import "../../../../chunk-UCU5FCYE.js";
68
68
  import "../../../../chunk-N5ZWC6CB.js";
69
- import "../../../../chunk-LUWATXU4.js";
69
+ import "../../../../chunk-OAXAF4VY.js";
70
70
  import "../../../../chunk-MHFJBNDP.js";
71
71
  import "../../../../chunk-PU3AAKRR.js";
72
72
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -83,7 +83,7 @@ import "../../../../chunk-ZBNTFWTG.js";
83
83
  import "../../../../chunk-DMNZD3Q7.js";
84
84
  import "../../../../chunk-FCOEJCUP.js";
85
85
  import "../../../../chunk-C3UKR3NT.js";
86
- import "../../../../chunk-VZO7VREP.js";
86
+ import "../../../../chunk-IPPTOL53.js";
87
87
  import "../../../../chunk-CN46HGXE.js";
88
88
  import "../../../../chunk-YRUCIKPO.js";
89
89
  import "../../../../chunk-JN3PGXRJ.js";
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  import {
3
3
  InlineFilterControls
4
- } from "../../../../chunk-DGMR3IMM.js";
4
+ } from "../../../../chunk-CBPQJAHX.js";
5
5
  import "../../../../chunk-5WNQJ5KS.js";
6
- import "../../../../chunk-O3OU2PPT.js";
6
+ import "../../../../chunk-ES2RN7YV.js";
7
7
  import "../../../../chunk-6TYSEAAT.js";
8
8
  import "../../../../chunk-24LW52EU.js";
9
9
  import "../../../../chunk-A7Q5AQVD.js";
@@ -27,7 +27,7 @@ import "../../../../chunk-YB6MDGPR.js";
27
27
  import "../../../../chunk-LVCUJ7YU.js";
28
28
  import "../../../../chunk-UCU5FCYE.js";
29
29
  import "../../../../chunk-N5ZWC6CB.js";
30
- import "../../../../chunk-LUWATXU4.js";
30
+ import "../../../../chunk-OAXAF4VY.js";
31
31
  import "../../../../chunk-MHFJBNDP.js";
32
32
  import "../../../../chunk-PU3AAKRR.js";
33
33
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -44,7 +44,7 @@ import "../../../../chunk-ZBNTFWTG.js";
44
44
  import "../../../../chunk-DMNZD3Q7.js";
45
45
  import "../../../../chunk-FCOEJCUP.js";
46
46
  import "../../../../chunk-C3UKR3NT.js";
47
- import "../../../../chunk-VZO7VREP.js";
47
+ import "../../../../chunk-IPPTOL53.js";
48
48
  import "../../../../chunk-MLOWPVVW.js";
49
49
  import "../../../../chunk-6DPAWXZ3.js";
50
50
  import "../../../../chunk-VUHLNYAE.js";
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  CategorySelect
4
- } from "../../../../chunk-LUWATXU4.js";
4
+ } from "../../../../chunk-OAXAF4VY.js";
5
5
  import "../../../../chunk-MHFJBNDP.js";
6
6
  import "../../../../chunk-PU3AAKRR.js";
7
7
  import "../../../../chunk-ZUIJ3N7N.js";
@@ -18,7 +18,7 @@ import "../../../../chunk-ZBNTFWTG.js";
18
18
  import "../../../../chunk-DMNZD3Q7.js";
19
19
  import "../../../../chunk-FCOEJCUP.js";
20
20
  import "../../../../chunk-C3UKR3NT.js";
21
- import "../../../../chunk-VZO7VREP.js";
21
+ import "../../../../chunk-IPPTOL53.js";
22
22
  import "../../../../chunk-MLOWPVVW.js";
23
23
  import "../../../../chunk-MFU4Y25U.js";
24
24
  import "../../../../chunk-PZ5AY32C.js";
@@ -2,13 +2,13 @@
2
2
  import {
3
3
  CepField,
4
4
  CepField_default
5
- } from "../../../../chunk-RX6DWIIW.js";
5
+ } from "../../../../chunk-FWCUELBU.js";
6
6
  import "../../../../chunk-QYKDY4EI.js";
7
7
  import "../../../../chunk-M3RIC6JI.js";
8
8
  import "../../../../chunk-RMSH2I3O.js";
9
9
  import "../../../../chunk-SL6454K7.js";
10
10
  import "../../../../chunk-C3UKR3NT.js";
11
- import "../../../../chunk-VZO7VREP.js";
11
+ import "../../../../chunk-IPPTOL53.js";
12
12
  import "../../../../chunk-MLOWPVVW.js";
13
13
  import "../../../../chunk-HPK33ACY.js";
14
14
  import "../../../../chunk-PZ5AY32C.js";
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  import {
3
3
  CreatableSelect
4
- } from "../../../../chunk-45N6LXUU.js";
4
+ } from "../../../../chunk-OI3HOI74.js";
5
5
  import "../../../../chunk-C3UKR3NT.js";
6
- import "../../../../chunk-VZO7VREP.js";
6
+ import "../../../../chunk-IPPTOL53.js";
7
7
  import "../../../../chunk-MLOWPVVW.js";
8
8
  import "../../../../chunk-MFU4Y25U.js";
9
9
  import "../../../../chunk-PZ5AY32C.js";
@@ -4,7 +4,7 @@ import {
4
4
  FormField,
5
5
  FormLabel,
6
6
  FormMessage
7
- } from "../../../../chunk-VZO7VREP.js";
7
+ } from "../../../../chunk-IPPTOL53.js";
8
8
  import "../../../../chunk-PZ5AY32C.js";
9
9
  export {
10
10
  Form,
@@ -111,7 +111,7 @@ import "../../../chunk-TERT6TIS.js";
111
111
  import "../../../chunk-6XLMTOJ3.js";
112
112
  import {
113
113
  CepField
114
- } from "../../../chunk-RX6DWIIW.js";
114
+ } from "../../../chunk-FWCUELBU.js";
115
115
  import "../../../chunk-JEBPCAWD.js";
116
116
  import {
117
117
  CodeEditor
@@ -192,7 +192,7 @@ import {
192
192
  FormField,
193
193
  FormLabel,
194
194
  FormMessage
195
- } from "../../../chunk-VZO7VREP.js";
195
+ } from "../../../chunk-IPPTOL53.js";
196
196
  import "../../../chunk-MLOWPVVW.js";
197
197
  import "../../../chunk-BA4RHQ3B.js";
198
198
  import {
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  CategoryField
4
- } from "../../../../../chunk-QETBO7EC.js";
4
+ } from "../../../../../chunk-GCJLMX63.js";
5
5
  import "../../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../../chunk-N5ZWC6CB.js";
7
- import "../../../../../chunk-LUWATXU4.js";
7
+ import "../../../../../chunk-OAXAF4VY.js";
8
8
  import "../../../../../chunk-MHFJBNDP.js";
9
9
  import "../../../../../chunk-PU3AAKRR.js";
10
10
  import "../../../../../chunk-ZUIJ3N7N.js";
@@ -21,7 +21,7 @@ import "../../../../../chunk-ZBNTFWTG.js";
21
21
  import "../../../../../chunk-DMNZD3Q7.js";
22
22
  import "../../../../../chunk-FCOEJCUP.js";
23
23
  import "../../../../../chunk-C3UKR3NT.js";
24
- import "../../../../../chunk-VZO7VREP.js";
24
+ import "../../../../../chunk-IPPTOL53.js";
25
25
  import "../../../../../chunk-MLOWPVVW.js";
26
26
  import "../../../../../chunk-MFU4Y25U.js";
27
27
  import "../../../../../chunk-PZ5AY32C.js";
@@ -1,16 +1,16 @@
1
1
  "use client";
2
2
  import {
3
3
  CepField
4
- } from "../../../../../chunk-WFX5GASM.js";
4
+ } from "../../../../../chunk-VOOPGAQO.js";
5
5
  import "../../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../../chunk-6XLMTOJ3.js";
7
- import "../../../../../chunk-RX6DWIIW.js";
7
+ import "../../../../../chunk-FWCUELBU.js";
8
8
  import "../../../../../chunk-QYKDY4EI.js";
9
9
  import "../../../../../chunk-M3RIC6JI.js";
10
10
  import "../../../../../chunk-RMSH2I3O.js";
11
11
  import "../../../../../chunk-SL6454K7.js";
12
12
  import "../../../../../chunk-C3UKR3NT.js";
13
- import "../../../../../chunk-VZO7VREP.js";
13
+ import "../../../../../chunk-IPPTOL53.js";
14
14
  import "../../../../../chunk-MLOWPVVW.js";
15
15
  import "../../../../../chunk-HPK33ACY.js";
16
16
  import "../../../../../chunk-PZ5AY32C.js";
@@ -1,12 +1,12 @@
1
1
  "use client";
2
2
  import {
3
3
  SelectField
4
- } from "../../../../../chunk-3ORFVLI3.js";
4
+ } from "../../../../../chunk-37YPZHAG.js";
5
5
  import "../../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../../chunk-II3YNC5S.js";
7
7
  import "../../../../../chunk-VSLUFBMT.js";
8
8
  import "../../../../../chunk-C3UKR3NT.js";
9
- import "../../../../../chunk-VZO7VREP.js";
9
+ import "../../../../../chunk-IPPTOL53.js";
10
10
  import "../../../../../chunk-MLOWPVVW.js";
11
11
  import "../../../../../chunk-PZ5AY32C.js";
12
12
  export {
@@ -1,14 +1,14 @@
1
1
  "use client";
2
2
  import {
3
3
  TextField
4
- } from "../../../../../chunk-KNNBIXWJ.js";
4
+ } from "../../../../../chunk-ZBOFBRZC.js";
5
5
  import "../../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../../chunk-QYKDY4EI.js";
7
7
  import "../../../../../chunk-M3RIC6JI.js";
8
8
  import "../../../../../chunk-RMSH2I3O.js";
9
9
  import "../../../../../chunk-SL6454K7.js";
10
10
  import "../../../../../chunk-C3UKR3NT.js";
11
- import "../../../../../chunk-VZO7VREP.js";
11
+ import "../../../../../chunk-IPPTOL53.js";
12
12
  import "../../../../../chunk-MLOWPVVW.js";
13
13
  import "../../../../../chunk-HPK33ACY.js";
14
14
  import "../../../../../chunk-PZ5AY32C.js";
@@ -1,12 +1,12 @@
1
1
  "use client";
2
2
  import {
3
3
  ToggleField
4
- } from "../../../../../chunk-LIQHOLDQ.js";
4
+ } from "../../../../../chunk-LYMAMKJT.js";
5
5
  import "../../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../../chunk-ONMSTW4B.js";
7
7
  import "../../../../../chunk-A7LG3AXV.js";
8
8
  import "../../../../../chunk-C3UKR3NT.js";
9
- import "../../../../../chunk-VZO7VREP.js";
9
+ import "../../../../../chunk-IPPTOL53.js";
10
10
  import "../../../../../chunk-PZ5AY32C.js";
11
11
  export {
12
12
  ToggleField
@@ -1,28 +1,28 @@
1
- import "../../../../../chunk-EE2LBAJH.js";
1
+ import "../../../../../chunk-WPR2HS5B.js";
2
2
  import {
3
3
  CepField
4
- } from "../../../../../chunk-WFX5GASM.js";
4
+ } from "../../../../../chunk-VOOPGAQO.js";
5
5
  import {
6
6
  CategoryField
7
- } from "../../../../../chunk-QETBO7EC.js";
7
+ } from "../../../../../chunk-GCJLMX63.js";
8
8
  import {
9
9
  ToggleField
10
- } from "../../../../../chunk-LIQHOLDQ.js";
10
+ } from "../../../../../chunk-LYMAMKJT.js";
11
11
  import {
12
12
  TextField
13
- } from "../../../../../chunk-KNNBIXWJ.js";
13
+ } from "../../../../../chunk-ZBOFBRZC.js";
14
14
  import {
15
15
  SelectField
16
- } from "../../../../../chunk-3ORFVLI3.js";
16
+ } from "../../../../../chunk-37YPZHAG.js";
17
17
  import "../../../../../chunk-4XK6JQ4D.js";
18
18
  import "../../../../../chunk-ONMSTW4B.js";
19
19
  import "../../../../../chunk-A7LG3AXV.js";
20
20
  import "../../../../../chunk-II3YNC5S.js";
21
21
  import "../../../../../chunk-VSLUFBMT.js";
22
22
  import "../../../../../chunk-6XLMTOJ3.js";
23
- import "../../../../../chunk-RX6DWIIW.js";
23
+ import "../../../../../chunk-FWCUELBU.js";
24
24
  import "../../../../../chunk-N5ZWC6CB.js";
25
- import "../../../../../chunk-LUWATXU4.js";
25
+ import "../../../../../chunk-OAXAF4VY.js";
26
26
  import "../../../../../chunk-MHFJBNDP.js";
27
27
  import "../../../../../chunk-PU3AAKRR.js";
28
28
  import "../../../../../chunk-ZUIJ3N7N.js";
@@ -43,7 +43,7 @@ import "../../../../../chunk-M3RIC6JI.js";
43
43
  import "../../../../../chunk-RMSH2I3O.js";
44
44
  import "../../../../../chunk-SL6454K7.js";
45
45
  import "../../../../../chunk-C3UKR3NT.js";
46
- import "../../../../../chunk-VZO7VREP.js";
46
+ import "../../../../../chunk-IPPTOL53.js";
47
47
  import "../../../../../chunk-MLOWPVVW.js";
48
48
  import "../../../../../chunk-HPK33ACY.js";
49
49
  import "../../../../../chunk-MFU4Y25U.js";
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  FormContainer
4
- } from "../../../../chunk-OK5BHFZE.js";
4
+ } from "../../../../chunk-E6OILRUU.js";
5
5
  import "../../../../chunk-4XK6JQ4D.js";
6
6
  import "../../../../chunk-C3UKR3NT.js";
7
- import "../../../../chunk-VZO7VREP.js";
7
+ import "../../../../chunk-IPPTOL53.js";
8
8
  import "../../../../chunk-PZ5AY32C.js";
9
9
  export {
10
10
  FormContainer
@@ -300,7 +300,7 @@ import "../../chunk-TERT6TIS.js";
300
300
  import "../../chunk-6XLMTOJ3.js";
301
301
  import {
302
302
  CepField
303
- } from "../../chunk-RX6DWIIW.js";
303
+ } from "../../chunk-FWCUELBU.js";
304
304
  import "../../chunk-JEBPCAWD.js";
305
305
  import {
306
306
  CodeEditor
@@ -567,7 +567,7 @@ import {
567
567
  FormField,
568
568
  FormLabel,
569
569
  FormMessage
570
- } from "../../chunk-VZO7VREP.js";
570
+ } from "../../chunk-IPPTOL53.js";
571
571
  import "../../chunk-KFJKOVDD.js";
572
572
  import {
573
573
  Dialog,
@@ -8,7 +8,7 @@ import {
8
8
  FormControl,
9
9
  FormLabel,
10
10
  FormMessage
11
- } from "./chunk-VZO7VREP.js";
11
+ } from "./chunk-IPPTOL53.js";
12
12
 
13
13
  // src/components/form/total-form/Fields/SelectField.tsx
14
14
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -36,4 +36,4 @@ function SelectField({ name, options, label, placeholder }) {
36
36
  export {
37
37
  SelectField
38
38
  };
39
- //# sourceMappingURL=chunk-3ORFVLI3.js.map
39
+ //# sourceMappingURL=chunk-37YPZHAG.js.map
@@ -4,7 +4,7 @@ import {
4
4
  } from "./chunk-5WNQJ5KS.js";
5
5
  import {
6
6
  PillControl
7
- } from "./chunk-O3OU2PPT.js";
7
+ } from "./chunk-ES2RN7YV.js";
8
8
  import {
9
9
  MoreFilters
10
10
  } from "./chunk-6TYSEAAT.js";
@@ -220,4 +220,4 @@ function FilterSlots({
220
220
  export {
221
221
  InlineFilterControls
222
222
  };
223
- //# sourceMappingURL=chunk-DGMR3IMM.js.map
223
+ //# sourceMappingURL=chunk-CBPQJAHX.js.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  PillControl
3
- } from "./chunk-O3OU2PPT.js";
3
+ } from "./chunk-ES2RN7YV.js";
4
4
  import {
5
5
  PanelRangeField
6
6
  } from "./chunk-QZBUGUOY.js";
@@ -154,4 +154,4 @@ export {
154
154
  GridFilterPanel,
155
155
  FilterDialog
156
156
  };
157
- //# sourceMappingURL=chunk-ENK4XGKF.js.map
157
+ //# sourceMappingURL=chunk-CLNTJM3F.js.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-4XK6JQ4D.js";
4
4
  import {
5
5
  Form
6
- } from "./chunk-VZO7VREP.js";
6
+ } from "./chunk-IPPTOL53.js";
7
7
 
8
8
  // src/components/form/total-form/FormContainer.tsx
9
9
  import { validateFields } from "@12-apps/forms-core";
@@ -55,4 +55,4 @@ function FormContainer({
55
55
  export {
56
56
  FormContainer
57
57
  };
58
- //# sourceMappingURL=chunk-OK5BHFZE.js.map
58
+ //# sourceMappingURL=chunk-E6OILRUU.js.map
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk-4T6W43TO.js";
7
7
  import {
8
8
  CategorySelect
9
- } from "./chunk-LUWATXU4.js";
9
+ } from "./chunk-OAXAF4VY.js";
10
10
 
11
11
  // src/components/data-display/DataViews/data-views-category-pill.tsx
12
12
  import { jsx } from "react/jsx-runtime";
@@ -79,4 +79,4 @@ export {
79
79
  emitPillDiff,
80
80
  PillControl
81
81
  };
82
- //# sourceMappingURL=chunk-O3OU2PPT.js.map
82
+ //# sourceMappingURL=chunk-ES2RN7YV.js.map
@@ -5,7 +5,7 @@ import {
5
5
  FormControl,
6
6
  FormLabel,
7
7
  FormMessage
8
- } from "./chunk-VZO7VREP.js";
8
+ } from "./chunk-IPPTOL53.js";
9
9
 
10
10
  // src/components/form/CepField/CepField.tsx
11
11
  import { useCallback, useEffect, useRef, useState } from "react";
@@ -122,4 +122,4 @@ export {
122
122
  CepField,
123
123
  CepField_default
124
124
  };
125
- //# sourceMappingURL=chunk-RX6DWIIW.js.map
125
+ //# sourceMappingURL=chunk-FWCUELBU.js.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-4XK6JQ4D.js";
4
4
  import {
5
5
  CategorySelect
6
- } from "./chunk-LUWATXU4.js";
6
+ } from "./chunk-OAXAF4VY.js";
7
7
 
8
8
  // src/components/form/total-form/Fields/CategoryField.tsx
9
9
  import { jsx } from "react/jsx-runtime";
@@ -38,4 +38,4 @@ function CategoryField({
38
38
  export {
39
39
  CategoryField
40
40
  };
41
- //# sourceMappingURL=chunk-QETBO7EC.js.map
41
+ //# sourceMappingURL=chunk-GCJLMX63.js.map
@@ -39,7 +39,7 @@ var StyledFormField = styled(Box, {
39
39
  display: variant === "horizontal" ? "grid" : "flex",
40
40
  flexDirection: variant === "horizontal" ? void 0 : "column",
41
41
  gridTemplateColumns: variant === "horizontal" ? "200px 1fr" : void 0,
42
- gap: theme.spacing(1),
42
+ columnGap: variant === "horizontal" ? theme.spacing(1) : void 0,
43
43
  alignItems: variant === "horizontal" ? "center" : void 0
44
44
  })
45
45
  );
@@ -109,4 +109,4 @@ export {
109
109
  FormControl,
110
110
  FormMessage
111
111
  };
112
- //# sourceMappingURL=chunk-VZO7VREP.js.map
112
+ //# sourceMappingURL=chunk-IPPTOL53.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/form/Form/Form.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n FormControlProps,\n FormFieldProps,\n FormLabelProps,\n FormMessageProps,\n FormProps,\n} from './Form.types';\n\nconst StyledForm = styled('form', {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: FormProps['variant'] }>(({ theme, variant }) => ({\n width: '100%',\n ...(variant === 'inline' && {\n display: 'flex',\n gap: theme.spacing(2),\n alignItems: 'flex-start',\n }),\n}));\n\nconst spacingMap = {\n xs: 1,\n sm: 2,\n md: 3,\n lg: 4,\n xl: 5,\n};\n\nconst maxWidthMap = {\n sm: '600px',\n md: '900px',\n lg: '1200px',\n xl: '1536px',\n full: '100%',\n};\n\nexport const Form = React.forwardRef<HTMLFormElement, FormProps>(\n ({ variant = 'vertical', maxWidth = 'full', spacing = 'md', children, dataTestId, ...props }, ref) => (\n <StyledForm ref={ref} variant={variant} role=\"form\" data-testid={dataTestId} {...props}>\n <Box sx={{ maxWidth: maxWidthMap[maxWidth], width: '100%' }}>\n {variant === 'inline' ? (\n children\n ) : (\n <Stack spacing={spacingMap[spacing]}>{children}</Stack>\n )}\n </Box>\n </StyledForm>\n ),\n);\n\nForm.displayName = 'Form';\n\n/**\n * NO ROW GAP HERE, and that is the fix rather than an omission.\n *\n * `FormLabel` already carries `marginBottom: theme.spacing(0.5)` — 4px — and it\n * carries it because it has to: every OTHER user of it (`CepField`,\n * `CategorySelect`, `CreatableSelect`, the three `total-form` fields, five of\n * `@12-apps/discounts`' builders and the host's own `currency-field`) puts a\n * bare `FormLabel` straight inside a `FormControl`, which is a plain block box\n * with no gap of its own. There, the label's own margin is the ONLY thing\n * between the label and the control.\n *\n * A `gap: theme.spacing(1)` here was a second mechanism for that one job, and in\n * a column the two ADD: 8px + 4px put `FormField` at 12px where every one of\n * those siblings sits at 4px. Measured in Chromium at 320x568 on a consuming\n * app's six-field delivery address form, the 8px a row it added pushed the\n * submit button from 561px to 609px — 41px below the fold of the smallest\n * supported phone, i.e. a checkout whose primary action is off-screen.\n *\n * That claim is about `FormLabel`'s own callers, not about the whole package:\n * `Textarea` labels its control through MUI's `InputLabel` at\n * `theme.spacing(1)` and still draws 8px. It composes nothing out of\n * `FormLabel`, so it is a separate inconsistency rather than a reason to keep\n * a second spacing here.\n *\n * ## The `columnGap` is scaffolding, and currently unreachable\n *\n * `FormFieldProps` has no `variant` and `FormField` passes none, so `variant`\n * is ALWAYS undefined and every branch below resolves to the vertical shape.\n * `Form` accepts `variant=\"horizontal\"` and `Form.md` documents it as \"labels\n * beside inputs\", but nothing carries that variant down to the field — so a\n * horizontal form draws vertical rows today. That gap is older than this\n * change and fixing it is a feature, not a spacing fix.\n *\n * The branch is kept, scoped to the COLUMN axis, so that whoever does wire it\n * up inherits the right answer: with the label beside the control, a horizontal\n * gap and a vertical margin are orthogonal and nothing double-counts. A `gap`\n * shorthand there would put the 8px back on the row axis the moment a field\n * wrapped.\n */\nconst StyledFormField = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: 'vertical' | 'horizontal' }>(\n ({ theme, variant }) => ({\n display: variant === 'horizontal' ? 'grid' : 'flex',\n flexDirection: variant === 'horizontal' ? undefined : 'column',\n gridTemplateColumns: variant === 'horizontal' ? '200px 1fr' : undefined,\n columnGap: variant === 'horizontal' ? theme.spacing(1) : undefined,\n alignItems: variant === 'horizontal' ? 'center' : undefined,\n }),\n);\n\nexport const FormField: React.FC<FormFieldProps> = ({\n name,\n label,\n required,\n error,\n helperText,\n children,\n dataTestId,\n}) => (\n <StyledFormField data-testid={dataTestId}>\n {label && (\n <FormLabel required={required} error={!!error} htmlFor={name} dataTestId={dataTestId ? `${dataTestId}-label` : undefined}>\n {label}\n </FormLabel>\n )}\n <FormControl fullWidth dataTestId={dataTestId ? `${dataTestId}-control` : undefined}>\n {children}\n {(error || helperText) && <FormMessage error={!!error} dataTestId={dataTestId ? `${dataTestId}-message` : undefined}>{error || helperText}</FormMessage>}\n </FormControl>\n </StyledFormField>\n );\n\nconst StyledFormLabel = styled('label', {\n shouldForwardProp: (prop) => prop !== 'error',\n})<{ error?: boolean }>(({ theme, error }) => ({\n fontSize: '0.875rem',\n fontWeight: 500,\n color: error ? theme.palette.error.main : theme.palette.text.primary,\n marginBottom: theme.spacing(0.5),\n display: 'block',\n '&::after': {\n content: '\" *\"',\n color: theme.palette.error.main,\n display: 'var(--required-display, none)',\n },\n}));\n\nexport const FormLabel: React.FC<FormLabelProps> = ({ required, error, children, htmlFor, dataTestId }) => (\n <StyledFormLabel\n error={error}\n htmlFor={htmlFor}\n data-testid={dataTestId}\n style={{ '--required-display': required ? 'inline' : 'none' } as React.CSSProperties}\n >\n {children}\n </StyledFormLabel>\n );\n\nconst StyledFormControl = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth }) => ({\n width: fullWidth ? '100%' : 'auto',\n position: 'relative',\n}));\n\nexport const FormControl: React.FC<FormControlProps> = ({ fullWidth = true, children, dataTestId }) =>\n // Don't pass error prop to the DOM element\n <StyledFormControl fullWidth={fullWidth} data-testid={dataTestId}>{children}</StyledFormControl>\n;\n\nconst StyledFormMessage = styled('span', {\n shouldForwardProp: (prop) => prop !== 'error',\n})<{ error?: boolean }>(({ theme, error }) => ({\n fontSize: '0.75rem',\n marginTop: theme.spacing(0.5),\n color: error ? theme.palette.error.main : theme.palette.text.secondary,\n display: 'block',\n}));\n\nexport const FormMessage: React.FC<FormMessageProps> = ({ error, children, dataTestId }) => <StyledFormMessage error={error} data-testid={dataTestId}>{children}</StyledFormMessage>;\n"],"mappings":"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","names":[]}
@@ -8,7 +8,7 @@ import {
8
8
  FormControl,
9
9
  FormLabel,
10
10
  FormMessage
11
- } from "./chunk-VZO7VREP.js";
11
+ } from "./chunk-IPPTOL53.js";
12
12
 
13
13
  // src/components/form/total-form/Fields/ToggleField.tsx
14
14
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -39,4 +39,4 @@ function ToggleField({ name, options, label }) {
39
39
  export {
40
40
  ToggleField
41
41
  };
42
- //# sourceMappingURL=chunk-LIQHOLDQ.js.map
42
+ //# sourceMappingURL=chunk-LYMAMKJT.js.map
@@ -1,13 +1,13 @@
1
1
  import {
2
2
  FilterDialog,
3
3
  GridFilterPanel
4
- } from "./chunk-ENK4XGKF.js";
4
+ } from "./chunk-CLNTJM3F.js";
5
5
  import {
6
6
  DataViewsEmpty
7
7
  } from "./chunk-4Y65Q3CR.js";
8
8
  import {
9
9
  InlineFilterControls
10
- } from "./chunk-DGMR3IMM.js";
10
+ } from "./chunk-CBPQJAHX.js";
11
11
  import {
12
12
  GridHeaderRow
13
13
  } from "./chunk-A4YWFX5C.js";
@@ -237,4 +237,4 @@ function GridShell(props) {
237
237
  export {
238
238
  GridShell
239
239
  };
240
- //# sourceMappingURL=chunk-TPUIIZN2.js.map
240
+ //# sourceMappingURL=chunk-MD6T7MDT.js.map
@@ -26,7 +26,7 @@ import {
26
26
  FormControl,
27
27
  FormLabel,
28
28
  FormMessage
29
- } from "./chunk-VZO7VREP.js";
29
+ } from "./chunk-IPPTOL53.js";
30
30
 
31
31
  // src/components/form/CategorySelect/CategorySelect.tsx
32
32
  import { useEffect, useMemo, useRef } from "react";
@@ -158,4 +158,4 @@ function CategorySelect(props) {
158
158
  export {
159
159
  CategorySelect
160
160
  };
161
- //# sourceMappingURL=chunk-LUWATXU4.js.map
161
+ //# sourceMappingURL=chunk-OAXAF4VY.js.map
@@ -2,7 +2,7 @@ import {
2
2
  FormControl,
3
3
  FormLabel,
4
4
  FormMessage
5
- } from "./chunk-VZO7VREP.js";
5
+ } from "./chunk-IPPTOL53.js";
6
6
  import {
7
7
  fieldEdge
8
8
  } from "./chunk-MLOWPVVW.js";
@@ -158,4 +158,4 @@ function CreatableSelect({
158
158
  export {
159
159
  CreatableSelect
160
160
  };
161
- //# sourceMappingURL=chunk-45N6LXUU.js.map
161
+ //# sourceMappingURL=chunk-OI3HOI74.js.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DataViewsGrid
3
- } from "./chunk-PLK7UGO6.js";
3
+ } from "./chunk-WME2F2YY.js";
4
4
  import {
5
5
  DeleteViewDialog
6
6
  } from "./chunk-HEDOL2RV.js";
@@ -178,4 +178,4 @@ function renderViewDialogs(ctl, fields, columns, views, testIdPrefix, onSaved) {
178
178
  export {
179
179
  DataViewsTableBase
180
180
  };
181
- //# sourceMappingURL=chunk-TUAIPMU7.js.map
181
+ //# sourceMappingURL=chunk-SRMWCN5D.js.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-4XK6JQ4D.js";
4
4
  import {
5
5
  CepField
6
- } from "./chunk-RX6DWIIW.js";
6
+ } from "./chunk-FWCUELBU.js";
7
7
 
8
8
  // src/components/form/total-form/Fields/CepField.tsx
9
9
  import { useCallback, useMemo, useRef } from "react";
@@ -80,4 +80,4 @@ function CepField2({
80
80
  export {
81
81
  CepField2 as CepField
82
82
  };
83
- //# sourceMappingURL=chunk-WFX5GASM.js.map
83
+ //# sourceMappingURL=chunk-VOOPGAQO.js.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  GridShell
3
- } from "./chunk-TPUIIZN2.js";
3
+ } from "./chunk-MD6T7MDT.js";
4
4
  import {
5
5
  useDataViewsState
6
6
  } from "./chunk-5VVM2PPV.js";
@@ -27,4 +27,4 @@ function DataViewsGrid(props) {
27
27
  export {
28
28
  DataViewsGrid
29
29
  };
30
- //# sourceMappingURL=chunk-PLK7UGO6.js.map
30
+ //# sourceMappingURL=chunk-WME2F2YY.js.map
@@ -1,18 +1,18 @@
1
1
  import {
2
2
  CepField
3
- } from "./chunk-WFX5GASM.js";
3
+ } from "./chunk-VOOPGAQO.js";
4
4
  import {
5
5
  CategoryField
6
- } from "./chunk-QETBO7EC.js";
6
+ } from "./chunk-GCJLMX63.js";
7
7
  import {
8
8
  ToggleField
9
- } from "./chunk-LIQHOLDQ.js";
9
+ } from "./chunk-LYMAMKJT.js";
10
10
  import {
11
11
  TextField
12
- } from "./chunk-KNNBIXWJ.js";
12
+ } from "./chunk-ZBOFBRZC.js";
13
13
  import {
14
14
  SelectField
15
- } from "./chunk-3ORFVLI3.js";
15
+ } from "./chunk-37YPZHAG.js";
16
16
  import {
17
17
  __export
18
18
  } from "./chunk-PZ5AY32C.js";
@@ -30,4 +30,4 @@ __export(Fields_exports, {
30
30
  export {
31
31
  Fields_exports
32
32
  };
33
- //# sourceMappingURL=chunk-EE2LBAJH.js.map
33
+ //# sourceMappingURL=chunk-WPR2HS5B.js.map
@@ -8,7 +8,7 @@ import {
8
8
  FormControl,
9
9
  FormLabel,
10
10
  FormMessage
11
- } from "./chunk-VZO7VREP.js";
11
+ } from "./chunk-IPPTOL53.js";
12
12
 
13
13
  // src/components/form/total-form/Fields/TextField.tsx
14
14
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -38,4 +38,4 @@ function TextField({ name, label, type = "text", placeholder }) {
38
38
  export {
39
39
  TextField
40
40
  };
41
- //# sourceMappingURL=chunk-KNNBIXWJ.js.map
41
+ //# sourceMappingURL=chunk-ZBOFBRZC.js.map
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  DataViewsTableBase
3
- } from "../chunk-TUAIPMU7.js";
3
+ } from "../chunk-SRMWCN5D.js";
4
4
  import {
5
5
  DataViewsGrid
6
- } from "../chunk-PLK7UGO6.js";
6
+ } from "../chunk-WME2F2YY.js";
7
7
  import {
8
8
  BaseCard
9
9
  } from "../chunk-6U7NA74A.js";
@@ -22,12 +22,12 @@ import {
22
22
  useDragItem
23
23
  } from "../chunk-JCJGJX7V.js";
24
24
  import "../chunk-ZOLAYP2D.js";
25
- import "../chunk-TPUIIZN2.js";
26
- import "../chunk-ENK4XGKF.js";
25
+ import "../chunk-MD6T7MDT.js";
26
+ import "../chunk-CLNTJM3F.js";
27
27
  import "../chunk-4Y65Q3CR.js";
28
- import "../chunk-DGMR3IMM.js";
28
+ import "../chunk-CBPQJAHX.js";
29
29
  import "../chunk-5WNQJ5KS.js";
30
- import "../chunk-O3OU2PPT.js";
30
+ import "../chunk-ES2RN7YV.js";
31
31
  import "../chunk-A4YWFX5C.js";
32
32
  import "../chunk-ELYLG4F7.js";
33
33
  import {
@@ -127,7 +127,7 @@ import "../chunk-XJKMH3RX.js";
127
127
  import "../chunk-D2HKCPEH.js";
128
128
  import "../chunk-UCU5FCYE.js";
129
129
  import "../chunk-N5ZWC6CB.js";
130
- import "../chunk-LUWATXU4.js";
130
+ import "../chunk-OAXAF4VY.js";
131
131
  import "../chunk-MHFJBNDP.js";
132
132
  import "../chunk-PU3AAKRR.js";
133
133
  import "../chunk-ZUIJ3N7N.js";
@@ -151,7 +151,7 @@ import "../chunk-SJRTT3PA.js";
151
151
  import "../chunk-BJ3J6FTN.js";
152
152
  import "../chunk-JD364H3Y.js";
153
153
  import "../chunk-C3UKR3NT.js";
154
- import "../chunk-VZO7VREP.js";
154
+ import "../chunk-IPPTOL53.js";
155
155
  import "../chunk-KFJKOVDD.js";
156
156
  import "../chunk-S5LE2ARG.js";
157
157
  import "../chunk-6PRA45LC.js";
@@ -1,7 +1,7 @@
1
1
  import "../chunk-N5ZWC6CB.js";
2
2
  import {
3
3
  CategorySelect
4
- } from "../chunk-LUWATXU4.js";
4
+ } from "../chunk-OAXAF4VY.js";
5
5
  import "../chunk-MHFJBNDP.js";
6
6
  import "../chunk-PU3AAKRR.js";
7
7
  import "../chunk-ZUIJ3N7N.js";
@@ -26,7 +26,7 @@ import "../chunk-ZBNTFWTG.js";
26
26
  import "../chunk-DMNZD3Q7.js";
27
27
  import "../chunk-FCOEJCUP.js";
28
28
  import "../chunk-C3UKR3NT.js";
29
- import "../chunk-VZO7VREP.js";
29
+ import "../chunk-IPPTOL53.js";
30
30
  import "../chunk-MLOWPVVW.js";
31
31
  import "../chunk-MFU4Y25U.js";
32
32
  import "../chunk-PZ5AY32C.js";
@@ -1,13 +1,13 @@
1
1
  import "../chunk-6XLMTOJ3.js";
2
2
  import {
3
3
  CepField
4
- } from "../chunk-RX6DWIIW.js";
4
+ } from "../chunk-FWCUELBU.js";
5
5
  import "../chunk-QYKDY4EI.js";
6
6
  import "../chunk-M3RIC6JI.js";
7
7
  import "../chunk-RMSH2I3O.js";
8
8
  import "../chunk-SL6454K7.js";
9
9
  import "../chunk-C3UKR3NT.js";
10
- import "../chunk-VZO7VREP.js";
10
+ import "../chunk-IPPTOL53.js";
11
11
  import "../chunk-MLOWPVVW.js";
12
12
  import "../chunk-HPK33ACY.js";
13
13
  import "../chunk-PZ5AY32C.js";
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  CreatableSelect
3
- } from "../chunk-45N6LXUU.js";
3
+ } from "../chunk-OI3HOI74.js";
4
4
  import "../chunk-C3UKR3NT.js";
5
- import "../chunk-VZO7VREP.js";
5
+ import "../chunk-IPPTOL53.js";
6
6
  import "../chunk-MLOWPVVW.js";
7
7
  import "../chunk-MFU4Y25U.js";
8
8
  import "../chunk-PZ5AY32C.js";
package/dist/form/Form.js CHANGED
@@ -5,7 +5,7 @@ import {
5
5
  FormField,
6
6
  FormLabel,
7
7
  FormMessage
8
- } from "../chunk-VZO7VREP.js";
8
+ } from "../chunk-IPPTOL53.js";
9
9
  import "../chunk-PZ5AY32C.js";
10
10
  export {
11
11
  Form,
@@ -6,21 +6,21 @@ import {
6
6
  } from "../chunk-XJUEHG72.js";
7
7
  import {
8
8
  FormContainer
9
- } from "../chunk-OK5BHFZE.js";
9
+ } from "../chunk-E6OILRUU.js";
10
10
  import {
11
11
  Fields_exports
12
- } from "../chunk-EE2LBAJH.js";
13
- import "../chunk-WFX5GASM.js";
12
+ } from "../chunk-WPR2HS5B.js";
13
+ import "../chunk-VOOPGAQO.js";
14
14
  import {
15
15
  CategoryField
16
- } from "../chunk-QETBO7EC.js";
17
- import "../chunk-LIQHOLDQ.js";
16
+ } from "../chunk-GCJLMX63.js";
17
+ import "../chunk-LYMAMKJT.js";
18
18
  import {
19
19
  TextField
20
- } from "../chunk-KNNBIXWJ.js";
20
+ } from "../chunk-ZBOFBRZC.js";
21
21
  import {
22
22
  SelectField
23
- } from "../chunk-3ORFVLI3.js";
23
+ } from "../chunk-37YPZHAG.js";
24
24
  import {
25
25
  FormContext,
26
26
  useFormContext
@@ -30,11 +30,11 @@ import "../chunk-A7LG3AXV.js";
30
30
  import "../chunk-II3YNC5S.js";
31
31
  import "../chunk-VSLUFBMT.js";
32
32
  import "../chunk-6XLMTOJ3.js";
33
- import "../chunk-RX6DWIIW.js";
33
+ import "../chunk-FWCUELBU.js";
34
34
  import "../chunk-JD5BVIM7.js";
35
35
  import "../chunk-JXUWWPZR.js";
36
36
  import "../chunk-N5ZWC6CB.js";
37
- import "../chunk-LUWATXU4.js";
37
+ import "../chunk-OAXAF4VY.js";
38
38
  import "../chunk-MHFJBNDP.js";
39
39
  import "../chunk-PU3AAKRR.js";
40
40
  import "../chunk-ZUIJ3N7N.js";
@@ -55,7 +55,7 @@ import "../chunk-M3RIC6JI.js";
55
55
  import "../chunk-RMSH2I3O.js";
56
56
  import "../chunk-SL6454K7.js";
57
57
  import "../chunk-C3UKR3NT.js";
58
- import "../chunk-VZO7VREP.js";
58
+ import "../chunk-IPPTOL53.js";
59
59
  import "../chunk-MLOWPVVW.js";
60
60
  import "../chunk-BA4RHQ3B.js";
61
61
  import "../chunk-IAQFQNBL.js";
@@ -1 +1 @@
1
- {"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Form/Form.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EACV,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,SAAS,EACV,MAAM,cAAc,CAAC;AA6BtB,eAAO,MAAM,IAAI,mFAYhB,CAAC;AAgBF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAoB5C,CAAC;AAiBJ,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAS5C,CAAC;AASJ,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAEgD,CAClG;AAWD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAAiI,CAAC"}
1
+ {"version":3,"file":"Form.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/Form/Form.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EACV,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,SAAS,EACV,MAAM,cAAc,CAAC;AA6BtB,eAAO,MAAM,IAAI,mFAYhB,CAAC;AAuDF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAoB5C,CAAC;AAiBJ,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAS5C,CAAC;AASJ,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAEgD,CAClG;AAWD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAAiI,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@12-apps/ui",
3
- "version": "6.17.0",
3
+ "version": "6.17.1",
4
4
  "license": "MIT",
5
5
  "packageManager": "pnpm@10.34.5",
6
6
  "type": "module",
@@ -85,7 +85,7 @@ Default layout with fields stacked vertically:
85
85
  ```
86
86
 
87
87
  ### Horizontal Layout
88
- Labels positioned horizontally beside inputs:
88
+ Intended to put labels beside their inputs:
89
89
  ```tsx
90
90
  <Form variant="horizontal">
91
91
  <FormField name="field1" label="Field 1">
@@ -94,6 +94,13 @@ Labels positioned horizontally beside inputs:
94
94
  </Form>
95
95
  ```
96
96
 
97
+ > **Not wired up yet.** `Form` accepts the variant, but nothing carries it down
98
+ > to `FormField` — `FormFieldProps` has no `variant` — so a horizontal form
99
+ > currently draws ordinary vertical rows. The field's styled wrapper still
100
+ > keeps the horizontal branch, scoped to the column axis (see
101
+ > [Row spacing](#row-spacing)), so wiring it up later is a wiring job rather
102
+ > than a re-derivation of the spacing.
103
+
97
104
  ### Inline Layout
98
105
  All elements in a single row:
99
106
  ```tsx
@@ -103,6 +110,44 @@ All elements in a single row:
103
110
  </Form>
104
111
  ```
105
112
 
113
+ ## Row spacing
114
+
115
+ A label sits **4px** above its control, and exactly one thing puts it there:
116
+ `FormLabel`'s own `marginBottom` (`theme.spacing(0.5)`). `FormMessage` mirrors it
117
+ with the same 4px `marginTop` below the control, so a row reads 4 / control / 4.
118
+
119
+ `FormField` deliberately adds **nothing** to that. It used to: the wrapper was a
120
+ flex column with `gap: theme.spacing(1)`, and in a column a gap and a margin add
121
+ up — 8 + 4 = 12px, three times what every other user of `FormLabel` draws.
122
+ `CepField`, `CategorySelect`, `CreatableSelect`, the `total-form` fields and
123
+ `@12-apps/discounts`' builders all put a bare `FormLabel` straight inside a
124
+ `FormControl`, which has no gap of its own, so the label's margin is the whole
125
+ of their spacing at 4px. `FormField` was the only one of them that disagreed.
126
+
127
+ That is a claim about `FormLabel`'s callers, not about every labelled control in
128
+ the package: `Textarea` labels itself through MUI's `InputLabel` at
129
+ `theme.spacing(1)` and draws 8px. It shares no code with `FormLabel`, so it is a
130
+ separate inconsistency — worth settling one day, and no argument for keeping a
131
+ second spacing mechanism here.
132
+
133
+ Eight pixels a row is invisible on one field and decisive on six. Measured in
134
+ Chromium at 320x568 — the smallest supported viewport — a six-field address form
135
+ put its submit button 41px below the fold.
136
+
137
+ **There is no `spacing` prop, and that is the answer rather than an omission.**
138
+ A knob here would be a second place to state a decision that already has one, and
139
+ its default would have to be the 4px every other `FormLabel` row draws — so the
140
+ only thing it would buy is the ability to disagree with them. A row that
141
+ genuinely needs more air gets it from the container: `Form`'s own `spacing` sets
142
+ the distance *between* fields, and a caller composing `FormControl` +
143
+ `FormLabel` by hand can space them however it likes.
144
+
145
+ `variant="horizontal"` keeps a `columnGap` rather than a `gap`. That branch is
146
+ unreachable today (see [Horizontal Layout](#horizontal-layout)), and the axis is
147
+ the reason it is kept rather than deleted: with the label beside the control a
148
+ horizontal gap and a vertical margin are orthogonal, where a `gap` shorthand
149
+ would put the 8px straight back on the row axis as soon as a field wrapped.
150
+
106
151
  ## Validation
107
152
 
108
153
  Display validation errors and helper text:
@@ -54,6 +54,45 @@ export const Form = React.forwardRef<HTMLFormElement, FormProps>(
54
54
 
55
55
  Form.displayName = 'Form';
56
56
 
57
+ /**
58
+ * NO ROW GAP HERE, and that is the fix rather than an omission.
59
+ *
60
+ * `FormLabel` already carries `marginBottom: theme.spacing(0.5)` — 4px — and it
61
+ * carries it because it has to: every OTHER user of it (`CepField`,
62
+ * `CategorySelect`, `CreatableSelect`, the three `total-form` fields, five of
63
+ * `@12-apps/discounts`' builders and the host's own `currency-field`) puts a
64
+ * bare `FormLabel` straight inside a `FormControl`, which is a plain block box
65
+ * with no gap of its own. There, the label's own margin is the ONLY thing
66
+ * between the label and the control.
67
+ *
68
+ * A `gap: theme.spacing(1)` here was a second mechanism for that one job, and in
69
+ * a column the two ADD: 8px + 4px put `FormField` at 12px where every one of
70
+ * those siblings sits at 4px. Measured in Chromium at 320x568 on a consuming
71
+ * app's six-field delivery address form, the 8px a row it added pushed the
72
+ * submit button from 561px to 609px — 41px below the fold of the smallest
73
+ * supported phone, i.e. a checkout whose primary action is off-screen.
74
+ *
75
+ * That claim is about `FormLabel`'s own callers, not about the whole package:
76
+ * `Textarea` labels its control through MUI's `InputLabel` at
77
+ * `theme.spacing(1)` and still draws 8px. It composes nothing out of
78
+ * `FormLabel`, so it is a separate inconsistency rather than a reason to keep
79
+ * a second spacing here.
80
+ *
81
+ * ## The `columnGap` is scaffolding, and currently unreachable
82
+ *
83
+ * `FormFieldProps` has no `variant` and `FormField` passes none, so `variant`
84
+ * is ALWAYS undefined and every branch below resolves to the vertical shape.
85
+ * `Form` accepts `variant="horizontal"` and `Form.md` documents it as "labels
86
+ * beside inputs", but nothing carries that variant down to the field — so a
87
+ * horizontal form draws vertical rows today. That gap is older than this
88
+ * change and fixing it is a feature, not a spacing fix.
89
+ *
90
+ * The branch is kept, scoped to the COLUMN axis, so that whoever does wire it
91
+ * up inherits the right answer: with the label beside the control, a horizontal
92
+ * gap and a vertical margin are orthogonal and nothing double-counts. A `gap`
93
+ * shorthand there would put the 8px back on the row axis the moment a field
94
+ * wrapped.
95
+ */
57
96
  const StyledFormField = styled(Box, {
58
97
  shouldForwardProp: (prop) => prop !== 'variant',
59
98
  })<{ variant?: 'vertical' | 'horizontal' }>(
@@ -61,7 +100,7 @@ const StyledFormField = styled(Box, {
61
100
  display: variant === 'horizontal' ? 'grid' : 'flex',
62
101
  flexDirection: variant === 'horizontal' ? undefined : 'column',
63
102
  gridTemplateColumns: variant === 'horizontal' ? '200px 1fr' : undefined,
64
- gap: theme.spacing(1),
103
+ columnGap: variant === 'horizontal' ? theme.spacing(1) : undefined,
65
104
  alignItems: variant === 'horizontal' ? 'center' : undefined,
66
105
  }),
67
106
  );
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/form/Form/Form.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n FormControlProps,\n FormFieldProps,\n FormLabelProps,\n FormMessageProps,\n FormProps,\n} from './Form.types';\n\nconst StyledForm = styled('form', {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: FormProps['variant'] }>(({ theme, variant }) => ({\n width: '100%',\n ...(variant === 'inline' && {\n display: 'flex',\n gap: theme.spacing(2),\n alignItems: 'flex-start',\n }),\n}));\n\nconst spacingMap = {\n xs: 1,\n sm: 2,\n md: 3,\n lg: 4,\n xl: 5,\n};\n\nconst maxWidthMap = {\n sm: '600px',\n md: '900px',\n lg: '1200px',\n xl: '1536px',\n full: '100%',\n};\n\nexport const Form = React.forwardRef<HTMLFormElement, FormProps>(\n ({ variant = 'vertical', maxWidth = 'full', spacing = 'md', children, dataTestId, ...props }, ref) => (\n <StyledForm ref={ref} variant={variant} role=\"form\" data-testid={dataTestId} {...props}>\n <Box sx={{ maxWidth: maxWidthMap[maxWidth], width: '100%' }}>\n {variant === 'inline' ? (\n children\n ) : (\n <Stack spacing={spacingMap[spacing]}>{children}</Stack>\n )}\n </Box>\n </StyledForm>\n ),\n);\n\nForm.displayName = 'Form';\n\nconst StyledFormField = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant?: 'vertical' | 'horizontal' }>(\n ({ theme, variant }) => ({\n display: variant === 'horizontal' ? 'grid' : 'flex',\n flexDirection: variant === 'horizontal' ? undefined : 'column',\n gridTemplateColumns: variant === 'horizontal' ? '200px 1fr' : undefined,\n gap: theme.spacing(1),\n alignItems: variant === 'horizontal' ? 'center' : undefined,\n }),\n);\n\nexport const FormField: React.FC<FormFieldProps> = ({\n name,\n label,\n required,\n error,\n helperText,\n children,\n dataTestId,\n}) => (\n <StyledFormField data-testid={dataTestId}>\n {label && (\n <FormLabel required={required} error={!!error} htmlFor={name} dataTestId={dataTestId ? `${dataTestId}-label` : undefined}>\n {label}\n </FormLabel>\n )}\n <FormControl fullWidth dataTestId={dataTestId ? `${dataTestId}-control` : undefined}>\n {children}\n {(error || helperText) && <FormMessage error={!!error} dataTestId={dataTestId ? `${dataTestId}-message` : undefined}>{error || helperText}</FormMessage>}\n </FormControl>\n </StyledFormField>\n );\n\nconst StyledFormLabel = styled('label', {\n shouldForwardProp: (prop) => prop !== 'error',\n})<{ error?: boolean }>(({ theme, error }) => ({\n fontSize: '0.875rem',\n fontWeight: 500,\n color: error ? theme.palette.error.main : theme.palette.text.primary,\n marginBottom: theme.spacing(0.5),\n display: 'block',\n '&::after': {\n content: '\" *\"',\n color: theme.palette.error.main,\n display: 'var(--required-display, none)',\n },\n}));\n\nexport const FormLabel: React.FC<FormLabelProps> = ({ required, error, children, htmlFor, dataTestId }) => (\n <StyledFormLabel\n error={error}\n htmlFor={htmlFor}\n data-testid={dataTestId}\n style={{ '--required-display': required ? 'inline' : 'none' } as React.CSSProperties}\n >\n {children}\n </StyledFormLabel>\n );\n\nconst StyledFormControl = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth }) => ({\n width: fullWidth ? '100%' : 'auto',\n position: 'relative',\n}));\n\nexport const FormControl: React.FC<FormControlProps> = ({ fullWidth = true, children, dataTestId }) =>\n // Don't pass error prop to the DOM element\n <StyledFormControl fullWidth={fullWidth} data-testid={dataTestId}>{children}</StyledFormControl>\n;\n\nconst StyledFormMessage = styled('span', {\n shouldForwardProp: (prop) => prop !== 'error',\n})<{ error?: boolean }>(({ theme, error }) => ({\n fontSize: '0.75rem',\n marginTop: theme.spacing(0.5),\n color: error ? theme.palette.error.main : theme.palette.text.secondary,\n display: 'block',\n}));\n\nexport const FormMessage: React.FC<FormMessageProps> = ({ error, children, dataTestId }) => <StyledFormMessage error={error} data-testid={dataTestId}>{children}</StyledFormMessage>;\n"],"mappings":"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","names":[]}