@flanksource/clicky-ui 0.2.10 → 0.2.12
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/dist/components/Combobox.cjs +4 -1
- package/dist/components/Combobox.cjs.map +1 -1
- package/dist/components/Combobox.d.ts +6 -0
- package/dist/components/Combobox.d.ts.map +1 -1
- package/dist/components/Combobox.js +4 -1
- package/dist/components/Combobox.js.map +1 -1
- package/dist/components/JsonSchemaForm.cjs +11 -5
- package/dist/components/JsonSchemaForm.cjs.map +1 -1
- package/dist/components/JsonSchemaForm.d.ts +1 -1
- package/dist/components/JsonSchemaForm.d.ts.map +1 -1
- package/dist/components/JsonSchemaForm.js +11 -5
- package/dist/components/JsonSchemaForm.js.map +1 -1
- package/dist/components/json-schema-form-array.cjs +117 -37
- package/dist/components/json-schema-form-array.cjs.map +1 -1
- package/dist/components/json-schema-form-array.d.ts.map +1 -1
- package/dist/components/json-schema-form-array.js +118 -38
- package/dist/components/json-schema-form-array.js.map +1 -1
- package/dist/components/json-schema-form-fields.cjs +114 -51
- package/dist/components/json-schema-form-fields.cjs.map +1 -1
- package/dist/components/json-schema-form-fields.d.ts +7 -4
- package/dist/components/json-schema-form-fields.d.ts.map +1 -1
- package/dist/components/json-schema-form-fields.js +114 -51
- package/dist/components/json-schema-form-fields.js.map +1 -1
- package/dist/components/json-schema-form-render.cjs +14 -7
- package/dist/components/json-schema-form-render.cjs.map +1 -1
- package/dist/components/json-schema-form-render.d.ts +3 -0
- package/dist/components/json-schema-form-render.d.ts.map +1 -1
- package/dist/components/json-schema-form-render.js +14 -7
- package/dist/components/json-schema-form-render.js.map +1 -1
- package/dist/components/json-schema-form-resolve.cjs +41 -6
- package/dist/components/json-schema-form-resolve.cjs.map +1 -1
- package/dist/components/json-schema-form-resolve.d.ts.map +1 -1
- package/dist/components/json-schema-form-resolve.js +41 -6
- package/dist/components/json-schema-form-resolve.js.map +1 -1
- package/dist/components/json-schema-form-size.cjs +61 -0
- package/dist/components/json-schema-form-size.cjs.map +1 -0
- package/dist/components/json-schema-form-size.d.ts +11 -0
- package/dist/components/json-schema-form-size.d.ts.map +1 -0
- package/dist/components/json-schema-form-size.js +61 -0
- package/dist/components/json-schema-form-size.js.map +1 -0
- package/dist/components/json-schema-form-types.d.ts +27 -4
- package/dist/components/json-schema-form-types.d.ts.map +1 -1
- package/dist/components.cjs +2 -0
- package/dist/components.cjs.map +1 -1
- package/dist/components.d.ts +3 -1
- package/dist/components.d.ts.map +1 -1
- package/dist/components.js +2 -0
- package/dist/components.js.map +1 -1
- package/dist/data/Clicky.cjs +412 -90
- package/dist/data/Clicky.cjs.map +1 -1
- package/dist/data/Clicky.d.ts +4 -2
- package/dist/data/Clicky.d.ts.map +1 -1
- package/dist/data/Clicky.js +413 -91
- package/dist/data/Clicky.js.map +1 -1
- package/dist/data/DataTable.cjs +534 -293
- package/dist/data/DataTable.cjs.map +1 -1
- package/dist/data/DataTable.d.ts +12 -0
- package/dist/data/DataTable.d.ts.map +1 -1
- package/dist/data/DataTable.js +534 -293
- package/dist/data/DataTable.js.map +1 -1
- package/dist/data/LogDetails.cjs +4 -2
- package/dist/data/LogDetails.cjs.map +1 -1
- package/dist/data/LogDetails.js +4 -2
- package/dist/data/LogDetails.js.map +1 -1
- package/dist/data.d.ts +1 -1
- package/dist/data.d.ts.map +1 -1
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/layout/SplitPane.cjs +34 -27
- package/dist/layout/SplitPane.cjs.map +1 -1
- package/dist/layout/SplitPane.d.ts.map +1 -1
- package/dist/layout/SplitPane.js +34 -27
- package/dist/layout/SplitPane.js.map +1 -1
- package/dist/rpc/CommandOutput.cjs +101 -20
- package/dist/rpc/CommandOutput.cjs.map +1 -1
- package/dist/rpc/CommandOutput.d.ts +12 -4
- package/dist/rpc/CommandOutput.d.ts.map +1 -1
- package/dist/rpc/CommandOutput.js +102 -21
- package/dist/rpc/CommandOutput.js.map +1 -1
- package/dist/rpc/ExecutionResult.cjs +4 -76
- package/dist/rpc/ExecutionResult.cjs.map +1 -1
- package/dist/rpc/ExecutionResult.d.ts +3 -22
- package/dist/rpc/ExecutionResult.d.ts.map +1 -1
- package/dist/rpc/ExecutionResult.js +4 -76
- package/dist/rpc/ExecutionResult.js.map +1 -1
- package/dist/rpc/OperationCatalog.cjs +22 -13
- package/dist/rpc/OperationCatalog.cjs.map +1 -1
- package/dist/rpc/OperationCatalog.d.ts.map +1 -1
- package/dist/rpc/OperationCatalog.js +24 -15
- package/dist/rpc/OperationCatalog.js.map +1 -1
- package/dist/rpc/OperationCommandPage.cjs +10 -20
- package/dist/rpc/OperationCommandPage.cjs.map +1 -1
- package/dist/rpc/OperationCommandPage.d.ts.map +1 -1
- package/dist/rpc/OperationCommandPage.js +11 -21
- package/dist/rpc/OperationCommandPage.js.map +1 -1
- package/dist/rpc/apiClient.cjs +18 -0
- package/dist/rpc/apiClient.cjs.map +1 -1
- package/dist/rpc/apiClient.d.ts.map +1 -1
- package/dist/rpc/apiClient.js +18 -0
- package/dist/rpc/apiClient.js.map +1 -1
- package/dist/rpc/formMetadata.cjs +31 -0
- package/dist/rpc/formMetadata.cjs.map +1 -1
- package/dist/rpc/formMetadata.d.ts +3 -1
- package/dist/rpc/formMetadata.d.ts.map +1 -1
- package/dist/rpc/formMetadata.js +31 -0
- package/dist/rpc/formMetadata.js.map +1 -1
- package/dist/rpc/types.cjs.map +1 -1
- package/dist/rpc/types.d.ts +7 -0
- package/dist/rpc/types.d.ts.map +1 -1
- package/dist/rpc/types.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -10,26 +10,33 @@ const Combobox = require("./Combobox.cjs");
|
|
|
10
10
|
const DateTimePicker = require("./DateTimePicker.cjs");
|
|
11
11
|
const jsonSchemaFormArray = require("./json-schema-form-array.cjs");
|
|
12
12
|
const jsonSchemaFormRender = require("./json-schema-form-render.cjs");
|
|
13
|
-
const
|
|
13
|
+
const jsonSchemaFormSize = require("./json-schema-form-size.cjs");
|
|
14
14
|
const UiAdd = require("../icons/components/UiAdd.cjs");
|
|
15
|
-
const
|
|
15
|
+
const UiTrash = require("../icons/components/UiTrash.cjs");
|
|
16
|
+
const INPUT_BASE = "w-full min-w-0 rounded-md border border-input bg-background text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:bg-muted/40 focus-visible:ring-2 focus-visible:ring-ring";
|
|
17
|
+
function inputClass(size) {
|
|
18
|
+
return utils.cn(INPUT_BASE, jsonSchemaFormSize.inputSizeClass[size]);
|
|
19
|
+
}
|
|
16
20
|
function FieldWrapper({
|
|
17
21
|
label,
|
|
18
22
|
value,
|
|
19
23
|
helper,
|
|
20
24
|
error,
|
|
21
|
-
layout
|
|
25
|
+
layout,
|
|
26
|
+
size
|
|
22
27
|
}) {
|
|
23
28
|
if (layout.mode === "inline") {
|
|
24
29
|
const labelMaxWidth = layout.labelMaxWidth ?? "40ch";
|
|
25
|
-
const valueMaxWidth = layout.valueMaxWidth ?? "
|
|
30
|
+
const valueMaxWidth = layout.valueMaxWidth ?? "600px";
|
|
26
31
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
27
32
|
"div",
|
|
28
33
|
{
|
|
29
34
|
className: "grid items-start gap-x-3 gap-y-0.5",
|
|
30
|
-
style: {
|
|
35
|
+
style: {
|
|
36
|
+
gridTemplateColumns: `minmax(0, min(${labelMaxWidth}, max-content)) minmax(0, ${valueMaxWidth})`
|
|
37
|
+
},
|
|
31
38
|
children: [
|
|
32
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-
|
|
39
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("flex min-w-0 items-center", jsonSchemaFormSize.controlMinHeightClass[size]), children: label }),
|
|
33
40
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: value }),
|
|
34
41
|
helper && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "col-start-2 text-xs text-muted-foreground", children: helper }),
|
|
35
42
|
error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "col-start-2 text-xs text-destructive", children: error })
|
|
@@ -37,39 +44,41 @@ function FieldWrapper({
|
|
|
37
44
|
}
|
|
38
45
|
);
|
|
39
46
|
}
|
|
40
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "
|
|
47
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col", jsonSchemaFormSize.fieldInnerGapClass[size]), children: [
|
|
41
48
|
label,
|
|
42
49
|
value,
|
|
43
50
|
helper && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: helper }),
|
|
44
51
|
error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive", children: error })
|
|
45
52
|
] });
|
|
46
53
|
}
|
|
47
|
-
function FieldLabel({ field, fieldId }) {
|
|
48
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: fieldId, className: "flex items-center gap-2
|
|
49
|
-
/* @__PURE__ */ jsxRuntime.jsx(Icon.LabelIcon, { icon: field.labelIcon, className: "text-[15px] text-muted-foreground" }),
|
|
50
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { title: field.label !== field.key ? field.key : void 0, children: field.label }),
|
|
51
|
-
field.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive", children: "*" }),
|
|
52
|
-
field.badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: field.badge })
|
|
54
|
+
function FieldLabel({ field, fieldId, size }) {
|
|
55
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: fieldId, className: utils.cn("flex min-w-0 items-center gap-2 font-medium", jsonSchemaFormSize.labelSizeClass[size]), children: [
|
|
56
|
+
/* @__PURE__ */ jsxRuntime.jsx(Icon.LabelIcon, { icon: field.labelIcon, className: "shrink-0 text-[15px] text-muted-foreground" }),
|
|
57
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", title: field.label !== field.key ? field.key : void 0, children: field.label }),
|
|
58
|
+
field.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-destructive", children: "*" }),
|
|
59
|
+
field.badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: field.badge })
|
|
53
60
|
] });
|
|
54
61
|
}
|
|
55
|
-
function fieldInputId(key) {
|
|
56
|
-
|
|
62
|
+
function fieldInputId(key, prefix) {
|
|
63
|
+
const safe = key.replace(/[^a-zA-Z0-9_-]/g, "_");
|
|
64
|
+
return prefix ? `jsf-${prefix}-${safe}` : `jsf-${safe}`;
|
|
57
65
|
}
|
|
58
66
|
function renderValueControl(field, ctx) {
|
|
59
|
-
const fieldId = fieldInputId(field.key);
|
|
67
|
+
const fieldId = fieldInputId(field.key, ctx.idPrefix);
|
|
60
68
|
if (field.readOnly && field.kind !== "array" && field.kind !== "object" && field.kind !== "string-map") {
|
|
61
|
-
return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyValue, { field, fieldId });
|
|
69
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ReadOnlyValue, { field, fieldId, size: ctx.size });
|
|
62
70
|
}
|
|
63
71
|
const readOnly = ctx.readOnly;
|
|
72
|
+
const size = ctx.size;
|
|
64
73
|
switch (field.kind) {
|
|
65
74
|
case "enum":
|
|
66
|
-
return /* @__PURE__ */ jsxRuntime.jsx(EnumControl, { field, fieldId, readOnly });
|
|
75
|
+
return /* @__PURE__ */ jsxRuntime.jsx(EnumControl, { field, fieldId, readOnly, size });
|
|
67
76
|
case "boolean":
|
|
68
|
-
return /* @__PURE__ */ jsxRuntime.jsx(BooleanControl, { field, fieldId, readOnly });
|
|
77
|
+
return /* @__PURE__ */ jsxRuntime.jsx(BooleanControl, { field, fieldId, readOnly, size });
|
|
69
78
|
case "number":
|
|
70
|
-
return /* @__PURE__ */ jsxRuntime.jsx(NumberControl, { field, fieldId, readOnly });
|
|
79
|
+
return /* @__PURE__ */ jsxRuntime.jsx(NumberControl, { field, fieldId, readOnly, size });
|
|
71
80
|
case "date":
|
|
72
|
-
return /* @__PURE__ */ jsxRuntime.jsx(DateControl, { field, fieldId, readOnly });
|
|
81
|
+
return /* @__PURE__ */ jsxRuntime.jsx(DateControl, { field, fieldId, readOnly, size });
|
|
73
82
|
case "array":
|
|
74
83
|
return /* @__PURE__ */ jsxRuntime.jsx(jsonSchemaFormArray.ArrayControl, { field, fieldId, ctx });
|
|
75
84
|
case "object":
|
|
@@ -77,10 +86,10 @@ function renderValueControl(field, ctx) {
|
|
|
77
86
|
case "string-map":
|
|
78
87
|
return /* @__PURE__ */ jsxRuntime.jsx(StringMapControl, { field, ctx });
|
|
79
88
|
default:
|
|
80
|
-
return /* @__PURE__ */ jsxRuntime.jsx(StringControl, { field, fieldId, readOnly });
|
|
89
|
+
return /* @__PURE__ */ jsxRuntime.jsx(StringControl, { field, fieldId, readOnly, size });
|
|
81
90
|
}
|
|
82
91
|
}
|
|
83
|
-
function ReadOnlyValue({ field, fieldId }) {
|
|
92
|
+
function ReadOnlyValue({ field, fieldId, size }) {
|
|
84
93
|
const text = toText(field.value);
|
|
85
94
|
const display = field.kind === "date" && text ? Timestamp.formatDateTimeRelative(text) : text;
|
|
86
95
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -89,7 +98,7 @@ function ReadOnlyValue({ field, fieldId }) {
|
|
|
89
98
|
id: fieldId,
|
|
90
99
|
"data-jsf-input": true,
|
|
91
100
|
"data-jsf-readonly": true,
|
|
92
|
-
className: "flex
|
|
101
|
+
className: utils.cn("flex items-center text-foreground", jsonSchemaFormSize.controlHeightClass[size], jsonSchemaFormSize.labelSizeClass[size]),
|
|
93
102
|
title: text || void 0,
|
|
94
103
|
children: display || /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "—" })
|
|
95
104
|
}
|
|
@@ -98,7 +107,8 @@ function ReadOnlyValue({ field, fieldId }) {
|
|
|
98
107
|
function StringControl({
|
|
99
108
|
field,
|
|
100
109
|
fieldId,
|
|
101
|
-
readOnly
|
|
110
|
+
readOnly,
|
|
111
|
+
size
|
|
102
112
|
}) {
|
|
103
113
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
104
114
|
"input",
|
|
@@ -106,7 +116,7 @@ function StringControl({
|
|
|
106
116
|
id: fieldId,
|
|
107
117
|
type: "text",
|
|
108
118
|
"data-jsf-input": true,
|
|
109
|
-
className:
|
|
119
|
+
className: inputClass(size),
|
|
110
120
|
value: toText(field.value),
|
|
111
121
|
disabled: readOnly,
|
|
112
122
|
placeholder: defaultPlaceholder(field.schema),
|
|
@@ -117,7 +127,8 @@ function StringControl({
|
|
|
117
127
|
function NumberControl({
|
|
118
128
|
field,
|
|
119
129
|
fieldId,
|
|
120
|
-
readOnly
|
|
130
|
+
readOnly,
|
|
131
|
+
size
|
|
121
132
|
}) {
|
|
122
133
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
123
134
|
"input",
|
|
@@ -126,7 +137,7 @@ function NumberControl({
|
|
|
126
137
|
type: "text",
|
|
127
138
|
inputMode: "decimal",
|
|
128
139
|
"data-jsf-input": true,
|
|
129
|
-
className:
|
|
140
|
+
className: inputClass(size),
|
|
130
141
|
value: toText(field.value),
|
|
131
142
|
disabled: readOnly,
|
|
132
143
|
placeholder: defaultPlaceholder(field.schema),
|
|
@@ -145,7 +156,8 @@ function NumberControl({
|
|
|
145
156
|
function DateControl({
|
|
146
157
|
field,
|
|
147
158
|
fieldId,
|
|
148
|
-
readOnly
|
|
159
|
+
readOnly,
|
|
160
|
+
size
|
|
149
161
|
}) {
|
|
150
162
|
const text = toText(field.value);
|
|
151
163
|
if (readOnly) {
|
|
@@ -154,7 +166,7 @@ function DateControl({
|
|
|
154
166
|
{
|
|
155
167
|
id: fieldId,
|
|
156
168
|
"data-jsf-input": true,
|
|
157
|
-
className: "flex
|
|
169
|
+
className: utils.cn("flex items-center text-foreground", jsonSchemaFormSize.controlHeightClass[size], jsonSchemaFormSize.labelSizeClass[size]),
|
|
158
170
|
title: text || void 0,
|
|
159
171
|
children: text ? Timestamp.formatDateTimeRelative(text) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "—" })
|
|
160
172
|
}
|
|
@@ -166,7 +178,7 @@ function DateControl({
|
|
|
166
178
|
id: fieldId,
|
|
167
179
|
"aria-label": field.label,
|
|
168
180
|
"data-jsf-input": true,
|
|
169
|
-
inputClassName: utils.cn(
|
|
181
|
+
inputClassName: utils.cn(inputClass(size), "pr-8"),
|
|
170
182
|
value: text,
|
|
171
183
|
onChange: (next) => field.onChange(next),
|
|
172
184
|
placeholder: defaultPlaceholder(field.schema)
|
|
@@ -176,10 +188,11 @@ function DateControl({
|
|
|
176
188
|
function BooleanControl({
|
|
177
189
|
field,
|
|
178
190
|
fieldId,
|
|
179
|
-
readOnly
|
|
191
|
+
readOnly,
|
|
192
|
+
size
|
|
180
193
|
}) {
|
|
181
194
|
if (typeof field.value === "boolean" || field.value === void 0 || field.value === null) {
|
|
182
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex
|
|
195
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("flex items-center", jsonSchemaFormSize.controlHeightClass[size]), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
183
196
|
"input",
|
|
184
197
|
{
|
|
185
198
|
id: fieldId,
|
|
@@ -191,17 +204,18 @@ function BooleanControl({
|
|
|
191
204
|
}
|
|
192
205
|
) });
|
|
193
206
|
}
|
|
194
|
-
return /* @__PURE__ */ jsxRuntime.jsx(StringControl, { field, fieldId, readOnly });
|
|
207
|
+
return /* @__PURE__ */ jsxRuntime.jsx(StringControl, { field, fieldId, readOnly, size });
|
|
195
208
|
}
|
|
196
209
|
function EnumControl({
|
|
197
210
|
field,
|
|
198
211
|
fieldId,
|
|
199
|
-
readOnly
|
|
212
|
+
readOnly,
|
|
213
|
+
size
|
|
200
214
|
}) {
|
|
201
215
|
const value = toText(field.value);
|
|
202
216
|
const options = withSyntheticValue(field.options ?? [], value);
|
|
203
217
|
if (field.display === "radio") {
|
|
204
|
-
return /* @__PURE__ */ jsxRuntime.jsx(RadioGroupControl, { field, fieldId, readOnly, options, value });
|
|
218
|
+
return /* @__PURE__ */ jsxRuntime.jsx(RadioGroupControl, { field, fieldId, readOnly, options, value, size });
|
|
205
219
|
}
|
|
206
220
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
207
221
|
Combobox.Combobox,
|
|
@@ -210,6 +224,7 @@ function EnumControl({
|
|
|
210
224
|
options,
|
|
211
225
|
value,
|
|
212
226
|
disabled: readOnly,
|
|
227
|
+
size,
|
|
213
228
|
allowCustomValue: field.allowCustomValue ?? false,
|
|
214
229
|
onChange: (v) => field.onChange(v),
|
|
215
230
|
...defaultPlaceholder(field.schema) ? { placeholder: defaultPlaceholder(field.schema) } : {}
|
|
@@ -221,7 +236,8 @@ function RadioGroupControl({
|
|
|
221
236
|
fieldId,
|
|
222
237
|
readOnly,
|
|
223
238
|
options,
|
|
224
|
-
value
|
|
239
|
+
value,
|
|
240
|
+
size
|
|
225
241
|
}) {
|
|
226
242
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
227
243
|
"div",
|
|
@@ -237,7 +253,8 @@ function RadioGroupControl({
|
|
|
237
253
|
"label",
|
|
238
254
|
{
|
|
239
255
|
className: utils.cn(
|
|
240
|
-
"inline-flex cursor-pointer select-none items-center rounded px-2.5 py-1
|
|
256
|
+
"inline-flex cursor-pointer select-none items-center rounded px-2.5 py-1",
|
|
257
|
+
jsonSchemaFormSize.labelSizeClass[size],
|
|
241
258
|
checked ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground",
|
|
242
259
|
readOnly && "cursor-not-allowed opacity-60"
|
|
243
260
|
),
|
|
@@ -270,7 +287,7 @@ function ObjectControl({ field, ctx }) {
|
|
|
270
287
|
...field.objectRequired ? { required: field.objectRequired } : {},
|
|
271
288
|
...Array.isArray(field.schema.allOf) ? { allOf: field.schema.allOf } : {}
|
|
272
289
|
};
|
|
273
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "
|
|
290
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("grid", jsonSchemaFormSize.stackedRowGapClass[ctx.size]), children: jsonSchemaFormRender.renderObjectFields(subSchema, obj, (next) => field.onChange(next), {
|
|
274
291
|
...ctx,
|
|
275
292
|
readOnly: ctx.readOnly || field.readOnly === true,
|
|
276
293
|
depth: ctx.depth + 1
|
|
@@ -283,6 +300,21 @@ function StringMapControl({ field, ctx }) {
|
|
|
283
300
|
const knownKeys = Object.keys(known);
|
|
284
301
|
const extraKeys = Object.keys(map).filter((k) => !(k in known));
|
|
285
302
|
const childCtx = { ...ctx, readOnly, depth: ctx.depth + 1 };
|
|
303
|
+
function valueSchemaForKey(key) {
|
|
304
|
+
for (const { pattern, schema } of field.valuePatternSchemas ?? []) {
|
|
305
|
+
let re;
|
|
306
|
+
try {
|
|
307
|
+
re = new RegExp(pattern);
|
|
308
|
+
} catch {
|
|
309
|
+
re = void 0;
|
|
310
|
+
}
|
|
311
|
+
if (re == null ? void 0 : re.test(key)) return schema;
|
|
312
|
+
}
|
|
313
|
+
return field.valueSchema ?? { type: "string" };
|
|
314
|
+
}
|
|
315
|
+
function entryIsStacked(key) {
|
|
316
|
+
return valueSchemaForKey(key)["x-layout"] === "stack";
|
|
317
|
+
}
|
|
286
318
|
function setEntry(key, next) {
|
|
287
319
|
field.onChange({ ...map, [key]: next });
|
|
288
320
|
}
|
|
@@ -314,35 +346,62 @@ function StringMapControl({ field, ctx }) {
|
|
|
314
346
|
);
|
|
315
347
|
return (nodes == null ? void 0 : nodes.value) ?? null;
|
|
316
348
|
}
|
|
317
|
-
|
|
349
|
+
function valueControlForKey(key) {
|
|
350
|
+
return valueControlFor(key, valueSchemaForKey(key));
|
|
351
|
+
}
|
|
352
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col rounded-md border border-input p-2", jsonSchemaFormSize.fieldInnerGapClass[childCtx.size]), children: [
|
|
318
353
|
knownKeys.map((key) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[10rem_1fr] items-center gap-2", children: [
|
|
319
|
-
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: fieldInputId(key), className: "truncate text-xs text-muted-foreground", title: key, children: key }),
|
|
354
|
+
/* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: fieldInputId(key, childCtx.idPrefix), className: "truncate text-xs text-muted-foreground", title: key, children: key }),
|
|
320
355
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: valueControlFor(key, known[key] ?? { type: "string" }) })
|
|
321
356
|
] }, `known-${key}`)),
|
|
322
|
-
extraKeys.map((key) =>
|
|
323
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
357
|
+
extraKeys.map((key) => {
|
|
358
|
+
const keyControl = field.keyOptions ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
359
|
+
Combobox.Combobox,
|
|
360
|
+
{
|
|
361
|
+
options: keyPickerOptions(field.keyOptions, extraKeys, key),
|
|
362
|
+
value: key,
|
|
363
|
+
disabled: readOnly,
|
|
364
|
+
size: childCtx.size,
|
|
365
|
+
allowCustomValue: false,
|
|
366
|
+
onChange: (next) => renameEntry(key, next),
|
|
367
|
+
placeholder: "Select…"
|
|
368
|
+
}
|
|
369
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
324
370
|
"input",
|
|
325
371
|
{
|
|
326
372
|
type: "text",
|
|
327
373
|
"aria-label": "Field name",
|
|
328
|
-
className: utils.cn(
|
|
374
|
+
className: utils.cn(inputClass(childCtx.size), "font-mono"),
|
|
329
375
|
value: key,
|
|
330
376
|
disabled: readOnly,
|
|
331
377
|
onChange: (e) => renameEntry(key, e.target.value)
|
|
332
378
|
}
|
|
333
|
-
)
|
|
334
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
335
|
-
!readOnly && /* @__PURE__ */ jsxRuntime.jsx(
|
|
379
|
+
);
|
|
380
|
+
const removeButton = !readOnly ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
336
381
|
"button",
|
|
337
382
|
{
|
|
338
383
|
type: "button",
|
|
339
384
|
"aria-label": `Remove ${key}`,
|
|
340
|
-
className: "inline-flex h-8 w-8 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground",
|
|
385
|
+
className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground",
|
|
341
386
|
onClick: () => removeEntry(key),
|
|
342
387
|
children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiTrash.UiTrash, className: "text-sm" })
|
|
343
388
|
}
|
|
344
|
-
)
|
|
345
|
-
|
|
389
|
+
) : null;
|
|
390
|
+
if (entryIsStacked(key)) {
|
|
391
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5 rounded-md border border-input p-2", children: [
|
|
392
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
393
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: keyControl }),
|
|
394
|
+
removeButton
|
|
395
|
+
] }),
|
|
396
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: valueControlForKey(key) })
|
|
397
|
+
] }, `extra-${key}`);
|
|
398
|
+
}
|
|
399
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[10rem_1fr_auto] items-center gap-2", children: [
|
|
400
|
+
keyControl,
|
|
401
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children: valueControlForKey(key) }),
|
|
402
|
+
removeButton
|
|
403
|
+
] }, `extra-${key}`);
|
|
404
|
+
}),
|
|
346
405
|
!readOnly && field.allowExtraKeys !== false && /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { type: "button", variant: "outline", size: "sm", onClick: addEntry, className: "gap-1.5", children: [
|
|
347
406
|
/* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiAdd.UiAdd, className: "text-sm" }),
|
|
348
407
|
"Add field"
|
|
@@ -353,6 +412,10 @@ function withSyntheticValue(options, value) {
|
|
|
353
412
|
if (!value || options.some((o) => o.value === value)) return options;
|
|
354
413
|
return [{ value, label: value }, ...options];
|
|
355
414
|
}
|
|
415
|
+
function keyPickerOptions(options, usedKeys, currentKey) {
|
|
416
|
+
const taken = new Set(usedKeys.filter((k) => k !== currentKey));
|
|
417
|
+
return options.filter((o) => !taken.has(o.value));
|
|
418
|
+
}
|
|
356
419
|
function toText(value) {
|
|
357
420
|
if (value === void 0 || value === null) return "";
|
|
358
421
|
if (typeof value === "object") return "";
|
|
@@ -369,6 +432,6 @@ exports.FieldLabel = FieldLabel;
|
|
|
369
432
|
exports.FieldWrapper = FieldWrapper;
|
|
370
433
|
exports.defaultPlaceholder = defaultPlaceholder;
|
|
371
434
|
exports.fieldInputId = fieldInputId;
|
|
372
|
-
exports.
|
|
435
|
+
exports.inputClass = inputClass;
|
|
373
436
|
exports.renderValueControl = renderValueControl;
|
|
374
437
|
//# sourceMappingURL=json-schema-form-fields.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json-schema-form-fields.cjs","sources":["../../src/components/json-schema-form-fields.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { formatDateTimeRelative } from \"../data/cells/Timestamp\";\nimport { UiAdd, UiTrash } from \"../icons\";\nimport { Button } from \"./button\";\nimport { Combobox } from \"./Combobox\";\nimport { DateTimePicker } from \"./DateTimePicker\";\nimport { ArrayControl } from \"./json-schema-form-array\";\nimport { renderFieldNodes, renderObjectFields, type RenderContext } from \"./json-schema-form-render\";\nimport type {\n FieldControl,\n FieldOption,\n FormLayout,\n JsonSchemaObject,\n JsonSchemaProperty,\n} from \"./json-schema-form-types\";\n\nexport const inputClassName =\n \"h-9 w-full min-w-0 rounded-md border border-input bg-background px-2 text-sm text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:bg-muted/40 focus-visible:ring-2 focus-visible:ring-ring\";\n\n// FieldWrapper lays out a label + value (+ helper/error) either inline (2-col)\n// or stacked, mirroring the convention used elsewhere in the library. In inline\n// mode the label and value columns are capped (see FormLayout); the grid\n// template is set inline because Tailwind can't interpolate runtime widths.\nexport function FieldWrapper({\n label,\n value,\n helper,\n error,\n layout,\n}: {\n label: ReactNode;\n value: ReactNode;\n helper?: ReactNode;\n error?: ReactNode;\n layout: FormLayout;\n}) {\n if (layout.mode === \"inline\") {\n const labelMaxWidth = layout.labelMaxWidth ?? \"40ch\";\n const valueMaxWidth = layout.valueMaxWidth ?? \"400px\";\n return (\n <div\n className=\"grid items-start gap-x-3 gap-y-0.5\"\n style={{ gridTemplateColumns: `minmax(0, ${labelMaxWidth}) minmax(0, ${valueMaxWidth})` }}\n >\n <div className=\"flex min-h-9 min-w-0 items-center\">{label}</div>\n <div className=\"min-w-0\">{value}</div>\n {helper && <p className=\"col-start-2 text-xs text-muted-foreground\">{helper}</p>}\n {error && <p className=\"col-start-2 text-xs text-destructive\">{error}</p>}\n </div>\n );\n }\n return (\n <div className=\"space-y-1.5\">\n {label}\n {value}\n {helper && <p className=\"text-xs text-muted-foreground\">{helper}</p>}\n {error && <p className=\"text-xs text-destructive\">{error}</p>}\n </div>\n );\n}\n\nexport function FieldLabel({ field, fieldId }: { field: FieldControl; fieldId: string }) {\n return (\n <label htmlFor={fieldId} className=\"flex items-center gap-2 text-sm font-medium\">\n <LabelIcon icon={field.labelIcon} className=\"text-[15px] text-muted-foreground\" />\n <span title={field.label !== field.key ? field.key : undefined}>{field.label}</span>\n {field.required && <span className=\"text-destructive\">*</span>}\n {field.badge && (\n <span className=\"rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n {field.badge}\n </span>\n )}\n </label>\n );\n}\n\nexport function fieldInputId(key: string): string {\n return `jsf-${key.replace(/[^a-zA-Z0-9_-]/g, \"_\")}`;\n}\n\n// renderValueControl produces just the value node for a field, dispatching on\n// its resolved kind. The RenderContext carries readOnly + the pre/post stacks so\n// container controls (array/object/map) can recurse with full context.\nexport function renderValueControl(field: FieldControl, ctx: RenderContext): ReactNode {\n const fieldId = fieldInputId(field.key);\n // A field the schema marks `readOnly` is never editable: it shows its current\n // value as plain text, not a disabled input. (The form-level ctx.readOnly,\n // below, instead disables the real controls so the structure stays visible.)\n // Containers (array/object/map) still render structurally so nested read-only\n // values surface; their own children resolve their own readOnly.\n if (field.readOnly && field.kind !== \"array\" && field.kind !== \"object\" && field.kind !== \"string-map\") {\n return <ReadOnlyValue field={field} fieldId={fieldId} />;\n }\n const readOnly = ctx.readOnly;\n switch (field.kind) {\n case \"enum\":\n return <EnumControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n case \"boolean\":\n return <BooleanControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n case \"number\":\n return <NumberControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n case \"date\":\n return <DateControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n case \"array\":\n return <ArrayControl field={field} fieldId={fieldId} ctx={ctx} />;\n case \"object\":\n return <ObjectControl field={field} ctx={ctx} />;\n case \"string-map\":\n return <StringMapControl field={field} ctx={ctx} />;\n default:\n return <StringControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n }\n}\n\n// ReadOnlyValue renders a `readOnly` field's current value as static text — no\n// input, no border, just the value (date/date-time formatted human-readably).\n// An empty value shows an em-dash. Carries the same id + data-jsf-input as the\n// editable controls so layout and queries stay uniform.\nfunction ReadOnlyValue({ field, fieldId }: { field: FieldControl; fieldId: string }) {\n const text = toText(field.value);\n const display = field.kind === \"date\" && text ? formatDateTimeRelative(text) : text;\n return (\n <span\n id={fieldId}\n data-jsf-input\n data-jsf-readonly\n className=\"flex h-9 items-center text-sm text-foreground\"\n title={text || undefined}\n >\n {display || <span className=\"text-muted-foreground\">—</span>}\n </span>\n );\n}\n\nfunction StringControl({\n field,\n fieldId,\n readOnly,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n}) {\n return (\n <input\n id={fieldId}\n type=\"text\"\n data-jsf-input\n className={inputClassName}\n value={toText(field.value)}\n disabled={readOnly}\n placeholder={defaultPlaceholder(field.schema)}\n onChange={(e) => field.onChange(e.target.value)}\n />\n );\n}\n\nfunction NumberControl({\n field,\n fieldId,\n readOnly,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n}) {\n // type=\"text\" (not number) so non-numeric values a consumer permits — e.g.\n // template tokens — are not silently dropped by the browser.\n return (\n <input\n id={fieldId}\n type=\"text\"\n inputMode=\"decimal\"\n data-jsf-input\n className={inputClassName}\n value={toText(field.value)}\n disabled={readOnly}\n placeholder={defaultPlaceholder(field.schema)}\n onChange={(e) => {\n const raw = e.target.value;\n const coerce = field.coerceNumber !== false;\n if (coerce && raw.trim() !== \"\" && Number.isFinite(Number(raw))) {\n field.onChange(Number(raw));\n } else {\n field.onChange(raw);\n }\n }}\n />\n );\n}\n\n// DateControl edits a `format: date`/`date-time` string. Read-only, it shows the\n// human-readable absolute + relative form (e.g. \"Apr 15, 2026, 12:00 PM (2h\n// ago)\"); editable, a DateTimePicker. The raw string is committed unchanged so a\n// consumer-permitted template token in the field is preserved.\nfunction DateControl({\n field,\n fieldId,\n readOnly,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n}) {\n const text = toText(field.value);\n if (readOnly) {\n return (\n <div\n id={fieldId}\n data-jsf-input\n className=\"flex h-9 items-center text-sm text-foreground\"\n title={text || undefined}\n >\n {text ? formatDateTimeRelative(text) : <span className=\"text-muted-foreground\">—</span>}\n </div>\n );\n }\n return (\n <DateTimePicker\n id={fieldId}\n aria-label={field.label}\n data-jsf-input\n inputClassName={cn(inputClassName, \"pr-8\")}\n value={text}\n onChange={(next) => field.onChange(next)}\n placeholder={defaultPlaceholder(field.schema)}\n />\n );\n}\n\nfunction BooleanControl({\n field,\n fieldId,\n readOnly,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n}) {\n // Only render a checkbox when the value is genuinely boolean (or unset).\n // A non-boolean value (e.g. a token a consumer left in place) renders as text\n // so it is preserved and editable.\n if (typeof field.value === \"boolean\" || field.value === undefined || field.value === null) {\n return (\n <div className=\"flex h-9 items-center\">\n <input\n id={fieldId}\n type=\"checkbox\"\n className=\"h-4 w-4 accent-primary\"\n checked={field.value === true}\n disabled={readOnly}\n onChange={(e) => field.onChange(e.target.checked)}\n />\n </div>\n );\n }\n return <StringControl field={field} fieldId={fieldId} readOnly={readOnly} />;\n}\n\nfunction EnumControl({\n field,\n fieldId,\n readOnly,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n}) {\n const value = toText(field.value);\n const options = withSyntheticValue(field.options ?? [], value);\n if (field.display === \"radio\") {\n return <RadioGroupControl field={field} fieldId={fieldId} readOnly={readOnly} options={options} value={value} />;\n }\n return (\n <Combobox\n id={fieldId}\n options={options}\n value={value}\n disabled={readOnly}\n allowCustomValue={field.allowCustomValue ?? false}\n onChange={(v) => field.onChange(v)}\n {...(defaultPlaceholder(field.schema) ? { placeholder: defaultPlaceholder(field.schema) } : {})}\n />\n );\n}\n\n// RadioGroupControl renders a small fixed enum as a segmented radio-button group\n// instead of a dropdown. It shares EnumControl's option list (any out-of-enum\n// value is already prepended, so a token still shows). One `radiogroup` role +\n// native radios keep it keyboard-navigable; the visible chip is a styled label.\nfunction RadioGroupControl({\n field,\n fieldId,\n readOnly,\n options,\n value,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n options: FieldOption[];\n value: string;\n}) {\n return (\n <div\n role=\"radiogroup\"\n aria-label={field.label}\n id={fieldId}\n data-jsf-input\n className=\"inline-flex flex-wrap items-center gap-1 rounded-md border border-input bg-background p-0.5\"\n >\n {options.map((opt) => {\n const checked = opt.value === value;\n return (\n <label\n key={opt.value}\n className={cn(\n \"inline-flex cursor-pointer select-none items-center rounded px-2.5 py-1 text-sm\",\n checked\n ? \"bg-primary text-primary-foreground\"\n : \"text-muted-foreground hover:bg-accent hover:text-foreground\",\n readOnly && \"cursor-not-allowed opacity-60\",\n )}\n >\n <input\n type=\"radio\"\n name={fieldId}\n className=\"sr-only\"\n value={opt.value}\n checked={checked}\n disabled={readOnly}\n onChange={() => field.onChange(opt.value)}\n />\n {opt.label}\n </label>\n );\n })}\n </div>\n );\n}\n\n// ObjectControl renders a nested structured object as a sub-form: its own\n// properties, required markers, if/then, soft errors — all via the shared\n// recursive renderer, so pre/post extensions apply at this depth too.\nfunction ObjectControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n const obj = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n const subSchema: JsonSchemaObject = {\n type: \"object\",\n properties: field.objectProperties ?? {},\n ...(field.objectRequired ? { required: field.objectRequired } : {}),\n ...(Array.isArray(field.schema.allOf) ? { allOf: field.schema.allOf } : {}),\n };\n // No border/box: nested objects render as flat headed sections (see\n // ObjectSection in renderFieldRow) rather than progressively indented\n // sub-forms, so deep schemas stay readable as a single column.\n // A read-only object marks its whole subtree non-editable: recurse with\n // form-level readOnly on so child inputs are disabled (and any child the\n // schema marks readOnly still renders as a value span).\n return (\n <div className=\"space-y-2\">\n {renderObjectFields(subSchema, obj, (next) => field.onChange(next), {\n ...ctx,\n readOnly: ctx.readOnly || field.readOnly === true,\n depth: ctx.depth + 1,\n })}\n </div>\n );\n}\n\n// StringMapControl edits an object as key/value rows. Known properties (from the\n// schema) render first with derived value controls; unknown keys render as\n// editable key/value pairs. \"Add field\" appears when extra keys are allowed.\n// Values recurse through the shared pipeline, so a value that is itself an object\n// or array renders structurally and pre/post extensions apply to it.\nfunction StringMapControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n // A read-only map marks its whole subtree non-editable: no rename/remove/add\n // and value inputs disabled.\n const readOnly = ctx.readOnly || field.readOnly === true;\n const map = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n const known = field.knownProperties ?? {};\n const knownKeys = Object.keys(known);\n const extraKeys = Object.keys(map).filter((k) => !(k in known));\n const childCtx: RenderContext = { ...ctx, readOnly, depth: ctx.depth + 1 };\n\n function setEntry(key: string, next: unknown) {\n field.onChange({ ...map, [key]: next });\n }\n function renameEntry(oldKey: string, newKey: string) {\n if (newKey === oldKey) return;\n const next: Record<string, unknown> = {};\n for (const [k, v] of Object.entries(map)) next[k === oldKey ? newKey : k] = v;\n field.onChange(next);\n }\n function removeEntry(key: string) {\n const next = { ...map };\n delete next[key];\n field.onChange(next);\n }\n function addEntry() {\n if (\"\" in map) return;\n field.onChange({ ...map, \"\": \"\" });\n }\n\n function valueControlFor(key: string, valueSchema: JsonSchemaProperty): ReactNode {\n const nodes = renderFieldNodes(\n {\n key,\n prop: valueSchema,\n required: false,\n value: map[key] ?? \"\",\n onChange: (next) => setEntry(key, next),\n },\n childCtx,\n );\n return nodes?.value ?? null;\n }\n\n return (\n <div className=\"space-y-2 rounded-md border border-input p-2\">\n {knownKeys.map((key) => (\n <div key={`known-${key}`} className=\"grid grid-cols-[10rem_1fr] items-center gap-2\">\n <label htmlFor={fieldInputId(key)} className=\"truncate text-xs text-muted-foreground\" title={key}>\n {key}\n </label>\n <div className=\"min-w-0\">{valueControlFor(key, known[key] ?? { type: \"string\" })}</div>\n </div>\n ))}\n {extraKeys.map((key) => (\n <div key={`extra-${key}`} className=\"grid grid-cols-[10rem_1fr_auto] items-center gap-2\">\n <input\n type=\"text\"\n aria-label=\"Field name\"\n className={cn(inputClassName, \"h-8 font-mono text-xs\")}\n value={key}\n disabled={readOnly}\n onChange={(e) => renameEntry(key, e.target.value)}\n />\n <div className=\"min-w-0\">\n {valueControlFor(key, field.valueSchema ?? { type: \"string\" })}\n </div>\n {!readOnly && (\n <button\n type=\"button\"\n aria-label={`Remove ${key}`}\n className=\"inline-flex h-8 w-8 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground\"\n onClick={() => removeEntry(key)}\n >\n <Icon icon={UiTrash} className=\"text-sm\" />\n </button>\n )}\n </div>\n ))}\n {!readOnly && field.allowExtraKeys !== false && (\n <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={addEntry} className=\"gap-1.5\">\n <Icon icon={UiAdd} className=\"text-sm\" />\n Add field\n </Button>\n )}\n </div>\n );\n}\n\nfunction withSyntheticValue(\n options: { value: string; label: string }[],\n value: string,\n): { value: string; label: string }[] {\n if (!value || options.some((o) => o.value === value)) return options;\n return [{ value, label: value }, ...options];\n}\n\nfunction toText(value: unknown): string {\n if (value === undefined || value === null) return \"\";\n if (typeof value === \"object\") return \"\";\n return String(value);\n}\n\nfunction isPlainObject(value: unknown): value is Record<string, unknown> {\n return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\nexport function defaultPlaceholder(schema: JsonSchemaProperty): string {\n if (schema.default != null && typeof schema.default !== \"object\") return String(schema.default);\n return \"\";\n}\n"],"names":["jsxs","jsx","LabelIcon","ArrayControl","formatDateTimeRelative","DateTimePicker","cn","Combobox","renderObjectFields","renderFieldNodes","Icon","UiTrash","Button","UiAdd"],"mappings":";;;;;;;;;;;;;;AAkBO,MAAM,iBACX;AAMK,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,MAAI,OAAO,SAAS,UAAU;AAC5B,UAAM,gBAAgB,OAAO,iBAAiB;AAC9C,UAAM,gBAAgB,OAAO,iBAAiB;AAC9C,WACEA,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,qBAAqB,aAAa,aAAa,eAAe,aAAa,IAAA;AAAA,QAEpF,UAAA;AAAA,UAAAC,2BAAAA,IAAC,OAAA,EAAI,WAAU,qCAAqC,UAAA,OAAM;AAAA,UAC1DA,2BAAAA,IAAC,OAAA,EAAI,WAAU,WAAW,UAAA,OAAM;AAAA,UAC/B,UAAUA,2BAAAA,IAAC,KAAA,EAAE,WAAU,6CAA6C,UAAA,QAAO;AAAA,UAC3E,SAASA,2BAAAA,IAAC,KAAA,EAAE,WAAU,wCAAwC,UAAA,MAAA,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG3E;AACA,SACED,2BAAAA,KAAC,OAAA,EAAI,WAAU,eACZ,UAAA;AAAA,IAAA;AAAA,IACA;AAAA,IACA,UAAUC,2BAAAA,IAAC,KAAA,EAAE,WAAU,iCAAiC,UAAA,QAAO;AAAA,IAC/D,SAASA,2BAAAA,IAAC,KAAA,EAAE,WAAU,4BAA4B,UAAA,MAAA,CAAM;AAAA,EAAA,GAC3D;AAEJ;AAEO,SAAS,WAAW,EAAE,OAAO,WAAqD;AACvF,SACED,2BAAAA,KAAC,SAAA,EAAM,SAAS,SAAS,WAAU,+CACjC,UAAA;AAAA,IAAAC,2BAAAA,IAACC,KAAAA,WAAA,EAAU,MAAM,MAAM,WAAW,WAAU,qCAAoC;AAAA,IAChFD,2BAAAA,IAAC,QAAA,EAAK,OAAO,MAAM,UAAU,MAAM,MAAM,MAAM,MAAM,QAAY,UAAA,MAAM,MAAA,CAAM;AAAA,IAC5E,MAAM,YAAYA,2BAAAA,IAAC,QAAA,EAAK,WAAU,oBAAmB,UAAA,KAAC;AAAA,IACtD,MAAM,SACLA,2BAAAA,IAAC,UAAK,WAAU,wGACb,gBAAM,MAAA,CACT;AAAA,EAAA,GAEJ;AAEJ;AAEO,SAAS,aAAa,KAAqB;AAChD,SAAO,OAAO,IAAI,QAAQ,mBAAmB,GAAG,CAAC;AACnD;AAKO,SAAS,mBAAmB,OAAqB,KAA+B;AACrF,QAAM,UAAU,aAAa,MAAM,GAAG;AAMtC,MAAI,MAAM,YAAY,MAAM,SAAS,WAAW,MAAM,SAAS,YAAY,MAAM,SAAS,cAAc;AACtG,WAAOA,2BAAAA,IAAC,eAAA,EAAc,OAAc,QAAA,CAAkB;AAAA,EACxD;AACA,QAAM,WAAW,IAAI;AACrB,UAAQ,MAAM,MAAA;AAAA,IACZ,KAAK;AACH,aAAOA,2BAAAA,IAAC,aAAA,EAAY,OAAc,SAAkB,SAAA,CAAoB;AAAA,IAC1E,KAAK;AACH,aAAOA,2BAAAA,IAAC,gBAAA,EAAe,OAAc,SAAkB,SAAA,CAAoB;AAAA,IAC7E,KAAK;AACH,aAAOA,2BAAAA,IAAC,eAAA,EAAc,OAAc,SAAkB,SAAA,CAAoB;AAAA,IAC5E,KAAK;AACH,aAAOA,2BAAAA,IAAC,aAAA,EAAY,OAAc,SAAkB,SAAA,CAAoB;AAAA,IAC1E,KAAK;AACH,aAAOA,2BAAAA,IAACE,oBAAAA,cAAA,EAAa,OAAc,SAAkB,IAAA,CAAU;AAAA,IACjE,KAAK;AACH,aAAOF,2BAAAA,IAAC,eAAA,EAAc,OAAc,IAAA,CAAU;AAAA,IAChD,KAAK;AACH,aAAOA,2BAAAA,IAAC,kBAAA,EAAiB,OAAc,IAAA,CAAU;AAAA,IACnD;AACE,aAAOA,2BAAAA,IAAC,eAAA,EAAc,OAAc,SAAkB,SAAA,CAAoB;AAAA,EAAA;AAEhF;AAMA,SAAS,cAAc,EAAE,OAAO,WAAqD;AACnF,QAAM,OAAO,OAAO,MAAM,KAAK;AAC/B,QAAM,UAAU,MAAM,SAAS,UAAU,OAAOG,UAAAA,uBAAuB,IAAI,IAAI;AAC/E,SACEH,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,kBAAc;AAAA,MACd,qBAAiB;AAAA,MACjB,WAAU;AAAA,MACV,OAAO,QAAQ;AAAA,MAEd,UAAA,WAAWA,2BAAAA,IAAC,QAAA,EAAK,WAAU,yBAAwB,UAAA,IAAA,CAAC;AAAA,IAAA;AAAA,EAAA;AAG3D;AAEA,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,kBAAc;AAAA,MACd,WAAW;AAAA,MACX,OAAO,OAAO,MAAM,KAAK;AAAA,MACzB,UAAU;AAAA,MACV,aAAa,mBAAmB,MAAM,MAAM;AAAA,MAC5C,UAAU,CAAC,MAAM,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EAAA;AAGpD;AAEA,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AAGD,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,WAAU;AAAA,MACV,kBAAc;AAAA,MACd,WAAW;AAAA,MACX,OAAO,OAAO,MAAM,KAAK;AAAA,MACzB,UAAU;AAAA,MACV,aAAa,mBAAmB,MAAM,MAAM;AAAA,MAC5C,UAAU,CAAC,MAAM;AACf,cAAM,MAAM,EAAE,OAAO;AACrB,cAAM,SAAS,MAAM,iBAAiB;AACtC,YAAI,UAAU,IAAI,WAAW,MAAM,OAAO,SAAS,OAAO,GAAG,CAAC,GAAG;AAC/D,gBAAM,SAAS,OAAO,GAAG,CAAC;AAAA,QAC5B,OAAO;AACL,gBAAM,SAAS,GAAG;AAAA,QACpB;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;AAMA,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,OAAO,OAAO,MAAM,KAAK;AAC/B,MAAI,UAAU;AACZ,WACEA,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,QACJ,kBAAc;AAAA,QACd,WAAU;AAAA,QACV,OAAO,QAAQ;AAAA,QAEd,UAAA,OAAOG,iCAAuB,IAAI,mCAAK,QAAA,EAAK,WAAU,yBAAwB,UAAA,IAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGtF;AACA,SACEH,2BAAAA;AAAAA,IAACI,eAAAA;AAAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,cAAY,MAAM;AAAA,MAClB,kBAAc;AAAA,MACd,gBAAgBC,MAAAA,GAAG,gBAAgB,MAAM;AAAA,MACzC,OAAO;AAAA,MACP,UAAU,CAAC,SAAS,MAAM,SAAS,IAAI;AAAA,MACvC,aAAa,mBAAmB,MAAM,MAAM;AAAA,IAAA;AAAA,EAAA;AAGlD;AAEA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AAID,MAAI,OAAO,MAAM,UAAU,aAAa,MAAM,UAAU,UAAa,MAAM,UAAU,MAAM;AACzF,WACEL,2BAAAA,IAAC,OAAA,EAAI,WAAU,yBACb,UAAAA,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,QACJ,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM,UAAU;AAAA,QACzB,UAAU;AAAA,QACV,UAAU,CAAC,MAAM,MAAM,SAAS,EAAE,OAAO,OAAO;AAAA,MAAA;AAAA,IAAA,GAEpD;AAAA,EAEJ;AACA,SAAOA,2BAAAA,IAAC,eAAA,EAAc,OAAc,SAAkB,SAAA,CAAoB;AAC5E;AAEA,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,QAAQ,OAAO,MAAM,KAAK;AAChC,QAAM,UAAU,mBAAmB,MAAM,WAAW,CAAA,GAAI,KAAK;AAC7D,MAAI,MAAM,YAAY,SAAS;AAC7B,0CAAQ,mBAAA,EAAkB,OAAc,SAAkB,UAAoB,SAAkB,OAAc;AAAA,EAChH;AACA,SACEA,2BAAAA;AAAAA,IAACM,SAAAA;AAAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,kBAAkB,MAAM,oBAAoB;AAAA,MAC5C,UAAU,CAAC,MAAM,MAAM,SAAS,CAAC;AAAA,MAChC,GAAI,mBAAmB,MAAM,MAAM,IAAI,EAAE,aAAa,mBAAmB,MAAM,MAAM,MAAM,CAAA;AAAA,IAAC;AAAA,EAAA;AAGnG;AAMA,SAAS,kBAAkB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,SACEN,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY,MAAM;AAAA,MAClB,IAAI;AAAA,MACJ,kBAAc;AAAA,MACd,WAAU;AAAA,MAET,UAAA,QAAQ,IAAI,CAAC,QAAQ;AACpB,cAAM,UAAU,IAAI,UAAU;AAC9B,eACED,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAWM,MAAAA;AAAAA,cACT;AAAA,cACA,UACI,uCACA;AAAA,cACJ,YAAY;AAAA,YAAA;AAAA,YAGd,UAAA;AAAA,cAAAL,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,MAAM;AAAA,kBACN,WAAU;AAAA,kBACV,OAAO,IAAI;AAAA,kBACX;AAAA,kBACA,UAAU;AAAA,kBACV,UAAU,MAAM,MAAM,SAAS,IAAI,KAAK;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEzC,IAAI;AAAA,YAAA;AAAA,UAAA;AAAA,UAlBA,IAAI;AAAA,QAAA;AAAA,MAqBf,CAAC;AAAA,IAAA;AAAA,EAAA;AAGP;AAKA,SAAS,cAAc,EAAE,OAAO,OAAoD;AAClF,QAAM,MAAM,cAAc,MAAM,KAAK,IAAK,MAAM,QAAoC,CAAA;AACpF,QAAM,YAA8B;AAAA,IAElC,YAAY,MAAM,oBAAoB,CAAA;AAAA,IACtC,GAAI,MAAM,iBAAiB,EAAE,UAAU,MAAM,eAAA,IAAmB,CAAA;AAAA,IAChE,GAAI,MAAM,QAAQ,MAAM,OAAO,KAAK,IAAI,EAAE,OAAO,MAAM,OAAO,MAAA,IAAU,CAAA;AAAA,EAAC;AAQ3E,SACEA,2BAAAA,IAAC,OAAA,EAAI,WAAU,aACZ,UAAAO,qBAAAA,mBAAmB,WAAW,KAAK,CAAC,SAAS,MAAM,SAAS,IAAI,GAAG;AAAA,IAClE,GAAG;AAAA,IACH,UAAU,IAAI,YAAY,MAAM,aAAa;AAAA,IAC7C,OAAO,IAAI,QAAQ;AAAA,EAAA,CACpB,GACH;AAEJ;AAOA,SAAS,iBAAiB,EAAE,OAAO,OAAoD;AAGrF,QAAM,WAAW,IAAI,YAAY,MAAM,aAAa;AACpD,QAAM,MAAM,cAAc,MAAM,KAAK,IAAK,MAAM,QAAoC,CAAA;AACpF,QAAM,QAAQ,MAAM,mBAAmB,CAAA;AACvC,QAAM,YAAY,OAAO,KAAK,KAAK;AACnC,QAAM,YAAY,OAAO,KAAK,GAAG,EAAE,OAAO,CAAC,MAAM,EAAE,KAAK,MAAM;AAC9D,QAAM,WAA0B,EAAE,GAAG,KAAK,UAAU,OAAO,IAAI,QAAQ,EAAA;AAEvE,WAAS,SAAS,KAAa,MAAe;AAC5C,UAAM,SAAS,EAAE,GAAG,KAAK,CAAC,GAAG,GAAG,MAAM;AAAA,EACxC;AACA,WAAS,YAAY,QAAgB,QAAgB;AACnD,QAAI,WAAW,OAAQ;AACvB,UAAM,OAAgC,CAAA;AACtC,eAAW,CAAC,GAAG,CAAC,KAAK,OAAO,QAAQ,GAAG,EAAG,MAAK,MAAM,SAAS,SAAS,CAAC,IAAI;AAC5E,UAAM,SAAS,IAAI;AAAA,EACrB;AACA,WAAS,YAAY,KAAa;AAChC,UAAM,OAAO,EAAE,GAAG,IAAA;AAClB,WAAO,KAAK,GAAG;AACf,UAAM,SAAS,IAAI;AAAA,EACrB;AACA,WAAS,WAAW;AAClB,QAAI,MAAM,IAAK;AACf,UAAM,SAAS,EAAE,GAAG,KAAK,IAAI,IAAI;AAAA,EACnC;AAEA,WAAS,gBAAgB,KAAa,aAA4C;AAChF,UAAM,QAAQC,qBAAAA;AAAAA,MACZ;AAAA,QACE;AAAA,QACA,MAAM;AAAA,QACN,UAAU;AAAA,QACV,OAAO,IAAI,GAAG,KAAK;AAAA,QACnB,UAAU,CAAC,SAAS,SAAS,KAAK,IAAI;AAAA,MAAA;AAAA,MAExC;AAAA,IAAA;AAEF,YAAO,+BAAO,UAAS;AAAA,EACzB;AAEA,SACET,2BAAAA,KAAC,OAAA,EAAI,WAAU,gDACZ,UAAA;AAAA,IAAA,UAAU,IAAI,CAAC,QACdA,2BAAAA,KAAC,OAAA,EAAyB,WAAU,iDAClC,UAAA;AAAA,MAAAC,2BAAAA,IAAC,SAAA,EAAM,SAAS,aAAa,GAAG,GAAG,WAAU,0CAAyC,OAAO,KAC1F,UAAA,IAAA,CACH;AAAA,MACAA,2BAAAA,IAAC,OAAA,EAAI,WAAU,WAAW,UAAA,gBAAgB,KAAK,MAAM,GAAG,KAAK,EAAE,MAAM,SAAA,CAAU,EAAA,CAAE;AAAA,IAAA,EAAA,GAJzE,SAAS,GAAG,EAKtB,CACD;AAAA,IACA,UAAU,IAAI,CAAC,QACdD,2BAAAA,KAAC,OAAA,EAAyB,WAAU,sDAClC,UAAA;AAAA,MAAAC,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAW;AAAA,UACX,WAAWK,MAAAA,GAAG,gBAAgB,uBAAuB;AAAA,UACrD,OAAO;AAAA,UACP,UAAU;AAAA,UACV,UAAU,CAAC,MAAM,YAAY,KAAK,EAAE,OAAO,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAElDL,2BAAAA,IAAC,OAAA,EAAI,WAAU,WACZ,UAAA,gBAAgB,KAAK,MAAM,eAAe,EAAE,MAAM,SAAA,CAAU,EAAA,CAC/D;AAAA,MACC,CAAC,YACAA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAY,UAAU,GAAG;AAAA,UACzB,WAAU;AAAA,UACV,SAAS,MAAM,YAAY,GAAG;AAAA,UAE9B,UAAAA,2BAAAA,IAACS,WAAA,EAAK,MAAMC,QAAAA,SAAS,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAC3C,EAAA,GApBM,SAAS,GAAG,EAsBtB,CACD;AAAA,IACA,CAAC,YAAY,MAAM,mBAAmB,yCACpCC,OAAAA,QAAA,EAAO,MAAK,UAAS,SAAQ,WAAU,MAAK,MAAK,SAAS,UAAU,WAAU,WAC7E,UAAA;AAAA,MAAAX,2BAAAA,IAACS,KAAAA,MAAA,EAAK,MAAMG,MAAAA,OAAO,WAAU,WAAU;AAAA,MAAE;AAAA,IAAA,EAAA,CAE3C;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAAS,mBACP,SACA,OACoC;AACpC,MAAI,CAAC,SAAS,QAAQ,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,EAAG,QAAO;AAC7D,SAAO,CAAC,EAAE,OAAO,OAAO,MAAA,GAAS,GAAG,OAAO;AAC7C;AAEA,SAAS,OAAO,OAAwB;AACtC,MAAI,UAAU,UAAa,UAAU,KAAM,QAAO;AAClD,MAAI,OAAO,UAAU,SAAU,QAAO;AACtC,SAAO,OAAO,KAAK;AACrB;AAEA,SAAS,cAAc,OAAkD;AACvE,SAAO,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC5E;AAEO,SAAS,mBAAmB,QAAoC;AACrE,MAAI,OAAO,WAAW,QAAQ,OAAO,OAAO,YAAY,SAAU,QAAO,OAAO,OAAO,OAAO;AAC9F,SAAO;AACT;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"json-schema-form-fields.cjs","sources":["../../src/components/json-schema-form-fields.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, LabelIcon } from \"../data/Icon\";\nimport { formatDateTimeRelative } from \"../data/cells/Timestamp\";\nimport { UiAdd, UiTrash } from \"../icons\";\nimport { Button } from \"./button\";\nimport { Combobox } from \"./Combobox\";\nimport { DateTimePicker } from \"./DateTimePicker\";\nimport { ArrayControl } from \"./json-schema-form-array\";\nimport { renderFieldNodes, renderObjectFields, type RenderContext } from \"./json-schema-form-render\";\nimport type {\n FieldControl,\n FieldOption,\n FormLayout,\n JsonSchemaObject,\n JsonSchemaProperty,\n} from \"./json-schema-form-types\";\nimport {\n controlHeightClass,\n controlMinHeightClass,\n fieldInnerGapClass,\n inputSizeClass,\n labelSizeClass,\n stackedRowGapClass,\n type FormSize,\n} from \"./json-schema-form-size\";\n\n// Non-size styling shared by every text-like input box; the size token supplies\n// height, horizontal padding, and text size (see inputSizeClass).\nconst INPUT_BASE =\n \"w-full min-w-0 rounded-md border border-input bg-background text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:bg-muted/40 focus-visible:ring-2 focus-visible:ring-ring\";\n\nexport function inputClass(size: FormSize): string {\n return cn(INPUT_BASE, inputSizeClass[size]);\n}\n\n// FieldWrapper lays out a label + value (+ helper/error) either inline (2-col)\n// or stacked, mirroring the convention used elsewhere in the library. In inline\n// mode the label column shrinks to fit its content but is capped/truncated at\n// labelMaxWidth, and the value column is capped at valueMaxWidth (see\n// FormLayout); the grid template is set inline because Tailwind can't\n// interpolate runtime widths.\nexport function FieldWrapper({\n label,\n value,\n helper,\n error,\n layout,\n size,\n}: {\n label: ReactNode;\n value: ReactNode;\n helper?: ReactNode;\n error?: ReactNode;\n layout: FormLayout;\n size: FormSize;\n}) {\n if (layout.mode === \"inline\") {\n const labelMaxWidth = layout.labelMaxWidth ?? \"40ch\";\n const valueMaxWidth = layout.valueMaxWidth ?? \"600px\";\n return (\n <div\n className=\"grid items-start gap-x-3 gap-y-0.5\"\n style={{\n gridTemplateColumns: `minmax(0, min(${labelMaxWidth}, max-content)) minmax(0, ${valueMaxWidth})`,\n }}\n >\n <div className={cn(\"flex min-w-0 items-center\", controlMinHeightClass[size])}>{label}</div>\n <div className=\"min-w-0\">{value}</div>\n {helper && <p className=\"col-start-2 text-xs text-muted-foreground\">{helper}</p>}\n {error && <p className=\"col-start-2 text-xs text-destructive\">{error}</p>}\n </div>\n );\n }\n return (\n <div className={cn(\"flex flex-col\", fieldInnerGapClass[size])}>\n {label}\n {value}\n {helper && <p className=\"text-xs text-muted-foreground\">{helper}</p>}\n {error && <p className=\"text-xs text-destructive\">{error}</p>}\n </div>\n );\n}\n\nexport function FieldLabel({ field, fieldId, size }: { field: FieldControl; fieldId: string; size: FormSize }) {\n return (\n <label htmlFor={fieldId} className={cn(\"flex min-w-0 items-center gap-2 font-medium\", labelSizeClass[size])}>\n <LabelIcon icon={field.labelIcon} className=\"shrink-0 text-[15px] text-muted-foreground\" />\n <span className=\"truncate\" title={field.label !== field.key ? field.key : undefined}>\n {field.label}\n </span>\n {field.required && <span className=\"shrink-0 text-destructive\">*</span>}\n {field.badge && (\n <span className=\"shrink-0 rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-muted-foreground\">\n {field.badge}\n </span>\n )}\n </label>\n );\n}\n\nexport function fieldInputId(key: string, prefix?: string): string {\n const safe = key.replace(/[^a-zA-Z0-9_-]/g, \"_\");\n return prefix ? `jsf-${prefix}-${safe}` : `jsf-${safe}`;\n}\n\n// renderValueControl produces just the value node for a field, dispatching on\n// its resolved kind. The RenderContext carries readOnly + the pre/post stacks so\n// container controls (array/object/map) can recurse with full context.\nexport function renderValueControl(field: FieldControl, ctx: RenderContext): ReactNode {\n const fieldId = fieldInputId(field.key, ctx.idPrefix);\n // A field the schema marks `readOnly` is never editable: it shows its current\n // value as plain text, not a disabled input. (The form-level ctx.readOnly,\n // below, instead disables the real controls so the structure stays visible.)\n // Containers (array/object/map) still render structurally so nested read-only\n // values surface; their own children resolve their own readOnly.\n if (field.readOnly && field.kind !== \"array\" && field.kind !== \"object\" && field.kind !== \"string-map\") {\n return <ReadOnlyValue field={field} fieldId={fieldId} size={ctx.size} />;\n }\n const readOnly = ctx.readOnly;\n const size = ctx.size;\n switch (field.kind) {\n case \"enum\":\n return <EnumControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n case \"boolean\":\n return <BooleanControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n case \"number\":\n return <NumberControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n case \"date\":\n return <DateControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n case \"array\":\n return <ArrayControl field={field} fieldId={fieldId} ctx={ctx} />;\n case \"object\":\n return <ObjectControl field={field} ctx={ctx} />;\n case \"string-map\":\n return <StringMapControl field={field} ctx={ctx} />;\n default:\n return <StringControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n }\n}\n\n// ReadOnlyValue renders a `readOnly` field's current value as static text — no\n// input, no border, just the value (date/date-time formatted human-readably).\n// An empty value shows an em-dash. Carries the same id + data-jsf-input as the\n// editable controls so layout and queries stay uniform.\nfunction ReadOnlyValue({ field, fieldId, size }: { field: FieldControl; fieldId: string; size: FormSize }) {\n const text = toText(field.value);\n const display = field.kind === \"date\" && text ? formatDateTimeRelative(text) : text;\n return (\n <span\n id={fieldId}\n data-jsf-input\n data-jsf-readonly\n className={cn(\"flex items-center text-foreground\", controlHeightClass[size], labelSizeClass[size])}\n title={text || undefined}\n >\n {display || <span className=\"text-muted-foreground\">—</span>}\n </span>\n );\n}\n\nfunction StringControl({\n field,\n fieldId,\n readOnly,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n size: FormSize;\n}) {\n return (\n <input\n id={fieldId}\n type=\"text\"\n data-jsf-input\n className={inputClass(size)}\n value={toText(field.value)}\n disabled={readOnly}\n placeholder={defaultPlaceholder(field.schema)}\n onChange={(e) => field.onChange(e.target.value)}\n />\n );\n}\n\nfunction NumberControl({\n field,\n fieldId,\n readOnly,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n size: FormSize;\n}) {\n // type=\"text\" (not number) so non-numeric values a consumer permits — e.g.\n // template tokens — are not silently dropped by the browser.\n return (\n <input\n id={fieldId}\n type=\"text\"\n inputMode=\"decimal\"\n data-jsf-input\n className={inputClass(size)}\n value={toText(field.value)}\n disabled={readOnly}\n placeholder={defaultPlaceholder(field.schema)}\n onChange={(e) => {\n const raw = e.target.value;\n const coerce = field.coerceNumber !== false;\n if (coerce && raw.trim() !== \"\" && Number.isFinite(Number(raw))) {\n field.onChange(Number(raw));\n } else {\n field.onChange(raw);\n }\n }}\n />\n );\n}\n\n// DateControl edits a `format: date`/`date-time` string. Read-only, it shows the\n// human-readable absolute + relative form (e.g. \"Apr 15, 2026, 12:00 PM (2h\n// ago)\"); editable, a DateTimePicker. The raw string is committed unchanged so a\n// consumer-permitted template token in the field is preserved.\nfunction DateControl({\n field,\n fieldId,\n readOnly,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n size: FormSize;\n}) {\n const text = toText(field.value);\n if (readOnly) {\n return (\n <div\n id={fieldId}\n data-jsf-input\n className={cn(\"flex items-center text-foreground\", controlHeightClass[size], labelSizeClass[size])}\n title={text || undefined}\n >\n {text ? formatDateTimeRelative(text) : <span className=\"text-muted-foreground\">—</span>}\n </div>\n );\n }\n return (\n <DateTimePicker\n id={fieldId}\n aria-label={field.label}\n data-jsf-input\n inputClassName={cn(inputClass(size), \"pr-8\")}\n value={text}\n onChange={(next) => field.onChange(next)}\n placeholder={defaultPlaceholder(field.schema)}\n />\n );\n}\n\nfunction BooleanControl({\n field,\n fieldId,\n readOnly,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n size: FormSize;\n}) {\n // Only render a checkbox when the value is genuinely boolean (or unset).\n // A non-boolean value (e.g. a token a consumer left in place) renders as text\n // so it is preserved and editable.\n if (typeof field.value === \"boolean\" || field.value === undefined || field.value === null) {\n return (\n <div className={cn(\"flex items-center\", controlHeightClass[size])}>\n <input\n id={fieldId}\n type=\"checkbox\"\n className=\"h-4 w-4 accent-primary\"\n checked={field.value === true}\n disabled={readOnly}\n onChange={(e) => field.onChange(e.target.checked)}\n />\n </div>\n );\n }\n return <StringControl field={field} fieldId={fieldId} readOnly={readOnly} size={size} />;\n}\n\nfunction EnumControl({\n field,\n fieldId,\n readOnly,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n size: FormSize;\n}) {\n const value = toText(field.value);\n const options = withSyntheticValue(field.options ?? [], value);\n if (field.display === \"radio\") {\n return (\n <RadioGroupControl field={field} fieldId={fieldId} readOnly={readOnly} options={options} value={value} size={size} />\n );\n }\n return (\n <Combobox\n id={fieldId}\n options={options}\n value={value}\n disabled={readOnly}\n size={size}\n allowCustomValue={field.allowCustomValue ?? false}\n onChange={(v) => field.onChange(v)}\n {...(defaultPlaceholder(field.schema) ? { placeholder: defaultPlaceholder(field.schema) } : {})}\n />\n );\n}\n\n// RadioGroupControl renders a small fixed enum as a segmented radio-button group\n// instead of a dropdown. It shares EnumControl's option list (any out-of-enum\n// value is already prepended, so a token still shows). One `radiogroup` role +\n// native radios keep it keyboard-navigable; the visible chip is a styled label.\nfunction RadioGroupControl({\n field,\n fieldId,\n readOnly,\n options,\n value,\n size,\n}: {\n field: FieldControl;\n fieldId: string;\n readOnly: boolean;\n options: FieldOption[];\n value: string;\n size: FormSize;\n}) {\n return (\n <div\n role=\"radiogroup\"\n aria-label={field.label}\n id={fieldId}\n data-jsf-input\n className=\"inline-flex flex-wrap items-center gap-1 rounded-md border border-input bg-background p-0.5\"\n >\n {options.map((opt) => {\n const checked = opt.value === value;\n return (\n <label\n key={opt.value}\n className={cn(\n \"inline-flex cursor-pointer select-none items-center rounded px-2.5 py-1\",\n labelSizeClass[size],\n checked\n ? \"bg-primary text-primary-foreground\"\n : \"text-muted-foreground hover:bg-accent hover:text-foreground\",\n readOnly && \"cursor-not-allowed opacity-60\",\n )}\n >\n <input\n type=\"radio\"\n name={fieldId}\n className=\"sr-only\"\n value={opt.value}\n checked={checked}\n disabled={readOnly}\n onChange={() => field.onChange(opt.value)}\n />\n {opt.label}\n </label>\n );\n })}\n </div>\n );\n}\n\n// ObjectControl renders a nested structured object as a sub-form: its own\n// properties, required markers, if/then, soft errors — all via the shared\n// recursive renderer, so pre/post extensions apply at this depth too.\nfunction ObjectControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n const obj = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n const subSchema: JsonSchemaObject = {\n type: \"object\",\n properties: field.objectProperties ?? {},\n ...(field.objectRequired ? { required: field.objectRequired } : {}),\n ...(Array.isArray(field.schema.allOf) ? { allOf: field.schema.allOf } : {}),\n };\n // No border/box: nested objects render as flat headed sections (see\n // ObjectSection in renderFieldRow) rather than progressively indented\n // sub-forms, so deep schemas stay readable as a single column.\n // A read-only object marks its whole subtree non-editable: recurse with\n // form-level readOnly on so child inputs are disabled (and any child the\n // schema marks readOnly still renders as a value span).\n return (\n <div className={cn(\"grid\", stackedRowGapClass[ctx.size])}>\n {renderObjectFields(subSchema, obj, (next) => field.onChange(next), {\n ...ctx,\n readOnly: ctx.readOnly || field.readOnly === true,\n depth: ctx.depth + 1,\n })}\n </div>\n );\n}\n\n// StringMapControl edits an object as key/value rows. Known properties (from the\n// schema) render first with derived value controls; unknown keys render as\n// editable key/value pairs. \"Add field\" appears when extra keys are allowed.\n// Values recurse through the shared pipeline, so a value that is itself an object\n// or array renders structurally and pre/post extensions apply to it.\nfunction StringMapControl({ field, ctx }: { field: FieldControl; ctx: RenderContext }) {\n // A read-only map marks its whole subtree non-editable: no rename/remove/add\n // and value inputs disabled.\n const readOnly = ctx.readOnly || field.readOnly === true;\n const map = isPlainObject(field.value) ? (field.value as Record<string, unknown>) : {};\n const known = field.knownProperties ?? {};\n const knownKeys = Object.keys(known);\n const extraKeys = Object.keys(map).filter((k) => !(k in known));\n const childCtx: RenderContext = { ...ctx, readOnly, depth: ctx.depth + 1 };\n\n // valueSchemaForKey picks an entry's value schema: the first patternProperties\n // entry whose regex matches the key, else the `additionalProperties` schema,\n // else a bare string. Lets the value form vary by key (e.g. House vs Apartment).\n function valueSchemaForKey(key: string): JsonSchemaProperty {\n for (const { pattern, schema } of field.valuePatternSchemas ?? []) {\n let re: RegExp | undefined;\n try {\n re = new RegExp(pattern);\n } catch {\n re = undefined; // a malformed pattern simply never matches\n }\n if (re?.test(key)) return schema;\n }\n return field.valueSchema ?? { type: \"string\" };\n }\n\n // When the entry value opts into a stacked layout (`x-layout: \"stack\"`), the\n // key+value render as one full-width stacked unit instead of a key column\n // beside the value. Resolved per key, since pattern schemas may differ.\n function entryIsStacked(key: string): boolean {\n return valueSchemaForKey(key)[\"x-layout\"] === \"stack\";\n }\n\n function setEntry(key: string, next: unknown) {\n field.onChange({ ...map, [key]: next });\n }\n function renameEntry(oldKey: string, newKey: string) {\n if (newKey === oldKey) return;\n const next: Record<string, unknown> = {};\n for (const [k, v] of Object.entries(map)) next[k === oldKey ? newKey : k] = v;\n field.onChange(next);\n }\n function removeEntry(key: string) {\n const next = { ...map };\n delete next[key];\n field.onChange(next);\n }\n function addEntry() {\n if (\"\" in map) return;\n field.onChange({ ...map, \"\": \"\" });\n }\n\n function valueControlFor(key: string, valueSchema: JsonSchemaProperty): ReactNode {\n const nodes = renderFieldNodes(\n {\n key,\n prop: valueSchema,\n required: false,\n value: map[key] ?? \"\",\n onChange: (next) => setEntry(key, next),\n },\n childCtx,\n );\n return nodes?.value ?? null;\n }\n\n // valueControlForKey resolves the per-key value schema (patternProperties /\n // additionalProperties) before rendering, so the form varies by key.\n function valueControlForKey(key: string): ReactNode {\n return valueControlFor(key, valueSchemaForKey(key));\n }\n\n return (\n <div className={cn(\"flex flex-col rounded-md border border-input p-2\", fieldInnerGapClass[childCtx.size])}>\n {knownKeys.map((key) => (\n <div key={`known-${key}`} className=\"grid grid-cols-[10rem_1fr] items-center gap-2\">\n <label htmlFor={fieldInputId(key, childCtx.idPrefix)} className=\"truncate text-xs text-muted-foreground\" title={key}>\n {key}\n </label>\n <div className=\"min-w-0\">{valueControlFor(key, known[key] ?? { type: \"string\" })}</div>\n </div>\n ))}\n {extraKeys.map((key) => {\n const keyControl = field.keyOptions ? (\n <Combobox\n options={keyPickerOptions(field.keyOptions, extraKeys, key)}\n value={key}\n disabled={readOnly}\n size={childCtx.size}\n allowCustomValue={false}\n onChange={(next) => renameEntry(key, next)}\n placeholder=\"Select…\"\n />\n ) : (\n <input\n type=\"text\"\n aria-label=\"Field name\"\n className={cn(inputClass(childCtx.size), \"font-mono\")}\n value={key}\n disabled={readOnly}\n onChange={(e) => renameEntry(key, e.target.value)}\n />\n );\n const removeButton = !readOnly ? (\n <button\n type=\"button\"\n aria-label={`Remove ${key}`}\n className=\"inline-flex h-8 w-8 shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-accent hover:text-foreground\"\n onClick={() => removeEntry(key)}\n >\n <Icon icon={UiTrash} className=\"text-sm\" />\n </button>\n ) : null;\n // When the value is stacked (`x-layout: \"stack\"` on the entry schema),\n // the key joins the stack: it sits full-width above its value as one\n // unit, rather than cramped in a fixed key column beside it.\n if (entryIsStacked(key)) {\n return (\n <div key={`extra-${key}`} className=\"space-y-1.5 rounded-md border border-input p-2\">\n <div className=\"flex items-center gap-2\">\n <div className=\"min-w-0 flex-1\">{keyControl}</div>\n {removeButton}\n </div>\n <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n </div>\n );\n }\n return (\n <div key={`extra-${key}`} className=\"grid grid-cols-[10rem_1fr_auto] items-center gap-2\">\n {keyControl}\n <div className=\"min-w-0\">{valueControlForKey(key)}</div>\n {removeButton}\n </div>\n );\n })}\n {!readOnly && field.allowExtraKeys !== false && (\n <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={addEntry} className=\"gap-1.5\">\n <Icon icon={UiAdd} className=\"text-sm\" />\n Add field\n </Button>\n )}\n </div>\n );\n}\n\nfunction withSyntheticValue(\n options: { value: string; label: string }[],\n value: string,\n): { value: string; label: string }[] {\n if (!value || options.some((o) => o.value === value)) return options;\n return [{ value, label: value }, ...options];\n}\n\n// keyPickerOptions narrows the map-key enum to keys not already used by another\n// entry, while always keeping this row's current key so it stays selectable.\nfunction keyPickerOptions(\n options: FieldOption[],\n usedKeys: string[],\n currentKey: string,\n): FieldOption[] {\n const taken = new Set(usedKeys.filter((k) => k !== currentKey));\n return options.filter((o) => !taken.has(o.value));\n}\n\nfunction toText(value: unknown): string {\n if (value === undefined || value === null) return \"\";\n if (typeof value === \"object\") return \"\";\n return String(value);\n}\n\nfunction isPlainObject(value: unknown): value is Record<string, unknown> {\n return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\nexport function defaultPlaceholder(schema: JsonSchemaProperty): string {\n if (schema.default != null && typeof schema.default !== \"object\") return String(schema.default);\n return \"\";\n}\n"],"names":["cn","inputSizeClass","jsxs","jsx","controlMinHeightClass","fieldInnerGapClass","labelSizeClass","LabelIcon","ArrayControl","formatDateTimeRelative","controlHeightClass","DateTimePicker","Combobox","stackedRowGapClass","renderObjectFields","renderFieldNodes","Icon","UiTrash","Button","UiAdd"],"mappings":"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"}
|
|
@@ -1,19 +1,22 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
import { RenderContext } from './json-schema-form-render';
|
|
3
3
|
import { FieldControl, FormLayout, JsonSchemaProperty } from './json-schema-form-types';
|
|
4
|
-
|
|
5
|
-
export declare function
|
|
4
|
+
import { FormSize } from './json-schema-form-size';
|
|
5
|
+
export declare function inputClass(size: FormSize): string;
|
|
6
|
+
export declare function FieldWrapper({ label, value, helper, error, layout, size, }: {
|
|
6
7
|
label: ReactNode;
|
|
7
8
|
value: ReactNode;
|
|
8
9
|
helper?: ReactNode;
|
|
9
10
|
error?: ReactNode;
|
|
10
11
|
layout: FormLayout;
|
|
12
|
+
size: FormSize;
|
|
11
13
|
}): import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
export declare function FieldLabel({ field, fieldId }: {
|
|
14
|
+
export declare function FieldLabel({ field, fieldId, size }: {
|
|
13
15
|
field: FieldControl;
|
|
14
16
|
fieldId: string;
|
|
17
|
+
size: FormSize;
|
|
15
18
|
}): import("react/jsx-runtime").JSX.Element;
|
|
16
|
-
export declare function fieldInputId(key: string): string;
|
|
19
|
+
export declare function fieldInputId(key: string, prefix?: string): string;
|
|
17
20
|
export declare function renderValueControl(field: FieldControl, ctx: RenderContext): ReactNode;
|
|
18
21
|
export declare function defaultPlaceholder(schema: JsonSchemaProperty): string;
|
|
19
22
|
//# sourceMappingURL=json-schema-form-fields.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json-schema-form-fields.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-fields.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC,OAAO,EAAwC,KAAK,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACrG,OAAO,KAAK,EACV,YAAY,EAEZ,UAAU,EAEV,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"json-schema-form-fields.d.ts","sourceRoot":"","sources":["../../src/components/json-schema-form-fields.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC,OAAO,EAAwC,KAAK,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACrG,OAAO,KAAK,EACV,YAAY,EAEZ,UAAU,EAEV,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAOL,KAAK,QAAQ,EACd,MAAM,yBAAyB,CAAC;AAOjC,wBAAgB,UAAU,CAAC,IAAI,EAAE,QAAQ,GAAG,MAAM,CAEjD;AAQD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAK,EACL,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,GACL,EAAE;IACD,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,EAAE,UAAU,CAAC;IACnB,IAAI,EAAE,QAAQ,CAAC;CAChB,2CA0BA;AAED,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE;IAAE,KAAK,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAE,2CAe5G;AAED,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAGjE;AAKD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,aAAa,GAAG,SAAS,CA8BrF;AAocD,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CAGrE"}
|