marko 5.29.2 → 5.30.0

package/src/runtime/components/legacy/dependencies/index.js

@@ -0,0 +1,178 @@
+var nodePath = require("path");
+var defaultResolveFrom = require("resolve-from");
+var env = process.env.NODE_ENV;
+var production = !env || env !== "development";
+
+function getRootDeps(template, context) {
+  if (production && template.___depsArray) {
+    return template.___depsArray;
+  }
+
+  attachDepsAndComponentsToTemplate(template, context);
+
+  var deps = (template.___depsArray = Object.keys(template.___deps).map(
+    (key) => template.___deps[key]
+  ));
+  var initModule = getInitModule(template.path, template.___components);
+
+  if (initModule) deps.push(initModule);
+
+  // these dependencies should be last
+  deps.concat = function () {
+    var result = [];
+    result = result.concat.apply(result, arguments);
+    result.push.apply(result, this);
+    return result;
+  };
+
+  return deps;
+}
+
+function attachDepsAndComponentsToTemplate(target, context) {
+  var template;
+
+  if (!target.meta && target.template) {
+    template = target.template;
+  } else {
+    template = target;
+  }
+
+  if (typeof template.createOut !== "function") return;
+  if (production && target.___deps) return;
+
+  var deps = (target.___deps = {});
+  var components = (target.___components = {});
+
+  if (!template.meta) {
+    // eslint-disable-next-line no-console
+    console.warn("Metadata not set for template at ", template.path);
+    return;
+  }
+
+  var meta = template.meta;
+  var root = nodePath.dirname(template.path);
+
+  if (meta.deps) {
+    meta.deps.forEach((dep) => {
+      dep = resolveDep(dep, root, context);
+      deps[dep.virtualPath || dep.path] = dep;
+    });
+  }
+
+  if (meta.id && meta.component) {
+    var resolveFrom = (context && context.resolveFrom) || defaultResolveFrom;
+    components[meta.id] = {
+      id: meta.id,
+      path: resolveFrom(root, meta.component),
+    };
+  }
+
+  if (meta.tags) {
+    meta.tags.forEach((tagPath) => {
+      var resolveFrom = context.resolveFrom || defaultResolveFrom;
+      var tag = resolveFrom(root, tagPath);
+      var ext = nodePath.extname(tag);
+      var req = context.require || require;
+
+      try {
+        tag = req.resolve(tag.slice(0, 0 - ext.length) + ".js");
+      } catch (e) {
+        /* ignore error */
+      }
+
+      tag = req(tag);
+
+      attachDepsAndComponentsToTemplate(tag, context);
+
+      if (tag.___deps) Object.assign(deps, tag.___deps);
+      if (tag.___components) Object.assign(components, tag.___components);
+    });
+  }
+}
+
+function getInitModule(path, components) {
+  var module = null;
+
+  if (components) {
+    components = Object.keys(components).map((key) => components[key]);
+
+    if (components.length) {
+      var root = nodePath.dirname(path);
+      var virtualPath = path + ".init.js";
+      var registrations = components.map(
+        (component) =>
+          `components.register('${component.id}', require('.${
+            nodePath.sep
+          }${nodePath.relative(root, component.path)}'));`
+      );
+      var code = `
+                var components = require('marko/components');
+                ${registrations.join("\n")}
+            `;
+
+      module = {
+        type: "require",
+        run: true,
+        virtualModule: {
+          path: virtualPath,
+          read: function (_, callback) {
+            // TODO: Check if read can just return string in lasso 2
+            if (callback) {
+              callback(null, code);
+            } else {
+              return code;
+            }
+          },
+        },
+      };
+    }
+  }
+
+  return module;
+}
+
+function resolveDep(dep, root, context) {
+  if (typeof dep === "string") {
+    dep = parseDependencyString(dep);
+  }
+
+  if (dep.path) {
+    var resolveFrom = (context && context.resolveFrom) || defaultResolveFrom;
+    dep.path = resolveFrom(root, dep.path);
+
+    if (dep.path && !dep.type) {
+      dep.type = dep.path.slice(dep.path.lastIndexOf(".") + 1);
+    }
+  }
+
+  if (dep.virtualPath) {
+    dep.virtualPath = nodePath.resolve(root, dep.virtualPath);
+  }
+
+  if (dep.type === "js") {
+    dep.type = "require";
+    dep.run = true;
+  }
+
+  return dep;
+}
+
+function parseDependencyString(string) {
+  var match = /^(?:([\w-]+)(?::\s*|\s+))?(.*?(?:\.(\w+))?)$/.exec(string);
+  return {
+    type: match[1] || match[3],
+    path: match[2],
+  };
+}
+
+function patch(Template) {
+  Template.prototype.getDependencies = function (context) {
+    context = context || {};
+
+    return getRootDeps(this, context);
+  };
+}
+
+exports.getDeps = getRootDeps;
+exports.resolveDep = resolveDep;
+exports.patch = patch;

package/src/runtime/components/legacy/dependencies/vdom.js

@@ -0,0 +1,3 @@
+var patch = require("./").patch;
+var Template = require("../../../vdom").Template;
+patch(Template);

package/src/runtime/components/legacy/index.js

@@ -0,0 +1 @@
+module.exports = require("@internal/components-entry-legacy");

package/src/runtime/components/legacy/jquery.js

@@ -0,0 +1,51 @@
+var ready = require("./ready");
+
+var idRegExp = /^#(\S+)( .*)?/;
+
+exports.patchComponent = function (jQuery, proto, delayThrow) {
+  if (!(jQuery || (jQuery = window.$)) && !delayThrow) {
+    throw new Error("jQuery not found");
+  }
+
+  (proto || require("../Component").prototype).$ = function jqueryProxy(arg) {
+    var args = arguments;
+    var self = this;
+
+    if (!jQuery) {
+      throw new Error("jQuery not found");
+    }
+
+    if (args.length === 1) {
+      //Handle an "ondomready" callback function
+      if (typeof arg === "function") {
+        return ready(function () {
+          arg.call(self);
+        });
+      } else if (typeof arg === "string") {
+        var match = idRegExp.exec(arg);
+        //Reset the search to 0 so the next call to exec will start from the beginning for the new string
+        if (match != null) {
+          var key = match[1];
+          if (match[2] == null) {
+            return jQuery(self.getEl(key));
+          } else {
+            return jQuery(match[2].trim(), self.getEl(key));
+          }
+        } else {
+          var rootEl = self.getEl();
+          if (!rootEl) {
+            throw new Error("Root element is not defined for component");
+          }
+          if (rootEl) {
+            return jQuery(arg, rootEl);
+          }
+        }
+      }
+    } else if (args.length === 2 && typeof args[1] === "string") {
+      return jQuery(arg, self.getEl(args[1]));
+    } else if (args.length === 0) {
+      return jQuery(self.el);
+    }
+    return jQuery.apply(window, arguments);
+  };
+};

package/src/runtime/components/legacy/ready.js

@@ -0,0 +1,152 @@
+/*
+    jQuery's doc.ready/$(function(){}) should
+    you wish to use a cross-browser domReady solution
+    without opting for a library.
+
+    Demo: http://jsfiddle.net/zKLpb/
+
+    usage:
+    $(function(){
+        // your code
+    });
+
+    Parts: jQuery project, Diego Perini, Lucent M.
+    Previous version from Addy Osmani (https://raw.github.com/addyosmani/jquery.parts/master/jquery.documentReady.js)
+
+    This version: Patrick Steele-Idem
+    - Converted to CommonJS module
+    - Code cleanup
+    - Fixes for IE <=10
+*/
+
+var isReady = false;
+var readyBound = false;
+
+var defaultWindow = typeof window != "undefined" && window;
+var defaultDocument = typeof document != "undefined" && document;
+
+var listeners = [];
+
+function domReadyCallback() {
+  for (var i = 0, len = listeners.length; i < len; i++) {
+    var listener = listeners[i];
+    listener[0].call(listener[1]);
+  }
+  listeners = null;
+}
+
+function bindReady(doc) {
+  var toplevel = false;
+  var win = doc.defaultView || defaultWindow || doc;
+
+  // Handle when the DOM is ready
+  function domReady() {
+    // Make sure that the DOM is not already loaded
+    if (!isReady) {
+      // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
+      if (!doc.body) {
+        return setTimeout(domReady, 1);
+      }
+      // Remember that the DOM is ready
+      isReady = true;
+      // If there are functions bound, to execute
+      domReadyCallback();
+      // Execute all of them
+    }
+  } // /ready()
+
+  // The ready event handler
+  function domContentLoaded() {
+    if (doc.addEventListener) {
+      doc.removeEventListener("DOMContentLoaded", domContentLoaded, false);
+      doc.removeEventListener("load", domContentLoaded, false);
+    } else {
+      // we're here because readyState !== "loading" in oldIE
+      // which is good enough for us to call the dom ready!
+      doc.detachEvent("onreadystatechange", domContentLoaded);
+      doc.detachEvent("onload", domContentLoaded);
+    }
+    domReady();
+  }
+
+  // The DOM ready check for Internet Explorer
+  function doScrollCheck() {
+    if (isReady) {
+      return;
+    }
+
+    try {
+      // If IE is used, use the trick by Diego Perini
+      // http://javascript.nwbox.com/IEContentLoaded/
+      doc.documentElement.doScroll("left");
+    } catch (error) {
+      setTimeout(doScrollCheck, 1);
+      return;
+    }
+    // and execute any waiting functions
+    domReady();
+  }
+
+  // Catch cases where $ is called after the
+  // browser event has already occurred. IE <= 10 has a bug that results in 'interactive' being assigned
+  // to the readyState before the DOM is really ready
+  if (
+    document.attachEvent
+      ? document.readyState === "complete"
+      : document.readyState !== "loading"
+  ) {
+    // We will get here if the browser is IE and the readyState === 'complete' or the browser
+    // is not IE and the readyState === 'interactive' || 'complete'
+    domReady(doc);
+  } else if (doc.addEventListener) {
+    // Standards-based browsers support DOMContentLoaded
+    // Use the handy event callback
+    doc.addEventListener("DOMContentLoaded", domContentLoaded, false);
+    // A fallback to win.onload, that will always work
+    win.addEventListener("load", domContentLoaded, false);
+    // If IE event model is used
+  } else if (doc.attachEvent) {
+    // ensure firing before onload,
+    // maybe late but safe also for iframes
+    doc.attachEvent("onreadystatechange", domContentLoaded);
+    // A fallback to win.onload, that will always work
+    win.attachEvent("onload", domContentLoaded);
+    // If IE and not a frame
+    // continually check to see if the document is ready
+    try {
+      toplevel = win.frameElement == null;
+    } catch (e) {
+      /* ignore error */
+    }
+    if (doc.documentElement.doScroll && toplevel) {
+      doScrollCheck();
+    }
+  }
+}
+
+function ready(callback, thisObj, doc) {
+  if (isReady) {
+    return callback.call(thisObj);
+  }
+
+  listeners.push([callback, thisObj]);
+
+  if (!readyBound) {
+    readyBound = true;
+    bindReady(doc || defaultDocument);
+  }
+}
+
+module.exports = ready;
+
+module.exports.patchComponent = function (proto) {
+  if (proto && proto.ready) {
+    // Don't patch if the component has overwritten the ready method.
+    return;
+  }
+
+  (proto || require("../Component").prototype).ready = function (callback) {
+    var document = this.el.ownerDocument;
+    ready(callback, this, document);
+  };
+};

package/src/runtime/components/legacy/renderer-legacy.js

@@ -0,0 +1,230 @@
+var getComponentsContext =
+  require("../ComponentsContext").___getComponentsContext;
+var componentsUtil = require("@internal/components-util");
+var componentLookup = componentsUtil.___componentLookup;
+var registry = require("@internal/components-registry");
+var modernRenderer = require("../renderer");
+var resolveComponentKey = modernRenderer.___resolveComponentKey;
+var trackAsyncComponents = modernRenderer.___trackAsyncComponents;
+var beginComponent = require("@internal/components-beginComponent");
+var endComponent = require("@internal/components-endComponent");
+var complain = "MARKO_DEBUG" && require("complain");
+
+function createRendererFunc(templateRenderFunc, componentProps) {
+  var typeName = componentProps.t;
+  //var assignedId = componentProps.id;
+  var isSplit = componentProps.s === true;
+  var isImplicit = componentProps.i === true;
+
+  return function renderer(input, out, assignedId, renderingLogic) {
+    trackAsyncComponents(out);
+
+    var componentsContext = getComponentsContext(out);
+    var parentLegacyComponentDef = componentsContext.___legacyComponentDef;
+
+    if (isImplicit && parentLegacyComponentDef) {
+      templateRenderFunc(
+        input,
+        out,
+        parentLegacyComponentDef,
+        parentLegacyComponentDef.___component,
+        parentLegacyComponentDef.___component.___rawState,
+        out.global
+      );
+      return;
+    }
+
+    var widgetBody = input.renderBody;
+    var widgetState = input.widgetState;
+    var widgetConfig = input.widgetConfig;
+    var globalComponentsContext = componentsContext.___globalContext;
+    var component = globalComponentsContext.___rerenderComponent;
+
+    var isRerender = component !== undefined;
+    var id = assignedId;
+    var isExisting;
+    var parentComponentDef = componentsContext.___componentDef;
+    var ownerComponentDef = out.___assignedComponentDef;
+    var ownerComponentId = ownerComponentDef && ownerComponentDef.id;
+    var key = out.___assignedKey;
+    var customEvents = out.___assignedCustomEvents;
+
+    out.___assignedComponentDef = null;
+
+    if (component) {
+      id = component.id;
+      isExisting = true;
+      globalComponentsContext.___rerenderComponent = null;
+    } else {
+      if (key != null) {
+        id = id || resolveComponentKey(key.toString(), parentComponentDef);
+      } else if (parentComponentDef) {
+        id = parentComponentDef.___nextComponentId();
+      } else {
+        id = globalComponentsContext.___nextComponentId();
+      }
+    }
+
+    if (registry.___isServer && typeName) {
+      if (renderingLogic) delete renderingLogic.onRender;
+      component = registry.___createComponent(
+        renderingLogic,
+        id,
+        input,
+        out,
+        typeName,
+        customEvents,
+        ownerComponentId
+      );
+      if (isSplit || widgetState) {
+        component.input = null;
+      } else if (input.widgetProps) {
+        // eslint-disable-next-line no-constant-condition
+        if ("MARKO_DEBUG") {
+          complain(
+            "Possible performance impact: this widget does not contain state, but is marked as a stateful widget. This will result in additional hydration data serialized.  In order for marko to identify this as a split widget, w-bind should use a widget.js with defineWidget rather than index.js with defineComponent.",
+            { location: typeName, level: 1 }
+          );
+        }
+        component.input = input.widgetProps;
+      }
+    } else {
+      if (!component) {
+        if (isRerender) {
+          // Look in in the DOM to see if a component with the same ID and type already exists.
+          component = componentLookup[id];
+          if (component && component.___type !== typeName) {
+            component = undefined;
+          }
+        }
+
+        if (component) {
+          isExisting = true;
+        } else {
+          isExisting = false;
+          // We need to create a new instance of the component
+          if (typeName) {
+            component = registry.___createComponent(typeName, id);
+          }
+        }
+      }
+    }
+
+    var isFakeComponent = false;
+
+    if (!component) {
+      isFakeComponent = true;
+      component = {
+        id: id,
+        ___keyedElements: {},
+      };
+    } else {
+      component.___updateQueued = true;
+
+      if (widgetState) {
+        component.state = widgetState;
+      }
+    }
+
+    component.widgetConfig = widgetConfig;
+    component.___widgetBody = widgetBody || component.___widgetBody;
+
+    var componentDef = beginComponent(
+      componentsContext,
+      component,
+      key,
+      ownerComponentDef,
+      isSplit,
+      isFakeComponent
+    );
+    componentsContext.___legacyComponentDef = componentDef;
+
+    // This is a hack, but we have to swap out the component instance stored with this node
+    var vComponentNode = out.___parent;
+
+    componentDef.___component = isFakeComponent ? null : component;
+    componentDef.___isExisting = isExisting;
+    componentDef.___isLegacy = true;
+
+    componentDef.t = function (typeName) {
+      if (typeName) {
+        if (registry.___isServer) {
+          var oldComponent = component;
+          if (renderingLogic) delete renderingLogic.onRender;
+          component = registry.___createComponent(
+            renderingLogic || {},
+            id,
+            input,
+            out,
+            typeName,
+            customEvents,
+            ownerComponentId
+          );
+          if (isSplit || widgetState) {
+            component.input = null;
+          } else if (input.widgetProps) {
+            // eslint-disable-next-line no-constant-condition
+            if ("MARKO_DEBUG") {
+              complain(
+                "Possible performance impact: this widget does not contain state, but is marked as a stateful widget. This will result in additional hydration data serialized.  In order for marko to identify this as a split widget, w-bind should use a widget.js with defineWidget rather than index.js with defineComponent.",
+                { location: typeName, level: 1 }
+              );
+            }
+            component.input = input.widgetProps;
+          }
+          Object.assign(component, oldComponent);
+          beginComponent(
+            componentsContext,
+            component,
+            key,
+            ownerComponentDef,
+            isSplit,
+            false,
+            this
+          );
+        } else {
+          vComponentNode.___component = component = registry.___createComponent(
+            typeName,
+            component.id
+          );
+        }
+        this.___component = component;
+      }
+
+      return component;
+    };
+
+    if (!registry.___isServer) {
+      component.___legacyRender && component.___legacyRender();
+    }
+
+    // Render the template associated with the component using the final template
+    // data that we constructed
+    templateRenderFunc(
+      input,
+      out,
+      componentDef,
+      component,
+      component.___rawState,
+      out.global
+    );
+
+    if (customEvents && componentDef.___component) {
+      if (registry.___isServer) {
+        componentDef.___customEvents = customEvents;
+        componentDef.___scope = ownerComponentId;
+      } else {
+        componentDef.___component.___setCustomEvents(
+          customEvents,
+          ownerComponentId
+        );
+      }
+    }
+
+    endComponent(out, componentDef);
+    componentsContext.___componentDef = parentComponentDef;
+    componentsContext.___legacyComponentDef = parentLegacyComponentDef;
+  };
+}
+
+module.exports = createRendererFunc;

package/src/runtime/components/renderer.js

@@ -230,3 +230,7 @@ function createRendererFunc(
 }
 
 module.exports = createRendererFunc;
+
+// exports used by the legacy renderer
+createRendererFunc.___resolveComponentKey = resolveComponentKey;
+createRendererFunc.___trackAsyncComponents = trackAsyncComponents;

package/src/runtime/components/update-manager.js

@@ -54,7 +54,7 @@ function batchUpdate(func) {
   // batched update completes we invoke the "afterUpdate"
   // event listeners.
   var batch = {
-    ___queue: null
+    ___queue: null,
   };
 
   batchStack.push(batch);

package/src/runtime/dom-insert.js

@@ -72,6 +72,6 @@ module.exports = function (target, getEl, afterInsert) {
       var el = getEl(this, referenceEl);
       insertAfter(el, referenceEl, referenceEl.parentNode);
       return afterInsert(this, referenceEl);
-    }
+    },
   });
 };

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

@@ -67,13 +67,11 @@ module.exports = function dynamicTag(
 
       var renderer =
         tag._ ||
-        tag.render ||
-        (tag.renderer && tag.renderer.renderer) ||
-        tag.renderer;
+        (tag.renderer ? tag.renderer.renderer || tag.renderer : tag.render);
 
       // eslint-disable-next-line no-constant-condition
       if ("MARKO_DEBUG") {
-        if (tag.renderer && tag.renderer.renderer === renderer) {
+        if (tag.renderer && tag.renderer.renderer) {
           complain(
             "An object with a 'renderer' was passed to the dynamic tag, but renderer was another template."
           );

package/src/runtime/helpers/style-value.js

@@ -14,11 +14,15 @@ module.exports = function styleHelper(style) {
 
   if (type !== "string") {
     var styles = "";
+    var sep = "";
 
     if (Array.isArray(style)) {
       for (var i = 0, len = style.length; i < len; i++) {
         var next = styleHelper(style[i]);
-        if (next) styles += next + (next[next.length - 1] !== ";" ? ";" : "");
+        if (next) {
+          styles += sep + next;
+          sep = ";";
+        }
       }
     } else if (type === "object") {
       for (var name in style) {
@@ -28,7 +32,8 @@ module.exports = function styleHelper(style) {
             value += "px";
           }
 
-          styles += changeCase.___camelToDashCase(name) + ":" + value + ";";
+          styles += sep + changeCase.___camelToDashCase(name) + ":" + value;
+          sep = ";";
         }
       }
     }