@sberdevices/plasma-temple/dist/components/Cart/CartItemQuantityButton/CartItemQuantityButton.js

SberDevices CanvasApp Templates.

"use strict";

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

var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));

var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));

var _plasmaIcons = /*#__PURE__*/require("@sberdevices/plasma-icons");

var _plasmaUi = /*#__PURE__*/require("@sberdevices/plasma-ui");

var _plasmaTokens = /*#__PURE__*/require("@sberdevices/plasma-tokens");

var _hooks = /*#__PURE__*/require("../../../hooks");

var _useThrottledCallback = /*#__PURE__*/require("../../../hooks/useThrottledCallback");

var _utils = /*#__PURE__*/require("../../../utils");

var _CartItemPresent = /*#__PURE__*/require("../CartItemPresent/CartItemPresent");

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

var throttleWait = /*#__PURE__*/(0, _utils.isSberBoxLike)() ? _useThrottledCallback.THROTTLE_WAIT : 0;
var StyledStepperValue = /*#__PURE__*/(0, _styledComponents["default"])(_plasmaUi.StepperValue).withConfig({
  componentId: "plasma-temple__sc-yxcy0k-0"
})(["margin-left:0.375rem;margin-right:0.375rem;color:", ";"], function (_ref) {
  var isWarning = _ref.isWarning;
  return isWarning ? _plasmaTokens.warning : _plasmaTokens.primary;
});
var StyledStepperButton = /*#__PURE__*/(0, _styledComponents["default"])(_plasmaUi.ActionButton).attrs({
  'data-focusable': true,
  tabIndex: 0,
  view: 'secondary',
  pin: 'circle-circle'
}).withConfig({
  componentId: "plasma-temple__sc-yxcy0k-1"
})([""]);

function CartItemQuantityButton(_ref2) {
  var item = _ref2.item,
      className = _ref2.className,
      plusDisabled = _ref2.plusDisabled,
      onPlus = _ref2.onPlus,
      onMinus = _ref2.onMinus,
      onRemove = _ref2.onRemove;
  var quantity = item.quantity,
      quantityLimit = item.quantityLimit,
      present = item.present,
      disabled = item.disabled;
  var getItem = (0, _hooks.useGetMutableValue)(item);
  var handlePlus = (0, _useThrottledCallback.useThrottledCallback)(function (event) {
    event.stopPropagation();
    onPlus(getItem());
  }, [getItem, onPlus], throttleWait);
  var isMin = quantity <= 0;
  var handleMinus = (0, _useThrottledCallback.useThrottledCallback)(function (event) {
    event.stopPropagation();
    onMinus(getItem());
  }, [getItem, onMinus], throttleWait);
  var handleRemove = (0, _useThrottledCallback.useThrottledCallback)(function (event) {
    event.stopPropagation();
    onRemove === null || onRemove === void 0 ? void 0 : onRemove(getItem());
  }, [getItem, onRemove], throttleWait);

  if (present) {
    return /*#__PURE__*/_react["default"].createElement(_CartItemPresent.CartItemPresent, null);
  }

  if (disabled && onRemove) {
    return /*#__PURE__*/_react["default"].createElement(StyledStepperButton, {
      onClick: handleRemove,
      "data-cy": "QuantityButton-remove",
      "data-name": "cart-item-quantity-button-remove"
    }, /*#__PURE__*/_react["default"].createElement(_plasmaIcons.IconClose, {
      color: "inherit",
      size: "xs"
    }));
  }

  return /*#__PURE__*/_react["default"].createElement(_plasmaUi.StepperRoot, {
    className: className
  }, /*#__PURE__*/_react["default"].createElement(StyledStepperButton, {
    onClick: isMin && onRemove ? handleRemove : handleMinus,
    "data-cy": "QuantityButton-minus",
    "data-name": "cart-item-quantity-button-minus"
  }, isMin ? /*#__PURE__*/_react["default"].createElement(_plasmaIcons.IconClose, {
    color: "inherit",
    size: "xs"
  }) : /*#__PURE__*/_react["default"].createElement(_plasmaIcons.IconMinus, {
    color: "inherit",
    size: "xs"
  })), /*#__PURE__*/_react["default"].createElement(StyledStepperValue, {
    value: quantity,
    isWarning: Boolean(item.quantityLimit && item.quantity > item.quantityLimit)
  }), /*#__PURE__*/_react["default"].createElement(StyledStepperButton, {
    disabled: plusDisabled || disabled || Boolean(quantityLimit && quantity >= quantityLimit),
    onClick: handlePlus,
    "data-cy": "QuantityButton-plus",
    "data-name": "cart-item-quantity-button-plus"
  }, /*#__PURE__*/_react["default"].createElement(_plasmaIcons.IconPlus, {
    color: "inherit",
    size: "xs"
  })));
}
//# sourceMappingURL=CartItemQuantityButton.js.map