"use strict";

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

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

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

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

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

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

var _templateObject;

var StickyAddToBasket = function StickyAddToBasket(_ref) {
  var children = _ref.children,
      show = _ref.show;
  return /*#__PURE__*/_react["default"].createElement(_lib.Portal, null, /*#__PURE__*/_react["default"].createElement(StickyButton, {
    show: show,
    mobile: true
  }, children));
};

exports.StickyAddToBasket = StickyAddToBasket;

var StickyButton = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  background: ", ";\n  // border-top: 1px solid rgba(0, 0, 0, 0.2);\n  box-shadow: -1px 0 3px 0 #ccc;\n  width: 100%;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  z-index: 10;\n\n  transition: opacity 0.2s ease, transform 0.15s ease;\n  transform: ", ";\n  opacity: ", ";\n\n  @media (min-width: ", ") {\n    display: ", ";\n  }\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.secondary;
}, function (props) {
  return props.show ? 'translateY(0)' : 'translateY(100%)';
}, function (props) {
  return props.show ? '1' : '0';
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.breakpoints.lg.min;
}, function (props) {
  return props.mobile ? 'none' : 'block';
});
//# sourceMappingURL=index.js.map