@royaloperahouse/harmonic 0.5.1-a → 0.6.0-a

package/dist/harmonic.esm.js

@@ -394,7 +394,7 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
     size = _ref2.size,
     em = _ref2.em,
     _ref2$color = _ref2.color,
-    color = _ref2$color === void 0 ? 'primary' : _ref2$color,
+    color = _ref2$color === void 0 ? 'inherit' : _ref2$color,
     serif = _ref2.serif,
     Tag = _ref2.hierarchy,
     className = _ref2.className;
@@ -414,7 +414,7 @@ var HarmonicSubtitle = function HarmonicSubtitle(_ref3) {
   var children = _ref3.children,
     size = _ref3.size,
     _ref3$color = _ref3.color,
-    color = _ref3$color === void 0 ? 'primary' : _ref3$color,
+    color = _ref3$color === void 0 ? 'inherit' : _ref3$color,
     className = _ref3.className;
   var classNames = createClassNames('subtitle', {
     size: size,
@@ -431,7 +431,7 @@ var BodyCopyHarmonic = function BodyCopyHarmonic(_ref4) {
     _ref4$size = _ref4.size,
     size = _ref4$size === void 0 ? 'medium' : _ref4$size,
     _ref4$color = _ref4.color,
-    color = _ref4$color === void 0 ? 'primary' : _ref4$color,
+    color = _ref4$color === void 0 ? 'inherit' : _ref4$color,
     className = _ref4.className,
     props = _objectWithoutPropertiesLoose(_ref4, _excluded);
   var classNames = createClassNames('bodycopy', {
@@ -448,7 +448,7 @@ var HarmonicOverline = function HarmonicOverline(_ref5) {
   var children = _ref5.children,
     size = _ref5.size,
     _ref5$color = _ref5.color,
-    color = _ref5$color === void 0 ? 'primary' : _ref5$color,
+    color = _ref5$color === void 0 ? 'inherit' : _ref5$color,
     className = _ref5.className,
     props = _objectWithoutPropertiesLoose(_ref5, _excluded2);
   var classNames = createClassNames('overline', {
@@ -464,7 +464,7 @@ var HarmonicOverline = function HarmonicOverline(_ref5) {
 var ButtonText = function ButtonText(_ref6) {
   var children = _ref6.children,
     _ref6$color = _ref6.color,
-    color = _ref6$color === void 0 ? 'primary' : _ref6$color,
+    color = _ref6$color === void 0 ? 'inherit' : _ref6$color,
     className = _ref6.className;
   var classNames = createClassNames('buttontext', {
     color: color,
@@ -477,7 +477,7 @@ var ButtonText = function ButtonText(_ref6) {
 var Caption = function Caption(_ref7) {
   var children = _ref7.children,
     _ref7$color = _ref7.color,
-    color = _ref7$color === void 0 ? 'primary' : _ref7$color,
+    color = _ref7$color === void 0 ? 'inherit' : _ref7$color,
     className = _ref7.className;
   var classNames = createClassNames('captiontext', {
     color: color,
@@ -490,7 +490,7 @@ var Caption = function Caption(_ref7) {
 var NavigationText = function NavigationText(_ref8) {
   var children = _ref8.children,
     _ref8$color = _ref8.color,
-    color = _ref8$color === void 0 ? 'primary' : _ref8$color,
+    color = _ref8$color === void 0 ? 'inherit' : _ref8$color,
     className = _ref8.className;
   var classNames = createClassNames('navigationtext', {
     color: color,
@@ -5163,7 +5163,7 @@ var MobileMenuContainer = /*#__PURE__*/styled(Grid)(_templateObject7$3 || (_temp
   return showSearch ? '110px' : '12px';
 });
 var LogoContainer = /*#__PURE__*/styled.a(_templateObject8$2 || (_templateObject8$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  &&& .logoImg {\n    height: 96px;\n    width: 80px;\n  }\n\n  span > svg path,\n  span > svg g path {\n    fill: var(--color-primary-black);\n  }\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobileAndTablet);
-var LogoContainerMobile = /*#__PURE__*/styled.div(_templateObject9$1 || (_templateObject9$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 16px;\n\n    span > svg path {\n      fill: var(--color-primary-black);\n    }\n  }\n"])), devices.mobileAndTablet);
+var LogoContainerMobile = /*#__PURE__*/styled.a(_templateObject9$1 || (_templateObject9$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 16px;\n\n    span > svg path {\n      fill: var(--color-primary-black);\n    }\n  }\n"])), devices.mobileAndTablet);
 var MenuContainer = /*#__PURE__*/styled.div(_templateObject0$1 || (_templateObject0$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  height: 140px;\n  justify-content: space-evenly;\n  width: 100%;\n\n  @media ", " {\n  flex-direction: row;\n  justify-content: space-between;\n  height: 60px;\n  width 100%;\n  }\n"])), devices.mobileAndTablet);
 var NavWrapper = /*#__PURE__*/styled.div(_templateObject1 || (_templateObject1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  gap: 32px;\n\n  @media ", " {\n    flex-direction: row;\n    height: 60px;\n    justify-content: flex-end;\n  }\n"])), devices.mobileAndTablet);
 var NavContainer = /*#__PURE__*/styled.div(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: flex-end;\n  flex-gap: 32px;\n  width: fit-content;\n\n  @media ", " {\n    flex-gap: 0;\n    height: auto;\n    width: fit-content;\n    margin-left: 20px;\n    margin-right: 20px;\n  }\n"])), devices.mobileAndTablet);
@@ -5869,6 +5869,12 @@ var Navigation = function Navigation(_ref) {
     fullScreenHeight = _useState4[0],
     setFullScreenHeight = _useState4[1];
   var items = menuData.items;
+  var logoLinkProps = {
+    title: title,
+    href: logoLink,
+    rel: 'noopener noreferrer',
+    'data-roh': dataRoh
+  };
   useEffect(function () {
     var _document, _document2;
     var body = (_document = document) == null ? void 0 : _document.body;
@@ -5921,16 +5927,11 @@ var Navigation = function Navigation(_ref) {
     columnSpanDesktop: 18,
     columnStartDevice: 1,
     columnSpanDevice: 14
-  }, /*#__PURE__*/React__default.createElement(MenuContainer, null, /*#__PURE__*/React__default.createElement(LogoContainer, {
-    "data-roh": dataRoh,
-    rel: "noopener noreferrer",
-    href: logoLink,
-    title: title
-  }, /*#__PURE__*/React__default.createElement(Icon, {
+  }, /*#__PURE__*/React__default.createElement(MenuContainer, null, /*#__PURE__*/React__default.createElement(LogoContainer, Object.assign({}, logoLinkProps), /*#__PURE__*/React__default.createElement(Icon, {
     iconName: crest ? 'NavLogoWithCrest' : 'NavLogoNoCrest',
     "data-testid": crest ? 'NavLogoWithCrest' : 'NavLogoNoCrest',
     "aria-hidden": "true"
-  })), /*#__PURE__*/React__default.createElement(LogoContainerMobile, null, /*#__PURE__*/React__default.createElement(Icon, {
+  })), /*#__PURE__*/React__default.createElement(LogoContainerMobile, Object.assign({}, logoLinkProps), /*#__PURE__*/React__default.createElement(Icon, {
     iconName: "NavLogoMobile"
   })), /*#__PURE__*/React__default.createElement(NavWrapper, null, /*#__PURE__*/React__default.createElement(NavContainer, null, /*#__PURE__*/React__default.createElement(Tabs, {
     items: items,