@jbpark/live-editor 2.0.1 → 2.0.3
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/{ast-BmGLa00g.js → ast-BhbOxomw.js} +194 -21
- package/dist/ast-BhbOxomw.js.map +1 -0
- package/dist/{boundary-b-U70XU_.js → boundary-DOBK2HnX.js} +2 -2
- package/dist/{boundary-b-U70XU_.js.map → boundary-DOBK2HnX.js.map} +1 -1
- package/dist/{context-Yb81ZxnN.js → context-DOMX_RsU.js} +3 -3
- package/dist/{context-Yb81ZxnN.js.map → context-DOMX_RsU.js.map} +1 -1
- package/dist/{core-mdFWxqB2.js → core-D-ZvVhdn.js} +2 -2
- package/dist/{core-mdFWxqB2.js.map → core-D-ZvVhdn.js.map} +1 -1
- package/dist/dnd/index.d.ts +1 -1
- package/dist/dnd/index.js +1 -1
- package/dist/{dnd-DXI5JfwJ.js → dnd-E8LbmRfE.js} +86 -189
- package/dist/dnd-E8LbmRfE.js.map +1 -0
- package/dist/{document-DEx4WyCn.js → document-Ddw-tfnt.js} +37 -155
- package/dist/{document-DEx4WyCn.js.map → document-Ddw-tfnt.js.map} +1 -1
- package/dist/editor/index.js +2 -2
- package/dist/{editor-jzeeLkwi.js → editor-ka05eWyz.js} +3 -3
- package/dist/{editor-jzeeLkwi.js.map → editor-ka05eWyz.js.map} +1 -1
- package/dist/error/index.js +2 -2
- package/dist/{error-C47PVZgY.js → error-fzPGTaFe.js} +2 -2
- package/dist/{error-C47PVZgY.js.map → error-fzPGTaFe.js.map} +1 -1
- package/dist/{index-7J3AYBNK.d.ts → index-2CUWhF-T.d.ts} +2 -2
- package/dist/{index-Wh6AGoXW.d.ts → index-FKgYmeNR.d.ts} +21 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.js +5 -5
- package/dist/preview/index.js +1 -1
- package/dist/{preview-8OZDsfGT.js → preview-EsfzEjis.js} +4 -4
- package/dist/{preview-8OZDsfGT.js.map → preview-EsfzEjis.js.map} +1 -1
- package/dist/provider/index.js +1 -1
- package/dist/{use-dynamic-tailwind-_3tC-S5j.js → use-dynamic-tailwind-CRMGuKnH.js} +2 -2
- package/dist/{use-dynamic-tailwind-_3tC-S5j.js.map → use-dynamic-tailwind-CRMGuKnH.js.map} +1 -1
- package/dist/utils/ast/index.d.ts +2 -2
- package/dist/utils/ast/index.js +3 -3
- package/dist/utils/index.js +2 -2
- package/dist/{utils-CXq1KaM3.js → utils-B6zpA7mT.js} +2 -2
- package/dist/{utils-CXq1KaM3.js.map → utils-B6zpA7mT.js.map} +1 -1
- package/package.json +1 -1
- package/dist/ast-BmGLa00g.js.map +0 -1
- package/dist/dnd-DXI5JfwJ.js.map +0 -1
package/dist/dnd/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as ICON_OPTIONS, c as PanelRenderData, d as DraggableItemDragState, f as DraggableItemProps, i as ICON_MAP, l as Props, n as Panel, o as PaletteRenderData, r as PanelProps, s as PanelBinding, t as Dnd, u as DraggableItem } from "../index-
|
|
1
|
+
import { a as ICON_OPTIONS, c as PanelRenderData, d as DraggableItemDragState, f as DraggableItemProps, i as ICON_MAP, l as Props, n as Panel, o as PaletteRenderData, r as PanelProps, s as PanelBinding, t as Dnd, u as DraggableItem } from "../index-2CUWhF-T.js";
|
|
2
2
|
export { Panel as DefaultPanel, DraggableItem, type DraggableItemDragState, type DraggableItemProps, ICON_MAP, ICON_OPTIONS, type PaletteRenderData, type PanelBinding, type PanelProps, type PanelRenderData, type Props, Dnd as default };
|
package/dist/dnd/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as DraggableItem, i as ICON_OPTIONS, n as Panel, r as ICON_MAP, t as Dnd } from "../dnd-
|
|
1
|
+
import { a as DraggableItem, i as ICON_OPTIONS, n as Panel, r as ICON_MAP, t as Dnd } from "../dnd-E8LbmRfE.js";
|
|
2
2
|
export { Panel as DefaultPanel, DraggableItem, ICON_MAP, ICON_OPTIONS, Dnd as default };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { C as __toESM, b as DRAGGABLE_ITEMS, f as nanoid, g as BINDING_PROP,
|
|
2
|
-
import { d as replaceSections, o as extractSections, r as cn, s as generateSection, u as preloadScripts } from "./utils-
|
|
1
|
+
import { C as __toESM, b as DRAGGABLE_ITEMS, f as nanoid, g as BINDING_PROP, m as require_lib, n as createSectionPreviewCache, r as fillSectionIds, y as DEFAULT_TEMPLATE } from "./document-Ddw-tfnt.js";
|
|
2
|
+
import { d as replaceSections, o as extractSections, r as cn, s as generateSection, u as preloadScripts } from "./utils-B6zpA7mT.js";
|
|
3
3
|
import { i as usePreview } from "./states-Ci1AvoQ9.js";
|
|
4
|
-
import {
|
|
5
|
-
import { n as useCompiledModule, r as Frame, t as useDynamicTailwind } from "./use-dynamic-tailwind-
|
|
6
|
-
import { n as Error, t as ErrorBoundary } from "./boundary-
|
|
7
|
-
import { t as Core } from "./core-
|
|
4
|
+
import { A as parseValue, D as extractObjectProperties, E as extractNodeValue, M as generateCode, S as parseBinding, _ as moveSelectedIndices, a as extract, b as getCurrentValue, c as moveArrayItem, d as removeArrayItems, f as updateArrayItemProperty, g as replaceIds, h as fillIds, k as parseArrayExpression, l as moveArrayItems, o as appendArrayItem, p as updateArrayItemValue, r as update, s as duplicateArrayItems, t as validateBindingValue, v as removeIndices, x as getStructuredValue, y as findEditableChildren } from "./ast-BhbOxomw.js";
|
|
5
|
+
import { n as useCompiledModule, r as Frame, t as useDynamicTailwind } from "./use-dynamic-tailwind-CRMGuKnH.js";
|
|
6
|
+
import { n as Error, t as ErrorBoundary } from "./boundary-DOBK2HnX.js";
|
|
7
|
+
import { t as Core } from "./core-D-ZvVhdn.js";
|
|
8
8
|
import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
9
9
|
import { Button, Card, Checkbox, ColorPicker, DatePicker, Drawer, Input, Select, Space, Toast, Typography, Upload } from "@jbpark/ui-kit";
|
|
10
10
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -190,8 +190,7 @@ const Tiptap = ({ value = "", placeholder = "Enter text...", className, onChange
|
|
|
190
190
|
};
|
|
191
191
|
//#endregion
|
|
192
192
|
//#region src/components/dnd/panel/node.tsx
|
|
193
|
-
var import_lib = require_lib();
|
|
194
|
-
var import_lib$1 = /* @__PURE__ */ __toESM(require_lib$1(), 1);
|
|
193
|
+
var import_lib = /* @__PURE__ */ __toESM(require_lib(), 1);
|
|
195
194
|
const Node = ({ data, onChange }) => {
|
|
196
195
|
const idAttr = data.dataAttributes.find((a) => a.name === "data-id");
|
|
197
196
|
const bindingAttr = data.dataAttributes.find((a) => a.name === "data-binding");
|
|
@@ -249,33 +248,6 @@ const Node = ({ data, onChange }) => {
|
|
|
249
248
|
});
|
|
250
249
|
};
|
|
251
250
|
//#endregion
|
|
252
|
-
//#region src/components/dnd/panel/selection.ts
|
|
253
|
-
const removeIndices = (items, indices) => {
|
|
254
|
-
return items.filter((_, index) => !indices.has(index));
|
|
255
|
-
};
|
|
256
|
-
/**
|
|
257
|
-
* Shifts every selected index up/down by one step as a block, preserving
|
|
258
|
-
* relative order — scattered selections stop moving individually once they
|
|
259
|
-
* hit an unselected neighbor, so the whole group slides together instead of
|
|
260
|
-
* items passing through each other.
|
|
261
|
-
*/
|
|
262
|
-
const moveSelectedIndices = (items, indices, direction) => {
|
|
263
|
-
const next = [...items];
|
|
264
|
-
const nextIndices = new Set(indices);
|
|
265
|
-
const ordered = [...indices].sort((a, b) => direction === "up" ? a - b : b - a);
|
|
266
|
-
for (const index of ordered) {
|
|
267
|
-
const target = direction === "up" ? index - 1 : index + 1;
|
|
268
|
-
if (target < 0 || target >= next.length || nextIndices.has(target)) continue;
|
|
269
|
-
[next[index], next[target]] = [next[target], next[index]];
|
|
270
|
-
nextIndices.delete(index);
|
|
271
|
-
nextIndices.add(target);
|
|
272
|
-
}
|
|
273
|
-
return {
|
|
274
|
-
items: next,
|
|
275
|
-
indices: nextIndices
|
|
276
|
-
};
|
|
277
|
-
};
|
|
278
|
-
//#endregion
|
|
279
251
|
//#region src/components/dnd/panel/items.tsx
|
|
280
252
|
const BulkActionsBar = ({ count, onDuplicate, onMoveUp, onMoveDown, onDelete, onClear }) => {
|
|
281
253
|
if (count === 0) return null;
|
|
@@ -322,33 +294,30 @@ const BulkActionsBar = ({ count, onDuplicate, onMoveUp, onMoveDown, onDelete, on
|
|
|
322
294
|
});
|
|
323
295
|
};
|
|
324
296
|
const Items = ({ value, render, onChange, onChildChange }) => {
|
|
325
|
-
const { objectItems, primitiveItems,
|
|
297
|
+
const { objectItems, primitiveItems, parseError } = useMemo(() => {
|
|
326
298
|
const ast = parseArrayExpression(value);
|
|
327
299
|
if (!ast) return {
|
|
328
300
|
objectItems: [],
|
|
329
301
|
primitiveItems: [],
|
|
330
|
-
allElements: [],
|
|
331
302
|
parseError: true
|
|
332
303
|
};
|
|
333
304
|
const objectItems = [];
|
|
334
305
|
const primitiveItems = [];
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
if (!element) return;
|
|
338
|
-
if (!import_lib$1.isObjectExpression(element)) {
|
|
306
|
+
ast.elements.filter((element) => Boolean(element)).forEach((element, elementIndex) => {
|
|
307
|
+
if (!import_lib.isObjectExpression(element)) {
|
|
339
308
|
const extracted = extractNodeValue(element);
|
|
340
309
|
primitiveItems.push({
|
|
341
310
|
id: nanoid(6),
|
|
342
311
|
index: primitiveItems.length,
|
|
312
|
+
elementIndex,
|
|
343
313
|
value: extracted.value,
|
|
344
|
-
type: extracted.type
|
|
345
|
-
astNode: element
|
|
314
|
+
type: extracted.type
|
|
346
315
|
});
|
|
347
316
|
return;
|
|
348
317
|
}
|
|
349
318
|
const jsxBindings = {};
|
|
350
319
|
element.properties.forEach((prop) => {
|
|
351
|
-
if (!import_lib
|
|
320
|
+
if (!import_lib.isObjectProperty(prop) || !import_lib.isIdentifier(prop.key) || !import_lib.isJSXElement(prop.value)) return;
|
|
352
321
|
const propertyName = prop.key.name;
|
|
353
322
|
try {
|
|
354
323
|
const jsxCode = generateCode(prop.value);
|
|
@@ -369,15 +338,14 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
369
338
|
objectItems.push({
|
|
370
339
|
id: nanoid(6),
|
|
371
340
|
index: objectItems.length,
|
|
341
|
+
elementIndex,
|
|
372
342
|
editableProperties: extractObjectProperties(element),
|
|
373
|
-
originalElement: element,
|
|
374
343
|
jsxBindings
|
|
375
344
|
});
|
|
376
345
|
});
|
|
377
346
|
return {
|
|
378
347
|
objectItems,
|
|
379
348
|
primitiveItems,
|
|
380
|
-
allElements,
|
|
381
349
|
parseError: false
|
|
382
350
|
};
|
|
383
351
|
}, [value]);
|
|
@@ -386,158 +354,77 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
386
354
|
}, [parseError]);
|
|
387
355
|
const isPrimitive = primitiveItems.length > 0 && objectItems.length === 0;
|
|
388
356
|
const selection = useMultiSelect(isPrimitive ? primitiveItems.length : objectItems.length);
|
|
389
|
-
const
|
|
390
|
-
|
|
391
|
-
if (!ast) {
|
|
357
|
+
const commit = (next) => {
|
|
358
|
+
if (next === null) {
|
|
392
359
|
Toast.error("Failed to update this item", { description: "Check the console for details." });
|
|
393
360
|
return;
|
|
394
361
|
}
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
if (!newNode) return;
|
|
400
|
-
elements[index] = newNode;
|
|
401
|
-
onChange?.(generateCode(import_lib$1.arrayExpression(elements)));
|
|
362
|
+
onChange?.(next);
|
|
363
|
+
};
|
|
364
|
+
const elementIndicesOf = (items, indices) => {
|
|
365
|
+
return new Set(items.filter((item) => indices.has(item.index)).map((item) => item.elementIndex));
|
|
402
366
|
};
|
|
403
|
-
const
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
367
|
+
const updatePrimitive = (elementIndex, next) => {
|
|
368
|
+
commit(updateArrayItemValue(value, elementIndex, next));
|
|
369
|
+
};
|
|
370
|
+
const movePrimitive = (from, to) => {
|
|
371
|
+
const target = primitiveItems.find((item) => item.index === to);
|
|
372
|
+
if (!target) return;
|
|
373
|
+
commit(moveArrayItem(value, from, target.elementIndex));
|
|
374
|
+
selection.clear();
|
|
408
375
|
};
|
|
409
376
|
const deleteSelectedPrimitives = (indices) => {
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
377
|
+
commit(removeArrayItems(value, elementIndicesOf(primitiveItems, indices), "primitive"));
|
|
378
|
+
};
|
|
379
|
+
const deletePrimitive = (elementIndex) => {
|
|
380
|
+
commit(removeArrayItems(value, /* @__PURE__ */ new Set([elementIndex]), "primitive"));
|
|
381
|
+
selection.clear();
|
|
413
382
|
};
|
|
414
|
-
const deletePrimitive = (index) => deleteSelectedPrimitives(/* @__PURE__ */ new Set([index]));
|
|
415
383
|
const addPrimitive = () => {
|
|
416
|
-
|
|
417
|
-
if (!first) return;
|
|
418
|
-
const newNode = createNodeFromValue(first.type, first.value);
|
|
419
|
-
if (!newNode) return;
|
|
420
|
-
onChange?.(generateCode(import_lib$1.arrayExpression([...allElements, newNode])));
|
|
384
|
+
commit(appendArrayItem(value, "primitive"));
|
|
421
385
|
};
|
|
422
386
|
const duplicateSelectedPrimitives = (indices) => {
|
|
423
|
-
|
|
424
|
-
if (clones.length === 0) return;
|
|
425
|
-
onChange?.(generateCode(import_lib$1.arrayExpression([...allElements, ...clones])));
|
|
387
|
+
commit(duplicateArrayItems(value, elementIndicesOf(primitiveItems, indices)));
|
|
426
388
|
};
|
|
427
389
|
const moveSelectedPrimitives = (indices, direction) => {
|
|
428
|
-
const
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
};
|
|
432
|
-
const moveItem = (fromIndex, toIndex) => {
|
|
433
|
-
const nextItems = [...objectItems];
|
|
434
|
-
const [movedItem] = nextItems.splice(fromIndex, 1);
|
|
435
|
-
nextItems.splice(toIndex, 0, movedItem);
|
|
436
|
-
const nextValue = arrayExpressionToCode(nextItems.map((item) => item.originalElement));
|
|
437
|
-
onChange?.(nextValue);
|
|
438
|
-
};
|
|
439
|
-
const updateProperty = (itemIndex, propertyKey, value) => {
|
|
440
|
-
const item = objectItems[itemIndex];
|
|
441
|
-
const property = item.editableProperties[propertyKey];
|
|
442
|
-
const renderLeaf = render?.[propertyKey] && "type" in render[propertyKey] ? render[propertyKey] : null;
|
|
443
|
-
const isJsx = renderLeaf?.type === "jsx";
|
|
444
|
-
const isInnerHTML = renderLeaf?.property === BINDING_PROP.INNER_HTML;
|
|
445
|
-
let nextAstValue = null;
|
|
446
|
-
if (isInnerHTML) {
|
|
447
|
-
const str = String(value);
|
|
448
|
-
nextAstValue = import_lib$1.templateLiteral([import_lib$1.templateElement({
|
|
449
|
-
raw: str,
|
|
450
|
-
cooked: str
|
|
451
|
-
}, true)], []);
|
|
452
|
-
} else if (property.type === "array" || property.type === "object") try {
|
|
453
|
-
nextAstValue = (0, import_lib.parseExpression)(String(value), { plugins: ["jsx", "typescript"] });
|
|
454
|
-
} catch {
|
|
390
|
+
const result = moveArrayItems(value, elementIndicesOf(primitiveItems, indices), direction);
|
|
391
|
+
if (!result) {
|
|
392
|
+
commit(null);
|
|
455
393
|
return;
|
|
456
394
|
}
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
const
|
|
462
|
-
if (
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
} else targetProperty.value = import_lib$1.stringLiteral(trimmed);
|
|
469
|
-
} else if (targetProperty && nextAstValue) targetProperty.value = nextAstValue;
|
|
470
|
-
objectItems.forEach((obj) => {
|
|
471
|
-
obj.originalElement.properties.forEach((prop) => {
|
|
472
|
-
if (!import_lib$1.isObjectProperty(prop) || !import_lib$1.isIdentifier(prop.key)) return;
|
|
473
|
-
if (import_lib$1.isJSXElement(prop.value) || import_lib$1.isJSXFragment(prop.value)) {
|
|
474
|
-
const placeholder = `__JSX_${nanoid(6)}__`;
|
|
475
|
-
jsxPlaceholders.set(placeholder, generateCode(prop.value));
|
|
476
|
-
originalValues.set(prop, prop.value);
|
|
477
|
-
prop.value = import_lib$1.identifier(placeholder);
|
|
478
|
-
}
|
|
479
|
-
});
|
|
480
|
-
});
|
|
481
|
-
let nextValue = arrayExpressionToCode(objectItems.map((item) => item.originalElement));
|
|
482
|
-
for (const [prop, original] of originalValues) prop.value = original;
|
|
483
|
-
for (const [placeholder, code] of jsxPlaceholders) nextValue = nextValue.replace(placeholder, () => code);
|
|
484
|
-
onChange?.(nextValue);
|
|
395
|
+
selection.replace(result.indices);
|
|
396
|
+
commit(result.code);
|
|
397
|
+
};
|
|
398
|
+
const moveItem = (from, to) => {
|
|
399
|
+
const target = objectItems.find((item) => item.index === to);
|
|
400
|
+
if (!target) return;
|
|
401
|
+
commit(moveArrayItem(value, from, target.elementIndex));
|
|
402
|
+
selection.clear();
|
|
403
|
+
};
|
|
404
|
+
const updateProperty = (elementIndex, propertyKey, next) => {
|
|
405
|
+
commit(updateArrayItemProperty(value, elementIndex, propertyKey, next, render));
|
|
485
406
|
};
|
|
486
407
|
const deleteSelectedItems = (indices) => {
|
|
487
|
-
|
|
488
|
-
const nextItems = removeIndices(objectItems, indices);
|
|
489
|
-
const nextValue = arrayExpressionToCode(nextItems.map((item) => item.originalElement));
|
|
490
|
-
onChange?.(nextValue);
|
|
408
|
+
commit(removeArrayItems(value, elementIndicesOf(objectItems, indices), "object"));
|
|
491
409
|
};
|
|
492
|
-
const deleteItem = (
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
clonedElement.properties.forEach((prop) => {
|
|
496
|
-
if (import_lib$1.isObjectProperty(prop) && import_lib$1.isIdentifier(prop.key)) {
|
|
497
|
-
const key = prop.key.name;
|
|
498
|
-
const editableProp = source.editableProperties[key];
|
|
499
|
-
if (key === "key" && import_lib$1.isStringLiteral(prop.value)) {
|
|
500
|
-
const uniqueKey = `${prop.value.value}-${nanoid(6)}`;
|
|
501
|
-
prop.value = import_lib$1.stringLiteral(uniqueKey);
|
|
502
|
-
return;
|
|
503
|
-
}
|
|
504
|
-
if (editableProp) {
|
|
505
|
-
const nextValue = createNodeFromValue(editableProp.type, editableProp.value);
|
|
506
|
-
if (nextValue) prop.value = nextValue;
|
|
507
|
-
}
|
|
508
|
-
}
|
|
509
|
-
});
|
|
510
|
-
return clonedElement;
|
|
410
|
+
const deleteItem = (elementIndex) => {
|
|
411
|
+
commit(removeArrayItems(value, /* @__PURE__ */ new Set([elementIndex]), "object"));
|
|
412
|
+
selection.clear();
|
|
511
413
|
};
|
|
512
414
|
const addItem = () => {
|
|
513
|
-
|
|
514
|
-
if (!firstItem) return;
|
|
515
|
-
const clonedElement = cloneObjectItemElement(firstItem);
|
|
516
|
-
const editableProperties = extractObjectProperties(clonedElement);
|
|
517
|
-
const nextItems = [...objectItems];
|
|
518
|
-
const newItemData = {
|
|
519
|
-
id: nanoid(6),
|
|
520
|
-
index: nextItems.length,
|
|
521
|
-
editableProperties,
|
|
522
|
-
originalElement: clonedElement,
|
|
523
|
-
jsxBindings: {}
|
|
524
|
-
};
|
|
525
|
-
nextItems.push(newItemData);
|
|
526
|
-
const nextValue = arrayExpressionToCode(nextItems.map((item) => item.originalElement));
|
|
527
|
-
onChange?.(nextValue);
|
|
415
|
+
commit(appendArrayItem(value, "object"));
|
|
528
416
|
};
|
|
529
417
|
const duplicateSelectedItems = (indices) => {
|
|
530
|
-
|
|
531
|
-
if (sources.length === 0) return;
|
|
532
|
-
const clonedElements = sources.map(cloneObjectItemElement);
|
|
533
|
-
const nextValue = arrayExpressionToCode([...objectItems.map((item) => item.originalElement), ...clonedElements]);
|
|
534
|
-
onChange?.(nextValue);
|
|
418
|
+
commit(duplicateArrayItems(value, elementIndicesOf(objectItems, indices)));
|
|
535
419
|
};
|
|
536
420
|
const moveSelectedItems = (indices, direction) => {
|
|
537
|
-
const
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
421
|
+
const result = moveArrayItems(value, elementIndicesOf(objectItems, indices), direction);
|
|
422
|
+
if (!result) {
|
|
423
|
+
commit(null);
|
|
424
|
+
return;
|
|
425
|
+
}
|
|
426
|
+
selection.replace(result.indices);
|
|
427
|
+
commit(result.code);
|
|
541
428
|
};
|
|
542
429
|
if (isPrimitive) return /* @__PURE__ */ jsxs("div", {
|
|
543
430
|
className: "space-y-4",
|
|
@@ -589,20 +476,20 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
589
476
|
size: "small",
|
|
590
477
|
icon: /* @__PURE__ */ jsx(ArrowUp, {}),
|
|
591
478
|
disabled: i === 0,
|
|
592
|
-
onClick: () => movePrimitive(item.
|
|
479
|
+
onClick: () => movePrimitive(item.elementIndex, item.index - 1)
|
|
593
480
|
}),
|
|
594
481
|
/* @__PURE__ */ jsx(Button, {
|
|
595
482
|
size: "small",
|
|
596
483
|
icon: /* @__PURE__ */ jsx(ArrowDown, {}),
|
|
597
484
|
disabled: i === primitiveItems.length - 1,
|
|
598
|
-
onClick: () => movePrimitive(item.
|
|
485
|
+
onClick: () => movePrimitive(item.elementIndex, item.index + 1)
|
|
599
486
|
}),
|
|
600
487
|
/* @__PURE__ */ jsx(Button, {
|
|
601
488
|
danger: true,
|
|
602
489
|
size: "small",
|
|
603
490
|
icon: /* @__PURE__ */ jsx(X, {}),
|
|
604
491
|
disabled: primitiveItems.length <= 1,
|
|
605
|
-
onClick: () => deletePrimitive(item.
|
|
492
|
+
onClick: () => deletePrimitive(item.elementIndex)
|
|
606
493
|
})
|
|
607
494
|
]
|
|
608
495
|
})]
|
|
@@ -613,7 +500,7 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
613
500
|
property: item.type,
|
|
614
501
|
value: item.value ?? "",
|
|
615
502
|
rawValue: String(item.value ?? ""),
|
|
616
|
-
onChange: (next) => updatePrimitive(item.
|
|
503
|
+
onChange: (next) => updatePrimitive(item.elementIndex, next)
|
|
617
504
|
},
|
|
618
505
|
onNodeChange: onChildChange
|
|
619
506
|
})]
|
|
@@ -678,20 +565,20 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
678
565
|
size: "small",
|
|
679
566
|
icon: /* @__PURE__ */ jsx(ArrowUp, {}),
|
|
680
567
|
disabled: item.index === 0,
|
|
681
|
-
onClick: () => moveItem(item.
|
|
568
|
+
onClick: () => moveItem(item.elementIndex, item.index - 1)
|
|
682
569
|
}),
|
|
683
570
|
/* @__PURE__ */ jsx(Button, {
|
|
684
571
|
size: "small",
|
|
685
572
|
icon: /* @__PURE__ */ jsx(ArrowDown, {}),
|
|
686
573
|
disabled: item.index === objectItems.length - 1,
|
|
687
|
-
onClick: () => moveItem(item.
|
|
574
|
+
onClick: () => moveItem(item.elementIndex, item.index + 1)
|
|
688
575
|
}),
|
|
689
576
|
/* @__PURE__ */ jsx(Button, {
|
|
690
577
|
danger: true,
|
|
691
578
|
size: "small",
|
|
692
579
|
icon: /* @__PURE__ */ jsx(X, {}),
|
|
693
580
|
disabled: objectItems.length <= 1,
|
|
694
|
-
onClick: () => deleteItem(item.
|
|
581
|
+
onClick: () => deleteItem(item.elementIndex)
|
|
695
582
|
})
|
|
696
583
|
]
|
|
697
584
|
})]
|
|
@@ -712,7 +599,7 @@ const Items = ({ value, render, onChange, onChildChange }) => {
|
|
|
712
599
|
render: render?.[key] && "type" in render[key] ? render[key].render : render?.[key] && !("type" in render[key]) ? render[key] : void 0,
|
|
713
600
|
value: parseValue(String(prop.value)),
|
|
714
601
|
rawValue: String(prop.value),
|
|
715
|
-
onChange: (next) => updateProperty(item.
|
|
602
|
+
onChange: (next) => updateProperty(item.elementIndex, key, next)
|
|
716
603
|
},
|
|
717
604
|
onNodeChange: onChildChange
|
|
718
605
|
})]
|
|
@@ -1061,6 +948,12 @@ const ColorPickerField = ({ value, onChange }) => {
|
|
|
1061
948
|
const Field = ({ binding, onNodeChange }) => {
|
|
1062
949
|
const { id, value, rawValue, onChange } = binding;
|
|
1063
950
|
const [validationError, setValidationError] = useState(null);
|
|
951
|
+
const [text, setText] = useState(rawValue);
|
|
952
|
+
const [prevRawValue, setPrevRawValue] = useState(rawValue);
|
|
953
|
+
if (rawValue !== prevRawValue) {
|
|
954
|
+
setPrevRawValue(rawValue);
|
|
955
|
+
setText(rawValue);
|
|
956
|
+
}
|
|
1064
957
|
if (binding.property === "items" || binding.property === "data" || binding.type === "array") return /* @__PURE__ */ jsx(Items, {
|
|
1065
958
|
value: rawValue,
|
|
1066
959
|
render: binding.render,
|
|
@@ -1139,7 +1032,7 @@ const Field = ({ binding, onNodeChange }) => {
|
|
|
1139
1032
|
onChange
|
|
1140
1033
|
});
|
|
1141
1034
|
if (binding.type === "date") return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(DatePicker, {
|
|
1142
|
-
|
|
1035
|
+
value: parseDateValue(stringValue),
|
|
1143
1036
|
onChange: (date) => {
|
|
1144
1037
|
const next = date ? formatDateValue(date) : "";
|
|
1145
1038
|
const result = validateBindingValue(binding, next);
|
|
@@ -1156,7 +1049,8 @@ const Field = ({ binding, onNodeChange }) => {
|
|
|
1156
1049
|
})] });
|
|
1157
1050
|
if (binding.type === "url") return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Input, {
|
|
1158
1051
|
type: "url",
|
|
1159
|
-
|
|
1052
|
+
value: text,
|
|
1053
|
+
onChange: (e) => setText(e.target.value),
|
|
1160
1054
|
placeholder: "https://example.com",
|
|
1161
1055
|
onBlur: (e) => {
|
|
1162
1056
|
const next = e.target.value.trim();
|
|
@@ -1198,7 +1092,8 @@ const Field = ({ binding, onNodeChange }) => {
|
|
|
1198
1092
|
className: "space-y-2",
|
|
1199
1093
|
children: [
|
|
1200
1094
|
/* @__PURE__ */ jsx(Input, {
|
|
1201
|
-
|
|
1095
|
+
value: text,
|
|
1096
|
+
onChange: (e) => setText(e.target.value),
|
|
1202
1097
|
placeholder: "Enter an image URL",
|
|
1203
1098
|
onBlur: (e) => {
|
|
1204
1099
|
const next = e.target.value.trim();
|
|
@@ -1230,7 +1125,8 @@ const Field = ({ binding, onNodeChange }) => {
|
|
|
1230
1125
|
}
|
|
1231
1126
|
if (binding.type === "number" || typeof value === "number") return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Input, {
|
|
1232
1127
|
type: "number",
|
|
1233
|
-
|
|
1128
|
+
value: text,
|
|
1129
|
+
onChange: (e) => setText(e.target.value),
|
|
1234
1130
|
placeholder: "Enter a numeric value",
|
|
1235
1131
|
onBlur: (e) => {
|
|
1236
1132
|
const raw = e.target.value.trim();
|
|
@@ -1248,7 +1144,8 @@ const Field = ({ binding, onNodeChange }) => {
|
|
|
1248
1144
|
children: validationError
|
|
1249
1145
|
})] });
|
|
1250
1146
|
return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Input.TextArea, {
|
|
1251
|
-
|
|
1147
|
+
value: text,
|
|
1148
|
+
onChange: (e) => setText(e.target.value),
|
|
1252
1149
|
placeholder: "Enter a value",
|
|
1253
1150
|
onBlur: (e) => {
|
|
1254
1151
|
const raw = e.target.value.trim();
|
|
@@ -1688,4 +1585,4 @@ Dnd.DefaultPanel = Panel;
|
|
|
1688
1585
|
//#endregion
|
|
1689
1586
|
export { DraggableItem as a, ICON_OPTIONS as i, Panel as n, ICON_MAP as r, Dnd as t };
|
|
1690
1587
|
|
|
1691
|
-
//# sourceMappingURL=dnd-
|
|
1588
|
+
//# sourceMappingURL=dnd-E8LbmRfE.js.map
|