Typed Results
The present() methods are generic.
Surface.Dialog.present<T>(...)
Surface.Sheet.present<T>(...)The generic type becomes the resolved Promise value.
Boolean confirmation
const confirmed = await Surface.Dialog.present<boolean>({
body: ({ pop }) => (
<>
<button onClick={() => pop(false)}>Cancel</button>
<button onClick={() => pop(true)}>Confirm</button>
</>
),
});Now confirmed is:
boolean | null | undefinedUnion results
type Action = 'edit' | 'delete' | 'cancel';
const action = await Surface.Dialog.present<Action>({
body: ({ pop }) => (
<>
<button onClick={() => pop('edit')}>Edit</button>
<button onClick={() => pop('delete')}>Delete</button>
<button onClick={() => pop('cancel')}>Cancel</button>
</>
),
});Object results
type Selection = {
id: string;
label: string;
};
const selection = await Surface.Sheet.present<Selection>({
body: SelectionSheet,
});Inside the component:
function SelectionSheet({ pop }: SurfaceContext<Selection>) {
return (
<button
onClick={() =>
pop({
id: '1',
label: 'First option',
})
}
>
Select
</button>
);
}Using explicit result types is recommended for public application workflows because it makes the caller's control flow easier to understand.