@wulperstudio/cms/node/components/InputCounter/InputCounter.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _react2 = require("@iconify/react");
var _IconButtonComponent = require("../IconButtonComponent");
var _styled = require("./styled");
var _jsxRuntime = require("react/jsx-runtime");
var _Icon, _Icon2;
var InputCounter = function InputCounter(props) {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputLabel, {
      sx: {
        marginBottom: '5px',
        fontSize: '16px',
        fontWeight: 'bold',
        fontFamily: 'Poppins, cursive'
      },
      children: props.label
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.CustomFormControl, {
      variant: "filled",
      fullWidth: true,
      sx: {
        backgroundColor: '#F6F7FC',
        borderRadius: '10px',
        minWidth: 0
      },
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styled.ContainerCounter, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
          variant: "body1",
          component: "p",
          color: "textSecondary",
          children: props.title
        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
          spacing: 2,
          direction: "row",
          alignItems: "center",
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButtonComponent.IconButtonComponent, {
            iconProps: {
              onClick: function onClick() {
                var _props$setNumber;
                return (_props$setNumber = props.setNumber) == null ? void 0 : _props$setNumber.call(props, props.number - 1);
              }
            },
            children: _Icon || (_Icon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
              icon: "mdi:minus"
            }))
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
            children: props.number
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButtonComponent.IconButtonComponent, {
            iconProps: {
              onClick: function onClick() {
                var _props$setNumber2;
                return (_props$setNumber2 = props.setNumber) == null ? void 0 : _props$setNumber2.call(props, props.number + 1);
              }
            },
            children: _Icon2 || (_Icon2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
              icon: "mdi:plus"
            }))
          })]
        })]
      })
    })]
  });
};
var _default = exports["default"] = InputCounter;