@djangocfg/ui-tools 2.1.109 → 2.1.111
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.
- package/README.md +242 -49
- package/dist/JsonSchemaForm-65NLLK56.mjs +4 -0
- package/dist/JsonSchemaForm-65NLLK56.mjs.map +1 -0
- package/dist/JsonSchemaForm-PY6DH3HE.cjs +13 -0
- package/dist/JsonSchemaForm-PY6DH3HE.cjs.map +1 -0
- package/dist/JsonTree-6RYAOPSS.mjs +4 -0
- package/dist/JsonTree-6RYAOPSS.mjs.map +1 -0
- package/dist/JsonTree-7OH6CIHT.cjs +10 -0
- package/dist/JsonTree-7OH6CIHT.cjs.map +1 -0
- package/dist/MapContainer-GXQLP5WY.mjs +214 -0
- package/dist/MapContainer-GXQLP5WY.mjs.map +1 -0
- package/dist/MapContainer-RYG4HPH4.cjs +221 -0
- package/dist/MapContainer-RYG4HPH4.cjs.map +1 -0
- package/dist/{Mermaid.client-4OCKJ6QD.mjs → Mermaid.client-OKACITCW.mjs} +16 -7
- package/dist/Mermaid.client-OKACITCW.mjs.map +1 -0
- package/dist/{Mermaid.client-ZP6OE46Z.cjs → Mermaid.client-PNXEC6YL.cjs} +16 -7
- package/dist/Mermaid.client-PNXEC6YL.cjs.map +1 -0
- package/dist/{PlaygroundLayout-XXVBU4WZ.cjs → PlaygroundLayout-SYMEAG3J.cjs} +25 -24
- package/dist/PlaygroundLayout-SYMEAG3J.cjs.map +1 -0
- package/dist/{PlaygroundLayout-LMQTVXSP.mjs → PlaygroundLayout-UQRBU5RH.mjs} +4 -3
- package/dist/PlaygroundLayout-UQRBU5RH.mjs.map +1 -0
- package/dist/{PrettyCode.client-2CLSV2VD.cjs → PrettyCode.client-DANYYQYO.cjs} +11 -4
- package/dist/PrettyCode.client-DANYYQYO.cjs.map +1 -0
- package/dist/{PrettyCode.client-Y2BVON7R.mjs → PrettyCode.client-RS5ZTNBT.mjs} +11 -4
- package/dist/PrettyCode.client-RS5ZTNBT.mjs.map +1 -0
- package/dist/chunk-2DSR7V2L.mjs +561 -0
- package/dist/chunk-2DSR7V2L.mjs.map +1 -0
- package/dist/chunk-47T5ECYV.cjs +1357 -0
- package/dist/chunk-47T5ECYV.cjs.map +1 -0
- package/dist/chunk-5QT3QYFZ.cjs +189 -0
- package/dist/chunk-5QT3QYFZ.cjs.map +1 -0
- package/dist/chunk-7IIRYG4S.mjs +1057 -0
- package/dist/chunk-7IIRYG4S.mjs.map +1 -0
- package/dist/{chunk-FB5QBSI3.cjs → chunk-DI3HUXHK.cjs} +15 -195
- package/dist/chunk-DI3HUXHK.cjs.map +1 -0
- package/dist/chunk-EVGWYASL.cjs +1528 -0
- package/dist/chunk-EVGWYASL.cjs.map +1 -0
- package/dist/chunk-F2N7P5XU.cjs +30 -0
- package/dist/chunk-F2N7P5XU.cjs.map +1 -0
- package/dist/{chunk-L6UHASYQ.mjs → chunk-G6PRZP5I.mjs} +7 -186
- package/dist/chunk-G6PRZP5I.mjs.map +1 -0
- package/dist/chunk-JWB2EWQO.mjs +5 -0
- package/dist/chunk-JWB2EWQO.mjs.map +1 -0
- package/dist/chunk-LTJX2JXE.mjs +338 -0
- package/dist/chunk-LTJX2JXE.mjs.map +1 -0
- package/dist/chunk-OVNC4KW6.mjs +1494 -0
- package/dist/chunk-OVNC4KW6.mjs.map +1 -0
- package/dist/chunk-PNZSJN6T.cjs +1086 -0
- package/dist/chunk-PNZSJN6T.cjs.map +1 -0
- package/dist/chunk-TEFRA7GW.cjs +565 -0
- package/dist/chunk-TEFRA7GW.cjs.map +1 -0
- package/dist/chunk-UOMPPIED.mjs +1343 -0
- package/dist/chunk-UOMPPIED.mjs.map +1 -0
- package/dist/chunk-W6YHQI4F.mjs +187 -0
- package/dist/chunk-W6YHQI4F.mjs.map +1 -0
- package/dist/chunk-XTBRWVIV.cjs +346 -0
- package/dist/chunk-XTBRWVIV.cjs.map +1 -0
- package/dist/components-C7ZL7OMY.mjs +5 -0
- package/dist/components-C7ZL7OMY.mjs.map +1 -0
- package/dist/components-CJ2IB65O.cjs +27 -0
- package/dist/components-CJ2IB65O.cjs.map +1 -0
- package/dist/components-EASJYK45.mjs +6 -0
- package/dist/components-EASJYK45.mjs.map +1 -0
- package/dist/components-LDRFDV4A.cjs +22 -0
- package/dist/components-LDRFDV4A.cjs.map +1 -0
- package/dist/components-VZKUTDJK.mjs +5 -0
- package/dist/components-VZKUTDJK.mjs.map +1 -0
- package/dist/components-Y64GTIMQ.cjs +42 -0
- package/dist/components-Y64GTIMQ.cjs.map +1 -0
- package/dist/index.cjs +701 -4813
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1274 -1026
- package/dist/index.d.ts +1274 -1026
- package/dist/index.mjs +358 -4730
- package/dist/index.mjs.map +1 -1
- package/package.json +27 -4
- package/src/components/index.ts +17 -0
- package/src/components/lazy-wrapper.tsx +281 -0
- package/src/index.ts +92 -7
- package/src/tools/AudioPlayer/components/HybridAudioPlayer.tsx +14 -5
- package/src/tools/AudioPlayer/lazy.tsx +85 -0
- package/src/tools/Gallery/components/Gallery.tsx +182 -0
- package/src/tools/Gallery/components/GalleryCarousel.tsx +251 -0
- package/src/tools/Gallery/components/GalleryCompact.tsx +173 -0
- package/src/tools/Gallery/components/GalleryGrid.tsx +493 -0
- package/src/tools/Gallery/components/GalleryImage.tsx +66 -0
- package/src/tools/Gallery/components/GalleryLightbox.tsx +331 -0
- package/src/tools/Gallery/components/GalleryMedia.tsx +66 -0
- package/src/tools/Gallery/components/GalleryThumbnails.tsx +173 -0
- package/src/tools/Gallery/components/GalleryThumbnailsVirtual.tsx +138 -0
- package/src/tools/Gallery/components/GalleryVideo.tsx +222 -0
- package/src/tools/Gallery/components/index.ts +13 -0
- package/src/tools/Gallery/hooks/index.ts +23 -0
- package/src/tools/Gallery/hooks/useGallery.ts +137 -0
- package/src/tools/Gallery/hooks/useImageDimensions.ts +223 -0
- package/src/tools/Gallery/hooks/usePinchZoom.ts +234 -0
- package/src/tools/Gallery/hooks/usePreloadImages.ts +71 -0
- package/src/tools/Gallery/hooks/useSwipe.ts +86 -0
- package/src/tools/Gallery/hooks/useVirtualList.ts +129 -0
- package/src/tools/Gallery/hooks/useZoom.ts +316 -0
- package/src/tools/Gallery/index.ts +66 -0
- package/src/tools/Gallery/types.ts +183 -0
- package/src/tools/Gallery/utils/imageAnalysis.ts +52 -0
- package/src/tools/Gallery/utils/index.ts +11 -0
- package/src/tools/ImageViewer/components/ImageToolbar.tsx +20 -8
- package/src/tools/ImageViewer/components/ImageViewer.tsx +12 -4
- package/src/tools/ImageViewer/lazy.tsx +37 -0
- package/src/tools/JsonForm/lazy.tsx +43 -0
- package/src/tools/JsonForm/widgets/ColorWidget.tsx +4 -1
- package/src/tools/JsonTree/lazy.tsx +45 -0
- package/src/tools/LottiePlayer/lazy.tsx +57 -0
- package/src/tools/Map/components/CustomOverlay.tsx +54 -0
- package/src/tools/Map/components/DrawControl.tsx +36 -0
- package/src/tools/Map/components/GeocoderControl.tsx +70 -0
- package/src/tools/Map/components/LayerSwitcher.tsx +225 -0
- package/src/tools/Map/components/MapCluster.tsx +273 -0
- package/src/tools/Map/components/MapContainer.tsx +191 -0
- package/src/tools/Map/components/MapControls.tsx +44 -0
- package/src/tools/Map/components/MapLegend.tsx +161 -0
- package/src/tools/Map/components/MapMarker.tsx +102 -0
- package/src/tools/Map/components/MapPopup.tsx +46 -0
- package/src/tools/Map/components/MapSource.tsx +30 -0
- package/src/tools/Map/components/index.ts +20 -0
- package/src/tools/Map/context/MapContext.tsx +89 -0
- package/src/tools/Map/context/index.ts +2 -0
- package/src/tools/Map/hooks/index.ts +9 -0
- package/src/tools/Map/hooks/useMap.ts +11 -0
- package/src/tools/Map/hooks/useMapControl.ts +99 -0
- package/src/tools/Map/hooks/useMapEvents.ts +147 -0
- package/src/tools/Map/hooks/useMapLayers.ts +83 -0
- package/src/tools/Map/hooks/useMapViewport.ts +62 -0
- package/src/tools/Map/hooks/useMarkers.ts +85 -0
- package/src/tools/Map/index.ts +116 -0
- package/src/tools/Map/layers/cluster.ts +94 -0
- package/src/tools/Map/layers/index.ts +15 -0
- package/src/tools/Map/layers/line.ts +93 -0
- package/src/tools/Map/layers/point.ts +61 -0
- package/src/tools/Map/layers/polygon.ts +73 -0
- package/src/tools/Map/lazy.tsx +56 -0
- package/src/tools/Map/styles/index.ts +15 -0
- package/src/tools/Map/types.ts +259 -0
- package/src/tools/Map/utils/geo.ts +88 -0
- package/src/tools/Map/utils/index.ts +16 -0
- package/src/tools/Map/utils/transform.ts +107 -0
- package/src/tools/Mermaid/Mermaid.client.tsx +12 -4
- package/src/tools/Mermaid/components/MermaidFullscreenModal.tsx +6 -2
- package/src/tools/Mermaid/lazy.tsx +46 -0
- package/src/tools/OpenapiViewer/lazy.tsx +72 -0
- package/src/tools/PrettyCode/PrettyCode.client.tsx +10 -3
- package/src/tools/PrettyCode/lazy.tsx +64 -0
- package/src/tools/VideoPlayer/lazy.tsx +63 -0
- package/dist/Mermaid.client-4OCKJ6QD.mjs.map +0 -1
- package/dist/Mermaid.client-ZP6OE46Z.cjs.map +0 -1
- package/dist/PlaygroundLayout-LMQTVXSP.mjs.map +0 -1
- package/dist/PlaygroundLayout-XXVBU4WZ.cjs.map +0 -1
- package/dist/PrettyCode.client-2CLSV2VD.cjs.map +0 -1
- package/dist/PrettyCode.client-Y2BVON7R.mjs.map +0 -1
- package/dist/chunk-FB5QBSI3.cjs.map +0 -1
- package/dist/chunk-L6UHASYQ.mjs.map +0 -1
|
@@ -0,0 +1,1086 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkWGEGR3DF_cjs = require('./chunk-WGEGR3DF.cjs');
|
|
4
|
+
var consola = require('consola');
|
|
5
|
+
var lucideReact = require('lucide-react');
|
|
6
|
+
var react = require('react');
|
|
7
|
+
var components = require('@djangocfg/ui-core/components');
|
|
8
|
+
var Form = require('@rjsf/core');
|
|
9
|
+
var validator = require('@rjsf/validator-ajv8');
|
|
10
|
+
var lib = require('@djangocfg/ui-core/lib');
|
|
11
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
12
|
+
var utils = require('@rjsf/utils');
|
|
13
|
+
var i18n = require('@djangocfg/i18n');
|
|
14
|
+
|
|
15
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
+
|
|
17
|
+
var consola__default = /*#__PURE__*/_interopDefault(consola);
|
|
18
|
+
var Form__default = /*#__PURE__*/_interopDefault(Form);
|
|
19
|
+
var validator__default = /*#__PURE__*/_interopDefault(validator);
|
|
20
|
+
|
|
21
|
+
function FieldTemplate(props) {
|
|
22
|
+
const {
|
|
23
|
+
id,
|
|
24
|
+
classNames,
|
|
25
|
+
style,
|
|
26
|
+
label,
|
|
27
|
+
help,
|
|
28
|
+
required,
|
|
29
|
+
description,
|
|
30
|
+
errors,
|
|
31
|
+
children,
|
|
32
|
+
displayLabel,
|
|
33
|
+
hidden,
|
|
34
|
+
rawErrors
|
|
35
|
+
} = props;
|
|
36
|
+
if (hidden) {
|
|
37
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden", children });
|
|
38
|
+
}
|
|
39
|
+
const hasError = rawErrors && rawErrors.length > 0;
|
|
40
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
41
|
+
"div",
|
|
42
|
+
{
|
|
43
|
+
className: lib.cn("space-y-2", classNames),
|
|
44
|
+
style,
|
|
45
|
+
children: [
|
|
46
|
+
displayLabel && label && /* @__PURE__ */ jsxRuntime.jsxs(components.Label, { htmlFor: id, className: lib.cn(hasError && "text-destructive"), children: [
|
|
47
|
+
label,
|
|
48
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
|
|
49
|
+
] }),
|
|
50
|
+
description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: description }),
|
|
51
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { children }),
|
|
52
|
+
errors && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-destructive", children: errors }),
|
|
53
|
+
help && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: help })
|
|
54
|
+
]
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
chunkWGEGR3DF_cjs.__name(FieldTemplate, "FieldTemplate");
|
|
59
|
+
function ObjectFieldTemplate(props) {
|
|
60
|
+
const {
|
|
61
|
+
title,
|
|
62
|
+
description,
|
|
63
|
+
properties,
|
|
64
|
+
required,
|
|
65
|
+
uiSchema
|
|
66
|
+
} = props;
|
|
67
|
+
const isCollapsible = uiSchema?.["ui:collapsible"] === true;
|
|
68
|
+
const defaultCollapsed = uiSchema?.["ui:collapsed"] === true;
|
|
69
|
+
const gridCols = uiSchema?.["ui:grid"];
|
|
70
|
+
const className = uiSchema?.["ui:className"];
|
|
71
|
+
const [isOpen, setIsOpen] = react.useState(!defaultCollapsed);
|
|
72
|
+
const isRoot = !title;
|
|
73
|
+
const gridClass = gridCols ? `grid gap-4 grid-cols-${gridCols}` : "space-y-4";
|
|
74
|
+
const content = /* @__PURE__ */ jsxRuntime.jsx("div", { className: lib.cn(gridClass, className), children: properties.map((element) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "property-wrapper", children: element.content }, element.name)) });
|
|
75
|
+
if (isRoot) {
|
|
76
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-6", children: content });
|
|
77
|
+
}
|
|
78
|
+
if (isCollapsible) {
|
|
79
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(components.Collapsible, { open: isOpen, onOpenChange: setIsOpen, className: "space-y-2", children: [
|
|
80
|
+
/* @__PURE__ */ jsxRuntime.jsxs(components.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: [
|
|
81
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
82
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-sm font-semibold", children: [
|
|
83
|
+
title,
|
|
84
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
|
|
85
|
+
] }),
|
|
86
|
+
description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: description })
|
|
87
|
+
] }),
|
|
88
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
89
|
+
lucideReact.ChevronDown,
|
|
90
|
+
{
|
|
91
|
+
className: lib.cn(
|
|
92
|
+
"h-4 w-4 text-muted-foreground transition-transform duration-200",
|
|
93
|
+
isOpen && "rotate-180"
|
|
94
|
+
)
|
|
95
|
+
}
|
|
96
|
+
)
|
|
97
|
+
] }),
|
|
98
|
+
/* @__PURE__ */ jsxRuntime.jsx(components.CollapsibleContent, { className: "pl-1 pr-1 pt-2", children: content })
|
|
99
|
+
] });
|
|
100
|
+
}
|
|
101
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
|
|
102
|
+
title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b pb-2", children: [
|
|
103
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-sm font-semibold", children: [
|
|
104
|
+
title,
|
|
105
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
|
|
106
|
+
] }),
|
|
107
|
+
description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-1", children: description })
|
|
108
|
+
] }),
|
|
109
|
+
content
|
|
110
|
+
] });
|
|
111
|
+
}
|
|
112
|
+
chunkWGEGR3DF_cjs.__name(ObjectFieldTemplate, "ObjectFieldTemplate");
|
|
113
|
+
function ArrayFieldTemplate(props) {
|
|
114
|
+
const {
|
|
115
|
+
title,
|
|
116
|
+
items,
|
|
117
|
+
canAdd,
|
|
118
|
+
onAddClick,
|
|
119
|
+
required
|
|
120
|
+
} = props;
|
|
121
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
|
|
122
|
+
title && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
123
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-lg font-semibold", children: [
|
|
124
|
+
title,
|
|
125
|
+
required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
|
|
126
|
+
] }),
|
|
127
|
+
canAdd && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
128
|
+
components.Button,
|
|
129
|
+
{
|
|
130
|
+
type: "button",
|
|
131
|
+
variant: "outline",
|
|
132
|
+
size: "sm",
|
|
133
|
+
onClick: onAddClick,
|
|
134
|
+
className: "gap-2",
|
|
135
|
+
children: [
|
|
136
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" }),
|
|
137
|
+
"Add Item"
|
|
138
|
+
]
|
|
139
|
+
}
|
|
140
|
+
)
|
|
141
|
+
] }),
|
|
142
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: items }),
|
|
143
|
+
items.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center py-8 text-muted-foreground border-2 border-dashed rounded-md", children: [
|
|
144
|
+
"No items added yet.",
|
|
145
|
+
canAdd && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
146
|
+
components.Button,
|
|
147
|
+
{
|
|
148
|
+
type: "button",
|
|
149
|
+
variant: "ghost",
|
|
150
|
+
size: "sm",
|
|
151
|
+
onClick: onAddClick,
|
|
152
|
+
className: "mt-2 gap-2",
|
|
153
|
+
children: [
|
|
154
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" }),
|
|
155
|
+
"Add First Item"
|
|
156
|
+
]
|
|
157
|
+
}
|
|
158
|
+
)
|
|
159
|
+
] })
|
|
160
|
+
] });
|
|
161
|
+
}
|
|
162
|
+
chunkWGEGR3DF_cjs.__name(ArrayFieldTemplate, "ArrayFieldTemplate");
|
|
163
|
+
function ArrayFieldItemTemplate(props) {
|
|
164
|
+
const {
|
|
165
|
+
children,
|
|
166
|
+
className,
|
|
167
|
+
buttonsProps,
|
|
168
|
+
hasToolbar,
|
|
169
|
+
registry,
|
|
170
|
+
uiSchema
|
|
171
|
+
} = props;
|
|
172
|
+
const uiOptions = utils.getUiOptions(uiSchema);
|
|
173
|
+
const ArrayFieldItemButtonsTemplate = utils.getTemplate(
|
|
174
|
+
"ArrayFieldItemButtonsTemplate",
|
|
175
|
+
registry,
|
|
176
|
+
uiOptions
|
|
177
|
+
);
|
|
178
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
179
|
+
"div",
|
|
180
|
+
{
|
|
181
|
+
className: lib.cn(
|
|
182
|
+
"flex gap-2 items-start p-4 rounded-md border bg-card",
|
|
183
|
+
className
|
|
184
|
+
),
|
|
185
|
+
children: [
|
|
186
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children }),
|
|
187
|
+
hasToolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsxRuntime.jsx(ArrayFieldItemButtonsTemplate, { ...buttonsProps }) })
|
|
188
|
+
]
|
|
189
|
+
}
|
|
190
|
+
);
|
|
191
|
+
}
|
|
192
|
+
chunkWGEGR3DF_cjs.__name(ArrayFieldItemTemplate, "ArrayFieldItemTemplate");
|
|
193
|
+
function ErrorListTemplate(props) {
|
|
194
|
+
const { errors } = props;
|
|
195
|
+
if (!errors || errors.length === 0) {
|
|
196
|
+
return null;
|
|
197
|
+
}
|
|
198
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(components.Alert, { variant: "destructive", className: "mb-6", children: [
|
|
199
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-4 w-4" }),
|
|
200
|
+
/* @__PURE__ */ jsxRuntime.jsx(components.AlertTitle, { children: "Validation Errors" }),
|
|
201
|
+
/* @__PURE__ */ jsxRuntime.jsx(components.AlertDescription, { children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "list-disc list-inside space-y-1 mt-2", children: errors.map((error, index) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "text-sm", children: error.stack }, index)) }) })
|
|
202
|
+
] });
|
|
203
|
+
}
|
|
204
|
+
chunkWGEGR3DF_cjs.__name(ErrorListTemplate, "ErrorListTemplate");
|
|
205
|
+
function BaseInputTemplate(props) {
|
|
206
|
+
const {
|
|
207
|
+
id,
|
|
208
|
+
type,
|
|
209
|
+
value,
|
|
210
|
+
readonly,
|
|
211
|
+
disabled,
|
|
212
|
+
autofocus,
|
|
213
|
+
onBlur,
|
|
214
|
+
onFocus,
|
|
215
|
+
onChange,
|
|
216
|
+
options,
|
|
217
|
+
schema,
|
|
218
|
+
rawErrors,
|
|
219
|
+
placeholder
|
|
220
|
+
} = props;
|
|
221
|
+
const inputProps = react.useMemo(() => {
|
|
222
|
+
return utils.getInputProps(schema, type, options);
|
|
223
|
+
}, [schema, type, options]);
|
|
224
|
+
const safeValue = react.useMemo(() => {
|
|
225
|
+
if (value === null || value === void 0) return "";
|
|
226
|
+
return String(value);
|
|
227
|
+
}, [value]);
|
|
228
|
+
const hasError = react.useMemo(() => {
|
|
229
|
+
return rawErrors && rawErrors.length > 0;
|
|
230
|
+
}, [rawErrors]);
|
|
231
|
+
const handleChange = react.useCallback((event) => {
|
|
232
|
+
const val = event.target.value;
|
|
233
|
+
if (val === "") {
|
|
234
|
+
onChange(options?.emptyValue ?? "");
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
if (inputProps.type === "number" || schema.type === "number" || schema.type === "integer") {
|
|
238
|
+
const num = Number(val);
|
|
239
|
+
onChange(isNaN(num) ? val : num);
|
|
240
|
+
return;
|
|
241
|
+
}
|
|
242
|
+
onChange(val);
|
|
243
|
+
}, [onChange, inputProps.type, schema.type, options?.emptyValue]);
|
|
244
|
+
const handleBlur = react.useCallback((event) => {
|
|
245
|
+
onBlur(id, event.target.value);
|
|
246
|
+
}, [id, onBlur]);
|
|
247
|
+
const handleFocus = react.useCallback((event) => {
|
|
248
|
+
onFocus(id, event.target.value);
|
|
249
|
+
}, [id, onFocus]);
|
|
250
|
+
const inputType = react.useMemo(() => {
|
|
251
|
+
if (inputProps.type) return inputProps.type;
|
|
252
|
+
if (schema.type === "number" || schema.type === "integer") return "number";
|
|
253
|
+
return "text";
|
|
254
|
+
}, [inputProps.type, schema.type]);
|
|
255
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
256
|
+
components.Input,
|
|
257
|
+
{
|
|
258
|
+
id,
|
|
259
|
+
type: inputType,
|
|
260
|
+
value: safeValue,
|
|
261
|
+
disabled,
|
|
262
|
+
readOnly: readonly,
|
|
263
|
+
autoFocus: autofocus,
|
|
264
|
+
onChange: handleChange,
|
|
265
|
+
onBlur: handleBlur,
|
|
266
|
+
onFocus: handleFocus,
|
|
267
|
+
placeholder,
|
|
268
|
+
className: hasError ? "border-destructive" : "",
|
|
269
|
+
step: inputProps.step,
|
|
270
|
+
min: inputProps.min,
|
|
271
|
+
max: inputProps.max
|
|
272
|
+
}
|
|
273
|
+
);
|
|
274
|
+
}
|
|
275
|
+
chunkWGEGR3DF_cjs.__name(BaseInputTemplate, "BaseInputTemplate");
|
|
276
|
+
function validateSchema(schema) {
|
|
277
|
+
if (!schema || typeof schema !== "object") {
|
|
278
|
+
{
|
|
279
|
+
consola__default.default.error("[JsonSchemaForm] Invalid schema: must be an object", schema);
|
|
280
|
+
}
|
|
281
|
+
return null;
|
|
282
|
+
}
|
|
283
|
+
const hasValidStructure = schema.type || schema.properties || schema.$ref || schema.$schema;
|
|
284
|
+
if (!hasValidStructure) {
|
|
285
|
+
{
|
|
286
|
+
consola__default.default.error("[JsonSchemaForm] Invalid schema: missing type, properties, $ref, or $schema", schema);
|
|
287
|
+
}
|
|
288
|
+
return null;
|
|
289
|
+
}
|
|
290
|
+
{
|
|
291
|
+
consola__default.default.success("[JsonSchemaForm] Schema validated successfully:", {
|
|
292
|
+
type: schema.type,
|
|
293
|
+
title: schema.title,
|
|
294
|
+
hasProperties: !!schema.properties,
|
|
295
|
+
hasRequired: !!schema.required
|
|
296
|
+
});
|
|
297
|
+
}
|
|
298
|
+
return schema;
|
|
299
|
+
}
|
|
300
|
+
chunkWGEGR3DF_cjs.__name(validateSchema, "validateSchema");
|
|
301
|
+
function normalizeFormData(formData, schema) {
|
|
302
|
+
if (formData === null || formData === void 0) {
|
|
303
|
+
return schema.type === "object" ? {} : schema.type === "array" ? [] : null;
|
|
304
|
+
}
|
|
305
|
+
const normalized = JSON.parse(JSON.stringify(formData));
|
|
306
|
+
return removeUndefined(normalized);
|
|
307
|
+
}
|
|
308
|
+
chunkWGEGR3DF_cjs.__name(normalizeFormData, "normalizeFormData");
|
|
309
|
+
function removeUndefined(obj) {
|
|
310
|
+
if (obj === null || obj === void 0) {
|
|
311
|
+
return obj;
|
|
312
|
+
}
|
|
313
|
+
if (Array.isArray(obj)) {
|
|
314
|
+
return obj.map(removeUndefined).filter((item) => item !== void 0);
|
|
315
|
+
}
|
|
316
|
+
if (typeof obj === "object") {
|
|
317
|
+
const cleaned = {};
|
|
318
|
+
for (const key in obj) {
|
|
319
|
+
if (obj[key] !== void 0) {
|
|
320
|
+
cleaned[key] = removeUndefined(obj[key]);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
return cleaned;
|
|
324
|
+
}
|
|
325
|
+
return obj;
|
|
326
|
+
}
|
|
327
|
+
chunkWGEGR3DF_cjs.__name(removeUndefined, "removeUndefined");
|
|
328
|
+
function mergeDefaults(formData, schema) {
|
|
329
|
+
if (!schema) return formData;
|
|
330
|
+
const result = { ...formData };
|
|
331
|
+
if (schema.type === "object" && schema.properties) {
|
|
332
|
+
for (const [key, propSchema] of Object.entries(schema.properties)) {
|
|
333
|
+
const prop = propSchema;
|
|
334
|
+
if (result[key] === void 0 && prop.default !== void 0) {
|
|
335
|
+
result[key] = prop.default;
|
|
336
|
+
}
|
|
337
|
+
if (prop.type === "object" && result[key]) {
|
|
338
|
+
result[key] = mergeDefaults(result[key], prop);
|
|
339
|
+
}
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
return result;
|
|
343
|
+
}
|
|
344
|
+
chunkWGEGR3DF_cjs.__name(mergeDefaults, "mergeDefaults");
|
|
345
|
+
function safeJsonParse(jsonString, fallback) {
|
|
346
|
+
try {
|
|
347
|
+
return JSON.parse(jsonString);
|
|
348
|
+
} catch (error) {
|
|
349
|
+
consola__default.default.error("[JsonSchemaForm] JSON parse error:", error);
|
|
350
|
+
return fallback;
|
|
351
|
+
}
|
|
352
|
+
}
|
|
353
|
+
chunkWGEGR3DF_cjs.__name(safeJsonParse, "safeJsonParse");
|
|
354
|
+
function safeJsonStringify(obj, pretty = true) {
|
|
355
|
+
try {
|
|
356
|
+
return JSON.stringify(obj, null, pretty ? 2 : 0);
|
|
357
|
+
} catch (error) {
|
|
358
|
+
consola__default.default.error("[JsonSchemaForm] JSON stringify error:", error);
|
|
359
|
+
return "{}";
|
|
360
|
+
}
|
|
361
|
+
}
|
|
362
|
+
chunkWGEGR3DF_cjs.__name(safeJsonStringify, "safeJsonStringify");
|
|
363
|
+
function hasRequiredFields(schema) {
|
|
364
|
+
return Array.isArray(schema.required) && schema.required.length > 0;
|
|
365
|
+
}
|
|
366
|
+
chunkWGEGR3DF_cjs.__name(hasRequiredFields, "hasRequiredFields");
|
|
367
|
+
function getRequiredFields(schema, prefix = "") {
|
|
368
|
+
const required = [];
|
|
369
|
+
if (schema.required && Array.isArray(schema.required)) {
|
|
370
|
+
required.push(...schema.required.map(
|
|
371
|
+
(field) => prefix ? `${prefix}.${field}` : field
|
|
372
|
+
));
|
|
373
|
+
}
|
|
374
|
+
if (schema.type === "object" && schema.properties) {
|
|
375
|
+
for (const [key, propSchema] of Object.entries(schema.properties)) {
|
|
376
|
+
const prop = propSchema;
|
|
377
|
+
const fieldPath = prefix ? `${prefix}.${key}` : key;
|
|
378
|
+
required.push(...getRequiredFields(prop, fieldPath));
|
|
379
|
+
}
|
|
380
|
+
}
|
|
381
|
+
return required;
|
|
382
|
+
}
|
|
383
|
+
chunkWGEGR3DF_cjs.__name(getRequiredFields, "getRequiredFields");
|
|
384
|
+
function validateRequiredFields(formData, schema) {
|
|
385
|
+
const requiredFields = getRequiredFields(schema);
|
|
386
|
+
const missing = [];
|
|
387
|
+
for (const field of requiredFields) {
|
|
388
|
+
const value = getNestedValue(formData, field);
|
|
389
|
+
if (value === void 0 || value === null || value === "") {
|
|
390
|
+
missing.push(field);
|
|
391
|
+
}
|
|
392
|
+
}
|
|
393
|
+
return {
|
|
394
|
+
valid: missing.length === 0,
|
|
395
|
+
missing
|
|
396
|
+
};
|
|
397
|
+
}
|
|
398
|
+
chunkWGEGR3DF_cjs.__name(validateRequiredFields, "validateRequiredFields");
|
|
399
|
+
function getNestedValue(obj, path) {
|
|
400
|
+
return path.split(".").reduce((current, key) => current?.[key], obj);
|
|
401
|
+
}
|
|
402
|
+
chunkWGEGR3DF_cjs.__name(getNestedValue, "getNestedValue");
|
|
403
|
+
function TextWidget(props) {
|
|
404
|
+
const {
|
|
405
|
+
id,
|
|
406
|
+
placeholder,
|
|
407
|
+
required,
|
|
408
|
+
disabled,
|
|
409
|
+
readonly,
|
|
410
|
+
autofocus,
|
|
411
|
+
value,
|
|
412
|
+
onChange,
|
|
413
|
+
onBlur,
|
|
414
|
+
onFocus,
|
|
415
|
+
options,
|
|
416
|
+
schema,
|
|
417
|
+
rawErrors
|
|
418
|
+
} = props;
|
|
419
|
+
const config = react.useMemo(() => ({
|
|
420
|
+
isTextarea: options?.widget === "textarea",
|
|
421
|
+
rows: options?.rows || 3,
|
|
422
|
+
emptyValue: options?.emptyValue
|
|
423
|
+
}), [options]);
|
|
424
|
+
const safeValue = react.useMemo(() => {
|
|
425
|
+
if (value === null || value === void 0) return "";
|
|
426
|
+
return String(value);
|
|
427
|
+
}, [value]);
|
|
428
|
+
const hasError = react.useMemo(() => {
|
|
429
|
+
return rawErrors && rawErrors.length > 0;
|
|
430
|
+
}, [rawErrors]);
|
|
431
|
+
const handleChange = react.useCallback((event) => {
|
|
432
|
+
const newValue = event.target.value;
|
|
433
|
+
onChange(newValue === "" ? config.emptyValue : newValue);
|
|
434
|
+
}, [onChange, config.emptyValue]);
|
|
435
|
+
const handleBlur = react.useCallback((event) => {
|
|
436
|
+
onBlur(id, event.target.value);
|
|
437
|
+
}, [id, onBlur]);
|
|
438
|
+
const handleFocus = react.useCallback((event) => {
|
|
439
|
+
onFocus(id, event.target.value);
|
|
440
|
+
}, [id, onFocus]);
|
|
441
|
+
if (config.isTextarea) {
|
|
442
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
443
|
+
"textarea",
|
|
444
|
+
{
|
|
445
|
+
id,
|
|
446
|
+
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`,
|
|
447
|
+
placeholder,
|
|
448
|
+
disabled: disabled || readonly,
|
|
449
|
+
readOnly: readonly,
|
|
450
|
+
autoFocus: autofocus,
|
|
451
|
+
value: safeValue,
|
|
452
|
+
required,
|
|
453
|
+
onChange: handleChange,
|
|
454
|
+
onBlur: handleBlur,
|
|
455
|
+
onFocus: handleFocus,
|
|
456
|
+
rows: config.rows
|
|
457
|
+
}
|
|
458
|
+
);
|
|
459
|
+
}
|
|
460
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
461
|
+
components.Input,
|
|
462
|
+
{
|
|
463
|
+
id,
|
|
464
|
+
type: "text",
|
|
465
|
+
placeholder,
|
|
466
|
+
disabled,
|
|
467
|
+
readOnly: readonly,
|
|
468
|
+
autoFocus: autofocus,
|
|
469
|
+
value: safeValue,
|
|
470
|
+
required,
|
|
471
|
+
onChange: handleChange,
|
|
472
|
+
onBlur: handleBlur,
|
|
473
|
+
onFocus: handleFocus,
|
|
474
|
+
className: hasError ? "border-destructive" : ""
|
|
475
|
+
}
|
|
476
|
+
);
|
|
477
|
+
}
|
|
478
|
+
chunkWGEGR3DF_cjs.__name(TextWidget, "TextWidget");
|
|
479
|
+
function NumberWidget(props) {
|
|
480
|
+
const {
|
|
481
|
+
id,
|
|
482
|
+
placeholder,
|
|
483
|
+
required,
|
|
484
|
+
disabled,
|
|
485
|
+
readonly,
|
|
486
|
+
autofocus,
|
|
487
|
+
value,
|
|
488
|
+
onChange,
|
|
489
|
+
onBlur,
|
|
490
|
+
onFocus,
|
|
491
|
+
options,
|
|
492
|
+
schema,
|
|
493
|
+
rawErrors
|
|
494
|
+
} = props;
|
|
495
|
+
const config = react.useMemo(() => ({
|
|
496
|
+
isInteger: schema.type === "integer",
|
|
497
|
+
step: schema.type === "integer" ? "1" : "any",
|
|
498
|
+
min: schema.minimum,
|
|
499
|
+
max: schema.maximum,
|
|
500
|
+
emptyValue: options?.emptyValue
|
|
501
|
+
}), [schema, options]);
|
|
502
|
+
const safeValue = react.useMemo(() => {
|
|
503
|
+
if (value === null || value === void 0 || value === "") return "";
|
|
504
|
+
if (typeof value === "number" && !isNaN(value)) return value;
|
|
505
|
+
return "";
|
|
506
|
+
}, [value]);
|
|
507
|
+
const hasError = react.useMemo(() => {
|
|
508
|
+
return rawErrors && rawErrors.length > 0;
|
|
509
|
+
}, [rawErrors]);
|
|
510
|
+
const handleChange = react.useCallback((event) => {
|
|
511
|
+
const newValue = event.target.value;
|
|
512
|
+
if (newValue === "") {
|
|
513
|
+
onChange(config.emptyValue);
|
|
514
|
+
} else {
|
|
515
|
+
const parsedValue = config.isInteger ? parseInt(newValue, 10) : parseFloat(newValue);
|
|
516
|
+
onChange(isNaN(parsedValue) ? config.emptyValue : parsedValue);
|
|
517
|
+
}
|
|
518
|
+
}, [onChange, config]);
|
|
519
|
+
const handleBlur = react.useCallback((event) => {
|
|
520
|
+
onBlur(id, event.target.value);
|
|
521
|
+
}, [id, onBlur]);
|
|
522
|
+
const handleFocus = react.useCallback((event) => {
|
|
523
|
+
onFocus(id, event.target.value);
|
|
524
|
+
}, [id, onFocus]);
|
|
525
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
526
|
+
components.Input,
|
|
527
|
+
{
|
|
528
|
+
id,
|
|
529
|
+
type: "number",
|
|
530
|
+
placeholder,
|
|
531
|
+
disabled,
|
|
532
|
+
readOnly: readonly,
|
|
533
|
+
autoFocus: autofocus,
|
|
534
|
+
value: safeValue,
|
|
535
|
+
required,
|
|
536
|
+
onChange: handleChange,
|
|
537
|
+
onBlur: handleBlur,
|
|
538
|
+
onFocus: handleFocus,
|
|
539
|
+
step: config.step,
|
|
540
|
+
min: config.min,
|
|
541
|
+
max: config.max,
|
|
542
|
+
className: hasError ? "border-destructive" : ""
|
|
543
|
+
}
|
|
544
|
+
);
|
|
545
|
+
}
|
|
546
|
+
chunkWGEGR3DF_cjs.__name(NumberWidget, "NumberWidget");
|
|
547
|
+
function CheckboxWidget(props) {
|
|
548
|
+
const {
|
|
549
|
+
id,
|
|
550
|
+
value,
|
|
551
|
+
disabled,
|
|
552
|
+
readonly,
|
|
553
|
+
autofocus,
|
|
554
|
+
onChange,
|
|
555
|
+
onBlur,
|
|
556
|
+
onFocus
|
|
557
|
+
} = props;
|
|
558
|
+
const handleChange = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((checked) => {
|
|
559
|
+
onChange(checked);
|
|
560
|
+
}, "handleChange");
|
|
561
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
562
|
+
components.Checkbox,
|
|
563
|
+
{
|
|
564
|
+
id,
|
|
565
|
+
checked: value || false,
|
|
566
|
+
disabled: disabled || readonly,
|
|
567
|
+
autoFocus: autofocus,
|
|
568
|
+
onCheckedChange: handleChange,
|
|
569
|
+
onBlur: () => onBlur(id, value),
|
|
570
|
+
onFocus: () => onFocus(id, value)
|
|
571
|
+
}
|
|
572
|
+
);
|
|
573
|
+
}
|
|
574
|
+
chunkWGEGR3DF_cjs.__name(CheckboxWidget, "CheckboxWidget");
|
|
575
|
+
function SelectWidget(props) {
|
|
576
|
+
const {
|
|
577
|
+
id,
|
|
578
|
+
options,
|
|
579
|
+
value,
|
|
580
|
+
required,
|
|
581
|
+
disabled,
|
|
582
|
+
readonly,
|
|
583
|
+
autofocus,
|
|
584
|
+
onChange,
|
|
585
|
+
onBlur,
|
|
586
|
+
onFocus,
|
|
587
|
+
placeholder,
|
|
588
|
+
rawErrors
|
|
589
|
+
} = props;
|
|
590
|
+
const enumOptions = react.useMemo(() => {
|
|
591
|
+
const opts = options?.enumOptions;
|
|
592
|
+
if (!Array.isArray(opts)) return [];
|
|
593
|
+
return opts.filter((opt) => opt && opt.value !== void 0);
|
|
594
|
+
}, [options]);
|
|
595
|
+
const hasError = react.useMemo(() => {
|
|
596
|
+
return rawErrors && rawErrors.length > 0;
|
|
597
|
+
}, [rawErrors]);
|
|
598
|
+
const safeValue = react.useMemo(() => {
|
|
599
|
+
if (value === null || value === void 0) return "";
|
|
600
|
+
return String(value);
|
|
601
|
+
}, [value]);
|
|
602
|
+
const handleChange = react.useCallback((newValue) => {
|
|
603
|
+
onChange(newValue);
|
|
604
|
+
onBlur(id, newValue);
|
|
605
|
+
}, [onChange, onBlur, id]);
|
|
606
|
+
if (enumOptions.length === 0) {
|
|
607
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
608
|
+
"input",
|
|
609
|
+
{
|
|
610
|
+
id,
|
|
611
|
+
type: "text",
|
|
612
|
+
value: safeValue,
|
|
613
|
+
onChange: (e) => onChange(e.target.value),
|
|
614
|
+
onBlur: (e) => onBlur(id, e.target.value),
|
|
615
|
+
onFocus: (e) => onFocus(id, e.target.value),
|
|
616
|
+
disabled: disabled || readonly,
|
|
617
|
+
readOnly: readonly,
|
|
618
|
+
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`,
|
|
619
|
+
placeholder
|
|
620
|
+
}
|
|
621
|
+
);
|
|
622
|
+
}
|
|
623
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
624
|
+
components.Select,
|
|
625
|
+
{
|
|
626
|
+
value: safeValue,
|
|
627
|
+
onValueChange: handleChange,
|
|
628
|
+
disabled: disabled || readonly,
|
|
629
|
+
required,
|
|
630
|
+
children: [
|
|
631
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
632
|
+
components.SelectTrigger,
|
|
633
|
+
{
|
|
634
|
+
id,
|
|
635
|
+
className: hasError ? "border-destructive" : "",
|
|
636
|
+
autoFocus: autofocus,
|
|
637
|
+
onFocus: () => onFocus(id, value),
|
|
638
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(components.SelectValue, { placeholder: placeholder || "Select an option" })
|
|
639
|
+
}
|
|
640
|
+
),
|
|
641
|
+
/* @__PURE__ */ jsxRuntime.jsx(components.SelectContent, { children: enumOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsx(components.SelectItem, { value: String(option.value), children: option.label || String(option.value) }, String(option.value))) })
|
|
642
|
+
]
|
|
643
|
+
}
|
|
644
|
+
);
|
|
645
|
+
}
|
|
646
|
+
chunkWGEGR3DF_cjs.__name(SelectWidget, "SelectWidget");
|
|
647
|
+
function SwitchWidget(props) {
|
|
648
|
+
const {
|
|
649
|
+
id,
|
|
650
|
+
value,
|
|
651
|
+
disabled,
|
|
652
|
+
readonly,
|
|
653
|
+
onChange,
|
|
654
|
+
onBlur,
|
|
655
|
+
onFocus
|
|
656
|
+
} = props;
|
|
657
|
+
const handleChange = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((checked) => {
|
|
658
|
+
onChange(checked);
|
|
659
|
+
}, "handleChange");
|
|
660
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
661
|
+
components.Switch,
|
|
662
|
+
{
|
|
663
|
+
id,
|
|
664
|
+
checked: value || false,
|
|
665
|
+
disabled: disabled || readonly,
|
|
666
|
+
onCheckedChange: handleChange,
|
|
667
|
+
onBlur: () => onBlur(id, value),
|
|
668
|
+
onFocus: () => onFocus(id, value)
|
|
669
|
+
}
|
|
670
|
+
);
|
|
671
|
+
}
|
|
672
|
+
chunkWGEGR3DF_cjs.__name(SwitchWidget, "SwitchWidget");
|
|
673
|
+
function ColorWidget(props) {
|
|
674
|
+
const {
|
|
675
|
+
id,
|
|
676
|
+
placeholder,
|
|
677
|
+
required,
|
|
678
|
+
disabled,
|
|
679
|
+
readonly,
|
|
680
|
+
autofocus,
|
|
681
|
+
value,
|
|
682
|
+
onChange,
|
|
683
|
+
onBlur,
|
|
684
|
+
onFocus,
|
|
685
|
+
options,
|
|
686
|
+
rawErrors
|
|
687
|
+
} = props;
|
|
688
|
+
const t = i18n.useTypedT();
|
|
689
|
+
const pickColorLabel = react.useMemo(() => t("tools.color.pick"), [t]);
|
|
690
|
+
const colorInputRef = react.useRef(null);
|
|
691
|
+
const format = react.useMemo(() => {
|
|
692
|
+
if (options?.format) return options.format;
|
|
693
|
+
if (typeof value === "string" && value.startsWith("#")) return "hex";
|
|
694
|
+
return "hsl";
|
|
695
|
+
}, [options?.format, value]);
|
|
696
|
+
const safeValue = react.useMemo(() => {
|
|
697
|
+
if (value === null || value === void 0) return "";
|
|
698
|
+
return String(value);
|
|
699
|
+
}, [value]);
|
|
700
|
+
const hslToCss = react.useCallback((hslValue) => {
|
|
701
|
+
if (!hslValue) return "transparent";
|
|
702
|
+
if (hslValue.startsWith("#")) return hslValue;
|
|
703
|
+
if (hslValue.startsWith("hsl")) return hslValue;
|
|
704
|
+
const parts = hslValue.split(" ");
|
|
705
|
+
if (parts.length === 3) {
|
|
706
|
+
return `hsl(${parts[0]}, ${parts[1]}, ${parts[2]})`;
|
|
707
|
+
}
|
|
708
|
+
return "transparent";
|
|
709
|
+
}, []);
|
|
710
|
+
const previewColor = react.useMemo(() => {
|
|
711
|
+
return hslToCss(safeValue);
|
|
712
|
+
}, [safeValue, hslToCss]);
|
|
713
|
+
const hexToHsl = react.useCallback((hex) => {
|
|
714
|
+
hex = hex.replace("#", "");
|
|
715
|
+
const r = parseInt(hex.substring(0, 2), 16) / 255;
|
|
716
|
+
const g = parseInt(hex.substring(2, 4), 16) / 255;
|
|
717
|
+
const b = parseInt(hex.substring(4, 6), 16) / 255;
|
|
718
|
+
const max = Math.max(r, g, b);
|
|
719
|
+
const min = Math.min(r, g, b);
|
|
720
|
+
let h = 0;
|
|
721
|
+
let s = 0;
|
|
722
|
+
const l = (max + min) / 2;
|
|
723
|
+
if (max !== min) {
|
|
724
|
+
const d = max - min;
|
|
725
|
+
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
|
726
|
+
switch (max) {
|
|
727
|
+
case r:
|
|
728
|
+
h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
|
|
729
|
+
break;
|
|
730
|
+
case g:
|
|
731
|
+
h = ((b - r) / d + 2) / 6;
|
|
732
|
+
break;
|
|
733
|
+
case b:
|
|
734
|
+
h = ((r - g) / d + 4) / 6;
|
|
735
|
+
break;
|
|
736
|
+
}
|
|
737
|
+
}
|
|
738
|
+
return `${Math.round(h * 360)} ${Math.round(s * 100)}% ${Math.round(l * 100)}%`;
|
|
739
|
+
}, []);
|
|
740
|
+
const hslToHex = react.useCallback((hslValue) => {
|
|
741
|
+
if (!hslValue || hslValue.startsWith("#")) return hslValue || "#000000";
|
|
742
|
+
const parts = hslValue.split(" ");
|
|
743
|
+
if (parts.length !== 3) return "#000000";
|
|
744
|
+
const h = parseInt(parts[0]) / 360;
|
|
745
|
+
const s = parseInt(parts[1].replace("%", "")) / 100;
|
|
746
|
+
const l = parseInt(parts[2].replace("%", "")) / 100;
|
|
747
|
+
const hue2rgb = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((p, q, t2) => {
|
|
748
|
+
if (t2 < 0) t2 += 1;
|
|
749
|
+
if (t2 > 1) t2 -= 1;
|
|
750
|
+
if (t2 < 1 / 6) return p + (q - p) * 6 * t2;
|
|
751
|
+
if (t2 < 1 / 2) return q;
|
|
752
|
+
if (t2 < 2 / 3) return p + (q - p) * (2 / 3 - t2) * 6;
|
|
753
|
+
return p;
|
|
754
|
+
}, "hue2rgb");
|
|
755
|
+
let r, g, b;
|
|
756
|
+
if (s === 0) {
|
|
757
|
+
r = g = b = l;
|
|
758
|
+
} else {
|
|
759
|
+
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
760
|
+
const p = 2 * l - q;
|
|
761
|
+
r = hue2rgb(p, q, h + 1 / 3);
|
|
762
|
+
g = hue2rgb(p, q, h);
|
|
763
|
+
b = hue2rgb(p, q, h - 1 / 3);
|
|
764
|
+
}
|
|
765
|
+
const toHex = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((x) => {
|
|
766
|
+
const hex = Math.round(x * 255).toString(16);
|
|
767
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
768
|
+
}, "toHex");
|
|
769
|
+
return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
|
|
770
|
+
}, []);
|
|
771
|
+
const hasError = react.useMemo(() => {
|
|
772
|
+
return rawErrors && rawErrors.length > 0;
|
|
773
|
+
}, [rawErrors]);
|
|
774
|
+
const handleChange = react.useCallback((event) => {
|
|
775
|
+
const newValue = event.target.value;
|
|
776
|
+
onChange(newValue);
|
|
777
|
+
}, [onChange]);
|
|
778
|
+
const handleColorPickerChange = react.useCallback((event) => {
|
|
779
|
+
const hexValue2 = event.target.value;
|
|
780
|
+
if (format === "hsl") {
|
|
781
|
+
onChange(hexToHsl(hexValue2));
|
|
782
|
+
} else {
|
|
783
|
+
onChange(hexValue2);
|
|
784
|
+
}
|
|
785
|
+
}, [onChange, format, hexToHsl]);
|
|
786
|
+
const handleBlur = react.useCallback((event) => {
|
|
787
|
+
onBlur(id, event.target.value);
|
|
788
|
+
}, [id, onBlur]);
|
|
789
|
+
const handleFocus = react.useCallback((event) => {
|
|
790
|
+
onFocus(id, event.target.value);
|
|
791
|
+
}, [id, onFocus]);
|
|
792
|
+
const hexValue = react.useMemo(() => {
|
|
793
|
+
if (format === "hex" || safeValue.startsWith("#")) {
|
|
794
|
+
return safeValue || "#000000";
|
|
795
|
+
}
|
|
796
|
+
return hslToHex(safeValue);
|
|
797
|
+
}, [safeValue, format, hslToHex]);
|
|
798
|
+
const handleColorBoxClick = react.useCallback(() => {
|
|
799
|
+
if (!disabled && !readonly) {
|
|
800
|
+
colorInputRef.current?.click();
|
|
801
|
+
}
|
|
802
|
+
}, [disabled, readonly]);
|
|
803
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
804
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
|
|
805
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
806
|
+
"button",
|
|
807
|
+
{
|
|
808
|
+
type: "button",
|
|
809
|
+
onClick: handleColorBoxClick,
|
|
810
|
+
disabled: disabled || readonly,
|
|
811
|
+
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",
|
|
812
|
+
style: { backgroundColor: previewColor },
|
|
813
|
+
"aria-label": pickColorLabel
|
|
814
|
+
}
|
|
815
|
+
),
|
|
816
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
817
|
+
"input",
|
|
818
|
+
{
|
|
819
|
+
ref: colorInputRef,
|
|
820
|
+
type: "color",
|
|
821
|
+
value: hexValue,
|
|
822
|
+
onChange: handleColorPickerChange,
|
|
823
|
+
className: "absolute inset-0 opacity-0 w-full h-full cursor-pointer",
|
|
824
|
+
disabled: disabled || readonly,
|
|
825
|
+
tabIndex: -1
|
|
826
|
+
}
|
|
827
|
+
)
|
|
828
|
+
] }),
|
|
829
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
830
|
+
components.Input,
|
|
831
|
+
{
|
|
832
|
+
id,
|
|
833
|
+
type: "text",
|
|
834
|
+
placeholder: placeholder || (format === "hsl" ? "217 91% 60%" : "#3b82f6"),
|
|
835
|
+
disabled,
|
|
836
|
+
readOnly: readonly,
|
|
837
|
+
autoFocus: autofocus,
|
|
838
|
+
value: safeValue,
|
|
839
|
+
required,
|
|
840
|
+
onChange: handleChange,
|
|
841
|
+
onBlur: handleBlur,
|
|
842
|
+
onFocus: handleFocus,
|
|
843
|
+
className: `flex-1 font-mono text-sm ${hasError ? "border-destructive" : ""}`
|
|
844
|
+
}
|
|
845
|
+
)
|
|
846
|
+
] });
|
|
847
|
+
}
|
|
848
|
+
chunkWGEGR3DF_cjs.__name(ColorWidget, "ColorWidget");
|
|
849
|
+
function SliderWidget(props) {
|
|
850
|
+
const {
|
|
851
|
+
id,
|
|
852
|
+
disabled,
|
|
853
|
+
readonly,
|
|
854
|
+
value,
|
|
855
|
+
onChange,
|
|
856
|
+
schema,
|
|
857
|
+
options,
|
|
858
|
+
rawErrors
|
|
859
|
+
} = props;
|
|
860
|
+
const config = react.useMemo(() => {
|
|
861
|
+
const min = schema.minimum ?? options?.min ?? 0;
|
|
862
|
+
const max = schema.maximum ?? options?.max ?? 100;
|
|
863
|
+
const step = options?.step ?? (schema.type === "integer" ? 1 : 0.1);
|
|
864
|
+
const unit = options?.unit;
|
|
865
|
+
const showInput = options?.showInput !== false;
|
|
866
|
+
return { min, max, step, unit, showInput };
|
|
867
|
+
}, [schema, options]);
|
|
868
|
+
const numericValue = react.useMemo(() => {
|
|
869
|
+
if (value === null || value === void 0 || value === "") {
|
|
870
|
+
return config.min;
|
|
871
|
+
}
|
|
872
|
+
if (typeof value === "number") {
|
|
873
|
+
return value;
|
|
874
|
+
}
|
|
875
|
+
if (typeof value === "string") {
|
|
876
|
+
const parsed = parseFloat(value);
|
|
877
|
+
return isNaN(parsed) ? config.min : parsed;
|
|
878
|
+
}
|
|
879
|
+
return config.min;
|
|
880
|
+
}, [value, config.min]);
|
|
881
|
+
const hasError = react.useMemo(() => {
|
|
882
|
+
return rawErrors && rawErrors.length > 0;
|
|
883
|
+
}, [rawErrors]);
|
|
884
|
+
const handleSliderChange = react.useCallback((values) => {
|
|
885
|
+
const newValue = values[0];
|
|
886
|
+
if (config.unit) {
|
|
887
|
+
onChange(`${newValue}${config.unit}`);
|
|
888
|
+
} else {
|
|
889
|
+
onChange(newValue);
|
|
890
|
+
}
|
|
891
|
+
}, [onChange, config.unit]);
|
|
892
|
+
const handleInputChange = react.useCallback((event) => {
|
|
893
|
+
const inputValue = event.target.value;
|
|
894
|
+
if (config.unit) {
|
|
895
|
+
const cleanValue = inputValue.replace(config.unit, "").trim();
|
|
896
|
+
const parsed = parseFloat(cleanValue);
|
|
897
|
+
if (!isNaN(parsed)) {
|
|
898
|
+
onChange(`${parsed}${config.unit}`);
|
|
899
|
+
} else if (inputValue === "") {
|
|
900
|
+
onChange(`${config.min}${config.unit}`);
|
|
901
|
+
}
|
|
902
|
+
} else {
|
|
903
|
+
const parsed = parseFloat(inputValue);
|
|
904
|
+
onChange(isNaN(parsed) ? config.min : parsed);
|
|
905
|
+
}
|
|
906
|
+
}, [onChange, config.unit, config.min]);
|
|
907
|
+
const displayValue = react.useMemo(() => {
|
|
908
|
+
if (config.unit) {
|
|
909
|
+
return `${numericValue}${config.unit}`;
|
|
910
|
+
}
|
|
911
|
+
return String(numericValue);
|
|
912
|
+
}, [numericValue, config.unit]);
|
|
913
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: lib.cn("flex items-center gap-3", hasError && "text-destructive"), children: [
|
|
914
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
915
|
+
components.Slider,
|
|
916
|
+
{
|
|
917
|
+
id,
|
|
918
|
+
disabled: disabled || readonly,
|
|
919
|
+
value: [numericValue],
|
|
920
|
+
onValueChange: handleSliderChange,
|
|
921
|
+
min: config.min,
|
|
922
|
+
max: config.max,
|
|
923
|
+
step: config.step,
|
|
924
|
+
className: "flex-1"
|
|
925
|
+
}
|
|
926
|
+
),
|
|
927
|
+
config.showInput ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
928
|
+
components.Input,
|
|
929
|
+
{
|
|
930
|
+
type: "text",
|
|
931
|
+
value: displayValue,
|
|
932
|
+
onChange: handleInputChange,
|
|
933
|
+
disabled,
|
|
934
|
+
readOnly: readonly,
|
|
935
|
+
className: lib.cn(
|
|
936
|
+
"w-20 text-center font-mono text-sm",
|
|
937
|
+
hasError && "border-destructive"
|
|
938
|
+
)
|
|
939
|
+
}
|
|
940
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-16 text-right font-mono text-sm text-muted-foreground", children: displayValue })
|
|
941
|
+
] });
|
|
942
|
+
}
|
|
943
|
+
chunkWGEGR3DF_cjs.__name(SliderWidget, "SliderWidget");
|
|
944
|
+
function JsonSchemaForm(props) {
|
|
945
|
+
const {
|
|
946
|
+
schema,
|
|
947
|
+
uiSchema,
|
|
948
|
+
formData,
|
|
949
|
+
onSubmit,
|
|
950
|
+
onChange,
|
|
951
|
+
onError,
|
|
952
|
+
showErrorList = "top",
|
|
953
|
+
liveValidate = false,
|
|
954
|
+
disabled = false,
|
|
955
|
+
readonly = false,
|
|
956
|
+
className,
|
|
957
|
+
showSubmitButton = true,
|
|
958
|
+
submitButtonText = "Submit",
|
|
959
|
+
...restProps
|
|
960
|
+
} = props;
|
|
961
|
+
const validatedSchema = react.useMemo(() => {
|
|
962
|
+
{
|
|
963
|
+
consola__default.default.info("[JsonSchemaForm] Validating schema...", schema);
|
|
964
|
+
}
|
|
965
|
+
const result = validateSchema(schema);
|
|
966
|
+
if (!result && true) {
|
|
967
|
+
consola__default.default.error("[JsonSchemaForm] Schema validation failed");
|
|
968
|
+
}
|
|
969
|
+
return result;
|
|
970
|
+
}, [schema]);
|
|
971
|
+
const normalizedFormData = react.useMemo(() => {
|
|
972
|
+
if (!validatedSchema) {
|
|
973
|
+
{
|
|
974
|
+
consola__default.default.warn("[JsonSchemaForm] Cannot normalize formData - invalid schema");
|
|
975
|
+
}
|
|
976
|
+
return null;
|
|
977
|
+
}
|
|
978
|
+
{
|
|
979
|
+
consola__default.default.info("[JsonSchemaForm] Normalizing formData...", formData);
|
|
980
|
+
}
|
|
981
|
+
const normalized = normalizeFormData(formData, validatedSchema);
|
|
982
|
+
{
|
|
983
|
+
consola__default.default.info("[JsonSchemaForm] Normalized formData:", normalized);
|
|
984
|
+
}
|
|
985
|
+
return normalized;
|
|
986
|
+
}, [formData, validatedSchema]);
|
|
987
|
+
const widgets = react.useMemo(() => ({
|
|
988
|
+
// Standard widget names (PascalCase) - used by RJSF internally
|
|
989
|
+
TextWidget,
|
|
990
|
+
NumberWidget,
|
|
991
|
+
CheckboxWidget,
|
|
992
|
+
SelectWidget,
|
|
993
|
+
SwitchWidget,
|
|
994
|
+
ColorWidget,
|
|
995
|
+
SliderWidget,
|
|
996
|
+
// Lowercase aliases - for uiSchema 'ui:widget' references
|
|
997
|
+
text: TextWidget,
|
|
998
|
+
number: NumberWidget,
|
|
999
|
+
checkbox: CheckboxWidget,
|
|
1000
|
+
select: SelectWidget,
|
|
1001
|
+
switch: SwitchWidget,
|
|
1002
|
+
color: ColorWidget,
|
|
1003
|
+
slider: SliderWidget,
|
|
1004
|
+
range: SliderWidget
|
|
1005
|
+
// alias
|
|
1006
|
+
}), []);
|
|
1007
|
+
const templates = react.useMemo(() => ({
|
|
1008
|
+
FieldTemplate,
|
|
1009
|
+
ObjectFieldTemplate,
|
|
1010
|
+
ArrayFieldTemplate,
|
|
1011
|
+
ArrayFieldItemTemplate,
|
|
1012
|
+
ErrorListTemplate,
|
|
1013
|
+
BaseInputTemplate
|
|
1014
|
+
}), []);
|
|
1015
|
+
const handleSubmit = react.useCallback((data) => {
|
|
1016
|
+
if (onSubmit) {
|
|
1017
|
+
const cleanData = {
|
|
1018
|
+
...data,
|
|
1019
|
+
formData: normalizeFormData(data.formData, validatedSchema)
|
|
1020
|
+
};
|
|
1021
|
+
onSubmit(cleanData);
|
|
1022
|
+
}
|
|
1023
|
+
}, [onSubmit, validatedSchema]);
|
|
1024
|
+
const handleChange = react.useCallback((data) => {
|
|
1025
|
+
if (onChange) {
|
|
1026
|
+
onChange(data);
|
|
1027
|
+
}
|
|
1028
|
+
}, [onChange]);
|
|
1029
|
+
const handleError = react.useCallback((errors) => {
|
|
1030
|
+
if (onError) {
|
|
1031
|
+
onError(errors);
|
|
1032
|
+
}
|
|
1033
|
+
}, [onError]);
|
|
1034
|
+
if (!validatedSchema) {
|
|
1035
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsxs(components.Alert, { variant: "destructive", children: [
|
|
1036
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-4 w-4" }),
|
|
1037
|
+
/* @__PURE__ */ jsxRuntime.jsx(components.AlertDescription, { children: "Invalid schema provided. Please check the schema format." })
|
|
1038
|
+
] }) });
|
|
1039
|
+
}
|
|
1040
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1041
|
+
Form__default.default,
|
|
1042
|
+
{
|
|
1043
|
+
schema: validatedSchema,
|
|
1044
|
+
uiSchema,
|
|
1045
|
+
formData: normalizedFormData,
|
|
1046
|
+
validator: validator__default.default,
|
|
1047
|
+
widgets,
|
|
1048
|
+
templates,
|
|
1049
|
+
onSubmit: handleSubmit,
|
|
1050
|
+
onChange: handleChange,
|
|
1051
|
+
onError: handleError,
|
|
1052
|
+
showErrorList,
|
|
1053
|
+
liveValidate,
|
|
1054
|
+
disabled,
|
|
1055
|
+
readonly,
|
|
1056
|
+
...restProps,
|
|
1057
|
+
children: showSubmitButton && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(components.Button, { type: "submit", disabled, children: submitButtonText }) })
|
|
1058
|
+
}
|
|
1059
|
+
) });
|
|
1060
|
+
}
|
|
1061
|
+
chunkWGEGR3DF_cjs.__name(JsonSchemaForm, "JsonSchemaForm");
|
|
1062
|
+
|
|
1063
|
+
exports.ArrayFieldItemTemplate = ArrayFieldItemTemplate;
|
|
1064
|
+
exports.ArrayFieldTemplate = ArrayFieldTemplate;
|
|
1065
|
+
exports.BaseInputTemplate = BaseInputTemplate;
|
|
1066
|
+
exports.CheckboxWidget = CheckboxWidget;
|
|
1067
|
+
exports.ColorWidget = ColorWidget;
|
|
1068
|
+
exports.ErrorListTemplate = ErrorListTemplate;
|
|
1069
|
+
exports.FieldTemplate = FieldTemplate;
|
|
1070
|
+
exports.JsonSchemaForm = JsonSchemaForm;
|
|
1071
|
+
exports.NumberWidget = NumberWidget;
|
|
1072
|
+
exports.ObjectFieldTemplate = ObjectFieldTemplate;
|
|
1073
|
+
exports.SelectWidget = SelectWidget;
|
|
1074
|
+
exports.SliderWidget = SliderWidget;
|
|
1075
|
+
exports.SwitchWidget = SwitchWidget;
|
|
1076
|
+
exports.TextWidget = TextWidget;
|
|
1077
|
+
exports.getRequiredFields = getRequiredFields;
|
|
1078
|
+
exports.hasRequiredFields = hasRequiredFields;
|
|
1079
|
+
exports.mergeDefaults = mergeDefaults;
|
|
1080
|
+
exports.normalizeFormData = normalizeFormData;
|
|
1081
|
+
exports.safeJsonParse = safeJsonParse;
|
|
1082
|
+
exports.safeJsonStringify = safeJsonStringify;
|
|
1083
|
+
exports.validateRequiredFields = validateRequiredFields;
|
|
1084
|
+
exports.validateSchema = validateSchema;
|
|
1085
|
+
//# sourceMappingURL=chunk-PNZSJN6T.cjs.map
|
|
1086
|
+
//# sourceMappingURL=chunk-PNZSJN6T.cjs.map
|