v2.16.1

Patch Changes

• 7560f99: Fix: useProperty initialization sets default value even when preventDefault is called

  When a parent component uses lift() to listen to a property change event without
  passing the property value to the child, useProperty's initialization event was
  preventDefault'd by lift, leaving the host property undefined. This caused crashes
  in components like cosmoz-omnitable where selectedItems was never initialized.

  The updater method now accepts an isInit flag that bypasses the preventDefault veto
  during initialization, ensuring the host always receives its default value. Subsequent
  updates retain the full lift/preventDefault two-way binding semantics.

v2.16.0

Minor Changes

• 6018594: Allow lift to bubble functional state updaters to parent components

  useProperty now resolves the updater function against host[property] before dispatching the event, so ev.detail.value always contains the resolved value. The original updater function is also included in ev.detail.updater for lift to pass to the parent setter, which resolves it against the parent's authoritative state.

  This fixes rapid-fire functional updater calls (e.g., setItems((items) => [...items, item])) producing incorrect state when used with lift, because the child's local state was blocked by preventDefault() and hadn't yet been updated by the parent re-render.

  Breaking changes

  • useProperty.updateProp removed (was internal, not part of public API)
  • useProperty.init removed (was internal, not part of public API)
  • Event detail shape now includes updater field alongside value
  • ev.detail.value is always the resolved value (was undefined for functional updaters)
  • lift now passes ev.detail.updater ?? ev.detail.value to setter (was ev.detail.value)
  • useProperty setter now always dispatches a change event, even if the value is unchanged

v2.15.0

Minor Changes

• f0dab4f: Detect and stop infinite update loops.

v2.14.0

Minor Changes

• ad72947: Make Ref<T> align better with lit-html compatibility

  Changed Ref<T> from { current: T; value: T; } to { current: T | undefined; value?: T; }.

  This makes Ref<T> structurally compatible with lit-html's Ref<T> type, allowing pion refs to be used directly with lit-html's ref directive without type errors:

  // Before: Type error
  const popover = useRef<HTMLElement>();
  html`<div ${ref(popover)}></div>`; // Error: Ref<HTMLElement | undefined> ≠ Ref<HTMLElement>
  
  // After: Works correctly
  const popover = useRef<HTMLElement>();
  html`<div ${ref(popover)}></div>`; // OK

  For users, behavior is identical: ref.current and ref.value still return T | undefined when no initial value is provided. Type narrowing works the same way: if (ref.current) { ref.current.showPopover(); }.

  BREAKING CHANGE: If you explicitly typed refs as Ref<T | undefined>, update to Ref<T>:

  // Before
  const ref: Ref<HTMLElement | undefined> = useRef();
  
  // After
  const ref: Ref<HTMLElement> = useRef();

v2.13.0

Minor Changes

• c6bfd24: Add createRef function and make useRef compatible with lit-html's ref directive

  • useRef now returns a Ref<T> object with both current and value properties, making it compatible with both React-style (ref.current) and lit-html-style (ref.value) access patterns
  • New createRef function creates a ref object without memoization, usable outside of component/hook context
  • Ref<T> type now includes both current: T and value: T properties that stay in sync
  • Backward compatible: existing ref.current usage continues to work unchanged

v2.12.0

Minor Changes

• 9b813bf: fix: prevent orphan elements from rendering

  Elements that are constructed but never connected to the DOM (orphan elements) will no longer render or run effects. This fixes issues where lit-html creates elements during template parsing that are never inserted into the DOM.

  The scheduler now starts with _active = false and only activates when:

  • connectedCallback is called (for custom elements)
  • resume() is called explicitly (for virtual components)

  Fixes #64

v2.11.0

Minor Changes

• da4c723: Add useHost hook for accessing the host element

  The useHost hook provides direct access to the host element of a pion component. This is useful when you need to interact with the host element's properties, attributes, or methods from within your component function.

  Note: Direct DOM manipulation should generally be avoided in favor of reactive patterns. Use useHost only when direct host element access is unavoidable.

Patch Changes

• f176b34: docs: add useProperty hook documentation

v2.10.0

Minor Changes

• dea34f9: Readonly deps arrays

v2.9.0

Minor Changes

• 2086e16: Define a Renderable type, so developers can annotate content that will be passed to lit-html templates or rendering functions

v2.8.3

Patch Changes

• 1f3e6c2: Pause rendering while disconnected