@carbon/ibm-products 2.43.2-canary.130 → 2.43.2-canary.131

package/es/components/SidePanel/SidePanel.js

@@ -118,6 +118,11 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     labelTextHeight = _useState8[0],
     setLabelTextHeight = _useState8[1];
+  var handleEscapeKey = function handleEscapeKey(event) {
+    if (event.key === 'Escape' && open) {
+      onRequestClose === null || onRequestClose === void 0 || onRequestClose();
+    }
+  };
   useEffect(function () {
     if (open && !(titleRef !== null && titleRef !== void 0 && titleRef.current)) {
       setDoAnimateTitle(false);
@@ -378,6 +383,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
       className: "".concat(blockClass, "__close-button"),
       label: closeIconDescription,
       onClick: onRequestClose,
+      onKeyDown: slideIn ? undefined : handleEscapeKey,
       title: closeIconDescription,
       "aria-label": closeIconDescription,
       ref: closeRef,
@@ -430,6 +436,12 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
       className: cx("".concat(blockClass, "__inner-content"), "".concat(blockClass, "--scrolls"), "".concat(!doAnimateTitle ? "".concat(blockClass, "__inner-content--no-animated-title") : ''))
     }, children);
   };
+  var handleKeyDown = function handleKeyDown(event) {
+    if (!slideIn) {
+      handleEscapeKey(event);
+      keyDownListener(event);
+    }
+  };
   return /*#__PURE__*/React__default.createElement(AnimatePresence, null, open && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(motion.div, _extends({}, getDevtoolsProps(componentName), rest, {
     id: id,
     className: mainPanelClassNames,
@@ -446,7 +458,7 @@ var SidePanel = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
       placement: placement,
       shouldReduceMotion: shouldReduceMotion
     },
-    onKeyDown: slideIn ? undefined : keyDownListener
+    onKeyDown: handleKeyDown
   }), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, renderHeader(), renderMain()), /*#__PURE__*/React__default.createElement(MotionActionSet, {
     actions: actions !== null && actions !== void 0 ? actions : [],
     className: primaryActionContainerClassNames,

package/lib/components/SidePanel/SidePanel.js

@@ -127,6 +127,11 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
     _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
     labelTextHeight = _useState8[0],
     setLabelTextHeight = _useState8[1];
+  var handleEscapeKey = function handleEscapeKey(event) {
+    if (event.key === 'Escape' && open) {
+      onRequestClose === null || onRequestClose === void 0 || onRequestClose();
+    }
+  };
   React.useEffect(function () {
     if (open && !(titleRef !== null && titleRef !== void 0 && titleRef.current)) {
       setDoAnimateTitle(false);
@@ -387,6 +392,7 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
       className: "".concat(blockClass, "__close-button"),
       label: closeIconDescription,
       onClick: onRequestClose,
+      onKeyDown: slideIn ? undefined : handleEscapeKey,
       title: closeIconDescription,
       "aria-label": closeIconDescription,
       ref: closeRef,
@@ -439,6 +445,12 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
       className: cx__default["default"]("".concat(blockClass, "__inner-content"), "".concat(blockClass, "--scrolls"), "".concat(!doAnimateTitle ? "".concat(blockClass, "__inner-content--no-animated-title") : ''))
     }, children);
   };
+  var handleKeyDown = function handleKeyDown(event) {
+    if (!slideIn) {
+      handleEscapeKey(event);
+      keyDownListener(event);
+    }
+  };
   return /*#__PURE__*/React__default["default"].createElement(framerMotion.AnimatePresence, null, open && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(framerMotion.motion.div, _rollupPluginBabelHelpers["extends"]({}, devtools.getDevtoolsProps(componentName), rest, {
     id: id,
     className: mainPanelClassNames,
@@ -455,7 +467,7 @@ exports.SidePanel = /*#__PURE__*/React__default["default"].forwardRef(function (
       placement: placement,
       shouldReduceMotion: shouldReduceMotion
     },
-    onKeyDown: slideIn ? undefined : keyDownListener
+    onKeyDown: handleKeyDown
   }), /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderHeader(), renderMain()), /*#__PURE__*/React__default["default"].createElement(MotionActionSet, {
     actions: actions !== null && actions !== void 0 ? actions : [],
     className: primaryActionContainerClassNames,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "2.43.2-canary.130+bd91747bf",
+  "version": "2.43.2-canary.131+49b02278f",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -120,5 +120,5 @@
     "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
   },
-  "gitHead": "bd91747bfb73a1ada8d49e5c569b1b3eb31070f0"
+  "gitHead": "49b02278f864e85f31a363491cbba7b8d1a0a4f7"
 }