@nauedu/frontend-component-header 20.0.0 → 20.1.0

package/dist/MobileHeader.js

@@ -0,0 +1,244 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+import React from 'react';
+import PropTypes from 'prop-types';
+import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { getConfig } from '@edx/frontend-platform';
+
+// Local Components
+import { Menu, MenuTrigger, MenuContent } from './Menu';
+import Avatar from './Avatar';
+import { LinkedLogo, Logo } from './Logo';
+
+// i18n
+import messages from './Header.messages';
+
+// Assets
+import { MenuIcon } from './Icons';
+var MobileHeader = /*#__PURE__*/function (_React$Component) {
+  function MobileHeader(props) {
+    _classCallCheck(this, MobileHeader);
+    // eslint-disable-line no-useless-constructor
+    return _callSuper(this, MobileHeader, [props]);
+  }
+  _inherits(MobileHeader, _React$Component);
+  return _createClass(MobileHeader, [{
+    key: "renderMenu",
+    value: function renderMenu(menu) {
+      // Nodes are accepted as a prop
+      if (!Array.isArray(menu)) {
+        return menu;
+      }
+      return menu.map(function (menuItem) {
+        var type = menuItem.type,
+          href = menuItem.href,
+          content = menuItem.content,
+          submenuContent = menuItem.submenuContent,
+          disabled = menuItem.disabled,
+          isActive = menuItem.isActive;
+        if (type === 'item') {
+          return /*#__PURE__*/React.createElement("a", {
+            key: "".concat(type, "-").concat(content),
+            className: "nav-link".concat(disabled ? ' disabled' : '').concat(isActive ? ' active' : ''),
+            href: href
+          }, content);
+        }
+        return /*#__PURE__*/React.createElement(Menu, {
+          key: "".concat(type, "-").concat(content),
+          tag: "div",
+          className: "nav-item"
+        }, /*#__PURE__*/React.createElement(MenuTrigger, {
+          tag: "a",
+          role: "button",
+          tabIndex: "0",
+          className: "nav-link"
+        }, content), /*#__PURE__*/React.createElement(MenuContent, {
+          className: "position-static pin-left pin-right py-2"
+        }, submenuContent));
+      });
+    }
+  }, {
+    key: "renderMainMenu",
+    value: function renderMainMenu() {
+      var mainMenu = this.props.mainMenu;
+      return this.renderMenu(mainMenu);
+    }
+  }, {
+    key: "renderSecondaryMenu",
+    value: function renderSecondaryMenu() {
+      var secondaryMenu = this.props.secondaryMenu;
+      return this.renderMenu(secondaryMenu);
+    }
+  }, {
+    key: "renderUserMenuItems",
+    value: function renderUserMenuItems() {
+      var userMenu = this.props.userMenu;
+      return userMenu.map(function (group) {
+        return group.items.map(function (_ref) {
+          var type = _ref.type,
+            content = _ref.content,
+            href = _ref.href,
+            disabled = _ref.disabled,
+            isActive = _ref.isActive;
+          return /*#__PURE__*/React.createElement("li", {
+            className: "nav-item",
+            key: "".concat(type, "-").concat(content)
+          }, /*#__PURE__*/React.createElement("a", {
+            className: "nav-link".concat(isActive ? ' active' : '').concat(disabled ? ' disabled' : ''),
+            href: href
+          }, content));
+        });
+      });
+    }
+  }, {
+    key: "renderLoggedOutItems",
+    value: function renderLoggedOutItems() {
+      var loggedOutItems = this.props.loggedOutItems;
+      return loggedOutItems.map(function (_ref2, i, arr) {
+        var type = _ref2.type,
+          href = _ref2.href,
+          content = _ref2.content;
+        return /*#__PURE__*/React.createElement("li", {
+          className: "nav-item px-3 my-2",
+          key: "".concat(type, "-").concat(content)
+        }, /*#__PURE__*/React.createElement("a", {
+          className: i < arr.length - 1 ? 'btn btn-block btn-outline-primary' : 'btn btn-block btn-primary',
+          href: href
+        }, content));
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        logo = _this$props.logo,
+        logoAltText = _this$props.logoAltText,
+        logoDestination = _this$props.logoDestination,
+        loggedIn = _this$props.loggedIn,
+        avatar = _this$props.avatar,
+        username = _this$props.username,
+        stickyOnMobile = _this$props.stickyOnMobile,
+        intl = _this$props.intl,
+        mainMenu = _this$props.mainMenu,
+        userMenu = _this$props.userMenu,
+        loggedOutItems = _this$props.loggedOutItems;
+      var logoProps = {
+        src: logo,
+        alt: logoAltText,
+        href: logoDestination
+      };
+      var stickyClassName = stickyOnMobile ? 'sticky-top' : '';
+      var logoClasses = getConfig().AUTHN_MINIMAL_HEADER ? 'justify-content-left pl-3' : 'justify-content-center';
+      return /*#__PURE__*/React.createElement("header", {
+        "aria-label": intl.formatMessage(messages['header.label.main.header']),
+        className: "site-header-mobile d-flex justify-content-between align-items-center shadow ".concat(stickyClassName)
+      }, /*#__PURE__*/React.createElement("a", {
+        className: "nav-skip sr-only sr-only-focusable",
+        href: "#main"
+      }, intl.formatMessage(messages['header.label.skip.nav'])), mainMenu.length > 0 ? /*#__PURE__*/React.createElement("div", {
+        className: "w-100 d-flex justify-content-start"
+      }, /*#__PURE__*/React.createElement(Menu, {
+        className: "position-static"
+      }, /*#__PURE__*/React.createElement(MenuTrigger, {
+        tag: "button",
+        className: "icon-button",
+        "aria-label": intl.formatMessage(messages['header.label.main.menu']),
+        title: intl.formatMessage(messages['header.label.main.menu'])
+      }, /*#__PURE__*/React.createElement(MenuIcon, {
+        role: "img",
+        "aria-hidden": true,
+        focusable: "false",
+        style: {
+          width: '1.5rem',
+          height: '1.5rem'
+        }
+      })), /*#__PURE__*/React.createElement(MenuContent, {
+        tag: "nav",
+        "aria-label": intl.formatMessage(messages['header.label.main.nav']),
+        className: "nav flex-column pin-left pin-right border-top shadow py-2"
+      }, this.renderMainMenu(), this.renderSecondaryMenu()))) : null, /*#__PURE__*/React.createElement("div", {
+        className: "w-100 d-flex ".concat(logoClasses)
+      }, logoDestination === null ? /*#__PURE__*/React.createElement(Logo, {
+        className: "logo",
+        src: logo,
+        alt: logoAltText
+      }) : /*#__PURE__*/React.createElement(LinkedLogo, _extends({
+        className: "logo"
+      }, logoProps, {
+        itemType: "http://schema.org/Organization"
+      }))), userMenu.length > 0 || loggedOutItems.length > 0 ? /*#__PURE__*/React.createElement("div", {
+        className: "w-100 d-flex justify-content-end align-items-center"
+      }, /*#__PURE__*/React.createElement(Menu, {
+        tag: "nav",
+        "aria-label": intl.formatMessage(messages['header.label.secondary.nav']),
+        className: "position-static"
+      }, /*#__PURE__*/React.createElement(MenuTrigger, {
+        tag: "button",
+        className: "icon-button",
+        "aria-label": intl.formatMessage(messages['header.label.account.menu']),
+        title: intl.formatMessage(messages['header.label.account.menu'])
+      }, /*#__PURE__*/React.createElement(Avatar, {
+        size: "1.5rem",
+        src: avatar,
+        alt: username
+      })), /*#__PURE__*/React.createElement(MenuContent, {
+        tag: "ul",
+        className: "nav flex-column pin-left pin-right border-top shadow py-2"
+      }, loggedIn ? this.renderUserMenuItems() : this.renderLoggedOutItems()))) : null);
+    }
+  }]);
+}(React.Component);
+MobileHeader.propTypes = {
+  mainMenu: PropTypes.oneOfType([PropTypes.node, PropTypes.array]),
+  secondaryMenu: PropTypes.oneOfType([PropTypes.node, PropTypes.array]),
+  userMenu: PropTypes.arrayOf(PropTypes.shape({
+    heading: PropTypes.string,
+    items: PropTypes.arrayOf(PropTypes.shape({
+      type: PropTypes.oneOf(['item', 'menu']),
+      href: PropTypes.string,
+      content: PropTypes.string,
+      isActive: PropTypes.bool
+    }))
+  })),
+  loggedOutItems: PropTypes.arrayOf(PropTypes.shape({
+    type: PropTypes.oneOf(['item', 'menu']),
+    href: PropTypes.string,
+    content: PropTypes.string
+  })),
+  logo: PropTypes.string,
+  logoAltText: PropTypes.string,
+  logoDestination: PropTypes.string,
+  avatar: PropTypes.string,
+  username: PropTypes.string,
+  loggedIn: PropTypes.bool,
+  stickyOnMobile: PropTypes.bool,
+  // i18n
+  intl: intlShape.isRequired
+};
+MobileHeader.defaultProps = {
+  mainMenu: [],
+  secondaryMenu: [],
+  userMenu: [],
+  loggedOutItems: [],
+  logo: null,
+  logoAltText: null,
+  logoDestination: null,
+  avatar: null,
+  username: null,
+  loggedIn: false,
+  stickyOnMobile: true
+};
+export default injectIntl(MobileHeader);
+//# sourceMappingURL=MobileHeader.js.map

package/dist/MobileHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileHeader.js","names":["React","PropTypes","injectIntl","intlShape","getConfig","Menu","MenuTrigger","MenuContent","Avatar","LinkedLogo","Logo","messages","MenuIcon","MobileHeader","_React$Component","props","_classCallCheck","_callSuper","_inherits","_createClass","key","value","renderMenu","menu","Array","isArray","map","menuItem","type","href","content","submenuContent","disabled","isActive","createElement","concat","className","tag","role","tabIndex","renderMainMenu","mainMenu","renderSecondaryMenu","secondaryMenu","renderUserMenuItems","userMenu","group","items","_ref","renderLoggedOutItems","loggedOutItems","_ref2","i","arr","length","render","_this$props","logo","logoAltText","logoDestination","loggedIn","avatar","username","stickyOnMobile","intl","logoProps","src","alt","stickyClassName","logoClasses","AUTHN_MINIMAL_HEADER","formatMessage","title","focusable","style","width","height","_extends","itemType","size","Component","propTypes","oneOfType","node","array","arrayOf","shape","heading","string","oneOf","bool","isRequired","defaultProps"],"sources":["../src/MobileHeader.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { getConfig } from '@edx/frontend-platform';\n\n// Local Components\nimport { Menu, MenuTrigger, MenuContent } from './Menu';\nimport Avatar from './Avatar';\nimport { LinkedLogo, Logo } from './Logo';\n\n// i18n\nimport messages from './Header.messages';\n\n// Assets\nimport { MenuIcon } from './Icons';\n\nclass MobileHeader extends React.Component {\n  constructor(props) { // eslint-disable-line no-useless-constructor\n    super(props);\n  }\n\n  renderMenu(menu) {\n    // Nodes are accepted as a prop\n    if (!Array.isArray(menu)) {\n      return menu;\n    }\n\n    return menu.map((menuItem) => {\n      const {\n        type,\n        href,\n        content,\n        submenuContent,\n        disabled,\n        isActive,\n      } = menuItem;\n\n      if (type === 'item') {\n        return (\n          <a\n            key={`${type}-${content}`}\n            className={`nav-link${disabled ? ' disabled' : ''}${isActive ? ' active' : ''}`}\n            href={href}\n          >\n            {content}\n          </a>\n        );\n      }\n\n      return (\n        <Menu key={`${type}-${content}`} tag=\"div\" className=\"nav-item\">\n          <MenuTrigger tag=\"a\" role=\"button\" tabIndex=\"0\" className=\"nav-link\">\n            {content}\n          </MenuTrigger>\n          <MenuContent className=\"position-static pin-left pin-right py-2\">\n            {submenuContent}\n          </MenuContent>\n        </Menu>\n      );\n    });\n  }\n\n  renderMainMenu() {\n    const { mainMenu } = this.props;\n    return this.renderMenu(mainMenu);\n  }\n\n  renderSecondaryMenu() {\n    const { secondaryMenu } = this.props;\n    return this.renderMenu(secondaryMenu);\n  }\n\n  renderUserMenuItems() {\n    const { userMenu } = this.props;\n\n    return userMenu.map((group) => (\n      group.items.map(({\n        type, content, href, disabled, isActive,\n      }) => (\n        <li className=\"nav-item\" key={`${type}-${content}`}>\n          <a\n            className={`nav-link${isActive ? ' active' : ''}${disabled ? ' disabled' : ''}`}\n            href={href}\n          >\n            {content}\n          </a>\n        </li>\n      ))\n    ));\n  }\n\n  renderLoggedOutItems() {\n    const { loggedOutItems } = this.props;\n\n    return loggedOutItems.map(({ type, href, content }, i, arr) => (\n      <li className=\"nav-item px-3 my-2\" key={`${type}-${content}`}>\n        <a\n          className={i < arr.length - 1 ? 'btn btn-block btn-outline-primary' : 'btn btn-block btn-primary'}\n          href={href}\n        >\n          {content}\n        </a>\n      </li>\n    ));\n  }\n\n  render() {\n    const {\n      logo,\n      logoAltText,\n      logoDestination,\n      loggedIn,\n      avatar,\n      username,\n      stickyOnMobile,\n      intl,\n      mainMenu,\n      userMenu,\n      loggedOutItems,\n    } = this.props;\n    const logoProps = { src: logo, alt: logoAltText, href: logoDestination };\n    const stickyClassName = stickyOnMobile ? 'sticky-top' : '';\n    const logoClasses = getConfig().AUTHN_MINIMAL_HEADER ? 'justify-content-left pl-3' : 'justify-content-center';\n\n    return (\n      <header\n        aria-label={intl.formatMessage(messages['header.label.main.header'])}\n        className={`site-header-mobile d-flex justify-content-between align-items-center shadow ${stickyClassName}`}\n      >\n        <a className=\"nav-skip sr-only sr-only-focusable\" href=\"#main\">{intl.formatMessage(messages['header.label.skip.nav'])}</a>\n        {mainMenu.length > 0 ? (\n          <div className=\"w-100 d-flex justify-content-start\">\n\n            <Menu className=\"position-static\">\n              <MenuTrigger\n                tag=\"button\"\n                className=\"icon-button\"\n                aria-label={intl.formatMessage(messages['header.label.main.menu'])}\n                title={intl.formatMessage(messages['header.label.main.menu'])}\n              >\n                <MenuIcon role=\"img\" aria-hidden focusable=\"false\" style={{ width: '1.5rem', height: '1.5rem' }} />\n              </MenuTrigger>\n              <MenuContent\n                tag=\"nav\"\n                aria-label={intl.formatMessage(messages['header.label.main.nav'])}\n                className=\"nav flex-column pin-left pin-right border-top shadow py-2\"\n              >\n                {this.renderMainMenu()}\n                {this.renderSecondaryMenu()}\n              </MenuContent>\n            </Menu>\n          </div>\n        ) : null}\n        <div className={`w-100 d-flex ${logoClasses}`}>\n          { logoDestination === null ? <Logo className=\"logo\" src={logo} alt={logoAltText} /> : <LinkedLogo className=\"logo\" {...logoProps} itemType=\"http://schema.org/Organization\" />}\n        </div>\n        {userMenu.length > 0 || loggedOutItems.length > 0 ? (\n          <div className=\"w-100 d-flex justify-content-end align-items-center\">\n            <Menu tag=\"nav\" aria-label={intl.formatMessage(messages['header.label.secondary.nav'])} className=\"position-static\">\n              <MenuTrigger\n                tag=\"button\"\n                className=\"icon-button\"\n                aria-label={intl.formatMessage(messages['header.label.account.menu'])}\n                title={intl.formatMessage(messages['header.label.account.menu'])}\n              >\n                <Avatar size=\"1.5rem\" src={avatar} alt={username} />\n              </MenuTrigger>\n              <MenuContent tag=\"ul\" className=\"nav flex-column pin-left pin-right border-top shadow py-2\">\n                {loggedIn ? this.renderUserMenuItems() : this.renderLoggedOutItems()}\n              </MenuContent>\n            </Menu>\n          </div>\n        ) : null}\n      </header>\n    );\n  }\n}\n\nMobileHeader.propTypes = {\n  mainMenu: PropTypes.oneOfType([\n    PropTypes.node,\n    PropTypes.array,\n  ]),\n  secondaryMenu: PropTypes.oneOfType([\n    PropTypes.node,\n    PropTypes.array,\n  ]),\n  userMenu: PropTypes.arrayOf(PropTypes.shape({\n    heading: PropTypes.string,\n    items: PropTypes.arrayOf(PropTypes.shape({\n      type: PropTypes.oneOf(['item', 'menu']),\n      href: PropTypes.string,\n      content: PropTypes.string,\n      isActive: PropTypes.bool,\n    })),\n  })),\n  loggedOutItems: PropTypes.arrayOf(PropTypes.shape({\n    type: PropTypes.oneOf(['item', 'menu']),\n    href: PropTypes.string,\n    content: PropTypes.string,\n  })),\n  logo: PropTypes.string,\n  logoAltText: PropTypes.string,\n  logoDestination: PropTypes.string,\n  avatar: PropTypes.string,\n  username: PropTypes.string,\n  loggedIn: PropTypes.bool,\n  stickyOnMobile: PropTypes.bool,\n\n  // i18n\n  intl: intlShape.isRequired,\n};\n\nMobileHeader.defaultProps = {\n  mainMenu: [],\n  secondaryMenu: [],\n  userMenu: [],\n  loggedOutItems: [],\n  logo: null,\n  logoAltText: null,\n  logoDestination: null,\n  avatar: null,\n  username: null,\n  loggedIn: false,\n  stickyOnMobile: true,\n\n};\n\nexport default injectIntl(MobileHeader);\n"],"mappings":"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","ignoreList":[]}

package/dist/__snapshots__/Header.test.jsx.snap

@@ -33,7 +33,6 @@ exports[`<Header /> renders correctly for anonymous desktop 1`] = `
         <a
           className="nav-link"
           href="http://localhost:18000/dashboard"
-          onClick={null}
         >
           Courses
         </a>
@@ -230,7 +229,6 @@ exports[`<Header /> renders correctly for authenticated desktop 1`] = `
         <a
           className="nav-link"
           href="http://localhost:18000/dashboard"
-          onClick={null}
         >
           Courses
         </a>

package/dist/index.scss

@@ -1,9 +1,6 @@
 $spacer: 1rem;
 $blue: #007db8;
 $white: #fff;
-$component-active-bg: #0A3055FF !default;
-$component-active-color: $white !default;
-$rounded-pill: 50rem  !default;
 
 @import './Menu/menu.scss';
 @import './studio-header/StudioHeader.scss';
@@ -24,9 +21,8 @@ $rounded-pill: 50rem  !default;
   padding: .75rem;
   justify-content: center;
   align-items:center;
-
   &:hover, &:focus {
-    background: rgba(0, 0, 0, .1);
+    background: rgba(0,0,0,.1);
   }
 }
 
@@ -40,7 +36,7 @@ $rounded-pill: 50rem  !default;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
-      padding-bottom: calc(var(--pgn-spacing-spacer-base, $spacer)* 0.1);
+      padding-bottom: 0.1rem;
     }
   }
 
@@ -67,7 +63,6 @@ $rounded-pill: 50rem  !default;
     text-decoration: none;
     cursor: pointer;
   }
-
   img {
     height: 1.5rem;
   }
@@ -75,22 +70,19 @@ $rounded-pill: 50rem  !default;
 
 
 .site-header-desktop {
-  box-shadow: 0 1px 0 0 rgba(0, 0, 0, .1);
-  background: var(--pgn-color-white, $white);
-
+  box-shadow: 0 1px 0 0 rgba(0,0,0,.1);
+  background: $white;
   .nav-link {
     text-decoration: none;
   }
-
   .logo {
     display: block;
     box-sizing: content-box;
     position: relative;
     top: -.05em;
     height: 1.75rem;
-    padding: var(--pgn-spacing-spacer-base, $spacer) 0;
-    margin-right: var(--pgn-spacing-spacer-base, $spacer);
-
+    padding: 1rem 0;
+    margin-right: 1rem;
     img {
       display: block;
       height: 100%;
@@ -101,42 +93,38 @@ $rounded-pill: 50rem  !default;
     .nav-link:focus,
     .nav-link.active,
     .expanded .nav-link {
-      background: var(--pgn-color-bg-active, $component-active-bg);
-      color: var(--pgn-color-active, $component-active-color);
+      background: $component-active-bg;
+      color: $component-active-color;
     }
   }
   .main-nav {
     .nav-link {
-      padding: 1.125rem var(--pgn-spacing-spacer-base, $spacer);
+      padding: 1.125rem 1rem;
       text-decoration: none;
       font-weight: 500;
       letter-spacing: .01em;
     }
-
     .nav-link:hover,
     .nav-link:focus,
     .nav-link.active,
     .expanded .nav-link {
-      background: var(--pgn-color-bg-active, $component-active-bg);
-      color: var(--pgn-color-active, $component-active-color);
+      background: $component-active-bg;
+      color: $component-active-color;
     }
-
     .menu {
       position: static;
-
       .menu-content {
-        border-top: solid 2px var(--pgn-color-bg-active);
+        border-top: solid 2px $component-active-bg;
         left: 0;
         right: 0;
-        box-shadow: var(--pgn-elevation-box-shadow-down-1, 0 1px 2px rgba(0,0,0,.25));
+        box-shadow: 0 1px 2px rgba(0,0,0,.25);
         border-bottom-left-radius: 2px;
         border-bottom-right-radius: 2px;
-        padding: var(--pgn-spacing-spacer-base, $spacer);
+        padding: 1rem;
       }
     }
   }
-
   .search-input {
-    border-radius: var(--pgn-size-rounded-pill, $rounded-pill);
+    border-radius: $rounded-pill;
   }
 }

package/dist/learning-header/AnonymousUserMenu.js

@@ -2,21 +2,18 @@ import React from 'react';
 import { getConfig } from '@edx/frontend-platform';
 import { getLoginRedirectUrl } from '@edx/frontend-platform/auth';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
-import LearningLoggedOutItemsSlot from '../plugin-slots/LearningLoggedOutItemsSlot';
+import { Button } from '@openedx/paragon';
 import genericMessages from '../generic/messages';
 var AnonymousUserMenu = function AnonymousUserMenu(_ref) {
   var intl = _ref.intl;
-  var buttonsInfo = [{
-    message: intl.formatMessage(genericMessages.registerSentenceCase),
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
+    className: "mr-3",
+    variant: "outline-primary",
     href: "".concat(getConfig().LMS_BASE_URL, "/register?next=").concat(encodeURIComponent(global.location.href))
-  }, {
-    message: intl.formatMessage(genericMessages.signInSentenceCase),
-    href: getLoginRedirectUrl(global.location.href),
-    variant: 'primary'
-  }];
-  return /*#__PURE__*/React.createElement(LearningLoggedOutItemsSlot, {
-    buttonsInfo: buttonsInfo
-  });
+  }, intl.formatMessage(genericMessages.registerSentenceCase)), /*#__PURE__*/React.createElement(Button, {
+    variant: "primary",
+    href: "".concat(getLoginRedirectUrl(global.location.href))
+  }, intl.formatMessage(genericMessages.signInSentenceCase)));
 };
 AnonymousUserMenu.propTypes = {
   intl: intlShape.isRequired

package/dist/learning-header/AnonymousUserMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnonymousUserMenu.js","names":["React","getConfig","getLoginRedirectUrl","injectIntl","intlShape","LearningLoggedOutItemsSlot","genericMessages","AnonymousUserMenu","_ref","intl","buttonsInfo","message","formatMessage","registerSentenceCase","href","concat","LMS_BASE_URL","encodeURIComponent","global","location","signInSentenceCase","variant","createElement","propTypes","isRequired"],"sources":["../../src/learning-header/AnonymousUserMenu.jsx"],"sourcesContent":["import React from 'react';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { getLoginRedirectUrl } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport LearningLoggedOutItemsSlot from '../plugin-slots/LearningLoggedOutItemsSlot';\n\nimport genericMessages from '../generic/messages';\n\nconst AnonymousUserMenu = ({ intl }) => {\n  const buttonsInfo = [\n    {\n      message: intl.formatMessage(genericMessages.registerSentenceCase),\n      href: `${getConfig().LMS_BASE_URL}/register?next=${encodeURIComponent(global.location.href)}`,\n    },\n    {\n      message: intl.formatMessage(genericMessages.signInSentenceCase),\n      href: getLoginRedirectUrl(global.location.href),\n      variant: 'primary',\n    },\n  ];\n\n  return <LearningLoggedOutItemsSlot buttonsInfo={buttonsInfo} />;\n};\n\nAnonymousUserMenu.propTypes = {\n  intl: intlShape.isRequired,\n};\n\nexport default injectIntl(AnonymousUserMenu);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS,QAAQ,wBAAwB;AAClD,SAASC,mBAAmB,QAAQ,6BAA6B;AACjE,SAASC,UAAU,EAAEC,SAAS,QAAQ,6BAA6B;AACnE,OAAOC,0BAA0B,MAAM,4CAA4C;AAEnF,OAAOC,eAAe,MAAM,qBAAqB;AAEjD,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAC,IAAA,EAAiB;EAAA,IAAXC,IAAI,GAAAD,IAAA,CAAJC,IAAI;EAC/B,IAAMC,WAAW,GAAG,CAClB;IACEC,OAAO,EAAEF,IAAI,CAACG,aAAa,CAACN,eAAe,CAACO,oBAAoB,CAAC;IACjEC,IAAI,KAAAC,MAAA,CAAKd,SAAS,CAAC,CAAC,CAACe,YAAY,qBAAAD,MAAA,CAAkBE,kBAAkB,CAACC,MAAM,CAACC,QAAQ,CAACL,IAAI,CAAC;EAC7F,CAAC,EACD;IACEH,OAAO,EAAEF,IAAI,CAACG,aAAa,CAACN,eAAe,CAACc,kBAAkB,CAAC;IAC/DN,IAAI,EAAEZ,mBAAmB,CAACgB,MAAM,CAACC,QAAQ,CAACL,IAAI,CAAC;IAC/CO,OAAO,EAAE;EACX,CAAC,CACF;EAED,oBAAOrB,KAAA,CAAAsB,aAAA,CAACjB,0BAA0B;IAACK,WAAW,EAAEA;EAAY,CAAE,CAAC;AACjE,CAAC;AAEDH,iBAAiB,CAACgB,SAAS,GAAG;EAC5Bd,IAAI,EAAEL,SAAS,CAACoB;AAClB,CAAC;AAED,eAAerB,UAAU,CAACI,iBAAiB,CAAC","ignoreList":[]}
+{"version":3,"file":"AnonymousUserMenu.js","names":["React","getConfig","getLoginRedirectUrl","injectIntl","intlShape","Button","genericMessages","AnonymousUserMenu","_ref","intl","createElement","className","variant","href","concat","LMS_BASE_URL","encodeURIComponent","global","location","formatMessage","registerSentenceCase","signInSentenceCase","propTypes","isRequired"],"sources":["../../src/learning-header/AnonymousUserMenu.jsx"],"sourcesContent":["import React from 'react';\n\nimport { getConfig } from '@edx/frontend-platform';\nimport { getLoginRedirectUrl } from '@edx/frontend-platform/auth';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Button } from '@openedx/paragon';\n\nimport genericMessages from '../generic/messages';\n\nconst AnonymousUserMenu = ({ intl }) => (\n  <div>\n    <Button\n      className=\"mr-3\"\n      variant=\"outline-primary\"\n      href={`${getConfig().LMS_BASE_URL}/register?next=${encodeURIComponent(global.location.href)}`}\n    >\n      {intl.formatMessage(genericMessages.registerSentenceCase)}\n    </Button>\n    <Button\n      variant=\"primary\"\n      href={`${getLoginRedirectUrl(global.location.href)}`}\n    >\n      {intl.formatMessage(genericMessages.signInSentenceCase)}\n    </Button>\n  </div>\n);\n\nAnonymousUserMenu.propTypes = {\n  intl: intlShape.isRequired,\n};\n\nexport default injectIntl(AnonymousUserMenu);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS,QAAQ,wBAAwB;AAClD,SAASC,mBAAmB,QAAQ,6BAA6B;AACjE,SAASC,UAAU,EAAEC,SAAS,QAAQ,6BAA6B;AACnE,SAASC,MAAM,QAAQ,kBAAkB;AAEzC,OAAOC,eAAe,MAAM,qBAAqB;AAEjD,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAC,IAAA;EAAA,IAAMC,IAAI,GAAAD,IAAA,CAAJC,IAAI;EAAA,oBAC/BT,KAAA,CAAAU,aAAA,2BACEV,KAAA,CAAAU,aAAA,CAACL,MAAM;IACLM,SAAS,EAAC,MAAM;IAChBC,OAAO,EAAC,iBAAiB;IACzBC,IAAI,KAAAC,MAAA,CAAKb,SAAS,CAAC,CAAC,CAACc,YAAY,qBAAAD,MAAA,CAAkBE,kBAAkB,CAACC,MAAM,CAACC,QAAQ,CAACL,IAAI,CAAC;EAAG,GAE7FJ,IAAI,CAACU,aAAa,CAACb,eAAe,CAACc,oBAAoB,CAClD,CAAC,eACTpB,KAAA,CAAAU,aAAA,CAACL,MAAM;IACLO,OAAO,EAAC,SAAS;IACjBC,IAAI,KAAAC,MAAA,CAAKZ,mBAAmB,CAACe,MAAM,CAACC,QAAQ,CAACL,IAAI,CAAC;EAAG,GAEpDJ,IAAI,CAACU,aAAa,CAACb,eAAe,CAACe,kBAAkB,CAChD,CACL,CAAC;AAAA,CACP;AAEDd,iBAAiB,CAACe,SAAS,GAAG;EAC5Bb,IAAI,EAAEL,SAAS,CAACmB;AAClB,CAAC;AAED,eAAepB,UAAU,CAACI,iBAAiB,CAAC","ignoreList":[]}

package/dist/learning-header/AuthenticatedUserDropdown.js

@@ -1,50 +1,42 @@
-function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
-function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import React from 'react';
 import PropTypes from 'prop-types';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faUserCircle } from '@fortawesome/free-solid-svg-icons';
 import { getConfig } from '@edx/frontend-platform';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import { Dropdown } from '@openedx/paragon';
-import LearningUserMenuToggleSlot from '../plugin-slots/LearningUserMenuToggleSlot';
-import LearningUserMenuSlot from '../plugin-slots/LearningUserMenuSlot';
 import messages from './messages';
 var AuthenticatedUserDropdown = function AuthenticatedUserDropdown(_ref) {
   var intl = _ref.intl,
     username = _ref.username;
-  var dropdownItems = [{
-    message: intl.formatMessage(messages.dashboard),
+  var dashboardMenuItem = /*#__PURE__*/React.createElement(Dropdown.Item, {
     href: "".concat(getConfig().LMS_BASE_URL, "/dashboard")
-  }, {
-    message: intl.formatMessage(messages.profile),
+  }, intl.formatMessage(messages.dashboard));
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("a", {
+    className: "text-gray-700",
+    href: "".concat(getConfig().SUPPORT_URL)
+  }, intl.formatMessage(messages.help)), /*#__PURE__*/React.createElement(Dropdown, {
+    className: "user-dropdown ml-3"
+  }, /*#__PURE__*/React.createElement(Dropdown.Toggle, {
+    variant: "outline-primary"
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faUserCircle,
+    className: "d-md-none",
+    size: "lg"
+  }), /*#__PURE__*/React.createElement("span", {
+    "data-hj-suppress": true,
+    className: "d-none d-md-inline"
+  }, username)), /*#__PURE__*/React.createElement(Dropdown.Menu, {
+    className: "dropdown-menu-right"
+  }, dashboardMenuItem, /*#__PURE__*/React.createElement(Dropdown.Item, {
     href: "".concat(getConfig().ACCOUNT_PROFILE_URL, "/u/").concat(username)
-  }, {
-    message: intl.formatMessage(messages.account),
+  }, intl.formatMessage(messages.profile)), /*#__PURE__*/React.createElement(Dropdown.Item, {
     href: getConfig().ACCOUNT_SETTINGS_URL
-  }].concat(_toConsumableArray(getConfig().ORDER_HISTORY_URL ? [{
-    message: intl.formatMessage(messages.orderHistory),
+  }, intl.formatMessage(messages.account)), getConfig().ORDER_HISTORY_URL && /*#__PURE__*/React.createElement(Dropdown.Item, {
     href: getConfig().ORDER_HISTORY_URL
-  }] : []), [{
-    message: intl.formatMessage(messages.signOut),
+  }, intl.formatMessage(messages.orderHistory)), /*#__PURE__*/React.createElement(Dropdown.Item, {
     href: getConfig().LOGOUT_URL
-  }]);
-  return /*#__PURE__*/React.createElement(Dropdown, {
-    className: "user-dropdown ml-3"
-  }, /*#__PURE__*/React.createElement(Dropdown.Toggle, {
-    variant: "outline-primary",
-    "aria-label": intl.formatMessage(messages.userOptionsDropdownLabel)
-  }, /*#__PURE__*/React.createElement(LearningUserMenuToggleSlot, {
-    label: username,
-    icon: faUserCircle
-  })), /*#__PURE__*/React.createElement(Dropdown.Menu, {
-    className: "dropdown-menu-right"
-  }, /*#__PURE__*/React.createElement(LearningUserMenuSlot, {
-    items: dropdownItems
-  })));
+  }, intl.formatMessage(messages.signOut)))));
 };
 AuthenticatedUserDropdown.propTypes = {
   intl: intlShape.isRequired,

package/dist/learning-header/AuthenticatedUserDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuthenticatedUserDropdown.js","names":["React","PropTypes","faUserCircle","getConfig","injectIntl","intlShape","Dropdown","LearningUserMenuToggleSlot","LearningUserMenuSlot","messages","AuthenticatedUserDropdown","_ref","intl","username","dropdownItems","message","formatMessage","dashboard","href","concat","LMS_BASE_URL","profile","ACCOUNT_PROFILE_URL","account","ACCOUNT_SETTINGS_URL","_toConsumableArray","ORDER_HISTORY_URL","orderHistory","signOut","LOGOUT_URL","createElement","className","Toggle","variant","userOptionsDropdownLabel","label","icon","Menu","items","propTypes","isRequired","string"],"sources":["../../src/learning-header/AuthenticatedUserDropdown.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { faUserCircle } from '@fortawesome/free-solid-svg-icons';\nimport { getConfig } from '@edx/frontend-platform';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Dropdown } from '@openedx/paragon';\n\nimport LearningUserMenuToggleSlot from '../plugin-slots/LearningUserMenuToggleSlot';\nimport LearningUserMenuSlot from '../plugin-slots/LearningUserMenuSlot';\n\nimport messages from './messages';\n\nconst AuthenticatedUserDropdown = ({ intl, username }) => {\n  const dropdownItems = [\n    {\n      message: intl.formatMessage(messages.dashboard),\n      href: `${getConfig().LMS_BASE_URL}/dashboard`,\n    },\n    {\n      message: intl.formatMessage(messages.profile),\n      href: `${getConfig().ACCOUNT_PROFILE_URL}/u/${username}`,\n    },\n    {\n      message: intl.formatMessage(messages.account),\n      href: getConfig().ACCOUNT_SETTINGS_URL,\n    },\n    ...(getConfig().ORDER_HISTORY_URL ? [{\n      message: intl.formatMessage(messages.orderHistory),\n      href: getConfig().ORDER_HISTORY_URL,\n    }] : []),\n    {\n      message: intl.formatMessage(messages.signOut),\n      href: getConfig().LOGOUT_URL,\n    },\n  ];\n\n  return (\n    <Dropdown className=\"user-dropdown ml-3\">\n      <Dropdown.Toggle variant=\"outline-primary\" aria-label={intl.formatMessage(messages.userOptionsDropdownLabel)}>\n        <LearningUserMenuToggleSlot label={username} icon={faUserCircle} />\n      </Dropdown.Toggle>\n      <Dropdown.Menu className=\"dropdown-menu-right\">\n        <LearningUserMenuSlot items={dropdownItems} />\n      </Dropdown.Menu>\n    </Dropdown>\n  );\n};\n\nAuthenticatedUserDropdown.propTypes = {\n  intl: intlShape.isRequired,\n  username: PropTypes.string.isRequired,\n};\n\nexport default injectIntl(AuthenticatedUserDropdown);\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,YAAY,QAAQ,mCAAmC;AAChE,SAASC,SAAS,QAAQ,wBAAwB;AAClD,SAASC,UAAU,EAAEC,SAAS,QAAQ,6BAA6B;AACnE,SAASC,QAAQ,QAAQ,kBAAkB;AAE3C,OAAOC,0BAA0B,MAAM,4CAA4C;AACnF,OAAOC,oBAAoB,MAAM,sCAAsC;AAEvE,OAAOC,QAAQ,MAAM,YAAY;AAEjC,IAAMC,yBAAyB,GAAG,SAA5BA,yBAAyBA,CAAAC,IAAA,EAA2B;EAAA,IAArBC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IAAEC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;EACjD,IAAMC,aAAa,IACjB;IACEC,OAAO,EAAEH,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACQ,SAAS,CAAC;IAC/CC,IAAI,KAAAC,MAAA,CAAKhB,SAAS,CAAC,CAAC,CAACiB,YAAY;EACnC,CAAC,EACD;IACEL,OAAO,EAAEH,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACY,OAAO,CAAC;IAC7CH,IAAI,KAAAC,MAAA,CAAKhB,SAAS,CAAC,CAAC,CAACmB,mBAAmB,SAAAH,MAAA,CAAMN,QAAQ;EACxD,CAAC,EACD;IACEE,OAAO,EAAEH,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACc,OAAO,CAAC;IAC7CL,IAAI,EAAEf,SAAS,CAAC,CAAC,CAACqB;EACpB,CAAC,EAAAL,MAAA,CAAAM,kBAAA,CACGtB,SAAS,CAAC,CAAC,CAACuB,iBAAiB,GAAG,CAAC;IACnCX,OAAO,EAAEH,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACkB,YAAY,CAAC;IAClDT,IAAI,EAAEf,SAAS,CAAC,CAAC,CAACuB;EACpB,CAAC,CAAC,GAAG,EAAE,IACP;IACEX,OAAO,EAAEH,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACmB,OAAO,CAAC;IAC7CV,IAAI,EAAEf,SAAS,CAAC,CAAC,CAAC0B;EACpB,CAAC,EACF;EAED,oBACE7B,KAAA,CAAA8B,aAAA,CAACxB,QAAQ;IAACyB,SAAS,EAAC;EAAoB,gBACtC/B,KAAA,CAAA8B,aAAA,CAACxB,QAAQ,CAAC0B,MAAM;IAACC,OAAO,EAAC,iBAAiB;IAAC,cAAYrB,IAAI,CAACI,aAAa,CAACP,QAAQ,CAACyB,wBAAwB;EAAE,gBAC3GlC,KAAA,CAAA8B,aAAA,CAACvB,0BAA0B;IAAC4B,KAAK,EAAEtB,QAAS;IAACuB,IAAI,EAAElC;EAAa,CAAE,CACnD,CAAC,eAClBF,KAAA,CAAA8B,aAAA,CAACxB,QAAQ,CAAC+B,IAAI;IAACN,SAAS,EAAC;EAAqB,gBAC5C/B,KAAA,CAAA8B,aAAA,CAACtB,oBAAoB;IAAC8B,KAAK,EAAExB;EAAc,CAAE,CAChC,CACP,CAAC;AAEf,CAAC;AAEDJ,yBAAyB,CAAC6B,SAAS,GAAG;EACpC3B,IAAI,EAAEP,SAAS,CAACmC,UAAU;EAC1B3B,QAAQ,EAAEZ,SAAS,CAACwC,MAAM,CAACD;AAC7B,CAAC;AAED,eAAepC,UAAU,CAACM,yBAAyB,CAAC","ignoreList":[]}
+{"version":3,"file":"AuthenticatedUserDropdown.js","names":["React","PropTypes","FontAwesomeIcon","faUserCircle","getConfig","injectIntl","intlShape","Dropdown","messages","AuthenticatedUserDropdown","_ref","intl","username","dashboardMenuItem","createElement","Item","href","concat","LMS_BASE_URL","formatMessage","dashboard","Fragment","className","SUPPORT_URL","help","Toggle","variant","icon","size","Menu","ACCOUNT_PROFILE_URL","profile","ACCOUNT_SETTINGS_URL","account","ORDER_HISTORY_URL","orderHistory","LOGOUT_URL","signOut","propTypes","isRequired","string"],"sources":["../../src/learning-header/AuthenticatedUserDropdown.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faUserCircle } from '@fortawesome/free-solid-svg-icons';\nimport { getConfig } from '@edx/frontend-platform';\nimport { injectIntl, intlShape } from '@edx/frontend-platform/i18n';\nimport { Dropdown } from '@openedx/paragon';\n\nimport messages from './messages';\n\nconst AuthenticatedUserDropdown = ({ intl, username }) => {\n  const dashboardMenuItem = (\n    <Dropdown.Item href={`${getConfig().LMS_BASE_URL}/dashboard`}>\n      {intl.formatMessage(messages.dashboard)}\n    </Dropdown.Item>\n  );\n\n  return (\n    <>\n      <a className=\"text-gray-700\" href={`${getConfig().SUPPORT_URL}`}>{intl.formatMessage(messages.help)}</a>\n      <Dropdown className=\"user-dropdown ml-3\">\n        <Dropdown.Toggle variant=\"outline-primary\">\n          <FontAwesomeIcon icon={faUserCircle} className=\"d-md-none\" size=\"lg\" />\n          <span data-hj-suppress className=\"d-none d-md-inline\">\n            {username}\n          </span>\n        </Dropdown.Toggle>\n        <Dropdown.Menu className=\"dropdown-menu-right\">\n          {dashboardMenuItem}\n          <Dropdown.Item href={`${getConfig().ACCOUNT_PROFILE_URL}/u/${username}`}>\n            {intl.formatMessage(messages.profile)}\n          </Dropdown.Item>\n          <Dropdown.Item href={getConfig().ACCOUNT_SETTINGS_URL}>\n            {intl.formatMessage(messages.account)}\n          </Dropdown.Item>\n          { getConfig().ORDER_HISTORY_URL && (\n            <Dropdown.Item href={getConfig().ORDER_HISTORY_URL}>\n              {intl.formatMessage(messages.orderHistory)}\n            </Dropdown.Item>\n          )}\n          <Dropdown.Item href={getConfig().LOGOUT_URL}>\n            {intl.formatMessage(messages.signOut)}\n          </Dropdown.Item>\n        </Dropdown.Menu>\n      </Dropdown>\n    </>\n  );\n};\n\nAuthenticatedUserDropdown.propTypes = {\n  intl: intlShape.isRequired,\n  username: PropTypes.string.isRequired,\n};\n\nexport default injectIntl(AuthenticatedUserDropdown);\n"],"mappings":"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","ignoreList":[]}