matcha.css provides classes that respect @media (prefers-color-scheme) and are compatible with istanbul.js-like coverage reports.

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
 
 
 
 
x1
 
 
x8
x234
x234
x78
x303
x101
 
 
 
 
 
x78
 
 










I











/**
 * https://github.com/lowlighter/libs
 * @author Simon Lecoq (lowlighter)
 */
export class Context<T extends record> extends EventTarget {

  /** Dispatch event. */
  #dispatch(type: string, detail: Omit<detail, "type">) {
    Object.assign(detail, { type })
    this.dispatchEvent(new Context.Event(type, { detail }))
    if ((type === "set") || (type === "delete") || (type === "call")) {
      this.dispatchEvent(new Context.Event("change", { detail }))
    }
    for (const child of this.#children) {
      if (!Reflect.has(child.#target, detail.path[0] ?? detail.property)) {
        child.#dispatch(type, detail)
      }
    }
  }

}

Use with matcha.css's syntax highlighting classes for a extra synergy!