"use strict";

exports.__esModule = true;
exports.default = exports.Label = exports.MenuIcon = exports.AlertMessage = exports.Alert = exports.BlockWithA = exports.Block = void 0;

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

var _reactRedux = require("react-redux");

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

var _styledTransitionGroup = _interopRequireDefault(require("styled-transition-group"));

var _reactRouterDom = require("react-router-dom");

var _utils = require("../../utils");

var _Text = _interopRequireDefault(require("../Text"));

var _Icon = _interopRequireDefault(require("../Icon"));

var _templateObject;

var _excluded = ["menuToggle", "staticContext", "dispatch", "active", "component"],
    _excluded2 = ["open", "label", "icon", "alert", "pageScopeSelector", "closingTabHandler", "hide", "href"];

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

(function () {
  var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
  enterModule && enterModule(module);
})();

(function () {
  var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
  enterModule && enterModule(module);
})();

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
  return a;
};

var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
  return a;
};

var FilteredLink = function FilteredLink(_ref) {
  var menuToggle = _ref.menuToggle,
      staticContext = _ref.staticContext,
      dispatch = _ref.dispatch,
      active = _ref.active,
      component = _ref.component,
      props = _objectWithoutProperties(_ref, _excluded);

  return /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, props);
};

var Block = (0, _styledComponents.default)(FilteredLink).withConfig({
  displayName: "MenuItem__Block",
  componentId: "sc-184jekw-0"
})(["display:block;position:relative;padding:0 10px;margin-bottom:35px;color:", ";text-decoration:none;cursor:pointer;", ";"], (0, _utils.ifFlag)("active", (0, _utils.getThemeProp)(["colors", "application", "highlight"]), (0, _utils.getThemeProp)(["colors", "textMedium"], "#999999")), (0, _utils.ifFlag)("menuToggle", "", (0, _styledComponents.css)(["&:hover{color:", ";}"], (0, _utils.getThemeProp)(["colors", "application", "highlight"], "#ffffff"))));
exports.Block = Block;
var BlockWithA = Block.withComponent("a");
exports.BlockWithA = BlockWithA;

var Alert = _styledComponents.default.div.withConfig({
  displayName: "MenuItem__Alert",
  componentId: "sc-184jekw-1"
})(["border-radius:50%;border:4px solid ", ";position:absolute;top:0;left:27px;"], (0, _utils.getThemeProp)(["colors", "toasts", function (props) {
  return props.type;
}], "red"));

exports.Alert = Alert;

var transformTime = function transformTime(_ref2) {
  var timeout = _ref2.timeout;
  return timeout;
};

var opacityTime = function opacityTime(_ref3) {
  var timeout = _ref3.timeout;
  return Math.round(timeout * 0.5);
};

var opacityDelay = function opacityDelay(_ref4) {
  var timeout = _ref4.timeout;
  return Math.round(timeout * 0.25);
}; // XXX: The below is a hack to get syntax highlighting in transition styles.
// Adding the "transition" tag to styled-components tags would solve it.


var alertStyling = (0, _styledComponents.css)(["position:absolute;z-index:10000;top:calc(-10px - 0.7em);left:22px;width:auto;width:max-content;border-radius:5px;padding:10px 15px;box-shadow:0 2px 4px 0 rgba(0,0,0,0.5);color:", ";background-color:", ";font-size:11px;font-weight:bold;line-height:1.2;&::before{content:\"\";position:absolute;top:calc(10px + 0.2em);left:-0.9em;border:solid transparent;border-width:0.4em 0.9em 0.4em 0;border-right-color:", ";}"], (0, _utils.getThemeProp)(["colors", "textWhite"], "#efefef"), (0, _utils.getThemeProp)(["colors", "toasts", function (props) {
  return props.type;
}], "red"), (0, _utils.getThemeProp)(["colors", "toasts", function (props) {
  return props.type;
}], "red"));
var transitionStatement = (0, _styledComponents.css)(["transition:transform ", "ms cubic-bezier(0.68,-0.55,0.27,1.55),opacity ", "ms ", "ms ease-out;"], transformTime, opacityTime, opacityDelay);

var AlertMessage = _styledTransitionGroup.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t", "\n\t", "\n\n\t&:enter {\n\t\topacity: 0.01;\n\t\ttransform: translateX(-50%) scaleX(0);\n\t}\n\t&:enter-active {\n\t\topacity: 1;\n\t\ttransform: translateX(0) scaleX(1);\n\t}\n\t&:exit {\n\t\topacity: 1;\n\t\ttransform: translateX(0) scaleX(1);\n\t}\n\t&:exit-active {\n\t\topacity: 0.01;\n\t\ttransform: translateX(-50%) scaleX(0);\n\t}\n"])), alertStyling, transitionStatement);

exports.AlertMessage = AlertMessage;
AlertMessage.defaultProps = {
  timeout: 200,
  unmountOnExit: true,
  appear: true
};
var MenuIcon = (0, _styledComponents.default)(_Icon.default).withConfig({
  displayName: "MenuItem__MenuIcon",
  componentId: "sc-184jekw-2"
})(["font-size:24px;vertical-align:middle;"]);
exports.MenuIcon = MenuIcon;

var Label = _styledComponents.default.span.withConfig({
  displayName: "MenuItem__Label",
  componentId: "sc-184jekw-3"
})(["font-family:", ";font-size:13px;vertical-align:middle;text-transform:uppercase;padding-left:10px;transition:opacity 0.3s ease-out;opacity:", ";"], (0, _utils.getThemeProp)(["fonts", "header"], "sans-serif"), (0, _utils.ifFlag)("show", 1, 0));

exports.Label = Label;

var MenuItem = function MenuItem(_ref5) {
  var _ref5$open = _ref5.open,
      open = _ref5$open === void 0 ? false : _ref5$open,
      _ref5$label = _ref5.label,
      label = _ref5$label === void 0 ? "" : _ref5$label,
      icon = _ref5.icon,
      alert = _ref5.alert,
      pageScopeSelector = _ref5.pageScopeSelector,
      closingTabHandler = _ref5.closingTabHandler,
      hide = _ref5.hide,
      href = _ref5.href,
      props = _objectWithoutProperties(_ref5, _excluded2);

  var hideSelector = function hideSelector(state) {
    return typeof hide === "function" ? hide(state) : hide != null ? hide : false;
  };

  var isHidden = (0, _reactRedux.useSelector)(hideSelector);
  var ItemWrapper = Block;

  if (props.menuToggle) {
    ItemWrapper = BlockWithA;
  }

  var alertMessage = (0, _react.useRef)("");

  if (alert && alert.message) {
    alertMessage.current = alert.message;
  }

  return !isHidden && /*#__PURE__*/_react.default.createElement(ItemWrapper, _extends({
    to: href
  }, props), /*#__PURE__*/_react.default.createElement(MenuIcon, {
    id: icon
  }), alert ? /*#__PURE__*/_react.default.createElement(Alert, {
    type: alert.type
  }, /*#__PURE__*/_react.default.createElement(AlertMessage, {
    in: !!alert.message,
    type: alert.type
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
    message: alertMessage.current
  }))) : null, /*#__PURE__*/_react.default.createElement(Label, {
    show: open
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
    message: label
  })));
};

__signature__(MenuItem, "useSelector{isHidden}\nuseRef{alertMessage}", function () {
  return [_reactRedux.useSelector];
});

__signature__(MenuItem, "useSelector{isHidden}\nuseRef{alertMessage}", function () {
  return [_reactRedux.useSelector];
});

var _default = MenuItem;
var _default2 = _default;
var _default3 = _default2;
exports.default = _default3;
;

(function () {
  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;

  if (!reactHotLoader) {
    return;
  }

  reactHotLoader.register(FilteredLink, "FilteredLink", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Block, "Block", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(BlockWithA, "BlockWithA", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Alert, "Alert", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(transformTime, "transformTime", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(opacityTime, "opacityTime", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(opacityDelay, "opacityDelay", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(alertStyling, "alertStyling", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(transitionStatement, "transitionStatement", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(AlertMessage, "AlertMessage", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(MenuIcon, "MenuIcon", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Label, "Label", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(MenuItem, "MenuItem", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(_default, "default", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
})();

;

(function () {
  var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
  leaveModule && leaveModule(module);
})();

;

(function () {
  var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;

  if (!reactHotLoader) {
    return;
  }

  reactHotLoader.register(FilteredLink, "FilteredLink", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Block, "Block", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(BlockWithA, "BlockWithA", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Alert, "Alert", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(transformTime, "transformTime", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(opacityTime, "opacityTime", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(opacityDelay, "opacityDelay", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(alertStyling, "alertStyling", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(transitionStatement, "transitionStatement", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(AlertMessage, "AlertMessage", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(MenuIcon, "MenuIcon", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(Label, "Label", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(MenuItem, "MenuItem", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
  reactHotLoader.register(_default2, "default", "/home/vsts/work/1/s/src/components/AppFrame/MenuItem.js");
})();

;

(function () {
  var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;
  leaveModule && leaveModule(module);
})();