marko 6.0.155 → 6.0.156

package/dist/debug/dom.js

@@ -108,6 +108,7 @@ __export(dom_exports, {
   forTo: () => forTo,
   forUntil: () => forUntil,
   init: () => init,
+  initEmbedded: () => initEmbedded,
   run: () => run
 });
 module.exports = __toCommonJS(dom_exports);
@@ -412,12 +413,18 @@ function destroyBranch(branch) {
   branch["#ParentBranch" /* ParentBranch */]?.["#BranchScopes" /* BranchScopes */]?.delete(
     branch
   );
-  destroyNestedBranches(branch);
+  destroyNestedScopes(branch);
 }
-function destroyNestedBranches(branch) {
-  branch["#Destroyed" /* Destroyed */] = 1;
-  branch["#BranchScopes" /* BranchScopes */]?.forEach(destroyNestedBranches);
-  branch["#AbortScopes" /* AbortScopes */]?.forEach(resetControllers);
+function destroyScope(scope) {
+  if (!scope["#Destroyed" /* Destroyed */]) {
+    destroyNestedScopes(scope);
+    resetControllers(scope);
+  }
+}
+function destroyNestedScopes(scope) {
+  scope["#Destroyed" /* Destroyed */] = 1;
+  scope["#BranchScopes" /* BranchScopes */]?.forEach(destroyNestedScopes);
+  scope["#AbortScopes" /* AbortScopes */]?.forEach(resetControllers);
 }
 function resetControllers(scope) {
   for (const id in scope["#AbortControllers" /* AbortControllers */]) {
@@ -887,22 +894,49 @@ function createCloneableHTML(html, ns) {
 
 // src/dom/resume.ts
 var registeredValues = {};
+var curRuntimeId;
+var readyLookup;
 var branchesEnabled;
+var embedEnabled;
 function enableBranches() {
   branchesEnabled = 1;
 }
+var ready = /* @__PURE__ */ ((_) => (id) => {
+  readyLookup[id]?.();
+  readyLookup[id] = 1;
+})(readyLookup = {});
+function initEmbedded(readyId, runtimeId) {
+  embedEnabled = 1;
+  ready(readyId);
+  init(runtimeId);
+  new MutationObserver(() => {
+    const renders = self[curRuntimeId];
+    for (const renderId in renders) {
+      const { s, n } = renders[renderId];
+      if (n && !n.isConnected) {
+        delete renders[renderId];
+        for (const id in s) {
+          destroyScope(s[id]);
+        }
+      }
+    }
+  }).observe(document.body, { childList: true, subtree: true });
+}
 function init(runtimeId = DEFAULT_RUNTIME_ID) {
-  if (true) {
-    const descriptor = Object.getOwnPropertyDescriptor(self, runtimeId);
-    if (descriptor && (descriptor.set || descriptor.configurable === false)) {
-      throw new Error(
-        `Marko initialized multiple times with the same $global.runtimeId of ${JSON.stringify(runtimeId)}. It could be that there are multiple copies of Marko running on the page.`
-      );
+  if (curRuntimeId) {
+    if (true) {
+      if (curRuntimeId !== runtimeId) {
+        throw new Error(
+          `Marko initialized multiple times with different $global.runtimeId's of ${JSON.stringify(runtimeId)} and ${JSON.stringify(curRuntimeId)}.`
+        );
+      }
     }
+    return;
   }
+  curRuntimeId = runtimeId;
+  let resumeRender;
   const renders = self[runtimeId];
   const defineRuntime = (desc) => Object.defineProperty(self, runtimeId, desc);
-  let resumeRender;
   const initRuntime = (renders2) => {
     defineRuntime({
       value: resumeRender = ((renderId) => {
@@ -976,6 +1010,10 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
             }
           };
         })();
+        const nextToken = () => lastToken = visitText.slice(
+          lastTokenIndex,
+          (lastTokenIndex = visitText.indexOf(" ", lastTokenIndex) + 1 || visitText.length + 1) - 1
+        );
         let $global;
         let lastEffect;
         let visits;
@@ -987,11 +1025,26 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
         let lastToken;
         let lastTokenIndex;
         let lastScopeId = 0;
-        const nextToken = () => lastToken = visitText.slice(
-          lastTokenIndex,
-          (lastTokenIndex = visitText.indexOf(" ", lastTokenIndex) + 1 || visitText.length + 1) - 1
-        );
+        if (true) {
+          if (render.m) {
+            throw new Error(
+              `Marko rendered multiple times with $global.runtimeId as ${JSON.stringify(runtimeId)} and $global.renderId as ${JSON.stringify(renderId)}. Ensure each render into a page has a unique $global.renderId.`
+            );
+          }
+        }
         render.m = (effects = []) => {
+          if (readyLookup) {
+            for (const readyId in render.b) {
+              if (readyLookup[readyId] !== 1) {
+                readyLookup[readyId] = /* @__PURE__ */ ((prev) => () => {
+                  render.m();
+                  prev?.();
+                })(readyLookup[readyId]);
+                return effects;
+              }
+            }
+            render.b = 0;
+          }
           for (const serialized of resumes = render.r || []) {
             if (typeof serialized === "string") {
               lastTokenIndex = 0;
@@ -1038,6 +1091,12 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
               visitBranches();
             }
           }
+          if (embedEnabled) {
+            render.n ||= visit?.parentNode.insertBefore(
+              new Text(),
+              visit.nextSibling
+            );
+          }
           visits.length = resumes.length = 0;
           return effects;
         };

package/dist/debug/dom.mjs

@@ -298,12 +298,18 @@ function destroyBranch(branch) {
   branch["#ParentBranch" /* ParentBranch */]?.["#BranchScopes" /* BranchScopes */]?.delete(
     branch
   );
-  destroyNestedBranches(branch);
+  destroyNestedScopes(branch);
 }
-function destroyNestedBranches(branch) {
-  branch["#Destroyed" /* Destroyed */] = 1;
-  branch["#BranchScopes" /* BranchScopes */]?.forEach(destroyNestedBranches);
-  branch["#AbortScopes" /* AbortScopes */]?.forEach(resetControllers);
+function destroyScope(scope) {
+  if (!scope["#Destroyed" /* Destroyed */]) {
+    destroyNestedScopes(scope);
+    resetControllers(scope);
+  }
+}
+function destroyNestedScopes(scope) {
+  scope["#Destroyed" /* Destroyed */] = 1;
+  scope["#BranchScopes" /* BranchScopes */]?.forEach(destroyNestedScopes);
+  scope["#AbortScopes" /* AbortScopes */]?.forEach(resetControllers);
 }
 function resetControllers(scope) {
   for (const id in scope["#AbortControllers" /* AbortControllers */]) {
@@ -773,22 +779,49 @@ function createCloneableHTML(html, ns) {
 
 // src/dom/resume.ts
 var registeredValues = {};
+var curRuntimeId;
+var readyLookup;
 var branchesEnabled;
+var embedEnabled;
 function enableBranches() {
   branchesEnabled = 1;
 }
+var ready = /* @__PURE__ */ ((_) => (id) => {
+  readyLookup[id]?.();
+  readyLookup[id] = 1;
+})(readyLookup = {});
+function initEmbedded(readyId, runtimeId) {
+  embedEnabled = 1;
+  ready(readyId);
+  init(runtimeId);
+  new MutationObserver(() => {
+    const renders = self[curRuntimeId];
+    for (const renderId in renders) {
+      const { s, n } = renders[renderId];
+      if (n && !n.isConnected) {
+        delete renders[renderId];
+        for (const id in s) {
+          destroyScope(s[id]);
+        }
+      }
+    }
+  }).observe(document.body, { childList: true, subtree: true });
+}
 function init(runtimeId = DEFAULT_RUNTIME_ID) {
-  if (true) {
-    const descriptor = Object.getOwnPropertyDescriptor(self, runtimeId);
-    if (descriptor && (descriptor.set || descriptor.configurable === false)) {
-      throw new Error(
-        `Marko initialized multiple times with the same $global.runtimeId of ${JSON.stringify(runtimeId)}. It could be that there are multiple copies of Marko running on the page.`
-      );
+  if (curRuntimeId) {
+    if (true) {
+      if (curRuntimeId !== runtimeId) {
+        throw new Error(
+          `Marko initialized multiple times with different $global.runtimeId's of ${JSON.stringify(runtimeId)} and ${JSON.stringify(curRuntimeId)}.`
+        );
+      }
     }
+    return;
   }
+  curRuntimeId = runtimeId;
+  let resumeRender;
   const renders = self[runtimeId];
   const defineRuntime = (desc) => Object.defineProperty(self, runtimeId, desc);
-  let resumeRender;
   const initRuntime = (renders2) => {
     defineRuntime({
       value: resumeRender = ((renderId) => {
@@ -862,6 +895,10 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
             }
           };
         })();
+        const nextToken = () => lastToken = visitText.slice(
+          lastTokenIndex,
+          (lastTokenIndex = visitText.indexOf(" ", lastTokenIndex) + 1 || visitText.length + 1) - 1
+        );
         let $global;
         let lastEffect;
         let visits;
@@ -873,11 +910,26 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
         let lastToken;
         let lastTokenIndex;
         let lastScopeId = 0;
-        const nextToken = () => lastToken = visitText.slice(
-          lastTokenIndex,
-          (lastTokenIndex = visitText.indexOf(" ", lastTokenIndex) + 1 || visitText.length + 1) - 1
-        );
+        if (true) {
+          if (render.m) {
+            throw new Error(
+              `Marko rendered multiple times with $global.runtimeId as ${JSON.stringify(runtimeId)} and $global.renderId as ${JSON.stringify(renderId)}. Ensure each render into a page has a unique $global.renderId.`
+            );
+          }
+        }
         render.m = (effects = []) => {
+          if (readyLookup) {
+            for (const readyId in render.b) {
+              if (readyLookup[readyId] !== 1) {
+                readyLookup[readyId] = /* @__PURE__ */ ((prev) => () => {
+                  render.m();
+                  prev?.();
+                })(readyLookup[readyId]);
+                return effects;
+              }
+            }
+            render.b = 0;
+          }
           for (const serialized of resumes = render.r || []) {
             if (typeof serialized === "string") {
               lastTokenIndex = 0;
@@ -924,6 +976,12 @@ function init(runtimeId = DEFAULT_RUNTIME_ID) {
               visitBranches();
             }
           }
+          if (embedEnabled) {
+            render.n ||= visit?.parentNode.insertBefore(
+              new Text(),
+              visit.nextSibling
+            );
+          }
           visits.length = resumes.length = 0;
           return effects;
         };
@@ -2619,5 +2677,6 @@ export {
   forTo,
   forUntil,
   init,
+  initEmbedded,
   run
 };

package/dist/debug/html.js

@@ -2476,6 +2476,7 @@ var State2 = class {
   writeReorders = null;
   scopes = /* @__PURE__ */ new Map();
   writeScopes = null;
+  ensureReady = null;
   serializeReason;
   get runtimePrefix() {
     const { $global: $global2 } = this;
@@ -2665,6 +2666,26 @@ var Chunk = class {
         WALKER_RUNTIME_CODE + '("' + $global2.runtimeId + '")("' + $global2.renderId + '")'
       );
     }
+    if (state.ensureReady && state.hasMainRuntime) {
+      let first = true;
+      for (const id in state.ensureReady) {
+        if (state.ensureReady[id]) {
+          state.ensureReady[id] = 0;
+          if (first) {
+            scripts = concatScripts(
+              scripts,
+              "(" + runtimePrefix + ".b={})" + toAccess(toObjectKey(id)) + "=1"
+            );
+          } else {
+            scripts = concatScripts(
+              scripts,
+              runtimePrefix + ".b" /* Blocking */ + toAccess(toObjectKey(id)) + "=1"
+            );
+          }
+        }
+        first = false;
+      }
+    }
     if (effects) {
       needsWalk = true;
       state.resumes = state.resumes ? state.resumes + ',"' + effects + '"' : '"' + effects + '"';
@@ -3454,8 +3475,9 @@ function NOOP2() {
 }
 
 // src/html/template.ts
-var _template = (templateId, renderer) => {
+var _template = (templateId, renderer, page) => {
   renderer.render = render;
+  renderer.___embed = !page;
   renderer._ = renderer;
   if (true) {
     renderer.mount = () => {
@@ -3472,7 +3494,7 @@ function render(input = {}) {
     ({ $global: $global2, ...input } = input);
     $global2 = {
       runtimeId: DEFAULT_RUNTIME_ID,
-      renderId: DEFAULT_RENDER_ID,
+      renderId: getDefaultRenderId(this),
       ...$global2
     };
     if (true) {
@@ -3488,16 +3510,31 @@ function render(input = {}) {
       }
     }
   } else {
-    $global2 = { runtimeId: DEFAULT_RUNTIME_ID, renderId: DEFAULT_RENDER_ID };
+    $global2 = {
+      runtimeId: DEFAULT_RUNTIME_ID,
+      renderId: getDefaultRenderId(this)
+    };
+  }
+  const state = new State2($global2);
+  const head = new Chunk(new Boundary(state, $global2.signal), null, null);
+  if (this.___embed) {
+    (state.ensureReady ||= {})[this.___id] = 1;
   }
-  const head = new Chunk(
-    new Boundary(new State2($global2), $global2.signal),
-    null,
-    null
-  );
   head.render(this, input);
   return new ServerRendered(head);
 }
+function getDefaultRenderId(template) {
+  if (template.___embed) {
+    const ENCODE_CHARS = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ$_0123456789";
+    let n = Math.random() * 4294967296 >>> 0;
+    let r = ENCODE_CHARS[n % 53];
+    for (n = n / 53 | 0; n; n >>>= 6) {
+      r += ENCODE_CHARS[n & 63];
+    }
+    return r;
+  }
+  return DEFAULT_RENDER_ID;
+}
 var ServerRendered = class {
   #head;
   #cachedPromise = null;

package/dist/debug/html.mjs

@@ -2383,6 +2383,7 @@ var State2 = class {
   writeReorders = null;
   scopes = /* @__PURE__ */ new Map();
   writeScopes = null;
+  ensureReady = null;
   serializeReason;
   get runtimePrefix() {
     const { $global: $global2 } = this;
@@ -2572,6 +2573,26 @@ var Chunk = class {
         WALKER_RUNTIME_CODE + '("' + $global2.runtimeId + '")("' + $global2.renderId + '")'
       );
     }
+    if (state.ensureReady && state.hasMainRuntime) {
+      let first = true;
+      for (const id in state.ensureReady) {
+        if (state.ensureReady[id]) {
+          state.ensureReady[id] = 0;
+          if (first) {
+            scripts = concatScripts(
+              scripts,
+              "(" + runtimePrefix + ".b={})" + toAccess(toObjectKey(id)) + "=1"
+            );
+          } else {
+            scripts = concatScripts(
+              scripts,
+              runtimePrefix + ".b" /* Blocking */ + toAccess(toObjectKey(id)) + "=1"
+            );
+          }
+        }
+        first = false;
+      }
+    }
     if (effects) {
       needsWalk = true;
       state.resumes = state.resumes ? state.resumes + ',"' + effects + '"' : '"' + effects + '"';
@@ -3361,8 +3382,9 @@ function NOOP2() {
 }
 
 // src/html/template.ts
-var _template = (templateId, renderer) => {
+var _template = (templateId, renderer, page) => {
   renderer.render = render;
+  renderer.___embed = !page;
   renderer._ = renderer;
   if (true) {
     renderer.mount = () => {
@@ -3379,7 +3401,7 @@ function render(input = {}) {
     ({ $global: $global2, ...input } = input);
     $global2 = {
       runtimeId: DEFAULT_RUNTIME_ID,
-      renderId: DEFAULT_RENDER_ID,
+      renderId: getDefaultRenderId(this),
       ...$global2
     };
     if (true) {
@@ -3395,16 +3417,31 @@ function render(input = {}) {
       }
     }
   } else {
-    $global2 = { runtimeId: DEFAULT_RUNTIME_ID, renderId: DEFAULT_RENDER_ID };
+    $global2 = {
+      runtimeId: DEFAULT_RUNTIME_ID,
+      renderId: getDefaultRenderId(this)
+    };
+  }
+  const state = new State2($global2);
+  const head = new Chunk(new Boundary(state, $global2.signal), null, null);
+  if (this.___embed) {
+    (state.ensureReady ||= {})[this.___id] = 1;
   }
-  const head = new Chunk(
-    new Boundary(new State2($global2), $global2.signal),
-    null,
-    null
-  );
   head.render(this, input);
   return new ServerRendered(head);
 }
+function getDefaultRenderId(template) {
+  if (template.___embed) {
+    const ENCODE_CHARS = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ$_0123456789";
+    let n = Math.random() * 4294967296 >>> 0;
+    let r = ENCODE_CHARS[n % 53];
+    for (n = n / 53 | 0; n; n >>>= 6) {
+      r += ENCODE_CHARS[n & 63];
+    }
+    return r;
+  }
+  return DEFAULT_RENDER_ID;
+}
 var ServerRendered = class {
   #head;
   #cachedPromise = null;

package/dist/dom/resume.d.ts

@@ -12,7 +12,9 @@ export interface RenderData {
     r?: (string | ResumeFn)[];
     s?: Record<string, Scope>;
     w(): void;
-    m(): unknown[];
+    m?(): unknown[];
+    n?: Text;
+    b?: 0 | Record<string, 1 | 0>;
     d: never;
     l: never;
     x: never;
@@ -20,6 +22,8 @@ export interface RenderData {
     p?: Record<string | number, AwaitCounter>;
 }
 export declare function enableBranches(): void;
+export declare const ready: (id: string) => void;
+export declare function initEmbedded(readyId: string, runtimeId?: string): void;
 export declare function init(runtimeId?: string): void;
 export declare let isResuming: undefined | 0 | 1;
 export declare function getRegisteredWithScope(id: string, scope?: Scope): unknown;

package/dist/dom/scope.d.ts

@@ -3,6 +3,7 @@ export declare function createScope($global: Scope[AccessorProp.Global], closest
 export declare function skipScope(): number;
 export declare function findBranchWithKey(scope: Scope, key: string): BranchScope | undefined;
 export declare function destroyBranch(branch: BranchScope): void;
+export declare function destroyScope(scope: Scope): void;
 export declare function removeAndDestroyBranch(branch: BranchScope): void;
 export declare function insertBranchBefore(branch: BranchScope, parentNode: ParentNode, nextSibling: Node | null): void;
 export declare function tempDetachBranch(branch: BranchScope): void;

package/dist/dom.d.ts

@@ -10,6 +10,6 @@ export { _attr, _attr_class, _attr_class_item, _attr_class_items, _attr_content,
 export { _on } from "./dom/event";
 export { _enable_catch as _enable_catch, run } from "./dom/queue";
 export { _content, _content_closures, _content_resume } from "./dom/renderer";
-export { _el, _resume, _var_resume, init } from "./dom/resume";
+export { _el, _resume, _var_resume, init, initEmbedded } from "./dom/resume";
 export { _child_setup, _closure, _closure_get, _const, _el_read, _for_closure, _hoist, _hoist_resume, _id, _if_closure, _let, _or, _return, _return_change, _script, _var, _var_change, } from "./dom/signals";
 export { _template } from "./dom/template";