carbon-react 145.0.0 → 146.0.1

package/lib/components/simple-color-picker/simple-color/simple-color.style.js

@@ -23,10 +23,6 @@ const StyledSimpleColor = exports.StyledSimpleColor = _styledComponents.default.
     cursor: pointer;
   }
 `;
-const oldFocusStyling = `
-  box-shadow: inset 0px 0px 0px var(--borderWidth200) var(--colorsUtilityYang100);
-  border: 2px solid var(--colorsSemanticFocus500);
-`;
 const StyledColorSampleBox = exports.StyledColorSampleBox = _styledComponents.default.div`
   height: 100%;
   width: 100%;
@@ -34,10 +30,6 @@ const StyledColorSampleBox = exports.StyledColorSampleBox = _styledComponents.de
   display: flex;
   align-items: center;
   justify-content: center;
-  ${({
-  theme
-}) => /* istanbul ignore next */
-theme.focusRedesignOptOut && "border: 2px solid transparent;"}
 
   ${({
   color
@@ -70,18 +62,7 @@ const StyledSimpleColorInput = exports.StyledSimpleColorInput = (0, _styledCompo
   }
 
   &:focus + ${StyledColorSampleBox} {
-    ${({
-  theme
-}) => (0, _styledComponents.css)`
-      ${theme.focusRedesignOptOut && /* istanbul ignore next */
-`
-        ${oldFocusStyling}
-      `}
-
-      ${!theme.focusRedesignOptOut && `
-        ${(0, _addFocusStyling.default)(true)}
-      `}
-    `}
+    ${(0, _addFocusStyling.default)(true)}
   }
 `;
 const getIconColor = color => {

package/lib/components/split-button/split-button-toggle.style.js

@@ -21,8 +21,7 @@ const StyledSplitButtonToggle = (0, _styledComponents.default)(_button.default)`
   buttonType,
   disabled,
   displayed,
-  size,
-  theme
+  size
 }) => (0, _styledComponents.css)`
     border-top-left-radius: var(--borderRadius000);
     border-bottom-left-radius: var(--borderRadius000);
@@ -58,14 +57,6 @@ const StyledSplitButtonToggle = (0, _styledComponents.default)(_button.default)`
 
     ${_button.default} + & {
       margin-left: 0;
-
-      ${buttonType === "secondary" && /* istanbul ignore next */
-theme.focusRedesignOptOut && /* istanbul ignore next */
-(0, _styledComponents.css)`
-        &:focus {
-          margin-left: -3px;
-        }
-      `}
     }
 
     ${_button.default} + & ${_icon.default} {

package/lib/components/split-button/split-button.component.js

@@ -128,6 +128,7 @@ const SplitButton = ({
     return /*#__PURE__*/_react.default.createElement(_popover.default, {
       disablePortal: true,
       placement: position === "left" ? /* istanbul ignore next */"bottom-start" : "bottom-end",
+      popoverStrategy: "fixed",
       reference: buttonNode,
       middleware: [(0, _dom.offset)(6), (0, _dom.flip)({
         fallbackStrategy: "initialPlacement"

package/lib/components/split-button/split-button.style.js

@@ -4,13 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _styledSystem = require("styled-system");
 var _button = _interopRequireDefault(require("../button/button.style"));
 var _base = _interopRequireDefault(require("../../style/themes/base"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const StyledSplitButton = _styledComponents.default.div`
   ${_styledSystem.margin}
   display: inline-block;
@@ -24,21 +22,8 @@ const StyledSplitButton = _styledComponents.default.div`
   & > ${_button.default} {
     margin: 0;
     &:focus {
-      ${({
-  theme
-}) => (0, _styledComponents.css)`
-        ${theme.focusRedesignOptOut && /* istanbul ignore next */
-`
-          border: 3px solid var(--colorsSemanticFocus500);
-          margin: -1px;
-          outline: none;
-        `}
-
-        ${!theme.focusRedesignOptOut && `
-          position: relative;
-          z-index: 1;
-        `}
-      `}
+      position: relative;
+      z-index: 1;
     }
   }
 `;

package/lib/components/switch/switch.style.js

@@ -18,9 +18,6 @@ var _switchSlider = _interopRequireDefault(require("./__internal__/switch-slider
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const oldFocusStyling = `
-  outline: solid 3px var(--colorsSemanticFocus500);
-`;
 const ErrorBorder = exports.ErrorBorder = _styledComponents.default.span`
   ${({
   reverse,
@@ -56,8 +53,7 @@ const StyledSwitch = _styledComponents.default.div`
   fieldHelpInline,
   labelInline,
   reverse,
-  size,
-  theme
+  size
 }) => (0, _styledComponents.css)`
     ${_styledSystem.margin}
     ${_formField.FieldLineStyle} {
@@ -91,7 +87,7 @@ const StyledSwitch = _styledComponents.default.div`
 
     ${_hiddenCheckableInput.default}:not([disabled]) {
       &:focus ~ ${_switchSlider.default} {
-        ${!theme.focusRedesignOptOut ? (0, _addFocusStyling.default)() : /* istanbul ignore next */oldFocusStyling}
+        ${(0, _addFocusStyling.default)()}
       }
     }
 

package/lib/components/tabs/__internal__/tab-title/tab-title.style.js

@@ -335,12 +335,8 @@ const tabTitleStyles = (0, _styledComponents.css)`
           cursor: default;
         }
       `}
-
-    ${({
-  theme
-}) => `
       &:focus {
-        outline: 4px solid ${!theme.focusRedesignOptOut ? "black" : /* istanbul ignore next */"var(--colorsSemanticFocus500)"};
+        outline: 4px solid black;
         top: -2px;
         z-index: 6;
 
@@ -356,7 +352,7 @@ const tabTitleStyles = (0, _styledComponents.css)`
                 border-bottom-left-radius: var(--borderRadius100);
               `}
 
-        ${!theme.focusRedesignOptOut ? `::before {
+        ::before {
           content: "";
           position: absolute;
           top: 0;
@@ -385,10 +381,10 @@ const tabTitleStyles = (0, _styledComponents.css)`
                  bottom: 2px;
                  right: 1px;
                `}
-        }` : /* istanbul ignore next */""}
+        }
+        }
       }
-    `}
-
+    
     ${position === "left" && (0, _styledComponents.css)`
         background-color: transparent;
         border-bottom: 0px;

package/lib/components/text-editor/__internal__/toolbar/toolbar-button/toolbar-button.style.js

@@ -23,23 +23,13 @@ const StyledToolbarButton = _styledComponents.default.button.attrs({
   cursor: pointer;
 
   ${({
-  isActive,
-  theme
+  isActive
 }) => (0, _styledComponents.css)`
     :focus,
     :active {
       z-index: 1;
       position: relative;
-
-      ${theme.focusRedesignOptOut && /* istanbul ignore next */
-(0, _styledComponents.css)`
-        outline: 2px solid var(--colorsSemanticFocus500);
-        outline-offset: -2px;
-      `}
-
-      ${!theme.focusRedesignOptOut && (0, _styledComponents.css)`
-        ${(0, _addFocusStyling.default)()}
-      `}
+      ${(0, _addFocusStyling.default)()}
     }
 
     :hover {

package/lib/components/text-editor/text-editor.style.js

@@ -66,17 +66,13 @@ const StyledEditorContainer = exports.StyledEditorContainer = _styledComponents.
 const StyledEditorOutline = exports.StyledEditorOutline = _styledComponents.default.div`
   ${({
   isFocused,
-  hasError,
-  theme
+  hasError
 }) => (0, _styledComponents.css)`
     border-radius: var(--borderRadius050);
     outline: none;
 
     ${isFocused && (0, _styledComponents.css)`
-      ${!theme.focusRedesignOptOut ? (0, _addFocusStyling.default)() : `
-        outline: 3px solid var(--colorsSemanticFocus500);
-        outline-offset: ${hasError ? "2px" : "1px"};
-      `}
+      ${(0, _addFocusStyling.default)()}
     `}
   `}
 `;

package/lib/components/tile-select/tile-select.style.js

@@ -64,14 +64,10 @@ const StyledTileSelect = exports.StyledTileSelect = _styledComponents.default.di
       }
     `}
 `;
-const oldFocusStyling = `
-  outline: solid 3px var(--colorsSemanticFocus500);
-`;
 const StyledFocusWrapper = exports.StyledFocusWrapper = _styledComponents.default.div`
   ${({
   checked,
-  hasFocus,
-  theme
+  hasFocus
 }) => (0, _styledComponents.css)`
     position: relative;
     border: 1px solid var(--colorsActionMinor250);
@@ -84,7 +80,7 @@ const StyledFocusWrapper = exports.StyledFocusWrapper = _styledComponents.defaul
     `}
 
     ${hasFocus && (0, _styledComponents.css)`
-      ${!theme.focusRedesignOptOut ? (0, _addFocusStyling.default)() : /* istanbul ignore next */oldFocusStyling}
+      ${(0, _addFocusStyling.default)()}
       z-index: 15;
     `}
   `}

package/lib/components/vertical-menu/vertical-menu.style.js

@@ -19,10 +19,6 @@ const StyledList = exports.StyledList = _styledComponents.default.ul`
   margin: 0;
   padding: 0;
 `;
-const oldFocusStyling = `
-  outline: 3px solid var(--colorsSemanticFocus500);
-  outline-offset: -3px;
-`;
 const StyledVerticalMenuItem = exports.StyledVerticalMenuItem = _styledComponents.default.div`
   min-height: ${({
   height
@@ -47,9 +43,7 @@ const StyledVerticalMenuItem = exports.StyledVerticalMenuItem = _styledComponent
   }
 
   &:focus {
-    ${({
-  theme
-}) => !theme.focusRedesignOptOut ? (0, _addFocusStyling.default)(true) : /* istanbul ignore next */oldFocusStyling}
+    ${(0, _addFocusStyling.default)(true)}
   }
 
   ${({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "145.0.0",
+  "version": "146.0.1",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",