marko 4.25.0 → 4.26.0

package/src/node_modules/@internal/init-components-tag/index.js

@@ -0,0 +1,54 @@
+"use strict";
+
+const INIT_COMPONENTS_KEY = Symbol();
+
+const addComponentsFromContext =
+  require("@internal/components-entry").___addComponentsFromContext;
+const getInitComponentsCode =
+  require("@internal/components-entry").___getInitComponentsCode;
+
+function addComponentsFromOut(source, target) {
+  const sourceOut = source.out || source;
+  const targetOut = target || sourceOut;
+  const componentsContext = sourceOut.___components;
+  const componentDefs = targetOut.writer.get("componentDefs");
+  addComponentsFromContext(componentsContext, componentDefs);
+}
+
+function addInitScript(writer) {
+  const out = writer.state.root;
+  const componentDefs = writer.get("componentDefs");
+  writer.script(getInitComponentsCode(out, componentDefs));
+}
+
+module.exports = function render(input, out) {
+  const $global = out.global;
+  if ($global[INIT_COMPONENTS_KEY] === undefined) {
+    $global[INIT_COMPONENTS_KEY] = true;
+
+    out.on("await:finish", addComponentsFromOut);
+    out.on("___toString", addInitScript);
+
+    if (out.isSync() === true) {
+      // Generate initialization code for any of the UI components that were
+      // rendered synchronously
+      addComponentsFromOut(out);
+    } else {
+      // Generate initialization code for any of the UI components that were
+      // rendered asynchronously, but were outside an `<await>` tag
+      // (each `<await>` tag will have its own component initialization block)
+      const asyncOut = out.beginAsync({ last: true, timeout: -1 });
+      out.onLast(function (next) {
+        // Ensure we're getting init code starting from the root
+        let rootOut = out;
+        while (rootOut._parentOut) {
+          rootOut = rootOut._parentOut;
+        }
+        // Write out all of the component init code from the main out
+        addComponentsFromOut(rootOut, asyncOut);
+        asyncOut.end();
+        next();
+      });
+    }
+  }
+};

package/src/node_modules/@internal/init-components-tag/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "./index.js",
+  "browser": "./index-browser.js",
+  "exports": {
+    ".": {
+      "worker": "./index.js",
+      "browser": "./index-browser.js",
+      "default": "./index.js"
+    }
+  }
+}

package/src/{loader/index-default.js → node_modules/@internal/loader/index.js}

@@ -3,7 +3,7 @@
 var nodePath = require("path");
 var fs = require("fs");
 var Module = require("module").Module;
-var compilerPath = nodePath.join(__dirname, "../compiler");
+var compilerPath = nodePath.join(__dirname, "../../../compiler");
 var markoCompiler = require(compilerPath);
 var cwd = process.cwd();
 var fsOptions = { encoding: "utf8" };
@@ -137,7 +137,7 @@ function getPreviousTemplate(templatePath, options) {
 }
 
 function createRenderProxy(template) {
-  return function(data, out) {
+  return function (data, out) {
     template._(data, out);
   };
 }

package/src/node_modules/@internal/loader/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "./index.js",
+  "browser": "./index-browser.js",
+  "exports": {
+    ".": {
+      "webpack": "./index-browser.js",
+      "browser": "./index-browser.js",
+      "default": "./index.js"
+    }
+  }
+}

package/src/node_modules/@internal/preserve-tag/index.js

@@ -0,0 +1,27 @@
+var ComponentsContext = require("../../../runtime/components/ComponentsContext");
+var getComponentsContext = ComponentsContext.___getComponentsContext;
+
+module.exports = function render(input, out) {
+  var shouldPreserve = Boolean(!("i" in input) || input.i);
+  var isComponent = !input.n;
+
+  if (isComponent) {
+    out.bf(out.___assignedKey, out.___assignedComponentDef.___component, true);
+  }
+
+  if (input.renderBody) {
+    if (shouldPreserve) {
+      var componentsContext = getComponentsContext(out);
+      var parentPreserved = componentsContext.___isPreserved;
+      componentsContext.___isPreserved = true;
+      input.renderBody(out);
+      componentsContext.___isPreserved = parentPreserved;
+    } else {
+      input.renderBody(out);
+    }
+  }
+
+  if (isComponent) {
+    out.ef();
+  }
+};

package/src/node_modules/@internal/preserve-tag/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "./index.js",
+  "browser": "./index-browser.js",
+  "exports": {
+    ".": {
+      "worker": "./index.js",
+      "browser": "./index-browser.js",
+      "default": "./index.js"
+    }
+  }
+}

package/src/node_modules/@internal/set-immediate/index-browser.js

@@ -0,0 +1,17 @@
+var queue = [];
+var msg = "" + Math.random();
+window.addEventListener("message", function (ev) {
+  if (ev.data === msg) {
+    var callbacks = queue;
+    queue = [];
+    for (var i = 0; i < callbacks.length; i++) {
+      callbacks[i]();
+    }
+  }
+});
+
+exports.___setImmediate = function (callback) {
+  if (queue.push(callback) === 1) {
+    window.postMessage(msg, "*");
+  }
+};

package/src/node_modules/@internal/set-immediate/index-worker.js

@@ -0,0 +1,2 @@
+exports.___setImmediate = setTimeout;
+exports.___clearImmediate = clearTimeout;

package/src/node_modules/@internal/set-immediate/index.js

@@ -0,0 +1,2 @@
+exports.___setImmediate = setImmediate;
+exports.___clearImmediate = clearImmediate;

package/src/node_modules/@internal/set-immediate/package.json

@@ -0,0 +1,11 @@
+{
+  "main": "./index.js",
+  "browser": "./index-browser.js",
+  "exports": {
+    ".": {
+      "worker": "./index-worker.js",
+      "browser": "./index-browser.js",
+      "default": "./index.js"
+    }
+  }
+}

package/src/runtime/RenderResult.js

@@ -1,6 +1,12 @@
 var domInsert = require("./dom-insert");
 var complain = "MARKO_DEBUG" && require("complain");
 
+function getRootNode(el) {
+  var cur = el;
+  while (cur.parentNode) cur = cur.parentNode;
+  return cur;
+}
+
 function getComponentDefs(result) {
   var componentDefs = result.___components;
 
@@ -18,10 +24,10 @@ function RenderResult(out) {
 module.exports = RenderResult;
 
 var proto = (RenderResult.prototype = {
-  getComponent: function() {
+  getComponent: function () {
     return this.getComponents()[0];
   },
-  getComponents: function(selector) {
+  getComponents: function (selector) {
     if (this.___components === undefined) {
       throw Error("Not added to DOM");
     }
@@ -30,7 +36,7 @@ var proto = (RenderResult.prototype = {
 
     var components = [];
 
-    componentDefs.forEach(function(componentDef) {
+    componentDefs.forEach(function (componentDef) {
       var component = componentDef.___component;
       if (!selector || selector(component)) {
         components.push(component);
@@ -40,31 +46,31 @@ var proto = (RenderResult.prototype = {
     return components;
   },
 
-  afterInsert: function(doc) {
+  afterInsert: function (host) {
     var out = this.___out;
     var componentsContext = out.___components;
     if (componentsContext) {
-      this.___components = componentsContext.___initComponents(doc);
+      this.___components = componentsContext.___initComponents(host);
     } else {
       this.___components = null;
     }
 
     return this;
   },
-  getNode: function(doc) {
-    return this.___out.___getNode(doc);
+  getNode: function (host) {
+    return this.___out.___getNode(host);
   },
-  getOutput: function() {
+  getOutput: function () {
     return this.___out.___getOutput();
   },
-  toString: function() {
+  toString: function () {
     return this.___out.toString();
   },
-  document: typeof document != "undefined" && document
+  document: typeof document === "object" && document
 });
 
 Object.defineProperty(proto, "html", {
-  get: function() {
+  get: function () {
     // eslint-disable-next-line no-constant-condition
     if ("MARKO_DEBUG") {
       complain(
@@ -76,7 +82,7 @@ Object.defineProperty(proto, "html", {
 });
 
 Object.defineProperty(proto, "context", {
-  get: function() {
+  get: function () {
     // eslint-disable-next-line no-constant-condition
     if ("MARKO_DEBUG") {
       complain(
@@ -97,13 +103,9 @@ Object.defineProperty(proto, "context", {
 domInsert(
   proto,
   function getEl(renderResult, referenceEl) {
-    return renderResult.getNode(referenceEl.ownerDocument);
+    return renderResult.getNode(getRootNode(referenceEl));
   },
   function afterInsert(renderResult, referenceEl) {
-    var isShadow =
-      typeof ShadowRoot === "function" && referenceEl instanceof ShadowRoot;
-    return renderResult.afterInsert(
-      isShadow ? referenceEl : referenceEl.ownerDocument
-    );
+    return renderResult.afterInsert(getRootNode(referenceEl));
   }
 );

package/src/runtime/components/Component.js

@@ -5,9 +5,9 @@ var complain = "MARKO_DEBUG" && require("complain");
 
 var domInsert = require("../dom-insert");
 var defaultCreateOut = require("../createOut");
-var getComponentsContext = require("./ComponentsContext")
-  .___getComponentsContext;
-var componentsUtil = require("./util");
+var getComponentsContext =
+  require("./ComponentsContext").___getComponentsContext;
+var componentsUtil = require("@internal/components-util");
 var componentLookup = componentsUtil.___componentLookup;
 var destroyNodeRecursive = componentsUtil.___destroyNodeRecursive;
 var EventEmitter = require("events-light");
@@ -22,6 +22,7 @@ var componentsByDOMNode = domData.___componentByDOMNode;
 var keyedElementsByComponentId = domData.___ssrKeyedElementsByComponentId;
 var CONTEXT_KEY = "__subtree_context__";
 
+var hasOwnProperty = Object.prototype.hasOwnProperty;
 var slice = Array.prototype.slice;
 
 var COMPONENT_SUBSCRIBE_TO_OPTIONS;
@@ -97,7 +98,7 @@ function processUpdateHandlers(component, stateChanges, oldState) {
   var handlers;
 
   for (var propName in stateChanges) {
-    if (stateChanges.hasOwnProperty(propName)) {
+    if (hasOwnProperty.call(stateChanges, propName)) {
       var handlerMethodName = "update_" + propName;
 
       handlerMethod = component[handlerMethodName];
@@ -118,7 +119,7 @@ function processUpdateHandlers(component, stateChanges, oldState) {
     // Otherwise, there are handlers for all of the changed properties
     // so apply the updates using those handlers
 
-    handlers.forEach(function(handler) {
+    handlers.forEach(function (handler) {
       var propertyName = handler[0];
       handlerMethod = handler[1];
 
@@ -183,7 +184,7 @@ function Component(id) {
   this.___updateQueued = false;
   this.___dirty = false;
   this.___settingInput = false;
-  this.___document = undefined;
+  this.___host = undefined;
 
   var ssrKeyedElements = keyedElementsByComponentId[id];
 
@@ -198,7 +199,7 @@ function Component(id) {
 Component.prototype = componentProto = {
   ___isComponent: true,
 
-  subscribeTo: function(target) {
+  subscribeTo: function (target) {
     if (!target) {
       throw TypeError();
     }
@@ -214,7 +215,7 @@ Component.prototype = componentProto = {
     return subscriptions.subscribeTo(target, subscribeToOptions);
   },
 
-  emit: function(eventType) {
+  emit: function (eventType) {
     var customEvents = this.___customEvents;
     var target;
 
@@ -238,13 +239,13 @@ Component.prototype = componentProto = {
 
     return emit.apply(this, arguments);
   },
-  getElId: function(key, index) {
+  getElId: function (key, index) {
     if (!key) {
       return this.id;
     }
     return resolveComponentIdHelper(this, key, index);
   },
-  getEl: function(key, index) {
+  getEl: function (key, index) {
     if (key) {
       var resolvedKey = resolveKeyHelper(key, index);
       var keyedElement = this.___keyedElements["@" + resolvedKey];
@@ -271,7 +272,7 @@ Component.prototype = componentProto = {
       return this.el;
     }
   },
-  getEls: function(key) {
+  getEls: function (key) {
     key = key + "[]";
 
     var els = [];
@@ -283,7 +284,7 @@ Component.prototype = componentProto = {
     }
     return els;
   },
-  getComponent: function(key, index) {
+  getComponent: function (key, index) {
     var rootNode = this.___keyedElements[resolveKeyHelper(key, index)];
     if (/\[\]$/.test(key)) {
       // eslint-disable-next-line no-constant-condition
@@ -296,17 +297,17 @@ Component.prototype = componentProto = {
     }
     return rootNode && componentsByDOMNode.get(rootNode);
   },
-  getComponents: function(key) {
+  getComponents: function (key) {
     var lookup = this.___keyedElements[key + "[]"];
     return lookup
       ? Object.keys(lookup)
-          .map(function(key) {
+          .map(function (key) {
             return componentsByDOMNode.get(lookup[key]);
           })
           .filter(Boolean)
       : [];
   },
-  destroy: function() {
+  destroy: function () {
     if (this.___destroyed) {
       return;
     }
@@ -317,7 +318,7 @@ Component.prototype = componentProto = {
 
     var nodes = root.nodes;
 
-    nodes.forEach(function(node) {
+    nodes.forEach(function (node) {
       destroyNodeRecursive(node);
 
       if (eventDelegation.___handleNodeDetach(node) !== false) {
@@ -331,7 +332,7 @@ Component.prototype = componentProto = {
     this.___keyedElements = {};
   },
 
-  ___destroyShallow: function() {
+  ___destroyShallow: function () {
     if (this.___destroyed) {
       return;
     }
@@ -353,7 +354,7 @@ Component.prototype = componentProto = {
     }
   },
 
-  isDestroyed: function() {
+  isDestroyed: function () {
     return this.___destroyed;
   },
   get state() {
@@ -379,7 +380,7 @@ Component.prototype = componentProto = {
       this.___state = null;
     }
   },
-  setState: function(name, value) {
+  setState: function (name, value) {
     var state = this.___state;
 
     if (!state) {
@@ -389,7 +390,7 @@ Component.prototype = componentProto = {
       // Merge in the new state with the old state
       var newState = name;
       for (var k in newState) {
-        if (newState.hasOwnProperty(k)) {
+        if (hasOwnProperty.call(newState, k)) {
           state.___set(k, newState[k], true /* ensure:true */);
         }
       }
@@ -398,7 +399,7 @@ Component.prototype = componentProto = {
     }
   },
 
-  setStateDirty: function(name, value) {
+  setStateDirty: function (name, value) {
     var state = this.___state;
 
     if (arguments.length == 1) {
@@ -413,7 +414,7 @@ Component.prototype = componentProto = {
     );
   },
 
-  replaceState: function(newState) {
+  replaceState: function (newState) {
     this.___state.___replace(newState);
   },
 
@@ -428,7 +429,7 @@ Component.prototype = componentProto = {
     }
   },
 
-  ___setInput: function(newInput, onInput, out) {
+  ___setInput: function (newInput, onInput, out) {
     onInput = onInput || this.onInput;
     var updatedInput;
 
@@ -460,19 +461,19 @@ Component.prototype = componentProto = {
     return newInput;
   },
 
-  forceUpdate: function() {
+  forceUpdate: function () {
     this.___dirty = true;
     this.___queueUpdate();
   },
 
-  ___queueUpdate: function() {
+  ___queueUpdate: function () {
     if (!this.___updateQueued) {
       this.___updateQueued = true;
       updateManager.___queueComponentUpdate(this);
     }
   },
 
-  update: function() {
+  update: function () {
     if (this.___destroyed === true || this.___isDirty === false) {
       return;
     }
@@ -505,7 +506,7 @@ Component.prototype = componentProto = {
     );
   },
 
-  ___reset: function() {
+  ___reset: function () {
     this.___dirty = false;
     this.___updateQueued = false;
     this.___renderInput = null;
@@ -515,11 +516,11 @@ Component.prototype = componentProto = {
     }
   },
 
-  shouldUpdate: function() {
+  shouldUpdate: function () {
     return true;
   },
 
-  ___scheduleRerender: function() {
+  ___scheduleRerender: function () {
     var self = this;
     var renderer = self.___renderer;
 
@@ -529,22 +530,22 @@ Component.prototype = componentProto = {
 
     var input = this.___renderInput || this.___input;
 
-    updateManager.___batchUpdate(function() {
-      self.___rerender(input, false).afterInsert(self.___document);
+    updateManager.___batchUpdate(function () {
+      self.___rerender(input, false).afterInsert(self.___host);
     });
 
     this.___reset();
   },
 
-  ___rerender: function(input, isHydrate) {
-    var doc = this.___document;
+  ___rerender: function (input, isHydrate) {
+    var host = this.___host;
     var globalData = this.___global;
     var rootNode = this.___rootNode;
     var renderer = this.___renderer;
     var createOut = renderer.createOut || defaultCreateOut;
     var out = createOut(globalData);
     out.sync();
-    out.___document = this.___document;
+    out.___host = this.___host;
     out[CONTEXT_KEY] = this.___context;
 
     var componentsContext = getComponentsContext(out);
@@ -558,18 +559,18 @@ Component.prototype = componentProto = {
 
     var targetNode = out.___getOutput().___firstChild;
 
-    morphdom(rootNode, targetNode, doc, componentsContext);
+    morphdom(rootNode, targetNode, host, componentsContext);
 
     return result;
   },
 
-  ___detach: function() {
+  ___detach: function () {
     var root = this.___rootNode;
     root.remove();
     return root;
   },
 
-  ___removeDOMEventListeners: function() {
+  ___removeDOMEventListeners: function () {
     var eventListenerHandles = this.___domEventListenerHandles;
     if (eventListenerHandles) {
       eventListenerHandles.forEach(removeListener);
@@ -582,17 +583,19 @@ Component.prototype = componentProto = {
     return state && state.___raw;
   },
 
-  ___setCustomEvents: function(customEvents, scope) {
+  ___setCustomEvents: function (customEvents, scope) {
     var finalCustomEvents = (this.___customEvents = {});
     this.___scope = scope;
 
-    customEvents.forEach(function(customEvent) {
+    customEvents.forEach(function (customEvent) {
       var eventType = customEvent[0];
       var targetMethodName = customEvent[1];
       var isOnce = customEvent[2];
       var extraArgs = customEvent[3];
 
-      finalCustomEvents[eventType] = [targetMethodName, isOnce, extraArgs];
+      if (targetMethodName) {
+        finalCustomEvents[eventType] = [targetMethodName, isOnce, extraArgs];
+      }
     });
   },
 
@@ -607,7 +610,7 @@ Component.prototype = componentProto = {
         'The "this.els" attribute is deprecated. Please use "this.getEls(key)" instead.'
       );
     }
-    return (this.___rootNode ? this.___rootNode.nodes : []).filter(function(
+    return (this.___rootNode ? this.___rootNode.nodes : []).filter(function (
       el
     ) {
       return el.nodeType === ELEMENT_NODE;

package/src/runtime/components/ComponentDef.js

@@ -1,10 +1,10 @@
 "use strict";
 var complain = "MARKO_DEBUG" && require("complain");
 var w10Noop = require("warp10/constants").NOOP;
-var componentUtil = require("./util");
+var componentUtil = require("@internal/components-util");
 var attachBubblingEvent = componentUtil.___attachBubblingEvent;
-var addDelegatedEventHandler = require("./event-delegation")
-  .___addDelegatedEventHandler;
+var addDelegatedEventHandler =
+  require("./event-delegation").___addDelegatedEventHandler;
 var extend = require("raptor-util/extend");
 var KeySequence = require("./KeySequence");
 var EMPTY_OBJECT = {};
@@ -36,7 +36,7 @@ function ComponentDef(component, componentId, componentsContext) {
 }
 
 ComponentDef.prototype = {
-  ___nextKey: function(key) {
+  ___nextKey: function (key) {
     return (
       this.___keySequence || (this.___keySequence = new KeySequence())
     ).___nextKey(key);
@@ -46,7 +46,7 @@ ComponentDef.prototype = {
    * This helper method generates a unique and fully qualified DOM element ID
    * that is unique within the scope of the current component.
    */
-  elId: function(nestedId) {
+  elId: function (nestedId) {
     var id = this.id;
 
     if (nestedId == null) {
@@ -72,11 +72,11 @@ ComponentDef.prototype = {
   /**
    * Returns the next auto generated unique ID for a nested DOM element or nested DOM component
    */
-  ___nextComponentId: function() {
+  ___nextComponentId: function () {
     return this.id + "-c" + this.___nextIdIndex++;
   },
 
-  d: function(eventName, handlerMethodName, isOnce, extraArgs) {
+  d: function (eventName, handlerMethodName, isOnce, extraArgs) {
     addDelegatedEventHandler(eventName);
     return attachBubblingEvent(this, handlerMethodName, isOnce, extraArgs);
   },
@@ -88,7 +88,7 @@ ComponentDef.prototype = {
 
 ComponentDef.prototype.nk = ComponentDef.prototype.___nextKey;
 
-ComponentDef.___deserialize = function(o, types, global, registry) {
+ComponentDef.___deserialize = function (o, types, global, registry) {
   var id = o[0];
   var typeName = types[o[1]];
   var input = o[2] || null;
@@ -130,7 +130,7 @@ ComponentDef.___deserialize = function(o, types, global, registry) {
     if (state) {
       var undefinedPropNames = extra.u;
       if (undefinedPropNames) {
-        undefinedPropNames.forEach(function(undefinedPropName) {
+        undefinedPropNames.forEach(function (undefinedPropName) {
           state[undefinedPropName] = undefined;
         });
       }

package/src/runtime/components/ComponentsContext.js

@@ -20,9 +20,8 @@ function ComponentsContext(out, parentComponentsContext) {
   } else {
     globalComponentsContext = out.global.___components;
     if (globalComponentsContext === undefined) {
-      out.global.___components = globalComponentsContext = new GlobalComponentsContext(
-        out
-      );
+      out.global.___components = globalComponentsContext =
+        new GlobalComponentsContext(out);
     }
   }
 
@@ -36,10 +35,10 @@ function ComponentsContext(out, parentComponentsContext) {
 }
 
 ComponentsContext.prototype = {
-  ___initComponents: function(doc) {
+  ___initComponents: function (host) {
     var componentDefs = this.___components;
 
-    ComponentsContext.___initClientRendered(componentDefs, doc);
+    ComponentsContext.___initClientRendered(componentDefs, host);
 
     this.___out.emit("___componentsInitialized");
 

package/src/runtime/components/GlobalComponentsContext.js

@@ -1,4 +1,5 @@
-var nextComponentIdProvider = require("./util").___nextComponentIdProvider;
+var nextComponentIdProvider =
+  require("@internal/components-util").___nextComponentIdProvider;
 
 function GlobalComponentsContext(out) {
   this.___renderedComponentsById = {};