useId

React hook that generates a unique ID using the uuid package.

useId is primarily used when creating relationships between elements, e.g.:

Linking form elements to their labels using the for attribute
Linking a form to its submit button when the submit button lives outside of the <form> element
- This is common when working with Actions within Dialog, Drawer or Popover
Linking descriptive text to a UI element to improve accessibility
- aria-describedby and aria-labelledby are used to help screen readers understand the UI

import { useId } from '@gusto/workbench';

const id = useId();
// id === '167fceaf-52a9-42cd-b1a9-9b00ebfd8e47';