React Hooks with TypeScript/Typed tuple return

Return readonly tuples for hooks that act like useState.

Section: TypeScript Custom Hooks

Typed tuple return

tsx
tsx
function useBoolean(initial = false): readonly [boolean, () => void] {
  const [value, setValue] = useState(initial);
  const toggle = () => setValue(v => !v);
  return [value, toggle] as const;
}
Explanation

`as const` preserves tuple semantics for callers.

Learn the surrounding workflow

Compare similar commands or jump into common fixes when this command is part of a bigger troubleshooting path.

Related commands

Same sheet · prioritizing TypeScript Custom Hooks
Generic async hook result type
Type reusable async hook data generically.
OpenIn sheettsxsame section
Generic useState type
Annotate nullable or union state explicitly.
OpenIn sheettsx3 tag match
Type a DOM ref
Specify the element type for refs.
OpenIn sheettsx3 tag match
Discriminated union reducer actions
Type reducer actions cleanly with a union.
OpenIn sheettsx3 tag match