@bagelink/blox 1.15.47 → 1.15.51

package/dist/{PreviewApp-CCxTa86_.js → PreviewApp-BrpFk5Ud.js}

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "./PreviewApp.vue_vue_type_style_index_0_lang-Bv4eRrVz.js";
+import { _ as _sfc_main } from "./PreviewApp.vue_vue_type_style_index_0_lang-weDpp7Uy.js";
 export {
   _sfc_main as default
 };

package/dist/{PreviewApp-C5hzLdHt.cjs → PreviewApp-C6NyDvt7.cjs}

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const PreviewApp_vue_vue_type_style_index_0_lang = require("./PreviewApp.vue_vue_type_style_index_0_lang-Da4Pi_Lc.cjs");
+const PreviewApp_vue_vue_type_style_index_0_lang = require("./PreviewApp.vue_vue_type_style_index_0_lang-y8aUlctU.cjs");
 exports.default = PreviewApp_vue_vue_type_style_index_0_lang._sfc_main;

package/dist/PreviewApp.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewApp.vue.d.ts","sourceRoot":"","sources":["../src/PreviewApp.vue"],"names":[],"mappings":";AA+NA,wBAMG"}
+{"version":3,"file":"PreviewApp.vue.d.ts","sourceRoot":"","sources":["../src/PreviewApp.vue"],"names":[],"mappings":";AA6RA,wBAMG"}

package/dist/{PreviewApp.vue_vue_type_style_index_0_lang-Bv4eRrVz.js → PreviewApp.vue_vue_type_style_index_0_lang-weDpp7Uy.js}

@@ -1,5 +1,5 @@
 import { defineComponent, inject, ref, h, provide, onMounted, onUnmounted, openBlock, createElementBlock, createVNode, unref, nextTick } from "vue";
-import { e as BLOX_REGISTRY_KEY, u as useLocale } from "./core-Do0ELzJT.js";
+import { B as BLOX_REGISTRY_KEY, u as useLocale } from "./core-CIFcs9Cn.js";
 function sendToEditor(msg) {
   window.parent.postMessage(msg, "*");
 }
@@ -21,6 +21,11 @@ const PreviewRenderer = defineComponent({
     hoveredIndex: {
       type: Number,
       default: null
+    },
+    /** Block types that are global/shared (nav, footer, …) — highlighted distinctly. */
+    globalBlockTypes: {
+      type: Array,
+      default: () => []
     }
   },
   setup(props) {
@@ -29,6 +34,15 @@ const PreviewRenderer = defineComponent({
     function onBlockClick(index) {
       sendToEditor({ type: "BLOX_BLOCK_CLICK", index });
     }
+    function onBlockContextMenu(index, event) {
+      event.preventDefault();
+      sendToEditor({
+        type: "BLOX_BLOCK_CONTEXTMENU",
+        index,
+        x: event.clientX,
+        y: event.clientY
+      });
+    }
     function onBlockEnter(index) {
       localHovered.value = index;
       sendToEditor({ type: "BLOX_BLOCK_HOVER", index });
@@ -37,29 +51,24 @@ const PreviewRenderer = defineComponent({
       localHovered.value = null;
       sendToEditor({ type: "BLOX_BLOCK_HOVER", index: null });
     }
+    const REGULAR = { solid: "#6366f1", rgb: "99, 102, 241" };
+    const GLOBAL = { solid: "#f59e0b", rgb: "245, 158, 11" };
     const wrapperStyle = { position: "relative", cursor: "pointer" };
-    const overlayBase = {
+    const overlayBaseFor = (rgb) => ({
       position: "absolute",
       inset: "0",
-      zIndex: "10",
+      zIndex: "2147483646",
       pointerEvents: "auto",
-      transition: "box-shadow 0.12s, background 0.12s"
-    };
-    const overlayHovered = {
-      ...overlayBase,
-      boxShadow: "inset 0 0 0 2px rgba(99, 102, 241, 0.5)",
-      background: "rgba(99, 102, 241, 0.04)"
-    };
-    const overlaySelected = {
-      ...overlayBase,
-      boxShadow: "inset 0 0 0 3px #6366f1",
-      background: "rgba(99, 102, 241, 0.06)"
-    };
-    const labelBase = {
+      transition: "box-shadow 0.12s, background 0.12s",
+      boxShadow: "none",
+      background: "transparent",
+      "--blox-rgb": rgb
+    });
+    const labelBaseFor = (palette) => ({
       position: "absolute",
       top: "0",
       left: "0",
-      zIndex: "20",
+      zIndex: "2147483647",
       padding: "2px 8px",
       fontSize: "11px",
       fontFamily: "system-ui, sans-serif",
@@ -69,11 +78,10 @@ const PreviewRenderer = defineComponent({
       textTransform: "uppercase",
       pointerEvents: "none",
       whiteSpace: "nowrap",
-      color: "#6366f1",
-      background: "rgba(99, 102, 241, 0.1)",
+      color: palette.solid,
+      background: `rgba(${palette.rgb}, 0.12)`,
       borderBottomRightRadius: "4px"
-    };
-    const labelSelected = { ...labelBase, color: "#fff", background: "#6366f1" };
+    });
     return () => h(
       "div",
       { class: "blox-preview-canvas" },
@@ -83,7 +91,18 @@ const PreviewRenderer = defineComponent({
         const isSelected = props.selectedIndex === i;
         const isHovered = (props.hoveredIndex === i || localHovered.value === i) && !isSelected;
         const { label } = definition.schema;
-        const overlayStyle = isSelected ? overlaySelected : isHovered ? overlayHovered : overlayBase;
+        const isGlobal = props.globalBlockTypes.includes(block.type);
+        const palette = isGlobal ? GLOBAL : REGULAR;
+        const overlayStyle = { ...overlayBaseFor(palette.rgb) };
+        if (isSelected) {
+          overlayStyle.boxShadow = `inset 0 0 0 3px ${palette.solid}`;
+          overlayStyle.background = `rgba(${palette.rgb}, 0.06)`;
+        } else if (isHovered) {
+          overlayStyle.boxShadow = `inset 0 0 0 2px rgba(${palette.rgb}, 0.5)`;
+          overlayStyle.background = `rgba(${palette.rgb}, 0.04)`;
+        }
+        const labelBase = labelBaseFor(palette);
+        const labelStyle = isSelected ? { ...labelBase, color: "#fff", background: palette.solid } : labelBase;
         return [
           h(
             "div",
@@ -94,6 +113,9 @@ const PreviewRenderer = defineComponent({
               "onClick": () => {
                 onBlockClick(i);
               },
+              "onContextmenu": (e) => {
+                onBlockContextMenu(i, e);
+              },
               "onMouseenter": () => {
                 onBlockEnter(i);
               },
@@ -102,7 +124,7 @@ const PreviewRenderer = defineComponent({
             [
               h(definition.component, { ...definition.schema.defaults, ...block.props }),
               h("div", { style: overlayStyle }),
-              (isSelected || isHovered) && h("div", { style: isSelected ? labelSelected : labelBase }, label)
+              (isSelected || isHovered) && h("div", { style: labelStyle }, label)
             ]
           )
         ];
@@ -120,6 +142,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const contexts = ref({});
     const selectedIndex = ref(null);
     const hoveredIndex = ref(null);
+    const globalBlockTypes = ref([]);
     provide("contexts", contexts);
     let heightObserver = null;
     function onMessage(event) {
@@ -149,13 +172,32 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         case "BLOX_HOVER_BLOCK":
           hoveredIndex.value = msg.index;
           break;
+        case "BLOX_SET_GLOBAL_BLOCKS":
+          globalBlockTypes.value = msg.types ?? [];
+          break;
         case "BLOX_SCROLL_TOP":
           window.scrollTo(0, 0);
           break;
       }
     }
+    function blockNavigation(event) {
+      const target = event.target;
+      const anchor = target == null ? void 0 : target.closest("a");
+      if (anchor && (anchor.getAttribute("href") || anchor.hasAttribute("target"))) {
+        event.preventDefault();
+      }
+    }
+    function blockSubmit(event) {
+      event.preventDefault();
+    }
+    function blockUnload(event) {
+      event.preventDefault();
+    }
     onMounted(() => {
       window.addEventListener("message", onMessage);
+      document.addEventListener("click", blockNavigation, true);
+      document.addEventListener("submit", blockSubmit, true);
+      window.addEventListener("beforeunload", blockUnload);
       heightObserver = new ResizeObserver(() => {
         sendToEditor({ type: "BLOX_HEIGHT", height: document.body.scrollHeight });
       });
@@ -167,6 +209,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     onUnmounted(() => {
       window.removeEventListener("message", onMessage);
+      document.removeEventListener("click", blockNavigation, true);
+      document.removeEventListener("submit", blockSubmit, true);
+      window.removeEventListener("beforeunload", blockUnload);
       heightObserver == null ? void 0 : heightObserver.disconnect();
     });
     return (_ctx, _cache) => {
@@ -174,8 +219,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createVNode(unref(PreviewRenderer), {
           blocks: blocks.value,
           "selected-index": selectedIndex.value,
-          "hovered-index": hoveredIndex.value
-        }, null, 8, ["blocks", "selected-index", "hovered-index"])
+          "hovered-index": hoveredIndex.value,
+          "global-block-types": globalBlockTypes.value
+        }, null, 8, ["blocks", "selected-index", "hovered-index", "global-block-types"])
       ]);
     };
   }

package/dist/{PreviewApp.vue_vue_type_style_index_0_lang-Da4Pi_Lc.cjs → PreviewApp.vue_vue_type_style_index_0_lang-y8aUlctU.cjs}

@@ -1,6 +1,6 @@
 "use strict";
 const vue = require("vue");
-const core = require("./core-CR2evIjK.cjs");
+const core = require("./core-ZJ2VPvQb.cjs");
 function sendToEditor(msg) {
   window.parent.postMessage(msg, "*");
 }
@@ -22,6 +22,11 @@ const PreviewRenderer = vue.defineComponent({
     hoveredIndex: {
       type: Number,
       default: null
+    },
+    /** Block types that are global/shared (nav, footer, …) — highlighted distinctly. */
+    globalBlockTypes: {
+      type: Array,
+      default: () => []
     }
   },
   setup(props) {
@@ -30,6 +35,15 @@ const PreviewRenderer = vue.defineComponent({
     function onBlockClick(index) {
       sendToEditor({ type: "BLOX_BLOCK_CLICK", index });
     }
+    function onBlockContextMenu(index, event) {
+      event.preventDefault();
+      sendToEditor({
+        type: "BLOX_BLOCK_CONTEXTMENU",
+        index,
+        x: event.clientX,
+        y: event.clientY
+      });
+    }
     function onBlockEnter(index) {
       localHovered.value = index;
       sendToEditor({ type: "BLOX_BLOCK_HOVER", index });
@@ -38,29 +52,24 @@ const PreviewRenderer = vue.defineComponent({
       localHovered.value = null;
       sendToEditor({ type: "BLOX_BLOCK_HOVER", index: null });
     }
+    const REGULAR = { solid: "#6366f1", rgb: "99, 102, 241" };
+    const GLOBAL = { solid: "#f59e0b", rgb: "245, 158, 11" };
     const wrapperStyle = { position: "relative", cursor: "pointer" };
-    const overlayBase = {
+    const overlayBaseFor = (rgb) => ({
       position: "absolute",
       inset: "0",
-      zIndex: "10",
+      zIndex: "2147483646",
       pointerEvents: "auto",
-      transition: "box-shadow 0.12s, background 0.12s"
-    };
-    const overlayHovered = {
-      ...overlayBase,
-      boxShadow: "inset 0 0 0 2px rgba(99, 102, 241, 0.5)",
-      background: "rgba(99, 102, 241, 0.04)"
-    };
-    const overlaySelected = {
-      ...overlayBase,
-      boxShadow: "inset 0 0 0 3px #6366f1",
-      background: "rgba(99, 102, 241, 0.06)"
-    };
-    const labelBase = {
+      transition: "box-shadow 0.12s, background 0.12s",
+      boxShadow: "none",
+      background: "transparent",
+      "--blox-rgb": rgb
+    });
+    const labelBaseFor = (palette) => ({
       position: "absolute",
       top: "0",
       left: "0",
-      zIndex: "20",
+      zIndex: "2147483647",
       padding: "2px 8px",
       fontSize: "11px",
       fontFamily: "system-ui, sans-serif",
@@ -70,11 +79,10 @@ const PreviewRenderer = vue.defineComponent({
       textTransform: "uppercase",
       pointerEvents: "none",
       whiteSpace: "nowrap",
-      color: "#6366f1",
-      background: "rgba(99, 102, 241, 0.1)",
+      color: palette.solid,
+      background: `rgba(${palette.rgb}, 0.12)`,
       borderBottomRightRadius: "4px"
-    };
-    const labelSelected = { ...labelBase, color: "#fff", background: "#6366f1" };
+    });
     return () => vue.h(
       "div",
       { class: "blox-preview-canvas" },
@@ -84,7 +92,18 @@ const PreviewRenderer = vue.defineComponent({
         const isSelected = props.selectedIndex === i;
         const isHovered = (props.hoveredIndex === i || localHovered.value === i) && !isSelected;
         const { label } = definition.schema;
-        const overlayStyle = isSelected ? overlaySelected : isHovered ? overlayHovered : overlayBase;
+        const isGlobal = props.globalBlockTypes.includes(block.type);
+        const palette = isGlobal ? GLOBAL : REGULAR;
+        const overlayStyle = { ...overlayBaseFor(palette.rgb) };
+        if (isSelected) {
+          overlayStyle.boxShadow = `inset 0 0 0 3px ${palette.solid}`;
+          overlayStyle.background = `rgba(${palette.rgb}, 0.06)`;
+        } else if (isHovered) {
+          overlayStyle.boxShadow = `inset 0 0 0 2px rgba(${palette.rgb}, 0.5)`;
+          overlayStyle.background = `rgba(${palette.rgb}, 0.04)`;
+        }
+        const labelBase = labelBaseFor(palette);
+        const labelStyle = isSelected ? { ...labelBase, color: "#fff", background: palette.solid } : labelBase;
         return [
           vue.h(
             "div",
@@ -95,6 +114,9 @@ const PreviewRenderer = vue.defineComponent({
               "onClick": () => {
                 onBlockClick(i);
               },
+              "onContextmenu": (e) => {
+                onBlockContextMenu(i, e);
+              },
               "onMouseenter": () => {
                 onBlockEnter(i);
               },
@@ -103,7 +125,7 @@ const PreviewRenderer = vue.defineComponent({
             [
               vue.h(definition.component, { ...definition.schema.defaults, ...block.props }),
               vue.h("div", { style: overlayStyle }),
-              (isSelected || isHovered) && vue.h("div", { style: isSelected ? labelSelected : labelBase }, label)
+              (isSelected || isHovered) && vue.h("div", { style: labelStyle }, label)
             ]
           )
         ];
@@ -121,6 +143,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const contexts = vue.ref({});
     const selectedIndex = vue.ref(null);
     const hoveredIndex = vue.ref(null);
+    const globalBlockTypes = vue.ref([]);
     vue.provide("contexts", contexts);
     let heightObserver = null;
     function onMessage(event) {
@@ -150,13 +173,32 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         case "BLOX_HOVER_BLOCK":
           hoveredIndex.value = msg.index;
           break;
+        case "BLOX_SET_GLOBAL_BLOCKS":
+          globalBlockTypes.value = msg.types ?? [];
+          break;
         case "BLOX_SCROLL_TOP":
           window.scrollTo(0, 0);
           break;
       }
     }
+    function blockNavigation(event) {
+      const target = event.target;
+      const anchor = target == null ? void 0 : target.closest("a");
+      if (anchor && (anchor.getAttribute("href") || anchor.hasAttribute("target"))) {
+        event.preventDefault();
+      }
+    }
+    function blockSubmit(event) {
+      event.preventDefault();
+    }
+    function blockUnload(event) {
+      event.preventDefault();
+    }
     vue.onMounted(() => {
       window.addEventListener("message", onMessage);
+      document.addEventListener("click", blockNavigation, true);
+      document.addEventListener("submit", blockSubmit, true);
+      window.addEventListener("beforeunload", blockUnload);
       heightObserver = new ResizeObserver(() => {
         sendToEditor({ type: "BLOX_HEIGHT", height: document.body.scrollHeight });
       });
@@ -168,6 +210,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     });
     vue.onUnmounted(() => {
       window.removeEventListener("message", onMessage);
+      document.removeEventListener("click", blockNavigation, true);
+      document.removeEventListener("submit", blockSubmit, true);
+      window.removeEventListener("beforeunload", blockUnload);
       heightObserver == null ? void 0 : heightObserver.disconnect();
     });
     return (_ctx, _cache) => {
@@ -175,8 +220,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         vue.createVNode(vue.unref(PreviewRenderer), {
           blocks: blocks.value,
           "selected-index": selectedIndex.value,
-          "hovered-index": hoveredIndex.value
-        }, null, 8, ["blocks", "selected-index", "hovered-index"])
+          "hovered-index": hoveredIndex.value,
+          "global-block-types": globalBlockTypes.value
+        }, null, 8, ["blocks", "selected-index", "hovered-index", "global-block-types"])
       ]);
     };
   }

package/dist/PreviewRenderer.d.ts

@@ -13,6 +13,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: PropType<number | null>;
         default: null;
     };
+    /** Block types that are global/shared (nav, footer, …) — highlighted distinctly. */
+    globalBlockTypes: {
+        type: PropType<string[]>;
+        default: () => string[];
+    };
 }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
@@ -28,10 +33,16 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: PropType<number | null>;
         default: null;
     };
+    /** Block types that are global/shared (nav, footer, …) — highlighted distinctly. */
+    globalBlockTypes: {
+        type: PropType<string[]>;
+        default: () => string[];
+    };
 }>> & Readonly<{}>, {
     blocks: Block[];
     selectedIndex: number | null;
     hoveredIndex: number | null;
+    globalBlockTypes: string[];
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=PreviewRenderer.d.ts.map

package/dist/PreviewRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewRenderer.d.ts","sourceRoot":"","sources":["../src/PreviewRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;;;cAatB,QAAQ,CAAC,KAAK,EAAE,CAAC;uBACnB,KAAK,EAAE;;;cAGJ,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;cAIvB,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;;;;cARxB,QAAQ,CAAC,KAAK,EAAE,CAAC;uBACnB,KAAK,EAAE;;;cAGJ,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;cAIvB,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;;;;;AAZ1C,wBA8FE"}
+{"version":3,"file":"PreviewRenderer.d.ts","sourceRoot":"","sources":["../src/PreviewRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;;;cAatB,QAAQ,CAAC,KAAK,EAAE,CAAC;uBACnB,KAAK,EAAE;;;cAGJ,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;cAIvB,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;IAGxC,oFAAoF;;cAEpE,QAAQ,CAAC,MAAM,EAAE,CAAC;uBACpB,MAAM,EAAE;;;;;;cAdN,QAAQ,CAAC,KAAK,EAAE,CAAC;uBACnB,KAAK,EAAE;;;cAGJ,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;;cAIvB,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;;;IAGxC,oFAAoF;;cAEpE,QAAQ,CAAC,MAAM,EAAE,CAAC;uBACpB,MAAM,EAAE;;;;;;;;AAlBxB,wBA8HE"}

package/dist/bridge.d.ts

@@ -28,6 +28,25 @@ export type EditorMessage = {
     index: number | null;
 } | {
     type: 'BLOX_SCROLL_TOP';
+}
+/**
+ * Tells the preview which block types are global/shared (e.g. nav, footer).
+ * The preview renders their selection/hover overlay in a distinct color so
+ * it's clear editing them affects every page.
+ */
+ | {
+    type: 'BLOX_SET_GLOBAL_BLOCKS';
+    types: string[];
+}
+/**
+ * Tells the preview that a global/shared block's content changed (e.g. the
+ * editor saved the nav or footer singleton). Global block components should
+ * re-fetch their shared content. `block` optionally narrows the refresh to a
+ * single block type; when omitted, all global blocks should refresh.
+ */
+ | {
+    type: 'BLOX_REFRESH_GLOBAL';
+    block?: string;
 };
 export type PreviewMessage = {
     type: 'BLOX_READY';
@@ -38,6 +57,18 @@ export type PreviewMessage = {
 } | {
     type: 'BLOX_BLOCK_HOVER';
     index: number | null;
+}
+/**
+ * Right-click on a block in the preview. `x`/`y` are the pointer position
+ * relative to the iframe viewport; the editor maps them to its own
+ * coordinate space (accounting for the iframe offset + zoom) to open a
+ * context menu.
+ */
+ | {
+    type: 'BLOX_BLOCK_CONTEXTMENU';
+    index: number;
+    x: number;
+    y: number;
 } | {
     type: 'BLOX_HEIGHT';
     height: number;

package/dist/bridge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bridge.d.ts","sourceRoot":"","sources":["../src/bridge.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAEzD,MAAM,WAAW,eAAe;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,gBAAgB,CAAA;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAClC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACd;AAMD,MAAM,MAAM,aAAa,GACpB;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,IAAI,EAAE,eAAe,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAC7D;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,MAAM,EAAE,KAAK,EAAE,CAAA;CAAE,GAC5C;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,mBAAmB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GACnD;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GAClD;IAAE,IAAI,EAAE,iBAAiB,CAAA;CAAE,CAAA;AAM/B,MAAM,MAAM,cAAc,GACrB;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;CAAE,GAClE;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GAClD;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GACvC;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAA;AAM3C,wBAAgB,YAAY,CAAC,GAAG,EAAE,cAAc,GAAG,IAAI,CAEtD;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,iBAAiB,EAAE,GAAG,EAAE,aAAa,GAAG,IAAI,CAEjF"}
+{"version":3,"file":"bridge.d.ts","sourceRoot":"","sources":["../src/bridge.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAEzD,MAAM,WAAW,eAAe;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,gBAAgB,CAAA;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAClC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACd;AAMD,MAAM,MAAM,aAAa,GACpB;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,IAAI,EAAE,eAAe,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAC7D;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,MAAM,EAAE,KAAK,EAAE,CAAA;CAAE,GAC5C;IAAE,IAAI,EAAE,iBAAiB,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,mBAAmB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GACnD;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,GAClD;IAAE,IAAI,EAAE,iBAAiB,CAAA;CAAE;AAC7B;;;;GAIG;GACD;IAAE,IAAI,EAAE,wBAAwB,CAAC;IAAC,KAAK,EAAE,MAAM,EAAE,CAAA;CAAE;AACrD;;;;;GAKG;GACD;IAAE,IAAI,EAAE,qBAAqB,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAMnD,MAAM,MAAM,cAAc,GACrB;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;CAAE,GAClE;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE;AACpD;;;;;GAKG;GACD;IAAE,IAAI,EAAE,wBAAwB,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GACvE;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GACvC;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAA;AAM3C,wBAAgB,YAAY,CAAC,GAAG,EAAE,cAAc,GAAG,IAAI,CAEtD;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,iBAAiB,EAAE,GAAG,EAAE,aAAa,GAAG,IAAI,CAEjF"}

package/dist/composables/useGlobalBlock.d.ts

@@ -0,0 +1,31 @@
+import { Ref } from 'vue';
+/**
+ * Loader for a global/shared block's content.
+ *
+ * Receives nothing and returns the saved props object (or `null` when nothing
+ * is saved yet). Usually backed by a datastore singleton.
+ */
+export type GlobalBlockLoader<T> = () => Promise<T | null>;
+export interface UseGlobalBlockResult<T> {
+    /** The loaded shared content, or `null` until the first successful load. */
+    data: Ref<T | null>;
+    /** True while a (re)load is in flight. */
+    loading: Ref<boolean>;
+    /** Manually trigger a reload. */
+    refresh: () => Promise<void>;
+}
+/**
+ * Load and reactively track a global/shared block's content (e.g. site nav or
+ * footer, stored as a datastore singleton and shared across every page).
+ *
+ * The content is loaded once on mount. Additionally, when rendered inside the
+ * page-designer preview iframe, it listens for the `BLOX_REFRESH_GLOBAL` editor
+ * message and re-fetches — so saving the block in the editor updates the live
+ * preview instantly, without a page reload.
+ *
+ * @param blockType  The block's type (e.g. `'TopnavBlox'`). Used to match
+ *                   targeted refresh messages.
+ * @param loader     Async function that fetches the saved shared content.
+ */
+export declare function useGlobalBlock<T extends Record<string, unknown>>(blockType: string, loader: GlobalBlockLoader<T>): UseGlobalBlockResult<T>;
+//# sourceMappingURL=useGlobalBlock.d.ts.map

package/dist/composables/useGlobalBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGlobalBlock.d.ts","sourceRoot":"","sources":["../../src/composables/useGlobalBlock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAI9B;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,CAAC,CAAC,IAAI,MAAM,OAAO,CAAC,CAAC,GAAG,IAAI,CAAC,CAAA;AAE1D,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACtC,4EAA4E;IAC5E,IAAI,EAAE,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,CAAA;IACnB,0CAA0C;IAC1C,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACrB,iCAAiC;IACjC,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAC5B;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/D,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAC1B,oBAAoB,CAAC,CAAC,CAAC,CAqCzB"}

package/dist/{core-Do0ELzJT.js → core-CIFcs9Cn.js}

@@ -403,7 +403,7 @@ class BloxInstance {
     }
     router.addRoute({
       path: "/_blox_preview",
-      component: () => import("./PreviewApp-CCxTa86_.js"),
+      component: () => import("./PreviewApp-BrpFk5Ud.js"),
       beforeEnter: () => window.parent !== window ? true : "/"
     });
     router.addRoute({ path: "/:pathMatch(.*)*", component: _sfc_main$1 });
@@ -452,14 +452,14 @@ function createBlox(options) {
   return instance;
 }
 export {
-  BLOX_LOCALE_STRATEGY_KEY as B,
+  BLOX_REGISTRY_KEY as B,
   PageRenderer as P,
   _sfc_main$1 as _,
-  BLOX_CONFIG_KEY as a,
-  BloxInstance as b,
+  BLOX_LOCALE_STRATEGY_KEY as a,
+  BLOX_CONFIG_KEY as b,
   createBlox as c,
-  configureApi as d,
-  BLOX_REGISTRY_KEY as e,
+  BloxInstance as d,
+  configureApi as e,
   listItems as l,
   resolvePath as r,
   useLocale as u

package/dist/{core-CR2evIjK.cjs → core-ZJ2VPvQb.cjs}

@@ -404,7 +404,7 @@ class BloxInstance {
     }
     router.addRoute({
       path: "/_blox_preview",
-      component: () => Promise.resolve().then(() => require("./PreviewApp-C5hzLdHt.cjs")),
+      component: () => Promise.resolve().then(() => require("./PreviewApp-C6NyDvt7.cjs")),
       beforeEnter: () => window.parent !== window ? true : "/"
     });
     router.addRoute({ path: "/:pathMatch(.*)*", component: _sfc_main$1 });

package/dist/index.cjs

@@ -1,11 +1,43 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const core = require("./core-CR2evIjK.cjs");
-const PreviewApp_vue_vue_type_style_index_0_lang = require("./PreviewApp.vue_vue_type_style_index_0_lang-Da4Pi_Lc.cjs");
+const core = require("./core-ZJ2VPvQb.cjs");
+const PreviewApp_vue_vue_type_style_index_0_lang = require("./PreviewApp.vue_vue_type_style_index_0_lang-y8aUlctU.cjs");
 const vue = require("vue");
 const vueRouter = require("vue-router");
 const pinia = require("pinia");
 const ssg_client = require("./ssg/client.cjs");
+function useGlobalBlock(blockType, loader) {
+  const data = vue.ref(null);
+  const loading = vue.ref(false);
+  async function refresh() {
+    loading.value = true;
+    try {
+      const loaded = await loader();
+      if (loaded) data.value = loaded;
+    } catch (e) {
+      console.warn(`[useGlobalBlock] failed to load "${blockType}", using defaults`, e);
+    } finally {
+      loading.value = false;
+    }
+  }
+  function onEditorMessage(event) {
+    const msg = event.data;
+    if ((msg == null ? void 0 : msg.type) !== "BLOX_REFRESH_GLOBAL") return;
+    if (!msg.block || msg.block === blockType) void refresh();
+  }
+  vue.onMounted(() => {
+    void refresh();
+    if (typeof window !== "undefined") {
+      window.addEventListener("message", onEditorMessage);
+    }
+  });
+  vue.onUnmounted(() => {
+    if (typeof window !== "undefined") {
+      window.removeEventListener("message", onEditorMessage);
+    }
+  });
+  return { data, loading, refresh };
+}
 function useLocaleNav() {
   const strategy = vue.inject(core.BLOX_LOCALE_STRATEGY_KEY, null);
   const router = vueRouter.useRouter();
@@ -117,5 +149,6 @@ exports.sendToEditor = PreviewApp_vue_vue_type_style_index_0_lang.sendToEditor;
 exports.sendToPreview = PreviewApp_vue_vue_type_style_index_0_lang.sendToPreview;
 exports.createBloxApp = createBloxApp;
 exports.defineBlock = defineBlock;
+exports.useGlobalBlock = useGlobalBlock;
 exports.useLocaleNav = useLocaleNav;
 exports.usePageContext = usePageContext;

package/dist/index.d.ts

@@ -4,6 +4,8 @@ export type { BindingWarning, Block, BloxPageApiAdapter, CollectionItem, Collect
 export { sendToEditor, sendToPreview } from './bridge';
 export type { BlockSchemaInfo, EditorMessage, PreviewMessage } from './bridge';
 export { default as CmsPageView } from './CmsPageView.vue';
+export { useGlobalBlock } from './composables/useGlobalBlock';
+export type { GlobalBlockLoader, UseGlobalBlockResult } from './composables/useGlobalBlock';
 export { useLocale } from './composables/useLocale';
 export type { Locale } from './composables/useLocale';
 export { useLocaleNav } from './composables/useLocaleNav';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAClE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAKnD,YAAY,EACX,cAAc,EACd,KAAK,EAEL,kBAAkB,EAClB,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,WAAW,EACX,cAAc,EACd,QAAQ,EACR,eAAe,EACf,cAAc,EACd,WAAW,GACX,MAAM,aAAa,CAAA;AAIpB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACtD,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAK1D,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAA;AACnD,YAAY,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAA;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAK7D,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACjD,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AAKxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAA;AAK1E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3D,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAK9D,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAI5E,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAA;AAErE,YAAY,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAClE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAKnD,YAAY,EACX,cAAc,EACd,KAAK,EAEL,kBAAkB,EAClB,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,WAAW,EACX,cAAc,EACd,QAAQ,EACR,eAAe,EACf,cAAc,EACd,WAAW,GACX,MAAM,aAAa,CAAA;AAIpB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACtD,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAK1D,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAC7D,YAAY,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAA;AAC3F,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAA;AACnD,YAAY,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAA;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAK7D,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACjD,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AAKxD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAA;AAK1E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3D,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAK9D,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAI5E,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAA;AAErE,YAAY,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA"}

package/dist/index.mjs

@@ -1,10 +1,42 @@
-import { B as BLOX_LOCALE_STRATEGY_KEY, u as useLocale, c as createBlox } from "./core-Do0ELzJT.js";
-import { a, b, _, P, d, l, r } from "./core-Do0ELzJT.js";
-import { _ as _2, P as P2, s, a as a2 } from "./PreviewApp.vue_vue_type_style_index_0_lang-Bv4eRrVz.js";
-import { inject, computed, createApp, markRaw } from "vue";
+import { a as BLOX_LOCALE_STRATEGY_KEY, u as useLocale, c as createBlox } from "./core-CIFcs9Cn.js";
+import { b, d, _, P, e, l, r } from "./core-CIFcs9Cn.js";
+import { _ as _2, P as P2, s, a } from "./PreviewApp.vue_vue_type_style_index_0_lang-weDpp7Uy.js";
+import { ref, onMounted, onUnmounted, inject, computed, createApp, markRaw } from "vue";
 import { useRouter } from "vue-router";
 import { createPinia } from "pinia";
 import { installBloxStateCache, installCollectionCache } from "./ssg/client.mjs";
+function useGlobalBlock(blockType, loader) {
+  const data = ref(null);
+  const loading = ref(false);
+  async function refresh() {
+    loading.value = true;
+    try {
+      const loaded = await loader();
+      if (loaded) data.value = loaded;
+    } catch (e2) {
+      console.warn(`[useGlobalBlock] failed to load "${blockType}", using defaults`, e2);
+    } finally {
+      loading.value = false;
+    }
+  }
+  function onEditorMessage(event) {
+    const msg = event.data;
+    if ((msg == null ? void 0 : msg.type) !== "BLOX_REFRESH_GLOBAL") return;
+    if (!msg.block || msg.block === blockType) void refresh();
+  }
+  onMounted(() => {
+    void refresh();
+    if (typeof window !== "undefined") {
+      window.addEventListener("message", onEditorMessage);
+    }
+  });
+  onUnmounted(() => {
+    if (typeof window !== "undefined") {
+      window.removeEventListener("message", onEditorMessage);
+    }
+  });
+  return { data, loading, refresh };
+}
 function useLocaleNav() {
   const strategy = inject(BLOX_LOCALE_STRATEGY_KEY, null);
   const router = useRouter();
@@ -101,21 +133,22 @@ function defineBlock(meta) {
   return meta;
 }
 export {
-  a as BLOX_CONFIG_KEY,
+  b as BLOX_CONFIG_KEY,
   BLOX_LOCALE_STRATEGY_KEY,
-  b as BloxInstance,
+  d as BloxInstance,
   _ as CmsPageView,
   P as PageRenderer,
   _2 as PreviewApp,
   P2 as PreviewRenderer,
-  d as configureApi,
+  e as configureApi,
   createBlox,
   createBloxApp,
   defineBlock,
   l as listItems,
   r as resolvePath,
   s as sendToEditor,
-  a2 as sendToPreview,
+  a as sendToPreview,
+  useGlobalBlock,
   useLocale,
   useLocaleNav,
   usePageContext

package/dist/ssg/index.cjs

@@ -26,7 +26,7 @@ const prerender = require("../prerender-DH6Arhpk.cjs");
 const ssg_client = require("./client.cjs");
 const pinia = require("pinia");
 const vue = require("vue");
-const core = require("../core-CR2evIjK.cjs");
+const core = require("../core-ZJ2VPvQb.cjs");
 async function renderBloxSsgPage(options) {
   const {
     url,

package/dist/ssg/index.mjs

@@ -4,7 +4,7 @@ import { BLOX_STATE_WINDOW_KEY, BLOX_COLLECTIONS_WINDOW_KEY, BLOX_WEBSITE_ID_WIN
 import { getCollectionCache, getEmbeddedWebsiteId, installBloxStateCache, installCollectionCache } from "./client.mjs";
 import { createPinia } from "pinia";
 import { createSSRApp, markRaw } from "vue";
-import { c as createBlox } from "../core-Do0ELzJT.js";
+import { c as createBlox } from "../core-CIFcs9Cn.js";
 async function renderBloxSsgPage(options) {
   const {
     url,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/blox",
   "type": "module",
-  "version": "1.15.47",
+  "version": "1.15.51",
   "description": "Blox page builder library for drag-and-drop page building and static data management",
   "author": {
     "name": "Bagel Studio",