carbon-react 125.12.0 → 125.12.2

package/esm/components/date/__internal__/date-picker/date-picker.component.js

@@ -1,5 +1,5 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { useEffect, useMemo, useRef } from "react";
+import React, { useCallback, useEffect, useMemo, useRef } from "react";
 import PropTypes from "prop-types";
 import DayPicker from "react-day-picker";
 import { flip, offset } from "@floating-ui/dom";
@@ -98,11 +98,16 @@ export const DatePicker = ({
       onDayClick?.(date, ev);
     }
   };
-  const handleOnKeyDown = ev => {
-    if (Events.isEscKey(ev)) {
+  const handleKeyUp = useCallback(ev => {
+    /* istanbul ignore else */
+    if (open && Events.isEscKey(ev)) {
       inputElement.current?.querySelector("input")?.focus();
       setOpen(false);
+      ev.stopPropagation();
     }
+  }, [inputElement, open, setOpen]);
+  const handleOnKeyDown = ev => {
+    /* istanbul ignore else */
     if (ref.current?.querySelector(".DayPicker-NavBar button") === document.activeElement && Events.isTabKey(ev) && Events.isShiftKey(ev)) {
       ev.preventDefault();
       setOpen(false);
@@ -145,6 +150,7 @@ export const DatePicker = ({
   }, /*#__PURE__*/React.createElement(StyledDayPicker, {
     ref: ref,
     onMouseDown: pickerMouseDown,
+    onKeyUp: handleKeyUp,
     onKeyDown: handleOnKeyDown
   }, /*#__PURE__*/React.createElement("div", {
     id: pickerTabGuardId

package/esm/components/date/date.component.js

@@ -180,13 +180,17 @@ const DateInput = /*#__PURE__*/React.forwardRef(({
       onFocus(ev);
     }
   };
+  const handleKeyUp = useCallback(ev => {
+    /* istanbul ignore else */
+    if (open && Events.isEscKey(ev)) {
+      setOpen(false);
+      ev.stopPropagation();
+    }
+  }, [open]);
   const handleKeyDown = ev => {
     if (onKeyDown) {
       onKeyDown(ev);
     }
-    if (Events.isEscKey(ev)) {
-      setOpen(false);
-    }
     if (open && Events.isTabKey(ev)) {
       if (Events.isShiftKey(ev)) {
         setOpen(false);
@@ -288,6 +292,7 @@ const DateInput = /*#__PURE__*/React.forwardRef(({
     onChange: handleChange,
     onClick: handleClick,
     onFocus: handleFocus,
+    onKeyUp: handleKeyUp,
     onKeyDown: handleKeyDown,
     iconOnClick: handleClick,
     onMouseDown: handleMouseDown,

package/esm/components/multi-action-button/multi-action-button.style.js

@@ -93,14 +93,6 @@ const StyledButtonChildrenContainer = styled.div`
       text-align: ${align};
       z-index: ${theme.zIndex.overlay};
 
-      /* Styling for Safari. */
-      @media not all and (min-resolution: 0.001dpcm) {
-        @supports (-webkit-appearance: none) and (stroke-color: transparent) {
-          display: -webkit-box;
-          justify-content: ${align === "right" ? `flex-end` : `flex-start`};
-        }
-      }
-
       & + & {
         margin-top: 3px;
       }

package/esm/components/split-button/split-button-children.style.js

@@ -43,7 +43,8 @@ const StyledSplitButtonChildrenContainer = styled.div`
 
     ${StyledButton} {
       border: 1px solid var(--colorsActionMajorTransparent);
-      display: block;
+      display: flex;
+      justify-content: ${align};
       margin-left: 0;
       min-width: 100%;
       text-align: ${align};

package/lib/components/date/__internal__/date-picker/date-picker.component.js

@@ -106,11 +106,16 @@ const DatePicker = ({
       onDayClick?.(date, ev);
     }
   };
-  const handleOnKeyDown = ev => {
-    if (_events.default.isEscKey(ev)) {
+  const handleKeyUp = (0, _react.useCallback)(ev => {
+    /* istanbul ignore else */
+    if (open && _events.default.isEscKey(ev)) {
       inputElement.current?.querySelector("input")?.focus();
       setOpen(false);
+      ev.stopPropagation();
     }
+  }, [inputElement, open, setOpen]);
+  const handleOnKeyDown = ev => {
+    /* istanbul ignore else */
     if (ref.current?.querySelector(".DayPicker-NavBar button") === document.activeElement && _events.default.isTabKey(ev) && _events.default.isShiftKey(ev)) {
       ev.preventDefault();
       setOpen(false);
@@ -153,6 +158,7 @@ const DatePicker = ({
   }, /*#__PURE__*/_react.default.createElement(_dayPicker.default, {
     ref: ref,
     onMouseDown: pickerMouseDown,
+    onKeyUp: handleKeyUp,
     onKeyDown: handleOnKeyDown
   }, /*#__PURE__*/_react.default.createElement("div", {
     id: pickerTabGuardId

package/lib/components/date/date.component.js

@@ -189,13 +189,17 @@ const DateInput = exports.DateInput = /*#__PURE__*/_react.default.forwardRef(({
       onFocus(ev);
     }
   };
+  const handleKeyUp = (0, _react.useCallback)(ev => {
+    /* istanbul ignore else */
+    if (open && _events.default.isEscKey(ev)) {
+      setOpen(false);
+      ev.stopPropagation();
+    }
+  }, [open]);
   const handleKeyDown = ev => {
     if (onKeyDown) {
       onKeyDown(ev);
     }
-    if (_events.default.isEscKey(ev)) {
-      setOpen(false);
-    }
     if (open && _events.default.isTabKey(ev)) {
       if (_events.default.isShiftKey(ev)) {
         setOpen(false);
@@ -297,6 +301,7 @@ const DateInput = exports.DateInput = /*#__PURE__*/_react.default.forwardRef(({
     onChange: handleChange,
     onClick: handleClick,
     onFocus: handleFocus,
+    onKeyUp: handleKeyUp,
     onKeyDown: handleKeyDown,
     iconOnClick: handleClick,
     onMouseDown: handleMouseDown,

package/lib/components/multi-action-button/multi-action-button.style.js

@@ -102,14 +102,6 @@ const StyledButtonChildrenContainer = exports.StyledButtonChildrenContainer = _s
       text-align: ${align};
       z-index: ${theme.zIndex.overlay};
 
-      /* Styling for Safari. */
-      @media not all and (min-resolution: 0.001dpcm) {
-        @supports (-webkit-appearance: none) and (stroke-color: transparent) {
-          display: -webkit-box;
-          justify-content: ${align === "right" ? `flex-end` : `flex-start`};
-        }
-      }
-
       & + & {
         margin-top: 3px;
       }

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

@@ -52,7 +52,8 @@ const StyledSplitButtonChildrenContainer = _styledComponents.default.div`
 
     ${_button.default} {
       border: 1px solid var(--colorsActionMajorTransparent);
-      display: block;
+      display: flex;
+      justify-content: ${align};
       margin-left: 0;
       min-width: 100%;
       text-align: ${align};

package/package.json

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