Alana UI Components for React Native
Alana React Native UI components library. Customizable and production-ready
npm install alana-react-native-ui-components --save
yarn add alana-react-native-ui-components
Overriding style guide
<StyleGuideProvider/> wrapper component to override the default style guide. Every Alana UI component in the component hierarchy below the provider
- Use NativeTestApp project for development. It's a regular React Native mobile app with storybook. Use Android as we don't have development environment set up for iOS yet.
- In order to manually test components using modals, add the component to App.tsx switch case, and add an enum value corresponding to your element. Use existing modal components as a reference.
- If you need to work on a component that isn't using react-native-modal (or any kind of modal), please modify App.tsx so that
modalViewTypeis None and make it so that switch case returns
StorybookUIRootinstead of null in case None and in default case. However, components using modals will not work if
StorybookUIRootis present in the switch case even if it isn't actually returned, so in order to test them, it must be replaced with null.
- It is important to use
import * as React from 'react'imports instead of
import React from 'react'because tsc renames the default imports to lowercase, which causes
ReferenceError: Property 'React' doesn't existerrors because
Reactends up being renamed to
react. If you need to use
useStateor any other React export, it could be accessed as
React.useStateand so on.
IMPORTANT Once your work is ready to be deployed modify
NativeTestApp/moduleExports.tsfile to export your newly created component. The component won't be included in the published package if you don't add it to
build.shscript to prepare
alana-react-native-ui-componentspackage for publishing. Please commit resulting dist folder.
- All dependencies used in
NativeTestAppshould be copied to package.json in
alana-react-native-ui-componentswith one exception: if a package requires a native dependecy, it should be specified as a peer dependency rather than a regular one. As a rule of thumb, if a package requires running
pod installto complete its setup, it should be specified as a peer dependecy in