Нативный вид

const ctx = await app.init()

if (app.isSupported('composer')) {
  app.composer.set({ visible: true, mic: 'dictation', placeholder: 'Спросите…' })
}

import { exodeBootScript } from '@exode-team/sdk/miniapp'

<html suppressHydrationWarning>
  <head>
    <script dangerouslySetInnerHTML={{ __html: exodeBootScript() }}/>
  </head>
</html>

useExodeHeader({
  title: 'AI-тренажёр',
  right: [
    { id: 'settings', icon: 'settings', label: 'Настройки' },
    { id: 'share', icon: 'share', label: 'Поделиться' },
  ],
  onButton: (id) => (id === 'settings' ? openSettings() : share()),
})

// Без React
app.header.set({ title: 'Каталог', right: [ { id: 'search', icon: 'search', label: 'Поиск' } ] })
app.on('header:button', ({ id }) => {})

// «Назад» ведёт по экранам приложения, пока передан обработчик; null — «Назад» уходит из приложения
useExodeBackButton(screen !== 'home' ? () => setScreen('home') : null)

// Без React
app.backButton.show()
app.on('backButton:pressed', () => goBack())
app.backButton.hide()

useExodeMainButton({ text: 'Продолжить', loading, disabled, onClick: next })

// Без React
app.mainButton.set({ visible: true, text: 'Готово' })
app.on('mainButton:pressed', () => {})
app.mainButton.hide()

const composer = useExodeComposer({
  placeholder: 'Ваш ответ…',
  mic: 'voice',          // 'voice' — голосовое сообщение файлом; 'dictation' — речь в текст поля; 'none'
  attachments: true,     // или { media: true, file: false }
  busy,                  // приложение отвечает: «стоп» вместо отправки (onStop), поле подсвечено
  onSubmit: ({ text, files }) => send(text, files),
  onVoice: ({ file, duration }) => transcribe(file),
  onStop: () => cancel(),
})

if (!composer.isSupported) {
  return <MyOwnInput/>
}

const [ heard, setHeard ] = useState('')

const composer = useExodeComposer({
  voiceOnly: true,
  mic: 'dictation',                // речь текстом; 'voice' — записью в onVoice
  recordAudio: true,               // и запись сказанного вместе с текстом (SDK 0.6+)
  placeholder: 'Ответьте клиенту',
  busy,
  onChange: setHeard,              // что услышано, пока говорят
  onSubmit: ({ text, voice }) => reply(text, voice?.file),
  onStop: () => cancel(),
  liveTranscript: true,            // хост сам показывает услышанное над кнопками (SDK 0.7+)
  review: true,                    // «Готово» кладёт текст в поле хоста на правку (SDK 0.7+)
  noCancel: true,                  // начатую речь не сбросить: каждая попытка уходит (SDK 0.8+)
})

const popup = useExodePopup() // без React — app.popup

await popup.alert('Сохранено')
const ok = await popup.confirm('Удалить черновик?', { destructive: true, okText: 'Удалить' })
const name = await popup.prompt({ title: 'Как вас зовут?', placeholder: 'Имя', required: true }) // null — отмена
const id = await popup.show({
  title: 'Выберите',
  message: 'Что сделать с файлом?',
  buttons: [
    { id: 'open', text: 'Открыть' },
    { id: 'delete', type: 'destructive', text: 'Удалить' },
    { type: 'cancel' },
  ],
}) // id нажатой кнопки или null

const { insets, isFullscreen, requestFullscreen, exitFullscreen, lockOrientation, unlockOrientation } = useExodeViewport()

await requestFullscreen()          // true — получилось
await lockOrientation('landscape') // экран повернётся и останется так, пока приложение открыто
await unlockOrientation()          // экран снова следует за устройством

const haptic = useExodeHaptic() // без React — app.haptic

haptic.impact('light')          // light | medium | heavy | rigid | soft (по умолчанию medium)
haptic.notification('success')  // success | warning | error
haptic.selection()

const { openLink, share, copyText } = useExodeUI()

openLink('https://example.com')                    // в приложении — браузер внутри приложения
openLink('https://example.com', { external: true }) // системный браузер
const shared = await share({ url, text, title })   // true — поделились
const copied = await copyText('Промокод: EXODE')   // true — скопировано

const s = document.createElement('script')
s.src = 'https://static.exode.biz/sdk/latest/miniapp-devtools.global.js'
document.head.append(s)

// скрипт ставит себя сам:
exodeDevtools.skeleton()                          // строка первого экрана — в консоль и в буфер обмена
exodeDevtools.show()                              // силуэт поверх страницы, чтобы сравнить с содержимым
exodeDevtools.show('p12,16 g16; c48 208x28; 226') // предпросмотр своей строки
exodeDevtools.hide()

if (process.env.NODE_ENV !== 'production') {
  import('@exode-team/sdk/miniapp/devtools').then((devtools) => devtools.installDevtools())
}