The easiest way to use react-counter-input is to install it from npm:

npm install react-counter-input

Then use it in your app:

import React from "react";
import CounterInput from "react-counter-input";

class App extends React.Component {
  render() {
    return (
      <CounterInput
        min={0}
        max={10}
        onCountChange={count => console.log(count)}
      />
    );
  }
}

For more examples, check out the Storybook.

number | optional, defaults to 0

The initial count.

number | optional

The maximum count.

number | optional

The minimum count.

function | optional

Handler function that gets called with the current count anytime the count state changes.

Style props get merged in with the default styles, allowing you to override specific properties.

object | optional

Styles applied to the top level wrapper element.

object | optional

Styles applied to the increment and decrement buttons.

object | optional

Styles applied to the text input element.

If you want to have more low level control over how the component looks and behaves, use the children render prop API.

function | optional