# expo-ui-jetpack-compose

Скилл подсказывает агенту, как писать нативные Android-интерфейсы через @expo/ui/jetpack-compose в приложении Expo.

- скилл · `type=skill` · Codex, ChatGPT · 1 установка · ★ 7596
- Автор: Expo Team · официальный репозиторий OpenAI
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/openai/plugins/tree/HEAD/plugins/expo/skills/expo-ui-jetpack-compose/SKILL.md
- Обновлён: 2026-10-08
- HTML: https://affpapa.org/nevibecode/skills/expo-ui-jetpack-compose

## Что делает

Скилл описывает работу с пакетом `@expo/ui/jetpack-compose`: компоненты берутся из `@expo/ui/jetpack-compose`, модификаторы — из `@expo/ui/jetpack-compose/modifiers`. API повторяет Jetpack Compose, поэтому агент опирается на знание Compose и Material Design 3, когда выбирает компонент или модификатор. Любое дерево оборачивается в `Host`: `<Host matchContents>` даёт размер по содержимому, `<Host style={{ flex: 1 }}>` нужен, когда размер задаётся явно, например для родителя `LazyColumn`.

Инструкции действуют только для SDK 55. Для других версий скилл отправляет к документации Expo UI по нужной версии. Перед использованием компонента агент читает `.d.ts`-файлы пакета, чтобы уточнить API: путь ищется командой `node -e "console.log(path.dirname(require.resolve('@expo/ui/jetpack-compose')))"`, дальше открывается `{ComponentName}/index.d.ts`. Документацию компонента или модификатора скилл тоже советует подтянуть перед реализацией.

Ставится пакет командой `npx expo install @expo/ui`, после чего нужна нативная пересборка через `npx expo run:android`. Для списков вместо `ScrollView` и `FlatList` из react-native берётся `LazyColumn`, иконки — `<Icon source={require('./icon.xml')} size={24} />` с Android XML vector drawable; файлы кладутся в `assets/`, Metro собирает `.xml` без правок конфига. Если проект живёт на другой версии SDK, инструкции не подойдут — это повод свериться с документацией своей версии.

## Установка

### Codex (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add openai/plugins --skill expo-ui-jetpack-compose -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/expo-ui-jetpack-compose/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Claude Code

1. **Через Skills CLI (Vercel)**
```bash
npx skills add openai/plugins --skill expo-ui-jetpack-compose -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/expo-ui-jetpack-compose/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/expo-ui-jetpack-compose/

### Cursor

**Вручную: положить файлы**
- Файл: `.cursor/skills/expo-ui-jetpack-compose/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install openai/plugins expo-ui-jetpack-compose
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/expo-ui-jetpack-compose/SKILL.md`

### Gemini CLI

**Командой платформы**
```bash
gemini skills install https://github.com/openai/plugins --path plugins/expo/skills/expo-ui-jetpack-compose
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/expo-ui-jetpack-compose/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/openai/plugins/tree/HEAD/plugins/expo/skills/expo-ui-jetpack-compose/SKILL.md

## Когда брать
- собрать экран на компонентах Jetpack Compose внутри Expo-приложения
- выбрать между `LazyColumn` и `FlatList` для прокручиваемого списка
- подключить Android XML vector drawable как иконку
- уточнить точную сигнатуру компонента или модификатора по `.d.ts`
- задать размер дерева Compose через `Host`

## Примеры запросов агенту
- Собери экран настроек на компонентах из `@expo/ui/jetpack-compose` с `Host matchContents`
- Замени `FlatList` на `LazyColumn` и оберни его в `<Host style={{ flex: 1 }}>`
- Добавь иконку из `assets/icons/wifi.xml` через компонент `Icon`

## Похожие
- [expo-native-ui](https://affpapa.org/nevibecode/skills/expo-native-ui.md) — скилл · 31700 установок
- [migrate-xml-views-to-jetpack-compose](https://affpapa.org/nevibecode/skills/migrate-xml-views-to-jetpack-compose.md) — скилл · 2400 установок
- [android-jetpack-compose](https://affpapa.org/nevibecode/skills/android-jetpack-compose.md) — скилл · 2200 установок
- [android-jetpack-compose-cursorrules-prompt-file](https://affpapa.org/nevibecode/rules/android-jetpack-compose-cursorrules-prompt-file.md) — правило · ★ 41011
- [expo-ui](https://affpapa.org/nevibecode/skills/expo-ui.md) — скилл · 31800 установок
- [limrun-expo-development](https://affpapa.org/nevibecode/skills/limrun-expo-development.md) — скилл · 43100 установок

Из того же набора: [openai/plugins](https://affpapa.org/nevibecode/by/openai/plugins.md) — 304 карточки

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md