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
@@ -170,7 +170,7 @@ function createBlock(options) {
170
170
  * Repeater item fields: blockId__itemId__fieldName
171
171
  */
172
172
  const getOverlayFieldId = (blockId, repeaterContext, fieldName) => {
173
- if (repeaterContext?.itemId) return `${blockId}__${repeaterContext.itemId}__${fieldName}`;
173
+ if (repeaterContext?.itemId != null) return `${blockId}__${repeaterContext.itemId}__${fieldName}`;
174
174
  return `${blockId}__${fieldName}`;
175
175
  };
176
176
  const Field = ({ name, children }) => {
@@ -196,12 +196,12 @@ function createBlock(options) {
196
196
  const handleChange = React.useCallback((newValue) => {
197
197
  if (repeaterContext) {
198
198
  const { itemId } = repeaterContext;
199
- if (itemId) updateRepeatableContent.mutate({
200
- id: Number(itemId),
199
+ if (itemId != null) updateRepeatableContent.mutate({
200
+ id: itemId,
201
201
  content: { [name]: newValue }
202
202
  });
203
203
  } else updateBlockContent.mutate({
204
- id: Number(blockId),
204
+ id: blockId,
205
205
  content: { [name]: newValue }
206
206
  });
207
207
  }, [
@@ -213,7 +213,7 @@ function createBlock(options) {
213
213
  ]);
214
214
  const handleFocus = React.useCallback(() => {
215
215
  setIsEditorFocused(true);
216
- if (repeaterContext?.itemId) previewStore.send({
216
+ if (repeaterContext?.itemId != null) previewStore.send({
217
217
  type: "selectItemField",
218
218
  blockId,
219
219
  itemId: repeaterContext.itemId,
@@ -354,12 +354,12 @@ function createBlock(options) {
354
354
  setUrlValue(newValue);
355
355
  if (timerRef.current) clearTimeout(timerRef.current);
356
356
  timerRef.current = window.setTimeout(() => {
357
- if (repeaterContext?.itemId) updateRepeatableContent.mutate({
358
- id: Number(repeaterContext.itemId),
357
+ if (repeaterContext?.itemId != null) updateRepeatableContent.mutate({
358
+ id: repeaterContext.itemId,
359
359
  content: { [name]: newValue }
360
360
  });
361
361
  else updateBlockContent.mutate({
362
- id: Number(blockId),
362
+ id: blockId,
363
363
  content: { [name]: newValue }
364
364
  });
365
365
  }, 500);
@@ -376,7 +376,7 @@ function createBlock(options) {
376
376
  if ($[23] !== blockId || $[24] !== name || $[25] !== repeaterContext) {
377
377
  t13 = (open, _eventDetails) => {
378
378
  setIsOpen(open);
379
- if (open) if (repeaterContext?.itemId) previewStore.send({
379
+ if (open) if (repeaterContext?.itemId != null) previewStore.send({
380
380
  type: "selectItemField",
381
381
  blockId,
382
382
  itemId: repeaterContext.itemId,
@@ -584,12 +584,12 @@ function createBlock(options) {
584
584
  let t9;
585
585
  if ($[12] !== blockId || $[13] !== name || $[14] !== repeaterContext || $[15] !== updateBlockContent || $[16] !== updateRepeatableContent) {
586
586
  t9 = (newLinkValue) => {
587
- if (repeaterContext?.itemId) updateRepeatableContent.mutate({
588
- id: Number(repeaterContext.itemId),
587
+ if (repeaterContext?.itemId != null) updateRepeatableContent.mutate({
588
+ id: repeaterContext.itemId,
589
589
  content: { [name]: newLinkValue }
590
590
  });
591
591
  else updateBlockContent.mutate({
592
- id: Number(blockId),
592
+ id: blockId,
593
593
  content: { [name]: newLinkValue }
594
594
  });
595
595
  };
@@ -613,7 +613,7 @@ function createBlock(options) {
613
613
  t10 = () => {
614
614
  setIsEditing(true);
615
615
  setIsEditorFocused(true);
616
- if (repeaterContext?.itemId) previewStore.send({
616
+ if (repeaterContext?.itemId != null) previewStore.send({
617
617
  type: "selectItemField",
618
618
  blockId,
619
619
  itemId: repeaterContext.itemId,
@@ -787,8 +787,8 @@ function createBlock(options) {
787
787
  if ($[9] !== blockId || $[10] !== isContentEditable || $[11] !== name || $[12] !== repeaterContext) {
788
788
  t6 = () => {
789
789
  if (!isContentEditable) return;
790
- const imageFieldName = repeaterContext && !repeaterContext.itemId ? repeaterContext.arrayFieldName : String(name);
791
- if (repeaterContext?.itemId) previewStore.send({
790
+ const imageFieldName = repeaterContext && repeaterContext.itemId == null ? repeaterContext.arrayFieldName : String(name);
791
+ if (repeaterContext?.itemId != null) previewStore.send({
792
792
  type: "selectItemField",
793
793
  blockId,
794
794
  itemId: repeaterContext.itemId,
@@ -892,64 +892,67 @@ function createBlock(options) {
892
892
  const isContentEditable = useIsEditable(mode);
893
893
  const { window: iframeWindow } = useFrame();
894
894
  const isRepeaterHovered = React.useContext(RepeaterHoverContext);
895
- let t1;
896
- if ($[0] !== blockId || $[1] !== itemId) {
897
- t1 = {
898
- blockId,
899
- itemId
895
+ const t1 = String(blockId);
896
+ const t2 = String(itemId);
897
+ let t3;
898
+ if ($[0] !== t1 || $[1] !== t2) {
899
+ t3 = {
900
+ blockId: t1,
901
+ itemId: t2
900
902
  };
901
- $[0] = blockId;
902
- $[1] = itemId;
903
- $[2] = t1;
904
- } else t1 = $[2];
905
- const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER_ITEM", "CAMOX_HOVER_REPEATER_ITEM_END", t1);
903
+ $[0] = t1;
904
+ $[1] = t2;
905
+ $[2] = t3;
906
+ } else t3 = $[2];
907
+ const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER_ITEM", "CAMOX_HOVER_REPEATER_ITEM_END", t3);
906
908
  const showOverlay = isContentEditable && (isHovered || isRepeaterHovered);
907
- const t2 = isContentEditable ? itemId : void 0;
908
- const t3 = showOverlay || void 0;
909
- const t4 = mode === "layout" ? "layout" : void 0;
910
- let t5;
911
- if ($[3] !== children || $[4] !== t2 || $[5] !== t3 || $[6] !== t4) {
912
- t5 = /* @__PURE__ */ jsx("div", {
913
- "data-camox-repeater-item-id": t2,
914
- "data-camox-hovered": t3,
915
- "data-camox-overlay-mode": t4,
909
+ const t4 = isContentEditable ? itemId : void 0;
910
+ const t5 = showOverlay || void 0;
911
+ const t6 = mode === "layout" ? "layout" : void 0;
912
+ let t7;
913
+ if ($[3] !== children || $[4] !== t4 || $[5] !== t5 || $[6] !== t6) {
914
+ t7 = /* @__PURE__ */ jsx("div", {
915
+ "data-camox-repeater-item-id": t4,
916
+ "data-camox-hovered": t5,
917
+ "data-camox-overlay-mode": t6,
916
918
  children
917
919
  });
918
920
  $[3] = children;
919
- $[4] = t2;
920
- $[5] = t3;
921
- $[6] = t4;
922
- $[7] = t5;
923
- } else t5 = $[7];
924
- return t5;
921
+ $[4] = t4;
922
+ $[5] = t5;
923
+ $[6] = t6;
924
+ $[7] = t7;
925
+ } else t7 = $[7];
926
+ return t7;
925
927
  };
926
928
  const RepeaterHoverProvider = (t0) => {
927
929
  const $ = c(6);
928
930
  const { blockId, fieldName, children } = t0;
929
931
  const isContentEditable = useIsEditable("site");
930
932
  const { window: iframeWindow } = useFrame();
931
- let t1;
932
- if ($[0] !== blockId || $[1] !== fieldName) {
933
- t1 = {
934
- blockId,
933
+ const t1 = String(blockId);
934
+ let t2;
935
+ if ($[0] !== fieldName || $[1] !== t1) {
936
+ t2 = {
937
+ blockId: t1,
935
938
  fieldName
936
939
  };
937
- $[0] = blockId;
938
- $[1] = fieldName;
939
- $[2] = t1;
940
- } else t1 = $[2];
941
- const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER", "CAMOX_HOVER_REPEATER_END", t1);
942
- let t2;
940
+ $[0] = fieldName;
941
+ $[1] = t1;
942
+ $[2] = t2;
943
+ } else t2 = $[2];
944
+ const isHovered = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_REPEATER", "CAMOX_HOVER_REPEATER_END", t2);
945
+ let t3;
943
946
  if ($[3] !== children || $[4] !== isHovered) {
944
- t2 = /* @__PURE__ */ jsx(RepeaterHoverContext.Provider, {
947
+ t3 = /* @__PURE__ */ jsx(RepeaterHoverContext.Provider, {
945
948
  value: isHovered,
946
949
  children
947
950
  });
948
951
  $[3] = children;
949
952
  $[4] = isHovered;
950
- $[5] = t2;
951
- } else t2 = $[5];
952
- return t2;
953
+ $[5] = t3;
954
+ } else t3 = $[5];
955
+ return t3;
953
956
  };
954
957
  const Repeater = (t0) => {
955
958
  const $ = c(10);
@@ -1008,7 +1011,7 @@ function createBlock(options) {
1008
1011
  ...repeatableItemDefaults[fieldName],
1009
1012
  ...isDbItem ? item_0.content : item_0
1010
1013
  };
1011
- const itemId = isDbItem ? String(item_0.id) : void 0;
1014
+ const itemId = isDbItem ? item_0.id : void 0;
1012
1015
  return /* @__PURE__ */ jsx(RepeaterItemContext.Provider, {
1013
1016
  value: {
1014
1017
  arrayFieldName: fieldName,
@@ -1022,7 +1025,7 @@ function createBlock(options) {
1022
1025
  mode,
1023
1026
  children: children(itemComponents, index)
1024
1027
  })
1025
- }, itemId || index);
1028
+ }, itemId ?? index);
1026
1029
  });
1027
1030
  let t3;
1028
1031
  if ($[5] !== T0 || $[6] !== blockId || $[7] !== fieldName || $[8] !== t2) {
@@ -1092,28 +1095,29 @@ function createBlock(options) {
1092
1095
  $[9] = t4;
1093
1096
  } else t4 = $[9];
1094
1097
  React.useEffect(t3, t4);
1095
- let t5;
1096
- if ($[10] !== blockData._id) {
1097
- t5 = { blockId: blockData._id };
1098
- $[10] = blockData._id;
1099
- $[11] = t5;
1100
- } else t5 = $[11];
1101
- const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t5);
1098
+ const t5 = String(blockData._id);
1102
1099
  let t6;
1100
+ if ($[10] !== t5) {
1101
+ t6 = { blockId: t5 };
1102
+ $[10] = t5;
1103
+ $[11] = t6;
1104
+ } else t6 = $[11];
1105
+ const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t6);
1103
1106
  let t7;
1107
+ let t8;
1104
1108
  if ($[12] !== isHoveredFromSidebar) {
1105
- t6 = () => {
1109
+ t7 = () => {
1106
1110
  setIsHovered(isHoveredFromSidebar);
1107
1111
  };
1108
- t7 = [isHoveredFromSidebar];
1112
+ t8 = [isHoveredFromSidebar];
1109
1113
  $[12] = isHoveredFromSidebar;
1110
- $[13] = t6;
1111
- $[14] = t7;
1114
+ $[13] = t7;
1115
+ $[14] = t8;
1112
1116
  } else {
1113
- t6 = $[13];
1114
- t7 = $[14];
1117
+ t7 = $[13];
1118
+ t8 = $[14];
1115
1119
  }
1116
- React.useEffect(t6, t7);
1120
+ React.useEffect(t7, t8);
1117
1121
  let result;
1118
1122
  if ($[15] !== blockData.content) {
1119
1123
  result = { ...blockData.content };
@@ -1125,9 +1129,9 @@ function createBlock(options) {
1125
1129
  $[16] = result;
1126
1130
  } else result = $[16];
1127
1131
  const normalizedContent = result;
1128
- let t8;
1132
+ let t9;
1129
1133
  if ($[17] !== blockData._id || $[18] !== isContentEditable) {
1130
- t8 = (e) => {
1134
+ t9 = (e) => {
1131
1135
  if (!isContentEditable) return;
1132
1136
  if (e.target.closest("[data-camox-field-id]")) return;
1133
1137
  previewStore.send({
@@ -1137,30 +1141,30 @@ function createBlock(options) {
1137
1141
  };
1138
1142
  $[17] = blockData._id;
1139
1143
  $[18] = isContentEditable;
1140
- $[19] = t8;
1141
- } else t8 = $[19];
1142
- const handleClick = t8;
1143
- let t9;
1144
+ $[19] = t9;
1145
+ } else t9 = $[19];
1146
+ const handleClick = t9;
1147
+ let t10;
1144
1148
  if ($[20] !== isContentEditable) {
1145
- t9 = () => {
1149
+ t10 = () => {
1146
1150
  if (isContentEditable) setIsHovered(true);
1147
1151
  };
1148
1152
  $[20] = isContentEditable;
1149
- $[21] = t9;
1150
- } else t9 = $[21];
1151
- const handleMouseEnter = t9;
1152
- let t10;
1153
+ $[21] = t10;
1154
+ } else t10 = $[21];
1155
+ const handleMouseEnter = t10;
1156
+ let t11;
1153
1157
  if ($[22] !== isContentEditable) {
1154
- t10 = () => {
1158
+ t11 = () => {
1155
1159
  if (isContentEditable) setIsHovered(false);
1156
1160
  };
1157
1161
  $[22] = isContentEditable;
1158
- $[23] = t10;
1159
- } else t10 = $[23];
1160
- const handleMouseLeave = t10;
1161
- let t11;
1162
+ $[23] = t11;
1163
+ } else t11 = $[23];
1164
+ const handleMouseLeave = t11;
1165
+ let t12;
1162
1166
  if ($[24] !== addBlockAfterPosition || $[25] !== blockData.position) {
1163
- t11 = (insertPosition) => {
1167
+ t12 = (insertPosition) => {
1164
1168
  postOverlayMessage({
1165
1169
  type: "CAMOX_ADD_BLOCK_REQUEST",
1166
1170
  blockPosition: blockData.position,
@@ -1170,35 +1174,35 @@ function createBlock(options) {
1170
1174
  };
1171
1175
  $[24] = addBlockAfterPosition;
1172
1176
  $[25] = blockData.position;
1173
- $[26] = t11;
1174
- } else t11 = $[26];
1175
- const handleAddBlockClick = t11;
1177
+ $[26] = t12;
1178
+ } else t12 = $[26];
1179
+ const handleAddBlockClick = t12;
1176
1180
  const shouldShowOverlay = isContentEditable && (isHovered || isBlockSelected) && !isAddBlockSheetOpen;
1177
1181
  const shouldShowSheetOverlay = isAddBlockSheetOpen && mode !== "peek" || isPageContentSheetOpen && !isBlockSelected;
1178
- let t12;
1182
+ let t13;
1179
1183
  if ($[27] === Symbol.for("react.memo_cache_sentinel")) {
1180
- t12 = {
1184
+ t13 = {
1181
1185
  position: "relative",
1182
1186
  scrollMargin: "5rem",
1183
1187
  background: "var(--background)"
1184
1188
  };
1185
- $[27] = t12;
1186
- } else t12 = $[27];
1187
- const t13 = isContentEditable ? blockData._id : void 0;
1188
- const t14 = shouldShowOverlay && !isBlockSelected || void 0;
1189
- const t15 = shouldShowOverlay && isBlockSelected || void 0;
1190
- const t16 = mode === "layout" ? "layout" : void 0;
1191
- const t17 = blockData._id;
1192
- let t18;
1189
+ $[27] = t13;
1190
+ } else t13 = $[27];
1191
+ const t14 = isContentEditable ? blockData._id : void 0;
1192
+ const t15 = shouldShowOverlay && !isBlockSelected || void 0;
1193
+ const t16 = shouldShowOverlay && isBlockSelected || void 0;
1194
+ const t17 = mode === "layout" ? "layout" : void 0;
1195
+ const t18 = blockData._id;
1196
+ let t19;
1193
1197
  if ($[28] !== blockData.content) {
1194
- t18 = {
1198
+ t19 = {
1195
1199
  ...contentDefaults,
1196
1200
  ...blockData.content
1197
1201
  };
1198
1202
  $[28] = blockData.content;
1199
- $[29] = t18;
1200
- } else t18 = $[29];
1201
- const merged = t18;
1203
+ $[29] = t19;
1204
+ } else t19 = $[29];
1205
+ const merged = t19;
1202
1206
  let overrides;
1203
1207
  if ($[30] !== merged) {
1204
1208
  overrides = {};
@@ -1209,33 +1213,33 @@ function createBlock(options) {
1209
1213
  $[30] = merged;
1210
1214
  $[31] = overrides;
1211
1215
  } else overrides = $[31];
1212
- let t19;
1216
+ let t20;
1213
1217
  if ($[32] !== merged || $[33] !== overrides) {
1214
- t19 = {
1218
+ t20 = {
1215
1219
  ...merged,
1216
1220
  ...overrides
1217
1221
  };
1218
1222
  $[32] = merged;
1219
1223
  $[33] = overrides;
1220
- $[34] = t19;
1221
- } else t19 = $[34];
1222
- const t20 = t19;
1223
- let t21;
1224
+ $[34] = t20;
1225
+ } else t20 = $[34];
1226
+ const t21 = t20;
1227
+ let t22;
1224
1228
  if ($[35] !== blockData.settings) {
1225
- t21 = {
1229
+ t22 = {
1226
1230
  ...settingsDefaults,
1227
1231
  ...blockData.settings
1228
1232
  };
1229
1233
  $[35] = blockData.settings;
1230
- $[36] = t21;
1231
- } else t21 = $[36];
1232
- const t22 = t21;
1233
- let t23;
1234
- if ($[37] !== blockData._id || $[38] !== isHovered || $[39] !== mode || $[40] !== t20 || $[41] !== t22) {
1235
- t23 = {
1236
- blockId: t17,
1237
- content: t20,
1238
- settings: t22,
1234
+ $[36] = t22;
1235
+ } else t22 = $[36];
1236
+ const t23 = t22;
1237
+ let t24;
1238
+ if ($[37] !== blockData._id || $[38] !== isHovered || $[39] !== mode || $[40] !== t21 || $[41] !== t23) {
1239
+ t24 = {
1240
+ blockId: t18,
1241
+ content: t21,
1242
+ settings: t23,
1239
1243
  mode,
1240
1244
  isHovered,
1241
1245
  setIsHovered
@@ -1243,38 +1247,38 @@ function createBlock(options) {
1243
1247
  $[37] = blockData._id;
1244
1248
  $[38] = isHovered;
1245
1249
  $[39] = mode;
1246
- $[40] = t20;
1247
- $[41] = t22;
1248
- $[42] = t23;
1249
- } else t23 = $[42];
1250
- let t24;
1250
+ $[40] = t21;
1251
+ $[41] = t23;
1252
+ $[42] = t24;
1253
+ } else t24 = $[42];
1254
+ let t25;
1251
1255
  if ($[43] !== normalizedContent) {
1252
- t24 = /* @__PURE__ */ jsx(options.component, { content: normalizedContent });
1256
+ t25 = /* @__PURE__ */ jsx(options.component, { content: normalizedContent });
1253
1257
  $[43] = normalizedContent;
1254
- $[44] = t24;
1255
- } else t24 = $[44];
1256
- let t25;
1257
- if ($[45] !== t23 || $[46] !== t24) {
1258
- t25 = /* @__PURE__ */ jsx(Context.Provider, {
1259
- value: t23,
1260
- children: t24
1261
- });
1262
- $[45] = t23;
1263
- $[46] = t24;
1264
- $[47] = t25;
1265
- } else t25 = $[47];
1258
+ $[44] = t25;
1259
+ } else t25 = $[44];
1266
1260
  let t26;
1261
+ if ($[45] !== t24 || $[46] !== t25) {
1262
+ t26 = /* @__PURE__ */ jsx(Context.Provider, {
1263
+ value: t24,
1264
+ children: t25
1265
+ });
1266
+ $[45] = t24;
1267
+ $[46] = t25;
1268
+ $[47] = t26;
1269
+ } else t26 = $[47];
1270
+ let t27;
1267
1271
  if ($[48] !== shouldShowSheetOverlay) {
1268
- t26 = /* @__PURE__ */ jsx("div", {
1272
+ t27 = /* @__PURE__ */ jsx("div", {
1269
1273
  className: "camox-sheet-overlay",
1270
1274
  ...shouldShowSheetOverlay ? { "data-camox-visible": "" } : {}
1271
1275
  });
1272
1276
  $[48] = shouldShowSheetOverlay;
1273
- $[49] = t26;
1274
- } else t26 = $[49];
1275
- let t27;
1277
+ $[49] = t27;
1278
+ } else t27 = $[49];
1279
+ let t28;
1276
1280
  if ($[50] !== handleAddBlockClick || $[51] !== isAnySideSheetOpen || $[52] !== isFirstBlock || $[53] !== mode || $[54] !== shouldShowOverlay || $[55] !== showAddBlockBottom || $[56] !== showAddBlockTop) {
1277
- t27 = shouldShowOverlay && /* @__PURE__ */ jsxs(Fragment, { children: [(showAddBlockTop ?? (mode !== "layout" && !isFirstBlock)) && /* @__PURE__ */ jsx(AddBlockControlBar, {
1281
+ t28 = shouldShowOverlay && /* @__PURE__ */ jsxs(Fragment, { children: [(showAddBlockTop ?? (mode !== "layout" && !isFirstBlock)) && /* @__PURE__ */ jsx(AddBlockControlBar, {
1278
1282
  position: "top",
1279
1283
  hidden: isAnySideSheetOpen,
1280
1284
  onMouseLeave: () => setIsHovered(false),
@@ -1292,40 +1296,40 @@ function createBlock(options) {
1292
1296
  $[54] = shouldShowOverlay;
1293
1297
  $[55] = showAddBlockBottom;
1294
1298
  $[56] = showAddBlockTop;
1295
- $[57] = t27;
1296
- } else t27 = $[57];
1297
- let t28;
1298
- if ($[58] !== handleClick || $[59] !== handleMouseEnter || $[60] !== handleMouseLeave || $[61] !== t13 || $[62] !== t14 || $[63] !== t15 || $[64] !== t16 || $[65] !== t25 || $[66] !== t26 || $[67] !== t27) {
1299
- t28 = /* @__PURE__ */ jsxs("div", {
1299
+ $[57] = t28;
1300
+ } else t28 = $[57];
1301
+ let t29;
1302
+ if ($[58] !== handleClick || $[59] !== handleMouseEnter || $[60] !== handleMouseLeave || $[61] !== t14 || $[62] !== t15 || $[63] !== t16 || $[64] !== t17 || $[65] !== t26 || $[66] !== t27 || $[67] !== t28) {
1303
+ t29 = /* @__PURE__ */ jsxs("div", {
1300
1304
  className: "group visual-editing-block",
1301
1305
  ref,
1302
- style: t12,
1303
- "data-camox-block-id": t13,
1304
- "data-camox-hovered": t14,
1305
- "data-camox-focused": t15,
1306
- "data-camox-overlay-mode": t16,
1306
+ style: t13,
1307
+ "data-camox-block-id": t14,
1308
+ "data-camox-hovered": t15,
1309
+ "data-camox-focused": t16,
1310
+ "data-camox-overlay-mode": t17,
1307
1311
  onClick: handleClick,
1308
1312
  onMouseEnter: handleMouseEnter,
1309
1313
  onMouseLeave: handleMouseLeave,
1310
1314
  children: [
1311
- t25,
1312
1315
  t26,
1313
- t27
1316
+ t27,
1317
+ t28
1314
1318
  ]
1315
1319
  });
1316
1320
  $[58] = handleClick;
1317
1321
  $[59] = handleMouseEnter;
1318
1322
  $[60] = handleMouseLeave;
1319
- $[61] = t13;
1320
- $[62] = t14;
1321
- $[63] = t15;
1322
- $[64] = t16;
1323
- $[65] = t25;
1324
- $[66] = t26;
1325
- $[67] = t27;
1326
- $[68] = t28;
1327
- } else t28 = $[68];
1328
- return t28;
1323
+ $[61] = t14;
1324
+ $[62] = t15;
1325
+ $[63] = t16;
1326
+ $[64] = t17;
1327
+ $[65] = t26;
1328
+ $[66] = t27;
1329
+ $[67] = t28;
1330
+ $[68] = t29;
1331
+ } else t29 = $[68];
1332
+ return t29;
1329
1333
  };
1330
1334
  const useSetting = (name) => {
1331
1335
  const ctx = React.use(Context);
@@ -1348,34 +1352,35 @@ function createBlock(options) {
1348
1352
  const isAddBlockSheetOpen = useSelector(previewStore, _temp0);
1349
1353
  const isPageContentSheetOpen = useSelector(previewStore, _temp1);
1350
1354
  const isBlockSelected = selection?.blockId === blockId;
1351
- let t1;
1352
- if ($[0] !== blockId) {
1353
- t1 = { blockId };
1354
- $[0] = blockId;
1355
- $[1] = t1;
1356
- } else t1 = $[1];
1357
- const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t1);
1355
+ const t1 = String(blockId);
1358
1356
  let t2;
1357
+ if ($[0] !== t1) {
1358
+ t2 = { blockId: t1 };
1359
+ $[0] = t1;
1360
+ $[1] = t2;
1361
+ } else t2 = $[1];
1362
+ const isHoveredFromSidebar = useOverlayMessage(iframeWindow, isContentEditable, "CAMOX_HOVER_BLOCK", "CAMOX_HOVER_BLOCK_END", t2);
1359
1363
  let t3;
1364
+ let t4;
1360
1365
  if ($[2] !== isHoveredFromSidebar || $[3] !== setIsHovered) {
1361
- t2 = () => {
1366
+ t3 = () => {
1362
1367
  setIsHovered(isHoveredFromSidebar);
1363
1368
  };
1364
- t3 = [isHoveredFromSidebar, setIsHovered];
1369
+ t4 = [isHoveredFromSidebar, setIsHovered];
1365
1370
  $[2] = isHoveredFromSidebar;
1366
1371
  $[3] = setIsHovered;
1367
- $[4] = t2;
1368
- $[5] = t3;
1372
+ $[4] = t3;
1373
+ $[5] = t4;
1369
1374
  } else {
1370
- t2 = $[4];
1371
- t3 = $[5];
1375
+ t3 = $[4];
1376
+ t4 = $[5];
1372
1377
  }
1373
- React.useEffect(t2, t3);
1378
+ React.useEffect(t3, t4);
1374
1379
  const shouldShowOverlay = isContentEditable && (isHovered || isBlockSelected) && !isAddBlockSheetOpen;
1375
1380
  const shouldShowSheetOverlay = isAddBlockSheetOpen && mode !== "peek" || isPageContentSheetOpen && !isBlockSelected;
1376
- let t4;
1381
+ let t5;
1377
1382
  if ($[6] !== blockId || $[7] !== isContentEditable) {
1378
- t4 = (e) => {
1383
+ t5 = (e) => {
1379
1384
  if (!isContentEditable) return;
1380
1385
  e.stopPropagation();
1381
1386
  previewStore.send({
@@ -1385,36 +1390,36 @@ function createBlock(options) {
1385
1390
  };
1386
1391
  $[6] = blockId;
1387
1392
  $[7] = isContentEditable;
1388
- $[8] = t4;
1389
- } else t4 = $[8];
1390
- const handleClick = t4;
1391
- let t5;
1393
+ $[8] = t5;
1394
+ } else t5 = $[8];
1395
+ const handleClick = t5;
1396
+ let t6;
1392
1397
  if ($[9] !== isContentEditable || $[10] !== setIsHovered) {
1393
- t5 = () => {
1398
+ t6 = () => {
1394
1399
  if (isContentEditable) setIsHovered(true);
1395
1400
  };
1396
1401
  $[9] = isContentEditable;
1397
1402
  $[10] = setIsHovered;
1398
- $[11] = t5;
1399
- } else t5 = $[11];
1400
- const handleMouseEnter = t5;
1401
- let t6;
1403
+ $[11] = t6;
1404
+ } else t6 = $[11];
1405
+ const handleMouseEnter = t6;
1406
+ let t7;
1402
1407
  if ($[12] !== isContentEditable || $[13] !== setIsHovered) {
1403
- t6 = () => {
1408
+ t7 = () => {
1404
1409
  if (isContentEditable) setIsHovered(false);
1405
1410
  };
1406
1411
  $[12] = isContentEditable;
1407
1412
  $[13] = setIsHovered;
1408
- $[14] = t6;
1409
- } else t6 = $[14];
1410
- const handleMouseLeave = t6;
1413
+ $[14] = t7;
1414
+ } else t7 = $[14];
1415
+ const handleMouseLeave = t7;
1411
1416
  const [container, setContainer] = React.useState(null);
1412
- const t7 = shouldShowSheetOverlay ? 0 : 1;
1413
- let t8;
1414
- if ($[15] !== children || $[16] !== handleClick || $[17] !== handleMouseEnter || $[18] !== handleMouseLeave || $[19] !== t7) {
1415
- t8 = children({
1417
+ const t8 = shouldShowSheetOverlay ? 0 : 1;
1418
+ let t9;
1419
+ if ($[15] !== children || $[16] !== handleClick || $[17] !== handleMouseEnter || $[18] !== handleMouseLeave || $[19] !== t8) {
1420
+ t9 = children({
1416
1421
  ref: setContainer,
1417
- style: { opacity: t7 },
1422
+ style: { opacity: t8 },
1418
1423
  onClick: handleClick,
1419
1424
  onMouseEnter: handleMouseEnter,
1420
1425
  onMouseLeave: handleMouseLeave
@@ -1423,12 +1428,12 @@ function createBlock(options) {
1423
1428
  $[16] = handleClick;
1424
1429
  $[17] = handleMouseEnter;
1425
1430
  $[18] = handleMouseLeave;
1426
- $[19] = t7;
1427
- $[20] = t8;
1428
- } else t8 = $[20];
1429
- let t9;
1431
+ $[19] = t8;
1432
+ $[20] = t9;
1433
+ } else t9 = $[20];
1434
+ let t10;
1430
1435
  if ($[21] !== blockId || $[22] !== container || $[23] !== isBlockSelected || $[24] !== mode || $[25] !== shouldShowOverlay) {
1431
- t9 = container && createPortal(/* @__PURE__ */ jsx(Fragment, { children: shouldShowOverlay && /* @__PURE__ */ jsx("div", {
1436
+ t10 = container && createPortal(/* @__PURE__ */ jsx(Fragment, { children: shouldShowOverlay && /* @__PURE__ */ jsx("div", {
1432
1437
  "data-camox-block-id": blockId,
1433
1438
  "data-camox-detached": true,
1434
1439
  "data-camox-hovered": !isBlockSelected || void 0,
@@ -1445,19 +1450,18 @@ function createBlock(options) {
1445
1450
  $[23] = isBlockSelected;
1446
1451
  $[24] = mode;
1447
1452
  $[25] = shouldShowOverlay;
1448
- $[26] = t9;
1449
- } else t9 = $[26];
1450
- let t10;
1451
- if ($[27] !== t8 || $[28] !== t9) {
1452
- t10 = /* @__PURE__ */ jsxs(Fragment, { children: [t8, t9] });
1453
- $[27] = t8;
1453
+ $[26] = t10;
1454
+ } else t10 = $[26];
1455
+ let t11;
1456
+ if ($[27] !== t10 || $[28] !== t9) {
1457
+ t11 = /* @__PURE__ */ jsxs(Fragment, { children: [t9, t10] });
1458
+ $[27] = t10;
1454
1459
  $[28] = t9;
1455
- $[29] = t10;
1456
- } else t10 = $[29];
1457
- return t10;
1460
+ $[29] = t11;
1461
+ } else t11 = $[29];
1462
+ return t11;
1458
1463
  };
1459
1464
  return {
1460
- Component: BlockComponent,
1461
1465
  Detached,
1462
1466
  Field,
1463
1467
  Embed,
@@ -1466,60 +1470,63 @@ function createBlock(options) {
1466
1470
  File,
1467
1471
  Repeater,
1468
1472
  useSetting,
1469
- id: options.id,
1470
- title: options.title,
1471
- description: options.description,
1472
- contentSchema,
1473
- settingsSchema,
1474
- getInitialBundle: () => {
1475
- const counter = { value: 0 };
1476
- const allSeeds = [];
1477
- const content = { ...contentDefaults };
1478
- buildInitialSeeds(typeboxSchema.properties, null, content, allSeeds, counter);
1479
- const storageContent = {};
1480
- for (const [key, prop] of Object.entries(typeboxSchema.properties)) {
1481
- const ft = prop.fieldType;
1482
- const ait = prop.arrayItemType;
1483
- if (ft === "Image" || ft === "File" || ft === "RepeatableItem" || ait === "Image" || ait === "File") continue;
1484
- if ("default" in prop) storageContent[key] = prop.default;
1473
+ _internal: {
1474
+ Component: BlockComponent,
1475
+ id: options.id,
1476
+ title: options.title,
1477
+ description: options.description,
1478
+ contentSchema,
1479
+ settingsSchema,
1480
+ layoutOnly: options.layoutOnly ?? false,
1481
+ getInitialBundle: () => {
1482
+ const counter = { value: 0 };
1483
+ const allSeeds = [];
1484
+ const content = { ...contentDefaults };
1485
+ buildInitialSeeds(typeboxSchema.properties, null, content, allSeeds, counter);
1486
+ const storageContent = {};
1487
+ for (const [key, prop] of Object.entries(typeboxSchema.properties)) {
1488
+ const ft = prop.fieldType;
1489
+ const ait = prop.arrayItemType;
1490
+ if (ft === "Image" || ft === "File" || ft === "RepeatableItem" || ait === "Image" || ait === "File") continue;
1491
+ if ("default" in prop) storageContent[key] = prop.default;
1492
+ }
1493
+ return {
1494
+ content: storageContent,
1495
+ settings: { ...settingsDefaults },
1496
+ repeatableItems: allSeeds
1497
+ };
1498
+ },
1499
+ getInitialContent: () => {
1500
+ return { ...contentDefaultsForStorage };
1501
+ },
1502
+ getInitialSettings: () => {
1503
+ return { ...settingsDefaults };
1504
+ },
1505
+ getPeekBundle: () => {
1506
+ const PEEK_BLOCK_ID = -1;
1507
+ const counter = { value: 0 };
1508
+ const allItems = [];
1509
+ const content = { ...contentDefaults };
1510
+ buildPeekItems(typeboxSchema.properties, PEEK_BLOCK_ID, null, content, allItems, counter);
1511
+ return {
1512
+ block: {
1513
+ id: PEEK_BLOCK_ID,
1514
+ pageId: null,
1515
+ layoutId: null,
1516
+ type: options.id,
1517
+ content,
1518
+ settings: settingsDefaults,
1519
+ placement: null,
1520
+ summary: "",
1521
+ position: "",
1522
+ createdAt: 0,
1523
+ updatedAt: 0
1524
+ },
1525
+ repeatableItems: allItems,
1526
+ files: []
1527
+ };
1485
1528
  }
1486
- return {
1487
- content: storageContent,
1488
- settings: { ...settingsDefaults },
1489
- repeatableItems: allSeeds
1490
- };
1491
- },
1492
- getInitialContent: () => {
1493
- return { ...contentDefaultsForStorage };
1494
- },
1495
- getInitialSettings: () => {
1496
- return { ...settingsDefaults };
1497
- },
1498
- getPeekBundle: () => {
1499
- const PEEK_BLOCK_ID = -1;
1500
- const counter = { value: 0 };
1501
- const allItems = [];
1502
- const content = { ...contentDefaults };
1503
- buildPeekItems(typeboxSchema.properties, PEEK_BLOCK_ID, null, content, allItems, counter);
1504
- return {
1505
- block: {
1506
- id: PEEK_BLOCK_ID,
1507
- pageId: null,
1508
- layoutId: null,
1509
- type: options.id,
1510
- content,
1511
- settings: settingsDefaults,
1512
- placement: null,
1513
- summary: "",
1514
- position: "",
1515
- createdAt: 0,
1516
- updatedAt: 0
1517
- },
1518
- repeatableItems: allItems,
1519
- files: []
1520
- };
1521
- },
1522
- layoutOnly: options.layoutOnly ?? false
1529
+ }
1523
1530
  };
1524
1531
  }
1525
1532
  function _temp() {