@esportsplus/template 0.19.7 → 0.20.1

package/build/attributes.js

@@ -4,7 +4,7 @@ import { STATE_HYDRATING, STATE_NONE, STATE_WAITING } from './constants.js';
 import { className, removeAttribute, setAttribute } from './utilities/element.js';
 import { raf } from './utilities/queue.js';
 import q from '@esportsplus/queue';
-import event from './event.js';
+import event from './event/index.js';
 const STORE = Symbol();
 let delimiters = {
     class: ' ',

package/build/{event.d.ts → event/index.d.ts}

@@ -1,3 +1,3 @@
-import { Element } from './types.js';
+import { Element } from '../types.js';
 declare const _default: (element: Element, event: `on${string}`, listener: Function) => void;
 export default _default;

package/build/{event.js → event/index.js}

@@ -1,9 +1,10 @@
 import { root } from '@esportsplus/reactivity';
 import { defineProperty } from '@esportsplus/utilities';
-import { addEventListener } from './utilities/element.js';
-import { parentElement } from './utilities/node.js';
-import { raf } from './utilities/queue.js';
-import { ondisconnect } from './slot/cleanup.js';
+import { addEventListener } from '../utilities/element.js';
+import { parentElement } from '../utilities/node.js';
+import { ondisconnect } from '../slot/cleanup.js';
+import onconnect from './onconnect.js';
+import ontick from './ontick.js';
 let capture = new Set(['onblur', 'onfocus', 'onscroll']), controllers = new Map(), keys = {}, passive = new Set([
     'onmousedown', 'onmouseenter', 'onmouseleave', 'onmousemove', 'onmouseout', 'onmouseover', 'onmouseup', 'onmousewheel',
     'onscroll',
@@ -57,27 +58,21 @@ function register(element, event) {
     return key;
 }
 export default (element, event, listener) => {
-    if (event === 'onconnect') {
-        let retry = 60, task = () => {
-            retry--;
-            if (element.isConnected) {
-                retry = 0;
-                root(() => listener(element));
-            }
-            if (retry) {
-                raf.add(task);
-            }
-        };
-        raf.add(task);
-        return;
-    }
-    else if (event === 'ondisconnect') {
-        ondisconnect(element, () => listener(element));
-        return;
-    }
-    else if (event === 'onrender') {
-        root(() => listener(element));
-        return;
+    switch (event) {
+        case 'onconnect':
+            onconnect(element, listener);
+            return;
+        case 'ondisconnect':
+            ondisconnect(element, () => listener(element));
+            return;
+        case 'ontick':
+            ontick(element, listener);
+            return;
+        case 'onrender':
+            root(() => listener(element));
+            return;
+        default:
+            element[keys[event] || register(element, event)] = listener;
+            return;
     }
-    element[keys[event] || register(element, event)] = listener;
 };

package/build/event/onconnect.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (element: Element, listener: Function) => void;
+export default _default;

package/build/event/onconnect.js

@@ -0,0 +1,15 @@
+import { root } from '@esportsplus/reactivity';
+import { add, remove } from './ontick.js';
+export default (element, listener) => {
+    let fn = () => {
+        retry--;
+        if (element.isConnected) {
+            retry = 0;
+            root(() => listener(element));
+        }
+        if (retry) {
+            remove(fn);
+        }
+    }, retry = 60;
+    add(fn);
+};

package/build/event/ontick.d.ts

@@ -0,0 +1,5 @@
+declare const add: (task: VoidFunction) => void;
+declare const remove: (task: VoidFunction) => void;
+declare const _default: (element: Element, listener: Function) => void;
+export default _default;
+export { add, remove };

package/build/event/ontick.js

@@ -0,0 +1,44 @@
+import { STATE_HYDRATING, STATE_NONE } from '../constants.js';
+import { raf } from '../utilities/queue.js';
+let tasks = Object.assign(new Set(), { running: false });
+function tick() {
+    if (tasks.size === 0) {
+        tasks.running = false;
+        return;
+    }
+    for (let task of tasks) {
+        task();
+    }
+    raf.add(tick);
+}
+const add = (task) => {
+    tasks.add(task);
+    if (!tasks.running) {
+        tasks.running = true;
+        raf.add(tick);
+    }
+};
+const remove = (task) => {
+    tasks.delete(task);
+};
+export default (element, listener) => {
+    let dispose = () => {
+        remove(fn);
+    }, fn = () => {
+        if (state === STATE_HYDRATING) {
+            if (element.isConnected) {
+                state = STATE_NONE;
+            }
+            else if (retry--) {
+                return;
+            }
+        }
+        if (!element.isConnected) {
+            remove(fn);
+            return;
+        }
+        listener(dispose, element);
+    }, retry = 60, state = STATE_HYDRATING;
+    add(fn);
+};
+export { add, remove };

package/build/types.d.ts

@@ -13,9 +13,10 @@ type Attributes = {
 } & {
     [key: `aria-${string}`]: string | number | boolean | undefined;
     [key: `data-${string}`]: string | undefined;
-    onconnect?: (element: Element) => void;
-    ondisconnect?: (element: Element) => void;
-    onrender?: (element: Element) => void;
+    onconnect?: <T = Element>(element: T) => void;
+    ondisconnect?: <T = Element>(element: T) => void;
+    onrender?: <T = Element>(element: T) => void;
+    ontick?: <T = Element>(element: T) => void;
 } & Record<PropertyKey, unknown>;
 type Effect<T> = () => T extends [] ? Renderable<T>[] : Renderable<T>;
 type Element = HTMLElement & Attributes;

package/package.json

@@ -14,7 +14,7 @@
   "private": false,
   "type": "module",
   "types": "./build/index.d.ts",
-  "version": "0.19.7",
+  "version": "0.20.1",
   "scripts": {
     "build": "tsc && tsc-alias",
     "-": "-"

package/src/{event.ts → event/index.ts}

@@ -1,10 +1,11 @@
 import { root } from '@esportsplus/reactivity';
 import { defineProperty } from '@esportsplus/utilities';
-import { Element } from './types';
-import { addEventListener } from './utilities/element';
-import { parentElement } from './utilities/node';
-import { raf } from './utilities/queue';
-import { ondisconnect } from './slot/cleanup';
+import { Element } from '~/types';
+import { addEventListener } from '~/utilities/element';
+import { parentElement } from '~/utilities/node';
+import { ondisconnect } from '~/slot/cleanup';
+import onconnect from './onconnect';
+import ontick from './ontick';
 
 
 let capture = new Set<`on${string}`>(['onblur', 'onfocus', 'onscroll']),
@@ -87,33 +88,25 @@ function register(element: Element, event: `on${string}`) {
 
 
 export default (element: Element, event: `on${string}`, listener: Function): void => {
-    if (event === 'onconnect') {
-        let retry = 60,
-            task = () => {
-                retry--;
-
-                if (element.isConnected) {
-                    retry = 0;
-                    root(() => listener(element));
-                }
-
-                if (retry) {
-                    raf.add(task);
-                }
-            };
-
-        raf.add(task);
-
-        return;
+    switch (event) {
+        case 'onconnect':
+            onconnect(element, listener);
+            return;
+
+        case 'ondisconnect':
+            ondisconnect(element, () => listener(element));
+            return;
+
+        case 'ontick':
+            ontick(element, listener);
+            return;
+
+        case 'onrender':
+            root(() => listener(element));
+            return;
+
+        default:
+            element[ keys[event] || register(element, event) ] = listener;
+            return;
     }
-    else if (event === 'ondisconnect') {
-        ondisconnect(element, () => listener(element));
-        return;
-    }
-    else if (event === 'onrender') {
-        root(() => listener(element));
-        return;
-    }
-
-    element[ keys[event] || register(element, event) ] = listener;
 };

package/src/event/onconnect.ts

@@ -0,0 +1,21 @@
+import { root } from '@esportsplus/reactivity';
+import { add, remove } from './ontick';
+
+
+export default (element: Element, listener: Function) => {
+    let fn = () => {
+            retry--;
+
+            if (element.isConnected) {
+                retry = 0;
+                root(() => listener(element));
+            }
+
+            if (retry) {
+                remove(fn);
+            }
+        },
+        retry = 60;
+
+    add(fn);
+};

package/src/event/ontick.ts

@@ -0,0 +1,62 @@
+import { STATE_HYDRATING, STATE_NONE } from '~/constants';
+import { raf } from '~/utilities/queue';
+
+
+let tasks = Object.assign(new Set<VoidFunction>(), { running: false });
+
+
+function tick() {
+    if (tasks.size === 0) {
+        tasks.running = false;
+        return;
+    }
+
+    for (let task of tasks) {
+        task();
+    }
+
+    raf.add(tick);
+}
+
+
+const add = (task: VoidFunction) => {
+    tasks.add(task);
+
+    if (!tasks.running) {
+        tasks.running = true;
+        raf.add(tick);
+    }
+};
+
+const remove = (task: VoidFunction) => {
+    tasks.delete(task);
+};
+
+
+export default (element: Element, listener: Function) => {
+    let dispose = () => {
+            remove(fn);
+        },
+        fn = () => {
+            if (state === STATE_HYDRATING) {
+                if (element.isConnected) {
+                    state = STATE_NONE;
+                }
+                else if (retry--) {
+                    return;
+                }
+            }
+
+            if (!element.isConnected) {
+                remove(fn);
+                return;
+            }
+
+            listener(dispose, element);
+        },
+        retry = 60,
+        state = STATE_HYDRATING;
+
+    add(fn);
+};
+export { add, remove };

package/src/types.ts

@@ -16,9 +16,10 @@ type Attributes = {
 } & {
     [key: `aria-${string}`]: string | number | boolean | undefined;
     [key: `data-${string}`]: string | undefined;
-    onconnect?: (element: Element) => void;
-    ondisconnect?: (element: Element) => void;
-    onrender?: (element: Element) => void;
+    onconnect?: <T = Element>(element: T) => void;
+    ondisconnect?: <T = Element>(element: T) => void;
+    onrender?: <T = Element>(element: T) => void;
+    ontick?: <T = Element>(element: T) => void;
 } & Record<PropertyKey, unknown>;
 
 type Effect<T> = () => T extends [] ? Renderable<T>[] : Renderable<T>;