@kizmann/pico-js 2.0.6 → 2.0.8

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
      *
@@ -111,10 +137,14 @@ export class PicoArray
             return this.findIndex(value, search) !== - 1;
         }
 
-        if ( !Mix.isArr(value) ) {
+        if ( !Mix.isRef(value) ) {
             value = [value];
         }
 
+        if ( !Mix.isArr(value) ) {
+            value = Mix.vals(value);
+        }
+
         let index = value.findIndex((val) => {
             return val == search;
         });
@@ -331,6 +361,10 @@ export class PicoArray
             ...this.clone(cascade), value
         ];
 
+        if ( value == null ) {
+            return value;
+        }
+
         if ( Mix.isObj(value[key]) ) {
             value[key] = fn(cascade)(value[key]);
         }
@@ -342,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/Dom.js

@@ -9,6 +9,7 @@ import { PicoDomAttributePlugin } from "../dom/DomAttribute.js";
 import { PicoDomInviewPlugin } from "../dom/DomInview.js";
 import { PicoDomMetaPlugin } from "../dom/DomMeta.js";
 import { PicoDomObserverPlugin } from "../dom/DomObserver.js";
+import { PicoDomPopoverPlugin } from "../dom/DomPopover.js";
 
 export const PicoDomPlugins = [
     PicoDomFinderPlugin,
@@ -21,6 +22,7 @@ export const PicoDomPlugins = [
     PicoDomInviewPlugin,
     PicoDomMetaPlugin,
     PicoDomObserverPlugin,
+    PicoDomPopoverPlugin,
 ];
 
 /**
@@ -43,6 +45,8 @@ export const PicoDomPlugins = [
  * @typedef {import('../dom/DomMeta.js').PicoDomMetaInstance} PicoDomMetaInstance
  * @typedef {import('../dom/DomObserver.js').PicoDomObserverStatic} PicoDomObserverStatic
  * @typedef {import('../dom/DomObserver.js').PicoDomObserverInstance} PicoDomObserverInstance
+ * @typedef {import('../dom/DomPopover.js').PicoDomPopoverStatic} PicoDomPopoverStatic
+ * @typedef {import('../dom/DomPopover.js').PicoDomPopoverInstance} PicoDomPopoverInstance
  *
  * @mixes PicoDomFinderStatic
  * @mixes PicoDomGlobalStatic
@@ -54,6 +58,7 @@ export const PicoDomPlugins = [
  * @mixes PicoDomInviewStatic
  * @mixes PicoDomMetaStatic
  * @mixes PicoDomObserverStatic
+ * @mixes PicoDomPopoverStatic
  *
  * @extends PicoDomFinderInstance
  * @extends PicoDomGlobalInstance
@@ -65,6 +70,7 @@ export const PicoDomPlugins = [
  * @extends PicoDomInviewInstance
  * @extends PicoDomMetaInstance
  * @extends PicoDomObserverInstance
+ * @extends PicoDomPopoverInstance
  */
 export class PicoDom {
 

package/src/utils/Mixed.js

@@ -454,6 +454,10 @@ export class PicoMixed
             return [];
         }
 
+        if ( this.isFunc(value.toJSON) ) {
+            value = value.toJSON();
+        }
+
         if ( this.isIter(value) ) {
             value = this.iter(value);
         }
@@ -476,6 +480,10 @@ export class PicoMixed
             return [];
         }
 
+        if ( this.isFunc(value.toJSON) ) {
+            value = value.toJSON();
+        }
+
         if ( this.isIter(value) ) {
             value = this.iter(value);
         }
@@ -520,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];
             }
         }
@@ -528,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
      *
@@ -623,7 +663,7 @@ export class PicoMixed
             return value.length;
         }
 
-        if ( ! this.isRef(value) ) {
+        if ( !this.isRef(value) ) {
             return this.string(value).length;
         }
 
@@ -683,7 +723,7 @@ export class PicoMixed
             return value;
         }
 
-        if ( ! this.isStr(value) ) {
+        if ( !this.isStr(value) ) {
             return [value];
         }
 
@@ -883,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;
     }
 
     /**
@@ -244,17 +238,17 @@ export class PicoRunner
 
         Arr.add(this.$buffer, item);
 
-        let fn = () => {
-            this.runFramebuffer();
-        };
-
         return (e, ...args) => {
 
+            if ( /^drag/.test(e.type) ) {
+                e.preventDefault();
+            }
+
             Obj.assign(item, {
                 args: [e, ...args], active: true
             });
 
-            (e.preventDefault(), fn());
+            this.runFramebuffer();
         };
     }
 
@@ -272,7 +266,6 @@ export class PicoRunner
         }
 
         this.$idler = setTimeout(() => {
-            console.log('delayed runFramebuffer')
             this.runFramebuffer();
         }, 50);
 

package/src/utils/{Event.js → Signal.js}

@@ -1,5 +1,6 @@
 import { Str, Event, For, Mix, Arr } from "../index.esm.js";
-export class PicoEvent
+
+export class PicoSignal
 {
     static $events = [];
 
@@ -13,7 +14,7 @@ export class PicoEvent
      * @param {function} cb Event callback
      * @param {any} [options] Listener options
      * @param {boolean} [paused] Start paused
-     * @returns {typeof PicoEvent} Event class
+     * @returns {typeof PicoSignal} Event class
      */
     static bind(event, cb, options = {}, paused = false)
     {
@@ -40,7 +41,7 @@ export class PicoEvent
      *
      * @param {any} event Event name(s)
      * @param {any} [options] Listener options
-     * @returns {typeof PicoEvent} Event class
+     * @returns {typeof PicoSignal} Event class
      */
     static unbind(event, options = {})
     {
@@ -66,7 +67,7 @@ export class PicoEvent
      *
      * @param {string} event Event name
      * @param {...any} args Event args
-     * @returns {typeof PicoEvent} Event class
+     * @returns {typeof PicoSignal} Event class
      */
     static fire(event, ...args)
     {
@@ -90,7 +91,7 @@ export class PicoEvent
      *
      * @param {any} event Event name(s)
      * @param {any} [options] Listener options
-     * @returns {typeof PicoEvent} Event class
+     * @returns {typeof PicoSignal} Event class
      */
     static pause(event, options = {})
     {
@@ -116,7 +117,7 @@ export class PicoEvent
      *
      * @param {any} event Event name(s)
      * @param {any} [options] Listener options
-     * @returns {typeof PicoEvent} Event class
+     * @returns {typeof PicoSignal} Event class
      */
     static unpause(event, options = {})
     {
@@ -137,4 +138,4 @@ export class PicoEvent
 
 }
 
-export default PicoEvent;
+export default PicoSignal;

package/types/dom/DomEvent.d.ts

@@ -98,9 +98,11 @@ export class PicoDomEventInstance {
      * @example Dom.find("div").fire("click")
      *
      * @param {string} event Event name
+     * @param {object} [detail] Event detail
      * @returns {PicoDom} Current instance
      */
-    fire(event: string): PicoDom;
+    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
      *
@@ -213,6 +212,7 @@ export class PicoDomFinderInstance {
      * @returns {Element} Found element
      */
     closest(selector: any): Element;
+    upnode(selector: any): PicoDom;
     /**
      * Get previous element
      *
@@ -245,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/DomObserver.d.ts

@@ -8,15 +8,6 @@ export class PicoDomObserverStatic {
  * @extends {PicoDom}
  */
 export class PicoDomObserverInstance {
-    /**
-     * Get or set element value
-     *
-     * @example Dom.find("input").value("hello")
-     *
-     * @param {any} [value] New value
-     * @returns {any|PicoDom} Value or instance
-     */
-    value(value?: any): any | PicoDom;
 }
 export function PicoDomObserverPlugin(self: typeof PicoDom): typeof PicoDom;
 import { PicoDom } from "../utils/Dom.js";

package/types/dom/DomPopover.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @memberof PicoDom
+ */
+export class PicoDomPopoverStatic {
+}
+/**
+ * @memberof PicoDom
+ * @extends {PicoDom}
+ */
+export class PicoDomPopoverInstance {
+    popover(target: any, position?: string, options?: {}): any;
+    popoverY(target: any, position?: string, options?: {}): any;
+    popoverX(target: any, position?: string, options?: {}): any;
+    popoverNormalize(offset: any, self: any, rect: any, win: any): any;
+}
+export function PicoDomPopoverPlugin(self: typeof PicoDom): typeof PicoDom;
+import { PicoDom } from "../utils/Dom.js";

package/types/dom/DomRectangle.d.ts

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

package/types/index.esm.d.ts

@@ -2,6 +2,10 @@
  * @type {typeof PicoMixed}
  */
 export const Any: typeof PicoMixed;
+/**
+ * @type {typeof PicoMixed}
+ */
+export const Event: typeof PicoMixed;
 export function UUID(): string;
 /**
  * @type {typeof PicoDom}
@@ -22,7 +26,7 @@ import { default as Arr } from "./utils/Array.js";
 import { default as Obj } from "./utils/Object.js";
 import { default as Mix } from "./utils/Mixed.js";
 import { default as Hash } from "./utils/Hash.js";
-import { default as Event } from "./utils/Event.js";
+import { default as Signal } from "./utils/Signal.js";
 import { default as Locale } from "./utils/Locale.js";
 import { default as Cookie } from "./utils/Cookie.js";
 import { go } from "./tool/scope.js";
@@ -36,4 +40,4 @@ import { PicoMixed } from "./utils/Mixed.js";
 import { PicoDom } from "./utils/Dom.js";
 import { PicoNow } from "./utils/Now.js";
 import { PicoFormat } from "./utils/Format.js";
-export { Run, Str, Num, Arr, Obj, Mix, Hash, Event, Locale, Cookie, go, browser, device, Map, Data, Route, Element };
+export { Run, Str, Num, Arr, Obj, Mix, Hash, Signal, Locale, Cookie, go, browser, device, Map, Data, Route, Element };

package/types/now/NowFormat.d.ts

@@ -3,6 +3,9 @@ export namespace NOW_FORMAT {
     let LL: string;
     let LLL: string;
     let LLLL: string;
+    let LT: string;
+    let LTS: string;
+    let LTSD: string;
 }
 export namespace NOW_PARSE {
     let second: string;

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/Dom.d.ts

@@ -23,6 +23,8 @@ export const PicoDomPlugins: ((self: typeof PicoDom) => typeof PicoDom)[];
  * @typedef {import('../dom/DomMeta.js').PicoDomMetaInstance} PicoDomMetaInstance
  * @typedef {import('../dom/DomObserver.js').PicoDomObserverStatic} PicoDomObserverStatic
  * @typedef {import('../dom/DomObserver.js').PicoDomObserverInstance} PicoDomObserverInstance
+ * @typedef {import('../dom/DomPopover.js').PicoDomPopoverStatic} PicoDomPopoverStatic
+ * @typedef {import('../dom/DomPopover.js').PicoDomPopoverInstance} PicoDomPopoverInstance
  *
  * @mixes PicoDomFinderStatic
  * @mixes PicoDomGlobalStatic
@@ -34,6 +36,7 @@ export const PicoDomPlugins: ((self: typeof PicoDom) => typeof PicoDom)[];
  * @mixes PicoDomInviewStatic
  * @mixes PicoDomMetaStatic
  * @mixes PicoDomObserverStatic
+ * @mixes PicoDomPopoverStatic
  *
  * @extends PicoDomFinderInstance
  * @extends PicoDomGlobalInstance
@@ -45,6 +48,7 @@ export const PicoDomPlugins: ((self: typeof PicoDom) => typeof PicoDom)[];
  * @extends PicoDomInviewInstance
  * @extends PicoDomMetaInstance
  * @extends PicoDomObserverInstance
+ * @extends PicoDomPopoverInstance
  */
 export class PicoDom {
     /**
@@ -136,3 +140,5 @@ export type PicoDomMetaStatic = import("../dom/DomMeta.js").PicoDomMetaStatic;
 export type PicoDomMetaInstance = import("../dom/DomMeta.js").PicoDomMetaInstance;
 export type PicoDomObserverStatic = import("../dom/DomObserver.js").PicoDomObserverStatic;
 export type PicoDomObserverInstance = import("../dom/DomObserver.js").PicoDomObserverInstance;
+export type PicoDomPopoverStatic = import("../dom/DomPopover.js").PicoDomPopoverStatic;
+export type PicoDomPopoverInstance = import("../dom/DomPopover.js").PicoDomPopoverInstance;

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
      *