storybook-system v0.2.1

1. Clone the application

2. Install the packages

   npm install

3. To Start the storybook

   npm run storybook

4. Make the changes and export them in index.js

5. change the application version in package.json file

6. Make the build using rollup.js the bundler that helps to make the minified version of the application and distribute the reactjs application as a distributable package

   npm run build-lib

7. Upload the build to git

   npm --allow-same-version version 0.1.6 -m "Bump version to: %s skip ci"

8. Login with npm in your command prompt

   npm add user

9. Add the GitHub token and npm token in the .env file

10. publish the package

    npm publish

1. install the package.

   npm install storybook-system

2. import the package in the js file

   import { Button } from 'storybook-system'

3. You can customise the component with the custom css

import {componentName} from 'storybook-system/dist'

• variant (String)
  • primary1 (default)
  • primary2
  • primary3
  • secondary1
  • secondary2
  • secondary3
  • Black1
  • Black2
  • Black3
  • smallSecondary1
  • smallSecondary2
  • smallSecondary3
• icon (Image object)

• onChange (method to receive the value changed)
• Will be adding props to disable the dates.

• label (String)
• Icon (Image object (png, svg, jpg etc))
• onChange (function)

• onChange (function)
• placeholder (String)
• multiSelect (Boolean True/False) (False by default)

• Items (should be a array of key value pairs as following)

  [
    {
      value: 'One',
      label: 'One'
    },
    {
      value: 'Two',
      label: 'Two'
    },
    {
      value: 'Three',
      label: 'Three'
    },
    {
      value: 'Four',
      label: 'Four'
    },
    {
      value: 'Five',
      label: 'Five'
    }
  ]

• title (String)
• icon (Image object)
• label (String)
• variant (String)
  • primary (default)
  • secondary

• text (String)
• variant (String)
  • primary (default)
  • color
  • default
• icon (image object)

• text (String)
• icon (image object)

• variant
  • progress
  • scheduled
  • ready
• header (String) (required for all three variants)
• pickupAddress (String) (required for all three variants)
• Progress (String) (required for all three variants)
• delivery (String) (Not required for scheduled)
• deliveryInfo (String) (Required only for scheduled variant)

• label (String)
• variant (String)
  • filled
  • normal
  • disabled