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

var _templateObject;

import React from 'react';
import styled from 'styled-components';
import { Link } from '@sentecacommerce-theme/lib';
import { useHideMobileDrawer } from '..';
export var MobileMenuItemList = (_ref) => {
  var {
    items
  } = _ref;
  var hideMobileDrawer = useHideMobileDrawer();

  var preventDefault = e => {
    e.preventDefault();
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, items == null ? void 0 : items.map(menuItem => {
    var _ref2, _menuItem$tags;

    var link = (_ref2 = menuItem.slug || menuItem.linkUrl) == null ? void 0 : _ref2.trim();
    return /*#__PURE__*/React.createElement(Li, {
      key: 'Sub DropdownItem-' + link,
      className: menuItem == null ? void 0 : (_menuItem$tags = menuItem.tags) == null ? void 0 : _menuItem$tags.join(' ')
    }, /*#__PURE__*/React.createElement(Link, {
      href: link || '/',
      passHref: true
    }, /*#__PURE__*/React.createElement("a", {
      onClick: !link || link === '#' ? preventDefault : hideMobileDrawer
    }, menuItem == null ? void 0 : menuItem.name)));
  }));
};
var Li = styled.li(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  text-align: left;\n  line-height: 1.6;\n  font-size: 1.6rem;\n  color: ", ";\n\n  &.promotion,\n  &.red {\n    color: ", " !important;\n    opacity: 1 !important;\n  }\n\n  &.bold {\n    font-weight: bold;\n  }\n\n  &.black {\n    color: ", " !important;\n  }\n\n  &.space-top {\n    padding-top: 2.4rem;\n  }\n"])), props => props.theme.palette.hint, (_ref3) => {
  var {
    theme
  } = _ref3;
  return theme.palette.discount;
}, (_ref4) => {
  var {
    theme
  } = _ref4;
  return theme.palette.primary;
});
//# sourceMappingURL=index.js.map