native-document 1.0.72 → 1.0.75

package/src/core/wrappers/ElementCreator.js

@@ -2,7 +2,8 @@ import Anchor from "../elements/anchor";
 import Validator from "../utils/validator";
 import AttributesWrapper from "./AttributesWrapper";
 import PluginsManager from "../utils/plugins-manager";
-import './prototype-extensions';
+import './prototypes/nd-element-extensions';
+import './prototypes/attributes-extensions';
 
 const $nodeCache = new Map();
 let $textNodeCache = null;
@@ -75,20 +76,10 @@ export const ElementCreator = {
     processChildren(children, parent) {
         if(children === null) return;
         PluginsManager.emit('BeforeProcessChildren', parent);
-        if(!Array.isArray(children)) {
-            let child = this.getChild(children);
-            if(child) {
-                parent.appendChild(child);
-            }
-        }
-        else {
-            for(let i = 0, length = children.length; i < length; i++) {
-                let child = this.getChild(children[i]);
-                if (child === null) continue;
-                parent.appendChild(child);
-            }
+        let child = this.getChild(children);
+        if(child) {
+            parent.appendChild(child);
         }
-
         PluginsManager.emit('AfterProcessChildren', parent);
     },
     getChild(child) {

package/src/core/wrappers/NDElement.js

@@ -101,8 +101,8 @@ NDElement.prototype.closedShadow = function(style = null) {
     return this.shadow('closed', style);
 };
 
-NDElement.prototype.attach = function(bindingHydrator) {
-    bindingHydrator.$hydrate(this.$element);
+NDElement.prototype.attach = function(methodName, bindingHydrator) {
+    bindingHydrator.$hydrate(this.$element, methodName);
     return this.$element;
 };
 

package/src/core/wrappers/TemplateCloner.js

@@ -9,7 +9,7 @@ const cloneBindingsDataCache = new WeakMap();
 const bindAttributes = (node, bindDingData, data) => {
     let attributes = null;
     if(bindDingData.attributes) {
-        attributes = attributes || {};
+        attributes = {};
         for (const attr in bindDingData.attributes) {
             attributes[attr] = bindDingData.attributes[attr](...data);
         }
@@ -39,29 +39,29 @@ const bindAttributes = (node, bindDingData, data) => {
     return null;
 };
 
-const $hydrateFn = function(hydrateFunction, target, element, property) {
+const $hydrateFn = function(hydrateFunction, targetType, element, property) {
     if(!cloneBindingsDataCache.has(element)) {
         // { classes, styles, attributes, value, attach }
         cloneBindingsDataCache.set(element, {});
     }
     const hydrationState = cloneBindingsDataCache.get(element);
-    if(target === 'value') {
+    if(targetType === 'value') {
         hydrationState.value = hydrateFunction;
         return;
     }
-    if(target === 'attach') {
-        hydrationState.attach = hydrateFunction;
-        return;
-    }
-    hydrationState[target] = hydrationState[target] || {};
-    hydrationState[target][property] = hydrateFunction;
+    hydrationState[targetType] = hydrationState[targetType] || {};
+    hydrationState[targetType][property] = hydrateFunction;
 }
 
 const bindAttachMethods = function(node, bindDingData, data) {
     if(!bindDingData.attach) {
         return null;
     }
-    bindDingData.attach(node, ...data);
+    for(const methodName in bindDingData.attach) {
+        node.nd[methodName](function(...args) {
+            bindDingData.attach[methodName].call(this, ...[...args, ...data]);
+        });
+    }
 };
 
 export function TemplateCloner($fn) {
@@ -109,10 +109,10 @@ export function TemplateCloner($fn) {
     };
 
 
-    const createBinding = (hydrateFunction, target) => {
+    const createBinding = (hydrateFunction, targetType) => {
         return new TemplateBinding((element, property) => {
             $hasBindingData = true;
-            $hydrateFn(hydrateFunction, target, element, property)
+            $hydrateFn(hydrateFunction, targetType, element, property)
         });
     };
 

package/src/core/wrappers/prototypes/attributes-extensions.js

@@ -0,0 +1,49 @@
+import Validator from "../../utils/validator";
+import {Observable} from "../../data/Observable";
+import {
+    bindAttributeWithObservable,
+    bindBooleanAttribute,
+    bindClassAttribute,
+    bindStyleAttribute
+} from "../AttributesWrapper";
+import ObservableItem from "../../data/ObservableItem";
+import TemplateBinding from "../TemplateBinding";
+import {BOOLEAN_ATTRIBUTES} from "../constants";
+
+Object.prototype.handleNdAttribute = function(element, attributeName) {
+    if(attributeName === 'class') {
+        bindClassAttribute(element, this);
+        return;
+    }
+    if(attributeName === 'style') {
+        bindStyleAttribute(element, this);
+
+    }
+};
+
+String.prototype.handleNdAttribute = function(element, attributeName) {
+    let value = this.resolveObservableTemplate ? this.resolveObservableTemplate() : this;
+    if(Validator.isString(value)) {
+        element.setAttribute(attributeName, value);
+        return;
+    }
+    const observables = value.filter(item => Validator.isObservable(item));
+    value = Observable.computed(() => {
+        return value.map(item => Validator.isObservable(item) ? item.val() : item).join(' ') || ' ';
+    }, observables);
+
+    if(BOOLEAN_ATTRIBUTES.includes(attributeName)) {
+        bindBooleanAttribute(element, attributeName, value);
+        return;
+    }
+
+    bindAttributeWithObservable(element, attributeName, value);
+};
+
+ObservableItem.prototype.handleNdAttribute = function(element, attributeName) {
+    bindAttributeWithObservable(element, attributeName, this);
+};
+
+TemplateBinding.prototype.handleNdAttribute = function(element, attributeName) {
+    this.$hydrate(element, attributeName);
+}

package/src/core/wrappers/{prototype-extensions.js → prototypes/nd-element-extensions.js}

@@ -1,9 +1,9 @@
-import ObservableItem from "../data/ObservableItem";
-import {NDElement} from "./NDElement";
-import TemplateBinding from "./TemplateBinding";
-import {ElementCreator} from "./ElementCreator";
-import PluginsManager from "../utils/plugins-manager";
-import Validator from "../utils/validator";
+import ObservableItem from "../../data/ObservableItem";
+import {NDElement} from "../NDElement";
+import TemplateBinding from "../TemplateBinding";
+import {ElementCreator} from "../ElementCreator";
+import PluginsManager from "../../utils/plugins-manager";
+import Validator from "../../utils/validator";
 
 String.prototype.toNdElement = function () {
     const formattedChild = this.resolveObservableTemplate ? this.resolveObservableTemplate() : this;
@@ -40,7 +40,9 @@ NDElement.prototype.toNdElement = function () {
 Array.prototype.toNdElement = function () {
     const fragment = document.createDocumentFragment();
     for(let i = 0, length = this.length; i < length; i++) {
-        fragment.appendChild(ElementCreator.getChild(this[i]));
+        const child = ElementCreator.getChild(this[i]);
+        if(child === null) continue;
+        fragment.appendChild(child);
     }
     return fragment;
 };