"use strict";

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

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

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

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

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

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

var _Typography = require("../Common/Typography");

var _templateObject, _templateObject2, _templateObject3;

function useInterval(callback, delay) {
  var savedCallback = (0, _react.useRef)(); // Remember the latest callback.

  (0, _react.useEffect)(function () {
    savedCallback.current = callback;
  }, [callback]); // Set up the interval.

  (0, _react.useEffect)(function () {
    function tick() {
      ;
      savedCallback == null ? void 0 : savedCallback.current();
    }

    if (delay !== null) {
      var id = setInterval(tick, delay);
      return function () {
        return clearInterval(id);
      };
    }
  }, [delay]);
}

var SlidingCTA = function SlidingCTA(props) {
  var elements = props.elements,
      isEnabled = props.isEnabled;

  var _useState = (0, _react.useState)(0),
      count = _useState[0],
      setCount = _useState[1];

  useInterval(function () {
    if (count + 1 > (elements == null ? void 0 : elements.length) - 1) {
      return setCount(0);
    }

    return setCount(count + 1);
  }, 5000);
  if (!isEnabled) return null;
  return /*#__PURE__*/_react["default"].createElement(Container, {
    className: "container-fluid py-2"
  }, elements.map(function (element, index) {
    return /*#__PURE__*/_react["default"].createElement(ContentWrapper, {
      key: "slidingCTA__" + element.label,
      as: "div",
      variant: "7",
      isActive: index === count,
      index: index
    }, element.label, (element == null ? void 0 : element.description) && /*#__PURE__*/_react["default"].createElement(CTA, null, element == null ? void 0 : element.description));
  }));
};

exports.SlidingCTA = SlidingCTA;

var Container = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  height: auto;\n  min-height: 4.5rem;\n  transition: all 0.5s;\n  box-shadow: inset 0 -1px 0 0 ", ";\n  position: relative;\n  background: #f5f5f5;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  max-width: none;\n  min-width: 100vw;\n"])), function (_ref) {
  var theme = _ref.theme;
  return theme.palette.light;
});

var ContentWrapper = (0, _styledComponents["default"])(_Typography.Typography)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  transform: ", ";\n  opacity: ", ";\n\n  transition: opacity 0.4s ease;\n  min-width: 100%;\n  color: ", ";\n  text-align: center;\n"])), function (props) {
  return props.isActive ? "translateX(-" + props.index * 100 + "%)" : 'translateX(300%)';
}, function (props) {
  return props.isActive ? '1' : '0';
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.primary;
});

var CTA = _styledComponents["default"].a(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-weight: 700;\n  padding-left: 5px;\n  cursor: pointer;\n  text-decoration: underline;\n\n  ", "\n"])), function (props) {
  return props.activated && "\n    text-decoration: none;\n  cursor: normal;\n  pointer-events: none;\n  ";
});
//# sourceMappingURL=slidingCTA.component.js.map