Quantity increase and descress (FontAwesome)

Demo

Installation

Install the package using npm:

npm install @skygdi/quantity-input

Don't forget to include FontAwesome CDN if you haven't

Sample

import { QuantityInputFontAwesome } from '@skygdi/quantity-input';
import '@skygdi/quantity-input/dist/style.css'; //Optional

function App() {

  const [quantity,setQuantity] = useState(2);
  const [loading,setLoading] = useState(false);
  

  const quantityChanged = (value) =>{
    console.log("changed:"+value);
    setQuantity(value);
    setLoading(false);
  };

  const quantityBlur = (value) =>{
    console.log("blur:"+value);
  };

  const quantityRemove = () =>{
    console.log("removed:");
    setQuantity(0);
    setLoading(false);
  }
  

  return (
    <div className="App">
      <QuantityInputFontAwesome
          quantity={quantity} 
          loading={loading}
          quantityChanged       = {quantityChanged}
          quantityBlur          = {quantityBlur}
          quantityRemove        = {quantityRemove}
          classNameContainer    = {"QuantitySelector QuantitySelector-large"}
          classNameButton       = {"QuantitySelector__Button Link Link--secondary"}
          classNameButtonRemove = {"QuantitySelector__Button Link remove"}
          classNameInput        = {"QuantitySelector__CurrentQuantity"}
      />
    </div>
  );
}