expo-ui-swift-ui — скилл для Codex: SwiftUI в React Native
Скилл учит агента работать с пакетом @expo/ui/swift-ui, который позволяет использовать SwiftUI-компоненты и модификаторы в React Native приложениях на Expo SDK 55.
npx skills add openai/plugins --skill expo-ui-swift-ui -a codexЧто делает expo-ui-swift-ui
Скилл подключает знания о @expo/ui/swift-ui — пакете, который переносит API SwiftUI в React Native. Агент импортирует компоненты из @expo/ui/swift-ui, модификаторы из @expo/ui/swift-ui/modifiers и оборачивает каждое SwiftUI-дерево в Host. Для встраивания обычных RN-компонентов внутрь SwiftUI используется RNHostView.
Перед использованием компонента или модификатора агент обращается к документации Expo UI SDK 55, чтобы уточнить API. Если нужного View или модификатора нет в пакете, скилл предлагает расширить его через локальный Expo-модуль — но только после подтверждения пользователя. После установки @expo/ui требуется пересборка нативной части командой npx expo run:ios.
Какие задачи решает
- использовать SwiftUI-компоненты в React Native приложении
- встроить RN-элемент в SwiftUI-дерево через RNHostView
- применить SwiftUI-модификаторы к React-компонентам
- расширить Expo UI недостающим View через локальный модуль
Примеры запросов агенту
- Добавь
VStackс тремяTextи модификатором.padding(16) - Оберни
<Pressable />вRNHostViewвнутриHost - Проверь API компонента
ScrollViewв документации Expo UI SDK 55
Как установить expo-ui-swift-ui
1Через Skills CLI (Vercel)
npx skills add openai/plugins --skill expo-ui-swift-ui -a codex2Вручную: положить файлы
.agents/skills/expo-ui-swift-ui/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add openai/plugins --skill expo-ui-swift-ui -a claude-code2Вручную: положить файлы
~/.claude/skills/expo-ui-swift-ui/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/expo-ui-swift-ui/
Вручную: положить файлы
.cursor/skills/expo-ui-swift-ui/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install openai/plugins expo-ui-swift-ui2Вручную: положить файлы
.github/skills/expo-ui-swift-ui/SKILL.mdКомандой платформы
gemini skills install https://github.com/openai/plugins --path plugins/expo/skills/expo-ui-swift-uiВручную: положить файлы
.devin/skills/expo-ui-swift-ui/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Claude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Скиллы Codex: как установить, где лежат и как вызвать
Вопросы о expo-ui-swift-ui
Как установить expo-ui-swift-ui в Codex?
Выполни npx skills add openai/plugins --skill expo-ui-swift-ui или npx skills add openai/plugins --skill expo-ui-swift-ui -a codex. Скилл будет доступен в .agents/skills/expo-ui-swift-ui/SKILL.md.
Что делает expo-ui-swift-ui?
Скилл учит агента работать с пакетом @expo/ui/swift-ui, который позволяет использовать SwiftUI Views и модификаторы в React Native приложениях на Expo SDK 55. Агент импортирует компоненты, оборачивает их в Host и обращается к документации перед использованием.
Нужна ли пересборка нативной части после установки @expo/ui?
Да, после установки пакета @expo/ui требуется пересборка командой npx expo run:ios.
Исходный текст
SKILL.md · MIT
---
name: expo-ui-swift-ui
description: "`@expo/ui/swift-ui` package lets you use SwiftUI Views and modifiers in your app."
---
> The instructions in this skill apply to SDK 55 only. For other SDK versions, refer to the Expo UI SwiftUI docs for that version for the most accurate information.
## Installation
```bash
npx expo install @expo/ui
```
A native rebuild is required after installation (`npx expo run:ios`).
## Instructions
- Expo UI's API mirrors SwiftUI's API. Use SwiftUI knowledge to decide which components or modifiers to use.
- Components are imported from `@expo/ui/swift-ui`, modifiers from `@expo/ui/swift-ui/modifiers`.
- When about to use a component, fetch its docs to confirm the API - https://docs.expo.dev/versions/v55.0.0/sdk/ui/swift-ui/{component-name}/index.md
- When unsure about a modifier's API, refer to the docs - https://docs.expo.dev/versions/v55.0.0/sdk/ui/swift-ui/modifiers/index.md
- Every SwiftUI tree must be wrapped in `Host`.
- `RNHostView` is specifically for embedding RN components inside a SwiftUI tree. Example:
```jsx
import { Host, VStack, RNHostView } from "@expo-ui/swift-ui";
import { Pressable } from "react-native";
<Host matchContents>
<VStack>
<RNHostView matchContents>
// Here, `Pressable` is an RN component so it is wrapped in `RNHostView`.
<Pressable />
</RNHostView>
</VStack>
</Host>;
```
- If a required modifier or View is missing in Expo UI, it can be extended via a local Expo module. See: https://docs.expo.dev/guides/expo-ui-swift-ui/extending/index.md. Confirm with the user before extending.
© Expo Team · MIT · openai/plugins