carbon-react 104.28.0 → 104.31.0

package/lib/__internal__/sticky-footer/sticky-footer.style.js

@@ -7,10 +7,6 @@ exports.default = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _base = _interopRequireDefault(require("../../style/themes/base"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -20,24 +16,20 @@ const FormButtonAnimation = (0, _styledComponents.keyframes)`
   100% { transform: translateY(0px); }
 `;
 const StyledStickyFooter = _styledComponents.default.div`
+  padding: var(--spacing200) var(--spacing400);
+  box-sizing: border-box;
+  width: 100%;
   ${({
-  sticky,
-  theme
-}) => (0, _styledComponents.css)`
-    ${sticky && (0, _styledComponents.css)`
+  sticky
+}) => sticky && (0, _styledComponents.css)`
       animation: ${FormButtonAnimation} 0.25s ease;
       position: sticky;
-      width: 100%;
       bottom: 0;
       left: 0;
-      background-color: ${theme.colors.white};
-      box-shadow: 0 -4px 12px rgba(153, 173, 182, 0.05);
+      background-color: var(--colorsComponentsNavigationYang100);
+      box-shadow: var(--boxShadow150);
       z-index: 1000;
     `}
-  `}
 `;
-StyledStickyFooter.defaultProps = {
-  theme: _base.default
-};
 var _default = StyledStickyFooter;
 exports.default = _default;

package/lib/components/anchor-navigation/anchor-navigation-item/anchor-navigation-item.style.js

@@ -41,7 +41,7 @@ const StyledNavigationItem = _styledComponents.default.li`
     ${({
   isSelected
 }) => isSelected && (0, _styledComponents.css)`
-        background-color: var(--colorsActionMinorYang100);
+        background-color: var(--colorsActionMajorYang100);
         border-left-color: var(--colorsActionMajor500);
       `}
   }

package/lib/components/definition-list/definition-list.style.js

@@ -9,12 +9,12 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
 var _styledSystem = require("styled-system");
 
-var _themes = require("../../style/themes");
-
 var _button = _interopRequireDefault(require("../button/button.style"));
 
 var _link = require("../link/link.style");
 
+var _themes = require("../../style/themes");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -44,6 +44,9 @@ const StyledDl = _styledComponents.default.dl`
   background-color: transparent;
 `;
 exports.StyledDl = StyledDl;
+StyledDl.defaultProps = {
+  theme: _themes.baseTheme
+};
 const StyledDtDiv = _styledComponents.default.div`
   ${_styledSystem.space}
   ${({
@@ -53,6 +56,9 @@ const StyledDtDiv = _styledComponents.default.div`
   `}
 `;
 exports.StyledDtDiv = StyledDtDiv;
+StyledDtDiv.defaultProps = {
+  theme: _themes.baseTheme
+};
 const StyledDdDiv = _styledComponents.default.div`
   ${({
   ddTextAlign
@@ -63,42 +69,32 @@ const StyledDdDiv = _styledComponents.default.div`
 exports.StyledDdDiv = StyledDdDiv;
 const StyledDt = _styledComponents.default.dt`
   ${_styledSystem.space}
-  ${({
-  theme
-}) => (0, _styledComponents.css)`
-    font-size: 14px
-    font-weight: 700;
-    color: ${theme.definitionList.dtTextDark};
-  `}
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--colorsUtilityYin090);
 `;
 exports.StyledDt = StyledDt;
 StyledDt.defaultProps = {
   theme: _themes.baseTheme
 };
 const StyledDd = _styledComponents.default.dd`
-  ${({
-  theme
-}) => (0, _styledComponents.css)`
-    font-size: 14px
-    font-weight: 700;
-    color: ${theme.definitionList.ddText};
-    margin-left: 0px;
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--colorsUtilityYin065);
+  margin-left: 0px;
 
-    ${_button.default} {
-      padding: 0;
-      border: none;
-    }
+  ${_button.default} {
+    padding: 0;
+    border: none;
+  }
 
-    ${_link.StyledLink} {
-      a, button {
-        font-weight: 700px;
-        text-decoration: none;
-      }
+  ${_link.StyledLink} {
+    a,
+    button {
+      font-weight: 700px;
+      text-decoration: none;
     }
-  `}
+  }
   ${_styledSystem.space}
 `;
-exports.StyledDd = StyledDd;
-StyledDd.defaultProps = {
-  theme: _themes.baseTheme
-};
+exports.StyledDd = StyledDd;

package/lib/components/drawer/drawer.style.js

@@ -7,8 +7,6 @@ exports.StyledButton = exports.StyledSidebarTitle = exports.StyledDrawerSidebar
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _base = _interopRequireDefault(require("../../style/themes/base"));
-
 var _tabs = _interopRequireDefault(require("../tabs/tabs.style"));
 
 var _box = _interopRequireDefault(require("../box"));
@@ -21,6 +19,7 @@ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+const defaultExpandedWidth = "var(--sizing500)";
 const StyledSidebarHeader = _styledComponents.default.div`
   ${({
   isExpanded
@@ -29,14 +28,14 @@ const StyledSidebarHeader = _styledComponents.default.div`
     top: 0;
 
     ${isExpanded && (0, _styledComponents.css)`
-      border-bottom: 1px solid #ccd6db;
+      border-bottom: var(--sizing010) solid #ccd6db;
     `}
   `}
 `;
 exports.StyledSidebarHeader = StyledSidebarHeader;
 const StyledSidebarTitle = _styledComponents.default.div`
   white-space: nowrap;
-  padding: 24px 36px 24px 40px;
+  padding: var(--spacing300) var(--spacing500);
 `;
 exports.StyledSidebarTitle = StyledSidebarTitle;
 const StyledDrawerChildren = _styledComponents.default.div`
@@ -90,9 +89,9 @@ const sidebarHidden = () => (0, _styledComponents.keyframes)`
 
 const drawerOpen = expandedWidth => (0, _styledComponents.keyframes)`
   0% {
-    width: 40px;
+    width: ${defaultExpandedWidth};
     overflow: hidden;
-    min-width: 40px;
+    min-width: ${defaultExpandedWidth};
   }
   100% {
     width: ${expandedWidth};
@@ -102,7 +101,7 @@ const drawerOpen = expandedWidth => (0, _styledComponents.keyframes)`
 
 const drawerClose = expandedWidth => (0, _styledComponents.keyframes)`
   0% {width: ${expandedWidth};}
-  100% {width: 40px;}
+  100% {width: ${defaultExpandedWidth};}
 `;
 
 const buttonOpen = () => (0, _styledComponents.keyframes)`
@@ -119,19 +118,19 @@ const buttonClose = () => (0, _styledComponents.keyframes)`
 const StyledDrawerContent = _styledComponents.default.div`
   display: flex;
   flex-direction: column;
-  min-width: 40px;
-  width: 40px;
+  min-width: ${defaultExpandedWidth};
+  width: ${defaultExpandedWidth};
   min-height: 40px;
   height: auto;
   position: relative;
   overflow: auto;
-  border-right: 1px solid ${({
-  theme
-}) => theme.drawer.divider};
-  background-color: ${({
-  backgroundColor,
-  theme
-}) => backgroundColor || theme.drawer.background}};
+
+  ${({
+  backgroundColor
+}) => (0, _styledComponents.css)`
+    background-color: ${backgroundColor || "var(--colorsUtilityMajor040)"};
+    border-right: 1px solid ${backgroundColor || "var(--colorsUtilityMajor075)"};
+  `};
 
   &.open {
     min-width: 52px;
@@ -150,11 +149,13 @@ const StyledDrawerContent = _styledComponents.default.div`
   animationDuration,
   expandedWidth
 }) => (0, _styledComponents.css)`
-      ${drawerOpen(expandedWidth)} ${animationDuration}
-    `} ease-in-out;
+        ${drawerOpen(expandedWidth)} ${animationDuration}
+      `}
+      ease-in-out;
 
     ${StyledDrawerSidebar}, ${StyledSidebarTitle} {
-      animation: ${sidebarVisible} ${({
+      animation: ${sidebarVisible}
+        ${({
   animationDuration
 }) => animationDuration} ease-in-out;
     }
@@ -173,11 +174,13 @@ const StyledDrawerContent = _styledComponents.default.div`
   animationDuration,
   expandedWidth
 }) => (0, _styledComponents.css)`
-      ${drawerClose(expandedWidth)} ${animationDuration}
-    `} ease-in-out;
+        ${drawerClose(expandedWidth)} ${animationDuration}
+      `}
+      ease-in-out;
 
     ${StyledDrawerSidebar}, ${StyledSidebarTitle}, ${_stickyFooter.default} {
-      animation: ${sidebarHidden} ${({
+      animation: ${sidebarHidden}
+        ${({
   animationDuration
 }) => animationDuration} ease-in-out;
     }
@@ -189,15 +192,17 @@ const StyledButton = _styledComponents.default.button.attrs({
 })`
   ${({
   animationDuration,
-  isExpanded,
-  theme
+  isExpanded
 }) => (0, _styledComponents.css)`
     position: absolute;
-    top: 24px;
+    top: var(--spacing300);
     right: 8px;
-    padding: 0;
-    width: 24px;
-    height: 24px;
+    padding: var(--spacing100);
+    width: var(--spacing300);
+    height: var(--spacing300);
+    display: flex;
+    justify-content: center;
+    align-items: center;
     transition: margin-right ${animationDuration} ease-in-out;
     background-color: transparent;
     border: none;
@@ -205,7 +210,7 @@ const StyledButton = _styledComponents.default.button.attrs({
     animation: ${buttonClose} ${animationDuration} ease-in-out;
 
     &:focus {
-      outline: 3px solid ${theme.colors.focus};
+      outline: var(--borderWidth300) solid var(--colorsSemanticFocus500);
     }
 
     &:hover {
@@ -225,10 +230,4 @@ const StyledDrawerWrapper = _styledComponents.default.div`
   height
 }) => height};
 `;
-exports.StyledDrawerWrapper = StyledDrawerWrapper;
-StyledDrawerContent.defaultProps = {
-  theme: _base.default
-};
-StyledButton.defaultProps = {
-  theme: _base.default
-};
+exports.StyledDrawerWrapper = StyledDrawerWrapper;

package/lib/components/form/__internal__/form-summary.style.js

@@ -9,8 +9,6 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _base = _interopRequireDefault(require("../../../style/themes/base"));
-
 var _icon = _interopRequireDefault(require("../../icon/icon.style"));
 
 var _button = _interopRequireDefault(require("../../button/button.style"));
@@ -31,10 +29,9 @@ const StyledFormSummary = _styledComponents.default.div`
   white-space: nowrap;
 
   ${({
-  showSummary,
-  theme
+  showSummary
 }) => showSummary && (0, _styledComponents.css)`
-      background-color: ${theme.form.invalid};
+      background-color: var(--colorsUtilityMajor025);
     `}
 
   ${_button.default} {
@@ -57,46 +54,34 @@ const StyledInternalSummary = _styledComponents.default.div`
     margin-right: 16px;
   }
   ${({
-  type,
-  theme
+  type
 }) => type === "warnings" && (0, _styledComponents.css)`
-      color: ${theme.colors.warning};
+      color: var(--colorsSemanticCaution650);
     `}
   ${({
-  type,
-  theme
+  type
 }) => type === "errors" && (0, _styledComponents.css)`
-      color: ${theme.colors.error};
+      color: var(--colorsSemanticNegative600);
     `}
 
   ${_icon.default} {
     margin-right: 4px;
     ${({
-  type,
-  theme
+  type
 }) => type === "warnings" && (0, _styledComponents.css)`
-        color: ${theme.colors.warning};
+        color: var(--colorsSemanticCaution650);
       `}
     ${({
-  type,
-  theme
+  type
 }) => type === "errors" && (0, _styledComponents.css)`
-        color: ${theme.colors.error};
+        color: var(--colorsSemanticNegative600);
       `}
   }
 `;
 exports.StyledInternalSummary = StyledInternalSummary;
 StyledFormSummary.propTypes = {
-  theme: _propTypes.default.object,
   showSummary: _propTypes.default.bool
 };
-StyledFormSummary.defaultProps = {
-  theme: _base.default
-};
 StyledInternalSummary.propTypes = {
-  theme: _propTypes.default.object,
   type: _propTypes.default.oneOf(["errors", "warnings"])
-};
-StyledInternalSummary.defaultProps = {
-  theme: _base.default
 };

package/lib/components/form/form.style.js

@@ -55,15 +55,14 @@ const StyledFormFooter = _styledComponents.default.div`
     `}
 
   ${({
-  stickyFooter,
-  theme
+  stickyFooter
 }) => (0, _styledComponents.css)`
     ${!stickyFooter && (0, _styledComponents.css)`
       margin-top: 48px;
     `}
 
     ${stickyFooter && (0, _styledComponents.css)`
-      background-color: ${theme.colors.white};
+      background-color: var(--colorsUtilityYang100);
       box-shadow: 0 -4px 12px 0 rgba(0, 0, 0, 0.05);
       box-sizing: border-box;
       padding: 16px 32px;
@@ -75,6 +74,17 @@ const StyledFormFooter = _styledComponents.default.div`
   `}
 `;
 exports.StyledFormFooter = StyledFormFooter;
+
+const formBottomMargins = fieldSpacing => ({
+  0: "var(--spacing000)",
+  1: "var(--spacing100)",
+  2: "var(--spacing200)",
+  3: "var(--spacing300)",
+  4: "var(--spacing400)",
+  5: "var(--spacing500)",
+  7: "var(--spacing700)"
+})[fieldSpacing];
+
 const StyledForm = _styledComponents.default.form`
   ${_styledSystem.space}
 
@@ -84,24 +94,26 @@ const StyledForm = _styledComponents.default.form`
       height: ${height};
     `}
 
-  & ${_formField.default}, ${_fieldset.StyledFieldset}, ${_fieldset2.FieldsetStyle}, > ${_button.default} {
-    margin-top: 0;
-    margin-bottom: ${({
-  fieldSpacing,
-  theme
-}) => theme.spacing * fieldSpacing}px;
-  }
-
-  ${_inlineInputs.default} {
-    ${_formField.default} {
-      margin-bottom: 0;
-    }
+  ${({
+  fieldSpacing
+}) => (0, _styledComponents.css)`
+      &
+        ${_formField.default},
+        ${_fieldset.StyledFieldset},
+        ${_fieldset2.FieldsetStyle},
+        > ${_button.default} {
+        margin-top: 0;
+        margin-bottom: ${formBottomMargins(fieldSpacing)};
+      }
+
+      ${_inlineInputs.default} {
+        ${_formField.default} {
+          margin-bottom: 0;
+        }
 
-    margin-bottom: ${({
-  fieldSpacing,
-  theme
-}) => theme.spacing * fieldSpacing}px;
-  }
+        margin-bottom: ${formBottomMargins(fieldSpacing)};
+      }
+    `}  
 
   ${_search.default} ${_formField.default} {
     margin-bottom: 0px;
@@ -109,8 +121,7 @@ const StyledForm = _styledComponents.default.form`
 
   ${({
   stickyFooter,
-  isInSidebar,
-  theme
+  isInSidebar
 }) => stickyFooter && (0, _styledComponents.css)`
       display: flex;
       flex-direction: column;
@@ -119,20 +130,20 @@ const StyledForm = _styledComponents.default.form`
       ${isInSidebar && (0, _styledComponents.css)`
         min-height: 100%;
         ${StyledFormContent}.sticky {
-          padding-right: ${theme.space[4]}px;
-          padding-left: ${theme.space[4]}px;
+          padding-right: var(--spacing400);
+          padding-left: var(--spacing400);
           padding-top: 27px;
-          margin-right: -${theme.space[4]}px;
-          margin-left: -${theme.space[4]}px;
+          margin-right: calc(-1 * var(--spacing400));
+          margin-left: calc(-1 * var(--spacing400));
           margin-top: -27px;
         }
 
         ${StyledFormFooter}.sticky {
-          margin-left: -${theme.space[4]}px;
-          margin-bottom: -${theme.space[4]}px;
-          width: calc(100% + ${2 * theme.space[4]}px);
-          padding-left: ${theme.space[4]}px;
-          padding-right: ${theme.space[4]}px;
+          margin-left: calc(-1 * var(--spacing400));
+          margin-bottom: calc(-1 * var(--spacing400));
+          width: calc(100% + var(--spacing800));
+          padding-left: var(--spacing400);
+          padding-right: var(--spacing400);
           bottom: -32px;
         }
       `}
@@ -179,10 +190,6 @@ StyledRightButtons.propTypes = {
   buttonAlignment: _propTypes.default.oneOf(_form.FORM_BUTTON_ALIGNMENTS)
 };
 StyledFormFooter.propTypes = {
-  theme: _propTypes.default.object,
   buttonAlignment: _propTypes.default.oneOf(_form.FORM_BUTTON_ALIGNMENTS),
   stickyFooter: _propTypes.default.bool
-};
-StyledFormFooter.defaultProps = {
-  theme: _base.default
 };

package/lib/components/numeral-date/numeral-date.style.js

@@ -11,14 +11,10 @@ var _validationIcon = _interopRequireDefault(require("../../__internal__/validat
 
 var _inputIconToggle = _interopRequireDefault(require("../../__internal__/input-icon-toggle/input-icon-toggle.style"));
 
-var _themes = require("../../style/themes");
-
 var _inputPresentation = _interopRequireDefault(require("../../__internal__/input/input-presentation.style"));
 
 var _formField = _interopRequireDefault(require("../../__internal__/form-field/form-field.style"));
 
-var _icon = _interopRequireDefault(require("../icon/icon.style"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -39,13 +35,9 @@ const StyledNumeralDate = _styledComponents.default.div`
   }
 `;
 exports.StyledNumeralDate = StyledNumeralDate;
-StyledNumeralDate.defaultProps = {
-  theme: _themes.baseTheme
-};
 const StyledDateField = _styledComponents.default.div`
   ${({
   isYearInput,
-  theme,
   isEnd,
   hasValidationIcon,
   isMiddle
@@ -61,14 +53,6 @@ const StyledDateField = _styledComponents.default.div`
             margin-left: -1px;
           `}
 
-        ${_icon.default} {
-          display: flex;
-          color: ${theme.numeralDate.error};
-          width: 16px;
-          height: 16px;
-          cursor: pointer;
-        }
-
         ${_inputIconToggle.default} {
           width: 32px;
           z-index: 999;
@@ -80,7 +64,4 @@ const StyledDateField = _styledComponents.default.div`
       `;
 }}
 `;
-exports.StyledDateField = StyledDateField;
-StyledDateField.defaultProps = {
-  theme: _themes.baseTheme
-};
+exports.StyledDateField = StyledDateField;

package/lib/components/select/__internal__/select-text/select-text.style.js

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _themes = require("../../../../style/themes");
-
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -18,7 +16,6 @@ const StyledSelectText = _styledComponents.default.span`
   disabled,
   hasPlaceholder,
   readOnly,
-  theme,
   transparent
 }) => (0, _styledComponents.css)`
     align-items: center;
@@ -40,7 +37,7 @@ const StyledSelectText = _styledComponents.default.span`
     `}
 
     ${hasPlaceholder && (0, _styledComponents.css)`
-      color: ${theme.text.placeholder};
+      color: var(--colorsUtilityYin055);
       font-weight: normal;
       user-select: none;
     `}
@@ -53,13 +50,10 @@ const StyledSelectText = _styledComponents.default.span`
 
     ${readOnly && (0, _styledComponents.css)`
       cursor: default;
-      color: var(--colorsYin065);
+      color: var(--colorsUtilityYin065);
       text-shadow: none;
     `}
   `}
 `;
-StyledSelectText.defaultProps = {
-  theme: _themes.baseTheme
-};
 var _default = StyledSelectText;
 exports.default = _default;

package/lib/components/select/select-list/select-list-container.style.js

@@ -7,15 +7,11 @@ exports.default = void 0;
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _themes = require("../../../style/themes");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const StyledSelectListContainer = _styledComponents.default.div`
   background-color: white;
-  box-shadow: ${({
-  theme
-}) => `${theme.shadows.depth1}`};
+  box-shadow: var(--boxShadow100);
   position: absolute;
   ${({
   placement
@@ -37,8 +33,5 @@ const StyledSelectListContainer = _styledComponents.default.div`
     }
   }
 `;
-StyledSelectListContainer.defaultProps = {
-  theme: _themes.baseTheme
-};
 var _default = StyledSelectListContainer;
 exports.default = _default;

package/lib/style/themes/base/base-theme.config.d.ts

@@ -121,9 +121,6 @@ declare function _default(palette: any): {
             searchIconHover: any;
         };
     };
-    form: {
-        invalid: any;
-    };
     card: {
         footerBackground: any;
         footerBorder: any;
@@ -182,11 +179,6 @@ declare function _default(palette: any): {
     content: {
         secondaryColor: any;
     };
-    definitionList: {
-        dtTextDark: any;
-        dtTextLight: any;
-        ddText: any;
-    };
     disabled: {
         border: any;
         button: any;

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

@@ -140,9 +140,6 @@ var _default = palette => {
         searchIconHover: palette.slateTint(75)
       }
     },
-    form: {
-      invalid: palette.slateTint(95)
-    },
     card: {
       footerBackground: palette.slateTint(95),
       footerBorder: palette.slateTint(80)
@@ -201,11 +198,6 @@ var _default = palette => {
     content: {
       secondaryColor: palette.slateTint(40)
     },
-    definitionList: {
-      dtTextDark: palette.blackOpacity(0.9),
-      dtTextLight: palette.blackOpacity(0.65),
-      ddText: palette.blackOpacity(0.65)
-    },
     disabled: {
       border: palette.slateTint(80),
       button: palette.slateTint(90),

package/lib/style/themes/base/index.d.ts

@@ -199,12 +199,6 @@ export interface ThemeObject {
     secondaryColor: string;
   };
 
-  definitionList: {
-    dtTextDark: string;
-    dtTextLight: string;
-    ddText: string;
-  };
-
   disabled: {
     border: string;
     button: string;

package/lib/style/themes/sage/index.d.ts

@@ -502,11 +502,6 @@ declare var _default: {
     content: {
         secondaryColor: string;
     };
-    definitionList: {
-        dtTextDark: string;
-        dtTextLight: string;
-        ddText: string;
-    };
     disabled: {
         border: string;
         button: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "104.28.0",
+  "version": "104.31.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {