Quick start - Lit

Lit defaults to Shadow DOM - Listeners.js:101 qAll queries document, not shadowRoot, so classes inside a LitElement template do not animate unless you opt-out or scope.

Usage - Light DOM (recommended)

import { LitElement, html } from 'lit'
import { initAnimations } from 'gclass-anims'

class MyEl extends LitElement {
  createRenderRoot() { return this } // ← opt out of shadow
  firstUpdated() { initAnimations() }
  render() { return html`<div class="appear scroll spawn-up">hello lit</div>` }
}
customElements.define('my-el', MyEl)

Usage - Keep Shadow DOM

import { LitElement, html } from 'lit'
import initListeners from 'gclass-anims/Listeners.js'

class MyEl extends LitElement {
  firstUpdated() {
    // scope to shadowRoot - global initAnimations() misses it
    initListeners(this.shadowRoot)
  }
  render() { return html`<div class="spawn-up">hello shadow</div>` }
}
// slotted light-DOM content *does* animate with global initAnimations()
 // <my-el><span class="spawn-up">slotted - works</span></my-el>