carbon-react 136.0.1 → 136.0.3

package/esm/components/dialog/dialog.component.js

@@ -12,7 +12,6 @@ import FocusTrap from "../../__internal__/focus-trap";
 import IconButton from "../icon-button";
 import Icon from "../icon";
 import useLocale from "../../hooks/__internal__/useLocale";
-import useIsStickyFooterForm from "../../hooks/__internal__/useIsStickyFooterForm";
 import useModalAria from "../../hooks/__internal__/useModalAria/useModalAria";
 const PADDING_VALUES = [0, 1, 2, 3, 4, 5, 6, 7, 8];
 const Dialog = /*#__PURE__*/forwardRef(({
@@ -51,7 +50,6 @@ const Dialog = /*#__PURE__*/forwardRef(({
   const {
     current: subtitleId
   } = useRef(createGuid());
-  const hasStickyFooter = useIsStickyFooterForm(children);
   const isTopModal = useModalAria(containerRef);
   useImperativeHandle(ref, () => ({
     focus() {
@@ -182,9 +180,7 @@ const Dialog = /*#__PURE__*/forwardRef(({
     tabIndex: -1
   }, contentPadding, {
     backgroundColor: greyBackground ? "var(--colorsUtilityMajor025)" : "var(--colorsUtilityYang100)"
-  }), dialogTitle(), closeIcon(), /*#__PURE__*/React.createElement(StyledDialogContent, _extends({}, contentPadding, {
-    hasStickyFooter: hasStickyFooter
-  }), /*#__PURE__*/React.createElement(StyledDialogInnerContent, _extends({
+  }), dialogTitle(), closeIcon(), /*#__PURE__*/React.createElement(StyledDialogContent, contentPadding, /*#__PURE__*/React.createElement(StyledDialogInnerContent, _extends({
     ref: innerContentRef
   }, contentPadding), children)))));
 });

package/esm/components/dialog/dialog.style.d.ts

@@ -12,8 +12,6 @@ declare type StyledDialogTitleProps = {
     hasSubtitle?: boolean;
 };
 declare const StyledDialogTitle: import("styled-components").StyledComponent<"div", any, StyledDialogTitleProps, never>;
-declare const StyledDialogContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface & {
-    hasStickyFooter: boolean;
-}, never>;
+declare const StyledDialogContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface, never>;
 declare const StyledDialogInnerContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface, never>;
 export { StyledDialog, StyledDialogTitle, StyledDialogContent, StyledDialogInnerContent, };

package/esm/components/dialog/dialog.style.js

@@ -117,11 +117,13 @@ const StyledDialogContent = styled.div`
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  ${({
-  hasStickyFooter
-}) => !hasStickyFooter && css`
-      overflow-y: auto;
-    `}
+  overflow-y: auto;
+
+  /* Delegate handling overflow to child form if it has a sticky footer */
+  &:has(${StyledFormContent}.sticky) {
+    overflow-y: inherit;
+  }
+
   width: 100%;
   flex: 1;
   padding: 0px ${HORIZONTAL_PADDING}px ${CONTENT_BOTTOM_PADDING}px;

package/esm/components/dialog-full-screen/content.style.d.ts

@@ -1,6 +1,5 @@
 declare type StyledContentProps = {
     hasHeader: boolean;
-    hasStickyFooter: boolean;
     disableContentPadding?: boolean;
 };
 declare const StyledContent: import("styled-components").StyledComponent<"div", any, StyledContentProps, never>;

package/esm/components/dialog-full-screen/content.style.js

@@ -1,65 +1,13 @@
 import styled, { css } from "styled-components";
 import { StyledFormFooter, StyledFormContent } from "../form/form.style";
 const StyledContent = styled.div`
-  ${({
-  hasStickyFooter
-}) => !hasStickyFooter && css`
-      overflow-y: auto;
-    `}
+  overflow-y: auto;
   padding: 0 16px;
   flex: 1;
 
-  ${StyledFormContent}.sticky {
-    padding-right: 16px;
-    padding-left: 16px;
-    margin-right: -16px;
-    margin-left: -16px;
-
-    @media screen and (min-width: 600px) {
-      padding-right: 24px;
-      padding-left: 24px;
-      margin-right: -24px;
-      margin-left: -24px;
-    }
-    @media screen and (min-width: 960px) {
-      padding-right: 32px;
-      padding-left: 32px;
-      margin-right: -32px;
-      margin-left: -32px;
-    }
-    @media screen and (min-width: 1260px) {
-      padding-right: 40px;
-      padding-left: 40px;
-      margin-right: -40px;
-      margin-left: -40px;
-    }
-  }
-
-  ${StyledFormFooter}.sticky {
-    padding: 16px;
-
-    margin-right: -16px;
-    margin-left: -16px;
-    width: calc(100% + 32px);
-
-    @media screen and (min-width: 600px) {
-      padding: 16px 24px;
-      margin-right: -24px;
-      margin-left: -24px;
-      width: calc(100% + 48px);
-    }
-    @media screen and (min-width: 960px) {
-      padding: 16px 32px;
-      margin-right: -32px;
-      margin-left: -32px;
-      width: calc(100% + 64px);
-    }
-    @media screen and (min-width: 1260px) {
-      padding: 16px 40px;
-      margin-right: -40px;
-      margin-left: -40px;
-      width: calc(100% + 80px);
-    }
+  /* Delegate handling overflow to child form if it has a sticky footer */
+  &:has(${StyledFormContent}.sticky) {
+    overflow-y: inherit;
   }
 
   ${({
@@ -75,6 +23,59 @@ const StyledContent = styled.div`
       @media screen and (min-width: 1260px) {
         padding: 0 40px;
       }
+
+      ${StyledFormContent}.sticky {
+        padding-right: 16px;
+        padding-left: 16px;
+        margin-right: -16px;
+        margin-left: -16px;
+
+        @media screen and (min-width: 600px) {
+          padding-right: 24px;
+          padding-left: 24px;
+          margin-right: -24px;
+          margin-left: -24px;
+        }
+        @media screen and (min-width: 960px) {
+          padding-right: 32px;
+          padding-left: 32px;
+          margin-right: -32px;
+          margin-left: -32px;
+        }
+        @media screen and (min-width: 1260px) {
+          padding-right: 40px;
+          padding-left: 40px;
+          margin-right: -40px;
+          margin-left: -40px;
+        }
+      }
+
+      ${StyledFormFooter}.sticky {
+        padding: 16px;
+
+        margin-right: -16px;
+        margin-left: -16px;
+        width: calc(100% + 32px);
+
+        @media screen and (min-width: 600px) {
+          padding: 16px 24px;
+          margin-right: -24px;
+          margin-left: -24px;
+          width: calc(100% + 48px);
+        }
+        @media screen and (min-width: 960px) {
+          padding: 16px 32px;
+          margin-right: -32px;
+          margin-left: -32px;
+          width: calc(100% + 64px);
+        }
+        @media screen and (min-width: 1260px) {
+          padding: 16px 40px;
+          margin-right: -40px;
+          margin-left: -40px;
+          width: calc(100% + 80px);
+        }
+      }
     `}
 
     ${disableContentPadding && css`

package/esm/components/dialog-full-screen/dialog-full-screen.component.js

@@ -11,7 +11,6 @@ import FocusTrap from "../../__internal__/focus-trap";
 import IconButton from "../icon-button";
 import Icon from "../icon";
 import useLocale from "../../hooks/__internal__/useLocale";
-import useIsStickyFooterForm from "../../hooks/__internal__/useIsStickyFooterForm";
 import useModalAria from "../../hooks/__internal__/useModalAria/useModalAria";
 import tagComponent from "../../__internal__/utils/helpers/tags";
 export const DialogFullScreen = ({
@@ -49,7 +48,6 @@ export const DialogFullScreen = ({
   const {
     current: subtitleId
   } = useRef(createGuid());
-  const hasStickyFooter = useIsStickyFooterForm(children);
   const isTopModal = useModalAria(dialogRef);
   const closeIcon = () => {
     if (!showCloseIcon || !onCancel) return null;
@@ -109,8 +107,7 @@ export const DialogFullScreen = ({
     hasHeader: title !== undefined,
     "data-element": "content",
     ref: contentRef,
-    disableContentPadding: disableContentPadding,
-    hasStickyFooter: hasStickyFooter
+    disableContentPadding: disableContentPadding
   }, children))));
 };
 export default DialogFullScreen;

package/esm/components/form/form.style.js

@@ -11,6 +11,7 @@ export const StyledFormContent = styled.div`
   isInModal
 }) => css`
     ${stickyFooter && css`
+      /* Take responsibility for handling overflow away from parent modal */
       overflow-y: ${isInModal ? "auto" : "inherit"};
       flex: 1;
     `}

package/esm/components/hr/hr.component.js

@@ -18,6 +18,7 @@ const Hr = ({
   }
   return /*#__PURE__*/React.createElement(StyledHr, _extends({
     "data-component": "hr",
+    "data-role": "hr",
     ml: marginLeft,
     mr: marginRight,
     mt: rest.mt || 3,

package/esm/components/icon-button/icon-button.component.js

@@ -1,11 +1,10 @@
 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, { useState, useCallback, useContext } from "react";
+import React, { useState, useCallback } from "react";
 import PropTypes from "prop-types";
 import invariant from "invariant";
 import Events from "../../__internal__/utils/helpers/events";
 import StyledIconButton from "./icon-button.style";
 import { TooltipProvider } from "../../__internal__/tooltip-provider";
-import { ButtonBarContext } from "../button-bar/button-bar.component";
 import Logger from "../../__internal__/utils/logger";
 let onActionButtonWarnTriggered = false;
 const IconButton = /*#__PURE__*/React.forwardRef(({
@@ -22,8 +21,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
   }
   !!(onClick && onAction) ? process.env.NODE_ENV !== "production" ? invariant(false, "onClick and onAction have both been set, please use onClick as onAction will soon be deprecated") : invariant(false) : void 0;
   const [internalRef, setInternalRef] = useState();
-  const context = useContext(ButtonBarContext);
-  const ariaLabelValue = Object.keys(context).length ? ariaLabel || internalRef?.querySelector("[data-component='icon']")?.getAttribute("type") || undefined : ariaLabel;
+  const ariaLabelValue = ariaLabel || internalRef?.querySelector("[data-component='icon']")?.getAttribute("type") || "";
   const handleKeyDown = e => {
     if (Events.isEnterKey(e) || Events.isSpaceKey(e)) {
       e.preventDefault();

package/esm/components/sidebar/sidebar.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, { useCallback, useRef } from "react";
+import React, { useCallback, useRef, useMemo } from "react";
 import PropTypes from "prop-types";
 import Modal from "../modal";
 import StyledSidebar from "./sidebar.style";
@@ -11,7 +11,6 @@ import Box from "../box";
 import createGuid from "../../__internal__/utils/helpers/guid";
 import useLocale from "../../hooks/__internal__/useLocale";
 import { filterStyledSystemPaddingProps } from "../../style/utils";
-import useIsStickyFooterForm from "../../hooks/__internal__/useIsStickyFooterForm";
 import useModalAria from "../../hooks/__internal__/useModalAria/useModalAria";
 
 // TODO FE-5408 will investigate why React.RefObject<T> produces a failed prop type when current = null
@@ -44,7 +43,7 @@ const Sidebar = /*#__PURE__*/React.forwardRef(({
   const {
     current: headerId
   } = useRef(createGuid());
-  const hasStickyFooter = useIsStickyFooterForm(children);
+  const hasStickyFooter = useMemo(() => React.Children.toArray(children).some(child => /*#__PURE__*/React.isValidElement(child) && child.props.stickyFooter), [children]);
   const sidebarRef = useRef(null);
   const setRefs = useCallback(reference => {
     sidebarRef.current = reference;

package/lib/components/dialog/dialog.component.js

@@ -17,7 +17,6 @@ var _focusTrap = _interopRequireDefault(require("../../__internal__/focus-trap")
 var _iconButton = _interopRequireDefault(require("../icon-button"));
 var _icon = _interopRequireDefault(require("../icon"));
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
-var _useIsStickyFooterForm = _interopRequireDefault(require("../../hooks/__internal__/useIsStickyFooterForm"));
 var _useModalAria = _interopRequireDefault(require("../../hooks/__internal__/useModalAria/useModalAria"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
@@ -60,7 +59,6 @@ const Dialog = exports.Dialog = /*#__PURE__*/(0, _react.forwardRef)(({
   const {
     current: subtitleId
   } = (0, _react.useRef)((0, _guid.default)());
-  const hasStickyFooter = (0, _useIsStickyFooterForm.default)(children);
   const isTopModal = (0, _useModalAria.default)(containerRef);
   (0, _react.useImperativeHandle)(ref, () => ({
     focus() {
@@ -191,9 +189,7 @@ const Dialog = exports.Dialog = /*#__PURE__*/(0, _react.forwardRef)(({
     tabIndex: -1
   }, contentPadding, {
     backgroundColor: greyBackground ? "var(--colorsUtilityMajor025)" : "var(--colorsUtilityYang100)"
-  }), dialogTitle(), closeIcon(), /*#__PURE__*/_react.default.createElement(_dialog.StyledDialogContent, _extends({}, contentPadding, {
-    hasStickyFooter: hasStickyFooter
-  }), /*#__PURE__*/_react.default.createElement(_dialog.StyledDialogInnerContent, _extends({
+  }), dialogTitle(), closeIcon(), /*#__PURE__*/_react.default.createElement(_dialog.StyledDialogContent, contentPadding, /*#__PURE__*/_react.default.createElement(_dialog.StyledDialogInnerContent, _extends({
     ref: innerContentRef
   }, contentPadding), children)))));
 });

package/lib/components/dialog/dialog.style.d.ts

@@ -12,8 +12,6 @@ declare type StyledDialogTitleProps = {
     hasSubtitle?: boolean;
 };
 declare const StyledDialogTitle: import("styled-components").StyledComponent<"div", any, StyledDialogTitleProps, never>;
-declare const StyledDialogContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface & {
-    hasStickyFooter: boolean;
-}, never>;
+declare const StyledDialogContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface, never>;
 declare const StyledDialogInnerContent: import("styled-components").StyledComponent<"div", any, ContentPaddingInterface, never>;
 export { StyledDialog, StyledDialogTitle, StyledDialogContent, StyledDialogInnerContent, };

package/lib/components/dialog/dialog.style.js

@@ -126,11 +126,13 @@ const StyledDialogContent = exports.StyledDialogContent = _styledComponents.defa
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  ${({
-  hasStickyFooter
-}) => !hasStickyFooter && (0, _styledComponents.css)`
-      overflow-y: auto;
-    `}
+  overflow-y: auto;
+
+  /* Delegate handling overflow to child form if it has a sticky footer */
+  &:has(${_form.StyledFormContent}.sticky) {
+    overflow-y: inherit;
+  }
+
   width: 100%;
   flex: 1;
   padding: 0px ${_dialog.HORIZONTAL_PADDING}px ${_dialog.CONTENT_BOTTOM_PADDING}px;

package/lib/components/dialog-full-screen/content.style.d.ts

@@ -1,6 +1,5 @@
 declare type StyledContentProps = {
     hasHeader: boolean;
-    hasStickyFooter: boolean;
     disableContentPadding?: boolean;
 };
 declare const StyledContent: import("styled-components").StyledComponent<"div", any, StyledContentProps, never>;

package/lib/components/dialog-full-screen/content.style.js

@@ -9,65 +9,13 @@ var _form = require("../form/form.style");
 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 StyledContent = _styledComponents.default.div`
-  ${({
-  hasStickyFooter
-}) => !hasStickyFooter && (0, _styledComponents.css)`
-      overflow-y: auto;
-    `}
+  overflow-y: auto;
   padding: 0 16px;
   flex: 1;
 
-  ${_form.StyledFormContent}.sticky {
-    padding-right: 16px;
-    padding-left: 16px;
-    margin-right: -16px;
-    margin-left: -16px;
-
-    @media screen and (min-width: 600px) {
-      padding-right: 24px;
-      padding-left: 24px;
-      margin-right: -24px;
-      margin-left: -24px;
-    }
-    @media screen and (min-width: 960px) {
-      padding-right: 32px;
-      padding-left: 32px;
-      margin-right: -32px;
-      margin-left: -32px;
-    }
-    @media screen and (min-width: 1260px) {
-      padding-right: 40px;
-      padding-left: 40px;
-      margin-right: -40px;
-      margin-left: -40px;
-    }
-  }
-
-  ${_form.StyledFormFooter}.sticky {
-    padding: 16px;
-
-    margin-right: -16px;
-    margin-left: -16px;
-    width: calc(100% + 32px);
-
-    @media screen and (min-width: 600px) {
-      padding: 16px 24px;
-      margin-right: -24px;
-      margin-left: -24px;
-      width: calc(100% + 48px);
-    }
-    @media screen and (min-width: 960px) {
-      padding: 16px 32px;
-      margin-right: -32px;
-      margin-left: -32px;
-      width: calc(100% + 64px);
-    }
-    @media screen and (min-width: 1260px) {
-      padding: 16px 40px;
-      margin-right: -40px;
-      margin-left: -40px;
-      width: calc(100% + 80px);
-    }
+  /* Delegate handling overflow to child form if it has a sticky footer */
+  &:has(${_form.StyledFormContent}.sticky) {
+    overflow-y: inherit;
   }
 
   ${({
@@ -83,6 +31,59 @@ const StyledContent = _styledComponents.default.div`
       @media screen and (min-width: 1260px) {
         padding: 0 40px;
       }
+
+      ${_form.StyledFormContent}.sticky {
+        padding-right: 16px;
+        padding-left: 16px;
+        margin-right: -16px;
+        margin-left: -16px;
+
+        @media screen and (min-width: 600px) {
+          padding-right: 24px;
+          padding-left: 24px;
+          margin-right: -24px;
+          margin-left: -24px;
+        }
+        @media screen and (min-width: 960px) {
+          padding-right: 32px;
+          padding-left: 32px;
+          margin-right: -32px;
+          margin-left: -32px;
+        }
+        @media screen and (min-width: 1260px) {
+          padding-right: 40px;
+          padding-left: 40px;
+          margin-right: -40px;
+          margin-left: -40px;
+        }
+      }
+
+      ${_form.StyledFormFooter}.sticky {
+        padding: 16px;
+
+        margin-right: -16px;
+        margin-left: -16px;
+        width: calc(100% + 32px);
+
+        @media screen and (min-width: 600px) {
+          padding: 16px 24px;
+          margin-right: -24px;
+          margin-left: -24px;
+          width: calc(100% + 48px);
+        }
+        @media screen and (min-width: 960px) {
+          padding: 16px 32px;
+          margin-right: -32px;
+          margin-left: -32px;
+          width: calc(100% + 64px);
+        }
+        @media screen and (min-width: 1260px) {
+          padding: 16px 40px;
+          margin-right: -40px;
+          margin-left: -40px;
+          width: calc(100% + 80px);
+        }
+      }
     `}
 
     ${disableContentPadding && (0, _styledComponents.css)`

package/lib/components/dialog-full-screen/dialog-full-screen.component.js

@@ -16,7 +16,6 @@ var _focusTrap = _interopRequireDefault(require("../../__internal__/focus-trap")
 var _iconButton = _interopRequireDefault(require("../icon-button"));
 var _icon = _interopRequireDefault(require("../icon"));
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
-var _useIsStickyFooterForm = _interopRequireDefault(require("../../hooks/__internal__/useIsStickyFooterForm"));
 var _useModalAria = _interopRequireDefault(require("../../hooks/__internal__/useModalAria/useModalAria"));
 var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -58,7 +57,6 @@ const DialogFullScreen = ({
   const {
     current: subtitleId
   } = (0, _react.useRef)((0, _guid.default)());
-  const hasStickyFooter = (0, _useIsStickyFooterForm.default)(children);
   const isTopModal = (0, _useModalAria.default)(dialogRef);
   const closeIcon = () => {
     if (!showCloseIcon || !onCancel) return null;
@@ -118,8 +116,7 @@ const DialogFullScreen = ({
     hasHeader: title !== undefined,
     "data-element": "content",
     ref: contentRef,
-    disableContentPadding: disableContentPadding,
-    hasStickyFooter: hasStickyFooter
+    disableContentPadding: disableContentPadding
   }, children))));
 };
 exports.DialogFullScreen = DialogFullScreen;

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

@@ -20,6 +20,7 @@ const StyledFormContent = exports.StyledFormContent = _styledComponents.default.
   isInModal
 }) => (0, _styledComponents.css)`
     ${stickyFooter && (0, _styledComponents.css)`
+      /* Take responsibility for handling overflow away from parent modal */
       overflow-y: ${isInModal ? "auto" : "inherit"};
       flex: 1;
     `}

package/lib/components/hr/hr.component.js

@@ -25,6 +25,7 @@ const Hr = ({
   }
   return /*#__PURE__*/_react.default.createElement(_hr.default, _extends({
     "data-component": "hr",
+    "data-role": "hr",
     ml: marginLeft,
     mr: marginRight,
     mt: rest.mt || 3,

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

@@ -10,7 +10,6 @@ var _invariant = _interopRequireDefault(require("invariant"));
 var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
 var _iconButton = _interopRequireDefault(require("./icon-button.style"));
 var _tooltipProvider = require("../../__internal__/tooltip-provider");
-var _buttonBar = require("../button-bar/button-bar.component");
 var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
@@ -31,8 +30,7 @@ const IconButton = /*#__PURE__*/_react.default.forwardRef(({
   }
   !!(onClick && onAction) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "onClick and onAction have both been set, please use onClick as onAction will soon be deprecated") : (0, _invariant.default)(false) : void 0;
   const [internalRef, setInternalRef] = (0, _react.useState)();
-  const context = (0, _react.useContext)(_buttonBar.ButtonBarContext);
-  const ariaLabelValue = Object.keys(context).length ? ariaLabel || internalRef?.querySelector("[data-component='icon']")?.getAttribute("type") || undefined : ariaLabel;
+  const ariaLabelValue = ariaLabel || internalRef?.querySelector("[data-component='icon']")?.getAttribute("type") || "";
   const handleKeyDown = e => {
     if (_events.default.isEnterKey(e) || _events.default.isSpaceKey(e)) {
       e.preventDefault();

package/lib/components/sidebar/sidebar.component.js

@@ -16,7 +16,6 @@ var _box = _interopRequireDefault(require("../box"));
 var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
 var _utils = require("../../style/utils");
-var _useIsStickyFooterForm = _interopRequireDefault(require("../../hooks/__internal__/useIsStickyFooterForm"));
 var _useModalAria = _interopRequireDefault(require("../../hooks/__internal__/useModalAria/useModalAria"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
@@ -52,7 +51,7 @@ const Sidebar = exports.Sidebar = /*#__PURE__*/_react.default.forwardRef(({
   const {
     current: headerId
   } = (0, _react.useRef)((0, _guid.default)());
-  const hasStickyFooter = (0, _useIsStickyFooterForm.default)(children);
+  const hasStickyFooter = (0, _react.useMemo)(() => _react.default.Children.toArray(children).some(child => /*#__PURE__*/_react.default.isValidElement(child) && child.props.stickyFooter), [children]);
   const sidebarRef = (0, _react.useRef)(null);
   const setRefs = (0, _react.useCallback)(reference => {
     sidebarRef.current = reference;

package/package.json

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

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

@@ -1 +0,0 @@
-export { default } from "./useIsStickyFooterForm";

package/esm/hooks/__internal__/useIsStickyFooterForm/index.js

@@ -1 +0,0 @@
-export { default } from "./useIsStickyFooterForm";

package/esm/hooks/__internal__/useIsStickyFooterForm/useIsStickyFooterForm.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const _default: (children?: React.ReactNode) => boolean;
-export default _default;

package/esm/hooks/__internal__/useIsStickyFooterForm/useIsStickyFooterForm.js

@@ -1,6 +0,0 @@
-import React, { useMemo } from "react";
-import Form from "../../../components/form/form.component";
-export default (children => {
-  const isStickyFooterForm = useMemo(() => React.Children.toArray(children).some(child => /*#__PURE__*/React.isValidElement(child) && child.type?.displayName === Form.displayName && child.props.stickyFooter), [children]);
-  return isStickyFooterForm;
-});

package/lib/hooks/__internal__/useIsStickyFooterForm/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./useIsStickyFooterForm";

package/lib/hooks/__internal__/useIsStickyFooterForm/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _useIsStickyFooterForm.default;
-  }
-});
-var _useIsStickyFooterForm = _interopRequireDefault(require("./useIsStickyFooterForm"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/hooks/__internal__/useIsStickyFooterForm/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "../../../../esm/hooks/__internal__/useIsStickyFooterForm/index.js",
-  "main": "./index.js",
-  "types": "./index.d.ts"
-}

package/lib/hooks/__internal__/useIsStickyFooterForm/useIsStickyFooterForm.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-declare const _default: (children?: React.ReactNode) => boolean;
-export default _default;

package/lib/hooks/__internal__/useIsStickyFooterForm/useIsStickyFooterForm.js

@@ -1,16 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _form = _interopRequireDefault(require("../../../components/form/form.component"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
-var _default = children => {
-  const isStickyFooterForm = (0, _react.useMemo)(() => _react.default.Children.toArray(children).some(child => /*#__PURE__*/_react.default.isValidElement(child) && child.type?.displayName === _form.default.displayName && child.props.stickyFooter), [children]);
-  return isStickyFooterForm;
-};
-exports.default = _default;