1.0.0 • Published 7 years ago
jeanelle-chek v1.0.0
Get Started
The following are required to use the library:
- Node.js
- Storybook
- Get started using the automated command line tool. This command automatically setups storybook.
npx -p @storybook/cli sb init --type react- Run storybook
npm run storybook - Visual Code
Components included:
Components
Buttons
Buttons are touchable components that users can use to interact with the screen. Buttons can be styled according to needs to look a specific way.
Floating Action Buttons

Usage
import FloatingButton from '../src/components/floating-button/floating-button';
<FloatingButton
style=""
color="blue"
textColor="white"
position="left"
icon="plus"
title="Add location" />
Props
Contained Buttons

Usage
import ContainedButton from '../src/components/contained-button/contained-button'
<ContainedButton
style=""
title="Save"
deactivated={true} />)
Props
References
Style
| Value | Description |
|---|---|
| - | External style defined |
Color
| Value | Description |
|---|---|
| Blue | Render a component with blue background |
| White | Render a component with White background |
textColor
| Value | Description |
|---|---|
| Blue | Render a component with blue text |
| White | Render a component with white text |
Position
| Value | Description |
|---|---|
| Left | Render a component positioned on the left |
| Right | Render a component positioned on the right |
Icon
| Value | Description |
|---|---|
| plus | Render a component with a plus icon |
| location | Render a component with a location icon |
Title
| Value | Description |
|---|---|
| - | Text to be displayed on the component |
Deactivated
| Value | Description |
|---|---|
| true | Render a deactivated component that is not clickable |
| false | Render a component that is clickable |
1.0.0
7 years ago