@wulperstudio/cms/node/organisms/CardPurchase/CardPurchase.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CardPurchase = void 0;
var _react = _interopRequireDefault(require("react"));
var _react2 = require("@iconify/react");
var _material = require("@mui/material");
var _styled = require("./styled");
var _NumberOutput = require("../../components/NumberOutput");
var _TextForLinesOutput = require("../../components/TextForLinesOutput");
var _jsxRuntime = require("react/jsx-runtime");
var _Icon, _Icon2;
var CardPurchase = exports.CardPurchase = function CardPurchase(_ref) {
  var title = _ref.title,
    subTitle = _ref.subTitle,
    _ref$number = _ref.number,
    number = _ref$number === void 0 ? 0 : _ref$number,
    setNumber = _ref.setNumber;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.Card, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
      container: true,
      direction: "row",
      alignItems: "center",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
        container: true,
        direction: "column",
        xs: true,
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
          item: true,
          xs: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextForLinesOutput.TextForLinesOutput, {
            clines: 1,
            text: title
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
          item: true,
          xs: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextForLinesOutput.TextForLinesOutput, {
            clines: 1,
            text: subTitle
          })
        })]
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
        container: true,
        xs: true,
        justifyContent: "flex-end",
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Grid, {
          item: true,
          sx: {
            backgroundColor: '#fff'
          },
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
            onClick: function onClick() {
              return setNumber && setNumber(number - 1);
            },
            children: _Icon || (_Icon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
              icon: "subway:subtraction-1"
            }))
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_NumberOutput.NumberOutput, {
            number: number
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
            onClick: function onClick() {
              return setNumber && setNumber(number + 1);
            },
            children: _Icon2 || (_Icon2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Icon, {
              icon: "ant-design:plus-outlined"
            }))
          })]
        })
      })]
    })
  });
};