import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";

var _templateObject, _templateObject2, _templateObject3;

import React from 'react';
import { ScrollView, Typography } from '../../../../../Common';
import styled from 'styled-components';
import Link from 'next/link';
export var TextWithLinkFilter = (_ref) => {
  var {
    data
  } = _ref;
  return /*#__PURE__*/React.createElement(ScrollView, {
    maxHeight: "none",
    maxWidth: "100%",
    overflowDirection: "x"
  }, /*#__PURE__*/React.createElement(Container, null, data.items.map(filter => {
    var {
      name,
      url
    } = filter;
    return /*#__PURE__*/React.createElement(Wrapper, {
      key: "Filter__" + name + "-" + url
    }, /*#__PURE__*/React.createElement(Link, {
      prefetch: false,
      href: url,
      passHref: true
    }, /*#__PURE__*/React.createElement(Text, null, name)));
  })));
};
var Container = styled.div.attrs({
  className: 'd-flex d-md-block mb-2'
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
var Wrapper = styled.div.attrs({
  className: 'px-2'
})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  &:first-child {\n    padding-left: 1.6rem !important;\n  }\n\n  &:last-child {\n    padding-right: 1.6rem !important;\n  }\n"])));
var Text = styled(Typography).attrs({
  as: 'a',
  variant: 5,
  color: 'primary',
  className: 'd-block px-md-0'
})(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  line-height: 3rem;\n  font-weight: 500;\n  @media (max-width: ", ") {\n    background: ", ";\n    padding: 0 0.5rem;\n    border-radius: 0.2rem;\n  }\n  @media (min-width: ", ") {\n    background-color: transparent;\n    border: 0;\n  }\n"])), (_ref2) => {
  var {
    theme
  } = _ref2;
  return theme.breakpoints.sm.max;
}, (_ref3) => {
  var {
    theme
  } = _ref3;
  return theme.palette.whiteSmoke;
}, (_ref4) => {
  var {
    theme
  } = _ref4;
  return theme.breakpoints.md.min;
});
//# sourceMappingURL=index.js.map