"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.ProductDescription = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _react = _interopRequireDefault(require("react"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _lib = require("@sentecacommerce-theme/lib");

var _Common = require("../../../Common");

var _Components = require("./Components");

var _templateObject, _templateObject2, _templateObject3, _templateObject4;

var ProductDescription = function ProductDescription(_ref) {
  var content = _ref.content,
      descriptionRef = _ref.descriptionRef;

  var _useBoolean = (0, _lib.useBoolean)(),
      openModal = _useBoolean[0],
      setOpenModal = _useBoolean[1];

  var _React$useState = _react["default"].useState('Details'),
      activeTab = _React$useState[0],
      _setActiveTab = _React$useState[1];

  var _useLocalLabels = (0, _lib.useLocalLabels)(),
      productDescription = _useLocalLabels.productDescription,
      deliveryInfo = _useLocalLabels.deliveryInfo,
      mobileDescriptionButton = _useLocalLabels.mobileDescriptionButton;

  var handleClose = function handleClose() {
    return setOpenModal.off();
  };

  var handleOpenModal = function handleOpenModal() {
    return setOpenModal.on();
  };

  return /*#__PURE__*/_react["default"].createElement(Container, {
    ref: descriptionRef
  }, /*#__PURE__*/_react["default"].createElement(Desktop, null, /*#__PURE__*/_react["default"].createElement(_Components.Content, {
    activeTab: activeTab,
    setActiveTab: function setActiveTab(str) {
      return _setActiveTab(str);
    },
    labels: {
      productDescription: productDescription,
      deliveryInfo: deliveryInfo
    },
    content: content
  })), /*#__PURE__*/_react["default"].createElement(OpenMobileDescription, {
    onClick: handleOpenModal,
    bordered: true
  }, mobileDescriptionButton), /*#__PURE__*/_react["default"].createElement(Mobile, null, openModal && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_lib.OverflowHidden, null), /*#__PURE__*/_react["default"].createElement(_Common.AnimatedModal, {
    onClose: handleClose,
    title: productDescription
  }, /*#__PURE__*/_react["default"].createElement(_Components.Content, {
    activeTab: activeTab,
    setActiveTab: function setActiveTab(str) {
      return _setActiveTab(str);
    },
    labels: {
      productDescription: productDescription,
      deliveryInfo: deliveryInfo
    },
    content: content
  })))));
};

exports.ProductDescription = ProductDescription;

var Container = _styledComponents["default"].div.attrs({
  className: 'mt-5 row g-1 px-4'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Desktop = _styledComponents["default"].div.attrs({
  className: 'd-none d-md-block'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Mobile = _styledComponents["default"].div.attrs({
  className: 'd-block d-md-none'
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var OpenMobileDescription = (0, _styledComponents["default"])(_Common.Button).attrs({
  className: 'd-block d-md-none'
})(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])([""])));
//# sourceMappingURL=index.js.map