@koine/dom 2.0.0-beta.1 → 2.0.0-beta.11

package/$$.d.ts

@@ -6,5 +6,5 @@
  * @param parent It falls back to `window.document`
  * @param avoidEscape Whether to avoid escaping `:` in the selector string
  */
-export declare function $$<T extends Element = HTMLElement>(selector: string, parent?: HTMLElement | Document, avoidEscape?: boolean): NodeListOf<T>;
+export declare function $$<T extends Element = HTMLElement>(selector: string, parent?: Element | HTMLElement | Document | null, avoidEscape?: boolean): NodeListOf<T>;
 export default $$;

package/$$.mjs

@@ -5,8 +5,7 @@
  * @param string selector DOM selector
  * @param parent It falls back to `window.document`
  * @param avoidEscape Whether to avoid escaping `:` in the selector string
- */
-export function $$(selector, parent, avoidEscape) {
+ */ export function $$(selector, parent, avoidEscape) {
     return (parent ? parent : document).querySelectorAll(avoidEscape ? selector : selector.replace(/:/g, "\\:"));
 }
 export default $$;

package/$.d.ts

@@ -9,5 +9,5 @@
  * const $container = $(".my-section:");
  * const $el = $("[data-some-attr]", $container);
  */
-export declare function $<T extends Element = HTMLElement>(selector: string, parent?: HTMLElement | Document, avoidEscape?: boolean): T;
+export declare function $<T extends Element = HTMLElement>(selector: string, parent?: HTMLElement | Document | null, avoidEscape?: boolean): T;
 export default $;

package/$.mjs

@@ -8,8 +8,7 @@
  * @example <caption>Basic DOM selection</caption>
  * const $container = $(".my-section:");
  * const $el = $("[data-some-attr]", $container);
- */
-export function $(selector, parent, avoidEscape) {
+ */ export function $(selector, parent, avoidEscape) {
     return (parent ? parent : document).querySelector(avoidEscape ? selector : selector.replace(/:/g, "\\:"));
 }
 export default $;

package/$each.mjs

@@ -7,10 +7,9 @@ import $$ from "./$$";
  * @param callback
  * @param parent It falls back to `window.document`
  * @param scope
- */
-export function $each(selector, callback, parent, scope) {
-    var nodes = $$(selector, parent);
-    for (var i = 0; i < nodes.length; i++) {
+ */ export function $each(selector, callback, parent, scope) {
+    const nodes = $$(selector, parent);
+    for(let i = 0; i < nodes.length; i++){
         callback.call(scope, nodes[i], i);
     }
 }

package/_listen-delegation.d.ts

@@ -1,7 +1,8 @@
+import type { AnyDOMEvent, AnyDOMEventTarget, AnyDOMEventType } from "./types";
 /**
  * @internal
  */
-export type EventCallback = (event: Event, desiredTarget: Window | Document | Element) => any;
+export type EventCallback<TTarget extends AnyDOMEventTarget = AnyDOMEventTarget, TType extends AnyDOMEventType = AnyDOMEventType> = (event: AnyDOMEvent<TType>, desiredTarget: TTarget) => any;
 /**
  * @internal
  */
@@ -14,7 +15,7 @@ export type ListenEvent = {
  *
  * @internal
  */
-export declare const activeEvents: Record<Event["type"], ListenEvent[]>;
+export declare const activeEvents: Partial<Record<AnyDOMEventType, ListenEvent[]>>;
 /**
  * Get the index for the listener
  *

package/_listen-delegation.mjs

@@ -6,25 +6,20 @@
  * https://github.com/cferdinandi/events/blob/master/src/js/events/events.js
  *
  * @fileoverview
- */
-import isString from "@koine/utils/isString";
+ */ import isString from "@koine/utils/isString";
 import escapeSelector from "./escapeSelector";
 /**
  * Active events
  *
  * @internal
- */
-export var activeEvents = {};
+ */ export const activeEvents = {};
 /**
  * Get the index for the listener
  *
  * @internal
- */
-export function getIndex(arr, selector, callback) {
-    for (var i = 0; i < arr.length; i++) {
-        if (arr[i].selector === selector &&
-            arr[i].callback.toString() === callback.toString())
-            return i;
+ */ export function getIndex(arr, selector, callback) {
+    for(let i = 0; i < arr.length; i++){
+        if (arr[i].selector === selector && arr[i].callback.toString() === callback.toString()) return i;
     }
     return -1;
 }
@@ -35,20 +30,21 @@ export function getIndex(arr, selector, callback) {
  * @param target The event.target
  * @param selector The selector/element to check the target against
  * @return If not false, run listener and pass the targeted element to use in the callback
- */
-export function getRunTarget(target, selector) {
+ */ export function getRunTarget(target, selector) {
     // @ts-expect-error FIXME: type
-    if (["*", "window", window].includes(selector)) {
+    if ([
+        "*",
+        "window",
+        window
+    ].includes(selector)) {
         return window;
     }
     if ([
         "document",
         "document.documentElement",
         document,
-        document.documentElement,
-        // @ts-expect-error FIXME: type
-    ].includes(selector))
-        return document;
+        document.documentElement
+    ].includes(selector)) return document;
     if (isString(selector)) {
         return target.closest(escapeSelector(selector));
     }
@@ -69,12 +65,10 @@ export function getRunTarget(target, selector) {
  * Handle listeners after event fires
  *
  * @internal
- */
-export function eventHandler(event) {
-    if (!activeEvents[event.type])
-        return;
-    activeEvents[event.type].forEach(function (listener) {
-        var target = getRunTarget(event.target, listener.selector);
+ */ export function eventHandler(event) {
+    // if (!activeEvents[event.type]) return;
+    activeEvents[event.type]?.forEach(function(listener) {
+        const target = getRunTarget(event.target, listener.selector);
         if (!target) {
             return;
         }

package/addClass.mjs

@@ -1,15 +1,12 @@
 /**
  * Add class shortcut
- */
-export function addClass(el, className) {
-    if (className === void 0) { className = ""; }
+ */ export function addClass(el, className = "") {
     if (process.env["NODE_ENV"] !== "production") {
         if (!el) {
             console.warn("[@koine/dom:addClass] unexisting DOM element");
             return;
         }
     }
-    if (el)
-        el.classList.add(className);
+    if (el) el.classList.add(className);
 }
 export default addClass;

package/calculateFixedOffset.mjs

@@ -1,8 +1,7 @@
 import { $each } from "./$each";
-export function calculateFixedOffset(selector) {
-    if (selector === void 0) { selector = "[data-fixed]"; }
-    var fixedOffset = 0;
-    $each(selector, function ($el) {
+export function calculateFixedOffset(selector = "[data-fixed]") {
+    let fixedOffset = 0;
+    $each(selector, ($el)=>{
         fixedOffset += $el.offsetHeight;
     });
     return fixedOffset;

package/createElement.mjs

@@ -5,9 +5,8 @@ import addClass from "./addClass";
  *
  * @param type
  * @param className
- */
-export function createElement(type, className) {
-    var el = document.createElement(type);
+ */ export function createElement(type, className) {
+    const el = document.createElement(type);
     if (className) {
         addClass(el, className);
     }

package/emitEvent.mjs

@@ -1,14 +1,10 @@
 /**
  * Emit event (use only if the targeted browser supports `CustomEvent`s)
- */
-export function emitEvent(type, detail) {
-    if (type === void 0) { type = "customEvent"; }
-    if (detail === void 0) { detail = {}; }
-    if (typeof window.CustomEvent !== "function")
-        return;
+ */ export function emitEvent(type = "customEvent", detail = {}) {
+    if (typeof window.CustomEvent !== "function") return;
     document.dispatchEvent(new CustomEvent(type, {
         bubbles: true,
-        detail: detail,
+        detail
     }));
 }
 export default emitEvent;

package/escapeSelector.mjs

@@ -3,8 +3,7 @@
  * @see https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#Escaping_special_characters
  *
  * @param selector
- */
-export function escapeSelector(selector) {
+ */ export function escapeSelector(selector) {
     return selector.replace(/:/g, "\\:");
 }
 export default escapeSelector;

package/exists.mjs

@@ -2,8 +2,7 @@
  * Checks if passed node exist and is a valid element.
  *
  * @borrows @glidejs/glide/src/utils/dom (source)
- */
-export function exists(node) {
+ */ export function exists(node) {
     if (node && node instanceof window.HTMLElement) {
         return true;
     }

package/forEach.d.ts

@@ -1,9 +1,7 @@
 /**
- * For each, iterate through a NodeList of HTMLElements
+ * For each, iterate through a `NodeList` or an `array` of `HTMLElement`s
  *
- * @param nodes DOM nodes collection
- * @param callback
- * @param scope
+ * @param scope The optional `this` of the callback function
  */
-export declare function forEach<T extends Element = HTMLElement, TScope = object>(nodes: NodeList, callback: (this: TScope, $element: T, index: number) => any, scope?: TScope): void;
+export declare function forEach<T extends HTMLElement, TScope = object>(nodes: NodeListOf<T> | T[], callback: (this: TScope, $element: T, index: number) => any, scope?: TScope): void;
 export default forEach;

package/forEach.mjs

@@ -1,13 +1,34 @@
 /**
- * For each, iterate through a NodeList of HTMLElements
+ * For each, iterate through a `NodeList` or an `array` of `HTMLElement`s
  *
- * @param nodes DOM nodes collection
- * @param callback
- * @param scope
- */
-export function forEach(nodes, callback, scope) {
-    for (var i = 0; i < nodes.length; i++) {
+ * @param scope The optional `this` of the callback function
+ */ export function forEach(nodes, callback, scope) {
+    for(let i = 0; i < nodes.length; i++){
         callback.call(scope, nodes[i], i);
     }
 }
-export default forEach;
+export default forEach; // /**
+ //  * For each, iterate through a `NodeList` or an `array` of `HTMLElement`s
+ //  *
+ //  * @param scope The optional `this` of the callback function
+ //  */
+ // export function forEach<TScope = object>(
+ //   nodes: HTMLElement[],
+ //   callback: (this: TScope, $element: HTMLElement, index: number) => any,
+ //   scope?: TScope
+ // ): void;
+ // export function forEach<TScope = object>(
+ //   nodes: NodeListOf<HTMLElement> | HTMLElement[],
+ //   callback: (this: TScope, $element: HTMLElement, index: number) => any,
+ //   scope?: TScope
+ // ): void;
+ // export function forEach<T extends Element, TScope = object>(
+ //   nodes: NodeListOf<T> | HTMLElement[],
+ //   callback: (this: TScope, $element: T, index: number) => any,
+ //   scope?: TScope
+ // ) {
+ //   for (let i = 0; i < nodes.length; i++) {
+ //     callback.call(scope as TScope, nodes[i] as T, i);
+ //   }
+ // }
+ // export default forEach;

package/getDataAttr.mjs

@@ -5,8 +5,7 @@
  *
  * @param element
  * @param attribute The name of the `data-{attr}`
- */
-export function getDataAttr(element, attribute) {
+ */ export function getDataAttr(element, attribute) {
     // return element.dataset[attribute];
     return element.getAttribute("data-" + attribute);
 }

package/getDocumentHeight.mjs

@@ -2,9 +2,8 @@
  * Determine the document's height
  *
  * @see https://github.com/cferdinandi/smooth-scroll (credits)
- */
-export function getDocumentHeight() {
-    var body = document.body, documentElement = document.documentElement;
+ */ export function getDocumentHeight() {
+    const { body, documentElement } = document;
     return Math.max(body.scrollHeight, documentElement.scrollHeight, body.offsetHeight, documentElement.offsetHeight, body.clientHeight, documentElement.clientHeight);
 }
 export default getDocumentHeight;

package/getHeight.mjs

@@ -1,7 +1,6 @@
 /**
  * Get element height
- */
-export function getHeight(element) {
+ */ export function getHeight(element) {
     return parseInt(window.getComputedStyle(element).height, 10);
 }
 export default getHeight;

package/getListeners.d.ts

@@ -5,5 +5,5 @@
  *
  * @return Active event listeners
  */
-export declare function getListeners(): Record<string, import("./_listen-delegation").ListenEvent[]>;
+export declare function getListeners(): Partial<Record<import("./types").AnyDOMEventType, import("./_listen-delegation").ListenEvent[]>>;
 export default getListeners;

package/getListeners.mjs

@@ -5,13 +5,12 @@ import { activeEvents } from "./_listen-delegation";
  * @category listen-delegation
  *
  * @return Active event listeners
- */
-export function getListeners() {
-    var obj = {};
-    for (var type in activeEvents) {
+ */ export function getListeners() {
+    const obj = {};
+    for(const type in activeEvents){
         // if (activeEvents.hasOwnProperty(type)) {
         obj[type] = activeEvents[type];
-        // }
+    // }
     }
     return obj;
 }

package/getOffset.mjs

@@ -3,16 +3,18 @@
  *
  * @param elem The HTML node element
  * @return Distance from the top and left in pixels
- */
-export function getOffset(elem) {
-    var left = 0;
-    var top = 0;
-    while (elem && !isNaN(elem.offsetLeft) && !isNaN(elem.offsetTop)) {
+ */ export function getOffset(elem) {
+    let left = 0;
+    let top = 0;
+    while(elem && !isNaN(elem.offsetLeft) && !isNaN(elem.offsetTop)){
         left += elem.offsetLeft - elem.scrollLeft;
         top += elem.offsetTop - elem.scrollTop;
         // @ts-expect-error nevermind?
         elem = elem.offsetParent;
     }
-    return { top: top, left: left };
+    return {
+        top,
+        left
+    };
 }
 export default getOffset;

package/getOffsetTop.mjs

@@ -5,11 +5,10 @@
  *
  * @param elem The HTML node element
  * @return Distance from the top in pixels
- */
-export function getOffsetTop(elem) {
-    var location = 0;
+ */ export function getOffsetTop(elem) {
+    let location = 0;
     if (elem.offsetParent) {
-        while (elem) {
+        while(elem){
             location += elem.offsetTop;
             // @ts-expect-error nevermind?
             elem = elem.offsetParent;

package/getOffsetTopSlim.mjs

@@ -6,8 +6,7 @@
  *
  * @param elem The HTML node element
  * @return Distance from the top in pixels
- */
-export function getOffsetTopSlim(elem) {
+ */ export function getOffsetTopSlim(elem) {
     return elem.getBoundingClientRect().top + window.scrollY;
 }
 export default getOffsetTopSlim;

package/getScrollbarWidth.mjs

@@ -1,7 +1,6 @@
 /**
  * Get scrollbar's current width
- */
-export function getScrollbarWidth(element) {
+ */ export function getScrollbarWidth(element) {
     return window.innerWidth - (element || document.documentElement).clientWidth;
 }
 export default getScrollbarWidth;

package/getStyleValue.mjs

@@ -3,8 +3,7 @@
  *
  * @param el The element to compute
  * @param prop The style property
- */
-export function getStyleValue(el, prop) {
+ */ export function getStyleValue(el, prop) {
     return getComputedStyle(el, null).getPropertyValue(prop);
 }
 export default getStyleValue;

package/getVisualBackgroundColor.mjs

@@ -1,18 +1,16 @@
 /**
  * Get the background color of an element eventually looking recursively into
  * its parents, if nothing is found it returns a `#fff` background
- */
-export function getVisualBackgroundColor(elem) {
-    if (!elem)
-        return "#fff";
-    var transparent = "rgba(0, 0, 0, 0)";
-    var transparentIE11 = "transparent";
+ */ export function getVisualBackgroundColor(elem) {
+    if (!elem) return "#fff";
+    const transparent = "rgba(0, 0, 0, 0)";
+    const transparentIE11 = "transparent";
     // if (!elem) return transparent;
-    var bg = window.getComputedStyle(elem).backgroundColor;
+    const bg = window.getComputedStyle(elem).backgroundColor;
     if (bg === transparent || bg === transparentIE11) {
-        var parent_1 = elem.parentElement;
-        if (parent_1) {
-            return getVisualBackgroundColor(parent_1);
+        const parent = elem.parentElement;
+        if (parent) {
+            return getVisualBackgroundColor(parent);
         }
         return "#fff";
     }

package/injectCss.mjs

@@ -1,10 +1,7 @@
 /**
  * Inject css
- */
-export function injectCss(id, cssString, root) {
-    if (cssString === void 0) { cssString = ""; }
-    if (root === void 0) { root = document; }
-    var styleblock;
+ */ export function injectCss(id, cssString = "", root = document) {
+    let styleblock;
     styleblock = root.getElementById(id);
     if (!styleblock) {
         styleblock = root.createElement("style");

package/isHidden.mjs

@@ -1,7 +1,6 @@
 /**
  * Is element hidden?
- */
-export function isHidden(el) {
+ */ export function isHidden(el) {
     return !el || el.offsetParent === null;
 }
 export default isHidden;

package/isInViewport.mjs

@@ -5,14 +5,8 @@
  *
  * @param elem The element
  * @return Returns true if element is in the viewport
- */
-export function isInViewport(elem) {
-    var distance = elem.getBoundingClientRect();
-    return (distance.top >= 0 &&
-        distance.left >= 0 &&
-        distance.bottom <=
-            (window.innerHeight || document.documentElement.clientHeight) &&
-        distance.right <=
-            (window.innerWidth || document.documentElement.clientWidth));
+ */ export function isInViewport(elem) {
+    const distance = elem.getBoundingClientRect();
+    return distance.top >= 0 && distance.left >= 0 && distance.bottom <= (window.innerHeight || document.documentElement.clientHeight) && distance.right <= (window.innerWidth || document.documentElement.clientWidth);
 }
 export default isInViewport;

package/isNodeList.mjs

@@ -2,13 +2,8 @@
  * Is node list
  *
  * @param nodes The object to check
- */
-export function isNodeList(nodes) {
-    var stringRepr = Object.prototype.toString.call(nodes);
-    return (typeof nodes === "object" &&
-        /^\[object (HTMLCollection|NodeList|Object)\]$/.test(stringRepr) &&
-        typeof nodes.length === "number" &&
-        (nodes.length === 0 ||
-            (typeof nodes[0] === "object" && nodes[0].nodeType > 0)));
+ */ export function isNodeList(nodes) {
+    const stringRepr = Object.prototype.toString.call(nodes);
+    return typeof nodes === "object" && /^\[object (HTMLCollection|NodeList|Object)\]$/.test(stringRepr) && typeof nodes.length === "number" && (nodes.length === 0 || typeof nodes[0] === "object" && nodes[0].nodeType > 0);
 }
 export default isNodeList;

package/isTotallyScrolled.mjs

@@ -3,8 +3,7 @@
  *
  * @see https://github.com/willmcpo/body-scroll-lock/blob/master/src/bodyScrollLock.js#L116
  * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight#Problems_and_solutions
- */
-export function isTotallyScrolled(el) {
+ */ export function isTotallyScrolled(el) {
     return el ? el.scrollHeight - el.scrollTop <= el.clientHeight : false;
 }
 export default isTotallyScrolled;

package/listen.d.ts

@@ -1,4 +1,5 @@
 import { type EventCallback } from "./_listen-delegation";
+import type { AnyDOMEventTarget, AnyDOMEventType } from "./types";
 /**
  * Listen an event
  *
@@ -8,5 +9,5 @@ import { type EventCallback } from "./_listen-delegation";
  * @param selector The selector to run the event on
  * @param callback The function to run when the event fires
  */
-export declare function listen(types: string, selector: string, callback: EventCallback): void;
+export declare function listen<TTypes extends AnyDOMEventType, TTarget extends AnyDOMEventTarget = AnyDOMEventTarget>(types: TTypes, selector: string, callback: EventCallback<TTarget, TTypes>): void;
 export default listen;

package/listen.mjs

@@ -1,4 +1,4 @@
-import { activeEvents, eventHandler, } from "./_listen-delegation";
+import { activeEvents, eventHandler } from "./_listen-delegation";
 import { on } from "./on";
 // import { off } from "./off";
 /**
@@ -9,13 +9,15 @@ import { on } from "./on";
  * @param types The event type or types (comma separated)
  * @param selector The selector to run the event on
  * @param callback The function to run when the event fires
- */
-export function listen(types, selector, callback) {
+ */ export function listen(types, // | `${TTypes},${TTypes}`
+// | `${TTypes},${TTypes},${TTypes}`
+// | `${TTypes},${TTypes},${TTypes},${TTypes}`
+// | `${TTypes},${TTypes},${TTypes},${TTypes},${TTypes}`,
+selector, callback) {
     // Make sure there's a selector and callback
-    if (!selector || !callback)
-        return;
+    if (!selector || !callback) return;
     // Loop through each event type
-    types.split(",").forEach(function (type) {
+    types.split(",").forEach(function(type) {
         // Remove whitespace
         type = type.trim();
         // If no event of this type yet, setup
@@ -24,9 +26,10 @@ export function listen(types, selector, callback) {
             on(window, type, eventHandler, true);
         }
         // Push to active events
-        activeEvents[type].push({
+        activeEvents[type]?.push({
             selector: selector,
-            callback: callback,
+            // @ts-expect-error FIXME: type...
+            callback: callback
         });
     });
 }

package/listenLoaded.mjs

@@ -3,9 +3,8 @@ import { on } from "./on";
  * Fires a callback when the DOM content is loaded
  *
  * @see https://mathiasbynens.be/notes/settimeout-onload
- */
-export function listenLoaded(handler) {
+ */ export function listenLoaded(handler) {
     on(document, "DOMContentLoaded", handler);
-    // document.addEventListener("DOMContentLoaded", setTimeout(handler, 4));
+// document.addEventListener("DOMContentLoaded", setTimeout(handler, 4));
 }
 export default listenLoaded;

package/listenOnce.mjs

@@ -9,10 +9,9 @@ import { unlisten } from "./unlisten";
  * @param types The event type or types (comma separated)
  * @param selector The selector to run the event on
  * @param callback The function to run when the event fires
- */
-export function listenOnce(types, selector, callback) {
+ */ export function listenOnce(types, selector, callback) {
     listen(types, selector, function temp(event) {
-        var target = getRunTarget(event.target, selector);
+        const target = getRunTarget(event.target, selector);
         callback(event, target || window);
         unlisten(types, selector, temp);
     });

package/listenResize.mjs

@@ -3,6 +3,5 @@ import { on } from "./on";
  * Listen element's (`window` by default) _scroll_ event
  *
  * @returns An automatic unbinding function to run to deregister the listener upon call
- */
-export var listenResize = function (handler, el) { return on(el || window, "resize", handler); };
+ */ export const listenResize = (handler, el)=>on(el || window, "resize", handler);
 export default listenResize;