@kizmann/pico-js 1.0.13 → 2.0.0

package/src/{library/element.js → wip/Element.js}

@@ -1,6 +1,6 @@
-import { Str, Obj, Dom, Any, Arr } from "../index.js";
+import { Str, Obj, Dom, Mix, Arr } from "#src/index.esm.js";
 
-export class Element
+export class PicoElement
 {
     /**
      * Prefix for attribute selector.
@@ -27,15 +27,29 @@ export class Element
      */
     static invi = [];
 
+    /**
+     * Listen to scroll events
+     *
+     * @example PicoElement.listen()
+     *
+     * @returns {void} No return value
+     */
     static listen()
     {
         // Apply dom scroll event
-        document.addEventListener("scroll", Element.scroll);
+        document.addEventListener("scroll", PicoElement.scroll);
 
         // Apply initial scroll event
-        Element.scroll();
+        PicoElement.scroll();
     }
 
+    /**
+     * Handle scroll visibility
+     *
+     * @example PicoElement.scroll()
+     *
+     * @returns {void} No return value
+     */
     static scroll()
     {
         Arr.each(this.invi, (item, index) => {
@@ -51,7 +65,13 @@ export class Element
     }
 
     /**
-     * Bind a class on selector.
+     * Register element alias
+     *
+     * @example PicoElement.alias("tab", Tab)
+     *
+     * @param {string} key Alias key
+     * @param {any} instance Class instance
+     * @returns {this} Current class
      */
     static alias(key, instance)
     {
@@ -60,6 +80,16 @@ export class Element
         return this;
     }
 
+    /**
+     * Bind element to selector
+     *
+     * @example PicoElement.bind("tab", ".tabs")
+     *
+     * @param {string} key Alias key
+     * @param {any} selector Dom selector
+     * @param {any} [options] Init options
+     * @returns {this} Current class
+     */
     static bind(key, selector, options = {})
     {
         let el = Dom.find(selector), prefix = this.getPrefix(key);
@@ -70,7 +100,7 @@ export class Element
         let instance = Obj.get(this.inis,
             key, null);
 
-        if ( Any.isEmpty(instance) ) {
+        if ( Mix.isEmpty(instance) ) {
             return console.error(`Element "${key}" is not defined.`);
         }
 
@@ -80,7 +110,7 @@ export class Element
                 el.get(0), options
             );
 
-            Element.runs.push({
+            PicoElement.runs.push({
                 el: el.get(0), prefix: prefix, deamon: cb
             });
 
@@ -97,6 +127,16 @@ export class Element
         return this;
     }
 
+    /**
+     * Unbind element from selector
+     *
+     * @example PicoElement.unbind("tab", ".tabs")
+     *
+     * @param {string} key Alias key
+     * @param {any} selector Dom selector
+     * @param {any} [options] Init options
+     * @returns {this} Current class
+     */
     static unbind(key, selector, options = {})
     {
         let el = Dom.find(selector), prefix = this.getPrefix(key);
@@ -104,7 +144,7 @@ export class Element
         let instance = Obj.get(this.inis,
             key, null);
 
-        if ( Any.isEmpty(instance) ) {
+        if ( Mix.isEmpty(instance) ) {
             return console.error(`Element "${key}" is not defined.`);
         }
 
@@ -122,14 +162,20 @@ export class Element
         // Unbind option
         callback.call({}, el, options);
 
-        Arr.remove(Element.runs, { el: el.get(0) });
+        Arr.remove(PicoElement.runs, { el: el.get(0) });
 
         return this;
     }
 
 
     /**
-     * Bind callback on selector.
+     * Observe DOM changes
+     *
+     * @example PicoElement.observe("tab")
+     *
+     * @param {string} key Alias key
+     * @param {boolean} [plain] Plain options
+     * @returns {this} Current class
      */
     static observe(key, plain = false)
     {
@@ -144,7 +190,7 @@ export class Element
 
         let callback = () => {
 
-            let mounted = Element.getPrefix(key);
+            let mounted = PicoElement.getPrefix(key);
 
             let deamons = Arr.filter(this.runs,
                 { prefix: selector });
@@ -155,7 +201,7 @@ export class Element
                     Dom.find(el).attr(selector)
                 );
 
-                if ( plain && Any.isEmpty(options) ) {
+                if ( plain && Mix.isEmpty(options) ) {
                     options = { _plain: Dom.find(el).attr(selector) };
                 }
 
@@ -178,7 +224,7 @@ export class Element
                     Dom.find(el).attr(selector)
                 );
 
-                if ( plain && Any.isEmpty(options) ) {
+                if ( plain && Mix.isEmpty(options) ) {
                     options = { _plain: Dom.find(el).attr(selector) };
                 }
 
@@ -201,11 +247,29 @@ export class Element
         return this;
     }
 
+    /**
+     * Bind element on inview
+     *
+     * @example PicoElement.bindInview(el, cb)
+     *
+     * @param {Element} el Target element
+     * @param {function} cb Callback fn
+     * @returns {void} No return value
+     */
     static bindInview(el, cb)
     {
         Arr.add(this.invi, { el, cb }, { el });
     }
 
+    /**
+     * Unbind element on inview
+     *
+     * @example PicoElement.unbindInview(el, cb)
+     *
+     * @param {Element} el Target element
+     * @param {function} cb Callback fn
+     * @returns {void} No return value
+     */
     static unbindInview(el, cb)
     {
         Arr.remove(this.invi, { el, cb }, { el });
@@ -214,7 +278,12 @@ export class Element
 
 
     /**
-     * Return prefix with key.
+     * Get attribute prefix
+     *
+     * @example PicoElement.getPrefix("tab") // => "js-tab"
+     *
+     * @param {string} [key] Alias key
+     * @returns {string} Attribute prefix
      */
     static getPrefix(key)
     {
@@ -222,7 +291,12 @@ export class Element
     }
 
     /**
-     * Set prefix to given value.
+     * Set attribute prefix
+     *
+     * @example PicoElement.setPrefix("pi")
+     *
+     * @param {string} prefix New prefix
+     * @returns {void} No return value
      */
     static setPrefix(prefix)
     {
@@ -231,4 +305,4 @@ export class Element
 
 }
 
-export default Element;
+export default PicoElement;