native-document 1.0.77 → 1.0.79

package/dist/native-document.components.min.js

@@ -1404,7 +1404,38 @@ var NativeComponents = (function (exports) {
         return anchorFragment;
     }
 
-    const BOOLEAN_ATTRIBUTES = ['checked', 'selected', 'disabled', 'readonly', 'required', 'autofocus', 'multiple', 'autocomplete', 'hidden', 'contenteditable', 'spellcheck', 'translate', 'draggable', 'async', 'defer', 'autoplay', 'controls', 'loop', 'muted', 'download', 'reversed', 'open', 'default', 'formnovalidate', 'novalidate', 'scoped', 'itemscope', 'allowfullscreen', 'allowpaymentrequest', 'playsinline'];
+    const BOOLEAN_ATTRIBUTES = new Set([
+        'checked',
+        'selected',
+        'disabled',
+        'readonly',
+        'required',
+        'autofocus',
+        'multiple',
+        'autocomplete',
+        'hidden',
+        'contenteditable',
+        'spellcheck',
+        'translate',
+        'draggable',
+        'async',
+        'defer',
+        'autoplay',
+        'controls',
+        'loop',
+        'muted',
+        'download',
+        'reversed',
+        'open',
+        'default',
+        'formnovalidate',
+        'novalidate',
+        'scoped',
+        'itemscope',
+        'allowfullscreen',
+        'allowpaymentrequest',
+        'playsinline'
+    ]);
 
     /**
      *
@@ -1592,6 +1623,12 @@ var NativeComponents = (function (exports) {
         }
     }
 
+    const NdBindings = {
+        class: (element, value) => bindClassAttribute(element, value),
+        style: (element, value) => bindStyleAttribute(element, value),
+    };
+
+
     /**
      *
      * @param {HTMLElement} element
@@ -1605,41 +1642,27 @@ var NativeComponents = (function (exports) {
 
         for(let key in attributes) {
             const attributeName = key.toLowerCase();
-            let value = attributes[attributeName];
-            if(value === null || value === undefined) {
+            let value = attributes[key];
+            if(value == null) {
                 continue;
             }
             if(value.handleNdAttribute) {
                 value.handleNdAttribute(element, attributeName, value);
                 continue;
             }
-            if(Validator.isString(value)) {
-                element.setAttribute(attributeName, value);
-                return;
-            }
-            if(attributeName === 'class' && Validator.isObject(value)) {
-                bindClassAttribute(element, value);
-                continue;
-            }
-            if(attributeName === 'style' && Validator.isObject(value)) {
-                bindStyleAttribute(element, value);
-                continue;
+            if(typeof value === 'object') {
+                const binding = NdBindings[attributeName];
+                if(binding) {
+                    binding(element, value);
+                    continue;
+                }
             }
-            if(BOOLEAN_ATTRIBUTES.includes(attributeName)) {
+            if(BOOLEAN_ATTRIBUTES.has(attributeName)) {
                 bindBooleanAttribute(element, attributeName, value);
                 continue;
             }
-            if(Validator.isObservable(value)) {
-                bindAttributeWithObservable(element, attributeName, value);
-                continue;
-            }
-            if(value.$hydrate) {
-                value.$hydrate(element, attributeName);
-                continue;
-            }
 
             element.setAttribute(attributeName, value);
-
         }
         return element;
     }
@@ -1700,8 +1723,16 @@ var NativeComponents = (function (exports) {
         element.setAttribute(attributeName, this);
     };
 
+    Number.prototype.handleNdAttribute = function(element, attributeName) {
+        element.setAttribute(attributeName, this);
+    };
+
+    Boolean.prototype.handleNdAttribute = function(element, attrName) {
+        bindBooleanAttribute(element, attrName, this);
+    };
+
     ObservableItem.prototype.handleNdAttribute = function(element, attributeName) {
-        if(BOOLEAN_ATTRIBUTES.includes(attributeName)) {
+        if(BOOLEAN_ATTRIBUTES.has(attributeName)) {
             bindBooleanAttribute(element, attributeName, this);
             return;
         }
@@ -1791,22 +1822,14 @@ var NativeComponents = (function (exports) {
             PluginsManager.emit('AfterProcessChildren', parent);
         },
         getChild(child) {
-            if(child == null) {
-                return null;
-            }
-            if(child.toNdElement) {
-                do {
-                    child =  child.toNdElement();
-                    if(Validator.isElement(child)) {
-                        return child;
-                    }
-                    if(child == null) {
-                        return null;
-                    }
-                } while (child.toNdElement);
+            while (child?.toNdElement) {
+                child = child.toNdElement();
+
+                if (Validator.isElement(child)) return child;
+                if (!child) return null;
             }
 
-            return ElementCreator.createStaticTextNode(null, child);
+            return child ? ElementCreator.createStaticTextNode(null, child) : null;
         },
         /**
          *
@@ -2284,6 +2307,9 @@ var NativeComponents = (function (exports) {
     });
 
     ObservableArray.prototype.clear = function() {
+        if(this.$currentValue.length === 0) {
+            return;
+        }
         this.$currentValue.length = 0;
         this.trigger({ action: 'clear' });
         return true;
@@ -8647,87 +8673,6 @@ var NativeComponents = (function (exports) {
     Spinner.prototype.$build = function() {};
     Spinner.prototype.toNdElement = function() {};
 
-    function SplitterPanel(content, config = {}) {
-        if(!(this instanceof SplitterPanel)) {
-            return new SplitterPanel(content, config);
-        }
-
-        if (typeof content === 'object' && !content.tagName) {
-            config = content;
-            content = config.content || null;
-        }
-
-        this.$description = {
-            content: content || null,
-            size: null,
-            minSize: null,
-            maxSize: null,
-            collapsible: false,
-            collapsed: false,
-            resizable: true,
-            data: null,
-            render: null,
-            ...config
-        };
-    }
-
-    BaseComponent.extends(SplitterPanel, BaseComponent);
-
-    SplitterPanel.defaultTemplate = null;
-
-    SplitterPanel.use = function(template) {
-        SplitterPanel.defaultTemplate = template.splitterPanel;
-    };
-
-    SplitterPanel.prototype.content = function(content) {
-        this.$description.content = content;
-        return this;
-    };
-
-    SplitterPanel.prototype.size = function(size) {
-        this.$description.size = size;
-        return this;
-    };
-
-    SplitterPanel.prototype.minSize = function(size) {
-        this.$description.minSize = size;
-        return this;
-    };
-
-    SplitterPanel.prototype.maxSize = function(size) {
-        this.$description.maxSize = size;
-        return this;
-    };
-
-    SplitterPanel.prototype.collapsible = function(collapsible = true) {
-        this.$description.collapsible = collapsible;
-        return this;
-    };
-
-    SplitterPanel.prototype.collapsed = function(collapsed = true) {
-        this.$description.collapsed = collapsed;
-        return this;
-    };
-
-    SplitterPanel.prototype.resizable = function(resizable = true) {
-        this.$description.resizable = resizable;
-        return this;
-    };
-
-    SplitterPanel.prototype.fixed = function() {
-        return this.resizable(false);
-    };
-
-    SplitterPanel.prototype.data = function(data) {
-        this.$description.data = data;
-        return this;
-    };
-
-    SplitterPanel.prototype.render = function(renderFn) {
-        this.$description.render = renderFn;
-        return this;
-    };
-
     function Splitter(config = {}) {
         if(!(this instanceof Splitter)) {
             return new Splitter(config);
@@ -8819,6 +8764,87 @@ var NativeComponents = (function (exports) {
         return this;
     };
 
+    function SplitterPanel(content, config = {}) {
+        if(!(this instanceof SplitterPanel)) {
+            return new SplitterPanel(content, config);
+        }
+
+        if (typeof content === 'object' && !content.tagName) {
+            config = content;
+            content = config.content || null;
+        }
+
+        this.$description = {
+            content: content || null,
+            size: null,
+            minSize: null,
+            maxSize: null,
+            collapsible: false,
+            collapsed: false,
+            resizable: true,
+            data: null,
+            render: null,
+            ...config
+        };
+    }
+
+    BaseComponent.extends(SplitterPanel, BaseComponent);
+
+    SplitterPanel.defaultTemplate = null;
+
+    SplitterPanel.use = function(template) {
+        SplitterPanel.defaultTemplate = template.splitterPanel;
+    };
+
+    SplitterPanel.prototype.content = function(content) {
+        this.$description.content = content;
+        return this;
+    };
+
+    SplitterPanel.prototype.size = function(size) {
+        this.$description.size = size;
+        return this;
+    };
+
+    SplitterPanel.prototype.minSize = function(size) {
+        this.$description.minSize = size;
+        return this;
+    };
+
+    SplitterPanel.prototype.maxSize = function(size) {
+        this.$description.maxSize = size;
+        return this;
+    };
+
+    SplitterPanel.prototype.collapsible = function(collapsible = true) {
+        this.$description.collapsible = collapsible;
+        return this;
+    };
+
+    SplitterPanel.prototype.collapsed = function(collapsed = true) {
+        this.$description.collapsed = collapsed;
+        return this;
+    };
+
+    SplitterPanel.prototype.resizable = function(resizable = true) {
+        this.$description.resizable = resizable;
+        return this;
+    };
+
+    SplitterPanel.prototype.fixed = function() {
+        return this.resizable(false);
+    };
+
+    SplitterPanel.prototype.data = function(data) {
+        this.$description.data = data;
+        return this;
+    };
+
+    SplitterPanel.prototype.render = function(renderFn) {
+        this.$description.render = renderFn;
+        return this;
+    };
+
     function Stepper(config = {}) {
         if(!(this instanceof Stepper)) {
             return new Stepper(config);