@shakthillc/components/lib/CountGetter/CountGetter.js

React generic components for shakthi products

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

var _Icon = require("@material-ui/core/Icon");

var _Icon2 = _interopRequireDefault(_Icon);

var _CountGetterModule = require("./CountGetter.module.css");

var _CountGetterModule2 = _interopRequireDefault(_CountGetterModule);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var CountGetter = function CountGetter(_ref) {
  var count = _ref.count,
      _ref$initial = _ref.initial,
      initial = _ref$initial === undefined ? 0 : _ref$initial,
      getCount = _ref.getCount;

  var _useState = (0, _react.useState)(initial),
      _useState2 = _slicedToArray(_useState, 2),
      value = _useState2[0],
      setValue = _useState2[1];

  var _useState3 = (0, _react.useState)("left"),
      _useState4 = _slicedToArray(_useState3, 2),
      gray = _useState4[0],
      setGray = _useState4[1];

  function handleClick(flag) {
    if (flag) {
      if (value + 1 == count) {
        setValue(value + 1);
        setGray("right");
        getCount(value + 1);
      } else if (count > value + 1) {
        setValue(value + 1);
        setGray("");
        getCount(value + 1);
      } else setGray("right");
    } else {
      if (value - 1 == 0) {
        setValue(value - 1);
        setGray("left");
        getCount(value - 1);
      } else if (value > 0) {
        setValue(value - 1);
        setGray("");
        getCount(value - 1);
      } else {
        setGray("left");
      }
    }
  }
  return _react2.default.createElement(
    "div",
    { className: _CountGetterModule2.default["rangecontainer"] },
    _react2.default.createElement(
      _Icon2.default,
      {
        style: { color: gray == "left" ? "gray" : "#005397" },
        className: _CountGetterModule2.default["rangecontainer--left"],
        onClick: function onClick() {
          handleClick(false);
        }
      },
      "remove_circle_outline"
    ),
    _react2.default.createElement(
      "span",
      {
        style: { padding: "0px 10px" },
        className: _CountGetterModule2.default["rangecontainer__counter"]
      },
      value
    ),
    _react2.default.createElement(
      _Icon2.default,
      {
        style: { color: gray == "right" ? "gray" : "#005397" },
        className: _CountGetterModule2.default["rangecontainer--right"],
        onClick: function onClick() {
          handleClick(true);
        }
      },
      "add_circle_outline"
    )
  );
};

exports.default = CountGetter;