@djangocfg/ui-tools 2.1.390 → 2.1.394

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 (184) hide show
  1. package/README.md +7 -10
  2. package/dist/chunk-PAWJFY3S.mjs +6 -0
  3. package/dist/{chunk-N2XQF2OL.mjs.map → chunk-PAWJFY3S.mjs.map} +1 -1
  4. package/dist/chunk-PK6SKIKE.cjs +8 -0
  5. package/dist/{chunk-OLISEQHS.cjs.map → chunk-PK6SKIKE.cjs.map} +1 -1
  6. package/dist/file-icon/index.cjs +6 -6
  7. package/dist/file-icon/index.d.cts +1 -1
  8. package/dist/file-icon/index.d.ts +1 -1
  9. package/dist/file-icon/index.mjs +1 -1
  10. package/dist/tree/index.cjs +1372 -143
  11. package/dist/tree/index.cjs.map +1 -1
  12. package/dist/tree/index.d.cts +2 -2
  13. package/dist/tree/index.d.ts +2 -2
  14. package/dist/tree/index.mjs +1322 -3
  15. package/dist/tree/index.mjs.map +1 -1
  16. package/dist/{types-CevSbyfD.d.cts → types-B_zhyAqR.d.cts} +1 -1
  17. package/dist/{types-CevSbyfD.d.ts → types-B_zhyAqR.d.ts} +1 -1
  18. package/package.json +6 -14
  19. package/src/tools/AudioPlayer/README.md +4 -4
  20. package/src/tools/Chat/README.md +6 -6
  21. package/src/tools/CronScheduler/index.tsx +1 -1
  22. package/src/tools/CronScheduler/lazy.tsx +1 -1
  23. package/src/tools/ImageViewer/README.md +1 -1
  24. package/src/tools/JsonForm/README.md +2 -2
  25. package/src/tools/MarkdownEditor/README.md +3 -3
  26. package/src/tools/MarkdownMessage/README.md +2 -2
  27. package/src/tools/OpenapiViewer/components/DocsLayout/grouping.ts +5 -1
  28. package/src/tools/PrettyCode/lazy.tsx +6 -0
  29. package/src/tools/SpeechRecognition/README.md +1 -1
  30. package/dist/ChatRoot-EFNXQXXN.cjs +0 -15
  31. package/dist/ChatRoot-EFNXQXXN.cjs.map +0 -1
  32. package/dist/ChatRoot-FITF5RVP.mjs +0 -6
  33. package/dist/ChatRoot-FITF5RVP.mjs.map +0 -1
  34. package/dist/ChatRoot-PNNGQCYF.css +0 -7
  35. package/dist/ChatRoot-PNNGQCYF.css.map +0 -1
  36. package/dist/CronScheduler.client-DLMXCPAJ.mjs +0 -67
  37. package/dist/CronScheduler.client-DLMXCPAJ.mjs.map +0 -1
  38. package/dist/CronScheduler.client-WEJF4PWQ.cjs +0 -72
  39. package/dist/CronScheduler.client-WEJF4PWQ.cjs.map +0 -1
  40. package/dist/DictationField-AS2F33WI.cjs +0 -13
  41. package/dist/DictationField-AS2F33WI.cjs.map +0 -1
  42. package/dist/DictationField-WPONUCYE.mjs +0 -4
  43. package/dist/DictationField-WPONUCYE.mjs.map +0 -1
  44. package/dist/DocsLayout-EKASBSP7.mjs +0 -3448
  45. package/dist/DocsLayout-EKASBSP7.mjs.map +0 -1
  46. package/dist/DocsLayout-MBFIB4NO.css +0 -7
  47. package/dist/DocsLayout-MBFIB4NO.css.map +0 -1
  48. package/dist/DocsLayout-OURFYWQE.cjs +0 -3455
  49. package/dist/DocsLayout-OURFYWQE.cjs.map +0 -1
  50. package/dist/JsonSchemaForm-DD7CLRIG.cjs +0 -13
  51. package/dist/JsonSchemaForm-DD7CLRIG.cjs.map +0 -1
  52. package/dist/JsonSchemaForm-XKUIVELK.mjs +0 -4
  53. package/dist/JsonSchemaForm-XKUIVELK.mjs.map +0 -1
  54. package/dist/JsonTree-43PQAJKY.mjs +0 -5
  55. package/dist/JsonTree-43PQAJKY.mjs.map +0 -1
  56. package/dist/JsonTree-MLET23ZA.css +0 -7
  57. package/dist/JsonTree-MLET23ZA.css.map +0 -1
  58. package/dist/JsonTree-X6W5YEVY.cjs +0 -11
  59. package/dist/JsonTree-X6W5YEVY.cjs.map +0 -1
  60. package/dist/LottiePlayer.client-2S7ISJ2S.cjs +0 -168
  61. package/dist/LottiePlayer.client-2S7ISJ2S.cjs.map +0 -1
  62. package/dist/LottiePlayer.client-5LDSSJWS.mjs +0 -161
  63. package/dist/LottiePlayer.client-5LDSSJWS.mjs.map +0 -1
  64. package/dist/MapContainer-AKIPABJK.mjs +0 -4
  65. package/dist/MapContainer-AKIPABJK.mjs.map +0 -1
  66. package/dist/MapContainer-STVDMC36.cjs +0 -17
  67. package/dist/MapContainer-STVDMC36.cjs.map +0 -1
  68. package/dist/Mermaid.client-DDXWXZXY.css +0 -7
  69. package/dist/Mermaid.client-DDXWXZXY.css.map +0 -1
  70. package/dist/Mermaid.client-NL4SVR7F.mjs +0 -481
  71. package/dist/Mermaid.client-NL4SVR7F.mjs.map +0 -1
  72. package/dist/Mermaid.client-NNTI6DFX.cjs +0 -487
  73. package/dist/Mermaid.client-NNTI6DFX.cjs.map +0 -1
  74. package/dist/Player-BRV7XTWR.mjs +0 -4
  75. package/dist/Player-BRV7XTWR.mjs.map +0 -1
  76. package/dist/Player-PM7F7DD7.cjs +0 -13
  77. package/dist/Player-PM7F7DD7.cjs.map +0 -1
  78. package/dist/Player-ZGQKKOWI.css +0 -66
  79. package/dist/Player-ZGQKKOWI.css.map +0 -1
  80. package/dist/PrettyCode.client-GWFAIVFN.css +0 -7
  81. package/dist/PrettyCode.client-GWFAIVFN.css.map +0 -1
  82. package/dist/PrettyCode.client-KOHDVPPN.cjs +0 -285
  83. package/dist/PrettyCode.client-KOHDVPPN.cjs.map +0 -1
  84. package/dist/PrettyCode.client-ZGYGKE7G.mjs +0 -283
  85. package/dist/PrettyCode.client-ZGYGKE7G.mjs.map +0 -1
  86. package/dist/TreeRoot-5COOOSWG.mjs +0 -4
  87. package/dist/TreeRoot-5COOOSWG.mjs.map +0 -1
  88. package/dist/TreeRoot-AABP2J6Y.cjs +0 -19
  89. package/dist/TreeRoot-AABP2J6Y.cjs.map +0 -1
  90. package/dist/chunk-2NG4SXEP.mjs +0 -743
  91. package/dist/chunk-2NG4SXEP.mjs.map +0 -1
  92. package/dist/chunk-4LFB7I5K.cjs +0 -1387
  93. package/dist/chunk-4LFB7I5K.cjs.map +0 -1
  94. package/dist/chunk-5D2OCOPQ.cjs +0 -222
  95. package/dist/chunk-5D2OCOPQ.cjs.map +0 -1
  96. package/dist/chunk-5I5QNGUG.cjs +0 -611
  97. package/dist/chunk-5I5QNGUG.cjs.map +0 -1
  98. package/dist/chunk-6ZX2G25W.mjs +0 -1361
  99. package/dist/chunk-6ZX2G25W.mjs.map +0 -1
  100. package/dist/chunk-76NNDZH6.cjs +0 -1061
  101. package/dist/chunk-76NNDZH6.cjs.map +0 -1
  102. package/dist/chunk-7CWGZPO3.mjs +0 -214
  103. package/dist/chunk-7CWGZPO3.mjs.map +0 -1
  104. package/dist/chunk-7EYHNP3E.cjs +0 -965
  105. package/dist/chunk-7EYHNP3E.cjs.map +0 -1
  106. package/dist/chunk-7IYXZUJO.cjs +0 -769
  107. package/dist/chunk-7IYXZUJO.cjs.map +0 -1
  108. package/dist/chunk-ADEN3UA4.cjs +0 -892
  109. package/dist/chunk-ADEN3UA4.cjs.map +0 -1
  110. package/dist/chunk-B6IR5KSC.mjs +0 -59
  111. package/dist/chunk-B6IR5KSC.mjs.map +0 -1
  112. package/dist/chunk-C6GXVH5J.mjs +0 -338
  113. package/dist/chunk-C6GXVH5J.mjs.map +0 -1
  114. package/dist/chunk-DMX7W4XZ.mjs +0 -1113
  115. package/dist/chunk-DMX7W4XZ.mjs.map +0 -1
  116. package/dist/chunk-ECONRHIG.mjs +0 -212
  117. package/dist/chunk-ECONRHIG.mjs.map +0 -1
  118. package/dist/chunk-FEN5S772.cjs +0 -1227
  119. package/dist/chunk-FEN5S772.cjs.map +0 -1
  120. package/dist/chunk-FP2RLYQZ.cjs +0 -187
  121. package/dist/chunk-FP2RLYQZ.cjs.map +0 -1
  122. package/dist/chunk-FVVF7VCD.cjs +0 -1325
  123. package/dist/chunk-FVVF7VCD.cjs.map +0 -1
  124. package/dist/chunk-GYIO7W7M.mjs +0 -1197
  125. package/dist/chunk-GYIO7W7M.mjs.map +0 -1
  126. package/dist/chunk-KNDLV4PI.cjs +0 -1356
  127. package/dist/chunk-KNDLV4PI.cjs.map +0 -1
  128. package/dist/chunk-KNEQRUBA.mjs +0 -181
  129. package/dist/chunk-KNEQRUBA.mjs.map +0 -1
  130. package/dist/chunk-N2XQF2OL.mjs +0 -14
  131. package/dist/chunk-N4MZYNR4.mjs +0 -1342
  132. package/dist/chunk-N4MZYNR4.mjs.map +0 -1
  133. package/dist/chunk-NTVBIIUD.mjs +0 -1439
  134. package/dist/chunk-NTVBIIUD.mjs.map +0 -1
  135. package/dist/chunk-OBRSGM64.mjs +0 -607
  136. package/dist/chunk-OBRSGM64.mjs.map +0 -1
  137. package/dist/chunk-ODO4GMW7.mjs +0 -79
  138. package/dist/chunk-ODO4GMW7.mjs.map +0 -1
  139. package/dist/chunk-OLISEQHS.cjs +0 -18
  140. package/dist/chunk-PVAX67JG.mjs +0 -1041
  141. package/dist/chunk-PVAX67JG.mjs.map +0 -1
  142. package/dist/chunk-QJ6GTUCO.cjs +0 -81
  143. package/dist/chunk-QJ6GTUCO.cjs.map +0 -1
  144. package/dist/chunk-T3MWM23F.cjs +0 -214
  145. package/dist/chunk-T3MWM23F.cjs.map +0 -1
  146. package/dist/chunk-TBSHZO5R.cjs +0 -1134
  147. package/dist/chunk-TBSHZO5R.cjs.map +0 -1
  148. package/dist/chunk-UNCS5V5F.mjs +0 -887
  149. package/dist/chunk-UNCS5V5F.mjs.map +0 -1
  150. package/dist/chunk-VWQ5WOIL.mjs +0 -2059
  151. package/dist/chunk-VWQ5WOIL.mjs.map +0 -1
  152. package/dist/chunk-W75B7Y6C.cjs +0 -1478
  153. package/dist/chunk-W75B7Y6C.cjs.map +0 -1
  154. package/dist/chunk-Y6UTOBF6.mjs +0 -938
  155. package/dist/chunk-Y6UTOBF6.mjs.map +0 -1
  156. package/dist/chunk-YDPDTOSP.cjs +0 -2061
  157. package/dist/chunk-YDPDTOSP.cjs.map +0 -1
  158. package/dist/chunk-YW5IVWHQ.cjs +0 -346
  159. package/dist/chunk-YW5IVWHQ.cjs.map +0 -1
  160. package/dist/chunk-YXZ6GU7H.cjs +0 -63
  161. package/dist/chunk-YXZ6GU7H.cjs.map +0 -1
  162. package/dist/chunk-ZL7FH4NW.mjs +0 -1274
  163. package/dist/chunk-ZL7FH4NW.mjs.map +0 -1
  164. package/dist/components-EHOGXATG.cjs +0 -22
  165. package/dist/components-EHOGXATG.cjs.map +0 -1
  166. package/dist/components-MQ6DR7TX.cjs +0 -26
  167. package/dist/components-MQ6DR7TX.cjs.map +0 -1
  168. package/dist/components-XRX7QGLB.mjs +0 -5
  169. package/dist/components-XRX7QGLB.mjs.map +0 -1
  170. package/dist/components-YATKRWLH.mjs +0 -5
  171. package/dist/components-YATKRWLH.mjs.map +0 -1
  172. package/dist/index.cjs +0 -3674
  173. package/dist/index.cjs.map +0 -1
  174. package/dist/index.css +0 -234
  175. package/dist/index.css.map +0 -1
  176. package/dist/index.d.cts +0 -4929
  177. package/dist/index.d.ts +0 -4929
  178. package/dist/index.mjs +0 -2912
  179. package/dist/index.mjs.map +0 -1
  180. package/dist/launcher-5Y42OBSN.mjs +0 -6
  181. package/dist/launcher-5Y42OBSN.mjs.map +0 -1
  182. package/dist/launcher-PMW2YB24.cjs +0 -59
  183. package/dist/launcher-PMW2YB24.cjs.map +0 -1
  184. package/src/index.ts +0 -157
@@ -1,1197 +0,0 @@
1
- import { __name } from './chunk-N2XQF2OL.mjs';
2
- import consola2 from 'consola';
3
- import { cn, isDev } from '@djangocfg/ui-core/lib';
4
- import { ChevronDown, ChevronRight, Plus, AlertCircle } from 'lucide-react';
5
- import { useState, useMemo, useCallback, useRef } from 'react';
6
- import { Label, Collapsible, CollapsibleTrigger, CollapsibleContent, Button, Alert, AlertTitle, AlertDescription, Input, Checkbox, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, Switch, Slider } from '@djangocfg/ui-core/components';
7
- import Form from '@rjsf/core';
8
- import validator from '@rjsf/validator-ajv8';
9
- import { jsx, jsxs } from 'react/jsx-runtime';
10
- import { getUiOptions, getTemplate, getInputProps } from '@rjsf/utils';
11
- import { useAppT } from '@djangocfg/i18n';
12
-
13
- function FieldTemplate(props) {
14
- const {
15
- id,
16
- classNames,
17
- style,
18
- label,
19
- help,
20
- required,
21
- description,
22
- errors,
23
- children,
24
- displayLabel,
25
- hidden,
26
- rawErrors
27
- } = props;
28
- const formContext = props.formContext;
29
- if (hidden) {
30
- return /* @__PURE__ */ jsx("div", { className: "hidden", children });
31
- }
32
- const hasError = rawErrors && rawErrors.length > 0;
33
- const density = formContext?.density ?? "comfortable";
34
- const compact = density === "compact";
35
- const descriptionText = typeof description === "string" ? description : void 0;
36
- const labelTitle = compact ? descriptionText : void 0;
37
- const showDescription = !compact && Boolean(description);
38
- return /* @__PURE__ */ jsxs(
39
- "div",
40
- {
41
- className: cn(compact ? "space-y-1" : "space-y-2", classNames),
42
- style,
43
- children: [
44
- displayLabel && label && /* @__PURE__ */ jsxs(
45
- Label,
46
- {
47
- htmlFor: id,
48
- className: cn(
49
- hasError && "text-destructive",
50
- compact && "text-[10px] font-semibold uppercase tracking-wide text-muted-foreground/70"
51
- ),
52
- title: labelTitle,
53
- children: [
54
- label,
55
- required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
56
- ]
57
- }
58
- ),
59
- showDescription && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: description }),
60
- /* @__PURE__ */ jsx("div", { children }),
61
- errors && /* @__PURE__ */ jsx("div", { className: compact ? "text-xs text-destructive" : "text-sm text-destructive", children: errors }),
62
- help && !compact && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", children: help })
63
- ]
64
- }
65
- );
66
- }
67
- __name(FieldTemplate, "FieldTemplate");
68
- function ObjectFieldTemplate(props) {
69
- const {
70
- title,
71
- description,
72
- properties,
73
- required,
74
- uiSchema
75
- } = props;
76
- const formContext = props.formContext;
77
- const isCollapsible = uiSchema?.["ui:collapsible"] === true;
78
- const defaultCollapsed = uiSchema?.["ui:collapsed"] === true;
79
- const gridCols = uiSchema?.["ui:grid"];
80
- const className = uiSchema?.["ui:className"];
81
- const uiGroups = uiSchema?.["ui:groups"];
82
- const density = formContext?.density ?? "comfortable";
83
- const compact = density === "compact";
84
- const [isOpen, setIsOpen] = useState(!defaultCollapsed);
85
- const isRoot = !title;
86
- const gridClass = gridCols ? `grid gap-4 grid-cols-${gridCols}` : compact ? "space-y-2" : "space-y-4";
87
- const groupedContent = uiGroups ? renderUiGroups({ properties, uiGroups, gridClass, className, compact }) : null;
88
- const content = groupedContent ?? /* @__PURE__ */ jsx("div", { className: cn(gridClass, className), children: properties.map((element) => /* @__PURE__ */ jsx("div", { className: "property-wrapper", children: element.content }, element.name)) });
89
- if (isRoot) {
90
- return /* @__PURE__ */ jsx("div", { className: "space-y-6", children: content });
91
- }
92
- if (isCollapsible) {
93
- return /* @__PURE__ */ jsxs(Collapsible, { open: isOpen, onOpenChange: setIsOpen, className: "space-y-2", children: [
94
- /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: "flex w-full items-center justify-between rounded-lg border bg-muted/50 px-4 py-3 text-left hover:bg-muted transition-colors", children: [
95
- /* @__PURE__ */ jsxs("div", { children: [
96
- /* @__PURE__ */ jsxs("h3", { className: "text-sm font-semibold", children: [
97
- title,
98
- required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
99
- ] }),
100
- description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: description })
101
- ] }),
102
- /* @__PURE__ */ jsx(
103
- ChevronDown,
104
- {
105
- className: cn(
106
- "h-4 w-4 text-muted-foreground transition-transform duration-200",
107
- isOpen && "rotate-180"
108
- )
109
- }
110
- )
111
- ] }),
112
- /* @__PURE__ */ jsx(CollapsibleContent, { className: "pl-1 pr-1 pt-2", children: content })
113
- ] });
114
- }
115
- return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
116
- title && /* @__PURE__ */ jsxs("div", { className: "border-b pb-2", children: [
117
- /* @__PURE__ */ jsxs("h3", { className: "text-sm font-semibold", children: [
118
- title,
119
- required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
120
- ] }),
121
- description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: description })
122
- ] }),
123
- content
124
- ] });
125
- }
126
- __name(ObjectFieldTemplate, "ObjectFieldTemplate");
127
- function renderUiGroups({
128
- properties,
129
- uiGroups,
130
- gridClass,
131
- className,
132
- compact
133
- }) {
134
- const propsByName = new Map(properties.map((p) => [p.name, p]));
135
- const groupedFieldNames = new Set(uiGroups.flatMap((g) => g.fields));
136
- const ungrouped = properties.filter((p) => !groupedFieldNames.has(p.name));
137
- return /* @__PURE__ */ jsxs("div", { className: cn(compact ? "space-y-2" : "space-y-3", className), children: [
138
- ungrouped.length > 0 ? /* @__PURE__ */ jsx("div", { className: gridClass, children: ungrouped.map((element) => /* @__PURE__ */ jsx("div", { className: "property-wrapper", children: element.content }, element.name)) }) : null,
139
- uiGroups.map((group) => {
140
- const groupProps = group.fields.map((name) => propsByName.get(name)).filter((p) => Boolean(p));
141
- if (groupProps.length === 0) return null;
142
- return /* @__PURE__ */ jsx(
143
- UiGroupSection,
144
- {
145
- group,
146
- gridClass,
147
- compact,
148
- children: groupProps.map((element) => /* @__PURE__ */ jsx("div", { className: "property-wrapper", children: element.content }, element.name))
149
- },
150
- group.title
151
- );
152
- })
153
- ] });
154
- }
155
- __name(renderUiGroups, "renderUiGroups");
156
- function UiGroupSection({ group, gridClass, compact, children }) {
157
- const [open, setOpen] = useState(group.defaultOpen ?? true);
158
- return /* @__PURE__ */ jsxs(Collapsible, { open, onOpenChange: setOpen, children: [
159
- /* @__PURE__ */ jsxs(
160
- CollapsibleTrigger,
161
- {
162
- className: cn(
163
- "flex w-full items-center gap-1.5 py-1 transition-colors hover:text-foreground",
164
- compact ? "text-[10px] font-semibold uppercase tracking-wide text-muted-foreground/70" : "text-xs font-semibold uppercase tracking-wide text-muted-foreground"
165
- ),
166
- children: [
167
- /* @__PURE__ */ jsx(
168
- ChevronRight,
169
- {
170
- className: cn(
171
- "h-3 w-3 shrink-0 transition-transform duration-200",
172
- open && "rotate-90"
173
- ),
174
- "aria-hidden": true
175
- }
176
- ),
177
- /* @__PURE__ */ jsx("span", { children: group.title })
178
- ]
179
- }
180
- ),
181
- /* @__PURE__ */ jsx(CollapsibleContent, { className: "overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down", children: /* @__PURE__ */ jsx("div", { className: cn("border-l border-border/40 pl-3 pb-2 pt-1", gridClass), children }) })
182
- ] });
183
- }
184
- __name(UiGroupSection, "UiGroupSection");
185
- function ArrayFieldTemplate(props) {
186
- const {
187
- title,
188
- items,
189
- canAdd,
190
- onAddClick,
191
- required
192
- } = props;
193
- return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
194
- title && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
195
- /* @__PURE__ */ jsxs("h3", { className: "text-lg font-semibold", children: [
196
- title,
197
- required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
198
- ] }),
199
- canAdd && /* @__PURE__ */ jsxs(
200
- Button,
201
- {
202
- type: "button",
203
- variant: "outline",
204
- size: "sm",
205
- onClick: onAddClick,
206
- className: "gap-2",
207
- children: [
208
- /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }),
209
- "Add Item"
210
- ]
211
- }
212
- )
213
- ] }),
214
- /* @__PURE__ */ jsx("div", { className: "space-y-3", children: items }),
215
- items.length === 0 && /* @__PURE__ */ jsxs("div", { className: "text-center py-8 text-muted-foreground border-2 border-dashed rounded-md", children: [
216
- "No items added yet.",
217
- canAdd && /* @__PURE__ */ jsxs(
218
- Button,
219
- {
220
- type: "button",
221
- variant: "ghost",
222
- size: "sm",
223
- onClick: onAddClick,
224
- className: "mt-2 gap-2",
225
- children: [
226
- /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }),
227
- "Add First Item"
228
- ]
229
- }
230
- )
231
- ] })
232
- ] });
233
- }
234
- __name(ArrayFieldTemplate, "ArrayFieldTemplate");
235
- function ArrayFieldItemTemplate(props) {
236
- const {
237
- children,
238
- className,
239
- buttonsProps,
240
- hasToolbar,
241
- registry,
242
- uiSchema
243
- } = props;
244
- const uiOptions = getUiOptions(uiSchema);
245
- const ArrayFieldItemButtonsTemplate = getTemplate(
246
- "ArrayFieldItemButtonsTemplate",
247
- registry,
248
- uiOptions
249
- );
250
- return /* @__PURE__ */ jsxs(
251
- "div",
252
- {
253
- className: cn(
254
- "flex gap-2 items-start p-4 rounded-md border bg-card",
255
- className
256
- ),
257
- children: [
258
- /* @__PURE__ */ jsx("div", { className: "flex-1", children }),
259
- hasToolbar && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps }) })
260
- ]
261
- }
262
- );
263
- }
264
- __name(ArrayFieldItemTemplate, "ArrayFieldItemTemplate");
265
- function ErrorListTemplate(props) {
266
- const { errors } = props;
267
- if (!errors || errors.length === 0) {
268
- return null;
269
- }
270
- return /* @__PURE__ */ jsxs(Alert, { variant: "destructive", className: "mb-6", children: [
271
- /* @__PURE__ */ jsx(AlertCircle, { className: "h-4 w-4" }),
272
- /* @__PURE__ */ jsx(AlertTitle, { children: "Validation Errors" }),
273
- /* @__PURE__ */ jsx(AlertDescription, { children: /* @__PURE__ */ jsx("ul", { className: "list-disc list-inside space-y-1 mt-2", children: errors.map((error, index) => /* @__PURE__ */ jsx("li", { className: "text-sm", children: error.stack }, index)) }) })
274
- ] });
275
- }
276
- __name(ErrorListTemplate, "ErrorListTemplate");
277
- function BaseInputTemplate(props) {
278
- const {
279
- id,
280
- type,
281
- value,
282
- readonly,
283
- disabled,
284
- autofocus,
285
- onBlur,
286
- onFocus,
287
- onChange,
288
- options,
289
- schema,
290
- rawErrors,
291
- placeholder
292
- } = props;
293
- const inputProps = useMemo(() => {
294
- return getInputProps(schema, type, options);
295
- }, [schema, type, options]);
296
- const safeValue = useMemo(() => {
297
- if (value === null || value === void 0) return "";
298
- return String(value);
299
- }, [value]);
300
- const hasError = useMemo(() => {
301
- return rawErrors && rawErrors.length > 0;
302
- }, [rawErrors]);
303
- const handleChange = useCallback((event) => {
304
- const val = event.target.value;
305
- if (val === "") {
306
- onChange(options?.emptyValue ?? "");
307
- return;
308
- }
309
- if (inputProps.type === "number" || schema.type === "number" || schema.type === "integer") {
310
- const num = Number(val);
311
- onChange(isNaN(num) ? val : num);
312
- return;
313
- }
314
- onChange(val);
315
- }, [onChange, inputProps.type, schema.type, options?.emptyValue]);
316
- const handleBlur = useCallback((event) => {
317
- onBlur(id, event.target.value);
318
- }, [id, onBlur]);
319
- const handleFocus = useCallback((event) => {
320
- onFocus(id, event.target.value);
321
- }, [id, onFocus]);
322
- const inputType = useMemo(() => {
323
- if (inputProps.type) return inputProps.type;
324
- if (schema.type === "number" || schema.type === "integer") return "number";
325
- return "text";
326
- }, [inputProps.type, schema.type]);
327
- return /* @__PURE__ */ jsx(
328
- Input,
329
- {
330
- id,
331
- type: inputType,
332
- value: safeValue,
333
- disabled,
334
- readOnly: readonly,
335
- autoFocus: autofocus,
336
- onChange: handleChange,
337
- onBlur: handleBlur,
338
- onFocus: handleFocus,
339
- placeholder,
340
- className: hasError ? "border-destructive" : "",
341
- step: inputProps.step,
342
- min: inputProps.min,
343
- max: inputProps.max
344
- }
345
- );
346
- }
347
- __name(BaseInputTemplate, "BaseInputTemplate");
348
- function validateSchema(schema) {
349
- if (!schema || typeof schema !== "object") {
350
- if (isDev) {
351
- consola2.error("[JsonSchemaForm] Invalid schema: must be an object", schema);
352
- }
353
- return null;
354
- }
355
- const hasValidStructure = schema.type || schema.properties || schema.$ref || schema.$schema;
356
- if (!hasValidStructure) {
357
- if (isDev) {
358
- consola2.error("[JsonSchemaForm] Invalid schema: missing type, properties, $ref, or $schema", schema);
359
- }
360
- return null;
361
- }
362
- if (isDev) {
363
- consola2.success("[JsonSchemaForm] Schema validated successfully:", {
364
- type: schema.type,
365
- title: schema.title,
366
- hasProperties: !!schema.properties,
367
- hasRequired: !!schema.required
368
- });
369
- }
370
- return schema;
371
- }
372
- __name(validateSchema, "validateSchema");
373
- function normalizeFormData(formData, schema) {
374
- if (formData === null || formData === void 0) {
375
- return schema.type === "object" ? {} : schema.type === "array" ? [] : null;
376
- }
377
- const normalized = JSON.parse(JSON.stringify(formData));
378
- return removeUndefined(normalized);
379
- }
380
- __name(normalizeFormData, "normalizeFormData");
381
- function removeUndefined(obj) {
382
- if (obj === null || obj === void 0) {
383
- return obj;
384
- }
385
- if (Array.isArray(obj)) {
386
- return obj.map(removeUndefined).filter((item) => item !== void 0);
387
- }
388
- if (typeof obj === "object") {
389
- const cleaned = {};
390
- for (const key in obj) {
391
- if (obj[key] !== void 0) {
392
- cleaned[key] = removeUndefined(obj[key]);
393
- }
394
- }
395
- return cleaned;
396
- }
397
- return obj;
398
- }
399
- __name(removeUndefined, "removeUndefined");
400
- function mergeDefaults(formData, schema) {
401
- if (!schema) return formData;
402
- const result = { ...formData };
403
- if (schema.type === "object" && schema.properties) {
404
- for (const [key, propSchema] of Object.entries(schema.properties)) {
405
- const prop = propSchema;
406
- if (result[key] === void 0 && prop.default !== void 0) {
407
- result[key] = prop.default;
408
- }
409
- if (prop.type === "object" && result[key]) {
410
- result[key] = mergeDefaults(result[key], prop);
411
- }
412
- }
413
- }
414
- return result;
415
- }
416
- __name(mergeDefaults, "mergeDefaults");
417
- function safeJsonParse(jsonString, fallback) {
418
- try {
419
- return JSON.parse(jsonString);
420
- } catch (error) {
421
- consola2.error("[JsonSchemaForm] JSON parse error:", error);
422
- return fallback;
423
- }
424
- }
425
- __name(safeJsonParse, "safeJsonParse");
426
- function safeJsonStringify(obj, pretty = true) {
427
- try {
428
- return JSON.stringify(obj, null, pretty ? 2 : 0);
429
- } catch (error) {
430
- consola2.error("[JsonSchemaForm] JSON stringify error:", error);
431
- return "{}";
432
- }
433
- }
434
- __name(safeJsonStringify, "safeJsonStringify");
435
- function hasRequiredFields(schema) {
436
- return Array.isArray(schema.required) && schema.required.length > 0;
437
- }
438
- __name(hasRequiredFields, "hasRequiredFields");
439
- function getRequiredFields(schema, prefix = "") {
440
- const required = [];
441
- if (schema.required && Array.isArray(schema.required)) {
442
- required.push(...schema.required.map(
443
- (field) => prefix ? `${prefix}.${field}` : field
444
- ));
445
- }
446
- if (schema.type === "object" && schema.properties) {
447
- for (const [key, propSchema] of Object.entries(schema.properties)) {
448
- const prop = propSchema;
449
- const fieldPath = prefix ? `${prefix}.${key}` : key;
450
- required.push(...getRequiredFields(prop, fieldPath));
451
- }
452
- }
453
- return required;
454
- }
455
- __name(getRequiredFields, "getRequiredFields");
456
- function validateRequiredFields(formData, schema) {
457
- const requiredFields = getRequiredFields(schema);
458
- const missing = [];
459
- for (const field of requiredFields) {
460
- const value = getNestedValue(formData, field);
461
- if (value === void 0 || value === null || value === "") {
462
- missing.push(field);
463
- }
464
- }
465
- return {
466
- valid: missing.length === 0,
467
- missing
468
- };
469
- }
470
- __name(validateRequiredFields, "validateRequiredFields");
471
- function getNestedValue(obj, path) {
472
- return path.split(".").reduce((current, key) => current?.[key], obj);
473
- }
474
- __name(getNestedValue, "getNestedValue");
475
- function evaluateDisabledWhen(rule, formData) {
476
- if (!rule) return false;
477
- const value = getNestedValue(formData, rule.path);
478
- if ("eq" in rule) return value === rule.eq;
479
- if ("notEq" in rule) return value !== rule.notEq;
480
- if ("in" in rule) return rule.in.includes(value);
481
- if ("notIn" in rule) return !rule.notIn.includes(value);
482
- if ("truthy" in rule) return Boolean(value);
483
- if ("falsy" in rule) return !value;
484
- return false;
485
- }
486
- __name(evaluateDisabledWhen, "evaluateDisabledWhen");
487
- function TextWidget(props) {
488
- const {
489
- id,
490
- placeholder,
491
- required,
492
- disabled,
493
- readonly,
494
- autofocus,
495
- value,
496
- onChange,
497
- onBlur,
498
- onFocus,
499
- options,
500
- schema,
501
- rawErrors
502
- } = props;
503
- const config = useMemo(() => ({
504
- isTextarea: options?.widget === "textarea",
505
- rows: options?.rows || 3,
506
- emptyValue: options?.emptyValue
507
- }), [options]);
508
- const safeValue = useMemo(() => {
509
- if (value === null || value === void 0) return "";
510
- return String(value);
511
- }, [value]);
512
- const hasError = useMemo(() => {
513
- return rawErrors && rawErrors.length > 0;
514
- }, [rawErrors]);
515
- const handleChange = useCallback((event) => {
516
- const newValue = event.target.value;
517
- onChange(newValue === "" ? config.emptyValue : newValue);
518
- }, [onChange, config.emptyValue]);
519
- const handleBlur = useCallback((event) => {
520
- onBlur(id, event.target.value);
521
- }, [id, onBlur]);
522
- const handleFocus = useCallback((event) => {
523
- onFocus(id, event.target.value);
524
- }, [id, onFocus]);
525
- if (config.isTextarea) {
526
- return /* @__PURE__ */ jsx(
527
- "textarea",
528
- {
529
- id,
530
- className: `flex min-h-[80px] w-full rounded-md border ${hasError ? "border-destructive" : "border-input"} bg-transparent px-3 py-2 text-base shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm`,
531
- placeholder,
532
- disabled: disabled || readonly,
533
- readOnly: readonly,
534
- autoFocus: autofocus,
535
- value: safeValue,
536
- required,
537
- onChange: handleChange,
538
- onBlur: handleBlur,
539
- onFocus: handleFocus,
540
- rows: config.rows
541
- }
542
- );
543
- }
544
- return /* @__PURE__ */ jsx(
545
- Input,
546
- {
547
- id,
548
- type: "text",
549
- placeholder,
550
- disabled,
551
- readOnly: readonly,
552
- autoFocus: autofocus,
553
- value: safeValue,
554
- required,
555
- onChange: handleChange,
556
- onBlur: handleBlur,
557
- onFocus: handleFocus,
558
- className: hasError ? "border-destructive" : ""
559
- }
560
- );
561
- }
562
- __name(TextWidget, "TextWidget");
563
- function NumberWidget(props) {
564
- const {
565
- id,
566
- placeholder,
567
- required,
568
- disabled,
569
- readonly,
570
- autofocus,
571
- value,
572
- onChange,
573
- onBlur,
574
- onFocus,
575
- options,
576
- schema,
577
- rawErrors
578
- } = props;
579
- const config = useMemo(() => ({
580
- isInteger: schema.type === "integer",
581
- step: schema.type === "integer" ? "1" : "any",
582
- min: schema.minimum,
583
- max: schema.maximum,
584
- emptyValue: options?.emptyValue
585
- }), [schema, options]);
586
- const safeValue = useMemo(() => {
587
- if (value === null || value === void 0 || value === "") return "";
588
- if (typeof value === "number" && !isNaN(value)) return value;
589
- return "";
590
- }, [value]);
591
- const hasError = useMemo(() => {
592
- return rawErrors && rawErrors.length > 0;
593
- }, [rawErrors]);
594
- const handleChange = useCallback((event) => {
595
- const newValue = event.target.value;
596
- if (newValue === "") {
597
- onChange(config.emptyValue);
598
- } else {
599
- const parsedValue = config.isInteger ? parseInt(newValue, 10) : parseFloat(newValue);
600
- onChange(isNaN(parsedValue) ? config.emptyValue : parsedValue);
601
- }
602
- }, [onChange, config]);
603
- const handleBlur = useCallback((event) => {
604
- onBlur(id, event.target.value);
605
- }, [id, onBlur]);
606
- const handleFocus = useCallback((event) => {
607
- onFocus(id, event.target.value);
608
- }, [id, onFocus]);
609
- return /* @__PURE__ */ jsx(
610
- Input,
611
- {
612
- id,
613
- type: "number",
614
- placeholder,
615
- disabled,
616
- readOnly: readonly,
617
- autoFocus: autofocus,
618
- value: safeValue,
619
- required,
620
- onChange: handleChange,
621
- onBlur: handleBlur,
622
- onFocus: handleFocus,
623
- step: config.step,
624
- min: config.min,
625
- max: config.max,
626
- className: hasError ? "border-destructive" : ""
627
- }
628
- );
629
- }
630
- __name(NumberWidget, "NumberWidget");
631
-
632
- // src/tools/JsonForm/widgets/_useWidgetEnv.ts
633
- function useWidgetEnv(props) {
634
- const { disabled, readonly, formContext, uiSchema, schema } = props;
635
- const density = formContext?.density ?? "comfortable";
636
- const compact = density === "compact";
637
- const disabledWhen = uiSchema?.["ui:disabledWhen"];
638
- const disabledByRule = evaluateDisabledWhen(disabledWhen, formContext?.formData);
639
- const tooltipText = compact ? uiSchema?.["ui:description"] ?? schema?.description : void 0;
640
- return {
641
- density,
642
- compact,
643
- disabled: Boolean(disabled || readonly || disabledByRule),
644
- tooltipText
645
- };
646
- }
647
- __name(useWidgetEnv, "useWidgetEnv");
648
- function CheckboxWidget(props) {
649
- const { id, value, autofocus, onChange, onBlur, onFocus } = props;
650
- const { disabled, tooltipText } = useWidgetEnv(props);
651
- const handleChange = /* @__PURE__ */ __name((checked) => {
652
- onChange(checked);
653
- }, "handleChange");
654
- return /* @__PURE__ */ jsx(
655
- Checkbox,
656
- {
657
- id,
658
- checked: value || false,
659
- disabled,
660
- autoFocus: autofocus,
661
- onCheckedChange: handleChange,
662
- onBlur: () => onBlur(id, value),
663
- onFocus: () => onFocus(id, value),
664
- title: tooltipText
665
- }
666
- );
667
- }
668
- __name(CheckboxWidget, "CheckboxWidget");
669
- function SelectWidget(props) {
670
- const {
671
- id,
672
- options,
673
- value,
674
- required,
675
- autofocus,
676
- onChange,
677
- onBlur,
678
- onFocus,
679
- placeholder,
680
- rawErrors
681
- } = props;
682
- const { disabled, compact, tooltipText } = useWidgetEnv(props);
683
- const enumOptions = useMemo(() => {
684
- const opts = options?.enumOptions;
685
- if (!Array.isArray(opts)) return [];
686
- return opts.filter((opt) => opt && opt.value !== void 0);
687
- }, [options]);
688
- const hasError = useMemo(() => {
689
- return rawErrors && rawErrors.length > 0;
690
- }, [rawErrors]);
691
- const safeValue = useMemo(() => {
692
- if (value === null || value === void 0) return "";
693
- return String(value);
694
- }, [value]);
695
- const handleChange = useCallback((newValue) => {
696
- onChange(newValue);
697
- onBlur(id, newValue);
698
- }, [onChange, onBlur, id]);
699
- if (enumOptions.length === 0) {
700
- return /* @__PURE__ */ jsx(
701
- "input",
702
- {
703
- id,
704
- type: "text",
705
- value: safeValue,
706
- onChange: (e) => onChange(e.target.value),
707
- onBlur: (e) => onBlur(id, e.target.value),
708
- onFocus: (e) => onFocus(id, e.target.value),
709
- disabled,
710
- readOnly: disabled,
711
- title: tooltipText,
712
- className: `flex h-10 w-full rounded-md border ${hasError ? "border-destructive" : "border-input"} bg-transparent px-3 py-2 text-base shadow-sm transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm`,
713
- placeholder
714
- }
715
- );
716
- }
717
- return /* @__PURE__ */ jsxs(
718
- Select,
719
- {
720
- value: safeValue,
721
- onValueChange: handleChange,
722
- disabled,
723
- required,
724
- children: [
725
- /* @__PURE__ */ jsx(
726
- SelectTrigger,
727
- {
728
- id,
729
- className: `${hasError ? "border-destructive" : ""} ${compact ? "h-7 text-xs" : ""}`.trim(),
730
- autoFocus: autofocus,
731
- onFocus: () => onFocus(id, value),
732
- title: tooltipText,
733
- children: /* @__PURE__ */ jsx(SelectValue, { placeholder: placeholder || "Select an option" })
734
- }
735
- ),
736
- /* @__PURE__ */ jsx(SelectContent, { children: enumOptions.map((option) => {
737
- const optValue = String(option.value);
738
- return /* @__PURE__ */ jsx(SelectItem, { value: optValue, children: option.label || optValue }, optValue || "__empty__");
739
- }) })
740
- ]
741
- }
742
- );
743
- }
744
- __name(SelectWidget, "SelectWidget");
745
- function SwitchWidget(props) {
746
- const { id, value, onChange, onBlur, onFocus } = props;
747
- const { disabled, tooltipText } = useWidgetEnv(props);
748
- const handleChange = /* @__PURE__ */ __name((checked) => {
749
- onChange(checked);
750
- }, "handleChange");
751
- return /* @__PURE__ */ jsx(
752
- Switch,
753
- {
754
- id,
755
- checked: value || false,
756
- disabled,
757
- onCheckedChange: handleChange,
758
- onBlur: () => onBlur(id, value),
759
- onFocus: () => onFocus(id, value),
760
- title: tooltipText
761
- }
762
- );
763
- }
764
- __name(SwitchWidget, "SwitchWidget");
765
- function ColorWidget(props) {
766
- const {
767
- id,
768
- placeholder,
769
- required,
770
- disabled,
771
- readonly,
772
- autofocus,
773
- value,
774
- onChange,
775
- onBlur,
776
- onFocus,
777
- options,
778
- rawErrors
779
- } = props;
780
- const t = useAppT();
781
- const pickColorLabel = useMemo(() => t("tools.color.pick"), [t]);
782
- const colorInputRef = useRef(null);
783
- const format = useMemo(() => {
784
- if (options?.format) return options.format;
785
- if (typeof value === "string" && value.startsWith("#")) return "hex";
786
- return "hsl";
787
- }, [options?.format, value]);
788
- const safeValue = useMemo(() => {
789
- if (value === null || value === void 0) return "";
790
- return String(value);
791
- }, [value]);
792
- const hslToCss = useCallback((hslValue) => {
793
- if (!hslValue) return "transparent";
794
- if (hslValue.startsWith("#")) return hslValue;
795
- if (hslValue.startsWith("hsl")) return hslValue;
796
- const parts = hslValue.split(" ");
797
- if (parts.length === 3) {
798
- return `hsl(${parts[0]}, ${parts[1]}, ${parts[2]})`;
799
- }
800
- return "transparent";
801
- }, []);
802
- const previewColor = useMemo(() => {
803
- return hslToCss(safeValue);
804
- }, [safeValue, hslToCss]);
805
- const hexToHsl = useCallback((hex) => {
806
- hex = hex.replace("#", "");
807
- const r = parseInt(hex.substring(0, 2), 16) / 255;
808
- const g = parseInt(hex.substring(2, 4), 16) / 255;
809
- const b = parseInt(hex.substring(4, 6), 16) / 255;
810
- const max = Math.max(r, g, b);
811
- const min = Math.min(r, g, b);
812
- let h = 0;
813
- let s = 0;
814
- const l = (max + min) / 2;
815
- if (max !== min) {
816
- const d = max - min;
817
- s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
818
- switch (max) {
819
- case r:
820
- h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
821
- break;
822
- case g:
823
- h = ((b - r) / d + 2) / 6;
824
- break;
825
- case b:
826
- h = ((r - g) / d + 4) / 6;
827
- break;
828
- }
829
- }
830
- return `${Math.round(h * 360)} ${Math.round(s * 100)}% ${Math.round(l * 100)}%`;
831
- }, []);
832
- const hslToHex = useCallback((hslValue) => {
833
- if (!hslValue || hslValue.startsWith("#")) return hslValue || "#000000";
834
- const parts = hslValue.split(" ");
835
- if (parts.length !== 3) return "#000000";
836
- const h = parseInt(parts[0]) / 360;
837
- const s = parseInt(parts[1].replace("%", "")) / 100;
838
- const l = parseInt(parts[2].replace("%", "")) / 100;
839
- const hue2rgb = /* @__PURE__ */ __name((p, q, t2) => {
840
- if (t2 < 0) t2 += 1;
841
- if (t2 > 1) t2 -= 1;
842
- if (t2 < 1 / 6) return p + (q - p) * 6 * t2;
843
- if (t2 < 1 / 2) return q;
844
- if (t2 < 2 / 3) return p + (q - p) * (2 / 3 - t2) * 6;
845
- return p;
846
- }, "hue2rgb");
847
- let r, g, b;
848
- if (s === 0) {
849
- r = g = b = l;
850
- } else {
851
- const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
852
- const p = 2 * l - q;
853
- r = hue2rgb(p, q, h + 1 / 3);
854
- g = hue2rgb(p, q, h);
855
- b = hue2rgb(p, q, h - 1 / 3);
856
- }
857
- const toHex = /* @__PURE__ */ __name((x) => {
858
- const hex = Math.round(x * 255).toString(16);
859
- return hex.length === 1 ? "0" + hex : hex;
860
- }, "toHex");
861
- return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
862
- }, []);
863
- const hasError = useMemo(() => {
864
- return rawErrors && rawErrors.length > 0;
865
- }, [rawErrors]);
866
- const handleChange = useCallback((event) => {
867
- const newValue = event.target.value;
868
- onChange(newValue);
869
- }, [onChange]);
870
- const handleColorPickerChange = useCallback((event) => {
871
- const hexValue2 = event.target.value;
872
- if (format === "hsl") {
873
- onChange(hexToHsl(hexValue2));
874
- } else {
875
- onChange(hexValue2);
876
- }
877
- }, [onChange, format, hexToHsl]);
878
- const handleBlur = useCallback((event) => {
879
- onBlur(id, event.target.value);
880
- }, [id, onBlur]);
881
- const handleFocus = useCallback((event) => {
882
- onFocus(id, event.target.value);
883
- }, [id, onFocus]);
884
- const hexValue = useMemo(() => {
885
- if (format === "hex" || safeValue.startsWith("#")) {
886
- return safeValue || "#000000";
887
- }
888
- return hslToHex(safeValue);
889
- }, [safeValue, format, hslToHex]);
890
- const handleColorBoxClick = useCallback(() => {
891
- if (!disabled && !readonly) {
892
- colorInputRef.current?.click();
893
- }
894
- }, [disabled, readonly]);
895
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
896
- /* @__PURE__ */ jsxs("div", { className: "relative", children: [
897
- /* @__PURE__ */ jsx(
898
- "button",
899
- {
900
- type: "button",
901
- onClick: handleColorBoxClick,
902
- disabled: disabled || readonly,
903
- className: "h-10 w-10 shrink-0 rounded-md border-2 border-input cursor-pointer hover:border-ring focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
904
- style: { backgroundColor: previewColor },
905
- "aria-label": pickColorLabel
906
- }
907
- ),
908
- /* @__PURE__ */ jsx(
909
- "input",
910
- {
911
- ref: colorInputRef,
912
- type: "color",
913
- value: hexValue,
914
- onChange: handleColorPickerChange,
915
- className: "absolute inset-0 opacity-0 w-full h-full cursor-pointer",
916
- disabled: disabled || readonly,
917
- tabIndex: -1
918
- }
919
- )
920
- ] }),
921
- /* @__PURE__ */ jsx(
922
- Input,
923
- {
924
- id,
925
- type: "text",
926
- placeholder: placeholder || (format === "hsl" ? "217 91% 60%" : "#3b82f6"),
927
- disabled,
928
- readOnly: readonly,
929
- autoFocus: autofocus,
930
- value: safeValue,
931
- required,
932
- onChange: handleChange,
933
- onBlur: handleBlur,
934
- onFocus: handleFocus,
935
- className: `flex-1 font-mono text-sm ${hasError ? "border-destructive" : ""}`
936
- }
937
- )
938
- ] });
939
- }
940
- __name(ColorWidget, "ColorWidget");
941
- function SliderWidget(props) {
942
- const {
943
- id,
944
- value,
945
- onChange,
946
- schema,
947
- options,
948
- rawErrors
949
- } = props;
950
- const { disabled, tooltipText } = useWidgetEnv(props);
951
- const config = useMemo(() => {
952
- const min = schema.minimum ?? options?.min ?? 0;
953
- const max = schema.maximum ?? options?.max ?? 100;
954
- const step = options?.step ?? (schema.type === "integer" ? 1 : 0.1);
955
- const unit = options?.unit;
956
- const showInput = options?.showInput !== false;
957
- return { min, max, step, unit, showInput };
958
- }, [schema, options]);
959
- const numericValue = useMemo(() => {
960
- if (value === null || value === void 0 || value === "") {
961
- return config.min;
962
- }
963
- if (typeof value === "number") {
964
- return value;
965
- }
966
- if (typeof value === "string") {
967
- const parsed = parseFloat(value);
968
- return isNaN(parsed) ? config.min : parsed;
969
- }
970
- return config.min;
971
- }, [value, config.min]);
972
- const hasError = useMemo(() => {
973
- return rawErrors && rawErrors.length > 0;
974
- }, [rawErrors]);
975
- const handleSliderChange = useCallback((values) => {
976
- const newValue = values[0];
977
- if (config.unit) {
978
- onChange(`${newValue}${config.unit}`);
979
- } else {
980
- onChange(newValue);
981
- }
982
- }, [onChange, config.unit]);
983
- const handleInputChange = useCallback((event) => {
984
- const inputValue = event.target.value;
985
- if (config.unit) {
986
- const cleanValue = inputValue.replace(config.unit, "").trim();
987
- const parsed = parseFloat(cleanValue);
988
- if (!isNaN(parsed)) {
989
- onChange(`${parsed}${config.unit}`);
990
- } else if (inputValue === "") {
991
- onChange(`${config.min}${config.unit}`);
992
- }
993
- } else {
994
- const parsed = parseFloat(inputValue);
995
- onChange(isNaN(parsed) ? config.min : parsed);
996
- }
997
- }, [onChange, config.unit, config.min]);
998
- const displayValue = useMemo(() => {
999
- if (config.unit) {
1000
- return `${numericValue}${config.unit}`;
1001
- }
1002
- return String(numericValue);
1003
- }, [numericValue, config.unit]);
1004
- return /* @__PURE__ */ jsxs(
1005
- "div",
1006
- {
1007
- className: cn("flex items-center gap-3", hasError && "text-destructive"),
1008
- title: tooltipText,
1009
- children: [
1010
- /* @__PURE__ */ jsx(
1011
- Slider,
1012
- {
1013
- id,
1014
- disabled,
1015
- value: [numericValue],
1016
- onValueChange: handleSliderChange,
1017
- min: config.min,
1018
- max: config.max,
1019
- step: config.step,
1020
- className: "flex-1"
1021
- }
1022
- ),
1023
- config.showInput ? /* @__PURE__ */ jsx(
1024
- Input,
1025
- {
1026
- type: "text",
1027
- value: displayValue,
1028
- onChange: handleInputChange,
1029
- disabled,
1030
- readOnly: disabled,
1031
- className: cn(
1032
- "w-20 text-center font-mono text-sm",
1033
- hasError && "border-destructive"
1034
- )
1035
- }
1036
- ) : /* @__PURE__ */ jsx("span", { className: "w-16 text-right font-mono text-sm text-muted-foreground", children: displayValue })
1037
- ]
1038
- }
1039
- );
1040
- }
1041
- __name(SliderWidget, "SliderWidget");
1042
- function JsonSchemaForm(props) {
1043
- const {
1044
- schema,
1045
- uiSchema,
1046
- formData,
1047
- onSubmit,
1048
- onChange,
1049
- onError,
1050
- showErrorList = "top",
1051
- liveValidate = false,
1052
- disabled = false,
1053
- readonly = false,
1054
- className,
1055
- showSubmitButton = true,
1056
- submitButtonText = "Submit",
1057
- density = "comfortable",
1058
- formContext: callerFormContext,
1059
- ...restProps
1060
- } = props;
1061
- const validatedSchema = useMemo(() => {
1062
- if (isDev) {
1063
- consola2.info("[JsonSchemaForm] Validating schema...", schema);
1064
- }
1065
- const result = validateSchema(schema);
1066
- if (!result && isDev) {
1067
- consola2.error("[JsonSchemaForm] Schema validation failed");
1068
- }
1069
- return result;
1070
- }, [schema]);
1071
- const normalizedFormData = useMemo(() => {
1072
- if (!validatedSchema) {
1073
- if (isDev) {
1074
- consola2.warn("[JsonSchemaForm] Cannot normalize formData - invalid schema");
1075
- }
1076
- return null;
1077
- }
1078
- if (isDev) {
1079
- consola2.info("[JsonSchemaForm] Normalizing formData...", formData);
1080
- }
1081
- const normalized = normalizeFormData(formData, validatedSchema);
1082
- if (isDev) {
1083
- consola2.info("[JsonSchemaForm] Normalized formData:", normalized);
1084
- }
1085
- return normalized;
1086
- }, [formData, validatedSchema]);
1087
- const widgets = useMemo(() => ({
1088
- // Standard widget names (PascalCase) - used by RJSF internally
1089
- TextWidget,
1090
- NumberWidget,
1091
- CheckboxWidget,
1092
- SelectWidget,
1093
- SwitchWidget,
1094
- ColorWidget,
1095
- SliderWidget,
1096
- // Lowercase aliases - for uiSchema 'ui:widget' references
1097
- text: TextWidget,
1098
- number: NumberWidget,
1099
- checkbox: CheckboxWidget,
1100
- select: SelectWidget,
1101
- switch: SwitchWidget,
1102
- color: ColorWidget,
1103
- slider: SliderWidget,
1104
- range: SliderWidget
1105
- // alias
1106
- }), []);
1107
- const safeUiSchema = useMemo(() => {
1108
- if (!uiSchema) return uiSchema;
1109
- const known = new Set(Object.keys(widgets));
1110
- let dirty = false;
1111
- function walk(node) {
1112
- if (!node || typeof node !== "object") return node;
1113
- if (Array.isArray(node)) return node.map(walk);
1114
- const out = {};
1115
- for (const [k, v] of Object.entries(node)) {
1116
- if (k === "ui:widget" && typeof v === "string" && !known.has(v)) {
1117
- dirty = true;
1118
- if (isDev) {
1119
- consola2.error(
1120
- `[JsonSchemaForm] Unknown widget "${v}" \u2014 falling back to default. Available: ${[...known].filter((w) => w[0]?.toLowerCase() === w[0]).join(", ")}`
1121
- );
1122
- }
1123
- continue;
1124
- }
1125
- out[k] = walk(v);
1126
- }
1127
- return out;
1128
- }
1129
- __name(walk, "walk");
1130
- const cleaned = walk(uiSchema);
1131
- return dirty ? cleaned : uiSchema;
1132
- }, [uiSchema, widgets]);
1133
- const templates = useMemo(() => ({
1134
- FieldTemplate,
1135
- ObjectFieldTemplate,
1136
- ArrayFieldTemplate,
1137
- ArrayFieldItemTemplate,
1138
- ErrorListTemplate,
1139
- BaseInputTemplate
1140
- }), []);
1141
- const handleSubmit = useCallback((data) => {
1142
- if (onSubmit) {
1143
- const cleanData = {
1144
- ...data,
1145
- formData: normalizeFormData(data.formData, validatedSchema)
1146
- };
1147
- onSubmit(cleanData);
1148
- }
1149
- }, [onSubmit, validatedSchema]);
1150
- const handleChange = useCallback((data) => {
1151
- if (onChange) {
1152
- onChange(data);
1153
- }
1154
- }, [onChange]);
1155
- const handleError = useCallback((errors) => {
1156
- if (onError) {
1157
- onError(errors);
1158
- }
1159
- }, [onError]);
1160
- if (!validatedSchema) {
1161
- return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
1162
- /* @__PURE__ */ jsx(AlertCircle, { className: "h-4 w-4" }),
1163
- /* @__PURE__ */ jsx(AlertDescription, { children: "Invalid schema provided. Please check the schema format." })
1164
- ] }) });
1165
- }
1166
- const formContext = useMemo(() => ({
1167
- ...callerFormContext,
1168
- density,
1169
- formData: normalizedFormData
1170
- }), [callerFormContext, density, normalizedFormData]);
1171
- return /* @__PURE__ */ jsx("div", { className, "data-jsonform-density": density, children: /* @__PURE__ */ jsx(
1172
- Form,
1173
- {
1174
- schema: validatedSchema,
1175
- uiSchema: safeUiSchema,
1176
- formData: normalizedFormData,
1177
- validator,
1178
- widgets,
1179
- templates,
1180
- formContext,
1181
- onSubmit: handleSubmit,
1182
- onChange: handleChange,
1183
- onError: handleError,
1184
- showErrorList,
1185
- liveValidate,
1186
- disabled,
1187
- readonly,
1188
- ...restProps,
1189
- children: showSubmitButton && /* @__PURE__ */ jsx("div", { className: "mt-6 flex gap-2", children: /* @__PURE__ */ jsx(Button, { type: "submit", disabled, children: submitButtonText }) })
1190
- }
1191
- ) });
1192
- }
1193
- __name(JsonSchemaForm, "JsonSchemaForm");
1194
-
1195
- export { ArrayFieldItemTemplate, ArrayFieldTemplate, BaseInputTemplate, CheckboxWidget, ColorWidget, ErrorListTemplate, FieldTemplate, JsonSchemaForm, NumberWidget, ObjectFieldTemplate, SelectWidget, SliderWidget, SwitchWidget, TextWidget, evaluateDisabledWhen, getRequiredFields, hasRequiredFields, mergeDefaults, normalizeFormData, safeJsonParse, safeJsonStringify, validateRequiredFields, validateSchema };
1196
- //# sourceMappingURL=chunk-GYIO7W7M.mjs.map
1197
- //# sourceMappingURL=chunk-GYIO7W7M.mjs.map