cotomy 0.3.3 → 0.3.4

package/README.md

@@ -92,8 +92,8 @@ The View layer provides thin wrappers around DOM elements and window events.
   - `rect(): { top, left, width, height }`
   - `innerRect()` — Subtracts padding
 - Events
-  - Generic: `on(event, handler, options?)`, `off(event, handler?, options?)`, `once(event, handler, options?)`, `trigger(event[, Event])` — `trigger` emits bubbling events by default and can be customized by passing an `Event`
-  - Delegation: `onSubTree(event, selector, handler, options?)`
+  - Generic: `on(eventOrEvents, handler, options?)`, `off(eventOrEvents, handler?, options?)`, `once(eventOrEvents, handler, options?)`, `trigger(event[, Event])` — `eventOrEvents` accepts either a single event name or an array for batch registration/removal. `trigger` emits bubbling events by default and can be customized by passing an `Event`.
+  - Delegation: `onSubTree(eventOrEvents, selector, handler, options?)` — `eventOrEvents` can also be an array for listening to multiple delegated events at once.
   - Mouse: `click`, `dblclick`, `mouseover`, `mouseout`, `mousedown`, `mouseup`, `mousemove`, `mouseenter`, `mouseleave`
   - Keyboard: `keydown`, `keyup`, `keypress`
   - Inputs: `change`, `input`
@@ -137,7 +137,7 @@ document.body.appendChild(panel.element);
   - `append(element: CotomyElement)`
   - `moveNext(focused: CotomyElement, shift = false)` — Move focus to next/previous focusable
 - Window events
-  - `on(event, handler)` / `off(event, handler?)` / `trigger(event[, Event])` — CotomyWindow’s `trigger` also bubbles by default and accepts an `Event` to override the behavior
+  - `on(eventOrEvents, handler)` / `off(eventOrEvents, handler?)` / `trigger(event[, Event])` — `eventOrEvents` accepts a single event name or an array. CotomyWindow’s `trigger` also bubbles by default and accepts an `Event` to override the behavior.
   - `load(handler)` / `ready(handler)`
   - `resize([handler])` / `scroll([handler])` / `changeLayout([handler])` / `pageshow([handler])`
 - Window state

package/dist/browser/cotomy.js

@@ -1468,8 +1468,11 @@ class CotomyElement {
         return this;
     }
     on(event, handle, options) {
-        const entry = new HandlerEntry(handle, undefined, options);
-        EventRegistry.instance.on(event, this, entry);
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            const entry = new HandlerEntry(handle, undefined, options);
+            EventRegistry.instance.on(eventName, this, entry);
+        });
         return this;
     }
     onSubTree(event, selector, handle, options) {
@@ -1479,25 +1482,34 @@ class CotomyElement {
                 return handle(e);
             }
         };
-        const entry = new HandlerEntry(handle, delegate, options);
-        EventRegistry.instance.on(event, this, entry);
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            const entry = new HandlerEntry(handle, delegate, options);
+            EventRegistry.instance.on(eventName, this, entry);
+        });
         return this;
     }
     once(event, handle, options) {
         const mergedOptions = { ...(options ?? {}), once: true };
-        const entry = new HandlerEntry(handle, undefined, mergedOptions);
         this.off(event, handle, mergedOptions);
-        EventRegistry.instance.on(event, this, entry);
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            const entry = new HandlerEntry(handle, undefined, mergedOptions);
+            EventRegistry.instance.on(eventName, this, entry);
+        });
         return this;
     }
     off(event, handle, options) {
-        if (handle) {
-            const entry = new HandlerEntry(handle, undefined, options);
-            EventRegistry.instance.off(event, this, entry);
-        }
-        else {
-            EventRegistry.instance.off(event, this);
-        }
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            if (handle) {
+                const entry = new HandlerEntry(handle, undefined, options);
+                EventRegistry.instance.off(eventName, this, entry);
+            }
+            else {
+                EventRegistry.instance.off(eventName, this);
+            }
+        });
         return this;
     }
     click(handle) {
@@ -1902,22 +1914,34 @@ class CotomyWindow {
         window.dispatchEvent(e ?? new Event(event, { bubbles: true }));
     }
     on(event, handle) {
-        if (!this._eventHandlers[event])
-            this._eventHandlers[event] = [];
-        this._eventHandlers[event].push(handle);
-        window.addEventListener(event, handle);
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            if (!this._eventHandlers[eventName])
+                this._eventHandlers[eventName] = [];
+            this._eventHandlers[eventName].push(handle);
+            window.addEventListener(eventName, handle);
+        });
     }
     off(event, handle) {
-        if (handle) {
-            window.removeEventListener(event, handle);
-            this._eventHandlers[event] = this._eventHandlers[event]?.filter(h => h !== handle) ?? [];
-        }
-        else {
-            for (const h of this._eventHandlers[event] ?? []) {
-                window.removeEventListener(event, h);
+        const events = Array.isArray(event) ? event : [event];
+        events.forEach(eventName => {
+            if (handle) {
+                window.removeEventListener(eventName, handle);
+                const handlers = this._eventHandlers[eventName]?.filter(h => h !== handle) ?? [];
+                if (handlers.length > 0) {
+                    this._eventHandlers[eventName] = handlers;
+                }
+                else {
+                    delete this._eventHandlers[eventName];
+                }
             }
-            delete this._eventHandlers[event];
-        }
+            else {
+                for (const h of this._eventHandlers[eventName] ?? []) {
+                    window.removeEventListener(eventName, h);
+                }
+                delete this._eventHandlers[eventName];
+            }
+        });
     }
     load(handle) {
         this.on("load", handle);