# EventHandler.EventHandler

Represents a DOM event handler that returns an Effect.

It encapsulates the event handler logic and any options (like `preventDefault`, `once`, etc.)
that should be applied when the event is triggered.

## Signatures

```ts
export interface EventHandler<Ev extends Event = Event, E = never, R = never> extends Pipeable {
    readonly [EventHandlerTypeId]: EventHandlerTypeId;
    readonly handler: (event: Ev) => Effect.Effect<unknown, E, R>;
    readonly options: (AddEventListenerOptions & EventOptions) | undefined;
}
```

## Why

`EventHandler` connects browser event behavior to an Effect program. When
installed through `EventSource`, the callback receives a `Proxy` over the
native event: properties and bound methods forward to the browser event while
`currentTarget` is overridden with the delegated target. The wrapper is not
pooled, but it is not object-identical to the native event.

## Ownership and lifetime

`make` only describes the handler. A rendered template installs the listener
within its Effect Scope and removes it when that rendered part is finalized.
Any Effect returned by the callback keeps its error and required-service
channels in the `EventHandler<Ev, E, R>` type.

## Event options

Native `AddEventListenerOptions` are passed through. Typed's convenience
flags call the forwarded native methods before the handler; they do not
introduce a separate propagation or default-action system.

## Property: [[computed:[EventHandlerTypeId]]]

Nominal evidence used by `isEventHandler`.

## Property: [[computed:[EventHandlerTypeId]]]: Why

The key prevents arbitrary callback-shaped objects from becoming handlers.

## Property: [[computed:[EventHandlerTypeId]]]: Ownership and lifetime

This field is immutable metadata for the handler description.

## Property: handler

The Effect program invoked with the supplied event or delegated event proxy.

## Property: handler: Why

The callback preserves typed failures and services while retaining browser
event behavior through the delegated proxy.

## Property: handler: Ownership and lifetime

The mounted EventSource runs each Effect in a fiber owned by its Scope.

## Property: options

Native listener options plus Typed's pre-handler event controls.

## Property: options: Why

Browser capture, passive, signal, propagation, and default behavior stay explicit.

## Property: options: Ownership and lifetime

EventSource reads this immutable record when attaching the listener.

## Examples

```ts
import { Effect } from "effect"
import * as EventHandler from "@typed/template/EventHandler"
import { html } from "@typed/template"

// Simple event handler
const handleClick = EventHandler.make((event: MouseEvent) => {
  console.log("Clicked!", event)
})

// Event handler with Effect
const handleSubmit = EventHandler.make((event: SubmitEvent) =>
  Effect.gen(function* () {
    event.preventDefault()
    yield* Effect.sync(() => console.log("Form submitted"))
  })
)

// Use in template
const template = html`<button onclick=${handleClick}>Click me</button>`
```