Coming from shadcn/ui or React Native Reusables
Same copy-the-source idea, without the Tailwind setup — and every component moves.
If you know shadcn/ui, ExpoKit will feel familiar: a CLI copies each component's source into your app, and you own and edit it. Three things work differently.
What changes
- No Tailwind, Nativewind or Uniwind. Components use
StyleSheetand React Native's ownAnimated. There is no babel, metro or tailwind config to add, and everything runs in Expo Go. - Props instead of compound parts. Most components take their content as props (
title,items,options) rather thanTrigger/Contentchildren, and text children don't need a wrapping<Text>. - Theme through one provider. Colours, radius and light / dark come from
useKit(). Wrap the app in<KitProvider accent="#6366f1" radius={14}>instead of editing CSS variables.
The same button, both ways
React Native Reusables
import { Button } from '@/components/ui/button';import { Text } from '@/components/ui/text'; <Button variant="outline" onPress={save}> <Text>Save changes</Text></Button>ExpoKit
import { Button } from '@/components/ui/button'; <Button variant="outline" onPress={save}> Save changes</Button>Component by component
Every shadcn / React Native Reusables component and where to find it in ExpoKit.
| shadcn / RNR | ExpoKit | Notes |
|---|---|---|
| Accordion | Accordion | Springs to its measured height; one prop list instead of Trigger/Content parts. |
| Alert | Alert | Variants with an icon that draws itself; dismissible, with an optional timer. |
| Alert Dialog | Dialog | variant="destructive" with confirmLabel / cancelLabel. |
| Aspect Ratio | Not yet | Use React Native's aspectRatio style. |
| Avatar | Avatar | Photo or initials, presence dots, badges and AvatarGroup. |
| Badge | Badge | Solid, soft, outline and dot, plus a notification counter. |
| Button | ButtonStateful Button | Children can be plain text — no separate <Text> needed. |
| Card | Card | Composable like shadcn (Card.Header, Card.Title, Card.Content…), with a spring press. |
| Checkbox | Checkbox | The tick draws itself. |
| Collapsible | Accordion | A single AccordionItem works as a collapsible. |
| Context Menu | Action Sheet | Use an ActionSheet from onLongPress for now; a dedicated context menu is planned. |
| Dialog | DialogBottom Sheet | On phones a bottom sheet is often the better fit. |
| Dropdown Menu | SelectAction Sheet | Select for choosing a value; ActionSheet for a list of actions. |
| Hover Card | Not yet | Hover doesn't exist on touch screens — use a Popover-style sheet or a list item. |
| Input | Floating InputPassword InputSearch Bar | Floating label, focus halo, error shake. |
| Label | Floating Input | Labels are built into every input. |
| Menubar | Not yet | A desktop pattern; on phones use tabs or a bottom nav. |
| Popover | Not yet | Not yet as its own component. |
| Progress | ProgressProgress Steps | Bars, rings and segments; ProgressSteps for multi-step flows. |
| Radio Group | Radio Group | The dot glides to the chosen option. |
| Select | Select | Dropdown or bottom sheet, search, and multiple selection with chips. |
| Separator | Not yet | A View with StyleSheet.hairlineWidth and colors.border from useKit(). |
| Skeleton | Skeleton | Shimmer placeholders. |
| Switch | Switch | iOS-feel thumb with haptics. |
| Tabs | TabsSegmented Control | Underline tabs or a segmented control. |
| Text | Not yet | Use React Native's Text; colours come from useKit(). |
| Textarea | Textarea | Grows line by line, with a character counter. |
| Toggle | Chip Group | A single-chip ChipGroup toggles on and off. |
| Toggle Group | Segmented ControlChip Group | Single choice: SegmentedControl. Multiple: ChipGroup. |
| Tooltip | Not yet | Not yet as its own component. |
What you get on top
Inputs and pickers shadcn doesn't have (OTP input, calendar, date and time pickers), gesture components (swipe decks, slide-to-confirm, swipeable rows), Liquid Glass, charts and complete screens.
Start
In an existing Expo app, or a new one:
Both can live side by side and you can move over one component at a time:
add stops before overwriting a file you already have unless you pass --force.Did you like the content?