☁️ Welcome Onboard! ☁️

A cute and minimal "onboarding" library for React!

⚙️ Installation

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

✈️ Using Welcome Onboard

1import React from 'react';
2import {
3  Slider,
4  SlidesContainer,
5  SliderPagination,
6  Slide,
7  Button,
8  useSlider
9} from "react-welcome-onboard";
10
11export default const App = () => {
12  const {
13    slide,
14    totalSlides,
15    incrementSlide,
16    decrementSlide,
17  } = useSlider(1, 2);
18
19  return (
20      <Slider slide={slide} totalSlides={totalSlides}>
21        <SlidesContainer>
22          <Slide>Slide 1 content</Slide>
23          <Slide>Slide 2 content</Slide>
24        </SlidesContainer>
25
26        <SliderPagination>
27          <Button label="Prev" onClick={decrementSlide}/>
28          <Button label="Next" onClick={incrementSlide} />
29        </SliderPagination>
30      </Slider>
31  )
32}

✨ 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