@typed/template 0.5.4 → 0.7.0

package/src/Placeholder.ts

@@ -21,7 +21,7 @@ export type PlaceholderTypeId = typeof PlaceholderTypeId
 /**
  * @since 1.0.0
  */
-export interface Placeholder<out R = never, out E = never, out A = unknown> {
+export interface Placeholder<A = unknown, E = never, R = never> {
   readonly [PlaceholderTypeId]: {
     readonly _R: (_: never) => R
     readonly _E: (_: never) => E
@@ -37,32 +37,32 @@ export namespace Placeholder {
    * @since 1.0.0
    */
   export type Any<A = any> =
-    | Placeholder<any, any, A>
-    | Placeholder<any, never, A>
-    | Placeholder<never, never, A>
-    | Placeholder<never, any, A>
+    | Placeholder<A, any, any>
+    | Placeholder<A, never, any>
+    | Placeholder<A>
+    | Placeholder<A, any>
 
   /**
    * @since 1.0.0
    */
-  export type Context<T> = [T] extends [never] ? never : T extends Placeholder<infer R, infer _E, infer _A> ? R : never
+  export type Context<T> = [T] extends [never] ? never : T extends Placeholder<infer _A, infer _E, infer R> ? R : never
   /**
    * @since 1.0.0
    */
-  export type Error<T> = [T] extends [never] ? never : T extends Placeholder<infer _R, infer E, infer _A> ? E : never
+  export type Error<T> = [T] extends [never] ? never : T extends Placeholder<infer _A, infer E, infer _R> ? E : never
   /**
    * @since 1.0.0
    */
-  export type Success<T> = [T] extends [never] ? never : T extends Placeholder<infer _R, infer _E, infer A> ? A : never
+  export type Success<T> = [T] extends [never] ? never : T extends Placeholder<infer A, infer _E, infer _R> ? A : never
 
   /**
    * @since 1.0.0
    */
-  export function asRef<R = never, E = never, A = never>(
-    placeholder: Placeholder<R, E, A> | Fx<R, E, A> | Effect.Effect<R, E, A> | A
-  ): Effect.Effect<R | Scope.Scope, never, RefSubject.RefSubject<never, E, A>> {
-    if (isFx<R, E, A>(placeholder) || Effect.isEffect(placeholder)) {
-      return RefSubject.make(placeholder as Fx<R, E, A>)
+  export function asRef<A = never, E = never, R = never>(
+    placeholder: Placeholder<A, E, R> | Fx<A, E, R> | Effect.Effect<A, E, R> | A
+  ): Effect.Effect<RefSubject.RefSubject<A, E>, never, R | Scope.Scope> {
+    if (isFx<A, E, R>(placeholder) || Effect.isEffect(placeholder)) {
+      return RefSubject.make(placeholder as Fx<A, E, R>)
     } else {
       return RefSubject.of<A, E>(placeholder as A)
     }

package/src/Platform.ts

@@ -20,10 +20,10 @@ const HYPHENATED_CONTENT_TYPE = { "content-type": HTML_CONTENT_TYPE }
 /**
  * @since 1.0.0
  */
-export function htmlResponse<R, E>(
-  fx: Fx.Fx<R, E, RenderEvent>,
+export function htmlResponse<E, R>(
+  fx: Fx.Fx<RenderEvent, E, R>,
   options?: HttpServer.response.Options
-): Effect.Effect<RenderContext.RenderContext | Exclude<R, RenderTemplate>, E, HttpServer.response.ServerResponse> {
+): Effect.Effect<HttpServer.response.ServerResponse, E, RenderContext.RenderContext | Exclude<R, RenderTemplate>> {
   return Effect.contextWithEffect((ctx) =>
     HttpServer.response.stream(
       Stream.provideContext(Stream.encodeText(toStream(renderToHtml(fx))), ctx),

package/src/Render.ts

@@ -23,8 +23,8 @@ export type ToRendered<T extends RenderEvent | null> = T extends null ? Rendered
  * @since 1.0.0
  */
 export function render<R, E, T extends RenderEvent | null>(
-  rendered: Fx.Fx<R, E, T>
-): Fx.Fx<Exclude<R, RenderTemplate> | Document | RenderContext | RootElement, E, ToRendered<T>> {
+  rendered: Fx.Fx<T, E, R>
+): Fx.Fx<ToRendered<T>, E, Exclude<R, RenderTemplate> | Document | RenderContext | RootElement> {
   return Fx.fromFxEffect(Effect.contextWith((context) => {
     const [document, ctx, { rootElement }] = Context.getMany(context, Document, RenderContext, RootElement)
 
@@ -40,11 +40,11 @@ export function render<R, E, T extends RenderEvent | null>(
  * @since 1.0.0
  */
 export function renderLayer<R, E, T extends RenderEvent | null>(
-  rendered: Fx.Fx<R, E, T>
+  rendered: Fx.Fx<T, E, R>
 ): Layer.Layer<
-  Document | RenderContext | RootElement | Exclude<Exclude<R, RenderTemplate>, Scope.Scope>,
   never,
-  never
+  never,
+  Document | RenderContext | RootElement | Exclude<Exclude<R, RenderTemplate>, Scope.Scope>
 > {
   return Fx.drainLayer(Fx.switchMapCause(render(rendered), (e) => Fx.fromEffect(Effect.logError(e))))
 }

package/src/RenderContext.ts

@@ -57,7 +57,7 @@ export const RenderContext: Context.Tagged<RenderContext, RenderContext> = Conte
  * @since 1.0.0
  */
 export interface RenderQueue {
-  readonly add: (part: unknown, task: () => void) => Effect.Effect<Scope.Scope, never, void>
+  readonly add: (part: unknown, task: () => void) => Effect.Effect<void, never, Scope.Scope>
 }
 
 /**
@@ -120,7 +120,7 @@ const buildWithCurrentEnvironment = (environment: Environment, skipRenderSchedul
 export const dom: (
   window: Window & GlobalThis,
   options?: DomServicesElementParams & { readonly skipRenderScheduling?: boolean }
-) => Layer.Layer<never, never, RenderContext | CurrentEnvironment | DomServices> = (window, options) =>
+) => Layer.Layer<RenderContext | CurrentEnvironment | DomServices> = (window, options) =>
   Layer.provideMerge(
     Layer.mergeAll(
       buildWithCurrentEnvironment(
@@ -135,11 +135,11 @@ export const dom: (
 /**
  * @since 1.0.0
  */
-export const server: Layer.Layer<never, never, RenderContext | CurrentEnvironment> = buildWithCurrentEnvironment(
+export const server: Layer.Layer<RenderContext | CurrentEnvironment> = buildWithCurrentEnvironment(
   "server"
 )
 
-const static_: Layer.Layer<never, never, RenderContext | CurrentEnvironment> = buildWithCurrentEnvironment("static")
+const static_: Layer.Layer<RenderContext | CurrentEnvironment> = buildWithCurrentEnvironment("static")
 
 export {
   /**
@@ -151,7 +151,7 @@ export {
 class RenderQueueImpl implements RenderQueue {
   queue = new Map<unknown, () => void>()
   scheduled = false
-  run: Effect.Effect<Scope.Scope, never, void>
+  run: Effect.Effect<void, never, Scope.Scope>
 
   constructor(
     readonly scope: Scope.Scope,
@@ -196,7 +196,7 @@ class RenderQueueImpl implements RenderQueue {
     )
   })
 
-  runIdle: Effect.Effect<Scope.Scope, never, void> = Effect.suspend(() => {
+  runIdle: Effect.Effect<void, never, Scope.Scope> = Effect.suspend(() => {
     return Effect.flatMap(
       Idle.whenIdle(this.options),
       (deadline) =>
@@ -219,8 +219,8 @@ class RenderQueueImpl implements RenderQueue {
     )
   })
 
-  runAnimationFrame: Effect.Effect<Scope.Scope, never, void> = Effect.zipRight(
-    Effect.asyncOption<never, never, void>((cb) => {
+  runAnimationFrame: Effect.Effect<void, never, Scope.Scope> = Effect.zipRight(
+    Effect.asyncOption<void>((cb) => {
       const id = requestAnimationFrame(() => cb(Effect.unit))
       return Option.some(Effect.sync(() => cancelAnimationFrame(id)))
     }),

package/src/RenderTemplate.ts

@@ -16,11 +16,7 @@ export interface RenderTemplate {
   <Values extends ReadonlyArray<Renderable<any, any>>>(
     templateStrings: TemplateStringsArray,
     values: Values
-  ): Fx.Fx<
-    Scope | Placeholder.Context<Values[number]>,
-    Placeholder.Error<Values[number]>,
-    RenderEvent
-  >
+  ): Fx.Fx<RenderEvent, Placeholder.Error<Values[number]>, Scope | Placeholder.Context<Values[number]>>
 }
 
 /**
@@ -38,6 +34,6 @@ export const RenderTemplate: Context.Tagged<RenderTemplate, RenderTemplate> = Co
 export function html<const Values extends ReadonlyArray<Renderable<any, any>>>(
   template: TemplateStringsArray,
   ...values: Values
-): Fx.Fx<RenderTemplate | Scope | Placeholder.Context<Values[number]>, Placeholder.Error<Values[number]>, RenderEvent> {
+): Fx.Fx<RenderEvent, Placeholder.Error<Values[number]>, RenderTemplate | Scope | Placeholder.Context<Values[number]>> {
   return Fx.fromFxEffect(RenderTemplate.with((render) => render(template, values)))
 }

package/src/Renderable.ts

@@ -12,12 +12,12 @@ import type { RenderEvent } from "./RenderEvent.js"
  */
 export type Renderable<R = never, E = never> =
   | Renderable.Value
-  | Placeholder<R, E, any>
-  | { readonly [key: string]: Renderable<R, E> | Placeholder<R, E, any> | unknown } // TODO: Should we manage data attributes this way?
-  | Placeholder<R, E, any>
-  | Effect<R, E, any>
-  | Fx<R, E, any>
-  | ReadonlyArray<Renderable<R, E>>
+  | Placeholder<any, E, R>
+  | { readonly [key: string]: Renderable<E, R> | Placeholder<any, E, R> | unknown } // TODO: Should we manage data attributes this way?
+  | Placeholder<any, E, R>
+  | Effect<any, E, R>
+  | Fx<any, E, R>
+  | ReadonlyArray<Renderable<E, R>>
 
 /**
  * @since 1.0.0

package/src/Test.ts

@@ -42,32 +42,32 @@ export interface TestRender<E> {
   readonly window: Window & GlobalThis
   readonly document: Document
   readonly elementRef: ElementRef.ElementRef
-  readonly errors: RefSubject.Computed<never, never, ReadonlyArray<E>>
-  readonly lastError: RefSubject.Filtered<never, never, E>
-  readonly interrupt: Effect.Effect<never, never, void>
+  readonly errors: RefSubject.Computed<ReadonlyArray<E>>
+  readonly lastError: RefSubject.Filtered<E>
+  readonly interrupt: Effect.Effect<void>
   readonly makeEvent: (type: string, eventInitDict?: EventInit) => Event
   readonly makeCustomEvent: <A>(type: string, eventInitDict?: CustomEventInit<A>) => CustomEvent<A>
-  readonly dispatchEvent: (options: EventOptions) => Effect.Effect<never, Cause.NoSuchElementException, void>
-  readonly click: (options?: Omit<EventOptions, "event">) => Effect.Effect<never, Cause.NoSuchElementException, void>
+  readonly dispatchEvent: (options: EventOptions) => Effect.Effect<void, Cause.NoSuchElementException>
+  readonly click: (options?: Omit<EventOptions, "event">) => Effect.Effect<void, Cause.NoSuchElementException>
 }
 
 /**
  * @since 1.0.0
  */
-export function testRender<R, E>(
-  fx: Fx.Fx<R, E, RenderEvent>,
+export function testRender<E, R>(
+  fx: Fx.Fx<RenderEvent, E, R>,
   options?:
     & HappyDOMOptions
     & { readonly [K in keyof DomServicesElementParams]?: (document: Document) => DomServicesElementParams[K] }
 ): Effect.Effect<
-  Scope.Scope | Exclude<Exclude<R, RenderTemplate>, RenderContext.RenderContext | CurrentEnvironment | DomServices>,
+  TestRender<E>,
   never,
-  TestRender<E>
+  Scope.Scope | Exclude<Exclude<R, RenderTemplate>, RenderContext.RenderContext | CurrentEnvironment | DomServices>
 > {
   return Effect.gen(function*(_) {
     const window = yield* _(getOrMakeWindow(options))
     const elementRef = yield* _(ElementRef.make())
-    const errors = yield* _(RefSubject.make<never, never, ReadonlyArray<E>>(Effect.succeed([])))
+    const errors = yield* _(RefSubject.make<ReadonlyArray<E>>(Effect.succeed([])))
     const fiber = yield* _(
       fx,
       render,
@@ -155,7 +155,7 @@ export function click<E>(
 
 function getOrMakeWindow(
   options?: HappyDOMOptions
-): Effect.Effect<Scope.Scope, never, Window & GlobalThis> {
+): Effect.Effect<Window & GlobalThis, never, Scope.Scope> {
   if (typeof window !== "undefined" && typeof document !== "undefined") {
     return Effect.gen(function*(_) {
       window.document.head.innerHTML = ""
@@ -187,7 +187,7 @@ export interface TestHydrate<E, Elements> extends TestRender<E> {
  * @since 1.0.0
  */
 export function testHydrate<R, E, Elements>(
-  fx: Fx.Fx<R, E, RenderEvent>,
+  fx: Fx.Fx<RenderEvent, E, R>,
   f: (rendered: Rendered, window: Window & GlobalThis) => Elements,
   options?:
     & HappyDOMOptions
@@ -218,7 +218,7 @@ export function testHydrate<R, E, Elements>(
     const elements = f(rendered.length === 1 ? rendered[0] : rendered, window)
 
     const elementRef = yield* _(ElementRef.make())
-    const errors = yield* _(RefSubject.make<never, never, ReadonlyArray<E>>(Effect.succeed([])))
+    const errors = yield* _(RefSubject.make<ReadonlyArray<E>>(Effect.succeed([])))
     const fiber = yield* _(
       fx,
       hydrate,

package/src/Vitest.ts

@@ -24,7 +24,7 @@ export {
  */
 export function it<E, A>(
   name: string,
-  test: () => Effect.Effect<Scope, E, A>,
+  test: () => Effect.Effect<A, E, Scope>,
   options?: vitest.TestOptions
 ) {
   return vitest.it(
@@ -45,7 +45,7 @@ export function test<E, A>(
   name: string,
   test: (options: {
     readonly clock: TestClock.TestClock
-  }) => Effect.Effect<Scope | TestServices.TestServices, E, A>,
+  }) => Effect.Effect<A, E, Scope | TestServices.TestServices>,
   options?: vitest.TestOptions
 ) {
   return vitest.it(

package/src/internal/EventSource.ts

@@ -7,7 +7,7 @@ import type { EventHandler } from "../EventHandler.js"
 
 type EventName = string
 
-type Handler<Ev extends Event> = EventHandler<never, never, Ev>
+type Handler<Ev extends Event> = EventHandler<Ev>
 
 export interface EventSource {
   readonly addEventListener: <Ev extends Event>(
@@ -16,11 +16,11 @@ export interface EventSource {
     handler: Handler<Ev>
   ) => void
 
-  readonly setup: (rendered: Rendered, scope: Scope.Scope) => Effect.Effect<never, never, void>
+  readonly setup: (rendered: Rendered, scope: Scope.Scope) => Effect.Effect<void>
 }
 
 type Entry = readonly [Element, Handler<any>]
-type Run = <E, A>(effect: Effect.Effect<never, E, A>) => Fiber.RuntimeFiber<E, A>
+type Run = <E, A>(effect: Effect.Effect<A, E>) => Fiber.RuntimeFiber<A, E>
 
 const disposable = (f: () => void): Disposable => ({
   [Symbol.dispose]: f
@@ -130,7 +130,7 @@ export function makeEventSource(): EventSource {
       const disposables: Array<Disposable> = []
       const fibers = new Map<symbol, Fiber.RuntimeFiber<any, any>>()
       const runFork = Runtime.runFork(runtime)
-      const run: Run = <E, A>(effect: Effect.Effect<never, E, A>) => {
+      const run: Run = <E, A>(effect: Effect.Effect<A, E>) => {
         const id = Symbol()
         const fiber = runFork(Effect.onExit(effect, () => Effect.sync(() => fibers.delete(id))))
         fibers.set(id, fiber)

package/src/internal/hydrate.ts

@@ -40,11 +40,7 @@ export const hydrateTemplate: (document: Document, ctx: RenderContext) => Render
   return <Values extends ReadonlyArray<Renderable<any, any>>>(
     templateStrings: TemplateStringsArray,
     values: Values
-  ): Fx.Fx<
-    Scope.Scope | Placeholder.Context<Values[number]>,
-    Placeholder.Error<Values[number]>,
-    RenderEvent
-  > => {
+  ): Fx.Fx<RenderEvent, Placeholder.Error<Values[number]>, Scope.Scope | Placeholder.Context<Values[number]>> => {
     return Fx.make((sink) =>
       Effect.gen(function*(_) {
         const context = yield* _(Effect.context<Scope.Scope>())
@@ -95,13 +91,13 @@ export const hydrateTemplate: (document: Document, ctx: RenderContext) => Render
         }
 
         // Connect our interpolated values to our template parts
-        const effects: Array<Effect.Effect<Scope.Scope | Placeholder.Context<Values[number]>, never, void>> = []
+        const effects: Array<Effect.Effect<void, never, Scope.Scope | Placeholder.Context<Values[number]>>> = []
         for (const [part, path] of template.parts) {
           const eff = renderPart2(part, where, path, ctx)
           if (eff !== null) {
             effects.push(
               ...(Array.isArray(eff) ? eff : [eff]) as Array<
-                Effect.Effect<Scope.Scope | Placeholder.Context<Values[number]>, never, void>
+                Effect.Effect<void, never, Scope.Scope | Placeholder.Context<Values[number]>>
               >
             )
           }

package/src/internal/indexRefCounter.ts

@@ -3,19 +3,15 @@ import * as Effect from "effect/Effect"
 import * as Option from "effect/Option"
 
 export type IndexRefCounter = {
-  release: (index: number) => Effect.Effect<never, never, void>
-  wait: Effect.Effect<never, never, void>
+  release: (index: number) => Effect.Effect<void>
+  wait: Effect.Effect<void>
 }
 
 /**
  * @internal
  */
-export function indexRefCounter(expected: number): Effect.Effect<
-  never,
-  never,
-  IndexRefCounter
-> {
-  return Effect.map(Deferred.make<never, void>(), (deferred) => {
+export function indexRefCounter(expected: number): Effect.Effect<IndexRefCounter> {
+  return Effect.map(Deferred.make<void>(), (deferred) => {
     const done = Deferred.succeed(deferred, undefined)
     const indexes = new Set<number>(Array.from({ length: expected }, (_, i) => i))
 
@@ -37,20 +33,16 @@ export function indexRefCounter(expected: number): Effect.Effect<
 }
 
 export type IndexRefCounter2 = {
-  release: (index: number) => Effect.Effect<never, never, void>
-  expect: (count: number) => Effect.Effect<never, never, boolean>
-  wait: Effect.Effect<never, never, void>
+  release: (index: number) => Effect.Effect<void>
+  expect: (count: number) => Effect.Effect<boolean>
+  wait: Effect.Effect<void>
 }
 
 /**
  * @internal
  */
-export function indexRefCounter2(): Effect.Effect<
-  never,
-  never,
-  IndexRefCounter2
-> {
-  return Effect.map(Deferred.make<never, void>(), (deferred) => {
+export function indexRefCounter2(): Effect.Effect<IndexRefCounter2> {
+  return Effect.map(Deferred.make<void>(), (deferred) => {
     let expected: Option.Option<number> = Option.none<number>()
     const done = Deferred.succeed(deferred, undefined)
     const indexes = new Set<number>()

package/src/internal/module-augmentation.ts

@@ -1,44 +1,44 @@
 import type { Placeholder } from "../Placeholder.js"
 
 declare global {
-  export interface String extends Placeholder<never, never, string> {}
+  export interface String extends Placeholder<string> {}
 
-  export interface Number extends Placeholder<never, never, number> {}
+  export interface Number extends Placeholder<number> {}
 
-  export interface Boolean extends Placeholder<never, never, boolean> {}
+  export interface Boolean extends Placeholder<boolean> {}
 
-  export interface Symbol extends Placeholder<never, never, symbol> {}
+  export interface Symbol extends Placeholder<symbol> {}
 
-  export interface BigInt extends Placeholder<never, never, bigint> {}
+  export interface BigInt extends Placeholder<bigint> {}
 
   export interface Array<T> extends
     Placeholder<
-      Placeholder.Context<T>,
+      Array<Placeholder.Success<T>>,
       Placeholder.Error<T>,
-      Array<Placeholder.Success<T>>
+      Placeholder.Context<T>
     >
   {}
 
   export interface ReadonlyArray<T> extends
     Placeholder<
-      Placeholder.Context<T>,
+      ReadonlyArray<Placeholder.Success<T>>,
       Placeholder.Error<T>,
-      ReadonlyArray<Placeholder.Success<T>>
+      Placeholder.Context<T>
     >
   {}
 
   // DOM types
-  export interface Node extends Placeholder<never, never, Node> {}
+  export interface Node extends Placeholder<Node> {}
 
-  export interface DocumentFragment extends Placeholder<never, never, DocumentFragment> {}
+  export interface DocumentFragment extends Placeholder<DocumentFragment> {}
 
-  export interface Element extends Placeholder<never, never, Element> {}
+  export interface Element extends Placeholder<Element> {}
 
-  export interface HTMLElement extends Placeholder<never, never, HTMLElement> {}
+  export interface HTMLElement extends Placeholder<HTMLElement> {}
 
-  export interface SVGElement extends Placeholder<never, never, SVGElement> {}
+  export interface SVGElement extends Placeholder<SVGElement> {}
 }
 
 declare module "@typed/fx/Fx" {
-  export interface Fx<R, E, A> extends Placeholder<R, E, A> {}
+  export interface Fx<A, E, R> extends Placeholder<A, E, R> {}
 }

package/src/internal/parts.ts

@@ -33,47 +33,46 @@ import { findHoleComment } from "./utils.js"
 
 const strictEq = Equivalence.strict<any>()
 
-const base = <T extends Part["_tag"]>(tag: T) =>
-  class Base {
-    readonly _tag: T = tag
-
-    constructor(
-      readonly index: number,
-      readonly commit: (
-        params: {
-          previous: Extract<Part, { readonly _tag: T }>["value"]
-          value: Extract<Part, { readonly _tag: T }>["value"]
-          part: Extract<Part, { readonly _tag: T }>
-        }
-      ) => Effect.Effect<Scope, never, void>,
-      public value: Extract<Part, { readonly _tag: T }>["value"],
-      readonly eq: Equivalence.Equivalence<Extract<Part, { readonly _tag: T }>["value"]> = equals
-    ) {
-      this.update = this.update.bind(this)
-    }
-
-    update(input: this["value"]) {
-      const previous = this.value as any
-      const value = this.getValue(input) as any
+const base = <T extends Part["_tag"]>(tag: T) => (class Base {
+  readonly _tag: T = tag
 
-      if (this.eq(previous as any, value as any)) {
-        return Effect.unit
+  constructor(
+    readonly index: number,
+    readonly commit: (
+      params: {
+        previous: Extract<Part, { readonly _tag: T }>["value"]
+        value: Extract<Part, { readonly _tag: T }>["value"]
+        part: Extract<Part, { readonly _tag: T }>
       }
+    ) => Effect.Effect<void, never, Scope>,
+    public value: Extract<Part, { readonly _tag: T }>["value"],
+    readonly eq: Equivalence.Equivalence<Extract<Part, { readonly _tag: T }>["value"]> = equals
+  ) {
+    this.update = this.update.bind(this)
+  }
 
-      return Effect.flatMap(
-        this.commit.call(this, {
-          previous,
-          value,
-          part: this as any
-        }),
-        () => Effect.sync(() => this.value = value)
-      )
-    }
+  update(input: this["value"]) {
+    const previous = this.value as any
+    const value = this.getValue(input) as any
 
-    getValue(value: unknown) {
-      return value
+    if (this.eq(previous as any, value as any)) {
+      return Effect.unit
     }
+
+    return Effect.flatMap(
+      this.commit.call(this, {
+        previous,
+        value,
+        part: this as any
+      }),
+      () => Effect.sync(() => this.value = value)
+    )
+  }
+
+  getValue(value: unknown) {
+    return value
   }
+})
 
 export class AttributePartImpl extends base("attribute") implements AttributePart {
   constructor(
@@ -295,8 +294,8 @@ export class EventPartImpl implements EventPart {
     readonly name: string,
     readonly index: number,
     readonly source: ElementSource<any>,
-    readonly onCause: <E>(cause: Cause<E>) => Effect.Effect<never, never, unknown>,
-    readonly addEventListener: <Ev extends Event>(handler: EventHandler<never, never, Ev>) => void
+    readonly onCause: <E>(cause: Cause<E>) => Effect.Effect<unknown>,
+    readonly addEventListener: <Ev extends Event>(handler: EventHandler<Ev>) => void
   ) {
   }
 }
@@ -489,35 +488,34 @@ function fromKeyValue(name: string, value: unknown): Array<NameValue> {
   }
 }
 
-const sparse = <T extends SparsePart["_tag"]>(tag: T) =>
-  class Base {
-    readonly _tag: T = tag
-
-    constructor(
-      readonly commit: (
-        params: {
-          previous: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>
-          value: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>
-          part: Extract<SparsePart, { readonly _tag: T }>
-        }
-      ) => Effect.Effect<Scope, never, void>,
-      public value: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>,
-      readonly eq: Equivalence.Equivalence<SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>> =
-        equals
-    ) {}
-
-    update = (value: this["value"]) => {
-      if (this.eq(this.value as any, value as any)) {
-        return Effect.unit
-      }
+const sparse = <T extends SparsePart["_tag"]>(tag: T) => (class Base {
+  readonly _tag: T = tag
 
-      return this.commit({
-        previous: this.value,
-        value: this.value = value as any,
-        part: this
-      } as any)
+  constructor(
+    readonly commit: (
+      params: {
+        previous: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>
+        value: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>
+        part: Extract<SparsePart, { readonly _tag: T }>
+      }
+    ) => Effect.Effect<void, never, Scope>,
+    public value: SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>,
+    readonly eq: Equivalence.Equivalence<SparseAttributeValues<Extract<SparsePart, { readonly _tag: T }>["parts"]>> =
+      equals
+  ) {}
+
+  update = (value: this["value"]) => {
+    if (this.eq(this.value as any, value as any)) {
+      return Effect.unit
     }
+
+    return this.commit({
+      previous: this.value,
+      value: this.value = value as any,
+      part: this
+    } as any)
   }
+})
 
 type SparseAttributeValues<T extends ReadonlyArray<AttributePart | ClassNamePart | CommentPart | StaticText>> =
   ReadonlyArray<