luna-one 3.1.593 → 3.1.595

package/dist/luna/components/MegaMenu/menu-generators/TertiaryMenu.js

@@ -7,13 +7,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TertiaryMenu = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _formatID = _interopRequireDefault(require("../../../utils/formatID"));
-var _lodash = require("lodash");
 var _terraOne = require("terra-one");
-var _NavBar = require("../../../other-organisms/NavBar/NavBar");
+var _NavBar = require("../../NavBar/NavBar");
 var TertiaryMenu = function TertiaryMenu(props) {
   var links = props.links,
     hasFeatures = props.hasFeatures,
@@ -43,7 +41,6 @@ var TertiaryMenu = function TertiaryMenu(props) {
   };
   var generateLinks = function generateLinks() {
     return links === null || links === void 0 ? void 0 : links.map(function (link, index) {
-      var _React$createElement;
       return /*#__PURE__*/_react["default"].createElement("div", {
         key: (link === null || link === void 0 ? void 0 : link.text) + " " + index,
         onMouseOver: function onMouseOver() {
@@ -57,15 +54,20 @@ var TertiaryMenu = function TertiaryMenu(props) {
         },
         id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-tertiary-title-text")),
         className: "ter-right-section__clip ".concat(isOpen ? "ter-right-section__clip--is-open" : "")
-      }, /*#__PURE__*/_react["default"].createElement(_terraOne.LunaLink, (_React$createElement = {
+      }, /*#__PURE__*/_react["default"].createElement(_terraOne.LunaLink, {
         Link: Link,
-        id: (0, _lodash.uniqueId)("id-"),
         tabIndex: mouse ? "" : "0",
-        depth: 4
-      }, (0, _defineProperty2["default"])(_React$createElement, "id", (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-right-section-link"))), (0, _defineProperty2["default"])(_React$createElement, "to", link === null || link === void 0 ? void 0 : link.url), (0, _defineProperty2["default"])(_React$createElement, "href", link === null || link === void 0 ? void 0 : link.href), (0, _defineProperty2["default"])(_React$createElement, "className", "ter-right-section__link ".concat(open === (link === null || link === void 0 ? void 0 : link.contentfulId) ? "ter-right-section__link--is-open" : "", " ").concat(mouse ? "" : "tabFocus", "\n          ")), (0, _defineProperty2["default"])(_React$createElement, "onClick", function onClick() {
-        return mouseLeave("click");
-      }), (0, _defineProperty2["default"])(_React$createElement, "target", typeof (link === null || link === void 0 ? void 0 : link.external) === 'boolean' ? link !== null && link !== void 0 && link.external ? "_blank" : "_self" : null), _React$createElement), /*#__PURE__*/_react["default"].createElement("p", {
-        id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-item-link-text")),
+        depth: 4,
+        id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-right-section-link-").concat((0, _react.useId)())),
+        to: link === null || link === void 0 ? void 0 : link.url,
+        href: link === null || link === void 0 ? void 0 : link.href,
+        className: "ter-right-section__link ".concat(open === (link === null || link === void 0 ? void 0 : link.contentfulId) ? "ter-right-section__link--is-open" : "", " ").concat(mouse ? "" : "tabFocus", "\n          "),
+        onClick: function onClick() {
+          return mouseLeave("click");
+        },
+        target: typeof (link === null || link === void 0 ? void 0 : link.external) === 'boolean' ? link !== null && link !== void 0 && link.external ? "_blank" : "_self" : null
+      }, /*#__PURE__*/_react["default"].createElement("p", {
+        id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-item-link-text-").concat((0, _react.useId)())),
         className: "ter-right-section__link--underline ".concat(open === link.contentfulId ? "ter-right-section__link--underline--is-open" : "")
       }, link === null || link === void 0 ? void 0 : link.text)));
     });

package/dist/luna/components/MegaMenu/menu-generators/UncollapsedLinks.js

@@ -9,9 +9,8 @@ exports.UncollapsedLinks = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _formatID = _interopRequireDefault(require("../../../utils/formatID"));
-var _lodash = require("lodash");
 var _terraOne = require("terra-one");
-var _NavBar = require("../../../other-organisms/NavBar/NavBar");
+var _NavBar = require("../../NavBar/NavBar");
 var UncollapsedLinks = function UncollapsedLinks(props) {
   var link = props.link,
     menuProps = props.menuProps;
@@ -31,7 +30,7 @@ var UncollapsedLinks = function UncollapsedLinks(props) {
   return /*#__PURE__*/_react["default"].createElement(_react.Fragment, {
     key: link === null || link === void 0 ? void 0 : link.contentfulId
   }, (link === null || link === void 0 ? void 0 : link.url) && /*#__PURE__*/_react["default"].createElement("div", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     onMouseOver: function onMouseOver() {
       return mouseOverFeature(link === null || link === void 0 ? void 0 : link.contentfulId);
     },
@@ -42,7 +41,7 @@ var UncollapsedLinks = function UncollapsedLinks(props) {
   }, /*#__PURE__*/_react["default"].createElement(_terraOne.LunaLink, {
     to: link === null || link === void 0 ? void 0 : link.url,
     onClick: mouseLeave,
-    id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-title-link")),
+    id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-title-link-").concat((0, _react.useId)())),
     Link: Link,
     tabIndex: mouse ? "" : "0",
     className: "ter-mega-menu__left-title ter-mega-menu__left-title".concat(link !== null && link !== void 0 && link.imageUrl ? "--image" : "--link", " ").concat(link !== null && link !== void 0 && link.imageUrl ? "ter-mega-menu__left-title--image-content" : "", "  ").concat(mouse ? "" : "tabFocus"),
@@ -54,7 +53,7 @@ var UncollapsedLinks = function UncollapsedLinks(props) {
     "aria-label": link === null || link === void 0 ? void 0 : link.url,
     className: mouse ? "ter-mega-menu__image" : "ter-mega-menu__image tabFocus"
   }), /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-title-link-text")),
+    id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.text, "-mega-menu-title-link-text-").concat((0, _react.useId)())),
     className: "ter-mega-menu__left-title".concat(classTag, " ").concat(open === (link === null || link === void 0 ? void 0 : link.contentfulId) ? "ter-mega-menu__left-title".concat(classTag, "--is-hovered") : "")
   }, link !== null && link !== void 0 && link.imageUrl && !collapsed ? link === null || link === void 0 ? void 0 : link.description : link === null || link === void 0 ? void 0 : link.text))));
 };

package/dist/luna/components/MobileLogin/MobileLogin.js

@@ -13,7 +13,6 @@ var _downArrow = _interopRequireDefault(require("../../images/downArrow.svg"));
 var _upArrow = _interopRequireDefault(require("../../images/up-arrow.svg"));
 var _userProfile = _interopRequireDefault(require("../../images/user-profile.svg"));
 var _useMouse2 = _interopRequireDefault(require("../../utils/hooks/useMouse"));
-var _lodash = require("lodash");
 //TODO: This is a duplicate of <Login /> make Mobile login component when there are new designs
 
 var MobileLogin = function MobileLogin(props) {
@@ -63,7 +62,7 @@ var MobileLogin = function MobileLogin(props) {
         if (item.machineName === "sign-out") {
           return /*#__PURE__*/_react["default"].createElement("a", {
             tabIndex: mouse ? "" : "0",
-            id: (0, _lodash.uniqueId)("id-"),
+            id: (0, _react.useId)(),
             key: index,
             className: mouse ? "sketchup-login__list-item" : "sketchup-login__list-item tagFocus",
             onClick: function onClick() {
@@ -76,7 +75,7 @@ var MobileLogin = function MobileLogin(props) {
         } else {
           return /*#__PURE__*/_react["default"].createElement("a", {
             tabIndex: mouse ? "" : "0",
-            id: (0, _lodash.uniqueId)("id-"),
+            id: (0, _react.useId)(),
             key: index,
             className: mouse ? "sketchup-login__list-item" : "sketchup-login__list-item tagFocus",
             href: item.url
@@ -139,7 +138,7 @@ var MobileLogin = function MobileLogin(props) {
     style: {
       display: isHidden ? "none" : ""
     },
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, (login === null || login === void 0 ? void 0 : (_login$content3 = login.content) === null || _login$content3 === void 0 ? void 0 : _login$content3.text) && !login.loggedIn && /*#__PURE__*/_react["default"].createElement("a", {
     onClick: function onClick() {
       return login.handleLogin();

package/dist/luna/components/MobileMegaMenu/MobileMegaMenu.js

@@ -1,17 +1,17 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 require("./MobileMegaMenu.scss");
 var _generateLinks = require("../../utils/generateLinks");
 var _rightCaretLightGray = _interopRequireDefault(require("../../images/right-caret-light-gray.svg"));
 var _formatID = _interopRequireDefault(require("../../utils/formatID"));
-var _lodash = require("lodash");
 var _useOpenCategory2 = _interopRequireDefault(require("./useOpenCategory"));
 var _useMouseSet2 = _interopRequireDefault(require("./useMouseSet"));
 var _useFocus5 = require("../../utils/hooks/useFocus");
@@ -118,9 +118,9 @@ var MobileMegaMenu = function MobileMegaMenu(props) {
   };
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("section", {
     className: getParentStyle(),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _formatID["default"])("".concat(megaMenuContent.contentfulId, "-mega-menu-name")),
+    id: (0, _formatID["default"])("".concat(megaMenuContent.contentfulId, "-mega-menu-name-").concat((0, _react.useId)())),
     className: "ter-mobile-mega-menu__name ".concat(isOpen ? "ter-mobile-mega-menu__name--open" : ""),
     tabIndex: mouseSet ? "" : "0",
     onClick: function onClick() {
@@ -140,9 +140,9 @@ var MobileMegaMenu = function MobileMegaMenu(props) {
     className: "ter-mobile-mega-menu__category-container ".concat(isOpen ? "ter-mobile-mega-menu__category-container--is-open" : "")
   }, generateSubmenu(), featuredLinks && (featuredLinks === null || featuredLinks === void 0 ? void 0 : featuredLinks.length) > 0 && generateFeaturedMenu(), megaMenuContent.bottomLink && (0, _generateLinks.generateSingleLink)(megaMenuContent === null || megaMenuContent === void 0 ? void 0 : megaMenuContent.bottomLink, "ter-mobile-mega-menu__bottom-link", closeDropDown, Link))), /*#__PURE__*/_react["default"].createElement("section", {
     className: "ter-mobile-mega-menu ".concat(invisible ? "ter-mobile-mega-menu--inactive" : ""),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _formatID["default"])("".concat(megaMenuContent === null || megaMenuContent === void 0 ? void 0 : megaMenuContent.contentfulId, "-mega-menu-name")),
+    id: (0, _formatID["default"])("".concat(megaMenuContent === null || megaMenuContent === void 0 ? void 0 : megaMenuContent.contentfulId, "-mega-menu-name-").concat((0, _react.useId)())),
     className: "ter-mobile-mega-menu__name ".concat(currentOpenMenu || !hamburgerIsOpen ? "" : "ter-mobile-mega-menu__name--open-parent"),
     "data-depth": 1,
     tabIndex: mouseSet ? "" : "0",

package/dist/luna/components/MobileMegaMenu/MobileMegaMenuCategory.js

@@ -1,15 +1,15 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _useMouse2 = _interopRequireDefault(require("../../utils/hooks/useMouse"));
 var _generateLinks = require("../../utils/generateLinks");
-var _lodash = require("lodash");
 var _formatID = _interopRequireDefault(require("../../utils/formatID"));
 var _downCaretDarkBlue = _interopRequireDefault(require("../../images/down-caret-dark-blue.svg"));
 var _rightCaretLightGray = _interopRequireDefault(require("../../images/right-caret-light-gray.svg"));
@@ -58,7 +58,7 @@ var MobileMegaMenuCategory = function MobileMegaMenuCategory(_ref) {
         });
       } else {
         return /*#__PURE__*/_react["default"].createElement("li", {
-          id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.contentfulId, "-navbar-link-parent")),
+          id: (0, _formatID["default"])("".concat(link === null || link === void 0 ? void 0 : link.contentfulId, "-navbar-link-parent-").concat((0, _react.useId)())),
           className: "ter-mobile-mega-menu-category__name",
           key: "".concat(link === null || link === void 0 ? void 0 : link.contentfulId, "-").concat(categoryId, "-").concat(index),
           onClick: closeDropDown
@@ -96,10 +96,10 @@ var MobileMegaMenuCategory = function MobileMegaMenuCategory(_ref) {
   };
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("section", {
     className: getParentStyle(),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
     tabIndex: mouse ? "" : "0",
-    id: (0, _formatID["default"])("".concat(name, "-mobile-mega-menu-category-name")),
+    id: (0, _formatID["default"])("".concat(name, "-mobile-mega-menu-category-name-").concat((0, _react.useId)())),
     onClick: function onClick() {
       return toggleCategory(categoryId);
     },
@@ -112,7 +112,7 @@ var MobileMegaMenuCategory = function MobileMegaMenuCategory(_ref) {
     ref: uncollapsedMenu,
     "data-depth": 2
   }, name, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     className: "ter-mobile-mega-menu__caret ".concat(isOpen && !openSubCategory ? "ter-mobile-mega-menu__caret--up" : "ter-mobile-mega-menu__caret--down"),
     src: _rightCaretLightGray["default"],
     alt: "caret icon"
@@ -120,10 +120,10 @@ var MobileMegaMenuCategory = function MobileMegaMenuCategory(_ref) {
     className: "ter-mobile-mega-menu-category__submenu ".concat(isOpen && !openSubCategory ? "ter-mobile-mega-menu-category__submenu--is-open" : "")
   }, generateSubMenu())), /*#__PURE__*/_react["default"].createElement("section", {
     className: "ter-mobile-mega-menu-category ".concat(parentOpen ? "" : "ter-mobile-mega-menu-category--hidden"),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
     tabIndex: mouse ? "" : "0",
-    id: (0, _formatID["default"])("".concat(name, "-mobile-mega-menu-category-name")),
+    id: (0, _formatID["default"])("".concat(name, "-mobile-mega-menu-category-name-").concat((0, _react.useId)())),
     onClick: function onClick() {
       return handleClick(categoryId);
     },
@@ -136,7 +136,7 @@ var MobileMegaMenuCategory = function MobileMegaMenuCategory(_ref) {
     "aria-expanded": !(isOpen && !openSubCategory),
     ref: collapsedMenu
   }, name, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     className: "ter-mobile-mega-menu-category__caret",
     src: _downCaretDarkBlue["default"],
     alt: "caret icon"

package/dist/luna/components/MobileMegaMenu/MobileMegaMenuPartialCategory.js

@@ -1,14 +1,14 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _useMouse2 = _interopRequireDefault(require("../../utils/hooks/useMouse"));
 var _generateLinks = require("../../utils/generateLinks");
-var _lodash = require("lodash");
 var MobileMegaMenuPartialCategory = function MobileMegaMenuPartialCategory(_ref) {
   var name = _ref.name,
     link = _ref.link,
@@ -24,7 +24,7 @@ var MobileMegaMenuPartialCategory = function MobileMegaMenuPartialCategory(_ref)
   return /*#__PURE__*/_react["default"].createElement("section", {
     className: "ter-mobile-mega-menu-category ".concat(isOpen ? "" : "ter-mobile-mega-menu-category--hidden")
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     className: "ter-mobile-mega-menu-category__name--single"
   }, (0, _generateLinks.generateMobileLink)(linkObj, "ter-mobile-mega-menu-category__single-link", closeDropDown, mouse, Link, 2)));
 };

package/dist/luna/components/MobileMegaMenu/MobileMegaMenuSubCategory.js

@@ -1,16 +1,15 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireDefault(require("react"));
-var _lodash = require("lodash");
+var _react = _interopRequireWildcard(require("react"));
 var _downCaretDarkBlue = _interopRequireDefault(require("../../images/down-caret-dark-blue.svg"));
 var _rightCaretLightGray = _interopRequireDefault(require("../../images/right-caret-light-gray.svg"));
-var _formatID = _interopRequireDefault(require("../../utils/formatID"));
 var _generateLinks = _interopRequireDefault(require("../../utils/generateLinks"));
 var _useMouse2 = _interopRequireDefault(require("../../utils/hooks/useMouse"));
 var _useFocus5 = require("../../utils/hooks/useFocus");
@@ -57,9 +56,9 @@ var MobileMegaMenuSubCategory = function MobileMegaMenuSubCategory(_ref) {
   };
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("section", {
     className: "ter-mobile-mega-menu--reveal--from-right ".concat(isOpen ? "ter-mobile-mega-menu--reveal--from-right--visible" : ""),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     tabIndex: mouse ? "" : "0",
     onClick: function onClick() {
       return toggleCategory(categoryId);
@@ -72,7 +71,7 @@ var MobileMegaMenuSubCategory = function MobileMegaMenuSubCategory(_ref) {
     "aria-expanded": isOpen,
     ref: uncollapsedMenu
   }, name, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     className: "ter-mobile-mega-menu__caret ".concat(isOpen ? "ter-mobile-mega-menu__caret--up" : "ter-mobile-mega-menu__caret--down"),
     src: _rightCaretLightGray["default"],
     alt: "caret icon"
@@ -80,9 +79,9 @@ var MobileMegaMenuSubCategory = function MobileMegaMenuSubCategory(_ref) {
     className: "ter-mobile-mega-menu-category__submenu ".concat(isOpen ? "ter-mobile-mega-menu-category__submenu--is-open" : "")
   }, generateTertiaryMenu())), /*#__PURE__*/_react["default"].createElement("section", {
     className: "ter-mobile-mega-menu-category ".concat(parentOpen ? "" : "ter-mobile-mega-menu-category--hidden"),
-    id: (0, _lodash.uniqueId)("id-")
+    id: (0, _react.useId)()
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     tabIndex: mouse ? "" : "0",
     onClick: function onClick() {
       return handleClick(categoryId);
@@ -96,7 +95,7 @@ var MobileMegaMenuSubCategory = function MobileMegaMenuSubCategory(_ref) {
     ref: collapsedMenu,
     "data-depth": 3
   }, name, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     className: "ter-mobile-mega-menu-category__caret",
     src: _downCaretDarkBlue["default"],
     alt: "caret icon"

package/dist/luna/components/MobileNav/MobileNav.js

@@ -8,19 +8,18 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
-var _NavBar = require("../../other-organisms/NavBar/NavBar");
+var _NavBar = require("../NavBar/NavBar");
 require("./MobileNav.scss");
 var _logoIcon = _interopRequireDefault(require("../../images/logo-icon.svg"));
 var _user = _interopRequireDefault(require("../../images/user.svg"));
 var _downCaretDarkBlue = _interopRequireDefault(require("../../images/down-caret-dark-blue.svg"));
-var _lodash = require("lodash");
 var _useNavigator2 = _interopRequireDefault(require("../../utils/hooks/useNavigator"));
 var _terraOne = require("terra-one");
 var _MobileMegaMenu = _interopRequireDefault(require("../MobileMegaMenu/MobileMegaMenu"));
 var _MobileMenu = _interopRequireDefault(require("../MobileMenu/MobileMenu"));
 var _MobileDashboardMenu = _interopRequireDefault(require("../MobileDashboardMenu/MobileDashboardMenu"));
 var _TopMobileNav = _interopRequireDefault(require("./TopMobileNav"));
-var _LanguageSelector = _interopRequireDefault(require("../../other-organisms/LanguageSelector/LanguageSelector"));
+var _LanguageSelector = _interopRequireDefault(require("../LanguageSelector/LanguageSelector"));
 var MobileNav = function MobileNav(props) {
   var navOptions = props.navOptions,
     rightLinks = props.rightLinks,
@@ -215,7 +214,7 @@ var MobileNav = function MobileNav(props) {
   })), /*#__PURE__*/_react["default"].createElement("div", {
     className: "ter-mobile-nav__flyout-logo"
   }, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("id-"),
+    id: (0, _react.useId)(),
     src: _logoIcon["default"],
     alt: "open flyout"
   }))), languageSelectorData && languageSelectorDeployed && /*#__PURE__*/_react["default"].createElement(_LanguageSelector["default"], {

package/dist/luna/{other-organisms → components}/NavBar/NavMiniMenu.js

@@ -11,7 +11,6 @@ var _react = _interopRequireWildcard(require("react"));
 var _crossMediumBlue = _interopRequireDefault(require("../../images/cross-medium-blue.svg"));
 var _crossMediumWhite = _interopRequireDefault(require("../../images/cross-medium-white.svg"));
 var _formatID = _interopRequireDefault(require("../../utils/formatID"));
-var _lodash = require("lodash");
 var _NavBar = require("./NavBar");
 var _useIsChrome2 = _interopRequireDefault(require("../../utils/hooks/useIsChrome"));
 var _terraOne = require("terra-one");
@@ -92,7 +91,7 @@ var NavMiniMenu = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     });
   };
   return /*#__PURE__*/_react["default"].createElement("div", {
-    id: (0, _lodash.uniqueId)("mini-menu-"),
+    id: (0, _react.useId)(),
     className: "".concat(mouse ? "ter-nav-mini-menu" : "ter-nav-mini-menu tabFocus", " ").concat(isChrome ? "ter-nav-mini-menu--chrome-browser" : "", " ").concat(displayIcons ? "ter-nav-mini-menu--with-icons" : ""),
     onKeyDown: function onKeyDown(e) {
       return mouseOverWithKeys(e, contentfulId);
@@ -105,11 +104,11 @@ var NavMiniMenu = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     "aria-expanded": isOpen,
     "aria-label": "".concat(navText, " menu")
   }, /*#__PURE__*/_react["default"].createElement("p", {
-    id: (0, _formatID["default"])("".concat(navText, "-ter-nav-mini-menu-text")),
+    id: (0, _formatID["default"])("".concat(navText, "-ter-nav-mini-menu-text-").concat((0, _react.useId)())),
     className: "ter-nav-mini-menu__text ".concat(isOpen && " ter-nav-mini-menu__text--is-open", "\n        ").concat(active ? "active" : "", "\n        ").concat(displayIcons ? "ter-nav-mini-menu__text--with-icons" : "", "\n        ").concat(theme ? "ter-nav-mini-menu__text--".concat(theme) : "", "\n        "),
     "data-depth": 1
   }, navText, /*#__PURE__*/_react["default"].createElement("img", {
-    id: (0, _lodash.uniqueId)("cross-icon-"),
+    id: (0, _react.useId)(),
     src: theme === "blue" ? _crossMediumWhite["default"] : _crossMediumBlue["default"],
     alt: "cross icon",
     "aria-label": isOpen ? "Opened" : "Closed",