import React from "react";
import ReactDOM from "react-dom";
import { StackerSlide, StackerSlider } from "react-stacker";
 
export class App extends React.Component {
    onChangeHandler = value => {
        console.log("On change slide");
    };
 
    onPrevChangeHandler = event => {
        console.log("On prev change slide");
    };
 
    onNextChangeHandler = event => {
        console.log("On next change slide");
    };
 
    render() {
        const { value } = this.state;
        return (
            <StackerSlider
               dots={true}
                infiniteLoop={true}
                onChange={this.onChangeHandler}
                onPrevChange={this.onPrevChangeHandler}
                onNextChange={this.onNextChangeHandler}
            >
                <StackerSlide>
                    Slide 6/6
                </StackerSlide>
                <StackerSlide>
                    Slide 5/6
                </StackerSlide>
                <StackerSlide>
                    Slide 4/6
                </StackerSlide>
                <StackerSlide>
                    Slide 3/6
                </StackerSlide>
                <StackerSlide>
                    Slide 2/6
                </StackerSlide>
                <StackerSlide>
                    Slide 1/6
                </StackerSlide>
            </StackerSlider>
        );
    }
}
 
ReactDOM.render(<App />, document.getElementById("root"));