@nema-international/commerce-ui-native

Commerce-style React Native UI library for iOS and Android (Expo or bare React Native).

• Design tokens and theming: light, dark and system modes, brand themes, WCAG-checked colors
• Primitives: Box, Stack, Text, Pressable, Screen with token-aware, responsive style props
• 90+ components: forms, feedback, overlays, navigation, data display, and commerce (ProductCard, PriceTag)
• Mobile-first: safe areas, keyboard handling, haptics, RTL, Dynamic Type, Reduce Motion
• No native code: works with the New Architecture and needs no extra native setup

Install

npm install @nema-international/commerce-ui-native react-native-svg react-native-safe-area-context

Optional: expo-haptics, expo-image, expo-video, lottie-react-native.

Use

import { UIProvider, Screen, Button, useToast } from '@nema-international/commerce-ui-native';

export default function App() {
  return (
    <UIProvider>
      <Home />
    </UIProvider>
  );
}

function Home() {
  const toast = useToast();
  return (
    <Screen p="md">
      <Button title="Add to Cart" fullWidth onPress={() => toast.success('Added to cart')} />
    </Screen>
  );
}

See the documentation site (apps/docs) for guides and the full API reference.

Design tokens

tokens/tokens.json (W3C Design Tokens format) ships with the package, for Figma (Tokens Studio) and Style Dictionary.

License

MIT