@thednp/shorty 2.0.0-alpha2 → 2.0.0-alpha21

package/src/boolean/supportPassive.ts

@@ -1,5 +1,6 @@
-import DOMContentLoadedEvent from "../strings/DOMContentLoadedEvent";
-import one from "../event/one";
+import DOMContentLoadedEvent from '../strings/DOMContentLoadedEvent';
+import one from '../event/one';
+import noop from '../misc/noop';
 
 /**
  * A global `boolean` for passive events support,
@@ -10,14 +11,14 @@ import one from "../event/one";
 const supportPassive = (() => {
   let result = false;
   try {
-    const opts = Object.defineProperty({}, "passive", {
-      get() {
+    const opts = Object.defineProperty({}, 'passive', {
+      get: () => {
         result = true;
         return result;
       },
     });
     /* istanbul ignore next */
-    one(document, DOMContentLoadedEvent, () => {}, opts);
+    one(document, DOMContentLoadedEvent, noop, opts);
   } catch (e) {
     // throw Error('Passive events are not supported');
   }

package/src/boolean/supportTouch.ts

@@ -2,6 +2,6 @@
  * A global `boolean` for touch events support.
  */
 const supportTouch =
-  "ontouchstart" in window || /* istanbul ignore next */ "msMaxTouchPoints" in navigator;
+  'ontouchstart' in window || /* istanbul ignore next */ 'msMaxTouchPoints' in navigator;
 
 export default supportTouch;

package/src/boolean/supportTransform.ts

@@ -1,8 +1,8 @@
-import documentHead from "../blocks/documentHead";
+import documentHead from '../blocks/documentHead';
 
 /**
  * A global `boolean` for CSS3 transform support.
  */
-const supportTransform = ["webkitTransform", "transform"].some((p) => p in documentHead.style);
+const supportTransform = ['webkitTransform', 'transform'].some(p => p in documentHead.style);
 
 export default supportTransform;

package/src/boolean/supportTransition.ts

@@ -1,8 +1,8 @@
-import documentHead from "../blocks/documentHead";
+import documentHead from '../blocks/documentHead';
 
 /**
  * A global `boolean` for CSS3 transition support.
  */
-const supportTransition = ["webkitTransition", "transition"].some((p) => p in documentHead.style);
+const supportTransition = ['webkitTransition', 'transition'].some(p => p in documentHead.style);
 
 export default supportTransition;

package/src/event/off.ts

@@ -1,12 +1,14 @@
 /**
  * Remove eventListener from an `EventTarget` object.
  */
-export default function off(
-  element: EventTarget,
+const off = <T extends EventTarget, L = EventListener>(
+  element: T,
   eventName: string,
-  listener: EventListener,
-  options?: AddEventListenerOptions
-) {
+  listener: L,
+  options?: AddEventListenerOptions,
+) => {
   const ops = options || false;
-  element.removeEventListener(eventName, listener, ops);
-}
+  element.removeEventListener(eventName, listener as EventListenerOrEventListenerObject, ops);
+};
+
+export default off;

package/src/event/on.ts

@@ -1,12 +1,14 @@
 /**
  * Add eventListener to an `EventTarget` object.
  */
-export default function on(
-  element: EventTarget,
+const on = <T extends EventTarget, L = EventListener>(
+  element: T,
   eventName: string,
-  listener: EventListener,
-  options?: AddEventListenerOptions
-) {
+  listener: L,
+  options?: AddEventListenerOptions,
+) => {
   const ops = options || false;
-  element.addEventListener(eventName, listener, ops);
-}
+  element.addEventListener(eventName, listener as EventListenerOrEventListenerObject, ops);
+};
+
+export default on;

package/src/event/one.ts

@@ -1,21 +1,22 @@
 import on from './on';
 import off from './off';
+import { NativeEventHandler } from '../interface/event';
 
 /**
  * Add an `eventListener` to an `EventTarget`
  * element and remove it once callback is called.
  */
-const one = (
-  element: EventTarget,
+const one = <T extends EventTarget, L = EventListener>(
+  element: T,
   eventName: string,
-  listener: EventListener,
-  options?: AddEventListenerOptions
+  listener: L,
+  options?: AddEventListenerOptions,
 ) => {
   /** Wrap the listener for easy on -> off */
-  const handlerWrapper = (e: Event): void => {
+  const handlerWrapper: NativeEventHandler<T> = e => {
     /* istanbul ignore else */
-    if (e.target === element) {
-      listener.apply(element, [e]);
+    if (e.target === element || e.currentTarget === element) {
+      (listener as NativeEventHandler<T>).apply(element, [e]);
       off(element, eventName, handlerWrapper, options);
     }
   };

package/src/get/getBoundingClientRect.ts

@@ -1,8 +1,9 @@
-import isHTMLElement from "../is/isHTMLElement";
-import BoundingClientRect from "../interface/boundingClientRect";
+import isHTMLElement from '../is/isHTMLElement';
+import type { BoundingClientRect } from '../interface/boundingClientRect';
 
 /**
  * Returns the bounding client rect of a target `HTMLElement`.
+ *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param element event.target
@@ -11,7 +12,7 @@ import BoundingClientRect from "../interface/boundingClientRect";
  */
 const getBoundingClientRect = (
   element: HTMLElement,
-  includeScale?: boolean
+  includeScale?: boolean,
 ): BoundingClientRect => {
   const { width, height, top, right, bottom, left } = element.getBoundingClientRect();
   let scaleX = 1;

package/src/get/getDocument.ts

@@ -1,21 +1,22 @@
-import isNode from "../is/isNode";
-import isWindow from "../is/isWindow";
-import isDocument from "../is/isDocument";
+import isNode from '../is/isNode';
+import isWindow from '../is/isWindow';
+import isDocument from '../is/isDocument';
 
 /**
  * Returns the `document` or the `#document` element.
+ *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param node the reference node
  * @returns the parent document of the given node
  */
-const getDocument = (node?: any): Document => {
+const getDocument = (node?: Node | Document | Window): Document => {
+  // node instanceof Window
+  if (isWindow(node)) return node.document;
   // node instanceof Document
   if (isDocument(node)) return node;
   // node instanceof Node
-  if (isNode(node)) return node.ownerDocument;
-  // node instanceof Window
-  if (isWindow(node)) return node.document;
+  if (isNode(node)) return node.ownerDocument as Document;
   // node is undefined | NULL
   return window.document;
 };

package/src/get/getDocumentBody.ts

@@ -6,7 +6,7 @@ import getDocument from './getDocument';
  * @param node the reference node
  * @returns the parent `<body>` of the specified node
  */
-const getDocumentBody = (node?: any): HTMLElement => {
+const getDocumentBody = (node?: Node | Document | Window): HTMLElement => {
   return getDocument(node).body;
 };
 

package/src/get/getDocumentElement.ts

@@ -6,7 +6,7 @@ import getDocument from './getDocument';
  * @param node the reference node
  * @returns the parent `<HTML>` of the node's parent document
  */
-const getDocumentElement = (node?: Node): HTMLElement => {
+const getDocumentElement = (node?: Node | Document | Window): HTMLElement => {
   return getDocument(node).documentElement;
 };
 

package/src/get/getDocumentHead.ts

@@ -1,11 +1,11 @@
-import getDocument from "./getDocument";
+import getDocument from './getDocument';
 /**
  * Returns the `document.head` or the `<head>` element.
  *
  * @param node the reference node
  * @returns the `<head>` of the node's parent document
  */
-const getDocumentHead = (node?: Node): HTMLElement & HTMLHeadElement => {
+const getDocumentHead = (node?: Node | Document | Window): HTMLElement & HTMLHeadElement => {
   return getDocument(node).head;
 };
 

package/src/get/getElementAnimationDelay.ts

@@ -1,6 +1,6 @@
-import animationDelay from "../strings/animationDelay";
-import animationName from "../strings/animationName";
-import getElementStyle from "./getElementStyle";
+import animationDelay from '../strings/animationDelay';
+import animationName from '../strings/animationName';
+import getElementStyle from './getElementStyle';
 
 /**
  * Utility to get the computed `animationDelay`
@@ -12,9 +12,9 @@ import getElementStyle from "./getElementStyle";
 const getElementAnimationDelay = (element: HTMLElement): number => {
   const propertyValue = getElementStyle(element, animationName);
   const durationValue = getElementStyle(element, animationDelay);
-  const durationScale = durationValue.includes("ms") ? /* istanbul ignore next */ 1 : 1000;
+  const durationScale = durationValue.includes('ms') ? /* istanbul ignore next */ 1 : 1000;
   const duration =
-    propertyValue && propertyValue !== "none" ? parseFloat(durationValue) * durationScale : 0;
+    propertyValue && propertyValue !== 'none' ? parseFloat(durationValue) * durationScale : 0;
 
   return !Number.isNaN(duration) ? duration : /* istanbul ignore next */ 0;
 };

package/src/get/getElementAnimationDuration.ts

@@ -1,6 +1,6 @@
-import animationDuration from "../strings/animationDuration";
-import animationName from "../strings/animationName";
-import getElementStyle from "./getElementStyle";
+import animationDuration from '../strings/animationDuration';
+import animationName from '../strings/animationName';
+import getElementStyle from './getElementStyle';
 
 /**
  * Utility to get the computed `animationDuration`
@@ -12,9 +12,9 @@ import getElementStyle from "./getElementStyle";
 const getElementAnimationDuration = (element: HTMLElement): number => {
   const propertyValue = getElementStyle(element, animationName);
   const durationValue = getElementStyle(element, animationDuration);
-  const durationScale = durationValue.includes("ms") ? /* istanbul ignore next */ 1 : 1000;
+  const durationScale = durationValue.includes('ms') ? /* istanbul ignore next */ 1 : 1000;
   const duration =
-    propertyValue && propertyValue !== "none" ? parseFloat(durationValue) * durationScale : 0;
+    propertyValue && propertyValue !== 'none' ? parseFloat(durationValue) * durationScale : 0;
 
   return !Number.isNaN(duration) ? duration : /* istanbul ignore next */ 0;
 };

package/src/get/getElementStyle.ts

@@ -1,4 +1,4 @@
-import CSS4Declaration from "../interface/css4Declaration";
+// import CSS4Declaration from "../interface/css4Declaration";
 
 /**
  * Shortcut for `window.getComputedStyle(element).propertyName`
@@ -12,13 +12,14 @@ import CSS4Declaration from "../interface/css4Declaration";
  * @return the css property value
  */
 const getElementStyle = (element: HTMLElement, property: string): string => {
-  const computedStyle: CSS4Declaration = getComputedStyle(element);
+  const computedStyle = getComputedStyle(element);
+  const prop = property
+    .replace('webkit', 'Webkit')
+    .replace(/([A-Z])/g, '-$1')
+    .toLowerCase();
 
-  // must use camelcase strings,
-  // or non-camelcase strings with `getPropertyValue`
-  return property.includes("--")
-    ? computedStyle.getPropertyValue(property)
-    : computedStyle[property];
+  // modern browsers only
+  return computedStyle.getPropertyValue(prop);
 };
 
 export default getElementStyle;

package/src/get/getElementTransitionDelay.ts

@@ -1,6 +1,6 @@
-import transitionDelay from "../strings/transitionDelay";
-import transitionProperty from "../strings/transitionProperty";
-import getElementStyle from "./getElementStyle";
+import transitionDelay from '../strings/transitionDelay';
+import transitionProperty from '../strings/transitionProperty';
+import getElementStyle from './getElementStyle';
 
 /**
  * Utility to get the computed `transitionDelay`
@@ -12,9 +12,11 @@ import getElementStyle from "./getElementStyle";
 const getElementTransitionDelay = (element: HTMLElement): number => {
   const propertyValue = getElementStyle(element, transitionProperty);
   const delayValue = getElementStyle(element, transitionDelay);
-  const delayScale = delayValue.includes("ms") ? /* istanbul ignore next */ 1 : 1000;
+  const delayScale = delayValue.includes('ms') ? /* istanbul ignore next */ 1 : 1000;
   const duration =
-    propertyValue && propertyValue !== "none" ? parseFloat(delayValue) * delayScale : 0;
+    propertyValue && propertyValue !== 'none'
+      ? parseFloat(delayValue) * delayScale
+      : /* istanbul ignore next */ 0;
 
   return !Number.isNaN(duration) ? duration : /* istanbul ignore next */ 0;
 };

package/src/get/getElementTransitionDuration.ts

@@ -1,6 +1,6 @@
-import transitionDuration from "../strings/transitionDuration";
-import transitionProperty from "../strings/transitionProperty";
-import getElementStyle from "./getElementStyle";
+import transitionDuration from '../strings/transitionDuration';
+import transitionProperty from '../strings/transitionProperty';
+import getElementStyle from './getElementStyle';
 
 /**
  * Utility to get the computed `transitionDuration`
@@ -12,9 +12,11 @@ import getElementStyle from "./getElementStyle";
 const getElementTransitionDuration = (element: HTMLElement): number => {
   const propertyValue = getElementStyle(element, transitionProperty);
   const durationValue = getElementStyle(element, transitionDuration);
-  const durationScale = durationValue.includes("ms") ? /* istanbul ignore next */ 1 : 1000;
+  const durationScale = durationValue.includes('ms') ? /* istanbul ignore next */ 1 : 1000;
   const duration =
-    propertyValue && propertyValue !== "none" ? parseFloat(durationValue) * durationScale : 0;
+    propertyValue && propertyValue !== 'none'
+      ? parseFloat(durationValue) * durationScale
+      : /* istanbul ignore next */ 0;
 
   return !Number.isNaN(duration) ? duration : /* istanbul ignore next */ 0;
 };

package/src/get/getParentNode.ts

@@ -5,12 +5,13 @@ import isNode from '../is/isNode';
 
 /**
  * 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
  */
-const getParentNode = (node: Node): Node => {
+const getParentNode = (node: Node): Node | ParentNode => {
   if (node.nodeName === 'HTML') {
     return node;
   }

package/src/get/getRectRelativeToOffsetParent.ts

@@ -1,10 +1,11 @@
-import OffsetRect from '../interface/offsetRect';
+import type { OffsetRect } from '../interface/offsetRect';
 import isScaledElement from '../is/isScaledElement';
 import isHTMLElement from '../is/isHTMLElement';
 import getBoundingClientRect from './getBoundingClientRect';
 
 /**
  * Returns the rect relative to a given offset parent and its scroll position.
+ *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param element target
@@ -15,7 +16,7 @@ import getBoundingClientRect from './getBoundingClientRect';
 const getRectRelativeToOffsetParent = (
   element: HTMLElement,
   offsetParent: HTMLElement,
-  scroll: { x: number; y: number }
+  scroll: { x: number; y: number },
 ): OffsetRect => {
   const isParentAnElement = isHTMLElement(offsetParent);
   const rect = getBoundingClientRect(element, isParentAnElement && isScaledElement(offsetParent));

package/src/get/getUID.ts

@@ -24,10 +24,10 @@ const getUID = (element: HTMLElement, key?: string): number => {
     if (!elementIDMap.has(elID)) {
       elementIDMap.set(elID, elMap);
     }
-    if (isMap(elMap) && !elMap.has(key)) {
-      elMap.set(key, result);
+    if (isMap(elMap as KeyIdMap) && !(elMap as KeyIdMap).has(key)) {
+      (elMap as KeyIdMap).set(key, result);
       elementUID += 1;
-    } else result = (elMap as KeyIdMap).get(key);
+    } else result = (elMap as KeyIdMap).get(key) as number;
   } else {
     const elkey = element.id || element;
 

package/src/get/getWindow.ts

@@ -1,8 +1,9 @@
-import isDocument from "../is/isDocument";
-import isNode from "../is/isNode";
+import isDocument from '../is/isDocument';
+import isNode from '../is/isNode';
 
 /**
  * Returns the `Window` object of a target node.
+ *
  * @see https://github.com/floating-ui/floating-ui
  *
  * @param node target node
@@ -12,9 +13,9 @@ const getWindow = (node?: Node): Window => {
   // node is undefined | NULL
   if (!node) return window;
   // node instanceof Document
-  if (isDocument(node)) return node.defaultView;
+  if (isDocument(node)) return node.defaultView as Window;
   // node instanceof Node
-  if (isNode(node)) return node.ownerDocument.defaultView;
+  if (isNode(node)) return node?.ownerDocument?.defaultView as Window;
   // node is instanceof Window
   return node;
 };

package/src/index.ts

@@ -20,6 +20,12 @@ import abortEvent from './strings/abortEvent';
 import blurEvent from './strings/blurEvent';
 import moveEvent from './strings/moveEvent';
 import changeEvent from './strings/changeEvent';
+import dragEvent from './strings/dragEvent';
+import dragstartEvent from './strings/dragstartEvent';
+import dragenterEvent from './strings/dragenterEvent';
+import dragleaveEvent from './strings/dragleaveEvent';
+import dragoverEvent from './strings/dragoverEvent';
+import dragendEvent from './strings/dragendEvent';
 import errorEvent from './strings/errorEvent';
 import resetEvent from './strings/resetEvent';
 import resizeEvent from './strings/resizeEvent';
@@ -90,6 +96,7 @@ import keyCapsLock from './strings/keyCapsLock';
 import keyControl from './strings/keyControl';
 import keyDelete from './strings/keyDelete';
 import keyEnter from './strings/keyEnter';
+import keyNumpadEnter from './strings/keyNumpadEnter';
 import keyEscape from './strings/keyEscape';
 import keyInsert from './strings/keyInsert';
 import keyMeta from './strings/keyMeta';
@@ -153,9 +160,15 @@ import on from './event/on';
 import off from './event/off';
 import one from './event/one';
 
+// blocks
+import documentBody from './blocks/documentBody';
+import documentElement from './blocks/documentElement';
+import documentHead from './blocks/documentHead';
+
 // misc
 import ArrayFrom from './misc/ArrayFrom';
-import Data, { getInstance } from './misc/data';
+import Data from './misc/data';
+import getInstance from './misc/getInstance';
 import createElement from './misc/createElement';
 import createElementNS from './misc/createElementNS';
 import dispatchEvent from './misc/dispatchEvent';
@@ -170,9 +183,11 @@ import normalizeOptions from './misc/normalizeOptions';
 import normalizeValue from './misc/normalizeValue';
 import ObjectAssign from './misc/ObjectAssign';
 import ObjectEntries from './misc/ObjectEntries';
+import ObjectHasOwn from './misc/ObjectHasOwn';
 import ObjectKeys from './misc/ObjectKeys';
 import ObjectValues from './misc/ObjectValues';
-import OriginalEvent from './misc/OriginalEvent';
+import ObjectFromEntries from './misc/ObjectFromEntries';
+import createCustomEvent from './misc/createCustomEvent';
 import passiveHandler from './misc/passiveHandler';
 import reflow from './misc/reflow';
 import setElementStyle from './misc/setElementStyle';
@@ -211,6 +226,7 @@ import isObject from './is/isObject';
 import isHTMLCollection from './is/isHTMLCollection';
 import isHTMLElement from './is/isHTMLElement';
 import isHTMLImageElement from './is/isHTMLImageElement';
+import isJSON from './is/isJSON';
 import isMap from './is/isMap';
 import isWeakMap from './is/isWeakMap';
 import isMedia from './is/isMedia';
@@ -235,7 +251,9 @@ import getElementsByTagName from './selectors/getElementsByTagName';
 import getElementsByClassName from './selectors/getElementsByClassName';
 import matches from './selectors/matches';
 
-const SHORTY = {
+import { version } from '../package.json';
+
+export {
   ariaChecked,
   ariaDescription,
   ariaDescribedBy,
@@ -256,6 +274,12 @@ const SHORTY = {
   blurEvent,
   moveEvent,
   changeEvent,
+  dragEvent,
+  dragstartEvent,
+  dragenterEvent,
+  dragoverEvent,
+  dragleaveEvent,
+  dragendEvent,
   errorEvent,
   resetEvent,
   resizeEvent,
@@ -339,6 +363,7 @@ const SHORTY = {
   keyControl,
   keyDelete,
   keyEnter,
+  keyNumpadEnter,
   keyEscape,
   keyInsert,
   keyMeta,
@@ -360,12 +385,16 @@ const SHORTY = {
   on,
   off,
   one,
+  documentBody,
+  documentElement,
+  documentHead,
   dispatchEvent,
   distinct,
   Data,
   getInstance,
   createElement,
   createElementNS,
+  createCustomEvent,
   toUpperCase,
   toLowerCase,
   Timer,
@@ -387,6 +416,7 @@ const SHORTY = {
   isString,
   isCustomElement,
   isElement,
+  isJSON,
   isMap,
   isWeakMap,
   isNode,
@@ -423,11 +453,12 @@ const SHORTY = {
   ArrayFrom,
   Float32ArrayFrom,
   Float64ArrayFrom,
+  ObjectHasOwn,
   ObjectAssign,
   ObjectEntries,
   ObjectKeys,
   ObjectValues,
-  OriginalEvent,
+  ObjectFromEntries,
   getBoundingClientRect,
   getDocument,
   getDocumentBody,
@@ -443,6 +474,7 @@ const SHORTY = {
   setAttributeNS,
   removeAttribute,
   removeAttributeNS,
+  version,
 };
 
-export default SHORTY;
+export * from './interface/event.d';

package/src/interface/{boundingClientRect.ts → boundingClientRect.d.ts}

@@ -1,10 +1,10 @@
-export default interface BoundingClientRect {
-  width: number;
-  height: number;
-  top: number;
-  left: number;
-  right: number;
-  bottom: number;
-  x: number;
-  y: number;
-}
+export declare interface BoundingClientRect {
+  width: number;
+  height: number;
+  top: number;
+  left: number;
+  right: number;
+  bottom: number;
+  x: number;
+  y: number;
+}

package/src/interface/css4Declaration.d.ts

@@ -0,0 +1,4 @@
+export declare interface CSS4Declaration
+  extends Exclude<() => string | symbol, CSSStyleDeclaration> {
+  [key: string]: string;
+}

package/src/interface/{customElement.ts → customElement.d.ts}

@@ -1,8 +1,8 @@
-export default interface CustomElement extends HTMLElement {
-  shadowRoot: ShadowRoot;
-  connectedCallback?: () => void;
-  disconnectedCallback?: () => void;
-  adoptedCallback?: () => void;
-  attributeChangedCallback?: () => void;
-  [key: string]: any;
-}
+export declare interface CustomElement extends HTMLElement {
+  shadowRoot: ShadowRoot;
+  connectedCallback?: () => void;
+  disconnectedCallback?: () => void;
+  adoptedCallback?: () => void;
+  attributeChangedCallback?: () => void;
+  // [key: PropertyKey]: any;
+}