create-event-hook

Create a small, strongly typed event emitter.


Package	`@vizejs/composable/create-event-hook`
Own the source	`vize lib pull composable:create-event-hook`
Runtime exports	`createEventHook`
Gzip budget	1792 B

Usage

import { createEventHook } from "@vizejs/composable/create-event-hook";

Runtime contract

Utility	Category	Stability	SSR	Hydration	Cleanup	Targets	Host globals	Uses
`createEventHook`	events	experimental	safe	not-applicable	returned-value, reactive-scope	web, server, worker, native, desktop, terminal	`console`, `process`, `window`	`tryOnScopeDispose`

API

`createEventHook`

Create a small, strongly typed event emitter. The payload is a tuple type, so events can carry several named arguments (createEventHook<[id: string, value: number]>()) and trigger checks them. Listeners registered inside an effect scope unsubscribe themselves when it stops. Synchronous listener errors propagate from trigger; async rejections reject the returned promise. SSR: Vue does not dispose component scopes after a server render, so a listener that a server setup adds to a module-level hook would never be removed and would pile up once per request. By default such registrations are therefore skipped (with a one-time development warning); see CreateEventHookOptions.serverListeners. Hooks created inside a component, and every registration in the browser, behave normally.

function createEventHook<Arguments extends readonly unknown[] = []>( options: CreateEventHookOptions = {}, ): EventHook<Arguments>

const saved = createEventHook<[id: string]>();
saved.on((id) => toast(`Saved ${id}`));
await saved.trigger("doc-1");

Types

`EventHookSubscription`

Registration handle returned by EventHook.on.

Member	Type	Description
`off`	`() => void`	Remove the listener. Idempotent.

`CreateEventHookOptions`

Options for createEventHook.

Member	Type	Description
`serverListeners`?	`"ignore" \| "register"`	What `on()` does when a hook created outside any component (a module-level hook shared by every request) is subscribed to from a component `setup` during server rendering. Vue never disposes server component scopes, so such listeners would accumulate across requests and keep every rendered component alive. - `"ignore"`: skip the registration (the returned `off` is a no-op) and warn once in development. - `"register"`: register anyway; the caller must call `off()`. Hooks created inside a component (request-local hooks) are unaffected.

`EventHook`

Typed event emitter created by createEventHook.

Member	Type	Description
`on`	`(listener: EventHookListener<Arguments>) => EventHookSubscription`	Add a listener. Inside an effect scope it is removed automatically when the scope stops. Adding the same function twice registers it once.
`off`	`(listener: EventHookListener<Arguments>) => void`	Remove a listener.
`trigger`	`(...args: Arguments) => Promise<unknown[]>`	Call every listener with `args`, in registration order.
`clear`	`() => void`	Remove every listener.
`size`	`() => number`	Number of registered listeners.