marko 5.37.6 → 6.0.0-3.12

package/src/runtime/components/ComponentDef.js

@@ -1,169 +0,0 @@
-"use strict";
-// eslint-disable-next-line no-constant-binary-expression
-var complain = "MARKO_DEBUG" && require("complain");
-var extend = require("raptor-util/extend");
-var componentUtil = require("@internal/components-util");
-var w10NOOP = require("../helpers/serialize-noop").___noop;
-var attachBubblingEvent = componentUtil.___attachBubblingEvent;
-var addDelegatedEventHandler =
-  require("./event-delegation").___addDelegatedEventHandler;
-var KeySequence = require("./KeySequence");
-var EMPTY_OBJECT = {};
-
-var FLAG_WILL_RERENDER_IN_BROWSER = 1;
-var FLAG_HAS_RENDER_BODY = 2;
-var FLAG_IS_LEGACY = 4;
-var FLAG_OLD_HYDRATE_NO_CREATE = 8;
-
-/**
- * A ComponentDef is used to hold the metadata collected at runtime for
- * a single component and this information is used to instantiate the component
- * later (after the rendered HTML has been added to the DOM)
- */
-function ComponentDef(component, componentId, componentsContext) {
-  this.___componentsContext = componentsContext; // The AsyncWriter that this component is associated with
-  this.___component = component;
-  this.id = componentId;
-
-  this.___domEvents = undefined; // An array of DOM events that need to be added (in sets of three)
-
-  this.___isExisting = false;
-
-  this.___renderBoundary = false;
-  this.___flags = 0;
-
-  this.___nextIdIndex = 0; // The unique integer to use for the next scoped ID
-  this.___keySequence = null;
-}
-
-ComponentDef.prototype = {
-  ___nextKey: function (key) {
-    return (
-      this.___keySequence || (this.___keySequence = new KeySequence())
-    ).___nextKey(key);
-  },
-
-  /**
-   * 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) {
-    var id = this.id;
-
-    if (nestedId == null) {
-      return id;
-    } else {
-      if (typeof nestedId !== "string") {
-        // eslint-disable-next-line no-constant-condition
-        if ("MARKO_DEBUG") {
-          complain("Using non strings as keys is deprecated.");
-        }
-
-        nestedId = String(nestedId);
-      }
-
-      if (nestedId.indexOf("#") === 0) {
-        id = "#" + id;
-        nestedId = nestedId.substring(1);
-      }
-
-      return id + "-" + nestedId;
-    }
-  },
-  /**
-   * Returns the next auto generated unique ID for a nested DOM element or nested DOM component
-   */
-  ___nextComponentId: function () {
-    return this.id + "-c" + this.___nextIdIndex++;
-  },
-
-  d: function (eventName, handlerMethodName, isOnce, extraArgs) {
-    addDelegatedEventHandler(eventName);
-    return attachBubblingEvent(this, handlerMethodName, isOnce, extraArgs);
-  },
-
-  get ___type() {
-    return this.___component.___type;
-  },
-};
-
-ComponentDef.prototype.nk = ComponentDef.prototype.___nextKey;
-
-ComponentDef.___deserialize = function (o, types, global, registry) {
-  var id = o[0];
-  var typeName = types[o[1]];
-  var input = o[2] || null;
-  var extra = o[3] || EMPTY_OBJECT;
-
-  var state = extra.s;
-  var componentProps = extra.w || EMPTY_OBJECT;
-  var flags = extra.f;
-  var isLegacy = flags & FLAG_IS_LEGACY;
-  var renderBody = flags & FLAG_HAS_RENDER_BODY ? w10NOOP : extra.r;
-
-  var component =
-    typeName /* legacy */ &&
-    registry.___createComponent(typeName, id, isLegacy);
-
-  // Prevent newly created component from being queued for update since we area
-  // just building it from the server info
-  component.___updateQueued = true;
-  component.___global = global;
-
-  if (isLegacy) {
-    component.widgetConfig = componentProps;
-    component.___widgetBody = renderBody;
-  } else if (renderBody) {
-    (input || (input = {})).renderBody = renderBody;
-  }
-
-  if (
-    !isLegacy &&
-    flags & FLAG_WILL_RERENDER_IN_BROWSER &&
-    !(flags & FLAG_OLD_HYDRATE_NO_CREATE)
-  ) {
-    if (component.onCreate) {
-      component.onCreate(input, { global: global });
-    }
-    if (component.onInput) {
-      input = component.onInput(input, { global: global }) || input;
-    }
-  } else {
-    if (state) {
-      var undefinedPropNames = extra.u;
-      if (undefinedPropNames) {
-        undefinedPropNames.forEach(function (undefinedPropName) {
-          state[undefinedPropName] = undefined;
-        });
-      }
-      // We go through the setter here so that we convert the state object
-      // to an instance of `State`
-      component.state = state;
-    }
-
-    if (!isLegacy && componentProps) {
-      extend(component, componentProps);
-    }
-  }
-
-  component.___input = input;
-
-  if (extra.b) {
-    component.___bubblingDomEvents = extra.b;
-  }
-
-  var scope = extra.p;
-  var customEvents = extra.e;
-  if (customEvents) {
-    component.___setCustomEvents(customEvents, scope);
-  }
-
-  return {
-    id: id,
-    ___component: component,
-    ___domEvents: extra.d,
-    ___flags: extra.f || 0,
-  };
-};
-
-module.exports = ComponentDef;

package/src/runtime/components/ComponentsContext.js

@@ -1,59 +0,0 @@
-"use strict";
-var GlobalComponentsContext = require("./GlobalComponentsContext");
-
-function ComponentsContext(out, parentComponentsContext) {
-  var globalComponentsContext;
-  var componentDef;
-
-  if (parentComponentsContext) {
-    globalComponentsContext = parentComponentsContext.___globalContext;
-    componentDef = parentComponentsContext.___componentDef;
-
-    var nestedContextsForParent;
-    if (
-      !(nestedContextsForParent = parentComponentsContext.___nestedContexts)
-    ) {
-      nestedContextsForParent = parentComponentsContext.___nestedContexts = [];
-    }
-
-    nestedContextsForParent.push(this);
-  } else {
-    globalComponentsContext = out.global.___components;
-    if (globalComponentsContext === undefined) {
-      out.global.___components = globalComponentsContext =
-        new GlobalComponentsContext(out);
-    }
-  }
-
-  this.___globalContext = globalComponentsContext;
-  this.___components = [];
-  this.___out = out;
-  this.___componentDef = componentDef;
-  this.___nestedContexts = undefined;
-  this.___isPreserved =
-    parentComponentsContext && parentComponentsContext.___isPreserved;
-}
-
-ComponentsContext.prototype = {
-  ___initComponents: function (host) {
-    var componentDefs = this.___components;
-
-    ComponentsContext.___initClientRendered(componentDefs, host);
-
-    this.___out.emit("___componentsInitialized");
-
-    // Reset things stored in global since global is retained for
-    // future renders
-    this.___out.global.___components = undefined;
-
-    return componentDefs;
-  },
-};
-
-function getComponentsContext(out) {
-  return out.___components || (out.___components = new ComponentsContext(out));
-}
-
-module.exports = exports = ComponentsContext;
-
-exports.___getComponentsContext = getComponentsContext;

package/src/runtime/components/GlobalComponentsContext.js

@@ -1,10 +0,0 @@
-var nextComponentIdProvider =
-  require("@internal/components-util").___nextComponentIdProvider;
-
-function GlobalComponentsContext(out) {
-  this.___renderedComponentsById = {};
-  this.___rerenderComponent = undefined;
-  this.___nextComponentId = nextComponentIdProvider(out);
-}
-
-module.exports = GlobalComponentsContext;

package/src/runtime/components/KeySequence.js

@@ -1,16 +0,0 @@
-function KeySequence() {
-  this.___lookup = Object.create(null);
-}
-
-KeySequence.prototype.___nextKey = function (key) {
-  var lookup = this.___lookup;
-
-  if (lookup[key]) {
-    return key + "_" + lookup[key]++;
-  }
-
-  lookup[key] = 1;
-  return key;
-};
-
-module.exports = KeySequence;

package/src/runtime/components/ServerComponent.js

@@ -1,73 +0,0 @@
-"use strict";
-// eslint-disable-next-line no-constant-binary-expression
-var complain = "MARKO_DEBUG" && require("complain");
-
-class ServerComponent {
-  constructor(id, input, out, typeName, customEvents, scope) {
-    this.id = id;
-    this.___customEvents = customEvents;
-    this.___scope = scope;
-    this.typeName = typeName;
-    this.___bubblingDomEvents = undefined; // Used to keep track of bubbling DOM events for components rendered on the server
-    this.___bubblingDomEventsExtraArgsCount = 0;
-
-    this.onCreate(input, out);
-    this.___updatedInput = this.onInput(input, out) || input;
-    if (this.___input === undefined) {
-      this.___input = this.___updatedInput;
-    }
-    this.onRender(out);
-  }
-
-  set input(newInput) {
-    this.___input = newInput;
-  }
-
-  get input() {
-    return this.___input;
-  }
-
-  set state(newState) {
-    this.___state = newState;
-  }
-
-  get state() {
-    return this.___state;
-  }
-
-  get ___rawState() {
-    return this.___state;
-  }
-
-  elId(nestedId) {
-    var id = this.id;
-
-    if (nestedId == null) {
-      return id;
-    } else {
-      if (typeof nestedId !== "string") {
-        // eslint-disable-next-line no-constant-condition
-        if ("MARKO_DEBUG") {
-          complain("Using non strings as keys is deprecated.");
-        }
-
-        nestedId = String(nestedId);
-      }
-
-      if (nestedId.indexOf("#") === 0) {
-        id = "#" + id;
-        nestedId = nestedId.substring(1);
-      }
-
-      return id + "-" + nestedId;
-    }
-  }
-
-  onCreate() {}
-  onInput() {}
-  onRender() {}
-}
-
-ServerComponent.prototype.getElId = ServerComponent.prototype.elId;
-
-module.exports = ServerComponent;

package/src/runtime/components/State.js

@@ -1,101 +0,0 @@
-var extend = require("raptor-util/extend");
-
-function ensure(state, propertyName) {
-  var proto = state.constructor.prototype;
-  if (!(propertyName in proto)) {
-    Object.defineProperty(proto, propertyName, {
-      get: function () {
-        return this.___raw[propertyName];
-      },
-      set: function (value) {
-        this.___set(propertyName, value, false /* ensure:false */);
-      },
-    });
-  }
-}
-
-function State(component) {
-  this.___component = component;
-  this.___raw = {};
-
-  this.___dirty = false;
-  this.___old = null;
-  this.___changes = null;
-  this.___forced = null; // An object that we use to keep tracking of state properties that were forced to be dirty
-
-  Object.seal(this);
-}
-
-State.prototype = {
-  ___reset: function () {
-    this.___dirty = false;
-    this.___old = null;
-    this.___changes = null;
-    this.___forced = null;
-  },
-
-  ___replace: function (newState) {
-    var key;
-    var rawState = this.___raw;
-
-    for (key in rawState) {
-      if (!(key in newState)) {
-        this.___set(
-          key,
-          undefined,
-          false /* ensure:false */,
-          false /* forceDirty:false */,
-        );
-      }
-    }
-
-    for (key in newState) {
-      this.___set(
-        key,
-        newState[key],
-        true /* ensure:true */,
-        false /* forceDirty:false */,
-      );
-    }
-  },
-  ___set: function (name, value, shouldEnsure, forceDirty) {
-    var rawState = this.___raw;
-
-    if (shouldEnsure) {
-      ensure(this, name);
-    }
-
-    if (forceDirty) {
-      var forcedDirtyState = this.___forced || (this.___forced = {});
-      forcedDirtyState[name] = true;
-    } else if (rawState[name] === value) {
-      return;
-    }
-
-    if (!this.___dirty) {
-      // This is the first time we are modifying the component state
-      // so introduce some properties to do some tracking of
-      // changes to the state
-      this.___dirty = true; // Mark the component state as dirty (i.e. modified)
-      this.___old = rawState;
-      this.___raw = rawState = extend({}, rawState);
-      this.___changes = {};
-      this.___component.___queueUpdate();
-    }
-
-    this.___changes[name] = value;
-
-    if (value === undefined) {
-      // Don't store state properties with an undefined or null value
-      delete rawState[name];
-    } else {
-      // Otherwise, store the new value in the component state
-      rawState[name] = value;
-    }
-  },
-  toJSON: function () {
-    return this.___raw;
-  },
-};
-
-module.exports = State;

package/src/runtime/components/attach-detach.js

@@ -1,60 +0,0 @@
-var eventDelegation = require("./event-delegation");
-var delegateEvent = eventDelegation.___delegateEvent;
-var getEventFromEl = eventDelegation.___getEventFromEl;
-
-// var componentsUtil = require('@internal/components-util');
-// var destroyNodeRecursive = componentsUtil.___destroyNodeRecursive;
-// var destroyComponentForNode = componentsUtil.___destroyComponentForNode;
-
-function handleNodeAttach(node, componentsContext) {
-  if (node.nodeType === 1) {
-    var eventName = "onattach";
-    var target = getEventFromEl(node, eventName);
-    if (target) {
-      var out = componentsContext.___out;
-      var data = out.data;
-
-      var attachTargets = data.___attachTargets;
-      if (!attachTargets) {
-        attachTargets = data.___attachTargets = [];
-        out.on("___componentsInitialized", function () {
-          for (var i = 0; i < attachTargets.length; i += 2) {
-            var node = attachTargets[i];
-            var target = attachTargets[i + 1];
-            delegateEvent(node, eventName, target, {});
-          }
-        });
-      }
-
-      attachTargets.push(node);
-      attachTargets.push(target);
-    }
-  }
-}
-
-function handleNodeDetach(node) {
-  if (node.nodeType === 1) {
-    var eventName = "ondetach";
-    var target = getEventFromEl(node, eventName);
-    if (target) {
-      var allowDetach;
-
-      delegateEvent(node, eventName, target, {
-        preventDefault: function () {
-          allowDetach = false;
-        },
-        detach: function () {
-          var parentNode = node.parentNode;
-          if (parentNode) {
-            parentNode.removeChild(node);
-          }
-        },
-      });
-
-      return allowDetach;
-    }
-  }
-}
-
-eventDelegation.___handleNodeAttach = handleNodeAttach;
-eventDelegation.___handleNodeDetach = handleNodeDetach;

package/src/runtime/components/defineComponent.js

@@ -1,60 +0,0 @@
-"use strict";
-
-var inherit = require("raptor-util/inherit");
-var BaseComponent = require("./Component");
-var BaseState = require("./State");
-
-module.exports = function defineComponent(def, renderer) {
-  if (def.___isComponent) {
-    return def;
-  }
-
-  var ComponentClass = function () {};
-  var proto;
-
-  var type = typeof def;
-
-  if (type == "function") {
-    proto = def.prototype;
-  } else if (type == "object") {
-    proto = def;
-  } else {
-    throw TypeError();
-  }
-
-  ComponentClass.prototype = proto;
-
-  // We don't use the constructor provided by the user
-  // since we don't invoke their constructor until
-  // we have had a chance to do our own initialization.
-  // Instead, we store their constructor in the "initComponent"
-  // property and that method gets called later inside
-  // init-components-browser.js
-  function Component(id) {
-    BaseComponent.call(this, id);
-  }
-
-  if (!proto.___isComponent) {
-    // Inherit from Component if they didn't already
-    inherit(ComponentClass, BaseComponent);
-  }
-
-  // The same prototype will be used by our constructor after
-  // we he have set up the prototype chain using the inherit function
-  proto = Component.prototype = ComponentClass.prototype;
-
-  // proto.constructor = def.constructor = Component;
-
-  // Set a flag on the constructor function to make it clear this is
-  // a component so that we can short-circuit this work later
-  Component.___isComponent = true;
-
-  function State(component) {
-    BaseState.call(this, component);
-  }
-  inherit(State, BaseState);
-  proto.___State = State;
-  proto.___renderer = renderer;
-
-  return Component;
-};

package/src/runtime/components/dom-data.js

@@ -1,8 +0,0 @@
-module.exports = {
-  ___vPropsByDOMNode: new WeakMap(),
-  ___vElementByDOMNode: new WeakMap(),
-  ___componentByDOMNode: new WeakMap(),
-  ___detachedByDOMNode: new WeakMap(),
-  ___keyByDOMNode: new WeakMap(),
-  ___ssrKeyedElementsByComponentId: {},
-};

package/src/runtime/components/event-delegation.js

@@ -1,144 +0,0 @@
-var componentsUtil = require("@internal/components-util");
-var runtimeId = componentsUtil.___runtimeId;
-var componentLookup = componentsUtil.___componentLookup;
-var getMarkoPropsFromEl = componentsUtil.___getMarkoPropsFromEl;
-
-var TEXT_NODE = 3;
-
-// We make our best effort to allow multiple marko runtimes to be loaded in the
-// same window. Each marko runtime will get its own unique runtime ID.
-var listenersAttachedKey = "$MDE" + runtimeId;
-var delegatedEvents = {};
-
-function getEventFromEl(el, eventName) {
-  var virtualProps = getMarkoPropsFromEl(el);
-  var eventInfo = virtualProps[eventName];
-
-  if (typeof eventInfo === "string") {
-    eventInfo = eventInfo.split(" ");
-    if (eventInfo[2]) {
-      eventInfo[2] = eventInfo[2] === "true";
-    }
-    if (eventInfo.length == 4) {
-      eventInfo[3] = parseInt(eventInfo[3], 10);
-    }
-  }
-
-  return eventInfo;
-}
-
-function delegateEvent(node, eventName, target, event) {
-  var targetMethod = target[0];
-  var targetComponentId = target[1];
-  var isOnce = target[2];
-  var extraArgs = target[3];
-
-  if (isOnce) {
-    var virtualProps = getMarkoPropsFromEl(node);
-    delete virtualProps[eventName];
-  }
-
-  var targetComponent = componentLookup[targetComponentId];
-
-  if (!targetComponent) {
-    return;
-  }
-
-  var targetFunc =
-    typeof targetMethod === "function"
-      ? targetMethod
-      : targetComponent[targetMethod];
-  if (!targetFunc) {
-    throw Error("Method not found: " + targetMethod);
-  }
-
-  if (extraArgs != null) {
-    if (typeof extraArgs === "number") {
-      extraArgs = targetComponent.___bubblingDomEvents[extraArgs];
-    }
-  }
-
-  // Invoke the component method
-  if (extraArgs) {
-    targetFunc.apply(targetComponent, extraArgs.concat(event, node));
-  } else {
-    targetFunc.call(targetComponent, event, node);
-  }
-}
-
-function addDelegatedEventHandler(eventType) {
-  if (!delegatedEvents[eventType]) {
-    delegatedEvents[eventType] = true;
-  }
-}
-
-function addDelegatedEventHandlerToHost(eventType, host) {
-  var listeners = (host[listenersAttachedKey] =
-    host[listenersAttachedKey] || {});
-  if (!listeners[eventType]) {
-    (host.body || host).addEventListener(
-      eventType,
-      (listeners[eventType] = function (event) {
-        var curNode = event.target;
-        if (!curNode) {
-          return;
-        }
-
-        curNode =
-          // event.target of an SVGElementInstance does not have a
-          // `getAttribute` function in IE 11.
-          // See https://github.com/marko-js/marko/issues/796
-          curNode.correspondingUseElement ||
-          // in some browsers the event target can be a text node
-          // one example being dragenter in firefox.
-          (curNode.nodeType === TEXT_NODE ? curNode.parentNode : curNode);
-
-        // Search up the tree looking DOM events mapped to target
-        // component methods
-        var propName = "on" + eventType;
-        var target;
-
-        // Attributes will have the following form:
-        // on<event_type>("<target_method>|<component_id>")
-
-        if (event.bubbles) {
-          var propagationStopped = false;
-
-          // Monkey-patch to fix #97
-          var oldStopPropagation = event.stopPropagation;
-
-          event.stopPropagation = function () {
-            oldStopPropagation.call(event);
-            propagationStopped = true;
-          };
-
-          do {
-            if ((target = getEventFromEl(curNode, propName))) {
-              delegateEvent(curNode, propName, target, event);
-
-              if (propagationStopped) {
-                break;
-              }
-            }
-          } while ((curNode = curNode.parentNode) && curNode.getAttribute);
-        } else if ((target = getEventFromEl(curNode, propName))) {
-          delegateEvent(curNode, propName, target, event);
-        }
-      }),
-      true,
-    );
-  }
-}
-
-function noop() {}
-
-exports.___handleNodeAttach = noop;
-exports.___handleNodeDetach = noop;
-exports.___delegateEvent = delegateEvent;
-exports.___getEventFromEl = getEventFromEl;
-exports.___addDelegatedEventHandler = addDelegatedEventHandler;
-exports.___init = function (host) {
-  Object.keys(delegatedEvents).forEach(function (eventType) {
-    addDelegatedEventHandlerToHost(eventType, host);
-  });
-};