Component

Modal

A full-screen sheet that rises to cover the entire viewport, with a nav bar carrying a centered title and a Done button to dismiss.

Standalone

modal.tsx

<NativeModal open={open} onClose={() => setOpen(false)} title="Settings">
  <div className={nativeMobileSheetProseClassName}>...</div>
</NativeModal>

Example

Editing account details opens this full-screen, listing every editable field with a Done button as the only way out.

modal-example.tsx

<NativeModal open={open} onClose={() => setOpen(false)} title="Account details">
  <NativeRow label="Legal name" sublabel={account.legalName} />
  <NativeRow label="Account number" sublabel={account.number} />
</NativeModal>

Capabilities

Prop	Type	Description
openrequired	boolean	-
onCloserequired	() => void	-
title	string	-
showDone	boolean	Show the "Done" / close button in top-right
doneLabel	string	-
childrenrequired	React.ReactNode	-
className	string	-