Function: useId()

@arolariu/components

---

@arolariu/components / useId

Function: useId()

useId(prefix?): string

Defined in: hooks/useId.tsx:33

Generates a unique, stable identifier that is safe for server-side rendering.

Parameters

prefix?

string

Optional string to prepend to the generated ID.

Returns

string

A unique identifier string.

Remarks

This hook wraps React's useId and optionally prepends a custom prefix. The generated ID remains stable across re-renders and matches between server and client, making it ideal for associating form labels with inputs or managing accessible ARIA relationships.

Example

function FormField({label}) {
  const id = useId("field");

  return (
    <div>
      <label htmlFor={id}>{label}</label>
      <input id={id} type="text" />
    </div>
  );
}

See

React useId