@astro-dx/events

"code-keyword">import { on } "code-keyword">from '@astro-dx/events';


"code-function">on('#btn', 'click', () => count."code-function">update(v => v + 1));


"code-function">on('#search', 'input', (value) => query."code-function">set(value "code-keyword">as "code-type">string));


"code-function">on(document, 'click', (e) => console."code-function">log(e));

"code-keyword">import { onHover } "code-keyword">from '@astro-dx/events';

"code-function">onHover('#card', {
  enter: () => hovered."code-function">set("code-type">true),
  leave: () => hovered."code-function">set("code-type">false),
});

"code-keyword">import { onKey } "code-keyword">from '@astro-dx/events';

"code-function">onKey('#search', 'Enter', () => "code-function">performSearch());
"code-function">onKey(document, 'Escape', () => modal."code-function">set("code-type">false));

"code-keyword">import { onFocus } "code-keyword">from '@astro-dx/events';

"code-function">onFocus('#input', {
  focus: () => isFocused."code-function">set("code-type">true),
  blur: () => isFocused."code-function">set("code-type">false),
});