marko 5.32.15 → 5.33.0

package/bin/markoc

@@ -1,2 +1,2 @@
 #!/usr/bin/env node
-require('./markoc.js');
+require("./markoc.js");

package/dist/node_modules/@internal/components-entry/index.js

@@ -1,6 +1,7 @@
 "use strict";
 
 var warp10 = require("warp10");
+var w10NOOP = require("warp10/constants").NOOP;
 var safeJSONRegExp = /<\/|\u2028|\u2029/g;
 var IGNORE_GLOBAL_TYPES = new Set(["undefined", "function", "symbol"]);
 var DEFAULT_RUNTIME_ID = "M";
@@ -90,11 +91,6 @@ function addComponentsFromContext(componentsContext, componentsToHydrate) {
 
       needsState = true;
     } else {
-      if (input && input.renderBody) {
-        renderBody = input.renderBody;
-        input.renderBody = undefined;
-      }
-
       if (
       !(flags & FLAG_WILL_RERENDER_IN_BROWSER) ||
       flags & FLAG_OLD_HYDRATE_NO_CREATE)
@@ -115,6 +111,8 @@ function addComponentsFromContext(componentsContext, componentsToHydrate) {
         if (isNotEmpty(component)) {
           serializedProps = component;
         }
+      } else {
+        renderBody = input.renderBody;
       }
     }
 
@@ -138,9 +136,9 @@ function addComponentsFromContext(componentsContext, componentsToHydrate) {
       }
     }
 
-    if (typeof renderBody === "function") {
+    if (typeof renderBody === "function" && renderBody.toJSON && renderBody.toJSON() === w10NOOP) {
       flags |= FLAG_HAS_RENDER_BODY;
-      renderBody = undefined;
+      renderBody = input.renderBody = undefined;
     }
 
     var extra = {

package/dist/runtime/helpers/dynamic-tag.js

@@ -68,6 +68,7 @@ customEvents)
       var renderer =
       tag._ || (
       tag.renderer ? tag.renderer.renderer || tag.renderer : tag.render);
+      var render = tag && tag.renderBody || tag;
 
       // eslint-disable-next-line no-constant-condition
 
@@ -78,12 +79,15 @@ customEvents)
 
 
 
+      if (dynamicTag.bk_) {
+        renderer = dynamicTag.bk_(renderer, render, args);
+      }
+
       if (renderer) {
         out.c(componentDef, key, customEvents);
         renderer(attrs, out);
         out._X_ = null;
       } else {
-        var render = tag && tag.renderBody || tag;
         var isFn = typeof render === "function";
 
         // eslint-disable-next-line no-constant-condition

package/dist/runtime/helpers/tags-compat-dom.js

@@ -0,0 +1,265 @@
+"use strict";exports.__esModule = true;exports.default = void 0;var _ComponentsContext = require("../components/ComponentsContext");
+var _fragment = require("../vdom/morphdom/fragment");
+
+const {
+  prepare,
+  runEffects,
+  patchConditionals,
+  createScopeWithRenderer,
+  queueEffect,
+  scopeLookup,
+  getRegisteredWithScope,
+  register
+} = require(
+  // eslint-disable-next-line no-constant-condition
+  "@marko/runtime-tags/dom"
+);
+const { _i_ } = require("@internal/components-util");
+const defineComponent = require("../components/defineComponent");
+const { r: registerComponent } = require("../components/registry");
+const createRenderer = require("../components/renderer");
+const defaultCreateOut = require("../createOut");
+const morphdom = require("../vdom/morphdom");
+const dynamicTag = require("./dynamic-tag");var _default = exports.default =
+
+dynamicTag.bk_ = function tagsToVdom(
+tagsRenderer,
+renderBody,
+args)
+{
+  if (
+  tagsRenderer ?
+  tagsRenderer.bl_ === undefined :
+  !Array.isArray(renderBody) && renderBody?.bl_ === undefined)
+
+  return tagsRenderer;
+
+  return (input, out) =>
+  TagsCompat({ i: args ? args : input, r: tagsRenderer || renderBody }, out);
+};
+
+const TagsCompatId = "tags-compat";
+const TagsCompat = createRenderer(
+  function (_, out, componentDef, component) {
+    let existing = false;
+    const isHydrate =
+    (0, _ComponentsContext.R_)(out).o_._W_;
+    const input = Array.isArray(_.i) ? _.i : [_.i];
+    const tagsRenderer = resolveRegistered(_.r);
+    const args = tagsRenderer.bm_;
+
+    component.effects = prepare(() => {
+      if (isHydrate) {
+        const scopeId = out.global.componentIdToScopeId[component.id];
+        component.scope = scopeLookup[scopeId];
+      }
+      if (!component.scope) {
+        component.scope = createScopeWithRenderer(
+          tagsRenderer /* out.global as context */
+        );
+        for (const signal of tagsRenderer.bn_) {
+          signal(component.scope, true);
+        }
+      } else {
+        args && args(component.scope, input, 1);
+        existing = true;
+      }
+      args && args(component.scope, input);
+    });
+    out.bf(out._Y_, component, existing);
+    if (!existing) {
+      out.node({
+        bo_: () =>
+        component.scope.bp_ === component.scope.bq_ ?
+        component.scope.bp_ :
+        component.scope.bp_.parentNode
+      });
+    }
+    out.ef();
+  },
+  {
+    t: TagsCompatId,
+    d: "MARKO_DEBUG"
+  },
+  {}
+);
+
+registerComponent(TagsCompatId, () => ({
+  _: TagsCompat,
+  Component: defineComponent(
+    {
+      onMount() {
+        runEffects(this.effects);
+      },
+      onUpdate() {
+        runEffects(this.effects);
+      }
+    },
+    TagsCompat
+  )
+}));
+
+// (
+//   nodeAccessor: Accessor,
+//   dynamicTagAttrs?: IntersectionSignal,
+//   intersection?: IntersectionSignal,
+//   valueWithIntersection?: ValueSignal
+// )
+
+const rendererCache = new WeakMap();
+
+patchConditionals((conditional) => (...args) => {
+  const signal = conditional(...args);
+  const hasAttrs = args.length > 1;
+  return (scope, renderer, clean) => {
+    return signal(scope, create5to6Renderer(renderer, hasAttrs), clean);
+  };
+});
+
+function create5to6Renderer(renderer, hasAttrs) {
+  let newRenderer = renderer;
+  if (renderer) {
+    const rendererFromAnywhere =
+    renderer._ ||
+    renderer.render ||
+    renderer.renderer && renderer.renderer.renderer ||
+    renderer.renderer;
+    const isMarko6 = rendererFromAnywhere ?
+    rendererFromAnywhere.bl_ :
+    renderer.bl_;
+
+    if (typeof renderer !== "string" && !isMarko6) {
+      newRenderer = rendererCache.get(renderer);
+      if (!newRenderer) {
+        const { Component } = renderer;
+        if (Component) {
+          const setCustomEvents = Component.prototype.aB_;
+          Component.prototype.aB_ = function (
+          customEvents,
+          scopeId)
+          {
+            for (const customEvent of customEvents) {
+              customEvent[1] = resolveRegistered(customEvent[1]);
+            }
+
+            setCustomEvents.call(this, customEvents, scopeId);
+          };
+        }
+        newRenderer = {
+          br_(scope) {
+            if (!hasAttrs) {
+              renderAndMorph(scope, rendererFromAnywhere, renderer, {});
+            }
+          },
+          bl_() {
+            const realFragment = document.createDocumentFragment();
+            (0, _fragment._h_)(null, null, realFragment);
+            return realFragment;
+          },
+          bs_: 1,
+          bm_(scope, input, clean) {
+            if (clean) return;
+            renderAndMorph(scope, rendererFromAnywhere, renderer, input);
+          }
+        };
+        rendererCache.set(renderer, newRenderer);
+      }
+    }
+  }
+  return newRenderer;
+}
+
+register("@marko/tags-compat-5-to-6", create5to6Renderer);
+
+function renderAndMorph(scope, renderer, renderBody, input) {
+  const out = defaultCreateOut();
+  let rootNode = scope.bp_.fragment;
+  if (!rootNode) {
+    const component = scope.marko5Component = _i_[scope.m5c];
+    rootNode = component._A_;
+    scope.bp_ = rootNode.startNode;
+    scope.bq_ = rootNode.endNode;
+  }
+  const host = scope.bp_;
+  const existingComponent = scope.marko5Component;
+  const componentsContext = (0, _ComponentsContext.R_)(out);
+  const globalComponentsContext = componentsContext.o_;
+  let customEvents;
+  globalComponentsContext.ax_ = existingComponent;
+  out.sync();
+  if (renderer) {
+    const [rawInput] = input;
+    const normalizedInput = {};
+
+    for (const key in rawInput) {
+      let value = rawInput[key];
+      if (key.startsWith("on")) {
+        const c = key[2];
+        customEvents = customEvents || {};
+        customEvents[(c === "-" ? "" : c.toLowerCase()) + key.slice(3)] = [
+        value];
+
+      } else {
+        normalizedInput[key] = rawInput[key];
+      }
+    }
+
+    renderer(normalizedInput, out);
+  } else {
+    RenderBodyComponent({ renderBody, args: input }, out);
+  }
+
+  queueEffect(scope, () => {
+    const targetNode = out.af_().ay_;
+    morphdom(rootNode, targetNode, host, componentsContext);
+    const componentDefs = componentsContext.ad_(
+      getRootNode(host)
+    );
+    const component = componentDefs[0].r_;
+    component._A_ = rootNode;
+    component.N_ = input[0];
+    component.U_ = customEvents;
+    scope.marko5Component = component;
+  });
+}
+
+function getRootNode(el) {
+  var cur = el;
+  while (cur.parentNode) cur = cur.parentNode;
+  return cur;
+}
+
+const RenderBodyComponentId = "renderbody-renderer";
+const RenderBodyComponent = createRenderer(
+  function (input, out, _componentDef) {
+    dynamicTag(
+      out,
+      input.renderBody,
+      null,
+      null,
+      input.args,
+      null,
+      _componentDef,
+      "0"
+    );
+  },
+  {
+    t: RenderBodyComponentId,
+    i: true,
+    d: "MARKO_DEBUG"
+  },
+  {}
+);
+
+registerComponent(RenderBodyComponentId, () => ({
+  _: RenderBodyComponent,
+  Component: defineComponent({}, RenderBodyComponent)
+}));
+
+function resolveRegistered(renderer) {
+  if (!Array.isArray(renderer)) return renderer;
+
+  const [registerId, scopeId] = renderer;
+  const scope = scopeLookup[scopeId];
+  return getRegisteredWithScope(registerId, scope);
+}

package/dist/runtime/helpers/tags-compat-html.js

@@ -0,0 +1,167 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.default = void 0;exports.serialized5to6 = serialized5to6;var _initComponentsTag = _interopRequireDefault(require("../../core-tags/components/init-components-tag"));
+var _ComponentsContext = require("../components/ComponentsContext");
+
+const tagsAPI = require(
+  // eslint-disable-next-line no-constant-condition
+  "@marko/runtime-tags/html"
+);
+const createRenderer = require("../components/renderer");
+const defaultCreateOut = require("../createOut");
+const dynamicTag5 = require("./dynamic-tag");
+const {
+  patchDynamicTag,
+  createRenderFn,
+  fork,
+  write,
+  makeSerializable,
+  register,
+  writeScope,
+  nextScopeId,
+  getRegistryInfo
+} = tagsAPI;
+
+const FN_TO_JSON = function () {
+  // TODO: this should instead return an object that contains getRegistryInfo
+  // then in the dom-compat, handle that object to lookup the function in the registry
+  // (we also need to do this for events)
+  return getRegistryInfo(this);
+};
+
+const isMarko6 = (fn) => !!fn.bt_;
+const isMarko5 = (fn) => !fn.bt_;var _default = exports.default =
+
+dynamicTag5.bk_ = function tagsToVdom(
+tagsRenderer,
+renderBody,
+args)
+{
+  if (tagsRenderer ? isMarko5(tagsRenderer) : isMarko5(renderBody))
+  return tagsRenderer;
+
+  if (!tagsRenderer && renderBody) {
+    renderBody.toJSON = FN_TO_JSON;
+  }
+
+  return (input, out) =>
+  TagsCompat(
+    args ?
+    { i: args, r: (args) => (tagsRenderer || renderBody)(...args) } :
+    { i: input, r: tagsRenderer || renderBody },
+    out
+  );
+};
+
+const TagsCompatId = "tags-compat";
+const TagsCompat = createRenderer(
+  function (_, out, componentDef, component) {
+    const input = _.i;
+    const tagsRenderer = _.r;
+    const renderFn = createRenderFn(tagsRenderer);
+    const $global = out.global;
+    const streamData = $global.streamData = $global.streamData || {};
+
+    $global.serializedGlobals = $global.serializedGlobals || {};
+    $global.serializedGlobals.componentIdToScopeId = true;
+    $global.componentIdToScopeId = $global.componentIdToScopeId || {};
+    $global.componentIdToScopeId[component.id] = streamData.scopeId || 0;
+    out.bf(out._Y_, component, true);
+    renderFn(out.beginAsync(), input, {}, streamData);
+    out.ef();
+  },
+  {
+    t: TagsCompatId,
+    d: "MARKO_DEBUG"
+  },
+  {}
+);
+
+patchDynamicTag(
+  function getRenderer(tag) {
+    const renderer = tag._ || tag.renderBody || tag;
+    if (isMarko6(renderer)) return renderer;
+
+    const renderer5 =
+    tag._ ||
+    tag.render ||
+    tag.renderer && tag.renderer.renderer ||
+    tag.renderer;
+    const renderBody5 = tag.renderBody || tag;
+
+    return (input, ...args) => {
+      const out = defaultCreateOut();
+      let customEvents;
+
+      out.global.streamData = tagsAPI.$_streamData;
+
+      if (renderer5) {
+        const normalizedInput = {};
+
+        for (const key in input) {
+          let value = input[key];
+          if (key.startsWith("on") && typeof value === "function") {
+            const c = key[2];
+            customEvents = customEvents || [];
+            customEvents.push([
+            (c === "-" ? "" : c.toLowerCase()) + key.slice(3),
+            value]
+            );
+            value.toJSON = FN_TO_JSON;
+          } else {
+            normalizedInput[key] = input[key];
+          }
+        }
+        renderer5(normalizedInput, out);
+      } else {
+        renderBody5(out, input, ...args);
+      }
+
+      const componentsContext = (0, _ComponentsContext.R_)(out);
+      const component = componentsContext.b_[0];
+      if (component) {
+        component.r_.U_ = customEvents;
+        writeScope(nextScopeId(), {
+          m5c: component.id
+        });
+      }
+
+      (0, _initComponentsTag.default)({}, out);
+
+      let async;
+      out.once("finish", (result) => {
+        if (!async) {
+          async = false;
+          write(result.toString());
+        }
+      });
+
+      out.end();
+
+      if (async !== false) {
+        async = true;
+        fork(out, (result) => {
+          write(result.toString());
+        });
+      }
+    };
+  },
+  function createRenderer(renderFn) {
+    renderFn.bt_ = true;
+    return renderFn;
+  }
+);
+
+function dummyCreate5to6Renderer() {}
+
+register(dummyCreate5to6Renderer, "@marko/tags-compat-5-to-6");
+
+function serialized5to6(renderer, id) {
+  const dummyRenderer = () => {};
+  register(dummyRenderer, id);
+  return makeSerializable(renderer, (s) =>
+  s.
+  value(dummyCreate5to6Renderer).
+  code("(").
+  value(dummyRenderer).
+  code(",!0)")
+  );
+}

package/dist/runtime/html/AsyncStream.js

@@ -9,7 +9,7 @@ var markoAttr = require("./helpers/data-marko");
 var escapeXmlHelper = require("./helpers/escape-xml");
 var StringWriter = require("./StringWriter");
 var escapeXmlOrNullish = escapeXmlHelper.x;
-var escapeXmlString = escapeXmlHelper.bk_;
+var escapeXmlString = escapeXmlHelper.bu_;
 
 function noop() {}
 
@@ -39,6 +39,16 @@ function escapeEndingComment(text) {
   return text.replace(/(--!?)>/g, "$1>");
 }
 
+function deferred() {
+  let resolve;
+  let reject;
+  const promise = new Promise((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+}
+
 function AsyncStream(global, writer, parentOut) {
   if (parentOut === null) {
     throw new Error("illegal state");
@@ -94,7 +104,7 @@ function AsyncStream(global, writer, parentOut) {
   this._X_ = null;
   this._Y_ = null;
   this.b__ = null;
-  this.bl_ = false;
+  this.bv_ = false;
 }
 
 AsyncStream.DEFAULT_TIMEOUT = 10000;
@@ -115,7 +125,78 @@ AsyncStream.enableAsyncStackTrace = function () {
 var proto = AsyncStream.prototype = {
   constructor: AsyncStream,
   A_: typeof document === "object" && document,
-  bm_: true,
+  bw_: true,
+
+  [Symbol.asyncIterator]() {
+    if (this.bx_) {
+      return this.bx_;
+    }
+
+    const originalWriter = this._state.writer;
+    let buffer = "";
+    let iteratorNextFn;
+
+    if (!originalWriter.stream) {
+      // Writing has finished completely so we can use a simple iterator
+      buffer = this.toString();
+      iteratorNextFn = () => {
+        const value = buffer;
+        buffer = "";
+        return { value, done: !value };
+      };
+    } else {
+      let done = false;
+      let pending = deferred();
+      const stream = {
+        write(data) {
+          buffer += data;
+        },
+        end() {
+          done = true;
+          pending.resolve({
+            value: "",
+            done
+          });
+        },
+        flush() {
+          pending.resolve({
+            value: buffer,
+            done: false
+          });
+          buffer = "";
+          pending = deferred();
+        }
+      };
+
+      this.on("error", pending.reject);
+
+      const writer = new BufferedWriter(stream);
+      writer.stream = originalWriter.stream;
+      writer.stream.writer = writer;
+      writer.next = originalWriter.next;
+      writer.state = this._state;
+      writer.merge(originalWriter);
+
+      this._state.stream = stream;
+      this._state.writer = writer;
+
+      iteratorNextFn = async () => {
+        if (buffer || done) {
+          const value = buffer;
+          buffer = "";
+          return { value, done };
+        }
+        return pending.promise;
+      };
+    }
+
+    return this.bx_ = {
+      next: iteratorNextFn,
+      [Symbol.asyncIterator]() {
+        return this;
+      }
+    };
+  },
 
   sync: function () {
     this._sync = true;
@@ -154,7 +235,7 @@ var proto = AsyncStream.prototype = {
     return this._state.writer.toString();
   },
 
-  bn_: function () {
+  by_: function () {
     this._result = this._result || new RenderResult(this);
     return this._result;
   },
@@ -205,7 +286,7 @@ var proto = AsyncStream.prototype = {
           }
 
           this._lastCount++;
-          newStream.bl_ = true;
+          newStream.bv_ = true;
         }
 
         name = options.name;
@@ -251,7 +332,7 @@ var proto = AsyncStream.prototype = {
     }
 
     if (state.events !== state.stream) {
-      state.events.emit("finish", this.bn_());
+      state.events.emit("finish", this.by_());
     }
   },
 
@@ -323,7 +404,7 @@ var proto = AsyncStream.prototype = {
         parentOut._handleChildDone(this);
       }
     } else {
-      if (childOut.bl_) {
+      if (childOut.bv_) {
         this._lastCount--;
       }
 
@@ -364,7 +445,7 @@ var proto = AsyncStream.prototype = {
     var state = this._state;
 
     if (event === "finish" && state.finished === true) {
-      callback(this.bn_());
+      callback(this.by_());
     } else if (event === "last") {
       this.onLast(callback);
     } else {
@@ -378,7 +459,7 @@ var proto = AsyncStream.prototype = {
     var state = this._state;
 
     if (event === "finish" && state.finished === true) {
-      callback(this.bn_());
+      callback(this.by_());
     } else if (event === "last") {
       this.onLast(callback);
     } else {
@@ -637,20 +718,22 @@ var proto = AsyncStream.prototype = {
 
   then: function (fn, fnErr) {
     var out = this;
-    var promise = new Promise(function (resolve, reject) {
+    return new Promise(function (resolve, reject) {
       out.on("error", reject);
       out.on("finish", function (result) {
         resolve(result);
       });
-    });
-
-    return Promise.resolve(promise).then(fn, fnErr);
+    }).then(fn, fnErr);
   },
 
   catch: function (fnErr) {
     return this.then(undefined, fnErr);
   },
 
+  finally: function (fn) {
+    return this.then(undefined, undefined).finally(fn);
+  },
+
   c: function (componentDef, key, customEvents) {
     this._X_ = componentDef;
     this._Y_ = key;

package/dist/runtime/html/helpers/_dynamic-attr.js

@@ -1,7 +1,7 @@
 "use strict";
 var attrHelper = require("./attr");
-var notEmptyAttr = attrHelper.bo_;
-var isEmptyAttrValue = attrHelper.bp_;
+var notEmptyAttr = attrHelper.bz_;
+var isEmptyAttrValue = attrHelper.bA_;
 var classHelper = require("./class-attr");
 var styleHelper = require("./style-attr");