OUIDer Native UI

Typed wrappers for OUIRuntime native host UI.

import '@ouidesigner/ouider-native-ui'

await OUID.ui.toast('Saved')

const loading = await OUID.ui.loading.show('Loading...')
await loading.update('Almost done...')
await loading.hide()

await OUID.ui.alert({
  title: 'Done',
  message: 'Your changes were saved',
})

const confirmed = await OUID.ui.confirm({
  title: 'Delete item?',
  message: 'This cannot be undone',
  confirmText: 'Delete',
  destructive: true,
})

const name = await OUID.ui.prompt({
  title: 'Rename',
  placeholder: 'New name',
})

const choice = await OUID.ui.sheet({
  title: 'Share',
  width: 'compact',
  actions: [
    { id: 'copy', title: 'Copy link' },
    { id: 'delete', title: 'Delete', style: 'destructive' },
  ],
})

Sheets are compact by default on Android to stay visually close to iOS action sheets. Use fullWidth: true or width: 'full' when a mini app needs an edge-to-edge Android bottom sheet. maxWidthDp and horizontalMarginDp can tune compact Android sheets; iOS keeps the system action sheet sizing.

The host runtime must provide the core _ouid_ui implementation. Android uses native Toast, dialogs, and Material bottom sheets. iOS uses native alerts/action sheets and a lightweight native toast overlay.