@plasmatictechnologies/alana-react-native-ui-components

Alana UI Components for React Native

Alana React Native UI components library. Customizable and production-ready

Installation

npm install alana-react-native-ui-components --save

or

yarn add alana-react-native-ui-components

Usage

Overriding style guide

Use <StyleGuideProvider/> wrapper component to override the default style guide. Every Alana UI component in the component hierarchy below the provider

Development

• 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 modalViewType is None and make it so that switch case returns StorybookUIRoot instead of null in case None and in default case. However, components using modals will not work if StorybookUIRoot is 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 exist errors because React ends up being renamed to react . If you need to use useEffect or useState or any other React export, it could be accessed as React.useEffect or React.useState and so on.
• IMPORTANT Once your work is ready to be deployed modify NativeTestApp/moduleExports.ts file to export your newly created component. The component won't be included in the published package if you don't add it to moduleExports.ts.
• Run build.sh script to prepare alana-react-native-ui-components package for publishing. Please commit resulting dist folder.
• All dependencies used in NativeTestApp should be copied to package.json in alana-react-native-ui-components with 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 install to complete its setup, it should be specified as a peer dependecy in alana-react-native-ui-components/package.json