@blokkli/editor 2.0.0-alpha.15 → 2.0.0-alpha.16

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@blokkli/editor",
   "configKey": "blokkli",
-  "version": "2.0.0-alpha.15",
+  "version": "2.0.0-alpha.16",
   "compatibility": {
     "nuxt": ">=3.15.0"
   },

package/dist/module.mjs

@@ -15,7 +15,7 @@ import fs from 'node:fs';
 import { defu, createDefu } from 'defu';
 
 const name = "@blokkli/editor";
-const version = "2.0.0-alpha.15";
+const version = "2.0.0-alpha.16";
 
 function sortObjectKeys(obj) {
   if (Array.isArray(obj)) {
@@ -2301,7 +2301,7 @@ const publishRemoveSchedule$3 = {
 };
 const publishResultPublishChangesNowPublished$3 = {
 	source: "Changes are published, page is now published",
-	translation: "Änderungen sind publiziert, Seite ist jetzt publiziert"
+	translation: "Änderungen und Seite sind publiziert"
 };
 const publishResultPublishChangesRemainPublished$3 = {
 	source: "Changes are published, page remains published",
@@ -2315,9 +2315,13 @@ const publishResultScheduledChanges$3 = {
 	source: "Changes will be published on @date",
 	translation: "Änderungen werden am @date publiziert"
 };
+const publishResultScheduledPage$3 = {
+	source: "Page will be published on @date",
+	translation: "Seite wird am @date publiziert"
+};
 const publishRevisionLogMessage$3 = {
-	source: "Revision log message",
-	translation: "Protokollnachricht der Revision"
+	source: "Change description",
+	translation: "Beschreibung der Änderungen"
 };
 const publishRevisionLogMessageDescription$3 = {
 	source: "Briefly describe the changes made",
@@ -2335,7 +2339,7 @@ const publishScheduleDate$3 = {
 	source: "Publication date",
 	translation: "Veröffentlichungsdatum"
 };
-const publishScheduleDateTooSoon = {
+const publishScheduleDateTooSoon$3 = {
 	source: "The scheduled date must be at least 2 minutes in the future",
 	translation: "Das geplante Datum muss mindestens 2 Minuten in der Zukunft liegen"
 };
@@ -2463,6 +2467,10 @@ const searchTourText$3 = {
 	source: "Quickly find blocks on the current page or existing content to drag and drop as blocks into the page.",
 	translation: "Finden Sie Blöcke auf der aktuellen Seite oder andere bestehende Inhalte wie Bilder oder Dokumente, um sie als Blöcke auf der Seite hinzuzufügen."
 };
+const selectAllBlocks$3 = {
+	source: "Select all blocks",
+	translation: "Alle Blöcke auswählen"
+};
 const selectAllOfBundle$3 = {
 	source: "Select all \"@bundle\" blocks",
 	translation: "Alle «@bundle» Blöcke auswählen"
@@ -3168,12 +3176,13 @@ const de = {
 	publishResultPublishChangesRemainPublished: publishResultPublishChangesRemainPublished$3,
 	publishResultSaveChanges: publishResultSaveChanges$3,
 	publishResultScheduledChanges: publishResultScheduledChanges$3,
+	publishResultScheduledPage: publishResultScheduledPage$3,
 	publishRevisionLogMessage: publishRevisionLogMessage$3,
 	publishRevisionLogMessageDescription: publishRevisionLogMessageDescription$3,
 	publishSaveContent: publishSaveContent$3,
 	publishSaveContents: publishSaveContents$3,
 	publishScheduleDate: publishScheduleDate$3,
-	publishScheduleDateTooSoon: publishScheduleDateTooSoon,
+	publishScheduleDateTooSoon: publishScheduleDateTooSoon$3,
 	publishScheduleInSevenDays: publishScheduleInSevenDays$3,
 	publishScheduleNextMonday: publishScheduleNextMonday$3,
 	publishSchedulePublication: publishSchedulePublication$3,
@@ -3205,6 +3214,7 @@ const de = {
 	searchBoxPlaceholder: searchBoxPlaceholder$3,
 	searchToolbarLabel: searchToolbarLabel$3,
 	searchTourText: searchTourText$3,
+	selectAllBlocks: selectAllBlocks$3,
 	selectAllOfBundle: selectAllOfBundle$3,
 	selectionActionGroupTitle: selectionActionGroupTitle$3,
 	settingsAdvanced: settingsAdvanced$3,
@@ -4558,10 +4568,14 @@ const publishResultScheduledChanges$2 = {
 	source: "Changes will be published on @date",
 	translation: ""
 };
-const publishRevisionLogMessage$2 = {
-	source: "Revision log message",
+const publishResultScheduledPage$2 = {
+	source: "Page will be published on @date",
 	translation: ""
 };
+const publishRevisionLogMessage$2 = {
+	source: "Change description",
+	translation: "Description des modifications"
+};
 const publishRevisionLogMessageDescription$2 = {
 	source: "Briefly describe the changes made",
 	translation: ""
@@ -4578,6 +4592,10 @@ const publishScheduleDate$2 = {
 	source: "Publication date",
 	translation: ""
 };
+const publishScheduleDateTooSoon$2 = {
+	source: "The scheduled date must be at least 2 minutes in the future",
+	translation: ""
+};
 const publishScheduleInSevenDays$2 = {
 	source: "In 7 days",
 	translation: ""
@@ -4702,6 +4720,10 @@ const searchTourText$2 = {
 	source: "Quickly find blocks on the current page or existing content to drag and drop as blocks into the page.",
 	translation: ""
 };
+const selectAllBlocks$2 = {
+	source: "Select all blocks",
+	translation: ""
+};
 const selectAllOfBundle$2 = {
 	source: "Select all \"@bundle\" blocks",
 	translation: ""
@@ -5407,11 +5429,13 @@ const fr = {
 	publishResultPublishChangesRemainPublished: publishResultPublishChangesRemainPublished$2,
 	publishResultSaveChanges: publishResultSaveChanges$2,
 	publishResultScheduledChanges: publishResultScheduledChanges$2,
+	publishResultScheduledPage: publishResultScheduledPage$2,
 	publishRevisionLogMessage: publishRevisionLogMessage$2,
 	publishRevisionLogMessageDescription: publishRevisionLogMessageDescription$2,
 	publishSaveContent: publishSaveContent$2,
 	publishSaveContents: publishSaveContents$2,
 	publishScheduleDate: publishScheduleDate$2,
+	publishScheduleDateTooSoon: publishScheduleDateTooSoon$2,
 	publishScheduleInSevenDays: publishScheduleInSevenDays$2,
 	publishScheduleNextMonday: publishScheduleNextMonday$2,
 	publishSchedulePublication: publishSchedulePublication$2,
@@ -5443,6 +5467,7 @@ const fr = {
 	searchBoxPlaceholder: searchBoxPlaceholder$2,
 	searchToolbarLabel: searchToolbarLabel$2,
 	searchTourText: searchTourText$2,
+	selectAllBlocks: selectAllBlocks$2,
 	selectAllOfBundle: selectAllOfBundle$2,
 	selectionActionGroupTitle: selectionActionGroupTitle$2,
 	settingsAdvanced: settingsAdvanced$2,
@@ -6796,10 +6821,14 @@ const publishResultScheduledChanges$1 = {
 	source: "Changes will be published on @date",
 	translation: ""
 };
-const publishRevisionLogMessage$1 = {
-	source: "Revision log message",
+const publishResultScheduledPage$1 = {
+	source: "Page will be published on @date",
 	translation: ""
 };
+const publishRevisionLogMessage$1 = {
+	source: "Change description",
+	translation: "Descrizione delle modifiche"
+};
 const publishRevisionLogMessageDescription$1 = {
 	source: "Briefly describe the changes made",
 	translation: ""
@@ -6816,6 +6845,10 @@ const publishScheduleDate$1 = {
 	source: "Publication date",
 	translation: ""
 };
+const publishScheduleDateTooSoon$1 = {
+	source: "The scheduled date must be at least 2 minutes in the future",
+	translation: ""
+};
 const publishScheduleInSevenDays$1 = {
 	source: "In 7 days",
 	translation: ""
@@ -6940,6 +6973,10 @@ const searchTourText$1 = {
 	source: "Quickly find blocks on the current page or existing content to drag and drop as blocks into the page.",
 	translation: ""
 };
+const selectAllBlocks$1 = {
+	source: "Select all blocks",
+	translation: ""
+};
 const selectAllOfBundle$1 = {
 	source: "Select all \"@bundle\" blocks",
 	translation: ""
@@ -7645,11 +7682,13 @@ const it = {
 	publishResultPublishChangesRemainPublished: publishResultPublishChangesRemainPublished$1,
 	publishResultSaveChanges: publishResultSaveChanges$1,
 	publishResultScheduledChanges: publishResultScheduledChanges$1,
+	publishResultScheduledPage: publishResultScheduledPage$1,
 	publishRevisionLogMessage: publishRevisionLogMessage$1,
 	publishRevisionLogMessageDescription: publishRevisionLogMessageDescription$1,
 	publishSaveContent: publishSaveContent$1,
 	publishSaveContents: publishSaveContents$1,
 	publishScheduleDate: publishScheduleDate$1,
+	publishScheduleDateTooSoon: publishScheduleDateTooSoon$1,
 	publishScheduleInSevenDays: publishScheduleInSevenDays$1,
 	publishScheduleNextMonday: publishScheduleNextMonday$1,
 	publishSchedulePublication: publishSchedulePublication$1,
@@ -7681,6 +7720,7 @@ const it = {
 	searchBoxPlaceholder: searchBoxPlaceholder$1,
 	searchToolbarLabel: searchToolbarLabel$1,
 	searchTourText: searchTourText$1,
+	selectAllBlocks: selectAllBlocks$1,
 	selectAllOfBundle: selectAllOfBundle$1,
 	selectionActionGroupTitle: selectionActionGroupTitle$1,
 	settingsAdvanced: settingsAdvanced$1,
@@ -9034,8 +9074,12 @@ const publishResultScheduledChanges = {
 	source: "Changes will be published on @date",
 	translation: ""
 };
+const publishResultScheduledPage = {
+	source: "Page will be published on @date",
+	translation: ""
+};
 const publishRevisionLogMessage = {
-	source: "Revision log message",
+	source: "Change description",
 	translation: ""
 };
 const publishRevisionLogMessageDescription = {
@@ -9054,6 +9098,10 @@ const publishScheduleDate = {
 	source: "Publication date",
 	translation: ""
 };
+const publishScheduleDateTooSoon = {
+	source: "The scheduled date must be at least 2 minutes in the future",
+	translation: ""
+};
 const publishScheduleInSevenDays = {
 	source: "In 7 days",
 	translation: ""
@@ -9178,6 +9226,10 @@ const searchTourText = {
 	source: "Quickly find blocks on the current page or existing content to drag and drop as blocks into the page.",
 	translation: "Find schnäll Blöck uf dr aktuälle Sitte oder bestehendi Inhält zum si als Blöck in d'Sitte z'zieh."
 };
+const selectAllBlocks = {
+	source: "Select all blocks",
+	translation: ""
+};
 const selectAllOfBundle = {
 	source: "Select all \"@bundle\" blocks",
 	translation: "Alli «@bundle»-Blöck uswähle"
@@ -9883,11 +9935,13 @@ const gsw_CH = {
 	publishResultPublishChangesRemainPublished: publishResultPublishChangesRemainPublished,
 	publishResultSaveChanges: publishResultSaveChanges,
 	publishResultScheduledChanges: publishResultScheduledChanges,
+	publishResultScheduledPage: publishResultScheduledPage,
 	publishRevisionLogMessage: publishRevisionLogMessage,
 	publishRevisionLogMessageDescription: publishRevisionLogMessageDescription,
 	publishSaveContent: publishSaveContent,
 	publishSaveContents: publishSaveContents,
 	publishScheduleDate: publishScheduleDate,
+	publishScheduleDateTooSoon: publishScheduleDateTooSoon,
 	publishScheduleInSevenDays: publishScheduleInSevenDays,
 	publishScheduleNextMonday: publishScheduleNextMonday,
 	publishSchedulePublication: publishSchedulePublication,
@@ -9919,6 +9973,7 @@ const gsw_CH = {
 	searchBoxPlaceholder: searchBoxPlaceholder,
 	searchToolbarLabel: searchToolbarLabel,
 	searchTourText: searchTourText,
+	selectAllBlocks: selectAllBlocks,
 	selectAllOfBundle: selectAllOfBundle,
 	selectionActionGroupTitle: selectionActionGroupTitle,
 	settingsAdvanced: settingsAdvanced,

package/dist/runtime/components/Edit/Dialog/index.vue

@@ -32,6 +32,9 @@
           <slot />
         </div>
       </div>
+      <div v-if="$slots['pre-footer']" class="bk-dialog-pre-footer">
+        <slot name="pre-footer" />
+      </div>
       <div v-if="!hideButtons" class="bk bk-dialog-footer">
         <button
           class="bk-button"

package/dist/runtime/components/Edit/Dialog/index.vue.d.ts

@@ -35,6 +35,8 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
     canSubmit: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
+} & {
+    'pre-footer'?: (props: {}) => any;
 }>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/fragment.glsl

@@ -8,6 +8,7 @@ varying vec3 v_color;
 uniform float u_scale;
 uniform float u_dpi;
 uniform vec2 u_resolution;
+uniform float u_active_hover_nesting_level;
 
 float roundedBoxSDF(vec2 CenterPosition, vec2 Size, float Radius) {
   return length(max(abs(CenterPosition) - Size + Radius, 0.0)) - Radius;
@@ -74,7 +75,12 @@ void main() {
       : alphaInner * 0.2;
 
   if (v_is_hover_area >= 1.0) {
-    adjustedAlphaFill *= 0.5;
+    // If nesting level is 0, don't render the fill (border only)
+    if (u_active_hover_nesting_level < 0.5) {
+      adjustedAlphaFill = 0.0;
+    } else {
+      adjustedAlphaFill *= 0.5;
+    }
   }
 
   if (alphaBorder > 0.0) {

package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/index.vue

@@ -444,6 +444,7 @@ class DropTargetRectangleBufferCollector extends RectangleBufferCollector {
         false
       );
     }
+    this.processPendingRects();
     const hasChanged = lengthBefore !== this.positions.length;
     if (hasChanged) {
       this.bufferInfo = this.createBufferInfo();
@@ -483,7 +484,9 @@ class DropTargetRectangleBufferCollector extends RectangleBufferCollector {
     return null;
   }
 }
-const collector = new DropTargetRectangleBufferCollector(gl);
+const collector = new DropTargetRectangleBufferCollector(gl, {
+  deferredMode: true
+});
 if (gl) {
   collector.addRectangle(
     {
@@ -541,6 +544,18 @@ const activeHoverRect = computed(() => {
     return [0, 0, 0, 0];
   }
   const outset = activeHoverField.value.field.nestingLevel === 0 ? 0 : 20;
+  if (activeHoverField.value.emptyChild) {
+    const emptyChildId = activeHoverField.value.emptyChild.id;
+    const adjustedRect = collector.rects[emptyChildId];
+    if (adjustedRect) {
+      return [
+        adjustedRect.x - outset,
+        adjustedRect.y - outset,
+        adjustedRect.width + 2 * outset,
+        adjustedRect.height + 2 * outset
+      ];
+    }
+  }
   return [
     activeHoverField.value.x - outset,
     activeHoverField.value.y - outset,
@@ -551,6 +566,9 @@ const activeHoverRect = computed(() => {
 const activeHoverColor = computed(() => {
   return getColorForField(activeHoverField.value);
 });
+const activeHoverFieldNestingLevel = computed(() => {
+  return activeHoverField.value?.field.nestingLevel ?? 0;
+});
 const uniforms = computed(() => {
   const index = active.value?.index;
   return {
@@ -561,7 +579,8 @@ const uniforms = computed(() => {
     u_color_hover_area: toShaderColor(activeHoverColor.value),
     u_color_area: toShaderColor(theme.teal.value.normal),
     u_active_rect_id: index === void 0 ? -1 : index,
-    u_active_hover_rect: activeHoverRect.value
+    u_active_hover_rect: activeHoverRect.value,
+    u_active_hover_nesting_level: activeHoverFieldNestingLevel.value
   };
 });
 const dragBox = ref({
@@ -621,6 +640,7 @@ onBlokkliEvent("canvas:draw", () => {
     gl.useProgram(programInfo.program);
     animation.setSharedUniforms(gl, programInfo);
   }
+  const { info, hasChanged } = collector.getBufferInfo();
   if (!props.isTouch) {
     if (cursorIsInsideClipped()) {
       const closest = collector.getClosestIntersectingRect(
@@ -632,7 +652,6 @@ onBlokkliEvent("canvas:draw", () => {
       active.value = null;
     }
   }
-  const { info, hasChanged } = collector.getBufferInfo();
   if (programInfo && gl) {
     setHoveredFieldArea(dragBox.value, mouseAbsolute);
     setUniforms(programInfo, uniforms.value);

package/dist/runtime/components/Edit/Features/DraggingOverlay/DropTargets/vertex.glsl

@@ -17,6 +17,7 @@ uniform vec3 u_color_field_3;
 uniform vec3 u_color_area;
 uniform vec3 u_color_hover_area;
 uniform vec4 u_active_hover_rect;
+uniform float u_active_hover_nesting_level;
 uniform float u_dpi;
 
 varying vec4 v_quad;

package/dist/runtime/components/Edit/Features/Publish/Dialog/Summary.vue

@@ -31,8 +31,8 @@
     </div>
 
     <!-- Result State -->
-    <div class="bk-publish-summary-state">
-      <div class="bk-publish-summary-state-icon" :class="resultStateClass">
+    <div class="bk-publish-summary-state" :class="resultStateClass">
+      <div>
         <Icon :name="resultStateIcon" />
       </div>
       <div class="bk-publish-summary-state-label">

package/dist/runtime/components/Edit/Features/Publish/Dialog/index.vue

@@ -78,7 +78,7 @@
         <FormTextarea
           id="revision-message"
           v-model="revisionMessage"
-          :label="$t('publishRevisionLogMessage', 'Revision log message')"
+          :label="$t('publishRevisionLogMessage', 'Change description')"
           :description="
   $t(
     'publishRevisionLogMessageDescription',
@@ -143,7 +143,9 @@
           </tbody>
         </table>
       </FormItem>
-      <FormItem class="bk-is-summary">
+    </div>
+    <template #pre-footer>
+      <div>
         <h3 class="bk-form-label">
           {{ $t("publishSummary", "Summary") }}
         </h3>
@@ -154,8 +156,8 @@
           :action-label="actionLabel"
           :result-state-label="resultStateLabel"
         />
-      </FormItem>
-    </div>
+      </div>
+    </template>
   </DialogModal>
 </template>
 
@@ -250,10 +252,12 @@ const publishModeOptions = computed(() => {
   return options;
 });
 const scheduleDate = ref(publishOn.value || "");
-console.log("SET REIVISON LOG MESSAGE");
 if (publishOptions.value?.revisionLogMessage) {
   revisionMessage.value = publishOptions.value.revisionLogMessage;
 }
+if (!isCurrentlyPublished.value) {
+  publishMode.value = "save";
+}
 if (publishOn.value) {
   publishMode.value = "scheduled";
 }
@@ -400,9 +404,15 @@ const resultStateLabel = computed(() => {
   }
   if (publishMode.value === "scheduled" && scheduleDate.value) {
     const formattedDate = ui.formatDate(scheduleDate.value);
+    if (isCurrentlyPublished.value) {
+      return $t(
+        "publishResultScheduledChanges",
+        "Changes will be published on @date"
+      ).replace("@date", formattedDate);
+    }
     return $t(
-      "publishResultScheduledChanges",
-      "Changes will be published on @date"
+      "publishResultScheduledPage",
+      "Page will be published on @date"
     ).replace("@date", formattedDate);
   }
   if (isCurrentlyPublished.value) {

package/dist/runtime/components/Edit/Features/Selection/index.vue

@@ -85,13 +85,24 @@ const itemDropdownItems = computed(() => {
         )
       }
     ];
+  } else if (selection.hasHostSelected.value) {
+    return [
+      {
+        id: "select-all-blocks",
+        label: $t("selectAllBlocks", "Select all blocks")
+      }
+    ];
   }
   return [];
 });
 function onSelectDropdownItem(item) {
-  if (item.id === "select-all-of-bundle" && selectedBundle.value) {
-    const uuids = state.getAllUuids(selectedBundle.value);
-    eventBus.emit("select", uuids);
+  if (item.id === "select-all-of-bundle") {
+    if (selectedBundle.value) {
+      const uuids = state.getAllUuids(selectedBundle.value);
+      eventBus.emit("select", uuids);
+    }
+  } else if (item.id === "select-all-blocks") {
+    selectAllBlocks();
   }
 }
 const artboardElement = ui.artboardElement();
@@ -226,6 +237,12 @@ const visuallySelectBlocks = (toggleUuid) => {
   }
   return filter(encompassingRect);
 };
+function selectAllBlocks() {
+  eventBus.emit(
+    "select:end",
+    getSelectAllUuids(dom.getAllBlocks(), selection.blocks.value)
+  );
+}
 onBlokkliEvent("select:shiftToggle", (uuid) => {
   const uuids = visuallySelectBlocks(uuid);
   if (uuids) {
@@ -263,10 +280,7 @@ onBlokkliEvent("keyPressed", (e) => {
       return;
     }
     e.originalEvent.preventDefault();
-    eventBus.emit(
-      "select:end",
-      getSelectAllUuids(dom.getAllBlocks(), selection.blocks.value)
-    );
+    selectAllBlocks();
   }
 });
 </script>

package/dist/runtime/composables/defineBlokkli.js

@@ -59,7 +59,7 @@ export function defineBlokkli(arg) {
         ...editContext?.mutatedOptions[uuid] || {}
       };
     }
-    const optionKey = bundle === BUNDLE_BLOKKLI_FRAGMENT ? "fragment:" + item?.value.fragmentName + "__default" : identifier;
+    const optionKey = bundle === BUNDLE_BLOKKLI_FRAGMENT ? "fragment:" + item?.value.fragmentName : identifier;
     const runtimeOptionDefinitions = (editContext?.definitions.runtimeOptions.value || OPTIONS)[optionKey] || {};
     const result = Object.entries(runtimeOptionDefinitions).reduce((acc, [key, v]) => {
       const definition = v;