@thednp/shorty 2.0.7 → 2.0.8

package/dist/shorty.d.ts

@@ -11,12 +11,12 @@ declare interface AbstractView {
 }
 
 /**
- * Add one or more CSS classes to `HTMLElement.classList`.
+ * Add one or more CSS classes to `Element.classList`.
  *
  * @param element target
  * @param classNAME to add
  */
-export declare const addClass: (element: HTMLElement, ...classNAME: string[]) => void;
+export declare const addClass: (element: Element, ...classNAME: string[]) => void;
 
 /**
  * A global namespace for 'addEventListener' string.
@@ -39,7 +39,7 @@ export declare const animationDuration = "animationDuration";
  */
 export declare const animationEndEvent = "animationend";
 
-declare interface AnimationEvent_2<T = Element>
+declare interface AnimationEvent_2<T extends EventTarget = HTMLElement>
 extends NativeEvent<T, NativeAnimationEvent> {
     animationName: string;
     elapsedTime: number;
@@ -47,7 +47,10 @@ extends NativeEvent<T, NativeAnimationEvent> {
 }
 export { AnimationEvent_2 as AnimationEvent }
 
-export declare type AnimationEventHandler<T = Element> = EventHandler<T, AnimationEvent_2<T>>;
+export declare type AnimationEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+AnimationEvent_2<T>
+>;
 
 /**
  * A global namespace for 'animationName' string.
@@ -210,7 +213,20 @@ export declare interface BoundingClientRect {
     y: number;
 }
 
-export declare interface ChangeEvent<T = FormControl> extends FormEvent<T> {
+/**
+ * Transform a string to camel case.
+ * @param input source string
+ */
+export declare const camelCase: (input: string) => string;
+
+/**
+ * Capitalize first character in a string.
+ * @param input source string
+ */
+export declare const capitalize: (input: string) => string;
+
+export declare interface ChangeEvent<T extends EventTarget = FormControl>
+extends FormEvent<T> {
     target: EventTarget & T;
 }
 
@@ -219,15 +235,21 @@ export declare interface ChangeEvent<T = FormControl> extends FormEvent<T> {
  */
 export declare const changeEvent = "change";
 
-export declare type ChangeEventHandler<T = Element> = EventHandler<T, ChangeEvent<T>>;
+export declare type ChangeEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+ChangeEvent<T>
+>;
 
-declare interface ClipboardEvent_2<T = Element>
+declare interface ClipboardEvent_2<T extends EventTarget = HTMLElement>
 extends NativeEvent<T, NativeClipboardEvent> {
     clipboardData: DataTransfer;
 }
 export { ClipboardEvent_2 as ClipboardEvent }
 
-export declare type ClipboardEventHandler<T = Element> = EventHandler<T, ClipboardEvent_2<T>>;
+export declare type ClipboardEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+ClipboardEvent_2<T>
+>;
 
 /**
  * Shortcut for `HTMLElement.closest` method which also works
@@ -236,19 +258,20 @@ export declare type ClipboardEventHandler<T = Element> = EventHandler<T, Clipboa
  *
  * @see https://stackoverflow.com/q/54520554/803358
  *
- * @param element Element to look into
- * @param selector the selector name
+ * @param element target Element to check
+ * @param selector the selector string
  * @return the query result
  */
-export declare const closest: <T extends Element = HTMLElement>(element: T, selector: string) => HTMLElement | null;
+export declare const closest: <T extends Element>(element: T, selector: string) => T | null;
 
-declare interface CompositionEvent_2<T = Element>
+declare interface CompositionEvent_2<T extends EventTarget = HTMLElement>
 extends NativeEvent<T, NativeCompositionEvent> {
     data: string;
 }
 export { CompositionEvent_2 as CompositionEvent }
 
-export declare type CompositionEventHandler<T = Element> = EventHandler<
+export declare type CompositionEventHandler<T extends EventTarget = HTMLElement> =
+EventHandler<
 T,
 CompositionEvent_2<T>
 >;
@@ -282,7 +305,7 @@ export declare const createElement: <T extends HTMLElement>(param?: string | Par
 
 /**
  * Shortie for `document.createElementNS` method
- * which allows you to create a new `HTMLElement` for a given `tagName`
+ * which allows you to create a new `Element` for a given `tagName`
  * or based on an object with specific non-readonly attributes with string values:
  * `id`, `className`, `textContent`, `style`, etc.
  * Note: some elements resulted from this function call may not be compatible with
@@ -290,11 +313,11 @@ export declare const createElement: <T extends HTMLElement>(param?: string | Par
  *
  * @see https://developer.mozilla.org/en-US/docs/Web/API/Document/createElementNS
  *
- * @param ns `namespaceURI` to associate with the new `HTMLElement`
+ * @param ns `namespaceURI` to associate with the new `Element`
  * @param param `tagName` or object
- * @return a new `HTMLElement`
+ * @return a new `Element`
  */
-export declare const createElementNS: <T extends Element = HTMLElement>(ns: string, param?: string | Partial<T>) => T | undefined;
+export declare const createElementNS: <T extends Element>(ns: string, param?: string | Partial<T>) => T | undefined;
 
 export declare interface CSS4Declaration
 extends Exclude<() => string | symbol, CSSStyleDeclaration> {
@@ -316,7 +339,7 @@ export declare interface CustomElement extends HTMLElement {
  * @see https://github.com/thednp/bootstrap.native/blob/master/src/components/base-component.js
  */
 export declare const Data: {
-    data: Map<string, Map<HTMLElement, unknown>>;
+    data: Map<string, Map<Element, unknown>>;
     /**
      * Sets web components data.
      *
@@ -324,14 +347,14 @@ export declare const Data: {
      * @param component the component's name or a unique key
      * @param instance the component instance
      */
-    set: <T>(element: HTMLElement, component: string, instance: T) => void;
+    set: <T>(element: Element, component: string, instance: T) => void;
     /**
      * Returns all instances for specified component.
      *
      * @param component the component's name or a unique key
      * @returns all the component instances
      */
-    getAllFor: <T>(component: string) => Map<HTMLElement, T> | null;
+    getAllFor: <T>(component: string) => Map<Element, T> | null;
     /**
      * Returns the instance associated with the target.
      *
@@ -339,14 +362,14 @@ export declare const Data: {
      * @param component the component's name or a unique key
      * @returns the instance
      */
-    get: <T>(element: HTMLElement, component: string) => T | null;
+    get: <T>(element: Element, component: string) => T | null;
     /**
      * Removes web components data.
      *
      * @param element target element
      * @param component the component's name or a unique key
      */
-    remove: <T>(element: HTMLElement, component: string) => void;
+    remove: <T>(element: Element, component: string) => void;
 };
 
 /**
@@ -415,12 +438,16 @@ export declare const dragenterEvent = "dragenter";
  */
 export declare const dragEvent = "drag";
 
-declare interface DragEvent_2<T = Element> extends MouseEvent_2<T, NativeDragEvent> {
+declare interface DragEvent_2<T extends EventTarget = HTMLElement>
+extends MouseEvent_2<T, NativeDragEvent> {
     dataTransfer: DataTransfer;
 }
 export { DragEvent_2 as DragEvent }
 
-export declare type DragEventHandler<T = Element> = EventHandler<T, DragEvent_2<T>>;
+export declare type DragEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+DragEvent_2<T>
+>;
 
 /**
  * A global namespace for `dragleave` event.
@@ -444,23 +471,26 @@ export declare const dragstartEvent = "dragstart";
  * @param element target
  * @param handler `animationend` callback
  */
-export declare const emulateAnimationEnd: (element: HTMLElement, handler: EventListener) => void;
+export declare const emulateAnimationEnd: (element: Element, handler: EventListener) => void;
 
 /**
  * Utility to make sure callbacks are consistently
  * called when transition ends.
  *
- * @param element event target
+ * @param element element target
  * @param handler `transitionend` callback
  */
-export declare const emulateTransitionEnd: (element: HTMLElement, handler: EventListener) => void;
+export declare const emulateTransitionEnd: (element: Element, handler: EventListener) => void;
 
 /**
  * A global namespace for `error` event.
  */
 export declare const errorEvent = "error";
 
-declare type EventHandler<T = Element, E = Event | NativeEvent<T>> = (event: E) => void;
+declare type EventHandler<
+T extends EventTarget = HTMLElement,
+E = Event | NativeEvent<T>,
+> = (event: E) => void;
 
 /**
  * Shortcut for `Float32Array.from()` static method.
@@ -481,7 +511,7 @@ export declare const Float64ArrayFrom: (arr: ArrayLike<number> | Iterable<number
 declare type Fn = (...args: unknown[]) => unknown;
 
 /**
- * Shortie for `HTMLElement.focus()` method.
+ * Shortie for `HTMLOrSVGElement.focus()` method.
  *
  * @param element is the target
  * @param options allows to pass additional options such as `preventScroll: boolean`
@@ -498,14 +528,19 @@ export declare const focusableSelector = "a[href], button, input, textarea, sele
  */
 export declare const focusEvent = "focus";
 
-declare interface FocusEvent_2<T = Element, R = Element>
-extends NativeEvent<T, NativeFocusEvent> {
+declare interface FocusEvent_2<
+T extends EventTarget = HTMLElement,
+R extends Element = HTMLElement,
+> extends NativeEvent<T, NativeFocusEvent> {
     relatedTarget: (EventTarget & R) | null;
     target: EventTarget & T;
 }
 export { FocusEvent_2 as FocusEvent }
 
-export declare type FocusEventHandler<T = Element> = EventHandler<T, FocusEvent_2<T>>;
+export declare type FocusEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+FocusEvent_2<T>
+>;
 
 /**
  * A global namespace for focus event names.
@@ -527,9 +562,12 @@ export declare const focusoutEvent = "focusout";
 
 declare type FormControl = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
 
-export declare type FormEvent<T = FormControl> = NativeEvent<T>;
+export declare type FormEvent<T extends EventTarget = FormControl> = NativeEvent<T>;
 
-export declare type FormEventHandler<T = Element> = EventHandler<T, FormEvent<T>>;
+export declare type FormEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+FormEvent<T>
+>;
 
 /**
  * A global namespace for `gesturechange` event.
@@ -547,26 +585,26 @@ export declare const gestureendEvent = "gestureend";
 export declare const gesturestartEvent = "gesturestart";
 
 /**
- * Shortcut for `HTMLElement.getAttribute()` method.
+ * Shortcut for `Element.getAttribute()` method.
  *
  * @param element target element
  * @param att attribute name
  * @returns attribute value
  */
-export declare const getAttribute: (element: HTMLElement, att: string) => string | null;
+export declare const getAttribute: (element: Element, att: string) => string | null;
 
 /**
- * Shortcut for `HTMLElement.getAttributeNS()` method.
+ * Shortcut for `Element.getAttributeNS()` method.
  *
  * @param ns attribute namespace
  * @param element target element
  * @param att attribute name
  * @returns attribute value
  */
-export declare const getAttributeNS: (ns: string, element: HTMLElement, att: string) => string | null;
+export declare const getAttributeNS: (ns: string, element: Element, att: string) => string | null;
 
 /**
- * Returns the bounding client rect of a target `HTMLElement`.
+ * Returns the bounding client rect of a target `Element`.
  *
  * @see https://github.com/floating-ui/floating-ui
  *
@@ -574,7 +612,7 @@ export declare const getAttributeNS: (ns: string, element: HTMLElement, att: str
  * @param includeScale when *true*, the target scale is also computed
  * @returns the bounding client rect object
  */
-export declare const getBoundingClientRect: (element: HTMLElement, includeScale?: boolean) => BoundingClientRect;
+export declare const getBoundingClientRect: (element: Element, includeScale?: boolean) => BoundingClientRect;
 
 /**
  * Returns an `Array` of `Node` elements that are registered as
@@ -619,7 +657,7 @@ export declare const getDocumentElement: (node?: Node | Document | Window) => HT
  * @param node the reference node
  * @returns the `<head>` of the node's parent document
  */
-export declare const getDocumentHead: (node?: Node | Document | Window) => HTMLElement & HTMLHeadElement;
+export declare const getDocumentHead: (node?: Node | Document | Window) => HTMLHeadElement;
 
 /**
  * Utility to get the computed `animationDelay`
@@ -628,16 +666,16 @@ export declare const getDocumentHead: (node?: Node | Document | Window) => HTMLE
  * @param element target
  * @return the `animationDelay` value in miliseconds
  */
-export declare const getElementAnimationDelay: (element: HTMLElement) => number;
+export declare const getElementAnimationDelay: (element: Element) => number;
 
 /**
  * Utility to get the computed `animationDuration`
- * from `HTMLElement` in miliseconds.
+ * from `Element` in miliseconds.
  *
  * @param element target
  * @return the `animationDuration` value in miliseconds
  */
-export declare const getElementAnimationDuration: (element: HTMLElement) => number;
+export declare const getElementAnimationDuration: (element: Element) => number;
 
 /**
  * Returns an `HTMLElement` that matches the id in the document.
@@ -648,40 +686,41 @@ export declare const getElementAnimationDuration: (element: HTMLElement) => numb
  * @param context an element in it's document or document
  * @returns the requested element
  */
-export declare const getElementById: <T extends HTMLElement>(id: string, context?: Node) => T;
+export declare const getElementById: (id: string, context?: Node) => HTMLElement | null;
 
 /**
- * Shortcut for `HTMLElement.getElementsByClassName` method. Some `Node` elements
+ * Shortcut for `Element.getElementsByClassName` method. Some `Node` elements
  * like `ShadowRoot` do not support `getElementsByClassName`.
  *
  * @param selector the class name
  * @param parent optional Element to look into
  * @return the 'HTMLCollection'
  */
-export declare const getElementsByClassName: <T extends HTMLElement>(selector: string, parent?: ParentNode) => HTMLCollectionOf<T>;
+export declare const getElementsByClassName: <T extends Element>(selector: string, parent?: ParentNode) => HTMLCollectionOf<T>;
 
 /**
- * Shortcut for `HTMLElement.getElementsByTagName` method. Some `Node` elements
+ * Shortcut for `Element.getElementsByTagName` method. Some `Node` elements
  * like `ShadowRoot` do not support `getElementsByTagName`.
  *
  * @param selector the tag name
  * @param parent optional Element to look into
  * @return the 'HTMLCollection'
  */
-export declare const getElementsByTagName: <T extends HTMLElement>(selector: string, parent?: ParentNode) => HTMLCollectionOf<T>;
+export declare const getElementsByTagName: <T extends Element>(selector: string, parent?: ParentNode) => HTMLCollectionOf<T>;
 
 /**
  * Shortcut for `window.getComputedStyle(element).propertyName`
  * static method.
  *
- * * If `element` parameter is not an `HTMLElement`, `getComputedStyle`
+ * * If `element` parameter is not an `Element`, `getComputedStyle`
  * throws a `ReferenceError`.
  *
- * @param element target
+ * @param element target `Element`
  * @param property the css property
+ * @param pseudoElt pseudo-elements
  * @return the css property value
  */
-export declare const getElementStyle: (element: HTMLElement, property: string) => string;
+export declare const getElementStyle: (element: Element, property: string, pseudoElt?: string | null) => string;
 
 /**
  * Utility to get the computed `transitionDelay`
@@ -690,7 +729,7 @@ export declare const getElementStyle: (element: HTMLElement, property: string) =
  * @param element target
  * @return the `transitionDelay` value in miliseconds
  */
-export declare const getElementTransitionDelay: (element: HTMLElement) => number;
+export declare const getElementTransitionDelay: (element: Element) => number;
 
 /**
  * Utility to get the computed `transitionDuration`
@@ -699,36 +738,53 @@ export declare const getElementTransitionDelay: (element: HTMLElement) => number
  * @param element target
  * @return the `transitionDuration` value in miliseconds
  */
-export declare const getElementTransitionDuration: (element: HTMLElement) => number;
+export declare const getElementTransitionDuration: (element: Element) => number;
 
 /**
  * An alias for `Data.get()`.
  */
-export declare const getInstance: <T>(target: HTMLElement, component: string) => T | null;
+export declare const getInstance: <T>(target: Element, component: string) => T | null;
 
 /**
- * Returns an `{x,y}` object with the target
- * `HTMLElement` / `Node` scroll position.
+ * Returns the value of `node.nodeName` for the given node.
+ * @param node target node
+ * @returns the node name
+ */
+export declare const getNodeName: (node: Node | Window) => string;
+
+/**
+ * Returns an `{x, y}` object with the target
+ * `Element` / `Node` scroll position.
  *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param element target node / element
  * @returns the scroll tuple
  */
-export declare const getNodeScroll: (element: HTMLElement | Window) => {
+export declare const getNodeScroll: (element: Element | Window) => {
     x: number;
     y: number;
 };
 
+/**
+ * Returns the `offsetParent` for a given target.
+ *
+ * @see https://github.com/floating-ui/floating-ui
+ *
+ * @param element the target node
+ * @returns the offset parent node
+ */
+export declare const getOffsetParent: (element: Element) => Element | Window;
+
 /**
  * Returns the `parentNode` also going through `ShadowRoot`.
  *
  * @see https://github.com/floating-ui/floating-ui
  *
- * @param {Node} node the target node
- * @returns {Node} the apropriate parent node
+ * @param node the target node
+ * @returns the apropriate parent node
  */
-export declare const getParentNode: (node: Node) => Node | ParentNode;
+export declare const getParentNode: (node: Node) => ParentNode;
 
 /**
  * Returns the rect relative to a given offset parent and its scroll position.
@@ -740,7 +796,7 @@ export declare const getParentNode: (node: Node) => Node | ParentNode;
  * @param scroll the offsetParent scroll position
  * @returns a DOMRect like object
  */
-export declare const getRectRelativeToOffsetParent: (element: HTMLElement, offsetParent: HTMLElement, scroll: {
+export declare const getRectRelativeToOffsetParent: (element: Element, offsetParent: Element | Window, scroll: {
     x: number;
     y: number;
 }) => OffsetRect;
@@ -752,7 +808,7 @@ export declare const getRectRelativeToOffsetParent: (element: HTMLElement, offse
  * @param key optional identifier key
  * @returns an existing or new unique ID
  */
-export declare const getUID: (element: HTMLElement, key?: string) => number;
+export declare const getUID: (element: Element, key?: string) => number;
 
 /**
  * Returns the `Window` object of a target node.
@@ -765,40 +821,40 @@ export declare const getUID: (element: HTMLElement, key?: string) => number;
 export declare const getWindow: (node?: Node) => Window;
 
 /**
- * Shortcut for `HTMLElement.hasAttribute()` method.
+ * Shortcut for `Element.hasAttribute()` method.
  *
  * @param element target element
  * @param att attribute name
  * @returns the query result
  */
-export declare const hasAttribute: (element: HTMLElement, att: string) => boolean;
+export declare const hasAttribute: (element: Element, att: string) => boolean;
 
 /**
- * Shortcut for `HTMLElement.hasAttributeNS()` method.
+ * Shortcut for `Element.hasAttributeNS()` method.
  *
  * @param ns attribute namespace
  * @param element target element
  * @param att attribute name
  * @returns the query result
  */
-export declare const hasAttributeNS: (ns: string, element: HTMLElement, att: string) => boolean;
+export declare const hasAttributeNS: (ns: string, element: Element, att: string) => boolean;
 
 /**
- * Check class in `HTMLElement.classList`.
+ * Check class in `Element.classList`.
  *
  * @param element target
  * @param classNAME to check
  */
-export declare const hasClass: (element: HTMLElement, classNAME: string) => boolean;
+export declare const hasClass: (element: Element, classNAME: string) => boolean;
 
 /**
  * Utility to check if a designated element is affected by focus trap;
  * @param target
  */
-export declare const hasFocusTrap: (target: HTMLElement) => boolean;
+export declare const hasFocusTrap: (target: Element) => boolean;
 
 /**
- * A global `boolean` getter for Apple browsers.
+ * An accessor that checks for Apple browsers.
  */
 export declare const isApple: () => boolean;
 
@@ -839,43 +895,28 @@ export declare const isDocument: (obj?: unknown) => obj is Document;
 /**
  * Checks if an object is an `Element`.
  *
- * @see https://dom.spec.whatwg.org/#node
- *
- * ```
- * ELEMENT_NODE = 1;
- * ATTRIBUTE_NODE = 2;
- * TEXT_NODE = 3;
- * CDATA_SECTION_NODE = 4;
- * ENTITY_REFERENCE_NODE = 5; // legacy
- * ENTITY_NODE = 6; // legacy
- * PROCESSING_INSTRUCTION_NODE = 7;
- * COMMENT_NODE = 8;
- * DOCUMENT_NODE = 9;
- * DOCUMENT_TYPE_NODE = 10;
- * DOCUMENT_FRAGMENT_NODE = 11;
- * ```
  * @param element the target object
  * @returns the query result
  */
 export declare const isElement: (element?: unknown) => element is Element;
 
 /**
- * Utility to determine if an `HTMLElement`
+ * Utility to determine if an `Element`
  * is partially visible in viewport.
  *
  * @param element target
  * @return the query result
  */
-export declare const isElementInScrollRange: (element?: HTMLElement) => boolean;
+export declare const isElementInScrollRange: (element?: Element) => boolean;
 
 /**
- * Utility to determine if an `HTMLElement`
+ * Utility to determine if an `Element`
  * is fully visible in the viewport.
  *
  * @param element target
  * @return the query result
  */
-export declare const isElementInViewport: (element?: HTMLElement) => boolean;
+export declare const isElementInViewport: (element?: Element) => boolean;
 
 /**
  * Checks if an object is an `Array` in which all items are `Element`.
@@ -883,10 +924,10 @@ export declare const isElementInViewport: (element?: HTMLElement) => boolean;
  * @param obj the target object
  * @returns the query result
  */
-export declare const isElementsArray: (obj?: unknown) => obj is HTMLElement[];
+export declare const isElementsArray: (obj?: unknown) => obj is Element[];
 
 /**
- * A global boolean for Gecko browsers. When writing this file,
+ * An accessor that checks for Gecko browsers. When writing this file,
  * Gecko was not supporting `userAgentData`.
  */
 export declare const isFirefox: () => boolean;
@@ -953,7 +994,7 @@ export declare const isMap: (obj?: unknown) => obj is Map<unknown, unknown>;
 export declare const isMedia: (element?: unknown) => element is SVGElement | HTMLImageElement | HTMLVideoElement | HTMLCanvasElement;
 
 /**
- * A global `boolean` for mobile detection.
+ * An accessor that checks for mobile detection.
  */
 export declare const isMobile: () => boolean;
 
@@ -961,6 +1002,20 @@ export declare const isMobile: () => boolean;
  * Checks if an object is a `Node`.
  *
  * @param node the target object
+ * @see https://dom.spec.whatwg.org/#node
+ *
+ * ```
+ * ELEMENT_NODE = 1;
+ * ATTRIBUTE_NODE = 2;
+ * TEXT_NODE = 3;
+ * CDATA_SECTION_NODE = 4;
+ * ENTITY_REFERENCE_NODE = 5; // legacy
+ * ENTITY_NODE = 6; // legacy
+ * PROCESSING_INSTRUCTION_NODE = 7;
+ * COMMENT_NODE = 8;
+ * DOCUMENT_NODE = 9;
+ * DOCUMENT_TYPE_NODE = 10;
+ * DOCUMENT_FRAGMENT_NODE = 11;
  * @returns the query result
  */
 export declare const isNode: (node?: unknown) => node is Node;
@@ -999,14 +1054,14 @@ export declare const isObject: (obj?: unknown) => obj is object;
 export declare const isRTL: (node?: Node) => boolean;
 
 /**
- * Checks if a target `HTMLElement` is affected by scale.
+ * Checks if a target `Element` is affected by scale.
  *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param element target
  * @returns the query result
  */
-export declare const isScaledElement: (element?: HTMLElement) => boolean;
+export declare const isScaledElement: (element?: Element) => boolean;
 
 /**
  * Check if target is a `ShadowRoot`.
@@ -1051,6 +1106,8 @@ export declare const isTableElement: (element?: unknown) => element is HTMLTable
  */
 export declare const isWeakMap: (obj?: unknown) => obj is WeakMap<WeakKey, unknown>;
 
+export declare const isWebKit: () => boolean;
+
 /**
  * Check if a target object is `Window`.
  * => equivalent to `object instanceof Window`
@@ -1060,6 +1117,12 @@ export declare const isWeakMap: (obj?: unknown) => obj is WeakMap<WeakKey, unkno
  */
 export declare const isWindow: (obj?: unknown) => obj is Window;
 
+/**
+ * Transform a string to kebab case.
+ * @param input source string
+ */
+export declare const kebabCase: (input: string) => string;
+
 /**
  * A global namespace for `Alt` key.
  * e.which = 18
@@ -1096,7 +1159,8 @@ export declare const keyArrowUp = "ArrowUp";
  */
 export declare const keyBackspace = "Backspace";
 
-declare interface KeyboardEvent_2<T = Element> extends UIEvent_2<T, NativeKeyboardEvent> {
+declare interface KeyboardEvent_2<T extends EventTarget = HTMLElement>
+extends UIEvent_2<T, NativeKeyboardEvent> {
     altKey: boolean;
     /** @deprecated */
     charCode: number;
@@ -1122,7 +1186,10 @@ declare interface KeyboardEvent_2<T = Element> extends UIEvent_2<T, NativeKeyboa
 }
 export { KeyboardEvent_2 as KeyboardEvent }
 
-export declare type KeyboardEventHandler<T = Element> = EventHandler<T, KeyboardEvent_2<T>>;
+export declare type KeyboardEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+KeyboardEvent_2<T>
+>;
 
 /**
  * A global namespace for keyboard event keys.
@@ -1305,7 +1372,8 @@ export declare const mousedownEvent = "mousedown";
  */
 export declare const mouseenterEvent = "mouseenter";
 
-declare interface MouseEvent_2<T = Element, E = NativeMouseEvent> extends UIEvent_2<T, E> {
+declare interface MouseEvent_2<T extends EventTarget = HTMLElement, E = NativeMouseEvent>
+extends UIEvent_2<T, E> {
     altKey: boolean;
     button: number;
     buttons: number;
@@ -1328,7 +1396,10 @@ declare interface MouseEvent_2<T = Element, E = NativeMouseEvent> extends UIEven
 }
 export { MouseEvent_2 as MouseEvent }
 
-export declare type MouseEventHandler<T = Element> = EventHandler<T, MouseEvent_2<T>>;
+export declare type MouseEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+MouseEvent_2<T>
+>;
 
 /**
  * A global namespace for `hover` event.
@@ -1410,9 +1481,16 @@ declare type NativeDragEvent = DragEvent_2;
  * This might be a child element to the element on which the event listener is registered.
  * If you thought this should be `EventTarget & T`, see https://github.com/DefinitelyTyped/DefinitelyTyped/issues/11508#issuecomment-256045682
  */
-export declare type NativeEvent<T = Element, E = Event> = BaseEvent<E, T, T>;
+export declare type NativeEvent<T extends EventTarget = HTMLElement, E = Event> = BaseEvent<
+E,
+T,
+T
+>;
 
-export declare type NativeEventHandler<T = Element> = EventHandler<T, NativeEvent<T>>;
+export declare type NativeEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+NativeEvent<T>
+>;
 
 /**
  * A global namespace for all browser native events.
@@ -1515,7 +1593,7 @@ export declare const noop: () => void;
  */
 export declare const normalizeOptions: <T extends {
     [key: string]: unknown;
-}>(element: HTMLElement, defaultOps: T, inputOps: Partial<T>, ns?: string) => T;
+}>(element: Element, defaultOps: T, inputOps: Partial<T>, ns?: string) => T;
 
 /**
  * Utility to normalize component options
@@ -1640,7 +1718,7 @@ export declare const orientationchangeEvent = "orientationchange";
 
 export declare interface OriginalEvent extends CustomEvent<unknown> {
     readonly type: string;
-    relatedTarget?: EventTarget;
+    relatedTarget?: EventTarget & HTMLElement;
 }
 
 /**
@@ -1658,7 +1736,8 @@ export declare const pointercancelEvent = "pointercancel";
  */
 export declare const pointerdownEvent = "pointerdown";
 
-declare interface PointerEvent_2<T = Element> extends MouseEvent_2<T, NativePointerEvent> {
+declare interface PointerEvent_2<T extends EventTarget = HTMLElement>
+extends MouseEvent_2<T, NativePointerEvent> {
     pointerId: number;
     pressure: number;
     tangentialPressure: number;
@@ -1672,7 +1751,10 @@ declare interface PointerEvent_2<T = Element> extends MouseEvent_2<T, NativePoin
 }
 export { PointerEvent_2 as PointerEvent }
 
-export declare type PointerEventHandler<T = Element> = EventHandler<T, PointerEvent_2<T>>;
+export declare type PointerEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+PointerEvent_2<T>
+>;
 
 /**
  * A global namespace for `pointerleave` event.
@@ -1692,14 +1774,14 @@ export declare const pointerupEvent = "pointerup";
 export declare type PossibleEventTarget = EventTarget & (Element | Document | Window);
 
 /**
- * Utility to check if target is typeof `HTMLElement`, `Element`, `Node`
+ * Utility to check if target is typeof `Element`, `Node`
  * or find one that matches a selector.
  *
  * @param selector the input selector or target element
  * @param parent optional node to look into
- * @return the `HTMLElement` or `querySelector` result
+ * @return the `Element` or null
  */
-export declare const querySelector: <T extends HTMLElement>(selector: HTMLElement | string, parent?: ParentNode) => T | null;
+export declare const querySelector: <T extends Element>(selector: T | string, parent?: ParentNode) => T | null;
 
 /**
  * A shortcut for `(document|Element).querySelectorAll`.
@@ -1708,7 +1790,7 @@ export declare const querySelector: <T extends HTMLElement>(selector: HTMLElemen
  * @param parent optional node to look into
  * @return the query result
  */
-export declare const querySelectorAll: <T extends HTMLElement>(selector: string, parent?: ParentNode) => NodeListOf<T>;
+export declare const querySelectorAll: <T extends Element>(selector: string, parent?: ParentNode) => NodeListOf<T>;
 
 /**
  * A global namespace for `readystatechange` event.
@@ -1724,29 +1806,29 @@ export declare const readystatechangeEvent = "readystatechange";
 export declare const reflow: (element: HTMLElement) => number;
 
 /**
- * Shortcut for `HTMLElement.removeAttribute()` method.
+ * Shortcut for `Element.removeAttribute()` method.
  *
  * @param element target element
  * @param att attribute name
  */
-export declare const removeAttribute: (element: HTMLElement, att: string) => void;
+export declare const removeAttribute: (element: Element, att: string) => void;
 
 /**
- * Shortcut for `HTMLElement.removeAttributeNS()` method.
+ * Shortcut for `Element.removeAttributeNS()` method.
  *
  * @param ns attribute namespace
  * @param  element target element
  * @param att attribute name
  */
-export declare const removeAttributeNS: (ns: string, element: HTMLElement, att: string) => void;
+export declare const removeAttributeNS: (ns: string, element: Element, att: string) => void;
 
 /**
- * Remove one or more classes from `HTMLElement.classList`.
+ * Remove one or more classes from `Element.classList`.
  *
  * @param element target
  * @param classNAME to remove
  */
-export declare const removeClass: (element: HTMLElement, ...classNAME: string[]) => void;
+export declare const removeClass: (element: Element, ...classNAME: string[]) => void;
 
 /**
  * A global namespace for 'removeEventListener' string.
@@ -1795,23 +1877,23 @@ export declare const selectEvent = "select";
 export declare const selectstartEvent = "selectstart";
 
 /**
- * Shortcut for `HTMLElement.setAttribute()` method.
+ * Shortcut for `Element.setAttribute()` method.
  *
  * @param element target element
  * @param att attribute name
  * @param value attribute value
  */
-export declare const setAttribute: (element: HTMLElement, att: string, value: string) => void;
+export declare const setAttribute: (element: Element, att: string, value: string) => void;
 
 /**
- * Shortcut for `SVGElement.setAttributeNS()` method.
+ * Shortcut for `Element.setAttributeNS()` method.
  *
  * @param ns attribute namespace
  * @param element target element
  * @param att attribute name
  * @param value attribute value
  */
-export declare const setAttributeNS: (ns: string, element: HTMLElement, att: string, value: string) => void;
+export declare const setAttributeNS: (ns: string, element: Element, att: string, value: string) => void;
 
 /**
  * Shortcut for multiple uses of `HTMLElement.style.propertyName` method.
@@ -1819,7 +1901,7 @@ export declare const setAttributeNS: (ns: string, element: HTMLElement, att: str
  * @param element target element
  * @param styles attribute value
  */
-export declare const setElementStyle: (element: HTMLElement, styles: Partial<CSS4Declaration>) => void;
+export declare const setElementStyle: (element: Element, styles: Partial<CSS4Declaration>) => void;
 
 /**
  * A global namespace for `submit` event.
@@ -1827,17 +1909,17 @@ export declare const setElementStyle: (element: HTMLElement, styles: Partial<CSS
 export declare const submitEvent = "submit";
 
 /**
- * A global `boolean` for CSS3 3D transform support.
+ * An accessor that checks for CSS3 3D transform support.
  */
 export declare const support3DTransform: () => boolean;
 
 /**
- * A global `boolean` for CSS3 animation support.
+ * An accessor that checks for CSS3 animation support.
  */
 export declare const supportAnimation: () => boolean;
 
 /**
- * A global `boolean` for passive events support,
+ * An accessor that checks for passive events support,
  * in general event options are not suited for scroll prevention.
  *
  * @see https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection
@@ -1845,17 +1927,17 @@ export declare const supportAnimation: () => boolean;
 export declare const supportPassive: () => boolean;
 
 /**
- * A global `boolean` for touch events support.
+ * An accessor that checks for touch events support.
  */
 export declare const supportTouch: () => boolean;
 
 /**
- * A global `boolean` for CSS3 transform support.
+ * An accessor that checks for CSS3 transform support.
  */
 export declare const supportTransform: () => boolean;
 
 /**
- * A global `boolean` for CSS3 transition support.
+ * An accessor that checks for CSS3 transition support.
  */
 export declare const supportTransition: () => boolean;
 
@@ -1878,7 +1960,7 @@ export declare const Timer: {
      * @param delay the execution delay
      * @param key a unique key
      */
-    set: (element: HTMLElement, callback: TimerHandler, delay: number, key?: string) => void;
+    set: (element: Element, callback: TimerHandler, delay: number, key?: string) => void;
     /**
      * Returns the timer associated with the target.
      *
@@ -1886,21 +1968,21 @@ export declare const Timer: {
      * @param key a unique
      * @returns the timer
      */
-    get: (element: HTMLElement, key?: string) => number | null;
+    get: (element: Element, key?: string) => number | null;
     /**
      * Clears the element's timer.
      *
      * @param element target element
      * @param key a unique key
      */
-    clear: (element: HTMLElement, key?: string) => void;
+    clear: (element: Element, key?: string) => void;
 };
 
 /**
  * Utility to toggle focus trap inside a designated target element;
  * @param target
  */
-export declare const toggleFocusTrap: (target: HTMLElement) => void;
+export declare const toggleFocusTrap: (target: Element) => void;
 
 /**
  * Shortcut for `String.toLowerCase()`.
@@ -1920,7 +2002,8 @@ export declare const touchcancelEvent = "touchcancel";
  */
 export declare const touchendEvent = "touchend";
 
-declare interface TouchEvent_2<T = Element> extends UIEvent_2<T, NativeTouchEvent> {
+declare interface TouchEvent_2<T extends EventTarget = HTMLElement>
+extends UIEvent_2<T, NativeTouchEvent> {
     altKey: boolean;
     changedTouches: TouchList;
     ctrlKey: boolean;
@@ -1935,7 +2018,10 @@ declare interface TouchEvent_2<T = Element> extends UIEvent_2<T, NativeTouchEven
 }
 export { TouchEvent_2 as TouchEvent }
 
-export declare type TouchEventHandler<T = Element> = EventHandler<T, TouchEvent_2<T>>;
+export declare type TouchEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+TouchEvent_2<T>
+>;
 
 /**
  * A global namespace for touch events.
@@ -1980,7 +2066,7 @@ export declare const transitionDuration = "transitionDuration";
  */
 export declare const transitionEndEvent = "transitionend";
 
-declare interface TransitionEvent_2<T = Element>
+declare interface TransitionEvent_2<T extends EventTarget = HTMLElement>
 extends NativeEvent<T, NativeTransitionEvent> {
     elapsedTime: number;
     propertyName: string;
@@ -1988,20 +2074,27 @@ extends NativeEvent<T, NativeTransitionEvent> {
 }
 export { TransitionEvent_2 as TransitionEvent }
 
-export declare type TransitionEventHandler<T = Element> = EventHandler<T, TransitionEvent_2<T>>;
+export declare type TransitionEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+TransitionEvent_2<T>
+>;
 
 /**
  * A global namespace for `transitionProperty` string for modern browsers.
  */
 export declare const transitionProperty = "transitionProperty";
 
-declare interface UIEvent_2<T = Element, E = NativeUIEvent> extends NativeEvent<T, E> {
+declare interface UIEvent_2<T extends EventTarget = HTMLElement, E = NativeUIEvent>
+extends NativeEvent<T, E> {
     detail: number;
     view: AbstractView;
 }
 export { UIEvent_2 as UIEvent }
 
-export declare type UIEventHandler<T = Element> = EventHandler<T, UIEvent_2<T>>;
+export declare type UIEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+UIEvent_2<T>
+>;
 
 /**
  * A global namespace for `unload` event.
@@ -2020,7 +2113,8 @@ export declare const userAgentData: NavigatorUA["userAgentData"];
 
 export { version }
 
-declare interface WheelEvent_2<T = Element> extends MouseEvent_2<T, NativeWheelEvent> {
+declare interface WheelEvent_2<T extends EventTarget = HTMLElement>
+extends MouseEvent_2<T, NativeWheelEvent> {
     deltaMode: number;
     deltaX: number;
     deltaY: number;
@@ -2028,6 +2122,9 @@ declare interface WheelEvent_2<T = Element> extends MouseEvent_2<T, NativeWheelE
 }
 export { WheelEvent_2 as WheelEvent }
 
-export declare type WheelEventHandler<T = Element> = EventHandler<T, WheelEvent_2<T>>;
+export declare type WheelEventHandler<T extends EventTarget = HTMLElement> = EventHandler<
+T,
+WheelEvent_2<T>
+>;
 
 export { }