carbon-react 118.5.1 → 118.6.0

package/esm/hooks/__internal__/useResizeObserver/useResizeObserver.js

@@ -1,24 +1,19 @@
 import { useRef, useLayoutEffect } from "react";
-export default function useResizeObserver(
-/** Reference to the resizable HTML element */
-ref,
-/** Callback meant to be executed on element resize */
-onResize,
-/** Flag to indicate whether hook should be disabled  */
+export default function useResizeObserver( /** Reference to the resizable HTML element */
+ref, /** Callback meant to be executed on element resize */
+onResize, /** Flag to indicate whether hook should be disabled  */
 disabled) {
   const observer = useRef();
   const onResizeRef = useRef(onResize);
   onResizeRef.current = onResize;
   useLayoutEffect(() => {
     const referenceRef = ref.current;
-
     if (!disabled && referenceRef) {
       observer.current = new ResizeObserver(() => {
-        onResizeRef === null || onResizeRef === void 0 ? void 0 : onResizeRef.current();
+        onResizeRef?.current();
       });
       observer.current.observe(referenceRef);
     }
-
     return () => {
       if (!disabled && referenceRef && observer.current) {
         observer.current.unobserve(referenceRef);

package/esm/hooks/__internal__/useScrollBlock/scroll-block-manager.js

@@ -1,21 +1,16 @@
 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, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
+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 _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 // TODO: This component can be refactored to remove redundant code
 // once we can confirm that all Sage products use version 105.0.0^
 let ScrollBlockManager = /*#__PURE__*/function () {
   function ScrollBlockManager() {
     _classCallCheck(this, ScrollBlockManager);
-
     _defineProperty(this, "components", void 0);
-
     _defineProperty(this, "originalValues", void 0);
-
     // Due to possibility of multiple carbon versions using it
     // it is necessary to maintain same structure in this global variable
     if (!window.__CARBON_INTERNALS_SCROLL_BLOCKERS) {
@@ -26,12 +21,10 @@ let ScrollBlockManager = /*#__PURE__*/function () {
         restoreValues: null
       };
     }
-
-    this.components = window.__CARBON_INTERNALS_SCROLL_BLOCKERS.components; // TODO: originalValues can be removed
-
+    this.components = window.__CARBON_INTERNALS_SCROLL_BLOCKERS.components;
+    // TODO: originalValues can be removed
     this.originalValues = window.__CARBON_INTERNALS_SCROLL_BLOCKERS.originalValues;
   }
-
   _createClass(ScrollBlockManager, [{
     key: "registerComponent",
     value: function registerComponent(id) {
@@ -53,18 +46,18 @@ let ScrollBlockManager = /*#__PURE__*/function () {
   }, {
     key: "getRestoreValuesCallback",
     value: function getRestoreValuesCallback() {
-      var _window$__CARBON_INTE;
-
-      return (_window$__CARBON_INTE = window.__CARBON_INTERNALS_SCROLL_BLOCKERS) === null || _window$__CARBON_INTE === void 0 ? void 0 : _window$__CARBON_INTE.restoreValues;
-    } // TODO: saveOriginalValues can be removed
+      return window.__CARBON_INTERNALS_SCROLL_BLOCKERS?.restoreValues;
+    }
 
+    // TODO: saveOriginalValues can be removed
   }, {
     key: "saveOriginalValues",
     value: function saveOriginalValues(values) {
       this.originalValues.length = 0;
       this.originalValues.push(...values);
-    } // TODO: getOriginalValues can be removed
+    }
 
+    // TODO: getOriginalValues can be removed
   }, {
     key: "getOriginalValues",
     value: function getOriginalValues() {
@@ -76,8 +69,6 @@ let ScrollBlockManager = /*#__PURE__*/function () {
       return Object.entries(this.components).length !== 0;
     }
   }]);
-
   return ScrollBlockManager;
 }();
-
 export default ScrollBlockManager;

package/esm/hooks/__internal__/useScrollBlock/useScrollBlock.js

@@ -1,10 +1,10 @@
 import { useRef, useCallback } from "react";
 import guid from "../../../__internal__/utils/helpers/guid";
-import ScrollBlockManager from "./scroll-block-manager"; // TODO: This component can be refactored to remove redundant code after
-// we can confirm that all Sage products use version 105.0.0^
+import ScrollBlockManager from "./scroll-block-manager";
 
+// TODO: This component can be refactored to remove redundant code after
+// we can confirm that all Sage products use version 105.0.0^
 const scrollBlockManager = new ScrollBlockManager();
-
 const getRules = () => {
   /* istanbul ignore next */
   const {
@@ -13,7 +13,8 @@ const getRules = () => {
   } = document || {};
   const scrollBarWidth = window.innerWidth - documentElement.clientWidth;
   const bodyPaddingRight = parseInt(window.getComputedStyle(body).getPropertyValue("padding-right")) || 0;
-  return [// TODO: First two entries of this array with the documentElement can be removed
+  return [
+  // TODO: First two entries of this array with the documentElement can be removed
   {
     element: documentElement,
     property: "position",
@@ -36,17 +37,17 @@ const getRules = () => {
     blockingValue: `${bodyPaddingRight + scrollBarWidth}px`
   }];
 };
-
 const useScrollBlock = () => {
   const {
     current: containerGuid
   } = useRef(guid());
   const originalValuesRef = useRef([]);
   const restoreValues = useCallback(() => {
-    getRules().forEach(({
-      element,
-      property
-    }, index) => {
+    getRules().forEach((_ref, index) => {
+      let {
+        element,
+        property
+      } = _ref;
       element.style[property] = originalValuesRef.current[index];
     });
   }, []);
@@ -54,25 +55,27 @@ const useScrollBlock = () => {
     const rules = getRules();
     const isBlocked = scrollBlockManager.isBlocked();
     scrollBlockManager.registerComponent(containerGuid);
-
     if (isBlocked) {
       return;
     }
-
-    const originalValues = rules.map(({
-      element,
-      property
-    }) => element.style[property]);
+    const originalValues = rules.map(_ref2 => {
+      let {
+        element,
+        property
+      } = _ref2;
+      return element.style[property];
+    });
     originalValuesRef.current = originalValues;
-    scrollBlockManager.saveRestoreValuesCallback(restoreValues); // TODO: saveOriginalValues can be removed
-
-    scrollBlockManager.saveOriginalValues(originalValues); // TODO: slice san be removed
-
-    rules.slice(-3).forEach(({
-      element,
-      property,
-      blockingValue
-    }) => {
+    scrollBlockManager.saveRestoreValuesCallback(restoreValues);
+    // TODO: saveOriginalValues can be removed
+    scrollBlockManager.saveOriginalValues(originalValues);
+    // TODO: slice san be removed
+    rules.slice(-3).forEach(_ref3 => {
+      let {
+        element,
+        property,
+        blockingValue
+      } = _ref3;
       element.style[property] = blockingValue;
     });
   }, [restoreValues, containerGuid]);
@@ -81,19 +84,19 @@ const useScrollBlock = () => {
     const isBlocked = scrollBlockManager.isBlocked();
     if (isBlocked) return;
     const restoreValuesCallback = scrollBlockManager.getRestoreValuesCallback();
-
     if (restoreValuesCallback) {
       restoreValuesCallback();
       scrollBlockManager.saveRestoreValuesCallback(null);
       return;
-    } // TODO: all of the code below can be removed from this block
-
+    }
 
+    // TODO: all of the code below can be removed from this block
     const originalValues = scrollBlockManager.getOriginalValues();
-    getRules().forEach(({
-      element,
-      property
-    }, index) => {
+    getRules().forEach((_ref4, index) => {
+      let {
+        element,
+        property
+      } = _ref4;
       element.style[property] = originalValues[index];
     });
     scrollBlockManager.saveOriginalValues([]);
@@ -103,5 +106,4 @@ const useScrollBlock = () => {
     allowScroll
   };
 };
-
 export default useScrollBlock;

package/esm/hooks/__internal__/useStableCallback/useStableCallback.js

@@ -1,13 +1,16 @@
-import { useRef, useCallback } from "react"; // This is a hook that returns a memoized callback that is guaranteed to be the same reference between renders.
+import { useRef, useCallback } from "react";
+
+// This is a hook that returns a memoized callback that is guaranteed to be the same reference between renders.
 // This is useful when a stable reference is required to prevent unnecessary re-renders.
 
 export function useStableCallback(callback) {
   const ref = useRef(callback);
   ref.current = callback;
-  const stableCallback = useCallback((...args) => {
-    var _ref$current;
-
-    return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.call(ref, ...args);
+  const stableCallback = useCallback(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    return ref.current?.(...args);
   }, []);
   return callback ? stableCallback : undefined;
 }

package/esm/hooks/__internal__/useThrottle/useThrottle.js

@@ -1,6 +1,8 @@
 import { useMemo, useEffect, useRef } from "react";
 import throttle from "lodash/throttle";
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
 const useThrottle = (callback, delay) => {
   const callbackRef = useRef(callback);
   useEffect(() => {
@@ -14,5 +16,4 @@ const useThrottle = (callback, delay) => {
   });
   return throttledCallback;
 };
-
 export default useThrottle;

package/esm/hooks/__internal__/useUniqueId/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: (id?: string | undefined, name?: string | undefined) => string[];
+declare const _default: (id?: string, name?: string) => string[];
 export default _default;

package/esm/hooks/useMediaQuery/useMediaQuery.js

@@ -4,11 +4,9 @@ export default function useMediaQuery(queryInput) {
   const [match, setMatch] = React.useState(() => false);
   React.useEffect(() => {
     const queryList = window.matchMedia(query);
-
     const updateMatch = () => {
       setMatch(queryList.matches);
     };
-
     updateMatch();
     queryList.addEventListener("change", updateMatch);
     return () => {

package/esm/locales/en-gb.js

@@ -1,7 +1,5 @@
 import { enGB as enGBDateLocale } from "./date-fns-locales";
-
 const isSingular = count => (typeof count === "string" ? parseInt(count) : count) === 1;
-
 const enGB = {
   locale: () => "en-GB",
   actions: {
@@ -46,26 +44,21 @@ const enGB = {
   },
   errors: {
     messages: {
-      formSummary:
-      /* istanbul ignore next */
+      formSummary: /* istanbul ignore next */
       (errors, warnings, type) => {
         const errorPlural = isSingular(errors) ? "error" : "errors";
         const warningPlural = isSingular(warnings) ? "warning" : "warnings";
         const isErrorPlural = isSingular(errors) && !warnings ? "is" : "are";
         const isWarningPlural = isSingular(warnings) ? "is" : "are";
-
         if (errors && warnings && type === "warning") {
           return ["and", `${warnings} ${warningPlural}`];
         }
-
         if (errors) {
           return [`There ${isErrorPlural}`, `${errors} ${errorPlural}`];
         }
-
         if (warnings) {
           return [`There ${isWarningPlural}`, `${warnings} ${warningPlural}`];
         }
-
         return null;
       }
     }
@@ -91,7 +84,8 @@ const enGB = {
   },
   pager: {
     show: () => "Show",
-    records: (count, showNumber = true) => {
+    records: function (count) {
+      let showNumber = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       const noun = isSingular(count) ? "item" : "items";
       return showNumber ? `${count} ${noun}` : noun;
     },

package/esm/locales/pl-pl.js

@@ -1,59 +1,42 @@
 import { pl as plDateLocale } from "./date-fns-locales";
-
 const isSingular = count => (typeof count === "string" ? parseInt(count) : count) === 1;
-
 export const PolishPlural = (singularNominativ, pluralNominativ, pluralGenitive, value) => {
   if (value === 1) {
     return singularNominativ;
   }
-
   if (value % 10 >= 2 && value % 10 <= 4 && (value % 100 < 10 || value % 100 >= 20)) {
     return pluralNominativ;
   }
-
   return pluralGenitive;
 };
-
 const translateColor = color => {
   switch (color.toLowerCase()) {
     case "white":
       return "biały";
-
     case "transparent":
       return "przezroczysty";
-
     case "black":
       return "czarny";
-
     case "blue":
       return "niebieski";
-
     case "pink":
       return "różowy";
-
     case "purple":
       return "fioletowy";
-
     case "goldenrod":
       return "złoty";
-
     case "orchid":
       return "ciemny róż";
-
     case "desert":
       return "pustynny";
-
     case "turquoise":
       return "turkusowy";
-
     case "mint":
       return "miętowy";
-
     default:
       return color;
   }
 };
-
 const plPL = {
   locale: () => "pl-PL",
   actions: {
@@ -98,24 +81,19 @@ const plPL = {
   },
   errors: {
     messages: {
-      formSummary:
-      /* istanbul ignore next */
+      formSummary: /* istanbul ignore next */
       (errors, warnings, type) => {
         const errorPlural = isSingular(errors) ? "błąd" : "błędy";
         const warningPlural = isSingular(warnings) ? "ostrzerzenie" : "ostrzerzenia";
-
         if (errors && warnings && type === "warnings") {
           return [`oraz`, `${warnings} ${warningPlural}`];
         }
-
         if (errors) {
           return ["Znaleziono", `${errors} ${errorPlural}`];
         }
-
         if (warnings) {
           return ["Znaleziono", `${warnings} ${warningPlural}`];
         }
-
         return null;
       }
     }
@@ -141,7 +119,8 @@ const plPL = {
   },
   pager: {
     show: () => "Pokaż",
-    records: (count, showNumber = true) => {
+    records: function (count) {
+      let showNumber = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       const noun = isSingular(count) ? "rzecz" : "rzeczy";
       return showNumber ? `${count} ${noun}` : noun;
     },

package/esm/style/design-tokens/carbon-scoped-tokens-provider/carbon-scoped-tokens-provider.component.js

@@ -1,22 +1,25 @@
 import styled from "styled-components";
 import { baseTheme } from "../../themes";
 import generateCssVariables from "../generate-css-variables.util";
-
 /**
  *
  * Converts theme properties to css variables form and set them locally for
  * given scope
  *
  */
+
 const CarbonScopedTokensProvider = styled.div`
   margin: 0;
   padding: 0;
   width: auto;
   display: inline;
 
-  ${({
-  theme
-}) => generateCssVariables(theme.compatibility, theme.roundedCornersOptOut)}
+  ${_ref => {
+  let {
+    theme
+  } = _ref;
+  return generateCssVariables(theme.compatibility, theme.roundedCornersOptOut);
+}}
 `;
 CarbonScopedTokensProvider.defaultProps = {
   theme: baseTheme

package/esm/style/design-tokens/debug-theme.util.js

@@ -1,6 +1,5 @@
 import tokens from "@sage/design-tokens/js/base/common";
 import mint from "../themes/mint";
-
 /**
  *
  * Generates debug theme by mapping theme properties, so that components or
@@ -10,32 +9,30 @@ import mint from "../themes/mint";
  * will be migrated to design tokens.
  *
  */
-const debugTheme = themeProperties => Object.fromEntries(Object.entries(themeProperties).map(([key, value]) => {
+
+const debugTheme = themeProperties => Object.fromEntries(Object.entries(themeProperties).map(_ref => {
+  let [key, value] = _ref;
   if (typeof value === "string" && (value.startsWith("#") || value.startsWith("rgb") || value.startsWith("rgba") || value.startsWith("hsl") || value.startsWith("hsla"))) {
     return [key, `rgba(255, 20, 147, .2)`];
   }
-
   if (typeof value === "string" && value.endsWith("px")) {
     return [key, "10px"];
   }
-
   if (typeof value === "string" && value.endsWith("%")) {
     return [key, "10%"];
   }
-
   if (typeof value === "number") {
     return [key, 10];
   }
-
   if (typeof value === "object") {
     return key === "compatibility" ? [key, value] : [key, debugTheme(value)];
   }
-
   return [key, ""];
 }));
-
-export default { ...debugTheme(mint),
-  compatibility: { ...tokens
+export default {
+  ...debugTheme(mint),
+  compatibility: {
+    ...tokens
   },
   name: "sage-debug"
 };

package/esm/style/design-tokens/generate-css-variables.util.d.ts

@@ -1,5 +1,4 @@
 import { ThemeObject } from "../themes/base";
-declare const _default: (theme: ThemeObject | Record<string, string>, roundedCornersOptOupt?: boolean | undefined) => string;
 /**
  *
  * Converts theme properties to the string in form of css variable definitions.
@@ -8,4 +7,5 @@ declare const _default: (theme: ThemeObject | Record<string, string>, roundedCor
  * form of CSS variables along with styled-components ThemeProvider.
  *
  */
+declare const _default: (theme: ThemeObject | Record<string, string>, roundedCornersOptOupt?: boolean) => string;
 export default _default;

package/esm/style/design-tokens/generate-css-variables.util.js

@@ -6,10 +6,11 @@
  * form of CSS variables along with styled-components ThemeProvider.
  *
  */
-export default ((theme, roundedCornersOptOupt) => Object.entries(theme).map(([key, value]) => {
+
+export default ((theme, roundedCornersOptOupt) => Object.entries(theme).map(_ref => {
+  let [key, value] = _ref;
   if (roundedCornersOptOupt && key.startsWith("borderRadius") && key !== "borderRadiusCircle") {
     return `--${key}: 0px;`;
   }
-
   return `--${key}: ${value};`;
 }).join("\r\n"));

package/esm/style/palette/index.js

@@ -1,15 +1,17 @@
 import tint from "../utils/tint";
 import shade from "../utils/shade";
-
-const cachedFunc = cb => (cache = {}) => weight => {
-  if (cache[weight]) {
-    return cache[weight];
-  }
-
-  const color = cb(weight);
-  cache[weight] = color;
-  return color;
+const cachedFunc = cb => function () {
+  let cache = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return weight => {
+    if (cache[weight]) {
+      return cache[weight];
+    }
+    const color = cb(weight);
+    cache[weight] = color;
+    return color;
+  };
 };
+
 /**
  * Takes a config object of base colors and, for each base, generates functions
  * to lighten and darken it.
@@ -26,18 +28,15 @@ const cachedFunc = cb => (cache = {}) => weight => {
  * where `n` is the degree of white (in case of `tint`) or
  * black (in case of `shade`) they wish to mix into the base color.
  */
-
-
 const generatePalette = config => {
   const baseNames = Object.keys(config);
   const funcs = baseNames.reduce((acc, baseName) => {
     const tintBy = tint(config[baseName]),
-          shadeBy = shade(config[baseName]);
+      shadeBy = shade(config[baseName]);
     acc[`${baseName}Tint`] = cachedFunc(tintBy)();
     acc[`${baseName}Shade`] = cachedFunc(shadeBy)();
     return acc;
   }, {});
   return funcs;
 };
-
 export default generatePalette;

package/esm/style/themes/aegean/aegean-theme.config.js

@@ -7,27 +7,23 @@ export default (palette => {
       tertiary: palette.productBlueShade(43),
       loadingBarBackground: palette.productBlueTint(70)
     },
-
     get compatibility() {
-      var _this$colors, _this$colors2, _this$colors3, _this$colors4, _this$colors5, _this$colors6, _this$colors7, _this$colors8, _this$colors9, _this$colors10, _this$colors11, _this$colors12, _this$colors13, _this$colors14;
-
       return {
-        colorsActionMajor150: this === null || this === void 0 ? void 0 : (_this$colors = this.colors) === null || _this$colors === void 0 ? void 0 : _this$colors.loadingBarBackground,
-        colorsActionMajor500: this === null || this === void 0 ? void 0 : (_this$colors2 = this.colors) === null || _this$colors2 === void 0 ? void 0 : _this$colors2.primary,
-        colorsActionMajor600: this === null || this === void 0 ? void 0 : (_this$colors3 = this.colors) === null || _this$colors3 === void 0 ? void 0 : _this$colors3.secondary,
-        colorsActionMajor700: this === null || this === void 0 ? void 0 : (_this$colors4 = this.colors) === null || _this$colors4 === void 0 ? void 0 : _this$colors4.tertiary,
-        colorsComponentsMenuAutumnStandard600: this === null || this === void 0 ? void 0 : (_this$colors5 = this.colors) === null || _this$colors5 === void 0 ? void 0 : _this$colors5.primary,
-        colorsComponentsMenuSpringChild600: this === null || this === void 0 ? void 0 : (_this$colors6 = this.colors) === null || _this$colors6 === void 0 ? void 0 : _this$colors6.primary,
-        colorsComponentsMenuAutumnChild600: this === null || this === void 0 ? void 0 : (_this$colors7 = this.colors) === null || _this$colors7 === void 0 ? void 0 : _this$colors7.primary,
-        colorsComponentsMenuSummerChild600: this === null || this === void 0 ? void 0 : (_this$colors8 = this.colors) === null || _this$colors8 === void 0 ? void 0 : _this$colors8.primary,
-        colorsComponentsMenuWinterChild600: this === null || this === void 0 ? void 0 : (_this$colors9 = this.colors) === null || _this$colors9 === void 0 ? void 0 : _this$colors9.primary,
-        colorsComponentsMenuSpringChildAlt600: this === null || this === void 0 ? void 0 : (_this$colors10 = this.colors) === null || _this$colors10 === void 0 ? void 0 : _this$colors10.primary,
-        colorsComponentsMenuAutumnChildAlt600: this === null || this === void 0 ? void 0 : (_this$colors11 = this.colors) === null || _this$colors11 === void 0 ? void 0 : _this$colors11.primary,
-        colorsComponentsMenuWinterChildAlt600: this === null || this === void 0 ? void 0 : (_this$colors12 = this.colors) === null || _this$colors12 === void 0 ? void 0 : _this$colors12.primary,
-        colorsComponentsMenuSummerChildAlt600: this === null || this === void 0 ? void 0 : (_this$colors13 = this.colors) === null || _this$colors13 === void 0 ? void 0 : _this$colors13.primary,
-        colorsBaseTheme: this === null || this === void 0 ? void 0 : (_this$colors14 = this.colors) === null || _this$colors14 === void 0 ? void 0 : _this$colors14.primary
+        colorsActionMajor150: this?.colors?.loadingBarBackground,
+        colorsActionMajor500: this?.colors?.primary,
+        colorsActionMajor600: this?.colors?.secondary,
+        colorsActionMajor700: this?.colors?.tertiary,
+        colorsComponentsMenuAutumnStandard600: this?.colors?.primary,
+        colorsComponentsMenuSpringChild600: this?.colors?.primary,
+        colorsComponentsMenuAutumnChild600: this?.colors?.primary,
+        colorsComponentsMenuSummerChild600: this?.colors?.primary,
+        colorsComponentsMenuWinterChild600: this?.colors?.primary,
+        colorsComponentsMenuSpringChildAlt600: this?.colors?.primary,
+        colorsComponentsMenuAutumnChildAlt600: this?.colors?.primary,
+        colorsComponentsMenuWinterChildAlt600: this?.colors?.primary,
+        colorsComponentsMenuSummerChildAlt600: this?.colors?.primary,
+        colorsBaseTheme: this?.colors?.primary
       };
     }
-
   };
 });

package/esm/style/themes/base/base-theme.config.js

@@ -40,22 +40,19 @@ export default (palette => {
       notification: 7000,
       aboveAll: 9999
     },
-
     get compatibility() {
-      var _this$colors, _this$colors$destruct;
-
-      return { ...tokens,
+      return {
+        ...tokens,
         colorsActionMajor150: this.colors.loadingBarBackground,
         colorsActionMajor500: this.colors.primary,
         colorsActionMajor600: this.colors.secondary,
         colorsActionDisabled500: this.disabled.background,
         colorsSemanticFocus500: this.colors.focus,
         colorsSemanticNegative500: this.colors.error,
-        colorsSemanticNegative600: this === null || this === void 0 ? void 0 : (_this$colors = this.colors) === null || _this$colors === void 0 ? void 0 : (_this$colors$destruct = _this$colors.destructive) === null || _this$colors$destruct === void 0 ? void 0 : _this$colors$destruct.hover,
+        colorsSemanticNegative600: this?.colors?.destructive?.hover,
         colorsSemanticCaution500: this.colors.warning,
         colorsSemanticInfo500: this.colors.info
       };
     }
-
   };
 });