☁️ Welcome Onboard! ☁️

A cute and minimal "onboarding" library for React!

⚙️ Installation

$ npm i react-welcome-onboard
$ yarn add react-welcome-onboard

✈️ Using Welcome Onboard

import React from 'react';
import {
  Slider,
  SlidesContainer,
  SliderPagination,
  Slide,
  Button,
  useSlider
} from "react-welcome-onboard";

export default const App = () => {
  const {
    slide,
    totalSlides,
    incrementSlide,
    decrementSlide,
  } = useSlider(1, 2);

  return (
      <Slider slide={slide} totalSlides={totalSlides}>
        <SlidesContainer>
          <Slide>Slide 1 content</Slide>
          <Slide>Slide 2 content</Slide>
        </SlidesContainer>

        <SliderPagination>
          <Button label="Prev" onClick={decrementSlide}/>
          <Button label="Next" onClick={incrementSlide} />
        </SliderPagination>
      </Slider>
  )
}

✨ License and Special Thanks

Welcome Onboard is released under the MIT license, feel free to use it, share and modify.

☁️ Buttons style inspiration from the beautiful Chakra UI