marko 4.25.0 → 4.26.0

package/dist/runtime/components/Component.js

@@ -5,10 +5,10 @@ var complain;
 
 var domInsert = require("../dom-insert");
 var defaultCreateOut = require("../createOut");
-var getComponentsContext = require("./ComponentsContext").u_;
-var componentsUtil = require("./util");
-var componentLookup = componentsUtil.I_;
-var destroyNodeRecursive = componentsUtil.J_;
+var getComponentsContext = require("./ComponentsContext").U_;
+var componentsUtil = require("@internal/components-util");
+var componentLookup = componentsUtil._n_;
+var destroyNodeRecursive = componentsUtil._S_;
 var EventEmitter = require("events-light");
 var RenderResult = require("../RenderResult");
 var SubscriptionTracker = require("listener-tracker");
@@ -17,10 +17,11 @@ var updateManager = require("./update-manager");
 var morphdom = require("../vdom/morphdom");
 var eventDelegation = require("./event-delegation");
 var domData = require("./dom-data");
-var componentsByDOMNode = domData.K_;
-var keyedElementsByComponentId = domData.L_;
+var componentsByDOMNode = domData._q_;
+var keyedElementsByComponentId = domData._p_;
 var CONTEXT_KEY = "__subtree_context__";
 
+var hasOwnProperty = Object.prototype.hasOwnProperty;
 var slice = Array.prototype.slice;
 
 var COMPONENT_SUBSCRIBE_TO_OPTIONS;
@@ -59,7 +60,7 @@ function handleCustomEventWithMethodListener(component, targetMethodName, args,
     args = extraArgs.concat(args);
   }
 
-  var targetComponent = componentLookup[component.M_];
+  var targetComponent = componentLookup[component.Y_];
   var targetMethod = typeof targetMethodName === "function" ? targetMethodName : targetComponent[targetMethodName];
   if (!targetMethod) {
     throw Error("Method not found: " + targetMethodName);
@@ -88,7 +89,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,8 +119,8 @@ function processUpdateHandlers(component, stateChanges, oldState) {
       handlerMethod.call(component, newValue, oldValue);
     });
 
-    component.N_();
-    component.O_();
+    component._y_();
+    component._t_();
   }
 
   return true;
@@ -159,50 +160,50 @@ var componentProto;
 function Component(id) {
   EventEmitter.call(this);
   this.id = id;
-  this.P_ = null;
-  this.Q_ = null;
-  this.R_ = null;
-  this.S_ = null;
-  this.T_ = null; // Used to keep track of bubbling DOM events for components rendered on the server
-  this.U_ = null;
-  this.M_ = null;
-  this.V_ = null;
-  this.W_ = undefined;
-  this.X_ = false;
-  this.Y_ = undefined;
-  this.Z_ = false;
-  this.___ = false;
-  this._a_ = false;
-  this._b_ = false;
-  this._c_ = undefined;
+  this.C_ = null;
+  this._E_ = null;
+  this.ak_ = null;
+  this._w_ = null;
+  this.Z_ = null; // Used to keep track of bubbling DOM events for components rendered on the server
+  this.X_ = null;
+  this.Y_ = null;
+  this.al_ = null;
+  this.R_ = undefined;
+  this._x_ = false;
+  this.am_ = undefined;
+  this.L_ = false;
+  this._c_ = false;
+  this.an_ = false;
+  this.ao_ = false;
+  this.E_ = undefined;
 
   var ssrKeyedElements = keyedElementsByComponentId[id];
 
   if (ssrKeyedElements) {
-    this.q_ = ssrKeyedElements;
+    this.N_ = ssrKeyedElements;
     delete keyedElementsByComponentId[id];
   } else {
-    this.q_ = {};
+    this.N_ = {};
   }
 }
 
 Component.prototype = componentProto = {
-  _d_: true,
+  A_: true,
 
   subscribeTo: function (target) {
     if (!target) {
       throw TypeError();
     }
 
-    var subscriptions = this.R_ || (this.R_ = new SubscriptionTracker());
+    var subscriptions = this.ak_ || (this.ak_ = new SubscriptionTracker());
 
-    var subscribeToOptions = target._d_ ? COMPONENT_SUBSCRIBE_TO_OPTIONS : NON_COMPONENT_SUBSCRIBE_TO_OPTIONS;
+    var subscribeToOptions = target.A_ ? COMPONENT_SUBSCRIBE_TO_OPTIONS : NON_COMPONENT_SUBSCRIBE_TO_OPTIONS;
 
     return subscriptions.subscribeTo(target, subscribeToOptions);
   },
 
   emit: function (eventType) {
-    var customEvents = this.U_;
+    var customEvents = this.X_;
     var target;
 
     if (customEvents && (target = customEvents[eventType])) {
@@ -229,10 +230,10 @@ Component.prototype = componentProto = {
   getEl: function (key, index) {
     if (key) {
       var resolvedKey = resolveKeyHelper(key, index);
-      var keyedElement = this.q_["@" + resolvedKey];
+      var keyedElement = this.N_["@" + resolvedKey];
 
       if (!keyedElement) {
-        var keyedComponentRoot = this.q_[resolvedKey];
+        var keyedComponentRoot = this.N_[resolvedKey];
 
         if (keyedComponentRoot) {
 
@@ -260,7 +261,7 @@ Component.prototype = componentProto = {
     return els;
   },
   getComponent: function (key, index) {
-    var rootNode = this.q_[resolveKeyHelper(key, index)];
+    var rootNode = this.N_[resolveKeyHelper(key, index)];
     if (/\[\]$/.test(key)) {
       rootNode = rootNode && rootNode[Object.keys(rootNode)[0]];
       // eslint-disable-next-line no-constant-condition
@@ -268,26 +269,26 @@ Component.prototype = componentProto = {
     return rootNode && componentsByDOMNode.get(rootNode);
   },
   getComponents: function (key) {
-    var lookup = this.q_[key + "[]"];
+    var lookup = this.N_[key + "[]"];
     return lookup ? Object.keys(lookup).map(function (key) {
       return componentsByDOMNode.get(lookup[key]);
     }).filter(Boolean) : [];
   },
   destroy: function () {
-    if (this.Z_) {
+    if (this.L_) {
       return;
     }
 
-    var root = this.Q_;
+    var root = this._E_;
 
-    this._e_();
+    this._O_();
 
     var nodes = root.nodes;
 
     nodes.forEach(function (node) {
       destroyNodeRecursive(node);
 
-      if (eventDelegation._f_(node) !== false) {
+      if (eventDelegation.ap_(node) !== false) {
         node.parentNode.removeChild(node);
       }
     });
@@ -295,129 +296,129 @@ Component.prototype = componentProto = {
     root.detached = true;
 
     delete componentLookup[this.id];
-    this.q_ = {};
+    this.N_ = {};
   },
 
-  _e_: function () {
-    if (this.Z_) {
+  _O_: function () {
+    if (this.L_) {
       return;
     }
 
-    this._g_();
-    this.Z_ = true;
+    this.aq_();
+    this.L_ = true;
 
-    componentsByDOMNode.set(this.Q_, undefined);
+    componentsByDOMNode.set(this._E_, undefined);
 
-    this.Q_ = null;
+    this._E_ = null;
 
     // Unsubscribe from all DOM events
-    this._h_();
+    this._v_();
 
-    var subscriptions = this.R_;
+    var subscriptions = this.ak_;
     if (subscriptions) {
       subscriptions.removeAllListeners();
-      this.R_ = null;
+      this.ak_ = null;
     }
   },
 
   isDestroyed: function () {
-    return this.Z_;
+    return this.L_;
   },
   get state() {
-    return this.P_;
+    return this.C_;
   },
   set state(newState) {
-    var state = this.P_;
+    var state = this.C_;
     if (!state && !newState) {
       return;
     }
 
     if (!state) {
-      state = this.P_ = new this._i_(this);
+      state = this.C_ = new this.S_(this);
     }
 
-    state._j_(newState || {});
+    state.ar_(newState || {});
 
-    if (state._a_) {
-      this._k_();
+    if (state.an_) {
+      this.as_();
     }
 
     if (!newState) {
-      this.P_ = null;
+      this.C_ = null;
     }
   },
   setState: function (name, value) {
-    var state = this.P_;
+    var state = this.C_;
 
     if (!state) {
-      state = this.P_ = new this._i_(this);
+      state = this.C_ = new this.S_(this);
     }
     if (typeof name == "object") {
       // Merge in the new state with the old state
       var newState = name;
       for (var k in newState) {
-        if (newState.hasOwnProperty(k)) {
-          state._l_(k, newState[k], true /* ensure:true */);
+        if (hasOwnProperty.call(newState, k)) {
+          state.at_(k, newState[k], true /* ensure:true */);
         }
       }
     } else {
-      state._l_(name, value, true /* ensure:true */);
+      state.at_(name, value, true /* ensure:true */);
     }
   },
 
   setStateDirty: function (name, value) {
-    var state = this.P_;
+    var state = this.C_;
 
     if (arguments.length == 1) {
       value = state[name];
     }
 
-    state._l_(name, value, true /* ensure:true */
+    state.at_(name, value, true /* ensure:true */
     , true /* forceDirty:true */
     );
   },
 
   replaceState: function (newState) {
-    this.P_._j_(newState);
+    this.C_.ar_(newState);
   },
 
   get input() {
-    return this.W_;
+    return this.R_;
   },
   set input(newInput) {
-    if (this._b_) {
-      this.W_ = newInput;
+    if (this.ao_) {
+      this.R_ = newInput;
     } else {
-      this._m_(newInput);
+      this._l_(newInput);
     }
   },
 
-  _m_: function (newInput, onInput, out) {
+  _l_: function (newInput, onInput, out) {
     onInput = onInput || this.onInput;
     var updatedInput;
 
-    var oldInput = this.W_;
-    this.W_ = undefined;
-    this._n_ = out && out[CONTEXT_KEY] || this._n_;
+    var oldInput = this.R_;
+    this.R_ = undefined;
+    this.au_ = out && out[CONTEXT_KEY] || this.au_;
 
     if (onInput) {
       // We need to set a flag to preview `this.input = foo` inside
       // onInput causing infinite recursion
-      this._b_ = true;
+      this.ao_ = true;
       updatedInput = onInput.call(this, newInput || {}, out);
-      this._b_ = false;
+      this.ao_ = false;
     }
 
-    newInput = this.V_ = updatedInput || newInput;
+    newInput = this.al_ = updatedInput || newInput;
 
-    if (this._a_ = checkInputChanged(this, oldInput, newInput)) {
-      this._k_();
+    if (this.an_ = checkInputChanged(this, oldInput, newInput)) {
+      this.as_();
     }
 
-    if (this.W_ === undefined) {
-      this.W_ = newInput;
+    if (this.R_ === undefined) {
+      this.R_ = newInput;
       if (newInput && newInput.$global) {
-        this.Y_ = newInput.$global;
+        this.am_ = newInput.$global;
       }
     }
 
@@ -425,54 +426,54 @@ Component.prototype = componentProto = {
   },
 
   forceUpdate: function () {
-    this._a_ = true;
-    this._k_();
+    this.an_ = true;
+    this.as_();
   },
 
-  _k_: function () {
-    if (!this.___) {
-      this.___ = true;
-      updateManager._o_(this);
+  as_: function () {
+    if (!this._c_) {
+      this._c_ = true;
+      updateManager.av_(this);
     }
   },
 
   update: function () {
-    if (this.Z_ === true || this._p_ === false) {
+    if (this.L_ === true || this.aw_ === false) {
       return;
     }
 
-    var input = this.W_;
-    var state = this.P_;
+    var input = this.R_;
+    var state = this.C_;
 
-    if (this._a_ === false && state !== null && state._a_ === true) {
-      if (processUpdateHandlers(this, state._q_, state._r_, state)) {
-        state._a_ = false;
+    if (this.an_ === false && state !== null && state.an_ === true) {
+      if (processUpdateHandlers(this, state.ax_, state.ay_, state)) {
+        state.an_ = false;
       }
     }
 
-    if (this._p_ === true) {
+    if (this.aw_ === true) {
       // The UI component is still dirty after process state handlers
       // then we should rerender
 
       if (this.shouldUpdate(input, state) !== false) {
-        this._s_();
+        this.az_();
       }
     }
 
-    this.O_();
+    this._t_();
   },
 
-  get _p_() {
-    return this._a_ === true || this.P_ !== null && this.P_._a_ === true;
+  get aw_() {
+    return this.an_ === true || this.C_ !== null && this.C_.an_ === true;
   },
 
-  O_: function () {
-    this._a_ = false;
-    this.___ = false;
-    this.V_ = null;
-    var state = this.P_;
+  _t_: function () {
+    this.an_ = false;
+    this._c_ = false;
+    this.al_ = null;
+    var state = this.C_;
     if (state) {
-      state.O_();
+      state._t_();
     }
   },
 
@@ -480,72 +481,72 @@ Component.prototype = componentProto = {
     return true;
   },
 
-  _s_: function () {
+  az_: function () {
     var self = this;
-    var renderer = self._t_;
+    var renderer = self.T_;
 
     if (!renderer) {
       throw TypeError();
     }
 
-    var input = this.V_ || this.W_;
+    var input = this.al_ || this.R_;
 
-    updateManager._u_(function () {
-      self._v_(input, false).afterInsert(self._c_);
+    updateManager.aA_(function () {
+      self._F_(input, false).afterInsert(self.E_);
     });
 
-    this.O_();
+    this._t_();
   },
 
-  _v_: function (input, isHydrate) {
-    var doc = this._c_;
-    var globalData = this.Y_;
-    var rootNode = this.Q_;
-    var renderer = this._t_;
+  _F_: function (input, isHydrate) {
+    var host = this.E_;
+    var globalData = this.am_;
+    var rootNode = this._E_;
+    var renderer = this.T_;
     var createOut = renderer.createOut || defaultCreateOut;
     var out = createOut(globalData);
     out.sync();
-    out._c_ = this._c_;
-    out[CONTEXT_KEY] = this._n_;
+    out.E_ = this.E_;
+    out[CONTEXT_KEY] = this.au_;
 
     var componentsContext = getComponentsContext(out);
-    var globalComponentsContext = componentsContext.k_;
-    globalComponentsContext._w_ = this;
-    globalComponentsContext.l_ = isHydrate;
+    var globalComponentsContext = componentsContext.r_;
+    globalComponentsContext.aB_ = this;
+    globalComponentsContext.a__ = isHydrate;
 
     renderer(input, out);
 
     var result = new RenderResult(out);
 
-    var targetNode = out.H_().a_;
+    var targetNode = out.aj_().a_;
 
-    morphdom(rootNode, targetNode, doc, componentsContext);
+    morphdom(rootNode, targetNode, host, componentsContext);
 
     return result;
   },
 
-  _x_: function () {
-    var root = this.Q_;
+  aC_: function () {
+    var root = this._E_;
     root.remove();
     return root;
   },
 
-  _h_: function () {
-    var eventListenerHandles = this.S_;
+  _v_: function () {
+    var eventListenerHandles = this._w_;
     if (eventListenerHandles) {
       eventListenerHandles.forEach(removeListener);
-      this.S_ = null;
+      this._w_ = null;
     }
   },
 
-  get _y_() {
-    var state = this.P_;
-    return state && state._z_;
+  get aD_() {
+    var state = this.C_;
+    return state && state.D_;
   },
 
-  _A_: function (customEvents, scope) {
-    var finalCustomEvents = this.U_ = {};
-    this.M_ = scope;
+  aE_: function (customEvents, scope) {
+    var finalCustomEvents = this.X_ = {};
+    this.Y_ = scope;
 
     customEvents.forEach(function (customEvent) {
       var eventType = customEvent[0];
@@ -553,51 +554,53 @@ Component.prototype = componentProto = {
       var isOnce = customEvent[2];
       var extraArgs = customEvent[3];
 
-      finalCustomEvents[eventType] = [targetMethodName, isOnce, extraArgs];
+      if (targetMethodName) {
+        finalCustomEvents[eventType] = [targetMethodName, isOnce, extraArgs];
+      }
     });
   },
 
   get el() {
-    return walkFragments(this.Q_);
+    return walkFragments(this._E_);
   },
 
   get els() {
-    return (this.Q_ ? this.Q_.nodes : []).filter(function (el) {
+    return (this._E_ ? this._E_.nodes : []).filter(function (el) {
       return el.nodeType === ELEMENT_NODE;
     });
     // eslint-disable-next-line no-constant-condition
   },
 
-  _B_: emit,
-  _C_(input, out) {
+  aF_: emit,
+  aG_(input, out) {
     this.onCreate && this.onCreate(input, out);
-    this._B_("create", input, out);
+    this.aF_("create", input, out);
   },
 
-  _D_(out) {
+  aH_(out) {
     this.onRender && this.onRender(out);
-    this._B_("render", out);
+    this.aF_("render", out);
   },
 
-  N_() {
+  _y_() {
     this.onUpdate && this.onUpdate();
-    this._B_("update");
+    this.aF_("update");
   },
 
-  _E_() {
+  _z_() {
     this.onMount && this.onMount();
-    this._B_("mount");
+    this.aF_("mount");
   },
 
-  _g_() {
+  aq_() {
     this.onDestroy && this.onDestroy();
-    this._B_("destroy");
+    this.aF_("destroy");
   }
 };
 
 componentProto.elId = componentProto.getElId;
-componentProto._F_ = componentProto.update;
-componentProto._G_ = componentProto.destroy;
+componentProto.aI_ = componentProto.update;
+componentProto.aJ_ = componentProto.destroy;
 
 // Add all of the following DOM methods to Component.prototype:
 // - appendTo(referenceEl)
@@ -607,7 +610,7 @@ componentProto._G_ = componentProto.destroy;
 // - insertAfter(referenceEl)
 // - prependTo(referenceEl)
 domInsert(componentProto, function getEl(component) {
-  return component._x_();
+  return component.aC_();
 }, function afterInsert(component) {
   return component;
 });