camox 0.76.0 → 0.76.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/dist/core/editing/createEditableBlock.js +1077 -1681
  2. package/dist/core/editing/fieldSlot.js +251 -0
  3. package/dist/core/editing/useFieldSlot.js +159 -0
  4. package/dist/core/layoutContext.d.ts +2 -0
  5. package/dist/core/layoutContext.js +27 -1
  6. package/dist/features/canvas/CanvasPageFrame.js +2 -2
  7. package/dist/features/canvas/CanvasPreviewPageSlot.js +1 -1
  8. package/dist/features/canvas/canvasCameraController.js +595 -0
  9. package/dist/features/canvas/useCanvasCamera.js +141 -587
  10. package/dist/features/canvas/useCanvasFrame.js +1 -1
  11. package/dist/features/page/DerivedPageContent.js +4 -8
  12. package/dist/features/preview/components/AssetLightbox.js +6 -65
  13. package/dist/features/preview/components/CanvasPreview.js +2 -2
  14. package/dist/features/preview/components/Frame.js +3 -3
  15. package/dist/features/preview/components/ItemFieldsEditor.js +376 -460
  16. package/dist/features/preview/components/Overlays.js +4 -9
  17. package/dist/features/preview/components/PreviewPanel.js +3 -3
  18. package/dist/features/preview/components/RemovedBlockPlaceholder.js +2 -2
  19. package/dist/features/preview/components/SelectionEditor.js +285 -339
  20. package/dist/features/preview/components/ZoomableImage.js +105 -0
  21. package/dist/features/preview/components/contentFieldSchema.js +3 -1
  22. package/dist/features/preview/components/useFieldWriter.js +30 -51
  23. package/dist/features/preview/components/useRecordView.js +3 -3
  24. package/dist/features/preview/overlayMessages.js +20 -58
  25. package/dist/features/preview/previewStore.js +6 -123
  26. package/dist/features/preview/repeatableItemPath.js +47 -0
  27. package/dist/features/renderer/RendererApp.js +6 -6
  28. package/dist/features/renderer/RendererFrames.js +2 -2
  29. package/dist/features/renderer/rendererHost.js +1 -1
  30. package/dist/features/routes/pageRuntime.d.ts +2 -8
  31. package/dist/features/routes/pageRuntime.js +21 -105
  32. package/dist/features/runtime/pageApp.js +1 -1
  33. package/dist/features/runtime/pageRead.js +105 -0
  34. package/dist/features/runtime/reader.d.ts +25 -0
  35. package/dist/features/runtime/reader.js +142 -0
  36. package/dist/features/runtime/runtime.d.ts +9 -3
  37. package/dist/features/runtime/runtime.js +608 -776
  38. package/dist/features/sdkBundle/buildSdkBundle.d.ts +5 -0
  39. package/dist/features/sdkBundle/buildSdkBundle.js +9 -3
  40. package/dist/features/studio/components/DraftsSheet.js +124 -65
  41. package/dist/features/studio/components/ThreadMessages.js +5 -9
  42. package/dist/features/studio/showInCanvas.js +9 -19
  43. package/dist/features/studio/useEditorSelection.js +8 -19
  44. package/dist/package.js +1 -1
  45. package/dist/studio.css +1 -1
  46. package/package.json +4 -4
  47. package/dist/core/hooks/useFieldSelection.js +0 -67
  48. package/dist/core/hooks/useIsEditable.js +0 -21
  49. package/dist/core/hooks/useOverlayMessage.js +0 -70
@@ -4,9 +4,10 @@ import { lexicalStateToPlainText } from "../../../core/lib/lexicalState.js";
4
4
  import { DrillRow } from "./DrillRow.js";
5
5
  import { ReferenceFieldEditor } from "./ReferenceFieldEditor.js";
6
6
  import { ReferenceListFieldEditor } from "./ReferenceListFieldEditor.js";
7
+ import { fieldOwner, placementId, placementThrough, slotId, slotSelection } from "../../../core/editing/fieldSlot.js";
7
8
  import { previewStore } from "../previewStore.js";
8
- import { overlayFieldId, recordPlacementId } from "../overlayMessages.js";
9
9
  import { PreviewEditingOwnerContext } from "../previewSelection.js";
10
+ import { formatFieldName } from "./contentFieldSchema.js";
10
11
  import { SidebarLexicalEditor } from "../../../core/components/lexical/SidebarLexicalEditor.js";
11
12
  import { IconFieldEditor } from "./IconFieldEditor.js";
12
13
  import { RepeatableItemsList } from "./RepeatableItemsList.js";
@@ -21,9 +22,6 @@ import { AppWindow, Code, FileIcon, ImageIcon, Images, Link2, List, ListFilter,
21
22
  import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@camox/ui/select";
22
23
 
23
24
  //#region src/features/preview/components/ItemFieldsEditor.tsx
24
- const formatFieldName = (fieldName) => {
25
- return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase()).trim();
26
- };
27
25
  const getSchemaFieldsInOrder = (schema) => {
28
26
  const properties = schema?.properties;
29
27
  if (!properties) return [];
@@ -45,7 +43,7 @@ const getSchemaFieldsInOrder = (schema) => {
45
43
  });
46
44
  };
47
45
  const ItemFieldsEditor = (t0) => {
48
- const $ = c(59);
46
+ const $ = c(23);
49
47
  const { selectedFieldName, schema, data, blockId, itemId, onFieldChange, postToIframe, filesMap, itemsMap, references, placement, fieldIdPrefix, fieldHint } = t0;
50
48
  const owner = React.useContext(PreviewEditingOwnerContext);
51
49
  let t1;
@@ -65,68 +63,71 @@ const ItemFieldsEditor = (t0) => {
65
63
  const pendingSaveRef = React.useRef(null);
66
64
  const timerRef = React.useRef(null);
67
65
  const focusedFieldIdRef = React.useRef(null);
66
+ const fieldsOwner = fieldOwner({
67
+ blockId,
68
+ itemId,
69
+ placement
70
+ });
71
+ const slot = (name, type) => ({
72
+ owner: fieldsOwner,
73
+ name,
74
+ type
75
+ });
76
+ const getFieldId = (fieldName) => slotId({
77
+ owner: fieldsOwner,
78
+ name: fieldName,
79
+ type: "String"
80
+ });
68
81
  let t2;
69
- if ($[5] !== blockId || $[6] !== itemId || $[7] !== placement) {
70
- t2 = (fieldName) => overlayFieldId(blockId, fieldName, {
71
- itemId,
72
- placement
73
- });
74
- $[5] = blockId;
75
- $[6] = itemId;
76
- $[7] = placement;
77
- $[8] = t2;
78
- } else t2 = $[8];
79
- const getFieldId = t2;
82
+ if ($[5] !== fieldIdPrefix) {
83
+ t2 = (fieldName_0) => `${fieldIdPrefix}-${fieldName_0}`;
84
+ $[5] = fieldIdPrefix;
85
+ $[6] = t2;
86
+ } else t2 = $[6];
87
+ const getFieldElementId = t2;
80
88
  let t3;
81
- if ($[9] !== fieldIdPrefix) {
82
- t3 = (fieldName_0) => `${fieldIdPrefix}-${fieldName_0}`;
83
- $[9] = fieldIdPrefix;
84
- $[10] = t3;
85
- } else t3 = $[10];
86
- const getFieldElementId = t3;
87
- let t4;
88
- if ($[11] !== fields) {
89
- t4 = fields.filter(_temp).map(_temp2);
90
- $[11] = fields;
91
- $[12] = t4;
92
- } else t4 = $[12];
93
- const scalarFields = t4;
89
+ if ($[7] !== fields) {
90
+ t3 = fields.filter(_temp).map(_temp2);
91
+ $[7] = fields;
92
+ $[8] = t3;
93
+ } else t3 = $[8];
94
+ const scalarFields = t3;
94
95
  let values;
95
- if ($[13] !== data || $[14] !== scalarFields) {
96
+ if ($[9] !== data || $[10] !== scalarFields) {
96
97
  values = {};
97
98
  for (const fieldName_1 of scalarFields) values[fieldName_1] = data[fieldName_1] ?? "";
98
- $[13] = data;
99
- $[14] = scalarFields;
100
- $[15] = values;
101
- } else values = $[15];
99
+ $[9] = data;
100
+ $[10] = scalarFields;
101
+ $[11] = values;
102
+ } else values = $[11];
102
103
  const defaultValues = values;
104
+ let t4;
105
+ if ($[12] !== defaultValues) {
106
+ t4 = { defaultValues };
107
+ $[12] = defaultValues;
108
+ $[13] = t4;
109
+ } else t4 = $[13];
110
+ const form = useForm(t4);
103
111
  let t5;
104
- if ($[16] !== defaultValues) {
105
- t5 = { defaultValues };
106
- $[16] = defaultValues;
107
- $[17] = t5;
108
- } else t5 = $[17];
109
- const form = useForm(t5);
110
112
  let t6;
111
- let t7;
112
- if ($[18] !== defaultValues || $[19] !== form) {
113
- t6 = () => {
113
+ if ($[14] !== defaultValues || $[15] !== form) {
114
+ t5 = () => {
114
115
  form.update({ defaultValues });
115
116
  };
116
- t7 = [defaultValues, form];
117
- $[18] = defaultValues;
118
- $[19] = form;
119
- $[20] = t6;
120
- $[21] = t7;
117
+ t6 = [defaultValues, form];
118
+ $[14] = defaultValues;
119
+ $[15] = form;
120
+ $[16] = t5;
121
+ $[17] = t6;
121
122
  } else {
122
- t6 = $[20];
123
- t7 = $[21];
123
+ t5 = $[16];
124
+ t6 = $[17];
124
125
  }
125
- React.useEffect(t6, t7);
126
+ React.useEffect(t5, t6);
127
+ let t7;
126
128
  let t8;
127
- let t9;
128
- if ($[22] !== postToIframe) {
129
- t8 = () => () => {
129
+ if ($[18] !== postToIframe) {
130
+ t7 = () => () => {
130
131
  if (timerRef.current) clearTimeout(timerRef.current);
131
132
  pendingSaveRef.current?.();
132
133
  pendingSaveRef.current = null;
@@ -135,432 +136,347 @@ const ItemFieldsEditor = (t0) => {
135
136
  fieldId: focusedFieldIdRef.current
136
137
  });
137
138
  };
138
- t9 = [postToIframe];
139
- $[22] = postToIframe;
140
- $[23] = t8;
141
- $[24] = t9;
139
+ t8 = [postToIframe];
140
+ $[18] = postToIframe;
141
+ $[19] = t7;
142
+ $[20] = t8;
142
143
  } else {
143
- t8 = $[23];
144
- t9 = $[24];
144
+ t7 = $[19];
145
+ t8 = $[20];
145
146
  }
146
- React.useEffect(t8, t9);
147
- let t10;
148
- let t11;
149
- if ($[25] !== blockId || $[26] !== data || $[27] !== fieldHint || $[28] !== fields || $[29] !== filesMap || $[30] !== form || $[31] !== getFieldElementId || $[32] !== getFieldId || $[33] !== itemId || $[34] !== itemsMap || $[35] !== onFieldChange || $[36] !== owner || $[37] !== placement || $[38] !== postToIframe || $[39] !== references || $[40] !== schema || $[41] !== selectedFieldName) {
150
- const handleScalarChange = (fieldName_2, value, fieldApi) => {
151
- fieldApi.handleChange(value);
152
- if (timerRef.current) clearTimeout(timerRef.current);
153
- pendingSaveRef.current = () => onFieldChange(fieldName_2, value);
154
- timerRef.current = window.setTimeout(() => {
155
- pendingSaveRef.current?.();
156
- pendingSaveRef.current = null;
157
- timerRef.current = null;
158
- }, 500);
159
- };
160
- let t12;
161
- if ($[44] !== blockId || $[45] !== itemId || $[46] !== owner || $[47] !== placement) {
162
- t12 = (fieldName_3, fieldType) => {
163
- if (owner === null) return;
164
- if (placement) {
165
- previewStore.send({
166
- type: "selectRecordField",
167
- ...owner,
168
- ...placement,
169
- recordFieldName: fieldName_3,
170
- recordFieldType: fieldType
171
- });
172
- return;
173
- }
174
- if (itemId != null) {
175
- previewStore.send({
176
- type: "selectItemField",
177
- ...owner,
178
- blockId,
179
- itemId,
180
- fieldName: fieldName_3,
181
- fieldType
182
- });
183
- return;
147
+ React.useEffect(t7, t8);
148
+ const handleScalarChange = (fieldName_2, value, fieldApi) => {
149
+ fieldApi.handleChange(value);
150
+ if (timerRef.current) clearTimeout(timerRef.current);
151
+ pendingSaveRef.current = () => onFieldChange(fieldName_2, value);
152
+ timerRef.current = window.setTimeout(() => {
153
+ pendingSaveRef.current?.();
154
+ pendingSaveRef.current = null;
155
+ timerRef.current = null;
156
+ }, 500);
157
+ };
158
+ const selectField = (fieldName_3, fieldType) => {
159
+ if (owner === null) return;
160
+ previewStore.send({
161
+ type: "selectTarget",
162
+ ...owner,
163
+ selection: slotSelection(slot(fieldName_3, fieldType))
164
+ });
165
+ };
166
+ const handleFieldFocus = (fieldName_4, fieldType_0) => {
167
+ if (owner === null) return;
168
+ const fieldId = getFieldId(fieldName_4);
169
+ focusedFieldIdRef.current = fieldId;
170
+ postToIframe({
171
+ type: "CAMOX_FOCUS_FIELD",
172
+ fieldId
173
+ });
174
+ selectField(fieldName_4, fieldType_0);
175
+ };
176
+ const handleFieldBlur = (fieldName_5) => {
177
+ const fieldId_0 = getFieldId(fieldName_5);
178
+ focusedFieldIdRef.current = null;
179
+ postToIframe({
180
+ type: "CAMOX_FOCUS_FIELD_END",
181
+ fieldId: fieldId_0
182
+ });
183
+ };
184
+ const placementOf = (fieldName_6, recordId) => placementThrough(fieldsOwner, fieldName_6, recordId);
185
+ const opensRecords = !placement?.nested;
186
+ const openRecord = (fieldName_7, recordId_0) => {
187
+ if (owner === null) return;
188
+ previewStore.send({
189
+ type: "selectRecord",
190
+ ...owner,
191
+ ...placementOf(fieldName_7, recordId_0)
192
+ });
193
+ };
194
+ const t9 = "space-y-4 px-2 py-4";
195
+ const t10 = fields.map((field_0) => {
196
+ const label = field_0.label ?? formatFieldName(field_0.name);
197
+ const fieldId_1 = getFieldId(field_0.name);
198
+ const renderField = () => {
199
+ if (field_0.fieldType === "Reference" && field_0.collectionId) return /* @__PURE__ */ jsx(ReferenceFieldEditor, {
200
+ collectionId: field_0.collectionId,
201
+ value: data[field_0.name],
202
+ required: field_0.required,
203
+ record: singleReference(references, field_0.name),
204
+ onChange: (value_0) => onFieldChange(field_0.name, value_0),
205
+ onOpenRecord: opensRecords ? (recordId_1) => openRecord(field_0.name, recordId_1) : void 0,
206
+ drill: selectedFieldName ? void 0 : {
207
+ label,
208
+ fieldId: fieldId_1,
209
+ onClick: () => selectField(field_0.name, field_0.fieldType),
210
+ postToIframe
184
211
  }
185
- previewStore.send({
186
- type: "selectBlockField",
187
- ...owner,
188
- blockId,
189
- fieldName: fieldName_3,
190
- fieldType
191
- });
192
- };
193
- $[44] = blockId;
194
- $[45] = itemId;
195
- $[46] = owner;
196
- $[47] = placement;
197
- $[48] = t12;
198
- } else t12 = $[48];
199
- const selectField = t12;
200
- const handleFieldFocus = (fieldName_4, fieldType_0) => {
201
- if (owner === null) return;
202
- const fieldId = getFieldId(fieldName_4);
203
- focusedFieldIdRef.current = fieldId;
204
- postToIframe({
205
- type: "CAMOX_FOCUS_FIELD",
206
- fieldId
207
- });
208
- selectField(fieldName_4, fieldType_0);
209
- };
210
- const handleFieldBlur = (fieldName_5) => {
211
- const fieldId_0 = getFieldId(fieldName_5);
212
- focusedFieldIdRef.current = null;
213
- postToIframe({
214
- type: "CAMOX_FOCUS_FIELD_END",
215
- fieldId: fieldId_0
216
- });
217
- };
218
- let t13;
219
- if ($[49] !== blockId || $[50] !== itemId || $[51] !== placement) {
220
- t13 = (fieldName_6, recordId) => placement ? {
221
- ...placement,
222
- nested: {
223
- fieldName: fieldName_6,
224
- recordId
212
+ }, field_0.name);
213
+ if (field_0.fieldType === "ReferenceList" && field_0.collectionId) return /* @__PURE__ */ jsx(ReferenceListFieldEditor, {
214
+ collectionId: field_0.collectionId,
215
+ value: data[field_0.name],
216
+ maxItems: field_0.maxItems,
217
+ query: field_0.query,
218
+ records: referenceList(references, field_0.name),
219
+ onChange: (ids) => onFieldChange(field_0.name, ids),
220
+ onOpenRecord: opensRecords ? (recordId_2) => openRecord(field_0.name, recordId_2) : void 0,
221
+ recordHover: opensRecords ? {
222
+ fieldId: (recordId_3) => placementId(placementOf(field_0.name, recordId_3)),
223
+ postToIframe
224
+ } : void 0,
225
+ drill: selectedFieldName ? void 0 : {
226
+ label,
227
+ fieldId: fieldId_1,
228
+ onClick: () => selectField(field_0.name, field_0.fieldType),
229
+ postToIframe
225
230
  }
226
- } : {
227
- blockId,
228
- ...itemId == null ? {} : { itemId },
229
- fieldName: fieldName_6,
230
- recordId
231
- };
232
- $[49] = blockId;
233
- $[50] = itemId;
234
- $[51] = placement;
235
- $[52] = t13;
236
- } else t13 = $[52];
237
- const placementOf = t13;
238
- const opensRecords = !placement?.nested;
239
- let t14;
240
- if ($[53] !== owner || $[54] !== placementOf) {
241
- t14 = (fieldName_7, recordId_0) => {
242
- if (owner === null) return;
243
- previewStore.send({
244
- type: "selectRecord",
245
- ...owner,
246
- ...placementOf(fieldName_7, recordId_0)
247
- });
248
- };
249
- $[53] = owner;
250
- $[54] = placementOf;
251
- $[55] = t14;
252
- } else t14 = $[55];
253
- const openRecord = t14;
254
- t10 = "space-y-4 px-2 py-4";
255
- t11 = fields.map((field_0) => {
256
- const label = field_0.label ?? formatFieldName(field_0.name);
257
- const fieldId_1 = getFieldId(field_0.name);
258
- const renderField = () => {
259
- if (field_0.fieldType === "Reference" && field_0.collectionId) return /* @__PURE__ */ jsx(ReferenceFieldEditor, {
260
- collectionId: field_0.collectionId,
261
- value: data[field_0.name],
262
- required: field_0.required,
263
- record: singleReference(references, field_0.name),
264
- onChange: (value_0) => onFieldChange(field_0.name, value_0),
265
- onOpenRecord: opensRecords ? (recordId_1) => openRecord(field_0.name, recordId_1) : void 0,
266
- drill: selectedFieldName ? void 0 : {
267
- label,
268
- fieldId: fieldId_1,
269
- onClick: () => selectField(field_0.name, field_0.fieldType),
270
- postToIframe
271
- }
272
- }, field_0.name);
273
- if (field_0.fieldType === "ReferenceList" && field_0.collectionId) return /* @__PURE__ */ jsx(ReferenceListFieldEditor, {
274
- collectionId: field_0.collectionId,
275
- value: data[field_0.name],
276
- maxItems: field_0.maxItems,
277
- query: field_0.query,
278
- records: referenceList(references, field_0.name),
279
- onChange: (ids) => onFieldChange(field_0.name, ids),
280
- onOpenRecord: opensRecords ? (recordId_2) => openRecord(field_0.name, recordId_2) : void 0,
281
- recordHover: opensRecords ? {
282
- fieldId: (recordId_3) => recordPlacementId(placementOf(field_0.name, recordId_3)),
283
- postToIframe
284
- } : void 0,
285
- drill: selectedFieldName ? void 0 : {
286
- label,
287
- fieldId: fieldId_1,
288
- onClick: () => selectField(field_0.name, field_0.fieldType),
289
- postToIframe
290
- }
231
+ }, field_0.name);
232
+ if (field_0.fieldType === "Artifact") {
233
+ const value_1 = data[field_0.name];
234
+ const title = isArtifactSource(value_1) ? artifactTitle(value_1) : null;
235
+ if (!selectedFieldName) return /* @__PURE__ */ jsx(DrillRow, {
236
+ label,
237
+ preview: title ?? "Empty",
238
+ Icon: AppWindow,
239
+ onClick: () => selectField(field_0.name, field_0.fieldType),
240
+ hover: {
241
+ variant: "field",
242
+ fieldId: fieldId_1
243
+ },
244
+ postToIframe
291
245
  }, field_0.name);
292
- if (field_0.fieldType === "Artifact") {
293
- const value_1 = data[field_0.name];
294
- const title = isArtifactSource(value_1) ? artifactTitle(value_1) : null;
295
- if (!selectedFieldName) return /* @__PURE__ */ jsx(DrillRow, {
296
- label,
297
- preview: title ?? "Empty",
298
- Icon: AppWindow,
299
- onClick: () => selectField(field_0.name, field_0.fieldType),
300
- hover: {
301
- variant: "field",
302
- fieldId: fieldId_1
303
- },
304
- postToIframe
305
- }, field_0.name);
306
- return /* @__PURE__ */ jsxs("div", {
307
- className: "flex items-start gap-2 rounded-lg border px-3 py-2 text-sm",
308
- onMouseEnter: () => postToIframe({
309
- type: "CAMOX_HOVER_FIELD",
310
- fieldId: fieldId_1
311
- }),
312
- onMouseLeave: () => postToIframe({
313
- type: "CAMOX_HOVER_FIELD_END",
314
- fieldId: fieldId_1
315
- }),
316
- children: [/* @__PURE__ */ jsx(AppWindow, { className: "text-muted-foreground mt-0.5 h-4 w-4 shrink-0" }), title === null ? /* @__PURE__ */ jsx("p", {
317
- className: "text-muted-foreground",
318
- children: "Empty"
319
- }) : /* @__PURE__ */ jsxs("div", {
320
- className: "min-w-0 space-y-0.5",
321
- children: [/* @__PURE__ */ jsx("p", {
322
- className: "truncate font-medium",
323
- children: title
324
- }), /* @__PURE__ */ jsx("p", {
325
- className: "text-muted-foreground text-xs",
326
- children: "Created and edited by agents"
327
- })]
246
+ return /* @__PURE__ */ jsxs("div", {
247
+ className: "flex items-start gap-2 rounded-lg border px-3 py-2 text-sm",
248
+ onMouseEnter: () => postToIframe({
249
+ type: "CAMOX_HOVER_FIELD",
250
+ fieldId: fieldId_1
251
+ }),
252
+ onMouseLeave: () => postToIframe({
253
+ type: "CAMOX_HOVER_FIELD_END",
254
+ fieldId: fieldId_1
255
+ }),
256
+ children: [/* @__PURE__ */ jsx(AppWindow, { className: "text-muted-foreground mt-0.5 h-4 w-4 shrink-0" }), title === null ? /* @__PURE__ */ jsx("p", {
257
+ className: "text-muted-foreground",
258
+ children: "Empty"
259
+ }) : /* @__PURE__ */ jsxs("div", {
260
+ className: "min-w-0 space-y-0.5",
261
+ children: [/* @__PURE__ */ jsx("p", {
262
+ className: "truncate font-medium",
263
+ children: title
264
+ }), /* @__PURE__ */ jsx("p", {
265
+ className: "text-muted-foreground text-xs",
266
+ children: "Created and edited by agents"
328
267
  })]
329
- }, field_0.name);
330
- }
331
- if (!selectedFieldName && [
332
- "String",
333
- "Embed",
334
- "Repeater",
335
- "Enum",
336
- "Boolean",
337
- "Icon"
338
- ].includes(field_0.fieldType)) {
339
- const value_2 = data[field_0.name];
340
- const preview = field_0.fieldType === "String" ? lexicalStateToPlainText(value_2 ?? "") || "Empty text" : field_0.fieldType === "Repeater" ? `${Array.isArray(value_2) ? value_2.length : 0} items` : field_0.fieldType === "Boolean" ? value_2 ? "On" : "Off" : typeof value_2 === "string" && value_2 ? value_2 : "Empty";
341
- return /* @__PURE__ */ jsx(DrillRow, {
342
- label,
343
- hint: fieldHint?.(field_0.name),
344
- preview,
345
- Icon: field_0.fieldType === "String" ? Type : field_0.fieldType === "Repeater" ? List : field_0.fieldType === "Embed" ? Code : field_0.fieldType === "Boolean" ? ToggleLeft : ListFilter,
346
- onClick: () => selectField(field_0.name, field_0.fieldType),
347
- hover: field_0.fieldType === "Repeater" ? {
348
- variant: "repeater",
349
- blockId,
350
- fieldName: field_0.name
351
- } : {
352
- variant: "field",
353
- fieldId: fieldId_1
354
- },
355
- postToIframe
356
- }, field_0.name);
357
- }
358
- if (field_0.fieldType === "Icon") return /* @__PURE__ */ jsx(IconFieldEditor, {
359
- value: typeof data[field_0.name] === "string" ? data[field_0.name] : "",
360
- ids: field_0.enumValues ?? [],
361
- onChange: (value_3) => onFieldChange(field_0.name, value_3)
268
+ })]
269
+ }, field_0.name);
270
+ }
271
+ if (!selectedFieldName && [
272
+ "String",
273
+ "Embed",
274
+ "Repeater",
275
+ "Enum",
276
+ "Boolean",
277
+ "Icon"
278
+ ].includes(field_0.fieldType)) {
279
+ const value_2 = data[field_0.name];
280
+ const preview = field_0.fieldType === "String" ? lexicalStateToPlainText(value_2 ?? "") || "Empty text" : field_0.fieldType === "Repeater" ? `${Array.isArray(value_2) ? value_2.length : 0} items` : field_0.fieldType === "Boolean" ? value_2 ? "On" : "Off" : typeof value_2 === "string" && value_2 ? value_2 : "Empty";
281
+ return /* @__PURE__ */ jsx(DrillRow, {
282
+ label,
283
+ hint: fieldHint?.(field_0.name),
284
+ preview,
285
+ Icon: field_0.fieldType === "String" ? Type : field_0.fieldType === "Repeater" ? List : field_0.fieldType === "Embed" ? Code : field_0.fieldType === "Boolean" ? ToggleLeft : ListFilter,
286
+ onClick: () => selectField(field_0.name, field_0.fieldType),
287
+ hover: field_0.fieldType === "Repeater" ? {
288
+ variant: "repeater",
289
+ blockId,
290
+ fieldName: field_0.name
291
+ } : {
292
+ variant: "field",
293
+ fieldId: fieldId_1
294
+ },
295
+ postToIframe
362
296
  }, field_0.name);
363
- if (field_0.fieldType === "Boolean") return /* @__PURE__ */ jsxs("div", {
364
- className: "flex items-center justify-between",
297
+ }
298
+ if (field_0.fieldType === "Icon") return /* @__PURE__ */ jsx(IconFieldEditor, {
299
+ value: typeof data[field_0.name] === "string" ? data[field_0.name] : "",
300
+ ids: field_0.enumValues ?? [],
301
+ onChange: (value_3) => onFieldChange(field_0.name, value_3)
302
+ }, field_0.name);
303
+ if (field_0.fieldType === "Boolean") return /* @__PURE__ */ jsxs("div", {
304
+ className: "flex items-center justify-between",
305
+ children: [/* @__PURE__ */ jsx(Label, {
306
+ htmlFor: getFieldElementId(field_0.name),
307
+ children: label
308
+ }), /* @__PURE__ */ jsx(Switch, {
309
+ id: getFieldElementId(field_0.name),
310
+ checked: Boolean(data[field_0.name]),
311
+ onCheckedChange: (value_4) => onFieldChange(field_0.name, value_4)
312
+ })]
313
+ }, field_0.name);
314
+ if (field_0.fieldType === "Enum") return /* @__PURE__ */ jsxs("div", {
315
+ className: "space-y-2",
316
+ children: [/* @__PURE__ */ jsx(Label, {
317
+ htmlFor: getFieldElementId(field_0.name),
318
+ children: label
319
+ }), /* @__PURE__ */ jsxs(Select, {
320
+ value: typeof data[field_0.name] === "string" ? data[field_0.name] : "",
321
+ onValueChange: (value_5) => onFieldChange(field_0.name, value_5),
322
+ children: [/* @__PURE__ */ jsx(SelectTrigger, {
323
+ id: getFieldElementId(field_0.name),
324
+ children: /* @__PURE__ */ jsx(SelectValue, {})
325
+ }), /* @__PURE__ */ jsx(SelectContent, { children: field_0.enumValues?.map((value_6) => /* @__PURE__ */ jsx(SelectItem, {
326
+ value: value_6,
327
+ children: field_0.enumLabels?.[value_6] ?? value_6
328
+ }, value_6)) })]
329
+ })]
330
+ }, field_0.name);
331
+ if (field_0.fieldType === "String") return /* @__PURE__ */ jsx(form.Field, {
332
+ name: field_0.name,
333
+ children: (fieldApi_0) => /* @__PURE__ */ jsxs("div", {
334
+ className: "space-y-2",
335
+ onMouseEnter: () => postToIframe({
336
+ type: "CAMOX_HOVER_FIELD",
337
+ fieldId: fieldId_1
338
+ }),
339
+ onMouseLeave: () => postToIframe({
340
+ type: "CAMOX_HOVER_FIELD_END",
341
+ fieldId: fieldId_1
342
+ }),
365
343
  children: [/* @__PURE__ */ jsx(Label, {
366
344
  htmlFor: getFieldElementId(field_0.name),
367
345
  children: label
368
- }), /* @__PURE__ */ jsx(Switch, {
346
+ }), /* @__PURE__ */ jsx(SidebarLexicalEditor, {
369
347
  id: getFieldElementId(field_0.name),
370
- checked: Boolean(data[field_0.name]),
371
- onCheckedChange: (value_4) => onFieldChange(field_0.name, value_4)
348
+ value: fieldApi_0.state.value,
349
+ maxLength: field_0.maxLength,
350
+ onChange: (value_7) => handleScalarChange(field_0.name, value_7, fieldApi_0),
351
+ onFocus: () => handleFieldFocus(field_0.name, field_0.fieldType),
352
+ onBlur: () => handleFieldBlur(field_0.name)
372
353
  })]
373
- }, field_0.name);
374
- if (field_0.fieldType === "Enum") return /* @__PURE__ */ jsxs("div", {
354
+ })
355
+ }, field_0.name);
356
+ if (field_0.fieldType === "Embed") return /* @__PURE__ */ jsx(form.Field, {
357
+ name: field_0.name,
358
+ children: (fieldApi_1) => /* @__PURE__ */ jsxs("div", {
375
359
  className: "space-y-2",
360
+ onMouseEnter: () => postToIframe({
361
+ type: "CAMOX_HOVER_FIELD",
362
+ fieldId: fieldId_1
363
+ }),
364
+ onMouseLeave: () => postToIframe({
365
+ type: "CAMOX_HOVER_FIELD_END",
366
+ fieldId: fieldId_1
367
+ }),
376
368
  children: [/* @__PURE__ */ jsx(Label, {
377
369
  htmlFor: getFieldElementId(field_0.name),
378
370
  children: label
379
- }), /* @__PURE__ */ jsxs(Select, {
380
- value: typeof data[field_0.name] === "string" ? data[field_0.name] : "",
381
- onValueChange: (value_5) => onFieldChange(field_0.name, value_5),
382
- children: [/* @__PURE__ */ jsx(SelectTrigger, {
383
- id: getFieldElementId(field_0.name),
384
- children: /* @__PURE__ */ jsx(SelectValue, {})
385
- }), /* @__PURE__ */ jsx(SelectContent, { children: field_0.enumValues?.map((value_6) => /* @__PURE__ */ jsx(SelectItem, {
386
- value: value_6,
387
- children: field_0.enumLabels?.[value_6] ?? value_6
388
- }, value_6)) })]
371
+ }), /* @__PURE__ */ jsx(Input, {
372
+ id: getFieldElementId(field_0.name),
373
+ type: "url",
374
+ value: fieldApi_1.state.value,
375
+ onChange: (e) => handleScalarChange(field_0.name, e.target.value, fieldApi_1),
376
+ onFocus: () => handleFieldFocus(field_0.name, field_0.fieldType),
377
+ onBlur: () => handleFieldBlur(field_0.name)
389
378
  })]
379
+ })
380
+ }, field_0.name);
381
+ if (field_0.fieldType === "Link") {
382
+ const linkValue = data[field_0.name];
383
+ const preview_0 = linkValue?.text || linkValue?.href || "Empty link";
384
+ return /* @__PURE__ */ jsx(DrillRow, {
385
+ label,
386
+ hint: fieldHint?.(field_0.name),
387
+ preview: preview_0,
388
+ Icon: Link2,
389
+ onClick: () => selectField(field_0.name, "Link"),
390
+ hover: {
391
+ variant: "field",
392
+ fieldId: fieldId_1
393
+ },
394
+ postToIframe
390
395
  }, field_0.name);
391
- if (field_0.fieldType === "String") return /* @__PURE__ */ jsx(form.Field, {
392
- name: field_0.name,
393
- children: (fieldApi_0) => /* @__PURE__ */ jsxs("div", {
394
- className: "space-y-2",
395
- onMouseEnter: () => postToIframe({
396
- type: "CAMOX_HOVER_FIELD",
397
- fieldId: fieldId_1
398
- }),
399
- onMouseLeave: () => postToIframe({
400
- type: "CAMOX_HOVER_FIELD_END",
401
- fieldId: fieldId_1
402
- }),
403
- children: [/* @__PURE__ */ jsx(Label, {
404
- htmlFor: getFieldElementId(field_0.name),
405
- children: label
406
- }), /* @__PURE__ */ jsx(SidebarLexicalEditor, {
407
- id: getFieldElementId(field_0.name),
408
- value: fieldApi_0.state.value,
409
- maxLength: field_0.maxLength,
410
- onChange: (value_7) => handleScalarChange(field_0.name, value_7, fieldApi_0),
411
- onFocus: () => handleFieldFocus(field_0.name, field_0.fieldType),
412
- onBlur: () => handleFieldBlur(field_0.name)
413
- })]
414
- })
396
+ }
397
+ if (field_0.fieldType === "ImageList" || field_0.fieldType === "FileList") {
398
+ const value_8 = data[field_0.name];
399
+ const count = Array.isArray(value_8) ? value_8.length : 0;
400
+ const isImage = field_0.fieldType === "ImageList";
401
+ const noun = isImage ? "image" : "file";
402
+ let preview_1;
403
+ if (count === 0) preview_1 = isImage ? "No images" : "No files";
404
+ else if (count === 1) preview_1 = `1 ${noun}`;
405
+ else preview_1 = `${count} ${noun}s`;
406
+ return /* @__PURE__ */ jsx(DrillRow, {
407
+ label,
408
+ hint: fieldHint?.(field_0.name),
409
+ preview: preview_1,
410
+ Icon: isImage ? Images : FileIcon,
411
+ onClick: () => selectField(field_0.name, isImage ? "Image" : "File"),
412
+ hover: {
413
+ variant: "repeater",
414
+ blockId,
415
+ fieldName: field_0.name
416
+ },
417
+ postToIframe
415
418
  }, field_0.name);
416
- if (field_0.fieldType === "Embed") return /* @__PURE__ */ jsx(form.Field, {
417
- name: field_0.name,
418
- children: (fieldApi_1) => /* @__PURE__ */ jsxs("div", {
419
- className: "space-y-2",
420
- onMouseEnter: () => postToIframe({
421
- type: "CAMOX_HOVER_FIELD",
422
- fieldId: fieldId_1
423
- }),
424
- onMouseLeave: () => postToIframe({
425
- type: "CAMOX_HOVER_FIELD_END",
426
- fieldId: fieldId_1
427
- }),
428
- children: [/* @__PURE__ */ jsx(Label, {
429
- htmlFor: getFieldElementId(field_0.name),
430
- children: label
431
- }), /* @__PURE__ */ jsx(Input, {
432
- id: getFieldElementId(field_0.name),
433
- type: "url",
434
- value: fieldApi_1.state.value,
435
- onChange: (e) => handleScalarChange(field_0.name, e.target.value, fieldApi_1),
436
- onFocus: () => handleFieldFocus(field_0.name, field_0.fieldType),
437
- onBlur: () => handleFieldBlur(field_0.name)
438
- })]
439
- })
419
+ }
420
+ if (field_0.fieldType === "Image") {
421
+ const preview_2 = resolveAssetValue(data[field_0.name], filesMap)?.filename || "No image";
422
+ return /* @__PURE__ */ jsx(DrillRow, {
423
+ label,
424
+ hint: fieldHint?.(field_0.name),
425
+ preview: preview_2,
426
+ Icon: ImageIcon,
427
+ onClick: () => selectField(field_0.name, "Image"),
428
+ hover: {
429
+ variant: "field",
430
+ fieldId: fieldId_1
431
+ },
432
+ postToIframe
440
433
  }, field_0.name);
441
- if (field_0.fieldType === "Link") {
442
- const linkValue = data[field_0.name];
443
- const preview_0 = linkValue?.text || linkValue?.href || "Empty link";
444
- return /* @__PURE__ */ jsx(DrillRow, {
445
- label,
446
- hint: fieldHint?.(field_0.name),
447
- preview: preview_0,
448
- Icon: Link2,
449
- onClick: () => selectField(field_0.name, "Link"),
450
- hover: {
451
- variant: "field",
452
- fieldId: fieldId_1
453
- },
454
- postToIframe
455
- }, field_0.name);
456
- }
457
- if (field_0.fieldType === "ImageList" || field_0.fieldType === "FileList") {
458
- const value_8 = data[field_0.name];
459
- const count = Array.isArray(value_8) ? value_8.length : 0;
460
- const isImage = field_0.fieldType === "ImageList";
461
- const noun = isImage ? "image" : "file";
462
- let preview_1;
463
- if (count === 0) preview_1 = isImage ? "No images" : "No files";
464
- else if (count === 1) preview_1 = `1 ${noun}`;
465
- else preview_1 = `${count} ${noun}s`;
466
- return /* @__PURE__ */ jsx(DrillRow, {
467
- label,
468
- hint: fieldHint?.(field_0.name),
469
- preview: preview_1,
470
- Icon: isImage ? Images : FileIcon,
471
- onClick: () => selectField(field_0.name, isImage ? "Image" : "File"),
472
- hover: {
473
- variant: "repeater",
474
- blockId,
475
- fieldName: field_0.name
476
- },
477
- postToIframe
478
- }, field_0.name);
479
- }
480
- if (field_0.fieldType === "Image") {
481
- const preview_2 = resolveAssetValue(data[field_0.name], filesMap)?.filename || "No image";
482
- return /* @__PURE__ */ jsx(DrillRow, {
483
- label,
484
- hint: fieldHint?.(field_0.name),
485
- preview: preview_2,
486
- Icon: ImageIcon,
487
- onClick: () => selectField(field_0.name, "Image"),
488
- hover: {
489
- variant: "field",
490
- fieldId: fieldId_1
491
- },
492
- postToIframe
493
- }, field_0.name);
494
- }
495
- if (field_0.fieldType === "File") {
496
- const preview_3 = resolveAssetValue(data[field_0.name], filesMap)?.filename || "No file";
497
- return /* @__PURE__ */ jsx(DrillRow, {
498
- label,
499
- hint: fieldHint?.(field_0.name),
500
- preview: preview_3,
501
- Icon: FileIcon,
502
- onClick: () => selectField(field_0.name, "File"),
503
- hover: {
504
- variant: "field",
505
- fieldId: fieldId_1
506
- },
507
- postToIframe
508
- }, field_0.name);
509
- }
510
- if (field_0.fieldType === "Repeater") {
511
- const items = (data[field_0.name] ?? []).map((item) => {
512
- if (isItemMarker(item)) return itemsMap.get(item._itemId) ?? null;
513
- return item;
514
- }).filter(Boolean);
515
- const fieldSchema = schema?.properties?.[field_0.name];
516
- return /* @__PURE__ */ jsxs("div", {
517
- className: "space-y-2",
518
- children: [/* @__PURE__ */ jsx(Label, { children: label }), /* @__PURE__ */ jsx(RepeatableItemsList, {
519
- items,
520
- blockId,
521
- fieldName: field_0.name,
522
- schema: fieldSchema
523
- })]
524
- }, field_0.name);
525
- }
526
- return null;
527
- };
528
- return renderField();
529
- });
530
- $[25] = blockId;
531
- $[26] = data;
532
- $[27] = fieldHint;
533
- $[28] = fields;
534
- $[29] = filesMap;
535
- $[30] = form;
536
- $[31] = getFieldElementId;
537
- $[32] = getFieldId;
538
- $[33] = itemId;
539
- $[34] = itemsMap;
540
- $[35] = onFieldChange;
541
- $[36] = owner;
542
- $[37] = placement;
543
- $[38] = postToIframe;
544
- $[39] = references;
545
- $[40] = schema;
546
- $[41] = selectedFieldName;
547
- $[42] = t10;
548
- $[43] = t11;
549
- } else {
550
- t10 = $[42];
551
- t11 = $[43];
552
- }
553
- let t12;
554
- if ($[56] !== t10 || $[57] !== t11) {
555
- t12 = /* @__PURE__ */ jsx("form", {
556
- className: t10,
557
- children: t11
434
+ }
435
+ if (field_0.fieldType === "File") {
436
+ const preview_3 = resolveAssetValue(data[field_0.name], filesMap)?.filename || "No file";
437
+ return /* @__PURE__ */ jsx(DrillRow, {
438
+ label,
439
+ hint: fieldHint?.(field_0.name),
440
+ preview: preview_3,
441
+ Icon: FileIcon,
442
+ onClick: () => selectField(field_0.name, "File"),
443
+ hover: {
444
+ variant: "field",
445
+ fieldId: fieldId_1
446
+ },
447
+ postToIframe
448
+ }, field_0.name);
449
+ }
450
+ if (field_0.fieldType === "Repeater") {
451
+ const items = (data[field_0.name] ?? []).map((item) => {
452
+ if (isItemMarker(item)) return itemsMap.get(item._itemId) ?? null;
453
+ return item;
454
+ }).filter(Boolean);
455
+ const fieldSchema = schema?.properties?.[field_0.name];
456
+ return /* @__PURE__ */ jsxs("div", {
457
+ className: "space-y-2",
458
+ children: [/* @__PURE__ */ jsx(Label, { children: label }), /* @__PURE__ */ jsx(RepeatableItemsList, {
459
+ items,
460
+ blockId,
461
+ fieldName: field_0.name,
462
+ schema: fieldSchema
463
+ })]
464
+ }, field_0.name);
465
+ }
466
+ return null;
467
+ };
468
+ return renderField();
469
+ });
470
+ let t11;
471
+ if ($[21] !== t10) {
472
+ t11 = /* @__PURE__ */ jsx("form", {
473
+ className: t9,
474
+ children: t10
558
475
  });
559
- $[56] = t10;
560
- $[57] = t11;
561
- $[58] = t12;
562
- } else t12 = $[58];
563
- return t12;
476
+ $[21] = t10;
477
+ $[22] = t11;
478
+ } else t11 = $[22];
479
+ return t11;
564
480
  };
565
481
  function _temp(f) {
566
482
  return f.fieldType === "String" || f.fieldType === "Embed";
@@ -570,4 +486,4 @@ function _temp2(f_0) {
570
486
  }
571
487
 
572
488
  //#endregion
573
- export { ItemFieldsEditor, formatFieldName };
489
+ export { ItemFieldsEditor };