@gjsify/dom-events 0.0.4 → 0.1.0

package/README.md

@@ -1,6 +1,35 @@
 # @gjsify/dom-events
 
+GJS implementation of Web DOM Events including Event, CustomEvent, EventTarget, UIEvent, MouseEvent, PointerEvent, KeyboardEvent, WheelEvent, FocusEvent, and DOMException.
+
+Part of the [gjsify](https://github.com/gjsify/gjsify) project — Node.js and Web APIs for GJS (GNOME JavaScript).
+
+## Installation
+
+```bash
+npm install @gjsify/dom-events
+# or
+yarn add @gjsify/dom-events
+```
+
+## Usage
+
+```typescript
+import { Event, CustomEvent, EventTarget } from '@gjsify/dom-events';
+
+const target = new EventTarget();
+target.addEventListener('custom', (e) => {
+  console.log(e.detail);
+});
+target.dispatchEvent(new CustomEvent('custom', { detail: 'hello' }));
+```
+
 ## Inspirations and credits
+
 - https://deno.land/manual@v1.29.2/runtime/web_platform_apis#customevent-eventtarget-and-eventlistener
 - https://github.com/jsdom/jsdom/tree/master/lib/jsdom/living/events
-- https://github.com/capricorn86/happy-dom/tree/master/packages/happy-dom/src/event
+- https://github.com/capricorn86/happy-dom/tree/master/packages/happy-dom/src/event
+
+## License
+
+MIT

package/globals.mjs

@@ -0,0 +1,7 @@
+/**
+ * Re-exports native DOM Events globals for use in Node.js builds.
+ * On Node.js, Event/EventTarget/CustomEvent are native globals.
+ */
+export const Event = globalThis.Event;
+export const EventTarget = globalThis.EventTarget;
+export const CustomEvent = globalThis.CustomEvent;

package/lib/esm/index.js

@@ -1 +1,488 @@
-export * from "@gjsify/deno-runtime/ext/web/02_event";
+import { DOMException } from "@gjsify/dom-exception";
+const kType = /* @__PURE__ */ Symbol("type");
+const kBubbles = /* @__PURE__ */ Symbol("bubbles");
+const kCancelable = /* @__PURE__ */ Symbol("cancelable");
+const kComposed = /* @__PURE__ */ Symbol("composed");
+const kTarget = /* @__PURE__ */ Symbol("target");
+const kCurrentTarget = /* @__PURE__ */ Symbol("currentTarget");
+const kEventPhase = /* @__PURE__ */ Symbol("eventPhase");
+const kDefaultPrevented = /* @__PURE__ */ Symbol("defaultPrevented");
+const kIsTrusted = /* @__PURE__ */ Symbol("isTrusted");
+const kTimeStamp = /* @__PURE__ */ Symbol("timeStamp");
+const kStop = /* @__PURE__ */ Symbol("stop");
+const kImmediateStop = /* @__PURE__ */ Symbol("immediateStop");
+const kDispatching = /* @__PURE__ */ Symbol("dispatching");
+const kInPassiveListener = /* @__PURE__ */ Symbol("inPassiveListener");
+class Event {
+  // Internal state
+  [kType];
+  [kBubbles];
+  [kCancelable];
+  [kComposed];
+  [kTarget] = null;
+  [kCurrentTarget] = null;
+  [kEventPhase] = 0;
+  [kDefaultPrevented] = false;
+  [kIsTrusted] = false;
+  [kTimeStamp];
+  [kStop] = false;
+  [kImmediateStop] = false;
+  [kDispatching] = false;
+  [kInPassiveListener] = false;
+  // Readonly getters
+  get type() {
+    return this[kType];
+  }
+  get bubbles() {
+    return this[kBubbles];
+  }
+  get cancelable() {
+    return this[kCancelable];
+  }
+  get composed() {
+    return this[kComposed];
+  }
+  get target() {
+    return this[kTarget];
+  }
+  get currentTarget() {
+    return this[kCurrentTarget];
+  }
+  get eventPhase() {
+    return this[kEventPhase];
+  }
+  get defaultPrevented() {
+    return this[kDefaultPrevented];
+  }
+  // isTrusted is defined as a non-configurable own property in the constructor
+  get timeStamp() {
+    return this[kTimeStamp];
+  }
+  // Legacy compat
+  get cancelBubble() {
+    return this[kStop];
+  }
+  set cancelBubble(value) {
+    if (value) this.stopPropagation();
+  }
+  get returnValue() {
+    return !this[kDefaultPrevented];
+  }
+  set returnValue(value) {
+    if (!value) this.preventDefault();
+  }
+  get srcElement() {
+    return this[kTarget];
+  }
+  // Phase constants (defined as non-writable, non-configurable on prototype below)
+  static NONE = 0;
+  static CAPTURING_PHASE = 1;
+  static AT_TARGET = 2;
+  static BUBBLING_PHASE = 3;
+  get [Symbol.toStringTag]() {
+    return "Event";
+  }
+  constructor(type, eventInitDict) {
+    this[kType] = type;
+    this[kBubbles] = eventInitDict?.bubbles ?? false;
+    this[kCancelable] = eventInitDict?.cancelable ?? false;
+    this[kComposed] = eventInitDict?.composed ?? false;
+    this[kTimeStamp] = Date.now();
+    Object.defineProperty(this, "isTrusted", {
+      get: () => this[kIsTrusted],
+      enumerable: true,
+      configurable: false
+    });
+  }
+  composedPath() {
+    if (this[kCurrentTarget]) return [this[kCurrentTarget]];
+    return [];
+  }
+  preventDefault() {
+    if (this[kCancelable] && !this[kInPassiveListener]) {
+      this[kDefaultPrevented] = true;
+    }
+  }
+  stopPropagation() {
+    this[kStop] = true;
+  }
+  stopImmediatePropagation() {
+    this[kStop] = true;
+    this[kImmediateStop] = true;
+  }
+}
+class CustomEvent extends Event {
+  detail;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.detail = eventInitDict?.detail;
+  }
+}
+class MessageEvent extends Event {
+  data;
+  origin;
+  lastEventId;
+  source;
+  ports;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.data = eventInitDict?.data ?? null;
+    this.origin = eventInitDict?.origin ?? "";
+    this.lastEventId = eventInitDict?.lastEventId ?? "";
+    this.source = eventInitDict?.source ?? null;
+    this.ports = eventInitDict?.ports ?? [];
+  }
+  get [Symbol.toStringTag]() {
+    return "MessageEvent";
+  }
+}
+class ErrorEvent extends Event {
+  message;
+  filename;
+  lineno;
+  colno;
+  error;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.message = eventInitDict?.message ?? "";
+    this.filename = eventInitDict?.filename ?? "";
+    this.lineno = eventInitDict?.lineno ?? 0;
+    this.colno = eventInitDict?.colno ?? 0;
+    this.error = eventInitDict?.error ?? null;
+  }
+  get [Symbol.toStringTag]() {
+    return "ErrorEvent";
+  }
+}
+class CloseEvent extends Event {
+  code;
+  reason;
+  wasClean;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.code = eventInitDict?.code ?? 0;
+    this.reason = eventInitDict?.reason ?? "";
+    this.wasClean = eventInitDict?.wasClean ?? false;
+  }
+  get [Symbol.toStringTag]() {
+    return "CloseEvent";
+  }
+}
+class ProgressEvent extends Event {
+  lengthComputable;
+  loaded;
+  total;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.lengthComputable = eventInitDict?.lengthComputable ?? false;
+    this.loaded = eventInitDict?.loaded ?? 0;
+    this.total = eventInitDict?.total ?? 0;
+  }
+  get [Symbol.toStringTag]() {
+    return "ProgressEvent";
+  }
+}
+class EventTarget {
+  _listeners = /* @__PURE__ */ new Map();
+  get [Symbol.toStringTag]() {
+    return "EventTarget";
+  }
+  addEventListener(type, callback, options) {
+    if (callback === null) return;
+    const capture = typeof options === "boolean" ? options : options?.capture ?? false;
+    const once = typeof options === "object" ? options?.once ?? false : false;
+    const passive = typeof options === "object" ? options?.passive ?? false : false;
+    let list = this._listeners.get(type);
+    if (!list) {
+      list = [];
+      this._listeners.set(type, list);
+    }
+    for (const entry2 of list) {
+      if (entry2.listener === callback && entry2.capture === capture) return;
+    }
+    const entry = { listener: callback, capture, once, passive, removed: false };
+    list.push(entry);
+    if (typeof options === "object" && options?.signal) {
+      options.signal.addEventListener("abort", () => {
+        this.removeEventListener(type, callback, { capture });
+      }, { once: true });
+    }
+  }
+  removeEventListener(type, callback, options) {
+    if (callback === null) return;
+    const capture = typeof options === "boolean" ? options : options?.capture ?? false;
+    const list = this._listeners.get(type);
+    if (!list) return;
+    const idx = list.findIndex((e) => e.listener === callback && e.capture === capture);
+    if (idx !== -1) {
+      list[idx].removed = true;
+      list.splice(idx, 1);
+      if (list.length === 0) this._listeners.delete(type);
+    }
+  }
+  dispatchEvent(event) {
+    if (event[kDispatching]) {
+      throw new DOMException("The event is already being dispatched.", "InvalidStateError");
+    }
+    event[kDispatching] = true;
+    event[kTarget] = this;
+    event[kCurrentTarget] = this;
+    event[kEventPhase] = Event.AT_TARGET;
+    const list = this._listeners.get(event.type);
+    if (list) {
+      const entries = [...list];
+      for (const entry of entries) {
+        if (entry.removed) continue;
+        if (event[kImmediateStop]) break;
+        if (event[kStop]) break;
+        if (entry.once) {
+          this.removeEventListener(event.type, entry.listener, { capture: entry.capture });
+        }
+        try {
+          if (entry.passive) event[kInPassiveListener] = true;
+          if (typeof entry.listener === "function") {
+            entry.listener.call(this, event);
+          } else if (typeof entry.listener.handleEvent === "function") {
+            entry.listener.handleEvent.call(entry.listener, event);
+          }
+        } catch (err) {
+          console.error(err);
+        } finally {
+          event[kInPassiveListener] = false;
+        }
+      }
+    }
+    event[kEventPhase] = Event.NONE;
+    event[kCurrentTarget] = null;
+    event[kDispatching] = false;
+    return !event.defaultPrevented;
+  }
+}
+for (const [name, value] of [["NONE", 0], ["CAPTURING_PHASE", 1], ["AT_TARGET", 2], ["BUBBLING_PHASE", 3]]) {
+  Object.defineProperty(Event.prototype, name, { value, writable: false, enumerable: true, configurable: false });
+  Object.defineProperty(Event, name, { value, writable: false, enumerable: true, configurable: false });
+}
+class UIEvent extends Event {
+  detail;
+  view;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.detail = eventInitDict?.detail ?? 0;
+    this.view = null;
+  }
+  get [Symbol.toStringTag]() {
+    return "UIEvent";
+  }
+}
+class MouseEvent extends UIEvent {
+  altKey;
+  button;
+  buttons;
+  clientX;
+  clientY;
+  ctrlKey;
+  metaKey;
+  movementX;
+  movementY;
+  offsetX;
+  offsetY;
+  screenX;
+  screenY;
+  shiftKey;
+  relatedTarget;
+  // Legacy aliases
+  get pageX() {
+    return this.clientX;
+  }
+  get pageY() {
+    return this.clientY;
+  }
+  get x() {
+    return this.clientX;
+  }
+  get y() {
+    return this.clientY;
+  }
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.altKey = eventInitDict?.altKey ?? false;
+    this.button = eventInitDict?.button ?? 0;
+    this.buttons = eventInitDict?.buttons ?? 0;
+    this.clientX = eventInitDict?.clientX ?? 0;
+    this.clientY = eventInitDict?.clientY ?? 0;
+    this.ctrlKey = eventInitDict?.ctrlKey ?? false;
+    this.metaKey = eventInitDict?.metaKey ?? false;
+    this.movementX = eventInitDict?.movementX ?? 0;
+    this.movementY = eventInitDict?.movementY ?? 0;
+    this.offsetX = eventInitDict?.offsetX ?? 0;
+    this.offsetY = eventInitDict?.offsetY ?? 0;
+    this.screenX = eventInitDict?.screenX ?? 0;
+    this.screenY = eventInitDict?.screenY ?? 0;
+    this.shiftKey = eventInitDict?.shiftKey ?? false;
+    this.relatedTarget = eventInitDict?.relatedTarget ?? null;
+  }
+  getModifierState(key) {
+    switch (key) {
+      case "Alt":
+        return this.altKey;
+      case "Control":
+        return this.ctrlKey;
+      case "Meta":
+        return this.metaKey;
+      case "Shift":
+        return this.shiftKey;
+      default:
+        return false;
+    }
+  }
+  get [Symbol.toStringTag]() {
+    return "MouseEvent";
+  }
+}
+class PointerEvent extends MouseEvent {
+  pointerId;
+  width;
+  height;
+  pressure;
+  tangentialPressure;
+  tiltX;
+  tiltY;
+  twist;
+  altitudeAngle;
+  azimuthAngle;
+  pointerType;
+  isPrimary;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.pointerId = eventInitDict?.pointerId ?? 0;
+    this.width = eventInitDict?.width ?? 1;
+    this.height = eventInitDict?.height ?? 1;
+    this.pressure = eventInitDict?.pressure ?? 0;
+    this.tangentialPressure = eventInitDict?.tangentialPressure ?? 0;
+    this.tiltX = eventInitDict?.tiltX ?? 0;
+    this.tiltY = eventInitDict?.tiltY ?? 0;
+    this.twist = eventInitDict?.twist ?? 0;
+    this.altitudeAngle = eventInitDict?.altitudeAngle ?? Math.PI / 2;
+    this.azimuthAngle = eventInitDict?.azimuthAngle ?? 0;
+    this.pointerType = eventInitDict?.pointerType ?? "";
+    this.isPrimary = eventInitDict?.isPrimary ?? false;
+  }
+  getCoalescedEvents() {
+    return [];
+  }
+  getPredictedEvents() {
+    return [];
+  }
+  get [Symbol.toStringTag]() {
+    return "PointerEvent";
+  }
+}
+class KeyboardEvent extends UIEvent {
+  altKey;
+  code;
+  ctrlKey;
+  isComposing;
+  key;
+  location;
+  metaKey;
+  repeat;
+  shiftKey;
+  keyCode;
+  which;
+  static DOM_KEY_LOCATION_STANDARD = 0;
+  static DOM_KEY_LOCATION_LEFT = 1;
+  static DOM_KEY_LOCATION_RIGHT = 2;
+  static DOM_KEY_LOCATION_NUMPAD = 3;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.altKey = eventInitDict?.altKey ?? false;
+    this.code = eventInitDict?.code ?? "";
+    this.ctrlKey = eventInitDict?.ctrlKey ?? false;
+    this.isComposing = eventInitDict?.isComposing ?? false;
+    this.key = eventInitDict?.key ?? "";
+    this.location = eventInitDict?.location ?? 0;
+    this.metaKey = eventInitDict?.metaKey ?? false;
+    this.repeat = eventInitDict?.repeat ?? false;
+    this.shiftKey = eventInitDict?.shiftKey ?? false;
+    this.keyCode = eventInitDict?.keyCode ?? 0;
+    this.which = eventInitDict?.which ?? 0;
+  }
+  getModifierState(key) {
+    switch (key) {
+      case "Alt":
+        return this.altKey;
+      case "Control":
+        return this.ctrlKey;
+      case "Meta":
+        return this.metaKey;
+      case "Shift":
+        return this.shiftKey;
+      default:
+        return false;
+    }
+  }
+  get [Symbol.toStringTag]() {
+    return "KeyboardEvent";
+  }
+}
+class WheelEvent extends MouseEvent {
+  deltaX;
+  deltaY;
+  deltaZ;
+  deltaMode;
+  static DOM_DELTA_PIXEL = 0;
+  static DOM_DELTA_LINE = 1;
+  static DOM_DELTA_PAGE = 2;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.deltaX = eventInitDict?.deltaX ?? 0;
+    this.deltaY = eventInitDict?.deltaY ?? 0;
+    this.deltaZ = eventInitDict?.deltaZ ?? 0;
+    this.deltaMode = eventInitDict?.deltaMode ?? 0;
+  }
+  get [Symbol.toStringTag]() {
+    return "WheelEvent";
+  }
+}
+class FocusEvent extends UIEvent {
+  relatedTarget;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.relatedTarget = eventInitDict?.relatedTarget ?? null;
+  }
+  get [Symbol.toStringTag]() {
+    return "FocusEvent";
+  }
+}
+var index_default = {
+  Event,
+  CustomEvent,
+  EventTarget,
+  MessageEvent,
+  ErrorEvent,
+  CloseEvent,
+  ProgressEvent,
+  UIEvent,
+  MouseEvent,
+  PointerEvent,
+  KeyboardEvent,
+  WheelEvent,
+  FocusEvent
+};
+export {
+  CloseEvent,
+  CustomEvent,
+  DOMException,
+  ErrorEvent,
+  Event,
+  EventTarget,
+  FocusEvent,
+  KeyboardEvent,
+  MessageEvent,
+  MouseEvent,
+  PointerEvent,
+  ProgressEvent,
+  UIEvent,
+  WheelEvent,
+  index_default as default
+};