@dooboostore/simple-web-component 1.0.48 → 1.0.50

package/README.md

@@ -39,11 +39,11 @@ class Dashboard extends HTMLElement {
 
 ### 3. **Declarative DOM Updates**
 
-#### @onConnectedShadow
+#### @onConnectedBodyShadow
 Render HTML automatically when component connects to DOM.
 
 ```typescript
-@onConnectedShadow
+@onConnectedBodyShadow
 render() {
   return `<div>Hello, <span>${this.name}</span>!</div>`;
 }
@@ -101,7 +101,7 @@ class ContentManager extends HTMLElement {
     return true;
   }
 
-  @onConnectedLight
+  @onConnectedBodyLight
   render() {
     return `
       <div>
@@ -171,7 +171,7 @@ class CounterApp extends HTMLElement {
     this.count++;  // Triggers automatic DOM update
   }
 
-  @onConnectedInnerHtml
+  @onConnectedBodyLight
   render() {
     return `
       <div>
@@ -254,7 +254,7 @@ class UserProfile extends HTMLElement {
     this.isEditing = !this.isEditing;
   }
 
-  @onConnectedShadow
+  @onConnectedBodyShadow
   render() {
     return `
       <div>
@@ -305,12 +305,88 @@ onCriticalClick(event: Event) {
 - `addEventListenerDocument(type, options)` - Listen on document
 - `addEventListenerDelegate(selector, type, options)` - Event delegation
 - `eventDelegate(selector, type, options)` - Short alias
-- `addEventListenerDelegateLightDom(selector, type, options)` - Delegate in light DOM
-- `eventDelegateLightDom(selector, type, options)` - Short alias
-- `addEventListenerDelegateShadowDom(selector, type, options)` - Delegate in shadow DOM
-- `eventDelegateShadowDom(selector, type, options)` - Short alias
-- `addEventListenerDelegateAllDom(selector, type, options)` - Delegate in all DOM
-- `eventDelegateAllDom(selector, type, options)` - Short alias
+- `addEventListenerDelegateLight(selector, type, options)` - Delegate in light DOM
+- `eventDelegateLight(selector, type, options)` - Short alias
+- `addEventListenerDelegateShadow(selector, type, options)` - Delegate in shadow DOM
+- `eventDelegateShadow(selector, type, options)` - Short alias
+- `addEventListenerDelegateAll(selector, type, options)` - Delegate in all DOM
+- `eventDelegateAll(selector, type, options)` - Short alias
+- `addEventListenerLight(selector, type, options)` / `eventLight(...)` - Bind (non-delegated) in light DOM
+- `addEventListenerShadow(selector, type, options)` / `eventShadow(...)` - Bind (non-delegated) in shadow DOM
+- `addEventListenerAll(selector, type, options)` / `eventAll(...)` - Bind (non-delegated) in both light & shadow DOM
+- `addEventListenerMutation(selector, type, options)` / `eventMutation(...)` - Delegate via `MutationObserver` instead of event bubbling (useful for non-bubbling events like `focus`/`blur`); `*Light`/`*Shadow`/`*All` variants also available
+
+**Event-Type-Specific Aliases (eventClick, eventInputThis, ...):**
+
+Beyond the generic `event(selector, type, options)` form, every scope/delegate variant above is also pre-bound to ~59 common DOM event types, so you don't have to repeat the type string:
+
+```typescript
+@eventClick('.logo')
+onLogoClick() { ... }
+
+// Same as: @eventDelegateLight('.item', 'click')
+@eventClickDelegateLight('.item')
+onItemClick(event: Event) { ... }
+
+// Same as: @addEventListenerThis('keydown')
+@eventKeydownThis()
+onKeydown(event: KeyboardEvent) { ... }
+```
+
+Naming pattern: `event` + `PascalCase(type)` + scope suffix (`''`(base) / `DelegateLight` / `DelegateShadow` / `DelegateAll` / `Delegate` / `MutationLight` / `MutationShadow` / `MutationAll` / `Mutation` / `Light` / `Shadow` / `All` / `This` / `AppHost` / `Window` / `Document`) — e.g. `eventClick`, `eventClickDelegateShadow`, `eventDblclickThis`, `eventPointerdownDelegateAll`, `eventKeydownWindow`.
+
+Covered event types include mouse (`click`, `dblclick`, `mousedown`, `mouseup`, `mousemove`, `mouseover`, `mouseout`, `mouseenter`, `mouseleave`, `contextmenu`, `wheel`), keyboard (`keydown`, `keyup`, `keypress`), form (`input`, `change`, `submit`, `reset`, `invalid`, `select`), focus (`focus`, `blur`, `focusin`, `focusout`), drag & drop (`dragstart`, `drag`, `dragend`, `dragenter`, `dragleave`, `dragover`, `drop`), touch (`touchstart`, `touchmove`, `touchend`, `touchcancel`), pointer (`pointerdown`, `pointerup`, `pointermove`, `pointerover`, `pointerout`, `pointerenter`, `pointerleave`, `pointercancel`), clipboard (`copy`, `cut`, `paste`), animation/transition (`animationstart/end/iteration/cancel`, `transitionstart/end/cancel/run`), and misc (`scroll`, `resize`, `load`, `error`, `toggle`).
+
+These aliases are generated in `addEventListener.ts` from a small internal `makeTypedEventAliases<TEvent>(type)` factory — adding a new event type is a one-line addition, not hand-written boilerplate. Any event type not covered still works via the generic `@event(selector, 'your-type', options)` / `@eventDelegateLight(selector, 'your-type', options)` etc.
+
+#### Order-Independent Parameter Decorators (@eventObject, @matchedElement, @hostSet, @helperHostSet, @helperSet)
+
+`@addEventListener`-bound handlers normally receive fixed positional arguments (`(event, legacyHelper1, legacyHelper2)`). If you'd rather not memorize that order, decorate individual parameters instead — order and position no longer matter, and any parameter left undecorated in a method that uses none of these decorators still gets the legacy positional arguments (fully backward-compatible):
+
+```typescript
+import { addEventListener, eventObject, matchedElement, hostSet, helperHostSet, helperSet } from '@dooboostore/simple-web-component';
+
+@elementDefine('product-list')
+class ProductList extends HTMLElement {
+  // Order can be anything you like
+  @addEventListenerDelegateLight('.item', 'click')
+  onItemClick(@matchedElement $item: Element, @eventObject event: Event) {
+    console.log('clicked item:', $item, event);
+  }
+
+  // Only need the host tree info? Just ask for @hostSet.
+  @eventClickThis()
+  onHostClick(@hostSet hs: HostSet) {
+    console.log(hs.$appHost, hs.$hosts);
+  }
+
+  // Need DOM helpers ($q, $qa, ...) too? Use @helperHostSet (superset of @hostSet) or @helperSet (helpers only).
+  @eventClickThis()
+  onHostClickFull(@helperHostSet full: HelperHostSet, @helperSet helpers: HelperSet) { ... }
+}
+```
+
+- `@eventObject` - the original DOM `Event`
+- `@matchedElement` - the delegate-matched element (or `event.currentTarget` for direct bindings)
+- `@hostSet` - host-ancestor-tree info only (`$host`, `$parentHost`, `$hosts`, `$appHost`, `$appHosts`, `$firstHost`, `$lastHost`, `$firstAppHost`, `$lastAppHost`)
+- `@helperHostSet` - `@hostSet` + DOM/window helpers (`$d`, `$w`, `$q`, `$qa`, `$qi`) + `$this`
+- `@helperSet` - DOM/window helpers only (`$d`, `$w`, `$q`, `$qa`, `$qi`), no host-tree info
+
+The same mechanism (and the same 5 decorators, plus two more) also applies to:
+- **`@onInitialize`/`@onConnectedBefore`/`@onConnectedAfter`/... lifecycle methods** — can freely mix `@hostSet`/`@helperHostSet`/`@helperSet` with `@inject(...)` on the same method.
+- **`@subscribeSwcAppRouteChangeWhileConnected`** — add `@routerEvent` to receive the `RouterEventType` regardless of position.
+- **`@subscribeSwcAppMessageWhileConnected`** — add `@appMessage` to receive the `SwcAppMessage` regardless of position.
+
+```typescript
+@onConnectedAfter
+onconstructor(@inject(UserService.SYMBOL) userService: UserService, @hostSet hs: HostSet) { ... }
+
+@subscribeSwcAppRouteChangeWhileConnected()
+onRouteChanged(@helperSet helpers: HelperSet, @routerEvent re: RouterEventType) { ... }
+
+@subscribeSwcAppMessageWhileConnected
+onMessage(@hostSet hs: HostSet, @appMessage msg: SwcAppMessage) { ... }
+```
 
 #### @emitCustomEvent
 Emit custom events with data.
@@ -613,9 +689,9 @@ class FormHandler extends HTMLElement {
 - `@setProperty('#selector', 'propertyName', options)` - Set property on selector with options
 - `@setProperty` - Bare decorator (uses method name as property on $this)
 
-### 6.6 **DOM Observers (@mutationObserver, @resizeObserver)**
+### 6.6 **DOM Observers (@mutationObserver, @resizeObserver, @intersectionObserver)**
 
-Observe DOM mutations and element size changes declaratively. Both decorators share the same pattern as `@event` — they support optional selector (defaults to `$this`), root-based helpers, and `delegate` mode.
+Observe DOM mutations, element size changes, and viewport intersection declaratively. All three decorators share the same pattern as `@event` — they support optional selector (defaults to `$this`), root-based helpers, and `delegate` mode.
 
 #### @mutationObserver
 Detect DOM changes (child add/remove, attribute changes, text changes) and react automatically.
@@ -708,8 +784,52 @@ class ChartWidget extends HTMLElement {
 **Combining with @resizeObserver delegate (dynamic tracking):**
 When `delegate: true`, an internal `MutationObserver` automatically observes the root so that elements matching the selector are tracked even after being dynamically added/removed from the DOM.
 
+#### @intersectionObserver
+Detect when elements enter/exit the viewport (or a custom scroll container) and react automatically — useful for lazy loading, infinite scroll, and visibility tracking.
+
+```typescript
+@elementDefine('lazy-image-list')
+class LazyImageList extends HTMLElement {
+  // Fire when any matching element crosses the viewport boundary
+  @intersectionObserverLight('.lazy-img', { threshold: 0 })
+  onImageVisible(matchedEls: HTMLElement[], entries: IntersectionObserverEntry[], observer: IntersectionObserver) {
+    entries.forEach(e => {
+      if (e.isIntersecting) (e.target as HTMLImageElement).src = (e.target as HTMLElement).dataset.src!;
+    });
+  }
+
+  // Delegate mode tracks dynamically added elements too
+  @intersectionObserverDelegateShadow('.card', { threshold: [0, 0.5, 1] })
+  onCardIntersect(matchedEls: HTMLElement[], entries: IntersectionObserverEntry[], observer: IntersectionObserver) {
+    console.log('intersection ratio:', entries[0]?.intersectionRatio);
+  }
+}
+```
+
+**Callback signature:**
+- `matchedEls: HTMLElement[]` - Elements matching the selector (1st arg)
+- `entries: IntersectionObserverEntry[]` - Original observer entries (2nd arg)
+- `observer: IntersectionObserver` - The observer instance (3rd arg)
+
+**@intersectionObserver Options:**
+- Standard `IntersectionObserverInit` options: `threshold`, `rootMargin` (note: its own scroll-container `root` is passed as `intersectionRoot`, since the decorator's `root` option already means light/shadow/all/auto selector scope)
+- `delegate` - Observe root and filter by selector in callback (dynamically added/removed elements are tracked too)
+- `root` - `'light' | 'shadow' | 'all' | 'auto'`
+- `filter` - Additional callback filter
+- `removeObserver` - Cleanup callback called on disconnect `(target, options)`
+
+**@intersectionObserver Decorator Variants:**
+- `intersectionObserver(selector?, options?)` - Full form (selector defaults to `$this`)
+- `intersectionObserverLight(selector?, options?)` - Observe light DOM
+- `intersectionObserverShadow(selector?, options?)` - Observe shadow DOM
+- `intersectionObserverAll(selector?, options?)` - Observe both light & shadow
+- `intersectionObserverDelegate(selector?, options?)` - Delegate mode (root observe)
+- `intersectionObserverDelegateLight(selector?, options?)` - Delegate in light DOM
+- `intersectionObserverDelegateShadow(selector?, options?)` - Delegate in shadow DOM
+- `intersectionObserverDelegateAll(selector?, options?)` - Delegate in all DOM
+
 **Cleanup:**
-Both observers are automatically disconnected when the component is removed from the DOM. `removeObserver` callbacks (if provided) are invoked during cleanup.
+All three observers are automatically disconnected when the component is removed from the DOM. `removeObserver` callbacks (if provided) are invoked during cleanup.
 
 ### 7. **DOM Manipulation with applyNode**
 
@@ -736,7 +856,7 @@ class ContentUpdater extends HTMLElement {
     return `<p>Prepended content</p>`;
   }
 
-  @onConnectedLight
+  @onConnectedBodyLight
   render() {
     return `
       <div>
@@ -802,7 +922,7 @@ class StyledComponent extends HTMLElement {
     };
   }
 
-  @onConnectedLight
+  @onConnectedBodyLight
   render() {
     return `
       <div>
@@ -909,6 +1029,57 @@ onFirst() { }
 onSecond() { }
 ```
 
+### 8.6 **Timers (@setInterval, @setTimeout)**
+
+Declaratively run a method on a repeating interval or after a one-time delay, tied to the component's connected lifecycle. Both are pure metadata-collecting decorators — they never touch the method itself (no `descriptor.value` wrapping) — so they compose safely with any other decorator stacked on the same method, regardless of declaration order. All the actual scheduling/cleanup is handled by `SetIntervalLifeCycler`/`SetTimeoutLifeCycler` (`ElementDefineLifeCycler` implementations, same plugin pattern as the observers above):
+
+- Starts automatically when the component connects.
+- Automatically `clearInterval`/`clearTimeout`s when the component disconnects — no manual cleanup needed.
+
+```typescript
+@elementDefine('live-clock')
+class LiveClock extends HTMLElement {
+  @setInterval(1000, {
+    parameter: (set) => [Date.now()],
+    created: (set, id) => console.log('interval started, timer id:', id)
+  })
+  tick(now: number) {
+    this.textContent = new Date(now).toLocaleTimeString();
+  }
+
+  // No options - called with no arguments, once per second
+  @setInterval(1000)
+  onTick() {
+    console.log('tick');
+  }
+
+  // Fires once, 3 seconds after connect
+  @setTimeout(3000)
+  onceAfter3s() {
+    console.log('3 seconds have passed');
+  }
+}
+```
+
+**`@setInterval(interval, options?)` / `@setTimeout(delay, options?)`:**
+- `interval` / `delay` - milliseconds. `setInterval` repeats; `setTimeout` fires once.
+- `parameter?: (set: HelperHostSet) => any[]` - computes the arguments passed to the method on each tick/fire. Omitted → method is called with no arguments.
+- `created?: (set: HelperHostSet, id: number) => void` - fires once, right after the timer is armed, with the real `setInterval`/`setTimeout` return value. For logging/debugging only — cleanup is still handled automatically, this is not a manual-clear hook.
+- `valueKey?: symbol | string` - same convention as `@applyAttribute`'s `valueKey` (see "Multiple Decorators with Shared Return Value" below): if the method's return value is an object and this key's value is a function, that function is called on every tick/fire — but note the callback signature is just `(id: number)`, not `(set, id)` like `created`.
+
+```typescript
+@setInterval(900, { valueKey: 'onTick' })
+poll() {
+  return {
+    onTick: (id: number) => console.log('interval', id, 'ticked'),
+  };
+}
+```
+
+**Why no wrapping is needed:** unlike `@applyAttribute`/`@setAttribute` (which must wrap the method because it can be called by arbitrary code — event handlers, other decorators, etc.), the timer's own `LifeCycler` is the one calling `inst[propertyKey](...)` every tick/fire — it already has the return value in hand at that call site, so it can read `valueKey` off of it without ever needing to intercept the method.
+
+> `@requestAnimationFrame` is not implemented yet.
+
 ### 9. **Structural Directives**
 
 Structural Directives allow declarative conditional rendering, list iteration, async handling, and routing with automatic attribute substitution and dynamic expressions.
@@ -1426,6 +1597,7 @@ class MixedKeysExample extends HTMLElement {
 - `@applyClass` / `@updateClass` / etc.
 - `@emitCustomEvent` / `@emit`
 - `@publishSwcAppMessage` / `@publish`
+- `@setInterval` / `@setTimeout` - variant: the extracted value must itself be a function, and that function is invoked with `(id: number)` on every tick/fire (see "Timers" section above) rather than being applied directly like the other decorators here.
 
 Each decorator will use only its corresponding value from the return object, preventing conflicts and allowing clean separation of concerns.
 
@@ -1517,9 +1689,7 @@ method() { ... }
 
 **query.ts:**
 - `query(selector?, options?)` - Query single element (supports $this, $host, $appHost, etc.)
-
-**queryAll.ts:**
-- `queryAll(selector?, options?)` - Query multiple elements
+- `queryAll(selector?, options?)` - Query multiple elements (same file as `query`)
 
 **emitCustomEvent.ts:**
 - `emitCustomEvent(target, type, options?)` - Emit custom events

package/dist/cjs/config/config.js

@@ -81,6 +81,6 @@ const HTML_TAG_ENTRIES = [
   ["HTMLHeadingElement", "h1"],
   ["HTMLBodyElement", "body"]
 ];
-const DOM_EVENT_NAMES = ["click", "dblclick", "mousedown", "mouseenter", "mouseleave", "mousemove", "mouseout", "mouseover", "mouseup", "contextmenu", "keydown", "keypress", "keyup", "blur", "change", "focus", "focusin", "focusout", "input", "invalid", "reset", "search", "select", "submit", "drag", "dragend", "dragenter", "dragleave", "dragover", "dragstart", "drop", "copy", "cut", "paste", "abort", "canplay", "canplaythrough", "durationchange", "emptied", "ended", "error", "loadeddata", "loadedmetadata", "loadstart", "pause", "play", "playing", "progress", "ratechange", "seeked", "seeking", "stalled", "suspend", "timeupdate", "volumechange", "waiting", "scroll", "resize", "load", "unload", "hashchange", "connected"];
+const DOM_EVENT_NAMES = ["click", "dblclick", "mousedown", "mouseenter", "mouseleave", "mousemove", "mouseout", "mouseover", "mouseup", "contextmenu", "keydown", "keypress", "keyup", "blur", "change", "focus", "focusin", "focusout", "input", "invalid", "reset", "search", "select", "submit", "drag", "dragend", "dragenter", "dragleave", "dragover", "dragstart", "drop", "copy", "cut", "paste", "abort", "canplay", "canplaythrough", "durationchange", "emptied", "ended", "error", "loadeddata", "loadedmetadata", "loadstart", "pause", "play", "playing", "progress", "ratechange", "seeked", "seeking", "stalled", "suspend", "timeupdate", "volumechange", "waiting", "scroll", "resize", "load", "hashchange", "connected"];
 const BROWSER_GLOBALS = ["window", "document", "Node", "Element", "HTMLElement", "DocumentFragment", "CustomEvent", "customElements", "NodeFilter", ...HTML_TAG_ENTRIES.map(([className]) => className)];
 //# sourceMappingURL=config.js.map

package/dist/cjs/config/config.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/config.ts"],
-  "sourcesContent": ["export const HTML_TAG_ENTRIES: [string, string][] = [\n  ['HTMLAnchorElement', 'a'],\n  ['HTMLAreaElement', 'area'],\n  ['HTMLAudioElement', 'audio'],\n  ['HTMLBaseElement', 'base'],\n  ['HTMLButtonElement', 'button'],\n  ['HTMLCanvasElement', 'canvas'],\n  ['HTMLDataElement', 'data'],\n  ['HTMLDataListElement', 'datalist'],\n  ['HTMLDetailsElement', 'details'],\n  ['HTMLDialogElement', 'dialog'],\n  ['HTMLDivElement', 'div'],\n  ['HTMLDListElement', 'dl'],\n  ['HTMLEmbedElement', 'embed'],\n  ['HTMLFieldSetElement', 'fieldset'],\n  ['HTMLFormElement', 'form'],\n  ['HTMLHRElement', 'hr'],\n  ['HTMLIFrameElement', 'iframe'],\n  ['HTMLImageElement', 'img'],\n  ['HTMLInputElement', 'input'],\n  ['HTMLLabelElement', 'label'],\n  ['HTMLLegendElement', 'legend'],\n  ['HTMLLIElement', 'li'],\n  ['HTMLLinkElement', 'link'],\n  ['HTMLMapElement', 'map'],\n  ['HTMLMetaElement', 'meta'],\n  ['HTMLMeterElement', 'meter'],\n  ['HTMLModElement', 'del'],\n  ['HTMLObjectElement', 'object'],\n  ['HTMLOListElement', 'ol'],\n  ['HTMLOptGroupElement', 'optgroup'],\n  ['HTMLOptionElement', 'option'],\n  ['HTMLOutputElement', 'output'],\n  ['HTMLParagraphElement', 'p'],\n  ['HTMLParamElement', 'param'],\n  ['HTMLPictureElement', 'picture'],\n  ['HTMLPreElement', 'pre'],\n  ['HTMLProgressElement', 'progress'],\n  ['HTMLQuoteElement', 'blockquote'],\n  ['HTMLScriptElement', 'script'],\n  ['HTMLSelectElement', 'select'],\n  ['HTMLSlotElement', 'slot'],\n  ['HTMLSourceElement', 'source'],\n  ['HTMLSpanElement', 'span'],\n  ['HTMLStyleElement', 'style'],\n  ['HTMLTableElement', 'table'],\n  ['HTMLTableSectionElement', 'tbody'],\n  ['HTMLTableCellElement', 'td'],\n  ['HTMLTemplateElement', 'template'],\n  ['HTMLTextAreaElement', 'textarea'],\n  ['HTMLTimeElement', 'time'],\n  ['HTMLTitleElement', 'title'],\n  ['HTMLTableRowElement', 'tr'],\n  ['HTMLTrackElement', 'track'],\n  ['HTMLUListElement', 'ul'],\n  ['HTMLVideoElement', 'video'],\n  ['HTMLHeadingElement', 'h1'],\n  ['HTMLBodyElement', 'body']\n];\n\nexport const DOM_EVENT_NAMES = ['click', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'contextmenu', 'keydown', 'keypress', 'keyup', 'blur', 'change', 'focus', 'focusin', 'focusout', 'input', 'invalid', 'reset', 'search', 'select', 'submit', 'drag', 'dragend', 'dragenter', 'dragleave', 'dragover', 'dragstart', 'drop', 'copy', 'cut', 'paste', 'abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting', 'scroll', 'resize', 'load', 'unload', 'hashchange', 'connected'];\n\nexport const BROWSER_GLOBALS = ['window', 'document', 'Node', 'Element', 'HTMLElement', 'DocumentFragment', 'CustomEvent', 'customElements', 'NodeFilter', ...HTML_TAG_ENTRIES.map(([className]) => className)];\n"],
-  "mappings": "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",
+  "sourcesContent": ["export const HTML_TAG_ENTRIES: [string, string][] = [\n  ['HTMLAnchorElement', 'a'],\n  ['HTMLAreaElement', 'area'],\n  ['HTMLAudioElement', 'audio'],\n  ['HTMLBaseElement', 'base'],\n  ['HTMLButtonElement', 'button'],\n  ['HTMLCanvasElement', 'canvas'],\n  ['HTMLDataElement', 'data'],\n  ['HTMLDataListElement', 'datalist'],\n  ['HTMLDetailsElement', 'details'],\n  ['HTMLDialogElement', 'dialog'],\n  ['HTMLDivElement', 'div'],\n  ['HTMLDListElement', 'dl'],\n  ['HTMLEmbedElement', 'embed'],\n  ['HTMLFieldSetElement', 'fieldset'],\n  ['HTMLFormElement', 'form'],\n  ['HTMLHRElement', 'hr'],\n  ['HTMLIFrameElement', 'iframe'],\n  ['HTMLImageElement', 'img'],\n  ['HTMLInputElement', 'input'],\n  ['HTMLLabelElement', 'label'],\n  ['HTMLLegendElement', 'legend'],\n  ['HTMLLIElement', 'li'],\n  ['HTMLLinkElement', 'link'],\n  ['HTMLMapElement', 'map'],\n  ['HTMLMetaElement', 'meta'],\n  ['HTMLMeterElement', 'meter'],\n  ['HTMLModElement', 'del'],\n  ['HTMLObjectElement', 'object'],\n  ['HTMLOListElement', 'ol'],\n  ['HTMLOptGroupElement', 'optgroup'],\n  ['HTMLOptionElement', 'option'],\n  ['HTMLOutputElement', 'output'],\n  ['HTMLParagraphElement', 'p'],\n  ['HTMLParamElement', 'param'],\n  ['HTMLPictureElement', 'picture'],\n  ['HTMLPreElement', 'pre'],\n  ['HTMLProgressElement', 'progress'],\n  ['HTMLQuoteElement', 'blockquote'],\n  ['HTMLScriptElement', 'script'],\n  ['HTMLSelectElement', 'select'],\n  ['HTMLSlotElement', 'slot'],\n  ['HTMLSourceElement', 'source'],\n  ['HTMLSpanElement', 'span'],\n  ['HTMLStyleElement', 'style'],\n  ['HTMLTableElement', 'table'],\n  ['HTMLTableSectionElement', 'tbody'],\n  ['HTMLTableCellElement', 'td'],\n  ['HTMLTemplateElement', 'template'],\n  ['HTMLTextAreaElement', 'textarea'],\n  ['HTMLTimeElement', 'time'],\n  ['HTMLTitleElement', 'title'],\n  ['HTMLTableRowElement', 'tr'],\n  ['HTMLTrackElement', 'track'],\n  ['HTMLUListElement', 'ul'],\n  ['HTMLVideoElement', 'video'],\n  ['HTMLHeadingElement', 'h1'],\n  ['HTMLBodyElement', 'body']\n];\n\nexport const DOM_EVENT_NAMES = ['click', 'dblclick', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'contextmenu', 'keydown', 'keypress', 'keyup', 'blur', 'change', 'focus', 'focusin', 'focusout', 'input', 'invalid', 'reset', 'search', 'select', 'submit', 'drag', 'dragend', 'dragenter', 'dragleave', 'dragover', 'dragstart', 'drop', 'copy', 'cut', 'paste', 'abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting', 'scroll', 'resize', 'load', 'hashchange', 'connected'];\n\nexport const BROWSER_GLOBALS = ['window', 'document', 'Node', 'Element', 'HTMLElement', 'DocumentFragment', 'CustomEvent', 'customElements', 'NodeFilter', ...HTML_TAG_ENTRIES.map(([className]) => className)];\n"],
+  "mappings": "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",
   "names": []
 }