StatsHub Docs
Guides

Add a UI component

Put a component in the app or UI package that owns it.

Choose the owner before writing code.

ConsumerLocation
Expo onlyapps/expo/src/components
Shared native UIpackages/ui-native
Docs onlyapps/docs/src/components
Shared React 19 DOM UIpackages/ui-web
Next.js 14 web onlyapps/web/src/components

@statshub/ui-web currently targets Next 16 and React 19, so do not import it into the React 18 web app.

Native package

Use deep imports from @statshub/ui-native; it has no root barrel.

import { Button } from "@statshub/ui-native/button/button";

A package component must not import from an app. Move the dependency into the package or keep the component app-local.

Finish

Match neighboring component APIs and comments. Verify the relevant workspace:

pnpm check
pnpm --dir apps/expo exec expo export --platform ios
pnpm build:docs

Open the real screen or docs preview. Type checks cannot verify layout, interaction, accessibility, or native rendering.

On this page