camox 0.9.0 → 0.10.0

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 (43) hide show
  1. package/dist/core/components/lexical/SidebarLexicalEditor.js +2 -1
  2. package/dist/core/createApp.d.ts +231 -209
  3. package/dist/core/createApp.js +17 -17
  4. package/dist/core/createBlock.d.ts +74 -72
  5. package/dist/core/createBlock.js +274 -267
  6. package/dist/core/createLayout.d.ts +100 -80
  7. package/dist/core/createLayout.js +93 -65
  8. package/dist/features/preview/CamoxPreview.js +76 -54
  9. package/dist/features/preview/components/AddBlockSheet.js +12 -12
  10. package/dist/features/preview/components/AssetFieldEditor.js +1 -1
  11. package/dist/features/preview/components/AssetLightbox.js +1 -1
  12. package/dist/features/preview/components/AssetPickerGrid.js +1 -1
  13. package/dist/features/preview/components/BlockActionsPopover.js +26 -26
  14. package/dist/features/preview/components/BlockErrorBoundary.js +59 -0
  15. package/dist/features/preview/components/{CreatePageSheet.js → CreatePageModal.js} +16 -18
  16. package/dist/features/preview/components/{EditPageSheet.js → EditPageModal.js} +32 -25
  17. package/dist/features/preview/components/Frame.js +1 -1
  18. package/dist/features/preview/components/ItemFieldsEditor.js +134 -98
  19. package/dist/features/preview/components/LinkFieldEditor.js +166 -146
  20. package/dist/features/preview/components/PageContentSheet.js +42 -37
  21. package/dist/features/preview/components/PageLocationFieldset.js +28 -26
  22. package/dist/features/preview/components/PagePicker.js +15 -8
  23. package/dist/features/preview/components/PageTree.js +337 -351
  24. package/dist/features/preview/components/PeekedBlock.js +38 -26
  25. package/dist/features/preview/components/PreviewPanel.js +16 -2
  26. package/dist/features/preview/components/PreviewSideSheet.js +26 -42
  27. package/dist/features/preview/components/RepeatableItemsList.js +7 -7
  28. package/dist/features/preview/previewStore.js +7 -7
  29. package/dist/features/provider/CamoxProvider.js +41 -9
  30. package/dist/features/routes/ogRoute.js +2 -2
  31. package/dist/features/routes/pageRoute.js +1 -1
  32. package/dist/features/studio/components/EnvironmentMenu.js +2 -2
  33. package/dist/features/studio/components/UserButton.js +49 -34
  34. package/dist/features/vite/blockBoilerplate.js +2 -1
  35. package/dist/features/vite/definitionsSync.js +53 -22
  36. package/dist/features/vite/routeGeneration.js +1 -0
  37. package/dist/features/vite/vite.js +51 -7
  38. package/dist/lib/auth.js +6 -4
  39. package/dist/lib/use-project-room.js +25 -13
  40. package/dist/studio-overlays.css +34 -0
  41. package/dist/studio.css +1 -1
  42. package/package.json +4 -4
  43. package/skills/camox-layout/SKILL.md +34 -30
@@ -139,21 +139,21 @@ const FieldItem = (t0) => {
139
139
  const BlockFields = (t0) => {
140
140
  const $ = c(2);
141
141
  const { block } = t0;
142
- const schemaProperties = useCamoxApp().getBlockById(block.type)?.contentSchema.properties;
142
+ const schemaProperties = useCamoxApp().getBlockById(block.type)?._internal.contentSchema.properties;
143
143
  const selection = useSelector(previewStore, _temp3);
144
144
  const iframeElement = useSelector(previewStore, _temp4);
145
- const selectedFieldName = selection?.type === "block-field" && selection.blockId === String(block.id) ? selection.fieldName : null;
145
+ const selectedFieldName = selection?.type === "block-field" && selection.blockId === block.id ? selection.fieldName : null;
146
146
  const handleFieldClick = (fieldName, fieldType) => {
147
147
  previewStore.send({
148
148
  type: "selectBlockField",
149
- blockId: String(block.id),
149
+ blockId: block.id,
150
150
  fieldName,
151
151
  fieldType
152
152
  });
153
153
  };
154
154
  const handleFieldDoubleClick = (fieldName_0, fieldType_0) => {
155
155
  fieldTypesDictionary[fieldType_0].onTreeDoubleClick({
156
- blockId: String(block.id),
156
+ blockId: block.id,
157
157
  fieldName: fieldName_0
158
158
  });
159
159
  };
@@ -191,7 +191,7 @@ const BlockFields = (t0) => {
191
191
  iframeElement.contentWindow.postMessage(message_2, "*");
192
192
  }
193
193
  };
194
- const t1 = "my-1 space-y-1 pr-1 pl-7";
194
+ const t1 = "my-1 space-y-1 pl-7";
195
195
  const t2 = Object.keys(schemaProperties ?? {}).map((fieldName_3) => {
196
196
  const value = block.content[fieldName_3];
197
197
  const fieldSchema = schemaProperties?.[fieldName_3];
@@ -222,15 +222,15 @@ const BlockFields = (t0) => {
222
222
  } else t3 = $[1];
223
223
  return t3;
224
224
  };
225
- function useBlockTreeItem(block, isSelected, t0) {
226
- const $ = c(17);
225
+ function useBlockTreeItem(block, t0) {
226
+ const $ = c(16);
227
227
  const isDragging = t0 === void 0 ? false : t0;
228
228
  const [ellipsisPopoverOpen, setEllipsisPopoverOpen] = React.useState(false);
229
229
  const selection = useSelector(previewStore, _temp5);
230
230
  const iframeElement = useSelector(previewStore, _temp6);
231
- const isParentOfSelection = isSelected && selection != null && selection.type !== "block";
232
- const shouldShowHover = !isDragging && !isSelected;
233
- const shouldShowActive = isDragging || isSelected && !isParentOfSelection;
231
+ const isBlockSelected = selection?.type === "block" && selection.blockId === block.id;
232
+ const shouldShowHover = !isDragging && !isBlockSelected;
233
+ const shouldShowActive = isDragging || isBlockSelected;
234
234
  let t1;
235
235
  if ($[0] !== block || $[1] !== iframeElement) {
236
236
  t1 = () => {
@@ -262,25 +262,24 @@ function useBlockTreeItem(block, isSelected, t0) {
262
262
  } else t2 = $[5];
263
263
  const handleBlockMouseLeave = t2;
264
264
  let t3;
265
- if ($[6] !== block || $[7] !== isSelected) {
265
+ if ($[6] !== block || $[7] !== isBlockSelected) {
266
266
  t3 = () => {
267
- if (isSelected) previewStore.send({ type: "clearSelection" });
267
+ if (isBlockSelected) previewStore.send({ type: "clearSelection" });
268
268
  else previewStore.send({
269
269
  type: "setFocusedBlock",
270
- blockId: String(block.id)
270
+ blockId: block.id
271
271
  });
272
272
  };
273
273
  $[6] = block;
274
- $[7] = isSelected;
274
+ $[7] = isBlockSelected;
275
275
  $[8] = t3;
276
276
  } else t3 = $[8];
277
277
  const toggleSelection = t3;
278
278
  let t4;
279
- if ($[9] !== ellipsisPopoverOpen || $[10] !== handleBlockMouseEnter || $[11] !== handleBlockMouseLeave || $[12] !== isParentOfSelection || $[13] !== shouldShowActive || $[14] !== shouldShowHover || $[15] !== toggleSelection) {
279
+ if ($[9] !== ellipsisPopoverOpen || $[10] !== handleBlockMouseEnter || $[11] !== handleBlockMouseLeave || $[12] !== shouldShowActive || $[13] !== shouldShowHover || $[14] !== toggleSelection) {
280
280
  t4 = {
281
281
  ellipsisPopoverOpen,
282
282
  setEllipsisPopoverOpen,
283
- isParentOfSelection,
284
283
  shouldShowHover,
285
284
  shouldShowActive,
286
285
  handleBlockMouseEnter,
@@ -290,12 +289,11 @@ function useBlockTreeItem(block, isSelected, t0) {
290
289
  $[9] = ellipsisPopoverOpen;
291
290
  $[10] = handleBlockMouseEnter;
292
291
  $[11] = handleBlockMouseLeave;
293
- $[12] = isParentOfSelection;
294
- $[13] = shouldShowActive;
295
- $[14] = shouldShowHover;
296
- $[15] = toggleSelection;
297
- $[16] = t4;
298
- } else t4 = $[16];
292
+ $[12] = shouldShowActive;
293
+ $[13] = shouldShowHover;
294
+ $[14] = toggleSelection;
295
+ $[15] = t4;
296
+ } else t4 = $[15];
299
297
  return t4;
300
298
  }
301
299
  function _temp6(state_0) {
@@ -305,60 +303,55 @@ function _temp5(state) {
305
303
  return state.context.selection;
306
304
  }
307
305
  const BlockTreeItemHeader = (t0) => {
308
- const $ = c(18);
306
+ const $ = c(16);
309
307
  let children;
310
308
  let className;
311
- let isParentOfSelection;
312
309
  let props;
313
310
  let ref;
314
311
  let shouldShowActive;
315
312
  let shouldShowHover;
316
313
  if ($[0] !== t0) {
317
- ({children, shouldShowHover, shouldShowActive, isParentOfSelection, className, ref, ...props} = t0);
314
+ ({children, shouldShowHover, shouldShowActive, className, ref, ...props} = t0);
318
315
  $[0] = t0;
319
316
  $[1] = children;
320
317
  $[2] = className;
321
- $[3] = isParentOfSelection;
322
- $[4] = props;
323
- $[5] = ref;
324
- $[6] = shouldShowActive;
325
- $[7] = shouldShowHover;
318
+ $[3] = props;
319
+ $[4] = ref;
320
+ $[5] = shouldShowActive;
321
+ $[6] = shouldShowHover;
326
322
  } else {
327
323
  children = $[1];
328
324
  className = $[2];
329
- isParentOfSelection = $[3];
330
- props = $[4];
331
- ref = $[5];
332
- shouldShowActive = $[6];
333
- shouldShowHover = $[7];
325
+ props = $[3];
326
+ ref = $[4];
327
+ shouldShowActive = $[5];
328
+ shouldShowHover = $[6];
334
329
  }
335
330
  const t1 = shouldShowHover && "hover:bg-accent/75";
336
331
  const t2 = shouldShowActive && "bg-accent text-accent-foreground";
337
- const t3 = isParentOfSelection && "bg-accent/25";
332
+ let t3;
333
+ if ($[7] !== className || $[8] !== t1 || $[9] !== t2) {
334
+ t3 = cn("flex flex-row justify-between items-center gap-1 px-1 max-w-full rounded-lg text-foreground transition-all hover:transition-none", t1, t2, "data-[open]:rounded-b-none", className);
335
+ $[7] = className;
336
+ $[8] = t1;
337
+ $[9] = t2;
338
+ $[10] = t3;
339
+ } else t3 = $[10];
338
340
  let t4;
339
- if ($[8] !== className || $[9] !== t1 || $[10] !== t2 || $[11] !== t3) {
340
- t4 = cn("flex flex-row justify-between items-center gap-1 px-1 max-w-full rounded-lg text-foreground transition-all hover:transition-none", t1, t2, t3, "data-[open]:rounded-b-none", className);
341
- $[8] = className;
342
- $[9] = t1;
343
- $[10] = t2;
344
- $[11] = t3;
345
- $[12] = t4;
346
- } else t4 = $[12];
347
- let t5;
348
- if ($[13] !== children || $[14] !== props || $[15] !== ref || $[16] !== t4) {
349
- t5 = /* @__PURE__ */ jsx("div", {
341
+ if ($[11] !== children || $[12] !== props || $[13] !== ref || $[14] !== t3) {
342
+ t4 = /* @__PURE__ */ jsx("div", {
350
343
  ref,
351
- className: t4,
344
+ className: t3,
352
345
  ...props,
353
346
  children
354
347
  });
355
- $[13] = children;
356
- $[14] = props;
357
- $[15] = ref;
358
- $[16] = t4;
359
- $[17] = t5;
360
- } else t5 = $[17];
361
- return t5;
348
+ $[11] = children;
349
+ $[12] = props;
350
+ $[13] = ref;
351
+ $[14] = t3;
352
+ $[15] = t4;
353
+ } else t4 = $[15];
354
+ return t4;
362
355
  };
363
356
  const BlockTreeItemTrigger = (t0) => {
364
357
  const $ = c(4);
@@ -435,7 +428,7 @@ const BlockTreeItemContent = (t0) => {
435
428
  let t1;
436
429
  if ($[0] !== block) {
437
430
  t1 = /* @__PURE__ */ jsx(Accordion.Panel, {
438
- className: "text-muted-foreground data-[open]:bg-accent/25 h-[var(--accordion-panel-height)] overflow-hidden rounded-b-lg text-sm transition-[height] duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0",
431
+ className: "text-muted-foreground h-[var(--accordion-panel-height)] overflow-hidden rounded-b-lg text-sm transition-[height] duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0",
439
432
  children: /* @__PURE__ */ jsx(BlockFields, { block })
440
433
  });
441
434
  $[0] = block;
@@ -449,8 +442,8 @@ const animateLayoutChanges = (args) => {
449
442
  return defaultAnimateLayoutChanges(args);
450
443
  };
451
444
  const SortableBlock = (t0) => {
452
- const $ = c(51);
453
- const { block, isSelected } = t0;
445
+ const $ = c(52);
446
+ const { block } = t0;
454
447
  const [gripPopoverOpen, setGripPopoverOpen] = React.useState(false);
455
448
  const t1 = String(block.id);
456
449
  let t2;
@@ -483,156 +476,161 @@ const SortableBlock = (t0) => {
483
476
  $[7] = t5;
484
477
  } else t5 = $[7];
485
478
  const style = t5;
486
- const ctx = useBlockTreeItem(block, isSelected, isDragging);
479
+ const ctx = useBlockTreeItem(block, isDragging);
487
480
  let t6;
488
- if ($[8] !== block.id || $[9] !== isSelected) {
489
- t6 = isSelected ? [String(block.id)] : [];
481
+ if ($[8] !== block.id) {
482
+ t6 = (state) => state.context.selection?.blockId === block.id;
490
483
  $[8] = block.id;
491
- $[9] = isSelected;
492
- $[10] = t6;
493
- } else t6 = $[10];
494
- const t7 = String(block.id);
495
- let t8;
496
- if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
497
- t8 = /* @__PURE__ */ jsx("div", {});
498
- $[11] = t8;
499
- } else t8 = $[11];
500
- let t10;
484
+ $[9] = t6;
485
+ } else t6 = $[9];
486
+ const isBlockFocused = useSelector(previewStore, t6);
487
+ let t7;
488
+ if ($[10] !== block.id || $[11] !== isBlockFocused) {
489
+ t7 = isBlockFocused ? [String(block.id)] : [];
490
+ $[10] = block.id;
491
+ $[11] = isBlockFocused;
492
+ $[12] = t7;
493
+ } else t7 = $[12];
494
+ const t8 = String(block.id);
501
495
  let t9;
502
- if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
503
- t9 = /* @__PURE__ */ jsx("span", {
496
+ if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
497
+ t9 = /* @__PURE__ */ jsx("div", {});
498
+ $[13] = t9;
499
+ } else t9 = $[13];
500
+ let t10;
501
+ let t11;
502
+ if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
503
+ t10 = /* @__PURE__ */ jsx("span", {
504
504
  className: "sr-only",
505
505
  children: "Click and use arrow keys to reorder"
506
506
  });
507
- t10 = /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" });
508
- $[12] = t10;
509
- $[13] = t9;
507
+ t11 = /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4" });
508
+ $[14] = t10;
509
+ $[15] = t11;
510
510
  } else {
511
- t10 = $[12];
512
- t9 = $[13];
511
+ t10 = $[14];
512
+ t11 = $[15];
513
513
  }
514
- let t11;
515
- if ($[14] !== attributes || $[15] !== listeners) {
516
- t11 = /* @__PURE__ */ jsxs(Button, {
514
+ let t12;
515
+ if ($[16] !== attributes || $[17] !== listeners) {
516
+ t12 = /* @__PURE__ */ jsxs(Button, {
517
517
  variant: "ghost",
518
518
  size: "icon-sm",
519
519
  className: "text-muted-foreground hover:text-foreground flex cursor-grab active:cursor-grabbing",
520
520
  ...attributes,
521
521
  ...listeners,
522
- children: [t9, t10]
522
+ children: [t10, t11]
523
523
  });
524
- $[14] = attributes;
525
- $[15] = listeners;
526
- $[16] = t11;
527
- } else t11 = $[16];
528
- let t12;
529
- if ($[17] !== block || $[18] !== gripPopoverOpen || $[19] !== t11) {
530
- t12 = /* @__PURE__ */ jsx(BlockActionsPopover, {
524
+ $[16] = attributes;
525
+ $[17] = listeners;
526
+ $[18] = t12;
527
+ } else t12 = $[18];
528
+ let t13;
529
+ if ($[19] !== block || $[20] !== gripPopoverOpen || $[21] !== t12) {
530
+ t13 = /* @__PURE__ */ jsx(BlockActionsPopover, {
531
531
  block,
532
532
  open: gripPopoverOpen,
533
533
  onOpenChange: setGripPopoverOpen,
534
- children: t11
535
- });
536
- $[17] = block;
537
- $[18] = gripPopoverOpen;
538
- $[19] = t11;
539
- $[20] = t12;
540
- } else t12 = $[20];
541
- const t13 = block.summary || block.type;
542
- let t14;
543
- if ($[21] !== ctx.toggleSelection || $[22] !== t13) {
544
- t14 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
545
- displayText: t13,
546
- onClick: ctx.toggleSelection
534
+ children: t12
547
535
  });
548
- $[21] = ctx.toggleSelection;
536
+ $[19] = block;
537
+ $[20] = gripPopoverOpen;
538
+ $[21] = t12;
549
539
  $[22] = t13;
550
- $[23] = t14;
551
- } else t14 = $[23];
540
+ } else t13 = $[22];
541
+ const t14 = block.summary || block.type;
552
542
  let t15;
553
- if ($[24] !== ctx.ellipsisPopoverOpen) {
554
- t15 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
555
- $[24] = ctx.ellipsisPopoverOpen;
543
+ if ($[23] !== ctx.toggleSelection || $[24] !== t14) {
544
+ t15 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
545
+ displayText: t14,
546
+ onClick: ctx.toggleSelection
547
+ });
548
+ $[23] = ctx.toggleSelection;
549
+ $[24] = t14;
556
550
  $[25] = t15;
557
551
  } else t15 = $[25];
558
552
  let t16;
559
- if ($[26] !== block || $[27] !== ctx.ellipsisPopoverOpen || $[28] !== ctx.setEllipsisPopoverOpen || $[29] !== t15) {
560
- t16 = /* @__PURE__ */ jsx(BlockActionsPopover, {
553
+ if ($[26] !== ctx.ellipsisPopoverOpen) {
554
+ t16 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
555
+ $[26] = ctx.ellipsisPopoverOpen;
556
+ $[27] = t16;
557
+ } else t16 = $[27];
558
+ let t17;
559
+ if ($[28] !== block || $[29] !== ctx.ellipsisPopoverOpen || $[30] !== ctx.setEllipsisPopoverOpen || $[31] !== t16) {
560
+ t17 = /* @__PURE__ */ jsx(BlockActionsPopover, {
561
561
  block,
562
562
  open: ctx.ellipsisPopoverOpen,
563
563
  onOpenChange: ctx.setEllipsisPopoverOpen,
564
- children: t15
564
+ children: t16
565
565
  });
566
- $[26] = block;
567
- $[27] = ctx.ellipsisPopoverOpen;
568
- $[28] = ctx.setEllipsisPopoverOpen;
569
- $[29] = t15;
570
- $[30] = t16;
571
- } else t16 = $[30];
572
- let t17;
573
- if ($[31] !== ctx.isParentOfSelection || $[32] !== ctx.shouldShowActive || $[33] !== ctx.shouldShowHover || $[34] !== t12 || $[35] !== t14 || $[36] !== t16) {
574
- t17 = /* @__PURE__ */ jsx(Accordion.Header, {
575
- render: t8,
566
+ $[28] = block;
567
+ $[29] = ctx.ellipsisPopoverOpen;
568
+ $[30] = ctx.setEllipsisPopoverOpen;
569
+ $[31] = t16;
570
+ $[32] = t17;
571
+ } else t17 = $[32];
572
+ let t18;
573
+ if ($[33] !== ctx.shouldShowActive || $[34] !== ctx.shouldShowHover || $[35] !== t13 || $[36] !== t15 || $[37] !== t17) {
574
+ t18 = /* @__PURE__ */ jsx(Accordion.Header, {
575
+ render: t9,
576
576
  children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
577
577
  shouldShowHover: ctx.shouldShowHover,
578
578
  shouldShowActive: ctx.shouldShowActive,
579
- isParentOfSelection: ctx.isParentOfSelection,
580
579
  children: [
581
- t12,
582
- t14,
583
- t16
580
+ t13,
581
+ t15,
582
+ t17
584
583
  ]
585
584
  })
586
585
  });
587
- $[31] = ctx.isParentOfSelection;
588
- $[32] = ctx.shouldShowActive;
589
- $[33] = ctx.shouldShowHover;
590
- $[34] = t12;
591
- $[35] = t14;
592
- $[36] = t16;
586
+ $[33] = ctx.shouldShowActive;
587
+ $[34] = ctx.shouldShowHover;
588
+ $[35] = t13;
589
+ $[36] = t15;
593
590
  $[37] = t17;
594
- } else t17 = $[37];
595
- let t18;
596
- if ($[38] !== block) {
597
- t18 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
598
- $[38] = block;
599
- $[39] = t18;
600
- } else t18 = $[39];
591
+ $[38] = t18;
592
+ } else t18 = $[38];
601
593
  let t19;
602
- if ($[40] !== ctx.handleBlockMouseEnter || $[41] !== ctx.handleBlockMouseLeave || $[42] !== setNodeRef || $[43] !== style || $[44] !== t17 || $[45] !== t18 || $[46] !== t7) {
603
- t19 = /* @__PURE__ */ jsxs(Accordion.Item, {
604
- value: t7,
594
+ if ($[39] !== block) {
595
+ t19 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
596
+ $[39] = block;
597
+ $[40] = t19;
598
+ } else t19 = $[40];
599
+ let t20;
600
+ if ($[41] !== ctx.handleBlockMouseEnter || $[42] !== ctx.handleBlockMouseLeave || $[43] !== setNodeRef || $[44] !== style || $[45] !== t18 || $[46] !== t19 || $[47] !== t8) {
601
+ t20 = /* @__PURE__ */ jsxs(Accordion.Item, {
602
+ value: t8,
605
603
  ref: setNodeRef,
606
604
  style,
607
605
  className: "group",
608
606
  onMouseEnter: ctx.handleBlockMouseEnter,
609
607
  onMouseLeave: ctx.handleBlockMouseLeave,
610
- children: [t17, t18]
608
+ children: [t18, t19]
611
609
  });
612
- $[40] = ctx.handleBlockMouseEnter;
613
- $[41] = ctx.handleBlockMouseLeave;
614
- $[42] = setNodeRef;
615
- $[43] = style;
616
- $[44] = t17;
610
+ $[41] = ctx.handleBlockMouseEnter;
611
+ $[42] = ctx.handleBlockMouseLeave;
612
+ $[43] = setNodeRef;
613
+ $[44] = style;
617
614
  $[45] = t18;
618
- $[46] = t7;
619
- $[47] = t19;
620
- } else t19 = $[47];
621
- let t20;
622
- if ($[48] !== t19 || $[49] !== t6) {
623
- t20 = /* @__PURE__ */ jsx(Accordion.Root, {
624
- value: t6,
625
- children: t19
615
+ $[46] = t19;
616
+ $[47] = t8;
617
+ $[48] = t20;
618
+ } else t20 = $[48];
619
+ let t21;
620
+ if ($[49] !== t20 || $[50] !== t7) {
621
+ t21 = /* @__PURE__ */ jsx(Accordion.Root, {
622
+ value: t7,
623
+ children: t20
626
624
  });
627
- $[48] = t19;
628
- $[49] = t6;
629
- $[50] = t20;
630
- } else t20 = $[50];
631
- return t20;
625
+ $[49] = t20;
626
+ $[50] = t7;
627
+ $[51] = t21;
628
+ } else t21 = $[51];
629
+ return t21;
632
630
  };
633
631
  const LayoutBlockItem = (t0) => {
634
- const $ = c(42);
635
- const { block, isSelected, layoutName } = t0;
632
+ const $ = c(43);
633
+ const { block, layoutName } = t0;
636
634
  const camoxApp = useCamoxApp();
637
635
  let t1;
638
636
  if ($[0] !== block.type || $[1] !== camoxApp) {
@@ -642,149 +640,153 @@ const LayoutBlockItem = (t0) => {
642
640
  $[2] = t1;
643
641
  } else t1 = $[2];
644
642
  const blockDef = t1;
645
- const ctx = useBlockTreeItem(block, isSelected);
646
- const displayText = blockDef?.title ?? block.type;
643
+ const ctx = useBlockTreeItem(block);
644
+ const displayText = blockDef?._internal.title ?? block.type;
647
645
  let t2;
648
- if ($[3] !== block.id || $[4] !== isSelected) {
649
- t2 = isSelected ? [String(block.id)] : [];
646
+ if ($[3] !== block.id) {
647
+ t2 = (state) => state.context.selection?.blockId === block.id;
650
648
  $[3] = block.id;
651
- $[4] = isSelected;
652
- $[5] = t2;
653
- } else t2 = $[5];
654
- const t3 = String(block.id);
655
- let t4;
656
- if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
657
- t4 = /* @__PURE__ */ jsx("div", {});
658
- $[6] = t4;
659
- } else t4 = $[6];
649
+ $[4] = t2;
650
+ } else t2 = $[4];
651
+ const isBlockFocused = useSelector(previewStore, t2);
652
+ let t3;
653
+ if ($[5] !== block.id || $[6] !== isBlockFocused) {
654
+ t3 = isBlockFocused ? [String(block.id)] : [];
655
+ $[5] = block.id;
656
+ $[6] = isBlockFocused;
657
+ $[7] = t3;
658
+ } else t3 = $[7];
659
+ const t4 = String(block.id);
660
660
  let t5;
661
- if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
662
- t5 = /* @__PURE__ */ jsx(TooltipTrigger, { children: /* @__PURE__ */ jsx(LayoutTemplate, { className: "h-4 w-4" }) });
663
- $[7] = t5;
664
- } else t5 = $[7];
661
+ if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
662
+ t5 = /* @__PURE__ */ jsx("div", {});
663
+ $[8] = t5;
664
+ } else t5 = $[8];
665
665
  let t6;
666
- if ($[8] !== layoutName) {
667
- t6 = /* @__PURE__ */ jsx("span", {
668
- className: "font-semibold",
669
- children: layoutName
670
- });
671
- $[8] = layoutName;
666
+ if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
667
+ t6 = /* @__PURE__ */ jsx(TooltipTrigger, { children: /* @__PURE__ */ jsx(LayoutTemplate, { className: "h-4 w-4" }) });
672
668
  $[9] = t6;
673
669
  } else t6 = $[9];
674
670
  let t7;
675
- if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
676
- t7 = /* @__PURE__ */ jsx("br", {});
677
- $[10] = t7;
678
- } else t7 = $[10];
671
+ if ($[10] !== layoutName) {
672
+ t7 = /* @__PURE__ */ jsx("span", {
673
+ className: "font-semibold",
674
+ children: layoutName
675
+ });
676
+ $[10] = layoutName;
677
+ $[11] = t7;
678
+ } else t7 = $[11];
679
679
  let t8;
680
- if ($[11] !== t6) {
681
- t8 = /* @__PURE__ */ jsx("div", {
680
+ if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
681
+ t8 = /* @__PURE__ */ jsx("br", {});
682
+ $[12] = t8;
683
+ } else t8 = $[12];
684
+ let t9;
685
+ if ($[13] !== t7) {
686
+ t9 = /* @__PURE__ */ jsx("div", {
682
687
  className: "text-muted-foreground flex size-7 shrink-0 items-center justify-center",
683
- children: /* @__PURE__ */ jsxs(Tooltip, { children: [t5, /* @__PURE__ */ jsxs(TooltipContent, { children: [
688
+ children: /* @__PURE__ */ jsxs(Tooltip, { children: [t6, /* @__PURE__ */ jsxs(TooltipContent, { children: [
684
689
  "From ",
685
- t6,
686
- " layout.",
687
690
  t7,
691
+ " layout.",
692
+ t8,
688
693
  "Changing the content may affect other pages"
689
694
  ] })] })
690
695
  });
691
- $[11] = t6;
692
- $[12] = t8;
693
- } else t8 = $[12];
694
- let t9;
695
- if ($[13] !== ctx.toggleSelection || $[14] !== displayText) {
696
- t9 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
696
+ $[13] = t7;
697
+ $[14] = t9;
698
+ } else t9 = $[14];
699
+ let t10;
700
+ if ($[15] !== ctx.toggleSelection || $[16] !== displayText) {
701
+ t10 = /* @__PURE__ */ jsx(BlockTreeItemTrigger, {
697
702
  displayText,
698
703
  onClick: ctx.toggleSelection
699
704
  });
700
- $[13] = ctx.toggleSelection;
701
- $[14] = displayText;
702
- $[15] = t9;
703
- } else t9 = $[15];
704
- const t10 = block.placement;
705
- let t11;
706
- if ($[16] !== ctx.ellipsisPopoverOpen) {
707
- t11 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
708
- $[16] = ctx.ellipsisPopoverOpen;
709
- $[17] = t11;
710
- } else t11 = $[17];
705
+ $[15] = ctx.toggleSelection;
706
+ $[16] = displayText;
707
+ $[17] = t10;
708
+ } else t10 = $[17];
709
+ const t11 = block.placement;
711
710
  let t12;
712
- if ($[18] !== block || $[19] !== ctx.ellipsisPopoverOpen || $[20] !== ctx.setEllipsisPopoverOpen || $[21] !== t10 || $[22] !== t11) {
713
- t12 = /* @__PURE__ */ jsx(BlockActionsPopover, {
711
+ if ($[18] !== ctx.ellipsisPopoverOpen) {
712
+ t12 = /* @__PURE__ */ jsx(BlockTreeItemEllipsis, { open: ctx.ellipsisPopoverOpen });
713
+ $[18] = ctx.ellipsisPopoverOpen;
714
+ $[19] = t12;
715
+ } else t12 = $[19];
716
+ let t13;
717
+ if ($[20] !== block || $[21] !== ctx.ellipsisPopoverOpen || $[22] !== ctx.setEllipsisPopoverOpen || $[23] !== t11 || $[24] !== t12) {
718
+ t13 = /* @__PURE__ */ jsx(BlockActionsPopover, {
714
719
  block,
715
720
  open: ctx.ellipsisPopoverOpen,
716
721
  onOpenChange: ctx.setEllipsisPopoverOpen,
717
722
  isLayoutBlock: true,
718
- layoutPlacement: t10,
719
- children: t11
723
+ layoutPlacement: t11,
724
+ children: t12
720
725
  });
721
- $[18] = block;
722
- $[19] = ctx.ellipsisPopoverOpen;
723
- $[20] = ctx.setEllipsisPopoverOpen;
724
- $[21] = t10;
725
- $[22] = t11;
726
- $[23] = t12;
727
- } else t12 = $[23];
728
- let t13;
729
- if ($[24] !== ctx.isParentOfSelection || $[25] !== ctx.shouldShowActive || $[26] !== ctx.shouldShowHover || $[27] !== t12 || $[28] !== t8 || $[29] !== t9) {
730
- t13 = /* @__PURE__ */ jsx(Accordion.Header, {
731
- render: t4,
726
+ $[20] = block;
727
+ $[21] = ctx.ellipsisPopoverOpen;
728
+ $[22] = ctx.setEllipsisPopoverOpen;
729
+ $[23] = t11;
730
+ $[24] = t12;
731
+ $[25] = t13;
732
+ } else t13 = $[25];
733
+ let t14;
734
+ if ($[26] !== ctx.shouldShowActive || $[27] !== ctx.shouldShowHover || $[28] !== t10 || $[29] !== t13 || $[30] !== t9) {
735
+ t14 = /* @__PURE__ */ jsx(Accordion.Header, {
736
+ render: t5,
732
737
  children: /* @__PURE__ */ jsxs(BlockTreeItemHeader, {
733
738
  shouldShowHover: ctx.shouldShowHover,
734
739
  shouldShowActive: ctx.shouldShowActive,
735
- isParentOfSelection: ctx.isParentOfSelection,
736
740
  children: [
737
- t8,
738
741
  t9,
739
- t12
742
+ t10,
743
+ t13
740
744
  ]
741
745
  })
742
746
  });
743
- $[24] = ctx.isParentOfSelection;
744
- $[25] = ctx.shouldShowActive;
745
- $[26] = ctx.shouldShowHover;
746
- $[27] = t12;
747
- $[28] = t8;
748
- $[29] = t9;
749
- $[30] = t13;
750
- } else t13 = $[30];
751
- let t14;
752
- if ($[31] !== block) {
753
- t14 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
754
- $[31] = block;
755
- $[32] = t14;
756
- } else t14 = $[32];
747
+ $[26] = ctx.shouldShowActive;
748
+ $[27] = ctx.shouldShowHover;
749
+ $[28] = t10;
750
+ $[29] = t13;
751
+ $[30] = t9;
752
+ $[31] = t14;
753
+ } else t14 = $[31];
757
754
  let t15;
758
- if ($[33] !== ctx.handleBlockMouseEnter || $[34] !== ctx.handleBlockMouseLeave || $[35] !== t13 || $[36] !== t14 || $[37] !== t3) {
759
- t15 = /* @__PURE__ */ jsxs(Accordion.Item, {
760
- value: t3,
755
+ if ($[32] !== block) {
756
+ t15 = /* @__PURE__ */ jsx(BlockTreeItemContent, { block });
757
+ $[32] = block;
758
+ $[33] = t15;
759
+ } else t15 = $[33];
760
+ let t16;
761
+ if ($[34] !== ctx.handleBlockMouseEnter || $[35] !== ctx.handleBlockMouseLeave || $[36] !== t14 || $[37] !== t15 || $[38] !== t4) {
762
+ t16 = /* @__PURE__ */ jsxs(Accordion.Item, {
763
+ value: t4,
761
764
  className: "group",
762
765
  onMouseEnter: ctx.handleBlockMouseEnter,
763
766
  onMouseLeave: ctx.handleBlockMouseLeave,
764
- children: [t13, t14]
767
+ children: [t14, t15]
765
768
  });
766
- $[33] = ctx.handleBlockMouseEnter;
767
- $[34] = ctx.handleBlockMouseLeave;
768
- $[35] = t13;
769
+ $[34] = ctx.handleBlockMouseEnter;
770
+ $[35] = ctx.handleBlockMouseLeave;
769
771
  $[36] = t14;
770
- $[37] = t3;
771
- $[38] = t15;
772
- } else t15 = $[38];
773
- let t16;
774
- if ($[39] !== t15 || $[40] !== t2) {
775
- t16 = /* @__PURE__ */ jsx(Accordion.Root, {
776
- value: t2,
777
- children: t15
772
+ $[37] = t15;
773
+ $[38] = t4;
774
+ $[39] = t16;
775
+ } else t16 = $[39];
776
+ let t17;
777
+ if ($[40] !== t16 || $[41] !== t3) {
778
+ t17 = /* @__PURE__ */ jsx(Accordion.Root, {
779
+ value: t3,
780
+ children: t16
778
781
  });
779
- $[39] = t15;
780
- $[40] = t2;
781
- $[41] = t16;
782
- } else t16 = $[41];
783
- return t16;
782
+ $[40] = t16;
783
+ $[41] = t3;
784
+ $[42] = t17;
785
+ } else t17 = $[42];
786
+ return t17;
784
787
  };
785
788
  const PageTree = () => {
786
- const $ = c(53);
787
- const focusedBlockId = useSelector(previewStore, _temp7)?.blockId ?? null;
789
+ const $ = c(46);
788
790
  const page = usePreviewedPage();
789
791
  const { pageBlocks, beforeBlocks: layoutBeforeBlocks, afterBlocks: layoutAfterBlocks } = usePageBlocks(page);
790
792
  const camoxApp = useCamoxApp();
@@ -867,64 +869,51 @@ const PageTree = () => {
867
869
  } else t5 = $[10];
868
870
  const layout = t5;
869
871
  let t6;
870
- if ($[11] !== focusedBlockId || $[12] !== layout?.title || $[13] !== layoutBeforeBlocks) {
872
+ if ($[11] !== layout?._internal || $[12] !== layoutBeforeBlocks) {
871
873
  let t7;
872
- if ($[15] !== focusedBlockId || $[16] !== layout?.title) {
874
+ if ($[14] !== layout?._internal) {
873
875
  t7 = (block_1) => /* @__PURE__ */ jsx(LayoutBlockItem, {
874
876
  block: block_1,
875
- isSelected: focusedBlockId === String(block_1.id),
876
- layoutName: layout?.title ?? "Unknown"
877
+ layoutName: layout?._internal.title ?? "Unknown"
877
878
  }, String(block_1.id));
878
- $[15] = focusedBlockId;
879
- $[16] = layout?.title;
880
- $[17] = t7;
881
- } else t7 = $[17];
879
+ $[14] = layout?._internal;
880
+ $[15] = t7;
881
+ } else t7 = $[15];
882
882
  t6 = layoutBeforeBlocks.map(t7);
883
- $[11] = focusedBlockId;
884
- $[12] = layout?.title;
885
- $[13] = layoutBeforeBlocks;
886
- $[14] = t6;
887
- } else t6 = $[14];
883
+ $[11] = layout?._internal;
884
+ $[12] = layoutBeforeBlocks;
885
+ $[13] = t6;
886
+ } else t6 = $[13];
888
887
  let t7;
889
- if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
888
+ if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
890
889
  t7 = [restrictToVerticalAxis];
891
- $[18] = t7;
892
- } else t7 = $[18];
890
+ $[16] = t7;
891
+ } else t7 = $[16];
893
892
  let t8;
893
+ if ($[17] !== pageBlocks) {
894
+ t8 = pageBlocks.map(_temp7);
895
+ $[17] = pageBlocks;
896
+ $[18] = t8;
897
+ } else t8 = $[18];
898
+ let t9;
894
899
  if ($[19] !== pageBlocks) {
895
- t8 = pageBlocks.map(_temp8);
900
+ t9 = pageBlocks.map(_temp8);
896
901
  $[19] = pageBlocks;
897
- $[20] = t8;
898
- } else t8 = $[20];
899
- let t9;
900
- if ($[21] !== focusedBlockId || $[22] !== pageBlocks) {
901
- let t10;
902
- if ($[24] !== focusedBlockId) {
903
- t10 = (block_3) => /* @__PURE__ */ jsx(SortableBlock, {
904
- block: block_3,
905
- isSelected: focusedBlockId === String(block_3.id)
906
- }, String(block_3.id));
907
- $[24] = focusedBlockId;
908
- $[25] = t10;
909
- } else t10 = $[25];
910
- t9 = pageBlocks.map(t10);
911
- $[21] = focusedBlockId;
912
- $[22] = pageBlocks;
913
- $[23] = t9;
914
- } else t9 = $[23];
902
+ $[20] = t9;
903
+ } else t9 = $[20];
915
904
  let t10;
916
- if ($[26] !== t8 || $[27] !== t9) {
905
+ if ($[21] !== t8 || $[22] !== t9) {
917
906
  t10 = /* @__PURE__ */ jsx(SortableContext, {
918
907
  items: t8,
919
908
  strategy: verticalListSortingStrategy,
920
909
  children: t9
921
910
  });
922
- $[26] = t8;
923
- $[27] = t9;
924
- $[28] = t10;
925
- } else t10 = $[28];
911
+ $[21] = t8;
912
+ $[22] = t9;
913
+ $[23] = t10;
914
+ } else t10 = $[23];
926
915
  let t11;
927
- if ($[29] !== activeId || $[30] !== pageBlocks) {
916
+ if ($[24] !== activeId || $[25] !== pageBlocks) {
928
917
  t11 = activeId ? (() => {
929
918
  const activeBlock = pageBlocks.find((b) => String(b.id) === activeId);
930
919
  if (!activeBlock) return null;
@@ -939,21 +928,21 @@ const PageTree = () => {
939
928
  })
940
929
  });
941
930
  })() : null;
942
- $[29] = activeId;
943
- $[30] = pageBlocks;
944
- $[31] = t11;
945
- } else t11 = $[31];
931
+ $[24] = activeId;
932
+ $[25] = pageBlocks;
933
+ $[26] = t11;
934
+ } else t11 = $[26];
946
935
  let t12;
947
- if ($[32] !== t11) {
936
+ if ($[27] !== t11) {
948
937
  t12 = /* @__PURE__ */ jsx(DragOverlay, {
949
938
  dropAnimation: null,
950
939
  children: t11
951
940
  });
952
- $[32] = t11;
953
- $[33] = t12;
954
- } else t12 = $[33];
941
+ $[27] = t11;
942
+ $[28] = t12;
943
+ } else t12 = $[28];
955
944
  let t13;
956
- if ($[34] !== handleDragEnd || $[35] !== sensors || $[36] !== t10 || $[37] !== t12) {
945
+ if ($[29] !== handleDragEnd || $[30] !== sensors || $[31] !== t10 || $[32] !== t12) {
957
946
  t13 = /* @__PURE__ */ jsxs(DndContext, {
958
947
  sensors,
959
948
  collisionDetection: closestCenter,
@@ -963,33 +952,30 @@ const PageTree = () => {
963
952
  modifiers: t7,
964
953
  children: [t10, t12]
965
954
  });
966
- $[34] = handleDragEnd;
967
- $[35] = sensors;
968
- $[36] = t10;
969
- $[37] = t12;
970
- $[38] = t13;
971
- } else t13 = $[38];
955
+ $[29] = handleDragEnd;
956
+ $[30] = sensors;
957
+ $[31] = t10;
958
+ $[32] = t12;
959
+ $[33] = t13;
960
+ } else t13 = $[33];
972
961
  let t14;
973
- if ($[39] !== focusedBlockId || $[40] !== layout?.title || $[41] !== layoutAfterBlocks) {
962
+ if ($[34] !== layout?._internal || $[35] !== layoutAfterBlocks) {
974
963
  let t15;
975
- if ($[43] !== focusedBlockId || $[44] !== layout?.title) {
964
+ if ($[37] !== layout?._internal) {
976
965
  t15 = (block_4) => /* @__PURE__ */ jsx(LayoutBlockItem, {
977
966
  block: block_4,
978
- isSelected: focusedBlockId === String(block_4.id),
979
- layoutName: layout?.title ?? "Unknown"
967
+ layoutName: layout?._internal.title ?? "Unknown"
980
968
  }, String(block_4.id));
981
- $[43] = focusedBlockId;
982
- $[44] = layout?.title;
983
- $[45] = t15;
984
- } else t15 = $[45];
969
+ $[37] = layout?._internal;
970
+ $[38] = t15;
971
+ } else t15 = $[38];
985
972
  t14 = layoutAfterBlocks.map(t15);
986
- $[39] = focusedBlockId;
987
- $[40] = layout?.title;
988
- $[41] = layoutAfterBlocks;
989
- $[42] = t14;
990
- } else t14 = $[42];
973
+ $[34] = layout?._internal;
974
+ $[35] = layoutAfterBlocks;
975
+ $[36] = t14;
976
+ } else t14 = $[36];
991
977
  let t15;
992
- if ($[46] !== t13 || $[47] !== t14 || $[48] !== t6) {
978
+ if ($[39] !== t13 || $[40] !== t14 || $[41] !== t6) {
993
979
  t15 = /* @__PURE__ */ jsxs("div", {
994
980
  className: "flex flex-col gap-0.5",
995
981
  children: [
@@ -998,26 +984,26 @@ const PageTree = () => {
998
984
  t14
999
985
  ]
1000
986
  });
1001
- $[46] = t13;
1002
- $[47] = t14;
1003
- $[48] = t6;
1004
- $[49] = t15;
1005
- } else t15 = $[49];
987
+ $[39] = t13;
988
+ $[40] = t14;
989
+ $[41] = t6;
990
+ $[42] = t15;
991
+ } else t15 = $[42];
1006
992
  let t16;
1007
- if ($[50] === Symbol.for("react.memo_cache_sentinel")) {
993
+ if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
1008
994
  t16 = /* @__PURE__ */ jsxs(Button, {
1009
995
  variant: "secondary",
1010
996
  onClick: _temp9,
1011
997
  children: [/* @__PURE__ */ jsx(Plus, {}), "Add block"]
1012
998
  });
1013
- $[50] = t16;
1014
- } else t16 = $[50];
999
+ $[43] = t16;
1000
+ } else t16 = $[43];
1015
1001
  let t17;
1016
- if ($[51] !== t15) {
1002
+ if ($[44] !== t15) {
1017
1003
  t17 = /* @__PURE__ */ jsxs(Fragment, { children: [t15, t16] });
1018
- $[51] = t15;
1019
- $[52] = t17;
1020
- } else t17 = $[52];
1004
+ $[44] = t15;
1005
+ $[45] = t17;
1006
+ } else t17 = $[45];
1021
1007
  return t17;
1022
1008
  };
1023
1009
  function _temp3(state) {
@@ -1026,12 +1012,12 @@ function _temp3(state) {
1026
1012
  function _temp4(state_0) {
1027
1013
  return state_0.context.iframeElement;
1028
1014
  }
1029
- function _temp7(state) {
1030
- return state.context.selection;
1031
- }
1032
- function _temp8(block_2) {
1015
+ function _temp7(block_2) {
1033
1016
  return String(block_2.id);
1034
1017
  }
1018
+ function _temp8(block_3) {
1019
+ return /* @__PURE__ */ jsx(SortableBlock, { block: block_3 }, String(block_3.id));
1020
+ }
1035
1021
  function _temp9() {
1036
1022
  return previewStore.send({ type: "openAddBlockSheet" });
1037
1023
  }