Getting Started with KendoReact ChunkProgressBar

Copy Codeconst App = () => {
    const [value, setValue] = React.useState(0);

    const handleIncrease = () => {
        if (value < 100) {
            setValue(value + 20);
        }
    }

    const handleDecrease = () => {
        if (value > 0) {
            setValue(value - 20);
        }
    }
    return (
        <div className="wrapper">
            <button disabled={value === 0} className="k-button k-secondary mr-3" onClick={handleDecrease}>
                <span className="k-icon k-i-rewind"></span>
            </button>
            <ChunkProgressBar value={value} />
            <button disabled={value === 100} className="k-button k-primary ml-3"  onClick={handleIncrease}>
                <span className="k-icon k-i-forward"></span>
            </button>
        </div>
    )
}

ReactDOM.render(
    <App />,
    document.querySelector('my-app')
);