@thednp/shorty 2.0.0-alpha18 → 2.0.0-alpha20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thednp/shorty",
-  "version": "2.0.0alpha18",
+  "version": "2.0.0alpha20",
   "description": "TypeScript shorties for the web",
   "source": "./src/index.ts",
   "main": "./dist/shorty.js",
@@ -37,9 +37,9 @@
     "@types/istanbul-lib-instrument": "^1.7.4",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
-    "cypress": "^12.17.4",
+    "cypress": "^13.1.0",
     "dts-bundle-generator": "^8.0.1",
-    "eslint": "^8.48.0",
+    "eslint": "^8.49.0",
     "eslint-plugin-jsdoc": "^46.5.1",
     "eslint-plugin-prefer-arrow": "^1.2.3",
     "eslint-plugin-prettier": "^4.2.1",
@@ -65,7 +65,8 @@
     "format": "prettier --write \"src/**/*.ts\"",
     "lint:ts": "eslint -c .eslintrc.cjs --ext .ts src",
     "fix:ts": "eslint -c .eslintrc.cjs --ext .ts src --fix",
-    "build": "pnpm lint:ts && vite build && pnpm dts",
+    "check:ts": "tsc -noEmit",
+    "build": "pnpm check:ts && pnpm lint:ts && vite build && pnpm dts",
     "dts": "dts-bundle-generator --config ./dts.config.ts"
   }
 }

package/src/event/off.ts

@@ -1,16 +1,14 @@
-import { NativeEventTypes, PossibleEventTarget, SupportedEventHandler } from '../interface/event';
-
 /**
  * Remove eventListener from an `EventTarget` object.
  */
-const off = <T extends PossibleEventTarget>(
+const off = <T extends EventTarget, L = EventListener>(
   element: T,
-  eventName: NativeEventTypes,
-  listener: EventListenerObject & SupportedEventHandler<T>,
+  eventName: string,
+  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,16 +1,14 @@
-import { NativeEventTypes, PossibleEventTarget, SupportedEventHandler } from '../interface/event';
-
 /**
  * Add eventListener to an `EventTarget` object.
  */
-const on = <T extends PossibleEventTarget>(
+const on = <T extends EventTarget, L = EventListener>(
   element: T,
-  eventName: NativeEventTypes,
-  listener: EventListenerObject & SupportedEventHandler<T>,
+  eventName: string,
+  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,43 +1,26 @@
-import {
-  EventHandler,
-  NativeEvent,
-  NativeEventTypes,
-  PossibleEventTarget,
-  SupportedEventHandler,
-} from '../interface/event';
-
 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 = <T extends PossibleEventTarget>(
+const one = <T extends EventTarget, L = EventListener>(
   element: T,
-  eventName: NativeEventTypes,
-  listener: SupportedEventHandler<T>,
+  eventName: string,
+  listener: L,
   options?: AddEventListenerOptions,
 ) => {
   /** Wrap the listener for easy on -> off */
-  const handlerWrapper = (e: NativeEvent): void => {
+  const handlerWrapper: NativeEventHandler<T> = e => {
     /* istanbul ignore else */
     if (e.target === element || e.currentTarget === element) {
-      (listener as EventHandler<typeof e>).apply(element, [e]);
-      off(
-        element,
-        eventName,
-        handlerWrapper as unknown as EventListenerObject & SupportedEventHandler<T>,
-        options,
-      );
+      (listener as NativeEventHandler<T>).apply(element, [e]);
+      off(element, eventName, handlerWrapper, options);
     }
   };
-  on(
-    element,
-    eventName,
-    handlerWrapper as unknown as EventListenerObject & SupportedEventHandler<T>,
-    options,
-  );
+  on(element, eventName, handlerWrapper, options);
 };
 
 export default one;

package/src/index.ts

@@ -476,3 +476,5 @@ export {
   removeAttributeNS,
   version,
 };
+
+export * from './interface/event.d';

package/src/interface/event.d.ts

@@ -25,9 +25,9 @@ interface AbstractView {
 // Event System
 // ----------------------------------------------------------------------
 // E = EventObject, C = e.currentTarget, T = e.target
-interface BaseEvent<E = unknown, C = unknown, T = unknown> {
-  nativeEvent: Event & E;
-  currentTarget: C & EventTarget;
+interface BaseEvent<E = Event, C = unknown, T = unknown> {
+  nativeEvent: E;
+  currentTarget: C | null;
   target: T & EventTarget;
   bubbles: boolean;
   cancelable: boolean;
@@ -40,7 +40,7 @@ interface BaseEvent<E = unknown, C = unknown, T = unknown> {
   isPropagationStopped(): boolean;
   persist(): void;
   timeStamp: number;
-  type: string & NativeEventTypes;
+  type: string;
 }
 
 /**
@@ -50,10 +50,10 @@ interface BaseEvent<E = unknown, C = unknown, T = unknown> {
  * 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
  */
-type NativeEvent<T = PossibleEventTarget, E = Event> = BaseEvent<E, EventTarget & T, EventTarget>;
+type NativeEvent<T = Element, E = Event> = BaseEvent<E, T, T>;
 
 interface ClipboardEvent<T = Element> extends NativeEvent<T, NativeClipboardEvent> {
-  clipboardData?: DataTransfer;
+  clipboardData: DataTransfer;
 }
 
 interface CompositionEvent<T = Element> extends NativeEvent<T, NativeCompositionEvent> {
@@ -89,7 +89,7 @@ interface ChangeEvent<T = FormControl> extends FormEvent<T> {
   target: EventTarget & T;
 }
 
-export type ModifierKey =
+type ModifierKey =
   | 'Alt'
   | 'AltGraph'
   | 'CapsLock'
@@ -193,116 +193,26 @@ interface TransitionEvent<T = Element> extends NativeEvent<T, NativeTransitionEv
 //
 // Event Handler Types
 // ----------------------------------------------------------------------
-type EventHandler<E extends NativeEvent<unknown, unknown>> = //   (this: unknown & EventTarget, event: E): void;
-  (event: E) => void;
-type NativeEventHandler<T = Element> = EventHandler<NativeEvent<T>>;
-type ClipboardEventHandler<T = Element> = EventHandler<ClipboardEvent<T>>;
-type CompositionEventHandler<T = Element> = EventHandler<CompositionEvent<T>>;
-type DragEventHandler<T = Element> = EventHandler<DragEvent<T>>;
-type FocusEventHandler<T = Element> = EventHandler<FocusEvent<T>>;
-type FormEventHandler<T = Element> = EventHandler<FormEvent<T>>;
-type ChangeEventHandler<T = Element> = EventHandler<ChangeEvent<T>>;
-type KeyboardEventHandler<T = Element> = EventHandler<KeyboardEvent<T>>;
-type MouseEventHandler<T = Element> = EventHandler<MouseEvent<T>>;
-type TouchEventHandler<T = Element> = EventHandler<TouchEvent<T>>;
-type PointerEventHandler<T = Element> = EventHandler<PointerEvent<T>>;
-type UIEventHandler<T = Element> = EventHandler<UIEvent<T>>;
-type WheelEventHandler<T = Element> = EventHandler<WheelEvent<T>>;
-type AnimationEventHandler<T = Element> = EventHandler<AnimationEvent<T>>;
-type TransitionEventHandler<T = Element> = EventHandler<TransitionEvent<T>>;
-
-type SupportedEventObject<T> =
-  | NativeEvent<T>
-  | ClipboardEvent<T>
-  | CompositionEvent<T>
-  | DragEvent<T>
-  | FocusEvent<T>
-  | FormEvent<T>
-  | ChangeEvent<T>
-  | KeyboardEvent<T>
-  | MouseEvent<T>
-  | TouchEvent<T>
-  | PointerEvent<T>
-  | UIEvent<T>
-  | WheelEvent<T>
-  | AnimationEvent<T>
-  | TransitionEvent<T>;
-
-type SupportedEventHandler<T> =
-  | NativeEventHandler<T>
-  | ClipboardEventHandler<T>
-  | CompositionEventHandler<T>
-  | DragEventHandler<T>
-  | FocusEventHandler<T>
-  | FormEventHandler<T>
-  | ChangeEventHandler<T>
-  | KeyboardEventHandler<T>
-  | MouseEventHandler<T>
-  | TouchEventHandler<T>
-  | PointerEventHandler<T>
-  | UIEventHandler<T>
-  | WheelEventHandler<T>
-  | AnimationEventHandler<T>
-  | TransitionEventHandler<T>;
-
-type NativeEventTypes =
-  | 'DOMContentLoaded'
-  | 'DOMMouseScroll'
-  | 'abort'
-  | 'beforeunload'
-  | 'blur'
-  | 'change'
-  | 'click'
-  | 'contextmenu'
-  | 'dblclick'
-  | 'error'
-  | 'focus'
-  | 'focusin'
-  | 'focusout'
-  | 'gesturechange'
-  | 'gestureend'
-  | 'gesturestart'
-  | 'hover'
-  | 'keydown'
-  | 'keypress'
-  | 'keyup'
-  | 'load'
-  | 'mousedown'
-  | 'mouseenter'
-  | 'mousein'
-  | 'mouseleave'
-  | 'mousemove'
-  | 'mouseout'
-  | 'mouseover'
-  | 'mouseup'
-  | 'mousewheel'
-  | 'move'
-  | 'orientationchange'
-  | 'pointercancel'
-  | 'pointerdown'
-  | 'pointerleave'
-  | 'pointermove'
-  | 'pointerup'
-  | 'readystatechange'
-  | 'reset'
-  | 'resize'
-  | 'scroll'
-  | 'select'
-  | 'selectend'
-  | 'selectstart'
-  | 'submit'
-  | 'touchcancel'
-  | 'touchend'
-  | 'touchmove'
-  | 'touchstart'
-  | 'unload';
+// (this: unknown & EventTarget, event: E): void;
+type EventHandler<T = Element, E = Event | NativeEvent<T>> = (event: E) => void;
+type NativeEventHandler<T = Element> = EventHandler<T, NativeEvent<T>>;
+type ClipboardEventHandler<T = Element> = EventHandler<T, ClipboardEvent<T>>;
+type CompositionEventHandler<T = Element> = EventHandler<T, CompositionEvent<T>>;
+type DragEventHandler<T = Element> = EventHandler<T, DragEvent<T>>;
+type FocusEventHandler<T = Element> = EventHandler<T, FocusEvent<T>>;
+type FormEventHandler<T = Element> = EventHandler<T, FormEvent<T>>;
+type ChangeEventHandler<T = Element> = EventHandler<T, ChangeEvent<T>>;
+type KeyboardEventHandler<T = Element> = EventHandler<T, KeyboardEvent<T>>;
+type MouseEventHandler<T = Element> = EventHandler<T, MouseEvent<T>>;
+type TouchEventHandler<T = Element> = EventHandler<T, TouchEvent<T>>;
+type PointerEventHandler<T = Element> = EventHandler<T, PointerEvent<T>>;
+type UIEventHandler<T = Element> = EventHandler<T, UIEvent<T>>;
+type WheelEventHandler<T = Element> = EventHandler<T, WheelEvent<T>>;
+type AnimationEventHandler<T = Element> = EventHandler<T, AnimationEvent<T>>;
+type TransitionEventHandler<T = Element> = EventHandler<T, TransitionEvent<T>>;
 type PossibleEventTarget = EventTarget & (Element | Document | Window);
 
 export {
-  SupportedEventObject,
-  SupportedEventHandler,
-  EventHandler,
-  NativeEventTypes,
   NativeEvent,
   ClipboardEvent,
   CompositionEvent,