@kizmann/pico-js 2.0.7 → 2.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kizmann/pico-js",
-    "version": "2.0.7",
+    "version": "2.0.8",
     "license": "MIT",
     "type": "module",
     "private": false,

package/src/dom/DomEvent.js

@@ -158,7 +158,7 @@ export class PicoDomEventInstance
      */
     optoff(options = {})
     {
-        Run.idle(() => {
+        Run.async(() => {
             Arr.filterRemove(Dom.$events, { options });
         });
 
@@ -240,6 +240,30 @@ export class PicoDomEventInstance
         return this;
     }
 
+    pointerdown(button = 1)
+    {
+        const rect = this.rect();
+
+        const [x, y] = [
+            rect.left + rect.width / 2,
+            rect.top + rect.height / 2,
+        ];
+
+        const event = new PointerEvent('pointerdown', {
+            view: window,
+            bubbles: true,
+            cancelable: true,
+            buttons: 1,
+            clientX: x, clientY: y
+        });
+
+        this.each((el) => {
+            el.dispatchEvent(event);
+        });
+
+        return this;
+    }
+
 }
 
 /**

package/src/dom/DomFinder.js

@@ -28,20 +28,25 @@ export class PicoDomFinderStatic
      *
      * @example Dom.getNodePoint(100, 100)
      *
-     * @param {number} posx X position
-     * @param {number} posy Y position
+     * @param {object} event Event data
      * @returns {Array<Element>} Nodes at point
      */
-    static getNodePoint(posx, posy)
+    static getNodePoint(event)
     {
-        let el = null;
+        if ( event.touches?.[0] ) {
+            // event = event.touches[0];
+        }
+
+        let [el, src] = [
+            null, [event.clientX, event.clientY]
+        ];
 
         if ( Dom.doc().elementsFromPoint != null ) {
-            el = document.elementsFromPoint(posx, posy);
+            el = document.elementsFromPoint(src[0], src[1]);
         }
 
         if ( Dom.doc().msElementsFromPoint != null ) {
-            el = document.msElementsFromPoint(posx, posy);
+            el = document.msElementsFromPoint(src[0], src[1]);
         }
 
         return el;
@@ -64,10 +69,10 @@ export class PicoDomFinderStatic
             target = event.target;
         }
 
-        let { type, clientX, clientY } = event;
+        let { type } = event;
 
         if ( /^(drag[a-z]*|drop$)/.test(type) ) {
-            target = Dom.getNodePoint(clientX, clientY);
+            target = Dom.getNodePoint(event);
         }
 
         if ( Mix.isArr(target) ) {
@@ -389,12 +394,10 @@ export class PicoDomFinderInstance
      * @param {number} [filter] Node type
      * @returns {PicoDom} Child instance
      */
-    child(selector, filter = 1)
+    child(selector = null, filter = 1)
     {
-        for ( let el of this.els ) {
-            if ( el.nodeType === filter ) {
-                return Dom.find(el);
-            }
+        for ( let el of this.childs(selector, filter) ) {
+            return Dom.find(el);
         }
 
         return Dom.find(null);
@@ -506,16 +509,17 @@ export class PicoDomFinderInstance
      * @example Dom.find("div").is(".active") // => true
      *
      * @param {any} selector Test selector
+     * @param {boolean} [empty] Test selector
      * @returns {boolean} True if matches
      */
-    is(selector)
+    is(selector, empty = false)
     {
         if ( this.el === selector ) {
             return true;
         }
 
         if ( this.el == null ) {
-            return false;
+            return empty;
         }
 
         for ( let el of this.parent().find(selector).get() ) {

package/src/dom/DomRectangle.js

@@ -30,8 +30,12 @@ export class PicoDomRectangleStatic
  */
 export class PicoDomRectangleInstance
 {
-    rect(fallback = {})
+    rect(fallback = { left: 0, top: 0, width: 0, height: 0 })
     {
+        if ( ! this.el.getBoundingClientRect ) {
+            return fallback;
+        }
+
         const rect = this.el.getBoundingClientRect();
 
         if ( rect == null ) {

package/src/utils/Array.js

@@ -70,6 +70,32 @@ export class PicoArray
         return this.splice(target, index, 1);
     }
 
+    static prev(target, index, fallback = 0)
+    {
+        if ( Mix.isEmpty(target) || !Mix.isArr(target) ) {
+            return 0;
+        }
+
+        if ( index - 1 < 0 ) {
+            return target.length-1;
+        }
+
+        return index - 1;
+    }
+
+    static next(target, index, fallback = 0)
+    {
+        if ( Mix.isEmpty(target) || !Mix.isArr(target) ) {
+            return 0;
+        }
+
+        if ( index + 1 > target.length ) {
+            return 0;
+        }
+
+        return index + 1;
+    }
+
     /**
      * Create array with callback values
      *
@@ -350,6 +376,29 @@ export class PicoArray
         return value;
     }
 
+    static cascade(value, childs, key, cascade = [], result = {})
+    {
+        if ( value == null ) {
+            return result;
+        }
+
+        if ( Mix.isObj(value) ) {
+            return this.cascade(value[key], key, cb);
+        }
+
+        const fn = (val) => {
+            return this.cascade(...[
+                val[childs], childs, key, result[val[key]], result
+            ]);
+        };
+
+        this.each(value, (val) => {
+            (result[val[key]] = [...cascade, val[key] ], fn(val));
+        });
+
+        return result;
+    }
+
     /**
      * Get matching indexes by filter
      *

package/src/utils/Mixed.js

@@ -528,7 +528,7 @@ export class PicoMixed
         let result = {};
 
         for ( const key of Object.getOwnPropertyNames(value) ) {
-            if ( exclude.length && ! Arr.has(exclude, key) ) {
+            if ( exclude.length && !Arr.has(exclude, key) ) {
                 result[key] = value[key];
             }
         }
@@ -536,6 +536,38 @@ export class PicoMixed
         return result;
     }
 
+    static extend(target, value, exclude = ['constructor'])
+    {
+        if ( value == null ) {
+            return {};
+        }
+
+        let proto = Object.getPrototypeOf(value);
+
+        for ( const key of Object.getOwnPropertyNames(value) ) {
+
+            if ( !exclude.length || Arr.has(exclude, key) ) {
+                continue;
+            }
+
+            let desc = Object.getOwnPropertyDescriptor(proto, key);
+
+            if ( !desc ) {
+                desc = Object.getOwnPropertyDescriptor(value, key);
+            }
+
+            if ( !desc && (!desc.get && !desc.set) ) {
+                target[key] = value[key];
+            }
+
+            if ( desc && (desc.get || desc.set) ) {
+                Object.defineProperty(target, key, desc);
+            }
+        }
+
+        return target;
+    }
+
     /**
      * Get static class props
      *
@@ -631,7 +663,7 @@ export class PicoMixed
             return value.length;
         }
 
-        if ( ! this.isRef(value) ) {
+        if ( !this.isRef(value) ) {
             return this.string(value).length;
         }
 
@@ -691,7 +723,7 @@ export class PicoMixed
             return value;
         }
 
-        if ( ! this.isStr(value) ) {
+        if ( !this.isStr(value) ) {
             return [value];
         }
 
@@ -891,5 +923,4 @@ PicoMixed.convertBoolean = function (...args) {
 };
 
 
-
 export default PicoMixed;

package/src/utils/Runner.js

@@ -1,4 +1,4 @@
-import { Arr, Hash, Mix, Obj } from "../index.esm.js";
+import { Arr, Mix, Obj } from "../index.esm.js";
 
 export class PicoRunner
 {
@@ -8,6 +8,15 @@ export class PicoRunner
 
     static $buffer = [];
 
+    static interval(fn, intval = 0)
+    {
+        const idle = setInterval(() => {
+            fn();
+        }, intval);
+
+        return () => clearInterval(idle);
+    }
+
     /**
      * Clear timer or call function
      *
@@ -41,7 +50,7 @@ export class PicoRunner
     static tryin(cb)
     {
         try {
-            requestIdleCallback(cb);
+            cb();
         } catch (e) {
             //
         }
@@ -80,34 +89,16 @@ export class PicoRunner
      * @example Run.frame(cb)
      *
      * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
-     * @returns {function} Noop clear function
-     */
-    static frame(fn, ...args)
-    {
-        requestAnimationFrame(() => {
-            fn(...args)
-        });
-
-        return () => null;
-    }
-
-    /**
-     * Run function when browser is idle
-     *
-     * @example Run.idle(cb)
-     *
-     * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
+     * @param {any} [options] Callback options
      * @returns {function} Noop clear function
      */
-    static idle(fn, ...args)
+    static frame(fn, options = {})
     {
-        requestIdleCallback(() => {
-            fn(...args)
+        const frame = requestAnimationFrame(() => {
+            fn();
         });
 
-        return () => null;
+        return () => cancelAnimationFrame(frame);
     }
 
     /**
@@ -116,16 +107,15 @@ export class PicoRunner
      * @example Run.async(cb)
      *
      * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
      * @returns {function} Noop clear function
      */
-    static async(fn, ...args)
+    static async(fn)
     {
-        setTimeout(() => {
-            fn(...args)
+        const idle = setTimeout(() => {
+            fn()
         });
 
-        return () => null;
+        return () => clearTimeout(idle);
     }
 
     /**
@@ -135,13 +125,12 @@ export class PicoRunner
      *
      * @param {function} fn Callback function
      * @param {number} [delay] Delay ms
-     * @param {any} [...args] Callback arguments
      * @returns {function} Clear function
      */
-    static delay(fn, delay = 0, ...args)
+    static delay(fn, delay = 0)
     {
         let idler = setTimeout(() => {
-            fn(...args);
+            fn();
         }, delay);
 
         return () => clearTimeout(idler);
@@ -210,20 +199,25 @@ export class PicoRunner
      *
      * @param {function} cb Callback to run
      * @param {number} [fps] Max frames per sec
+     * @param {boolean} [finish] Finish last frame
      * @returns {function} Rate-limited fn
      */
-    static framerate(cb, fps = 30)
+    static framerate(cb, fps = 30, finish = true)
     {
-        let last = 0;
+        let timer, last = 0, hertz = 1000 / fps;
 
-        return (...args) => {
+        const fn = (...args) => {
 
-            if ( Date.now() - last <= (1000 / fps) ) {
-                return;
+            clearTimeout(timer);
+
+            if ( Date.now() - last <= hertz ) {
+                return finish && (timer = setTimeout(fn, hertz + 1));
             }
 
-            (this.frame(cb, ...args), last = Date.now());
+            (this.frame(() => cb(...args)), last = Date.now());
         };
+
+        return fn;
     }
 
     /**

package/types/dom/DomEvent.d.ts

@@ -102,6 +102,7 @@ export class PicoDomEventInstance {
      * @returns {PicoDom} Current instance
      */
     fire(event: string, detail?: object): PicoDom;
+    pointerdown(button?: number): this;
     /**
      * @see PicoDom.once
      */

package/types/dom/DomFinder.d.ts

@@ -17,11 +17,10 @@ export class PicoDomFinderStatic {
      *
      * @example Dom.getNodePoint(100, 100)
      *
-     * @param {number} posx X position
-     * @param {number} posy Y position
+     * @param {object} event Event data
      * @returns {Array<Element>} Nodes at point
      */
-    static getNodePoint(posx: number, posy: number): Array<Element>;
+    static getNodePoint(event: object): Array<Element>;
     /**
      * Get target by selector
      *
@@ -193,7 +192,7 @@ export class PicoDomFinderInstance {
      * @param {number} [filter] Node type
      * @returns {PicoDom} Child instance
      */
-    child(selector: any, filter?: number): PicoDom;
+    child(selector?: any, filter?: number): PicoDom;
     /**
      * Get child elements
      *
@@ -246,9 +245,10 @@ export class PicoDomFinderInstance {
      * @example Dom.find("div").is(".active") // => true
      *
      * @param {any} selector Test selector
+     * @param {boolean} [empty] Test selector
      * @returns {boolean} True if matches
      */
-    is(selector: any): boolean;
+    is(selector: any, empty?: boolean): boolean;
     /**
      * Check if contains match
      *

package/types/dom/DomRectangle.d.ts

@@ -17,7 +17,12 @@ export class PicoDomRectangleStatic {
  * @extends {PicoDom}
  */
 export class PicoDomRectangleInstance {
-    rect(fallback?: {}): any;
+    rect(fallback?: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    }): any;
     /**
      * Get margin values
      *

package/types/utils/Array.d.ts

@@ -42,6 +42,8 @@ export class PicoArray {
      * @returns {any} Splice result
      */
     static unset(target: Array<any>, index: number): any;
+    static prev(target: any, index: any, fallback?: number): number;
+    static next(target: any, index: any, fallback?: number): any;
     /**
      * Create array with callback values
      *
@@ -167,6 +169,7 @@ export class PicoArray {
      * @returns {any} Mapped tree
      */
     static recursive(value: any, key: string, cb: Function, cascade?: Array<any>): any;
+    static cascade(value: any, childs: any, key: any, cascade?: any[], result?: {}): any;
     /**
      * Get matching indexes by filter
      *

package/types/utils/Mixed.d.ts

@@ -294,6 +294,7 @@ export class PicoMixed {
      * @returns {Record<string, any>} Props map
      */
     static props(value: any, exclude?: Array<any>): Record<string, any>;
+    static extend(target: any, value: any, exclude?: string[]): any;
     /**
      * Get static class props
      *

package/types/utils/Runner.d.ts

@@ -2,6 +2,7 @@ export class PicoRunner {
     static $idler: any;
     static $timer: number;
     static $buffer: any[];
+    static interval(fn: any, intval?: number): () => void;
     /**
      * Clear timer or call function
      *
@@ -35,30 +36,19 @@ export class PicoRunner {
      * @example Run.frame(cb)
      *
      * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
+     * @param {any} [options] Callback options
      * @returns {function} Noop clear function
      */
-    static frame(fn: Function, ...args: any[]): Function;
-    /**
-     * Run function when browser is idle
-     *
-     * @example Run.idle(cb)
-     *
-     * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
-     * @returns {function} Noop clear function
-     */
-    static idle(fn: Function, ...args: any[]): Function;
+    static frame(fn: Function, options?: any): Function;
     /**
      * Run function asynchronously
      *
      * @example Run.async(cb)
      *
      * @param {function} fn Callback function
-     * @param {any} [...args] Callback arguments
      * @returns {function} Noop clear function
      */
-    static async(fn: Function, ...args: any[]): Function;
+    static async(fn: Function): Function;
     /**
      * Run function after delay
      *
@@ -66,10 +56,9 @@ export class PicoRunner {
      *
      * @param {function} fn Callback function
      * @param {number} [delay] Delay ms
-     * @param {any} [...args] Callback arguments
      * @returns {function} Clear function
      */
-    static delay(fn: Function, delay?: number, ...args: any[]): Function;
+    static delay(fn: Function, delay?: number): Function;
     /**
      * Create debounced callback
      *
@@ -97,9 +86,10 @@ export class PicoRunner {
      *
      * @param {function} cb Callback to run
      * @param {number} [fps] Max frames per sec
+     * @param {boolean} [finish] Finish last frame
      * @returns {function} Rate-limited fn
      */
-    static framerate(cb: Function, fps?: number): Function;
+    static framerate(cb: Function, fps?: number, finish?: boolean): Function;
     /**
      * Buffer events into single frame
      *