"use strict";

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

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

exports.__esModule = true;
exports.NextButton = exports.PrevButton = exports.DotButton = void 0;

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

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

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

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;

var Dot = _styledComponents["default"].button(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  background-color: transparent;\n  cursor: pointer;\n  position: relative;\n  padding: 0;\n  width: 3.5rem;\n  height: 3.5rem;\n  margin-right: 0.75rem;\n  margin-left: 0.75rem;\n  border: 0;\n  display: flex;\n  align-items: center;\n  padding: 0.5rem;\n\n  @media (max-width: ", ") {\n    display: none;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &::after {\n    background-color: ", ";\n    width: 100%;\n    height: 0.4rem;\n    content: '';\n\n    ", "\n  }\n"])), function (_ref) {
  var theme = _ref.theme;
  return theme.breakpoints.md.min;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.light;
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.palette.hint;
}, function (props) {
  return props.selected && "\n        background-color: " + props.theme.palette.primary + ";\n        opacity: 1;\n      ";
});

var DotButton = function DotButton(_ref4) {
  var selected = _ref4.selected,
      onClick = _ref4.onClick;
  return /*#__PURE__*/_react["default"].createElement(Dot, {
    selected: selected,
    onClick: onClick
  });
};

exports.DotButton = DotButton;
var sharedButtonStyles = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  background-color: transparent;\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  transform: translateY(-50%);\n  border: 0;\n  width: 5rem;\n  height: 5rem;\n  justify-content: center;\n  align-items: center;\n  padding: 0;\n  outline: none;\n\n  cursor: pointer;\n\n  @media (max-width: ", ") {\n    display: none;\n  }\n\n  &:not(:disabled) {\n    cursor: pointer;\n    fill: ", ";\n  }\n\n  &:disabled {\n    fill: ", ";\n  }\n"])), function (_ref5) {
  var theme = _ref5.theme;
  return theme.breakpoints.md.min;
}, function (_ref6) {
  var theme = _ref6.theme;
  return theme.palette.secondary;
}, function (_ref7) {
  var theme = _ref7.theme;
  return theme.palette.light;
});

var ButtonPrev = _styledComponents["default"].button(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  ", "\n  left: 0.7rem;\n  margin-left: -2rem;\n\n  z-index: 2000;\n"])), sharedButtonStyles);

var ButtonSvg = _styledComponents["default"].svg(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  width: 3.5rem;\n  height: 3.5rem;\n"])));

var PrevButton = function PrevButton(_ref8) {
  var enabled = _ref8.enabled,
      onClick = _ref8.onClick;
  return /*#__PURE__*/_react["default"].createElement(ButtonPrev, {
    onClick: onClick,
    disabled: !enabled
  }, /*#__PURE__*/_react["default"].createElement(ButtonSvg, {
    viewBox: "137.718 -1.001 366.563 644"
  }, /*#__PURE__*/_react["default"].createElement("path", {
    d: "M428.36 12.5c16.67-16.67 43.76-16.67 60.42 0 16.67 16.67 16.67 43.76 0 60.42L241.7 320c148.25 148.24 230.61 230.6 247.08 247.08 16.67 16.66 16.67 43.75 0 60.42-16.67 16.66-43.76 16.67-60.42 0-27.72-27.71-249.45-249.37-277.16-277.08a42.308 42.308 0 0 1-12.48-30.34c0-11.1 4.1-22.05 12.48-30.42C206.63 234.23 400.64 40.21 428.36 12.5z"
  })));
};

exports.PrevButton = PrevButton;

var ButtonNext = _styledComponents["default"].button(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  ", "\n  right: 0.7rem;\n  margin-right: -2rem;\n\n  z-index: 2000;\n"])), sharedButtonStyles);

var NextButton = function NextButton(_ref9) {
  var enabled = _ref9.enabled,
      onClick = _ref9.onClick;
  return /*#__PURE__*/_react["default"].createElement(ButtonNext, {
    onClick: onClick,
    disabled: !enabled
  }, /*#__PURE__*/_react["default"].createElement(ButtonSvg, {
    viewBox: "0 0 238.003 238.003"
  }, /*#__PURE__*/_react["default"].createElement("path", {
    d: "M181.776 107.719L78.705 4.648c-6.198-6.198-16.273-6.198-22.47 0s-6.198 16.273 0 22.47l91.883 91.883-91.883 91.883c-6.198 6.198-6.198 16.273 0 22.47s16.273 6.198 22.47 0l103.071-103.039a15.741 15.741 0 0 0 4.64-11.283c0-4.13-1.526-8.199-4.64-11.313z"
  })));
};

exports.NextButton = NextButton;
//# sourceMappingURL=index.js.map