React-chunks NPM

React Chunks

To make lives easier

Install

npm install --save react-chunks

Usage

import { Navbar } from 'react-chunks'

// Optional Props
const props = {
  bgColor: 'blue', // Default: white
  color: 'white', // Default: black
  maxWidth: '900px', // Default: 100%
  aligh: 'left' // Default: center
}

const Component = () => {
  const yourStyle = {
    padding: '10px'
    // ....
  }

  return (
    <Navbar {...props} style={yourStyle}>
      {...code}
    </Navbar>
  )
}

import { Carousel } from 'react-chunks'

const Component = () => {
  const rawData = [
    { _id: 'a1', alphabet: 'A' },
    { _id: 'b2', alphabet: 'B' },
    { _id: 'c3', alphabet: 'C' }
  ]

  const renderData = rawData.map(({ _id, alphabet }) => (
    <div key={_id}>{alphabet}</div>
  ))

  // Optional Props
  // Default auto: false
  // Default speed: 3000 milliseconds

  return (
    <Carousel auto speed={5000}>
      {renderData}
    </Carousel>
  )
}

import { capitalize } from 'react-chunks'

const Component = () => {
  const capitalizedWord = capitalize('hello world')

  return <p>{capitalizedWord}</p>
}

//-----------------------------------