# Components

> Here you can find all the components available in the library. We are working on adding more components.

**BNA UI** — a React Native / Expo component library.
These components render through `react-native`, not the DOM: there are no HTML
elements, no Tailwind classes and no Radix primitives. Source is copied into your
project and imported through `@/components/ui/*`, `@/components/charts/*`,
`@/hooks/*` and `@/theme/*`. Colours come from the `useColor` hook rather than
hardcoded hex; sizing tokens (`HEIGHT`, `FONT_SIZE`, `BORDER_RADIUS`, `CORNERS`)
come from `@/theme/globals`.

- Docs: https://ui.ahmedbna.com/docs/components
- Markdown: https://ui.ahmedbna.com/docs/components.md

---

- [Accordion](/docs/components/accordion)
- [Action Sheet](/docs/components/action-sheet)
- [Alert Dialog](/docs/components/alert-dialog)
- [Alert](/docs/components/alert)
- [Audio Player](/docs/components/audio-player)
- [Audio Recorder](/docs/components/audio-recorder)
- [Audio Waveform](/docs/components/audio-waveform)
- [Avatar](/docs/components/avatar)
- [AvoidKeyboard](/docs/components/avoid-keyboard)
- [Badge](/docs/components/badge)
- [BottomSheet](/docs/components/bottom-sheet)
- [Button](/docs/components/button)
- [Camera Preview](/docs/components/camera-preview)
- [Camera](/docs/components/camera)
- [Card](/docs/components/card)
- [Carousel](/docs/components/carousel)
- [Checkbox](/docs/components/checkbox)
- [Collapsible](/docs/components/collapsible)
- [Color Picker](/docs/components/color-picker)
- [Combobox](/docs/components/combobox)
- [Date Picker](/docs/components/date-picker)
- [File Picker](/docs/components/file-picker)
- [Gallery](/docs/components/gallery)
- [Hello Wave](/docs/components/hello-wave)
- [Icon](/docs/components/icon)
- [Image](/docs/components/image)
- [Input OTP](/docs/components/input-otp)
- [Input](/docs/components/input)
- [Link](/docs/components/link)
- [MediaPicker](/docs/components/media-picker)
- [Mode Toggle](/docs/components/mode-toggle)
- [Onboarding](/docs/components/onboarding)
- [ParallaxScrollView](/docs/components/parallax-scrollview)
- [Picker](/docs/components/picker)
- [Popover](/docs/components/popover)
- [Progress](/docs/components/progress)
- [Radio](/docs/components/radio)
- [ScrollView](/docs/components/scroll-view)
- [SearchBar](/docs/components/searchbar)
- [Separator](/docs/components/separator)
- [Share](/docs/components/share)
- [Sheet](/docs/components/sheet)
- [Skeleton](/docs/components/skeleton)
- [Spinner](/docs/components/spinner)
- [Switch](/docs/components/switch)
- [Table](/docs/components/table)
- [Tabs](/docs/components/tabs)
- [Text](/docs/components/text)
- [Toast](/docs/components/toast)
- [Toggle](/docs/components/toggle)
- [Video](/docs/components/video)
- [View](/docs/components/view)