use

Applies a directive: calls fn(el, arg) untracked, so a directive or a ref never subscribes the surrounding effect to what it reads.

Applies a directive: calls fn(el, arg) untracked, so a directive or a ref never subscribes the surrounding effect to what it reads. A function returned by fn is a cleanup, run when the owner disposes.

Import#

import { use } from "@shadow-js/web";

Signature#

function use<T>(
  fn: (el: Element, arg: () => T) => unknown,
  el: Element,
  arg?: () => T,
): void

Parameters#

Name	Description
`fn`	The directive. Receives the element and the accessor of its argument.
`el`	The element the directive applies to.
`arg`	Accessor for the directive's argument. Undefined passes `undefined` through; the directive reads the accessor where it wants to track it.

Examples#

import { use } from "@shadow-js/web";

function tooltip(el: Element, text: () => string) {
  el.setAttribute("title", text());
}
const button = document.createElement("button");
use(tooltip, button, () => "Save the draft");