Skip to content

v1.0.9

Choose a tag to compare

@debabin debabin released this 10 Jul 13:39
· 65 commits to main since this release

Add new hooks

This release introduces useForm, an orchestrator for managing multiple fields with schema validation support, and useNotification, a reactive wrapper around the browser Notifications API. It also fixes DOM initialization bugs in useField affecting selects, textareas, and checkboxes, and repairs usePermission, whose change listener was attached to a target the event never reaches.

Features

  • useForm — added a hook to manage a whole form, keeping values in the DOM and exposing register, handleSubmit, trigger, watch, reset, and per-field dirty, touched, errors, and submitting state, with an optional resolver for schema validation through zod, yup, or valibot.
  • useField — moved validation rules into the hook options so required, min, max, minLength, maxLength, pattern, and validate can be declared once at the call site, with register params overriding them per element.
  • usePermission — added an onChange callback, available as a second argument or through the options object, so consumers can react to permission changes without watching state.
  • useNotification — added a hook that wraps the browser Notifications API, exposing supported, notification, trigger, show, and close.
  • useNotification — the current notification is closed once the tab becomes visible again, since the user has already seen whatever it announced.

Fixes

  • useField — the register ref no longer reinitializes an element it has already seen, so a value chosen by the user survives rerenders instead of being reset to the initial value every time the callback ref is reattached.
  • useField — selects and textareas are now initialized through value instead of defaultValue, which selects have no DOM property for and which React overwrites on textareas during reconciliation.
  • useField — the dirty state and validation rules now read checked for checkboxes and radios instead of value, which always returned the string on and made checkboxes permanently dirty while leaving required unenforced.
  • usePermission — the change listener is now attached to the PermissionStatus returned by navigator.permissions.query() rather than to window, which the event never reaches, so external permission changes are finally reflected in state.
  • usePermission — the listener is removed on unmount and whenever the permission name changes, instead of leaking for the lifetime of the page.
  • usePermissionquery no longer throws when navigator.permissions is unavailable, returning prompt instead.