`useId`

Returns a stable, SSR-safe unique id with an optional human-readable prefix. Wraps React’s useId and strips characters that aren’t valid in CSS selectors. Pass a staticId as the second argument to honor an id provided by the parent instead of generating one.


import { useId } from '@wire-ui/react'
 
function Field({ id, label, ...props }: { id?: string; label: string }) {
  const inputId = useId('field', id)
  const labelId = useId('field-label')
 
  return (
    <>
      <label id={labelId} htmlFor={inputId}>{label}</label>
      <input id={inputId} aria-labelledby={labelId} {...props} />
    </>
  )
}

Parameters

Param	Type	Description
`prefix`	`string`	Human-readable prefix prepended to the generated id. Defaults to `'wire'`.
`staticId`	`string`	If provided, returned as-is — the generated id is discarded.

Returns

A string id that is stable across renders and unique across the page.