메뉴
shadcn/ui-style components for React Native with NativeWind v4, RN Primitives, and CLI scaffolding. Use when building Expo apps with copy-paste UI components, theming, or overlay patterns.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
GitHub Actions workflow patterns for React Native iOS simulator and Android emulator cloud builds with downloadable artifacts. Use when setting up CI build pipelines or downloading GitHub Actions artifacts via gh CLI and GitHub API.
GitHub patterns using gh CLI for pull requests, stacked PRs, code review, branching strategies, and repository automation. Use when working with GitHub PRs, merging strategies, or repository management tasks.
Provides an incremental adoption strategy to migrate native iOS or Android apps to React Native or Expo using @callstack/react-native-brownfield for initial setup. Use when planning migration steps, packaging XCFramework/AAR artifacts, and integrating them into host apps.
React Native core components, layout, styling, animations, lists, platform APIs, and best practices. Use when building iOS/Android UIs with native components.
React Native ecosystem — navigation, state, data fetching, Reanimated, storage, TypeScript patterns, accessibility, and deep linking. Use when building production React Native apps with React Navigation, Zustand, TanStack Query, or Reanimated v3.
Expo toolchain for React Native — Expo Router, EAS Build/Update/Deploy, native modules, SDK upgrading, and Expo UI/data patterns.
| name | react-native-reusables |
| description | shadcn/ui-style components for React Native with NativeWind v4, RN Primitives, and CLI scaffolding. Use when building Expo apps with copy-paste UI components, theming, or overlay patterns. |
| metadata | {"author":"maikotrindade","version":"2026.5.0"} |
Targets NativeWind v4, Expo SDK 52+, and Expo Router v4. For Expo SDK tooling see the
react-native-exposkill. For standalone state/navigation patterns see thereact-native-ecosystemskill.
React Native Reusables brings the shadcn/ui experience to React Native: copy-paste or CLI-scaffolded components, theming via CSS variables, and RN Primitives under the hood. It supports NativeWind and Uniwind, requires a root PortalHost for overlays, and uses a Text inheritance system and an Icon wrapper for Lucide.
| Topic | Description | Reference |
|---|---|---|
| Overview | What RNR is, differences from shadcn/ui (portals, no cascade, icons, etc.) | core-overview |
| Installation | CLI init vs manual setup, adding components, PortalHost, dependencies | core-installation |
| Customization | components.json, global.css, tailwind.config, theme.ts | core-customization |
| Topic | Description | Reference |
|---|---|---|
| Components overview | Button, Input, Dialog, variants, asChild, compound components | features-components-overview |
| Text and icons | TextClassContext inheritance, Icon wrapper with Lucide | features-text-and-icons |
| Forms & controls | Label, Input, Select, Checkbox, RadioGroup, react-hook-form integration | features-forms-controls |
| Overlays & portals | PortalHost, Dialog/Popover/SelectContent, contentInsets | features-overlays-portals |
| Registry and CLI | init, add, doctor; custom registry and registryDependencies | features-registry-cli |
| Blocks | Auth blocks, Clerk integration, adding blocks via CLI | features-blocks |
| Topic | Description | Reference |
|---|---|---|
| Adding components | Prefer CLI, PortalHost placement, path aliases, cn helper, manual copy | best-practices-adding-components |
| Troubleshooting | doctor, --log-level all, PortalHost, aliases, dependencies | best-practices-troubleshooting |
npx react-native-reusables add <name>) so primitives and paths are wired correctly<Text> from @/components/ui/text as the direct child so TextClassContext applies variant styles<Icon as={LucideIcon} /> rather than wrapping each icon individually.dark:root (not .dark) in global.css for dark-mode CSS variablesdoctor after manual setup or when something breaks before assuming a bug