carbon-react 158.41.2 → 158.43.0

package/esm/components/accordion/accordion-group/accordion-group.component.d.ts

@@ -2,6 +2,9 @@ import React from "react";
 import { MarginProps } from "styled-system";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 type AccordionGroupChild = React.ReactElement | boolean | null | undefined | Array<AccordionGroupChild>;
+/**
+ * @deprecated This component is deprecated and will be removed in a future release. Wrapping a group of Accordions in AccordionGroup is no longer required.
+ */
 export interface AccordionGroupProps extends MarginProps, TagProps {
     /** An Accordion or list of Accordion components to be rendered inside the AccordionGroup */
     children?: AccordionGroupChild;

package/esm/components/accordion/accordion-group/accordion-group.component.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import r,{useMemo as t,useCallback as n}from"react";import o from"invariant";import i from"../../../__internal__/utils/helpers/events/events.js";import{Accordion as c}from"../accordion.component.js";import{StyledAccordionGroup as l}from"../accordion.style.js";import a from"../../../__internal__/utils/helpers/tags/tags.js";import s from"../../../__internal__/utils/logger/index.js";function p(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}let f=!1;const u=u=>{var{children:y}=u,d=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(u,["children"]);f||(f=!0,s.deprecate("`AccordionGroup` is deprecated and will soon be removed."));const m=t((()=>{let e=!0;return r.Children.toArray(y).forEach((t=>{("string"==typeof t||r.isValidElement(t)&&"Accordion"!==t.type.displayName)&&(e=!1)})),e}),[y]);o(m,`AccordionGroup accepts only children of type \`${c.displayName}\`.`);const b=t((()=>r.Children.toArray(y).filter((e=>r.isValidElement(e)))),[y]),O=t((()=>b.map((e=>e.ref||r.createRef()))),[b]),j=n(((e,r)=>{var t;if(e.preventDefault(),-1===r)null===(t=O[O.length-1].current)||void 0===t||t.focus();else if(r===O.length){var n;null===(n=O[0].current)||void 0===n||n.focus()}else{var o;null===(o=O[r].current)||void 0===o||o.focus()}}),[O]),g=n(((e,r)=>{i.isUpKey(e)&&j(e,r-1),i.isDownKey(e)&&j(e,r+1),i.isHomeKey(e)&&j(e,0),i.isEndKey(e)&&j(e,O.length-1)}),[j,O]);return e(l,(v=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){p(e,r,t[r])}))}return e}({},d,a("accordion-group",d)),h=null!=(h={children:b.map(((e,t)=>r.cloneElement(e,{ref:O[t],index:t,handleKeyboardAccessibility:g})))})?h:{},Object.getOwnPropertyDescriptors?Object.defineProperties(v,Object.getOwnPropertyDescriptors(h)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(h)).forEach((function(e){Object.defineProperty(v,e,Object.getOwnPropertyDescriptor(h,e))})),v));var v,h};u.displayName="AccordionGroup";export{u as AccordionGroup,u as default};
+import{jsx as e}from"react/jsx-runtime";import r,{useMemo as t,useCallback as n}from"react";import o from"invariant";import i from"../../../__internal__/utils/helpers/events/events.js";import{Accordion as c}from"../accordion.component.js";import{StyledAccordionGroup as l}from"../accordion.style.js";import a from"../../../__internal__/utils/helpers/tags/tags.js";import s from"../../../__internal__/utils/logger/index.js";function p(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}let u=!1;const f=f=>{var{children:y}=f,d=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(f,["children"]);u||(u=!0,s.deprecate("`AccordionGroup` is deprecated and will be removed in a future release. Wrapping a group of Accordions in AccordionGroup is no longer required."));const m=t((()=>{let e=!0;return r.Children.toArray(y).forEach((t=>{("string"==typeof t||r.isValidElement(t)&&"Accordion"!==t.type.displayName)&&(e=!1)})),e}),[y]);o(m,`AccordionGroup accepts only children of type \`${c.displayName}\`.`);const b=t((()=>r.Children.toArray(y).filter((e=>r.isValidElement(e)))),[y]),O=t((()=>b.map((e=>e.ref||r.createRef()))),[b]),g=n(((e,r)=>{var t;if(e.preventDefault(),-1===r)null===(t=O[O.length-1].current)||void 0===t||t.focus();else if(r===O.length){var n;null===(n=O[0].current)||void 0===n||n.focus()}else{var o;null===(o=O[r].current)||void 0===o||o.focus()}}),[O]),j=n(((e,r)=>{i.isUpKey(e)&&g(e,r-1),i.isDownKey(e)&&g(e,r+1),i.isHomeKey(e)&&g(e,0),i.isEndKey(e)&&g(e,O.length-1)}),[g,O]);return e(l,(v=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){p(e,r,t[r])}))}return e}({},d,a("accordion-group",d)),h=null!=(h={children:b.map(((e,t)=>r.cloneElement(e,{ref:O[t],index:t,handleKeyboardAccessibility:j})))})?h:{},Object.getOwnPropertyDescriptors?Object.defineProperties(v,Object.getOwnPropertyDescriptors(h)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(h)).forEach((function(e){Object.defineProperty(v,e,Object.getOwnPropertyDescriptor(h,e))})),v));var v,h};f.displayName="AccordionGroup";export{f as AccordionGroup,f as default};

package/esm/components/accordion/accordion.component.d.ts

@@ -1,39 +1,70 @@
 import React from "react";
 import { SpaceProps } from "styled-system";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
-import { StyledAccordionContainerProps } from "./accordion.style";
-export interface AccordionProps extends StyledAccordionContainerProps, SpaceProps, TagProps {
+export interface AccordionProps extends SpaceProps, TagProps {
+    id?: string;
     /** Content of the Accordion component */
     children?: React.ReactNode;
-    /** Set the default state of expansion of the Accordion if component is meant to be used as uncontrolled */
+    /** Set the default state of expansion of the Accordion if component is to be used as uncontrolled */
     defaultExpanded?: boolean;
-    /** Disable padding for the content */
+    /**
+     * Disable padding for the content.
+     * @deprecated Padding is no longer applied to the Accordion content by default. Any desired spacing can be applied directly to the provided content.
+     */
     disableContentPadding?: boolean;
-    /** Sets the expansion state of the Accordion if component is meant to be used as controlled */
+    /** Sets the expansion state of the Accordion if component is to be used as controlled */
     expanded?: boolean;
-    /** An error message to be displayed in the tooltip */
-    error?: string;
     /** Styled system spacing props provided to Accordion Title */
     headerSpacing?: SpaceProps;
-    id?: string;
-    /** Sets icon type */
-    iconType?: "chevron_down" | "chevron_down_thick" | "dropdown";
-    /** Sets icon alignment */
-    iconAlign?: "left" | "right";
-    /** Sets accordion title */
+    /** Title of the Accordion */
     title: React.ReactNode;
-    /** An info message to be displayed in the tooltip */
-    info?: string;
-    /** Callback fired when expansion state changes */
-    onChange?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
-    /** When the Accordion is open the title can change to this */
+    /** Title of the Accordion when it is open */
     openTitle?: string;
-    /** Sets accordion size */
-    size?: "large" | "small";
     /** Sets accordion sub title */
     subTitle?: string;
-    /** A warning message to be displayed in the tooltip */
+    /** Callback fired when expansion state changes */
+    onChange?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
+    /** Sets Accordion size */
+    size?: "small" | "medium" | "large";
+    /**
+     * Sets Accordion borders.
+     *
+     * **Deprecation Warning:** The "full" borders are deprecated and will be removed in a future release.
+     */
+    borders?: "default" | "none" | "full";
+    /** Sets Accordion width */
+    width?: string;
+    /**
+     * Sets Accordion variant.
+     *
+     * **Deprecation Warning:** The "subtle" variant is deprecated, please use "simple" instead.
+     */
+    variant?: "standard" | "simple" | "subtle";
+    /**
+     * Sets icon type
+     * @deprecated Custom icon types on accordions are deprecated and will be removed in a future release.
+     */
+    iconType?: "chevron_down" | "chevron_down_thick" | "dropdown";
+    /**
+     * Sets icon alignment.
+     * @deprecated Icon alignment on accordions is deprecated and will be removed in a future release. Icons will now render on the left by default.
+     */
+    iconAlign?: "left" | "right";
+    /**
+     * An error message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
+    error?: string;
+    /**
+     * A warning message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
     warning?: string;
+    /**
+     * An info message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
+    info?: string;
 }
 export interface AccordionInternalProps {
     /** @ignore @private */

package/esm/components/accordion/accordion.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as n,Fragment as r}from"react/jsx-runtime";import t,{useState as i,useRef as o,useEffect as a,useCallback as c}from"react";import l from"../../__internal__/utils/helpers/tags/tags.js";import d from"../../hooks/__internal__/useResizeObserver/useResizeObserver.js";import s from"../../__internal__/utils/helpers/guid/index.js";import u from"../../__internal__/utils/helpers/events/events.js";import{StyledAccordionContainer as p,StyledAccordionTitleContainer as b,StyledAccordionHeadingsContainer as f,StyledAccordionTitle as h,StyledAccordionSubTitle as g,StyledAccordionIcon as m,StyledAccordionContentContainer as y,StyledAccordionContent as v}from"./accordion.style.js";import{ValidationIcon as O}from"../../__internal__/validations/validation-icon.component.js";function _(e,n,r){return n in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function j(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{},t=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),t.forEach((function(n){_(e,n,r[n])}))}return e}function w(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n.push.apply(n,r)}return n}(Object(n)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})),e}const x=t.forwardRef(((t,_)=>{var{borders:x="default",defaultExpanded:P,expanded:A,onChange:E,children:S,handleKeyboardAccessibility:C,id:k,index:z,iconType:D,iconAlign:T,size:K="large",subTitle:H,title:I,width:R,headerSpacing:$,disableContentPadding:L=!1,error:N,warning:V,info:q,openTitle:B,variant:F="standard"}=t,G=function(e,n){if(null==e)return{};var r,t,i=function(e,n){if(null==e)return{};var r,t,i={},o=Object.keys(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||(i[r]=e[r]);return i}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}(t,["borders","defaultExpanded","expanded","onChange","children","handleKeyboardAccessibility","id","index","iconType","iconAlign","size","subTitle","title","width","headerSpacing","disableContentPadding","error","warning","info","openTitle","variant"]);const J=void 0!==A,[M,Q]=i(P||!1),[U,W]=i(M?"auto":0),X=o(null),Y=o(null),Z=J?A:M;d(X,(()=>{var e;W(null===(e=X.current)||void 0===e?void 0:e.scrollHeight)})),a((()=>{var e;W(null===(e=X.current)||void 0===e?void 0:e.scrollHeight)}),[Z]);const ee=c((e=>{J||Q(!Z),null==E||E(e,!Z)}),[J,Z,E]);a((()=>{var e,n;Z?null===(e=Y.current)||void 0===e||e.removeAttribute("hidden"):null===(n=Y.current)||void 0===n||n.setAttribute("hidden","until-found")}),[Z]),a((()=>{const e=Y.current;if(!e)return;const n=e=>{ee(e)};return e.addEventListener("beforematch",n),()=>e.removeEventListener("beforematch",n)}),[ee,J,E]);const ne=c((e=>{C&&C(e,z),(u.isEnterKey(e)||u.isSpaceKey(e))&&(e.preventDefault(),ee(e))}),[C,z,ee]),re=o(s()),te=k||`Accordion_${re.current}`,ie=`AccordionHeader_${re.current}`,oe=`AccordionContent_${re.current}`,ae=!!(N||V||q);return e(p,w(j({id:te,width:R,borders:"subtle"===F?"none":x,variant:F},G,l("accordion",G)),{children:[e(b,w(j({"data-element":"accordion-title-container",id:ie,"aria-expanded":Z,"aria-controls":oe,onClick:ee,onKeyDown:ne,tabIndex:0,iconAlign:T||("standard"===F?"right":"left"),ref:_,size:K,isExpanded:Z,variant:F,role:"button"},$),{children:[e(f,{"data-element":"accordion-headings-container",hasValidationIcon:ae,children:["string"==typeof I?n(h,{"data-element":"accordion-title",size:K,variant:F,children:Z&&B||I}):Z&&B||I,"subtle"!==F&&e(r,{children:[ae&&n(O,{error:N,warning:V,info:q,tooltipPosition:"top",tabIndex:0,ml:1}),H&&"large"===K&&"standard"===F&&n(g,{children:H})]})]}),n(m,{"data-element":"accordion-icon",type:D||("small"===K||"subtle"===F?"chevron_down_thick":"chevron_down"),isExpanded:Z,iconAlign:T||("standard"===F?"right":"left")})]})),n(y,{ref:Y,isExpanded:Z,maxHeight:U,"data-role":"accordion-content-container",children:n(v,{role:"region","data-element":"accordion-content","data-role":"accordion-content",id:oe,"aria-labelledby":ie,ref:X,disableContentPadding:L,variant:F,children:S})})]}))}));x.displayName="Accordion";export{x as Accordion,x as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import n,{useState as t,useRef as o,useEffect as i,useCallback as a}from"react";import c from"../../__internal__/utils/helpers/tags/tags.js";import l from"../../hooks/__internal__/useResizeObserver/useResizeObserver.js";import d from"../../__internal__/utils/helpers/guid/index.js";import s from"../../__internal__/utils/helpers/events/events.js";import{StyledAccordionContainer as u,StyledAccordionTitleContainer as p,StyledAccordionTitleWrapper as f,StyledAccordionSubTitle as b,StyledAccordionContentContainer as m,StyledAccordionLine as y,StyledAccordionContent as h,StyledAccordionIcon as v,StyledAccordionTitle as g}from"./accordion.style.js";import{Button as O}from"../button/__next__/button.component.js";import j from"../../hooks/useMediaQuery/useMediaQuery.js";function _(e,r,n){return r in e?Object.defineProperty(e,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[r]=n,e}function w(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),t.forEach((function(r){_(e,r,n[r])}))}return e}function x(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r}(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))})),e}const $=n.forwardRef(((n,_)=>{var{borders:$="default",defaultExpanded:P,expanded:A,onChange:E,children:S,handleKeyboardAccessibility:T,id:k,index:z,iconType:C,iconAlign:D,size:K="medium",subTitle:M,title:H,width:R,headerSpacing:I,disableContentPadding:L,error:N,warning:Q,info:q,openTitle:B,variant:F="standard"}=n,G=function(e,r){if(null==e)return{};var n,t,o=function(e,r){if(null==e)return{};var n,t,o={},i=Object.keys(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||(o[n]=e[n]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(t=0;t<i.length;t++)n=i[t],r.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}(n,["borders","defaultExpanded","expanded","onChange","children","handleKeyboardAccessibility","id","index","iconType","iconAlign","size","subTitle","title","width","headerSpacing","disableContentPadding","error","warning","info","openTitle","variant"]);const J=void 0!==A,[U,V]=t(P||!1),[W,X]=t(U?"auto":0),Y=o(null),Z=o(null),ee=J?A:U;l(Y,(()=>{var e;X(null===(e=Y.current)||void 0===e?void 0:e.scrollHeight)})),i((()=>{var e;X(null===(e=Y.current)||void 0===e?void 0:e.scrollHeight)}),[ee]);const re=j("screen and (prefers-reduced-motion: no-preference)"),ne=a((e=>{J||V(!ee),null==E||E(e,!ee)}),[J,ee,E]),te=re?400:0;i((()=>{var e;if(!ee){const e=setTimeout((()=>{var e;null===(e=Z.current)||void 0===e||e.setAttribute("hidden","until-found")}),te);return()=>clearTimeout(e)}null===(e=Z.current)||void 0===e||e.removeAttribute("hidden")}),[ee,te]),i((()=>{const e=Z.current;if(!e)return;const r=e=>{ne(e)};return e.addEventListener("beforematch",r),()=>e.removeEventListener("beforematch",r)}),[ne,J,E]);const oe=a((e=>{T&&T(e,z),(s.isEnterKey(e)||s.isSpaceKey(e))&&(e.preventDefault(),ne(e))}),[T,z,ne]),ie=o(d()),ae=k||`Accordion_${ie.current}`,ce=`AccordionHeader_${ie.current}`,le=`AccordionContent_${ie.current}`,de="large"===K?"medium":K,se="subtle"===F?"simple":F,ue=()=>ee&&B||H,pe=()=>r(v,{"data-element":"accordion-icon","data-role":"accordion-icon",type:C||("standard"===F&&"medium"===de?"chevron_down":"chevron_down_thick"),$isExpanded:ee,$allowMotion:re});return e(u,x(w({id:ae,$width:R,$borders:$,$variant:se,$isExpanded:ee,$allowMotion:re},G,c("accordion",G)),{children:["simple"===se?e(O,{"data-role":"accordion-simple-button",id:ce,"aria-expanded":ee,"aria-controls":le,onClick:ne,variantType:"tertiary",size:K,className:ee?"active":"",children:[pe(),ue()]}):e(p,x(w({"data-element":"accordion-title-container",id:ce,"aria-expanded":ee,"aria-controls":le,onClick:ne,onKeyDown:oe,tabIndex:0,ref:_,role:"button",$size:de,$iconAlign:D},I),{children:[pe(),e(f,{children:["string"==typeof H?r(g,{"data-element":"accordion-title",$size:de,children:ue()}):ue(),M&&r(b,{"data-element":"accordion-subtitle",$size:de,children:M})]})]})),e(m,{ref:Z,$isExpanded:ee,$height:W,$allowMotion:re,"data-role":"accordion-content-container",children:["simple"===se&&r(y,{}),r(h,{role:"region","data-element":"accordion-content","data-role":"accordion-content",id:le,"aria-labelledby":ce,ref:Y,$variant:se,children:S})]})]}))}));$.displayName="Accordion";export{$ as Accordion,$ as default};

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

@@ -1,50 +1,26 @@
-declare const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {
+export interface StyledAccordionProps {
+    $borders?: "default" | "full" | "none";
+    $width?: string;
+    $variant?: "standard" | "simple";
+    $isExpanded?: boolean;
+    $allowMotion?: boolean;
+    $size?: "small" | "medium";
+    $iconAlign?: "left" | "right";
+    $height?: string | number;
+}
+export declare const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {
     theme: object;
 }, "theme">;
-export interface StyledAccordionContainerProps {
-    /** Toggles left and right borders, set to none when variant is subtle */
-    borders?: "default" | "full" | "none";
-    /** Sets accordion width */
-    width?: string;
-    /** Sets accordion variant */
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, {
+export declare const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, {
     theme: object;
-} & StyledAccordionContainerProps, "theme">;
-interface StyledAccordionTitleProps {
-    size?: "large" | "small";
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, StyledAccordionTitleProps, never>;
-declare const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
-interface StyledAccordionIconProps {
-    isExpanded?: boolean;
-    iconAlign?: "left" | "right";
-}
-declare const StyledAccordionIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, StyledAccordionIconProps, never>;
-interface StyledAccordionHeadingsContainerProps {
-    hasValidationIcon?: boolean;
-}
-declare const StyledAccordionHeadingsContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionHeadingsContainerProps, never>;
-interface StyledAccordionTitleContainerProps {
-    hasButtonProps?: boolean;
-    iconAlign?: "left" | "right";
-    size?: "large" | "small";
-    isExpanded?: boolean;
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, {
+} & StyledAccordionProps, "theme">;
+export declare const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, StyledAccordionProps, never>;
+export declare const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, StyledAccordionProps, never>;
+export declare const StyledAccordionIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, StyledAccordionProps, never>;
+export declare const StyledAccordionTitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, {
     theme: object;
-} & StyledAccordionTitleContainerProps, "theme">;
-export interface StyledAccordionContentContainerProps {
-    isExpanded?: boolean;
-    maxHeight?: string | number;
-}
-declare const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionContentContainerProps, never>;
-export interface StyledAccordionContentProps {
-    disableContentPadding?: boolean;
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionContentProps, never>;
-export { StyledAccordionGroup, StyledAccordionContainer, StyledAccordionHeadingsContainer, StyledAccordionSubTitle, StyledAccordionTitleContainer, StyledAccordionTitle, StyledAccordionIcon, StyledAccordionContent, StyledAccordionContentContainer, };
+} & StyledAccordionProps, "theme">;
+export declare const StyledAccordionLine: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionProps, never>;
+export declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionProps, never>;

package/esm/components/accordion/accordion.style.js

@@ -1 +1 @@
-import o,{css as i}from"styled-components";import{margin as t,space as n}from"styled-system";import r from"../icon/icon.component.js";import a from"../../style/themes/apply-base-theme.js";import e from"../../__internal__/validations/validation-icon.style.js";import s from"../../style/utils/add-focus-styling.js";const c=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionGroup",componentId:"sc-a73079b2-0"})(["",""],t),d=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-a73079b2-1"})([""," display:flex;",";justify-content:center;flex-direction:column;box-sizing:border-box;width:",";color:var(--colorsUtilityYin090);background-color:",";border:1px solid var(--colorsUtilityMajor100);"," "," ",""],n,(({variant:o})=>o&&i(["align-items:stretch;"])),(({width:o})=>o||"100%"),(({variant:o})=>"subtle"!==o?"var(--colorsUtilityYang100)":"var(--colorsUtilityMajorTransparent)"),(({borders:o})=>"default"===o&&i(["border-left:none;border-right:none;"])),(({borders:o})=>"none"===o&&i(["border:none;"])),(({variant:o})=>"subtle"!==o&&i(["& + &{margin-top:-1px;border-top:1px solid var(--colorsUtilityMajor100);border-bottom:1px solid var(--colorsUtilityMajor100);}"]))),l=o.h3.withConfig({displayName:"accordion.style__StyledAccordionTitle",componentId:"sc-a73079b2-2"})(["font-size:",";font-weight:500;line-height:1;user-select:none;margin:0;"],(({size:o,variant:i})=>"small"===o||"subtle"===i?"var(--fontSizes200)":"var(--fontSizes400)")),p=o.span.withConfig({displayName:"accordion.style__StyledAccordionSubTitle",componentId:"sc-a73079b2-3"})(["margin-top:8px;"]),g=o(r).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-a73079b2-4"})(["transition:transform 0.3s;transform:rotate(0deg);margin-right:",";"," color:var(--colorsActionMinor500);"],(({iconAlign:o})=>"left"===o?"var(--spacing200)":"var(--spacing000)"),(({isExpanded:o,iconAlign:i})=>o&&("right"===i?"transform: rotate(180deg);":"transform: rotate(-180deg);"))),m=o.div.withConfig({displayName:"accordion.style__StyledAccordionHeadingsContainer",componentId:"sc-a73079b2-5"})(["padding-right:var(--sizing300);",""],(({hasValidationIcon:o})=>i(["display:grid;"," "," ","{height:20px;position:relative;top:2px;}"],o&&i(["grid-template-columns:min-content auto;","{grid-column:span 3;}"],p),!o&&i(["grid-template-rows:auto auto;"]),e))),v=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-a73079b2-6"})(["",""],(({iconAlign:o,size:t,isExpanded:r,variant:a})=>i(["padding:",";"," display:flex;align-items:center;justify-content:space-between;"," cursor:pointer;z-index:1;&:focus{","}"," ",""],"small"===t?"var(--spacing200)":"var(--spacing300)",n,"left"===o&&i(["justify-content:flex-end;flex-direction:row-reverse;"]),s(),"subtle"===a&&i(["color:var(--colorsActionMajor500);padding:var(--spacing025);margin-bottom:",";width:fit-content;","{color:var(--colorsActionMajor500);",";}:hover{color:var(--colorsActionMajor600);","{color:var(--colorsActionMajor600);}}"],r&&"var(--spacing200)",g,"left"===o&&"margin-right: var(--spacing050)",g),"subtle"!==a&&i(["&:hover{background-color:var(--colorsUtilityMajor050);}"])))),y=o.div.withConfig({displayName:"accordion.style__StyledAccordionContentContainer",componentId:"sc-a73079b2-7"})(["flex-grow:1;box-sizing:border-box;overflow:hidden;transition:all 0.3s;",""],(({maxHeight:o,isExpanded:t})=>i(["max-height:",";height:",";"],t?`${o}px`:"0px",t?`${o}px`:"0px"))),f=o.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-a73079b2-8"})(["padding:var(--spacing300);padding-top:var(--spacing100);overflow:hidden;"," ",""],(({variant:o})=>"subtle"===o&&i(["margin-left:var(--spacing150);padding:var(--spacing100) var(--spacing200) var(--spacing300);border-left:2px solid var(--colorsUtilityMajor100);"])),(({disableContentPadding:o})=>o&&i(["padding:0;"])));export{d as StyledAccordionContainer,f as StyledAccordionContent,y as StyledAccordionContentContainer,c as StyledAccordionGroup,m as StyledAccordionHeadingsContainer,g as StyledAccordionIcon,p as StyledAccordionSubTitle,l as StyledAccordionTitle,v as StyledAccordionTitleContainer};
+import o,{css as t}from"styled-components";import{margin as e,space as i}from"styled-system";import n from"../icon/icon.component.js";import a from"../../style/themes/apply-base-theme.js";import r from"../../style/utils/add-focus-styling.js";const l={small:{titleFont:"var(--global-font-static-section-heading-s)",subtitleFont:"var(--global-font-static-comp-medium-s)",headingPadding:"var(--global-space-comp-l)"},medium:{titleFont:"var(--global-font-static-section-heading-m)",subtitleFont:"var(--global-font-static-comp-medium-l)",headingPadding:"var(--global-space-comp-xl)"}},c=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionGroup",componentId:"sc-5e39e462-0"})(["",""],e),d=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-5e39e462-1"})(["display:flex;align-items:stretch;justify-content:center;flex-direction:column;box-sizing:border-box;width:",";"," &&{","}"],(({$width:o})=>o||"100%"),(({$variant:o,$borders:e,$isExpanded:i,$allowMotion:n})=>t([""," ",""],"standard"===o&&t(["& + &{margin-top:-1px;}border:1px solid var(--container-action-border-default);",";",";"],"default"===e&&t(["border-left:none;border-right:none;"]),"none"===e&&t(["border:none;"])),"simple"===o&&t(["gap:",";",""],i?"var(--global-space-comp-l)":"0px",n&&t(["transition:gap 0.4s;"])))),i),s=o.h3.withConfig({displayName:"accordion.style__StyledAccordionTitle",componentId:"sc-5e39e462-2"})([""," color:var(--container-action-txt-default);margin:0;"],(({$size:o})=>o&&t(["font:",";"],l[o].titleFont))),p=o.span.withConfig({displayName:"accordion.style__StyledAccordionSubTitle",componentId:"sc-5e39e462-3"})([""," color:var(--container-action-txt-alt-default);"],(({$size:o})=>o&&t(["font:",";"],l[o].subtitleFont))),m=o(n).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-5e39e462-4"})(["width:var(--global-size-2-xs);height:var(--global-size-2-xs);color:var(--container-action-icon-default);",";"],(({$isExpanded:o,$allowMotion:e})=>t(["transform:rotate(0deg);"," ",""],o&&t(["transform:rotate(-180deg);"]),e&&t(["transition:transform 0.4s;"])))),g=o.div.withConfig({displayName:"accordion.style__StyledAccordionTitleWrapper",componentId:"sc-5e39e462-5"})(["display:flex;flex-direction:column;align-items:flex-start;gap:var(--global-space-comp-xs);flex:1 0 0;"]),f=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-5e39e462-6"})(["",""],(({$size:o,$iconAlign:e})=>o&&t(["display:flex;flex:1 0 0;align-items:center;align-self:stretch;background-color:transparent;border:none;text-align:left;gap:var(--global-space-comp-l);padding:",";"," "," &:hover{cursor:pointer;background-color:var(--container-action-bg-hover);}&:focus{"," z-index:1;}"],l[o].headingPadding,"right"===e&&t(["flex-direction:row-reverse;"]),i,r()))),y=o.div.withConfig({displayName:"accordion.style__StyledAccordionLine",componentId:"sc-5e39e462-7"})(["position:absolute;width:2px;background-color:var(--input-typical-border-alt);border-radius:var(--global-radius-action-xs);height:100%;"]),h=o.div.withConfig({displayName:"accordion.style__StyledAccordionContentContainer",componentId:"sc-5e39e462-8"})(["position:relative;overflow:hidden;height:0;opacity:0;",""],(({$height:o,$isExpanded:e,$allowMotion:i})=>t([""," ",""],i&&t(["transition:height 0.4s,opacity 0.2s;"]),e&&t(["height:","px;opacity:1;"],o)))),b=o.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-5e39e462-9"})(["",""],(({$variant:o})=>t(["overflow:hidden;",""],"simple"===o&&t(["margin-left:var(--global-space-comp-l);"]))));export{d as StyledAccordionContainer,b as StyledAccordionContent,h as StyledAccordionContentContainer,c as StyledAccordionGroup,m as StyledAccordionIcon,y as StyledAccordionLine,p as StyledAccordionSubTitle,s as StyledAccordionTitle,f as StyledAccordionTitleContainer,g as StyledAccordionTitleWrapper};

package/esm/components/button/__next__/button.style.js

@@ -1 +1 @@
-import o,{css as e}from"styled-components";import{space as i}from"styled-system";import r from"../../../style/utils/add-focus-styling.js";import{gradientAnimation as n,propsForSize as a,inverseColourSettings as t,colourSettings as d}from"./button.config.js";const l=o.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-c07486b9-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),c=o.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-c07486b9-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],i,(({$allowMotion:o,disabled:i,$inverse:r,$size:l,$variant:c,$variantType:s,$iconOnly:b})=>r?(({disabled:o,size:i,variantType:r,iconOnly:n})=>{const{background:d,border:l,label:c}=t[r],{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],d.default,"tertiary"===r?"1px":"2px",l.default,n?"var(--global-radius-action-circle)":s,c.default,b,u,n?u:"max-content",v,n?"":g,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],d.disabled,l.disabled,c.disabled):e(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],d.active,c.active,l.active,d.hover,c.hover,l.hover))})({disabled:i,size:l,variantType:s,iconOnly:b}):"gradient"===c?e([""," ",""],n,(({allowMotion:o=!0,disabled:i,size:r,iconOnly:n})=>{const{background:t,border:l,label:c}=d.gradient.secondary||{},{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[r];return e(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],n?"var(--global-radius-action-circle)":s,b,u,n?u:"max-content",v,n?"":g,o&&e(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),i&&e(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!i&&e(["&:active{background:",";color:",";border-color:",";}"],null==t?void 0:t.active,null==c?void 0:c.active,null==l?void 0:l.active))})({allowMotion:o,disabled:i,size:l,iconOnly:b})):(({disabled:o,size:i,variant:r,variantType:n,iconOnly:t})=>{const{background:l,border:c,label:s}=d[r][n]||{},{borderRadius:b,font:u,height:v,paddingVertical:g,paddingHorizontal:p}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==l?void 0:l.default,"tertiary"===n?"1px":"2px",null==c?void 0:c.default,t?"var(--global-radius-action-circle)":b,null==s?void 0:s.default,u,v,t?v:"max-content",g,t?"":p,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==l?void 0:l.disabled,null==c?void 0:c.disabled,null==s?void 0:s.disabled):e(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==l?void 0:l.active,null==s?void 0:s.active,null==c?void 0:c.active,null==l?void 0:l.hover,null==s?void 0:s.hover,null==c?void 0:c.hover))})("xs"!==l||"primary"!==s&&"default"===c?"destructive"!==c||"tertiary"!==s&&"subtle"!==s?{disabled:i,size:l,variant:c,variantType:s,iconOnly:b}:{disabled:i,size:l,variant:c,variantType:"primary",iconOnly:b}:{disabled:i,size:"xs",variant:"default",variantType:"secondary",iconOnly:b})),(({$fullWidth:o,$size:i,$noWrap:r})=>e([""," ",""],o&&e(["width:100%;"]),r?"white-space: nowrap;":`\n        flex-flow: wrap;\n        min-height: ${a[i].height};\n        height: unset;\n      `)),r());export{c as StyledButton,l as StyledContentContainer,c as default};
+import o,{css as e}from"styled-components";import{space as i}from"styled-system";import r from"../../../style/utils/add-focus-styling.js";import{gradientAnimation as n,propsForSize as a,inverseColourSettings as t,colourSettings as d}from"./button.config.js";const l=o.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-1660f692-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),c=o.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-1660f692-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],i,(({$allowMotion:o,disabled:i,$inverse:r,$size:l,$variant:c,$variantType:s,$iconOnly:b})=>r?(({disabled:o,size:i,variantType:r,iconOnly:n})=>{const{background:d,border:l,label:c}=t[r],{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],d.default,"tertiary"===r?"1px":"2px",l.default,n?"var(--global-radius-action-circle)":s,c.default,b,u,n?u:"max-content",v,n?"":g,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],d.disabled,l.disabled,c.disabled):e(["&:active,&.active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],d.active,c.active,l.active,d.hover,c.hover,l.hover))})({disabled:i,size:l,variantType:s,iconOnly:b}):"gradient"===c?e([""," ",""],n,(({allowMotion:o=!0,disabled:i,size:r,iconOnly:n})=>{const{background:t,border:l,label:c}=d.gradient.secondary||{},{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[r];return e(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],n?"var(--global-radius-action-circle)":s,b,u,n?u:"max-content",v,n?"":g,o&&e(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),i&&e(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!i&&e(["&:active,&.active{background:",";color:",";border-color:",";}"],null==t?void 0:t.active,null==c?void 0:c.active,null==l?void 0:l.active))})({allowMotion:o,disabled:i,size:l,iconOnly:b})):(({disabled:o,size:i,variant:r,variantType:n,iconOnly:t})=>{const{background:l,border:c,label:s}=d[r][n]||{},{borderRadius:b,font:u,height:v,paddingVertical:g,paddingHorizontal:p}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==l?void 0:l.default,"tertiary"===n?"1px":"2px",null==c?void 0:c.default,t?"var(--global-radius-action-circle)":b,null==s?void 0:s.default,u,v,t?v:"max-content",g,t?"":p,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==l?void 0:l.disabled,null==c?void 0:c.disabled,null==s?void 0:s.disabled):e(["&:active,&.active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==l?void 0:l.active,null==s?void 0:s.active,null==c?void 0:c.active,null==l?void 0:l.hover,null==s?void 0:s.hover,null==c?void 0:c.hover))})("xs"!==l||"primary"!==s&&"default"===c?"destructive"!==c||"tertiary"!==s&&"subtle"!==s?{disabled:i,size:l,variant:c,variantType:s,iconOnly:b}:{disabled:i,size:l,variant:c,variantType:"primary",iconOnly:b}:{disabled:i,size:"xs",variant:"default",variantType:"secondary",iconOnly:b})),(({$fullWidth:o,$size:i,$noWrap:r})=>e([""," ",""],o&&e(["width:100%;"]),r?"white-space: nowrap;":`\n        flex-flow: wrap;\n        min-height: ${a[i].height};\n        height: unset;\n      `)),r());export{c as StyledButton,l as StyledContentContainer,c as default};

package/esm/components/sidebar/sidebar.component.d.ts

@@ -49,6 +49,8 @@ export interface SidebarProps extends PaddingProps, TagProps, WidthProps, Pick<M
     role?: string;
     /** Sets the size of the sidebar when open. */
     size?: "extra-small" | "small" | "medium-small" | "medium" | "medium-large" | "large" | "extra-large";
+    /** Enables width animation when the sidebar width changes. */
+    widthAnimation?: boolean;
     /** an optional array of refs to containers whose content should also be reachable by tabbing from the sidebar */
     focusableContainers?: RefObject<HTMLElement>[];
     /** Optional selector to identify the focusable elements, if not provided a default selector is used */

package/esm/components/sidebar/sidebar.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import t,{useRef as o,useCallback as a}from"react";import n from"../../__internal__/modal/modal.component.js";import{StyledSidebar as i,StyledSidebarContent as l}from"./sidebar.style.js";import s from"../icon-button/icon-button.component.js";import c from"../icon/icon.component.js";import d from"../../__internal__/focus-trap/focus-trap.component.js";import u,{SidebarSubHeader as b}from"./__internal__/sidebar-header/sidebar-header.component.js";import p from"../../__internal__/utils/helpers/guid/index.js";import m from"../../hooks/__internal__/useLocale/useLocale.js";import f from"../../style/utils/filter-styled-system-padding-props.js";import y from"../../__internal__/utils/helpers/tags/tags.js";import O from"../../hooks/__internal__/useModalAria/useModalAria.js";import h from"./__internal__/sidebar.context.js";function j(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function _(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){j(e,r,t[r])}))}return e}function g(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const P=t.forwardRef(((t,j)=>{var{"aria-describedby":P,"aria-label":w,"aria-labelledby":v,"data-element":k="sidebar","data-role":F,open:S,bespokeFocusTrap:C,closeButtonDataProps:E,disableAutoFocus:x=!1,disableEscKey:D=!1,enableBackgroundUI:I=!1,header:B,headerVariant:M="light",subHeader:A,position:H="right",size:N="medium",children:z,onCancel:K,role:L="dialog",focusFirstElement:R,focusableContainers:T,focusableSelectors:U,width:V,headerPadding:W={},subHeaderPadding:q={},topModalOverride:G,restoreFocusOnClose:J=!0,className:Q,hidden:X}=t,Y=function(e,r){if(null==e)return{};var t,o,a=function(e,r){if(null==e)return{};var t,o,a={},n=Object.keys(e);for(o=0;o<n.length;o++)t=n[o],r.indexOf(t)>=0||(a[t]=e[t]);return a}(e,r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(o=0;o<n.length;o++)t=n[o],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}(t,["aria-describedby","aria-label","aria-labelledby","data-element","data-role","open","bespokeFocusTrap","closeButtonDataProps","disableAutoFocus","disableEscKey","enableBackgroundUI","header","headerVariant","subHeader","position","size","children","onCancel","role","focusFirstElement","focusableContainers","focusableSelectors","width","headerPadding","subHeaderPadding","topModalOverride","restoreFocusOnClose","className","hidden"]);const Z=m(),{current:$}=o(p()),{current:ee}=o(p()),re=o(null),te=a((e=>{re.current=e,j&&("object"==typeof j&&(j.current=e),"function"==typeof j&&j(e))}),[j]),oe=O(re,X),ae=()=>K?r(s,g(_({"aria-label":Z.sidebar.ariaLabels.close(),onClick:K},y("close",_({"data-element":"close"},E))),{children:r(c,{type:"close"})})):null,ne=e(i,{"aria-modal":!I&&oe,"aria-describedby":P||ee,"aria-label":w,"aria-labelledby":v||w?v:$,"data-component":"sidebar","data-element":k,"data-role":F,ref:te,position:H,size:N,onCancel:K,role:L,width:V,className:Q,children:[B&&r(u,g(_({headerVariant:M,closeIcon:ae()},W),{id:$,children:B})),A&&r(b,g(_({},q),{id:ee,children:A})),!B&&ae(),r(l,g(_({"data-element":"sidebar-content","data-role":"sidebar-content"},f(Y)),{children:r(h.Provider,{value:{isInSidebar:!0},children:z})}))]});return r(n,{open:S,onCancel:K,disableEscKey:D,enableBackgroundUI:I,topModalOverride:G,restoreFocusOnClose:J,children:I?ne:r(d,{wrapperRef:re,isOpen:S,additionalWrapperRefs:T,focusableSelectors:U,focusFirstElement:R,autoFocus:!x,bespokeTrap:C,children:ne})})}));P.displayName="Sidebar";export{P as Sidebar,P as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import o,{useRef as t,useCallback as a}from"react";import n from"../../__internal__/modal/modal.component.js";import{StyledSidebar as i,StyledSidebarContent as s}from"./sidebar.style.js";import l from"../icon-button/icon-button.component.js";import c from"../icon/icon.component.js";import d from"../../__internal__/focus-trap/focus-trap.component.js";import u,{SidebarSubHeader as p}from"./__internal__/sidebar-header/sidebar-header.component.js";import b from"../../__internal__/utils/helpers/guid/index.js";import m from"../../hooks/__internal__/useLocale/useLocale.js";import f from"../../style/utils/filter-styled-system-padding-props.js";import y from"../../__internal__/utils/helpers/tags/tags.js";import h from"../../hooks/__internal__/useModalAria/useModalAria.js";import O from"./__internal__/sidebar.context.js";import j from"../../hooks/useMediaQuery/useMediaQuery.js";function _(e,r,o){return r in e?Object.defineProperty(e,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[r]=o,e}function g(e){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{},t=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(o).filter((function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable})))),t.forEach((function(r){_(e,r,o[r])}))}return e}function P(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r.push.apply(r,o)}return r}(Object(r)).forEach((function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(r,o))})),e}const w=o.forwardRef(((o,_)=>{var{"aria-describedby":w,"aria-label":v,"aria-labelledby":k,"data-element":F="sidebar","data-role":S,open:C,bespokeFocusTrap:E,closeButtonDataProps:A,disableAutoFocus:M=!1,disableEscKey:x=!1,enableBackgroundUI:D=!1,header:I,headerVariant:B="light",subHeader:H,position:N="right",size:z="medium",children:K,onCancel:L,role:R="dialog",focusFirstElement:T,focusableContainers:U,focusableSelectors:V,width:Q,widthAnimation:W=!1,headerPadding:q={},subHeaderPadding:G={},topModalOverride:J,restoreFocusOnClose:X=!0,className:Y,hidden:Z}=o,$=function(e,r){if(null==e)return{};var o,t,a=function(e,r){if(null==e)return{};var o,t,a={},n=Object.keys(e);for(t=0;t<n.length;t++)o=n[t],r.indexOf(o)>=0||(a[o]=e[o]);return a}(e,r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(t=0;t<n.length;t++)o=n[t],r.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(a[o]=e[o])}return a}(o,["aria-describedby","aria-label","aria-labelledby","data-element","data-role","open","bespokeFocusTrap","closeButtonDataProps","disableAutoFocus","disableEscKey","enableBackgroundUI","header","headerVariant","subHeader","position","size","children","onCancel","role","focusFirstElement","focusableContainers","focusableSelectors","width","widthAnimation","headerPadding","subHeaderPadding","topModalOverride","restoreFocusOnClose","className","hidden"]);const ee=m(),re=j("screen and (prefers-reduced-motion: no-preference)"),{current:oe}=t(b()),{current:te}=t(b()),ae=t(null),ne=a((e=>{ae.current=e,_&&("object"==typeof _&&(_.current=e),"function"==typeof _&&_(e))}),[_]),ie=h(ae,Z),se=()=>L?r(l,P(g({"aria-label":ee.sidebar.ariaLabels.close(),onClick:L},y("close",g({"data-element":"close"},A))),{children:r(c,{type:"close"})})):null,le=e(i,{"aria-modal":!D&&ie,"aria-describedby":w||te,"aria-label":v,"aria-labelledby":k||v?k:oe,"data-component":"sidebar","data-element":F,"data-role":S,ref:ne,position:N,size:z,onCancel:L,role:R,width:Q,widthAnimation:W&&re,className:Y,children:[I&&r(u,P(g({headerVariant:B,closeIcon:se()},q),{id:oe,children:I})),H&&r(p,P(g({},G),{id:te,children:H})),!I&&se(),r(s,P(g({"data-element":"sidebar-content","data-role":"sidebar-content"},f($)),{children:r(O.Provider,{value:{isInSidebar:!0},children:K})}))]});return r(n,{open:C,onCancel:L,disableEscKey:x,enableBackgroundUI:D,topModalOverride:J,restoreFocusOnClose:X,children:D?le:r(d,{wrapperRef:ae,isOpen:C,additionalWrapperRefs:U,focusableSelectors:V,focusFirstElement:T,autoFocus:!M,bespokeTrap:E,children:le})})}));w.displayName="Sidebar";export{w as Sidebar,w as default};

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

@@ -1,6 +1,6 @@
 import { PaddingProps } from "styled-system";
 import { SidebarProps } from "./sidebar.component";
-type StyledSidebarProps = Pick<SidebarProps, "onCancel" | "position" | "size" | "width">;
+type StyledSidebarProps = Pick<SidebarProps, "onCancel" | "position" | "size" | "width" | "widthAnimation">;
 declare const StyledSidebar: import("styled-components").StyledComponent<"div", any, {
     theme: object;
 } & StyledSidebarProps, "theme">;

package/esm/components/sidebar/sidebar.style.js

@@ -1 +1 @@
-import o,{css as i}from"styled-components";import{padding as t}from"styled-system";import e from"../../style/utils/element-sizing.js";import s from"../../style/themes/apply-base-theme.js";import n from"../icon-button/icon-button.style.js";import{SIDEBAR_SIZES_CSS as r}from"./sidebar.config.js";import{StyledForm as d,StyledFormContent as a}from"../form/form.style.js";const l=o.div.attrs(s).withConfig({displayName:"sidebar.style__StyledSidebar",componentId:"sc-de94cc74-0"})([":focus{outline:none;}",""],(({onCancel:o,position:t,size:s,theme:d,width:a})=>i(["background:var(--colorsUtilityYang100);border-radius:1px;bottom:0;position:fixed;display:flex;flex-direction:column;top:0;z-index:",";max-width:100vw;"," "," "," ",""],d.zIndex.fullScreenModal,!a&&s&&i(["width:",";"],r[s]),a&&e({width:a}),t&&i(["box-shadow:var(--boxShadow300);",":0;"],t),o&&i(["> ",":first-of-type{position:absolute;z-index:1;right:25px;top:25px;}"],n)))),p=o.div.withConfig({displayName:"sidebar.style__StyledSidebarContent",componentId:"sc-de94cc74-1"})(["box-sizing:border-box;display:block;overflow-y:auto;flex-grow:1;padding:var(--spacing300) var(--spacing400) var(--spacing400);"," &:has(",".sticky){display:flex;flex-direction:column;overflow-y:hidden;padding:0;",".sticky{","{padding:var(--spacing300) var(--spacing400) var(--spacing400);","}}}"],t,d,d,a,t);export{l as StyledSidebar,p as StyledSidebarContent};
+import i,{css as o}from"styled-components";import{padding as t}from"styled-system";import e from"../../style/utils/element-sizing.js";import s from"../../style/themes/apply-base-theme.js";import n from"../icon-button/icon-button.style.js";import{SIDEBAR_SIZES_CSS as r}from"./sidebar.config.js";import{StyledForm as a,StyledFormContent as d}from"../form/form.style.js";const l=i.div.attrs(s).withConfig({displayName:"sidebar.style__StyledSidebar",componentId:"sc-925b46ee-0"})([":focus{outline:none;}",""],(({onCancel:i,position:t,size:s,theme:a,width:d,widthAnimation:l})=>o(["background:var(--colorsUtilityYang100);border-radius:1px;bottom:0;position:fixed;display:flex;flex-direction:column;top:0;z-index:",";max-width:100vw;"," "," "," "," ",""],a.zIndex.fullScreenModal,!d&&s&&o(["width:",";"],r[s]),d&&e({width:d}),l&&o(["transition:width 0.3s ease;"]),t&&o(["box-shadow:var(--boxShadow300);",":0;"],t),i&&o(["> ",":first-of-type{position:absolute;z-index:1;right:25px;top:25px;}"],n)))),p=i.div.withConfig({displayName:"sidebar.style__StyledSidebarContent",componentId:"sc-925b46ee-1"})(["box-sizing:border-box;display:block;overflow-y:auto;flex-grow:1;padding:var(--spacing300) var(--spacing400) var(--spacing400);"," &:has(",".sticky){display:flex;flex-direction:column;overflow-y:hidden;padding:0;",".sticky{","{padding:var(--spacing300) var(--spacing400) var(--spacing400);","}}}"],t,a,a,d,t);export{l as StyledSidebar,p as StyledSidebarContent};

package/esm/components/tile-select/__internal__/accordion/accordion.component.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{useState as r,useRef as t}from"react";import{StyledContentContainer as o,StyledContent as n}from"./accordion.style.js";import c from"../../../../hooks/__internal__/useResizeObserver/useResizeObserver.js";const i=({children:i,expanded:l,contentId:a,controlId:d})=>{const[s,m]=r(0),u=t(null);return c(u,(()=>{u.current&&m(u.current.scrollHeight)})),e(o,{isExpanded:l,maxHeight:s,"data-role":"tile-select-accordion-content-container",children:e(n,{role:"region","data-element":"tile-select-accordion-content","data-role":"tile-select-accordion-content",ref:u,id:a,"aria-labelledby":d,children:i})})};export{i as default};
+import{jsx as e}from"react/jsx-runtime";import{useState as r,useRef as o}from"react";import{StyledContentContainer as t,StyledContent as n}from"./accordion.style.js";import c from"../../../../hooks/__internal__/useResizeObserver/useResizeObserver.js";import i from"../../../../hooks/useMediaQuery/useMediaQuery.js";const l=({children:l,expanded:a,contentId:s,controlId:d})=>{const[m,u]=r(0),p=o(null),f=i("screen and (prefers-reduced-motion: no-preference)");return c(p,(()=>{p.current&&u(p.current.scrollHeight)})),e(t,{$isExpanded:a,$height:m,$allowMotion:f,"data-role":"tile-select-accordion-content-container",children:e(n,{role:"region","data-element":"tile-select-accordion-content","data-role":"tile-select-accordion-content",ref:p,id:s,"aria-labelledby":d,children:l})})};export{l as default};

package/esm/components/tile-select/__internal__/accordion/accordion.style.d.ts

@@ -1,3 +1,3 @@
-declare const StyledContentContainer: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionContentContainerProps, never>;
-declare const StyledContent: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionContentProps, never>;
+declare const StyledContentContainer: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionProps, never>;
+declare const StyledContent: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionProps, never>;
 export { StyledContentContainer, StyledContent };

package/esm/components/tile-select/__internal__/accordion/accordion.style.js

@@ -1 +1 @@
-import o from"styled-components";import{StyledAccordionContentContainer as n,StyledAccordionContent as t}from"../../../accordion/accordion.style.js";const c=o(n).withConfig({displayName:"accordion.style__StyledContentContainer",componentId:"sc-fa18ab9c-0"})(["background-color:var(--colorsActionMinor050);"]),i=o(t).withConfig({displayName:"accordion.style__StyledContent",componentId:"sc-fa18ab9c-1"})(["padding:24px;position:relative;z-index:200;"]);export{i as StyledContent,c as StyledContentContainer};
+import o from"styled-components";import{StyledAccordionContentContainer as n,StyledAccordionContent as t}from"../../../accordion/accordion.style.js";const i=o(n).withConfig({displayName:"accordion.style__StyledContentContainer",componentId:"sc-80dffb5e-0"})(["background-color:var(--colorsActionMinor050);opacity:1;"]),e=o(t).withConfig({displayName:"accordion.style__StyledContent",componentId:"sc-80dffb5e-1"})(["padding:24px;position:relative;z-index:200;"]);export{e as StyledContent,i as StyledContentContainer};

package/lib/components/accordion/accordion-group/accordion-group.component.d.ts

@@ -2,6 +2,9 @@ import React from "react";
 import { MarginProps } from "styled-system";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 type AccordionGroupChild = React.ReactElement | boolean | null | undefined | Array<AccordionGroupChild>;
+/**
+ * @deprecated This component is deprecated and will be removed in a future release. Wrapping a group of Accordions in AccordionGroup is no longer required.
+ */
 export interface AccordionGroupProps extends MarginProps, TagProps {
     /** An Accordion or list of Accordion components to be rendered inside the AccordionGroup */
     children?: AccordionGroupChild;

package/lib/components/accordion/accordion-group/accordion-group.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("invariant"),n=require("../../../__internal__/utils/helpers/events/events.js"),o=require("../accordion.component.js"),l=require("../accordion.style.js"),i=require("../../../__internal__/utils/helpers/tags/tags.js"),c=require("../../../__internal__/utils/logger/index.js");function u(e){return e&&e.__esModule?e:{default:e}}var a=u(r),s=u(t);function d(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}let f=!1;const p=t=>{var{children:u}=t,p=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},l=Object.keys(e);for(n=0;n<l.length;n++)t=l[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(n=0;n<l.length;n++)t=l[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(t,["children"]);f||(f=!0,c.default.deprecate("`AccordionGroup` is deprecated and will soon be removed."));const y=r.useMemo((()=>{let e=!0;return a.default.Children.toArray(u).forEach((r=>{("string"==typeof r||a.default.isValidElement(r)&&"Accordion"!==r.type.displayName)&&(e=!1)})),e}),[u]);s.default(y,`AccordionGroup accepts only children of type \`${o.Accordion.displayName}\`.`);const b=r.useMemo((()=>a.default.Children.toArray(u).filter((e=>a.default.isValidElement(e)))),[u]),O=r.useMemo((()=>b.map((e=>e.ref||a.default.createRef()))),[b]),j=r.useCallback(((e,r)=>{var t;if(e.preventDefault(),-1===r)null===(t=O[O.length-1].current)||void 0===t||t.focus();else if(r===O.length){var n;null===(n=O[0].current)||void 0===n||n.focus()}else{var o;null===(o=O[r].current)||void 0===o||o.focus()}}),[O]),m=r.useCallback(((e,r)=>{n.default.isUpKey(e)&&j(e,r-1),n.default.isDownKey(e)&&j(e,r+1),n.default.isHomeKey(e)&&j(e,0),n.default.isEndKey(e)&&j(e,O.length-1)}),[j,O]);return e.jsx(l.StyledAccordionGroup,(v=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){d(e,r,t[r])}))}return e}({},p,i.default("accordion-group",p)),g=null!=(g={children:b.map(((e,r)=>a.default.cloneElement(e,{ref:O[r],index:r,handleKeyboardAccessibility:m})))})?g:{},Object.getOwnPropertyDescriptors?Object.defineProperties(v,Object.getOwnPropertyDescriptors(g)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(g)).forEach((function(e){Object.defineProperty(v,e,Object.getOwnPropertyDescriptor(g,e))})),v));var v,g};p.displayName="AccordionGroup",exports.AccordionGroup=p,exports.default=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("invariant"),n=require("../../../__internal__/utils/helpers/events/events.js"),o=require("../accordion.component.js"),l=require("../accordion.style.js"),i=require("../../../__internal__/utils/helpers/tags/tags.js"),c=require("../../../__internal__/utils/logger/index.js");function u(e){return e&&e.__esModule?e:{default:e}}var a=u(r),s=u(t);function d(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}let f=!1;const p=t=>{var{children:u}=t,p=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},l=Object.keys(e);for(n=0;n<l.length;n++)t=l[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(n=0;n<l.length;n++)t=l[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(t,["children"]);f||(f=!0,c.default.deprecate("`AccordionGroup` is deprecated and will be removed in a future release. Wrapping a group of Accordions in AccordionGroup is no longer required."));const y=r.useMemo((()=>{let e=!0;return a.default.Children.toArray(u).forEach((r=>{("string"==typeof r||a.default.isValidElement(r)&&"Accordion"!==r.type.displayName)&&(e=!1)})),e}),[u]);s.default(y,`AccordionGroup accepts only children of type \`${o.Accordion.displayName}\`.`);const b=r.useMemo((()=>a.default.Children.toArray(u).filter((e=>a.default.isValidElement(e)))),[u]),O=r.useMemo((()=>b.map((e=>e.ref||a.default.createRef()))),[b]),g=r.useCallback(((e,r)=>{var t;if(e.preventDefault(),-1===r)null===(t=O[O.length-1].current)||void 0===t||t.focus();else if(r===O.length){var n;null===(n=O[0].current)||void 0===n||n.focus()}else{var o;null===(o=O[r].current)||void 0===o||o.focus()}}),[O]),j=r.useCallback(((e,r)=>{n.default.isUpKey(e)&&g(e,r-1),n.default.isDownKey(e)&&g(e,r+1),n.default.isHomeKey(e)&&g(e,0),n.default.isEndKey(e)&&g(e,O.length-1)}),[g,O]);return e.jsx(l.StyledAccordionGroup,(m=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){d(e,r,t[r])}))}return e}({},p,i.default("accordion-group",p)),v=null!=(v={children:b.map(((e,r)=>a.default.cloneElement(e,{ref:O[r],index:r,handleKeyboardAccessibility:j})))})?v:{},Object.getOwnPropertyDescriptors?Object.defineProperties(m,Object.getOwnPropertyDescriptors(v)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(v)).forEach((function(e){Object.defineProperty(m,e,Object.getOwnPropertyDescriptor(v,e))})),m));var m,v};p.displayName="AccordionGroup",exports.AccordionGroup=p,exports.default=p;

package/lib/components/accordion/accordion.component.d.ts

@@ -1,39 +1,70 @@
 import React from "react";
 import { SpaceProps } from "styled-system";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
-import { StyledAccordionContainerProps } from "./accordion.style";
-export interface AccordionProps extends StyledAccordionContainerProps, SpaceProps, TagProps {
+export interface AccordionProps extends SpaceProps, TagProps {
+    id?: string;
     /** Content of the Accordion component */
     children?: React.ReactNode;
-    /** Set the default state of expansion of the Accordion if component is meant to be used as uncontrolled */
+    /** Set the default state of expansion of the Accordion if component is to be used as uncontrolled */
     defaultExpanded?: boolean;
-    /** Disable padding for the content */
+    /**
+     * Disable padding for the content.
+     * @deprecated Padding is no longer applied to the Accordion content by default. Any desired spacing can be applied directly to the provided content.
+     */
     disableContentPadding?: boolean;
-    /** Sets the expansion state of the Accordion if component is meant to be used as controlled */
+    /** Sets the expansion state of the Accordion if component is to be used as controlled */
     expanded?: boolean;
-    /** An error message to be displayed in the tooltip */
-    error?: string;
     /** Styled system spacing props provided to Accordion Title */
     headerSpacing?: SpaceProps;
-    id?: string;
-    /** Sets icon type */
-    iconType?: "chevron_down" | "chevron_down_thick" | "dropdown";
-    /** Sets icon alignment */
-    iconAlign?: "left" | "right";
-    /** Sets accordion title */
+    /** Title of the Accordion */
     title: React.ReactNode;
-    /** An info message to be displayed in the tooltip */
-    info?: string;
-    /** Callback fired when expansion state changes */
-    onChange?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
-    /** When the Accordion is open the title can change to this */
+    /** Title of the Accordion when it is open */
     openTitle?: string;
-    /** Sets accordion size */
-    size?: "large" | "small";
     /** Sets accordion sub title */
     subTitle?: string;
-    /** A warning message to be displayed in the tooltip */
+    /** Callback fired when expansion state changes */
+    onChange?: (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
+    /** Sets Accordion size */
+    size?: "small" | "medium" | "large";
+    /**
+     * Sets Accordion borders.
+     *
+     * **Deprecation Warning:** The "full" borders are deprecated and will be removed in a future release.
+     */
+    borders?: "default" | "none" | "full";
+    /** Sets Accordion width */
+    width?: string;
+    /**
+     * Sets Accordion variant.
+     *
+     * **Deprecation Warning:** The "subtle" variant is deprecated, please use "simple" instead.
+     */
+    variant?: "standard" | "simple" | "subtle";
+    /**
+     * Sets icon type
+     * @deprecated Custom icon types on accordions are deprecated and will be removed in a future release.
+     */
+    iconType?: "chevron_down" | "chevron_down_thick" | "dropdown";
+    /**
+     * Sets icon alignment.
+     * @deprecated Icon alignment on accordions is deprecated and will be removed in a future release. Icons will now render on the left by default.
+     */
+    iconAlign?: "left" | "right";
+    /**
+     * An error message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
+    error?: string;
+    /**
+     * A warning message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
     warning?: string;
+    /**
+     * An info message to be displayed in the tooltip.
+     * @deprecated Validation messages on accordions are no longer supported.
+     */
+    info?: string;
 }
 export interface AccordionInternalProps {
     /** @ignore @private */

package/lib/components/accordion/accordion.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=require("../../__internal__/utils/helpers/tags/tags.js"),r=require("../../hooks/__internal__/useResizeObserver/useResizeObserver.js"),i=require("../../__internal__/utils/helpers/guid/index.js"),o=require("../../__internal__/utils/helpers/events/events.js"),a=require("./accordion.style.js"),c=require("../../__internal__/validations/validation-icon.component.js");function d(e){return e&&e.__esModule?e:{default:e}}function l(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function s(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),r.forEach((function(n){l(e,n,t[n])}))}return e}function u(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n.push.apply(n,t)}return n}(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})),e}const f=d(n).default.forwardRef(((d,l)=>{var{borders:f="default",defaultExpanded:b,expanded:p,onChange:y,children:g,handleKeyboardAccessibility:h,id:v,index:j,iconType:O,iconAlign:x,size:_="large",subTitle:m,title:w,width:A,headerSpacing:S,disableContentPadding:P=!1,error:C,warning:E,info:T,openTitle:k,variant:q="standard"}=d,z=function(e,n){if(null==e)return{};var t,r,i=function(e,n){if(null==e)return{};var t,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)t=o[r],n.indexOf(t)>=0||(i[t]=e[t]);return i}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)t=o[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(d,["borders","defaultExpanded","expanded","onChange","children","handleKeyboardAccessibility","id","index","iconType","iconAlign","size","subTitle","title","width","headerSpacing","disableContentPadding","error","warning","info","openTitle","variant"]);const D=void 0!==p,[I,R]=n.useState(b||!1),[H,K]=n.useState(I?"auto":0),$=n.useRef(null),L=n.useRef(null),M=D?p:I;r.default($,(()=>{var e;K(null===(e=$.current)||void 0===e?void 0:e.scrollHeight)})),n.useEffect((()=>{var e;K(null===(e=$.current)||void 0===e?void 0:e.scrollHeight)}),[M]);const V=n.useCallback((e=>{D||R(!M),null==y||y(e,!M)}),[D,M,y]);n.useEffect((()=>{var e,n;M?null===(e=L.current)||void 0===e||e.removeAttribute("hidden"):null===(n=L.current)||void 0===n||n.setAttribute("hidden","until-found")}),[M]),n.useEffect((()=>{const e=L.current;if(!e)return;const n=e=>{V(e)};return e.addEventListener("beforematch",n),()=>e.removeEventListener("beforematch",n)}),[V,D,y]);const F=n.useCallback((e=>{h&&h(e,j),(o.default.isEnterKey(e)||o.default.isSpaceKey(e))&&(e.preventDefault(),V(e))}),[h,j,V]),N=n.useRef(i.default()),B=v||`Accordion_${N.current}`,G=`AccordionHeader_${N.current}`,J=`AccordionContent_${N.current}`,Q=!!(C||E||T);return e.jsxs(a.StyledAccordionContainer,u(s({id:B,width:A,borders:"subtle"===q?"none":f,variant:q},z,t.default("accordion",z)),{children:[e.jsxs(a.StyledAccordionTitleContainer,u(s({"data-element":"accordion-title-container",id:G,"aria-expanded":M,"aria-controls":J,onClick:V,onKeyDown:F,tabIndex:0,iconAlign:x||("standard"===q?"right":"left"),ref:l,size:_,isExpanded:M,variant:q,role:"button"},S),{children:[e.jsxs(a.StyledAccordionHeadingsContainer,{"data-element":"accordion-headings-container",hasValidationIcon:Q,children:["string"==typeof w?e.jsx(a.StyledAccordionTitle,{"data-element":"accordion-title",size:_,variant:q,children:M&&k||w}):M&&k||w,"subtle"!==q&&e.jsxs(e.Fragment,{children:[Q&&e.jsx(c.ValidationIcon,{error:C,warning:E,info:T,tooltipPosition:"top",tabIndex:0,ml:1}),m&&"large"===_&&"standard"===q&&e.jsx(a.StyledAccordionSubTitle,{children:m})]})]}),e.jsx(a.StyledAccordionIcon,{"data-element":"accordion-icon",type:O||("small"===_||"subtle"===q?"chevron_down_thick":"chevron_down"),isExpanded:M,iconAlign:x||("standard"===q?"right":"left")})]})),e.jsx(a.StyledAccordionContentContainer,{ref:L,isExpanded:M,maxHeight:H,"data-role":"accordion-content-container",children:e.jsx(a.StyledAccordionContent,{role:"region","data-element":"accordion-content","data-role":"accordion-content",id:J,"aria-labelledby":G,ref:$,disableContentPadding:P,variant:q,children:g})})]}))}));f.displayName="Accordion",exports.Accordion=f,exports.default=f;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../__internal__/utils/helpers/tags/tags.js"),n=require("../../hooks/__internal__/useResizeObserver/useResizeObserver.js"),i=require("../../__internal__/utils/helpers/guid/index.js"),o=require("../../__internal__/utils/helpers/events/events.js"),c=require("./accordion.style.js"),a=require("../button/__next__/button.component.js"),d=require("../../hooks/useMediaQuery/useMediaQuery.js");function l(e){return e&&e.__esModule?e:{default:e}}function s(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function u(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){s(e,t,r[t])}))}return e}function f(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const p=l(t).default.forwardRef(((l,s)=>{var{borders:p="default",defaultExpanded:b,expanded:y,onChange:h,children:v,handleKeyboardAccessibility:j,id:m,index:g,iconType:O,iconAlign:x,size:_="medium",subTitle:w,title:A,width:S,headerSpacing:$,disableContentPadding:P,error:C,warning:E,info:T,openTitle:k,variant:q="standard"}=l,z=function(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}(l,["borders","defaultExpanded","expanded","onChange","children","handleKeyboardAccessibility","id","index","iconType","iconAlign","size","subTitle","title","width","headerSpacing","disableContentPadding","error","warning","info","openTitle","variant"]);const M=void 0!==y,[D,R]=t.useState(b||!1),[K,H]=t.useState(D?"auto":0),I=t.useRef(null),L=t.useRef(null),N=M?y:D;n.default(I,(()=>{var e;H(null===(e=I.current)||void 0===e?void 0:e.scrollHeight)})),t.useEffect((()=>{var e;H(null===(e=I.current)||void 0===e?void 0:e.scrollHeight)}),[N]);const Q=d.default("screen and (prefers-reduced-motion: no-preference)"),B=t.useCallback((e=>{M||R(!N),null==h||h(e,!N)}),[M,N,h]),W=Q?400:0;t.useEffect((()=>{var e;if(!N){const e=setTimeout((()=>{var e;null===(e=L.current)||void 0===e||e.setAttribute("hidden","until-found")}),W);return()=>clearTimeout(e)}null===(e=L.current)||void 0===e||e.removeAttribute("hidden")}),[N,W]),t.useEffect((()=>{const e=L.current;if(!e)return;const t=e=>{B(e)};return e.addEventListener("beforematch",t),()=>e.removeEventListener("beforematch",t)}),[B,M,h]);const F=t.useCallback((e=>{j&&j(e,g),(o.default.isEnterKey(e)||o.default.isSpaceKey(e))&&(e.preventDefault(),B(e))}),[j,g,B]),G=t.useRef(i.default()),J=m||`Accordion_${G.current}`,U=`AccordionHeader_${G.current}`,V=`AccordionContent_${G.current}`,X="large"===_?"medium":_,Y="subtle"===q?"simple":q,Z=()=>N&&k||A,ee=()=>e.jsx(c.StyledAccordionIcon,{"data-element":"accordion-icon","data-role":"accordion-icon",type:O||("standard"===q&&"medium"===X?"chevron_down":"chevron_down_thick"),$isExpanded:N,$allowMotion:Q});return e.jsxs(c.StyledAccordionContainer,f(u({id:J,$width:S,$borders:p,$variant:Y,$isExpanded:N,$allowMotion:Q},z,r.default("accordion",z)),{children:["simple"===Y?e.jsxs(a.Button,{"data-role":"accordion-simple-button",id:U,"aria-expanded":N,"aria-controls":V,onClick:B,variantType:"tertiary",size:_,className:N?"active":"",children:[ee(),Z()]}):e.jsxs(c.StyledAccordionTitleContainer,f(u({"data-element":"accordion-title-container",id:U,"aria-expanded":N,"aria-controls":V,onClick:B,onKeyDown:F,tabIndex:0,ref:s,role:"button",$size:X,$iconAlign:x},$),{children:[ee(),e.jsxs(c.StyledAccordionTitleWrapper,{children:["string"==typeof A?e.jsx(c.StyledAccordionTitle,{"data-element":"accordion-title",$size:X,children:Z()}):Z(),w&&e.jsx(c.StyledAccordionSubTitle,{"data-element":"accordion-subtitle",$size:X,children:w})]})]})),e.jsxs(c.StyledAccordionContentContainer,{ref:L,$isExpanded:N,$height:K,$allowMotion:Q,"data-role":"accordion-content-container",children:["simple"===Y&&e.jsx(c.StyledAccordionLine,{}),e.jsx(c.StyledAccordionContent,{role:"region","data-element":"accordion-content","data-role":"accordion-content",id:V,"aria-labelledby":U,ref:I,$variant:Y,children:v})]})]}))}));p.displayName="Accordion",exports.Accordion=p,exports.default=p;

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

@@ -1,50 +1,26 @@
-declare const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {
+export interface StyledAccordionProps {
+    $borders?: "default" | "full" | "none";
+    $width?: string;
+    $variant?: "standard" | "simple";
+    $isExpanded?: boolean;
+    $allowMotion?: boolean;
+    $size?: "small" | "medium";
+    $iconAlign?: "left" | "right";
+    $height?: string | number;
+}
+export declare const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {
     theme: object;
 }, "theme">;
-export interface StyledAccordionContainerProps {
-    /** Toggles left and right borders, set to none when variant is subtle */
-    borders?: "default" | "full" | "none";
-    /** Sets accordion width */
-    width?: string;
-    /** Sets accordion variant */
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, {
+export declare const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, {
     theme: object;
-} & StyledAccordionContainerProps, "theme">;
-interface StyledAccordionTitleProps {
-    size?: "large" | "small";
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, StyledAccordionTitleProps, never>;
-declare const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
-interface StyledAccordionIconProps {
-    isExpanded?: boolean;
-    iconAlign?: "left" | "right";
-}
-declare const StyledAccordionIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, StyledAccordionIconProps, never>;
-interface StyledAccordionHeadingsContainerProps {
-    hasValidationIcon?: boolean;
-}
-declare const StyledAccordionHeadingsContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionHeadingsContainerProps, never>;
-interface StyledAccordionTitleContainerProps {
-    hasButtonProps?: boolean;
-    iconAlign?: "left" | "right";
-    size?: "large" | "small";
-    isExpanded?: boolean;
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, {
+} & StyledAccordionProps, "theme">;
+export declare const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, StyledAccordionProps, never>;
+export declare const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, StyledAccordionProps, never>;
+export declare const StyledAccordionIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, StyledAccordionProps, never>;
+export declare const StyledAccordionTitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, {
     theme: object;
-} & StyledAccordionTitleContainerProps, "theme">;
-export interface StyledAccordionContentContainerProps {
-    isExpanded?: boolean;
-    maxHeight?: string | number;
-}
-declare const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionContentContainerProps, never>;
-export interface StyledAccordionContentProps {
-    disableContentPadding?: boolean;
-    variant?: "standard" | "subtle";
-}
-declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionContentProps, never>;
-export { StyledAccordionGroup, StyledAccordionContainer, StyledAccordionHeadingsContainer, StyledAccordionSubTitle, StyledAccordionTitleContainer, StyledAccordionTitle, StyledAccordionIcon, StyledAccordionContent, StyledAccordionContentContainer, };
+} & StyledAccordionProps, "theme">;
+export declare const StyledAccordionLine: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionProps, never>;
+export declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionProps, never>;

package/lib/components/accordion/accordion.style.js

@@ -1 +1 @@
-"use strict";var o=require("styled-components"),t=require("styled-system"),i=require("../icon/icon.component.js"),e=require("../../style/themes/apply-base-theme.js"),n=require("../../__internal__/validations/validation-icon.style.js"),r=require("../../style/utils/add-focus-styling.js");function a(o){return o&&o.__esModule?o:{default:o}}var s=a(o);const c=s.default.div.attrs(e.default).withConfig({displayName:"accordion.style__StyledAccordionGroup",componentId:"sc-a73079b2-0"})(["",""],t.margin),d=s.default.div.attrs(e.default).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-a73079b2-1"})([""," display:flex;",";justify-content:center;flex-direction:column;box-sizing:border-box;width:",";color:var(--colorsUtilityYin090);background-color:",";border:1px solid var(--colorsUtilityMajor100);"," "," ",""],t.space,(({variant:t})=>t&&o.css(["align-items:stretch;"])),(({width:o})=>o||"100%"),(({variant:o})=>"subtle"!==o?"var(--colorsUtilityYang100)":"var(--colorsUtilityMajorTransparent)"),(({borders:t})=>"default"===t&&o.css(["border-left:none;border-right:none;"])),(({borders:t})=>"none"===t&&o.css(["border:none;"])),(({variant:t})=>"subtle"!==t&&o.css(["& + &{margin-top:-1px;border-top:1px solid var(--colorsUtilityMajor100);border-bottom:1px solid var(--colorsUtilityMajor100);}"]))),l=s.default.h3.withConfig({displayName:"accordion.style__StyledAccordionTitle",componentId:"sc-a73079b2-2"})(["font-size:",";font-weight:500;line-height:1;user-select:none;margin:0;"],(({size:o,variant:t})=>"small"===o||"subtle"===t?"var(--fontSizes200)":"var(--fontSizes400)")),p=s.default.span.withConfig({displayName:"accordion.style__StyledAccordionSubTitle",componentId:"sc-a73079b2-3"})(["margin-top:8px;"]),g=s.default(i.default).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-a73079b2-4"})(["transition:transform 0.3s;transform:rotate(0deg);margin-right:",";"," color:var(--colorsActionMinor500);"],(({iconAlign:o})=>"left"===o?"var(--spacing200)":"var(--spacing000)"),(({isExpanded:o,iconAlign:t})=>o&&("right"===t?"transform: rotate(180deg);":"transform: rotate(-180deg);"))),y=s.default.div.withConfig({displayName:"accordion.style__StyledAccordionHeadingsContainer",componentId:"sc-a73079b2-5"})(["padding-right:var(--sizing300);",""],(({hasValidationIcon:t})=>o.css(["display:grid;"," "," ","{height:20px;position:relative;top:2px;}"],t&&o.css(["grid-template-columns:min-content auto;","{grid-column:span 3;}"],p),!t&&o.css(["grid-template-rows:auto auto;"]),n.default))),f=s.default.div.attrs(e.default).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-a73079b2-6"})(["",""],(({iconAlign:i,size:e,isExpanded:n,variant:a})=>o.css(["padding:",";"," display:flex;align-items:center;justify-content:space-between;"," cursor:pointer;z-index:1;&:focus{","}"," ",""],"small"===e?"var(--spacing200)":"var(--spacing300)",t.space,"left"===i&&o.css(["justify-content:flex-end;flex-direction:row-reverse;"]),r.default(),"subtle"===a&&o.css(["color:var(--colorsActionMajor500);padding:var(--spacing025);margin-bottom:",";width:fit-content;","{color:var(--colorsActionMajor500);",";}:hover{color:var(--colorsActionMajor600);","{color:var(--colorsActionMajor600);}}"],n&&"var(--spacing200)",g,"left"===i&&"margin-right: var(--spacing050)",g),"subtle"!==a&&o.css(["&:hover{background-color:var(--colorsUtilityMajor050);}"])))),u=s.default.div.withConfig({displayName:"accordion.style__StyledAccordionContentContainer",componentId:"sc-a73079b2-7"})(["flex-grow:1;box-sizing:border-box;overflow:hidden;transition:all 0.3s;",""],(({maxHeight:t,isExpanded:i})=>o.css(["max-height:",";height:",";"],i?`${t}px`:"0px",i?`${t}px`:"0px"))),v=s.default.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-a73079b2-8"})(["padding:var(--spacing300);padding-top:var(--spacing100);overflow:hidden;"," ",""],(({variant:t})=>"subtle"===t&&o.css(["margin-left:var(--spacing150);padding:var(--spacing100) var(--spacing200) var(--spacing300);border-left:2px solid var(--colorsUtilityMajor100);"])),(({disableContentPadding:t})=>t&&o.css(["padding:0;"])));exports.StyledAccordionContainer=d,exports.StyledAccordionContent=v,exports.StyledAccordionContentContainer=u,exports.StyledAccordionGroup=c,exports.StyledAccordionHeadingsContainer=y,exports.StyledAccordionIcon=g,exports.StyledAccordionSubTitle=p,exports.StyledAccordionTitle=l,exports.StyledAccordionTitleContainer=f;
+"use strict";var e=require("styled-components"),o=require("styled-system"),t=require("../icon/icon.component.js"),i=require("../../style/themes/apply-base-theme.js"),n=require("../../style/utils/add-focus-styling.js");function a(e){return e&&e.__esModule?e:{default:e}}var c=a(e);const s={small:{titleFont:"var(--global-font-static-section-heading-s)",subtitleFont:"var(--global-font-static-comp-medium-s)",headingPadding:"var(--global-space-comp-l)"},medium:{titleFont:"var(--global-font-static-section-heading-m)",subtitleFont:"var(--global-font-static-comp-medium-l)",headingPadding:"var(--global-space-comp-xl)"}},r=c.default.div.attrs(i.default).withConfig({displayName:"accordion.style__StyledAccordionGroup",componentId:"sc-5e39e462-0"})(["",""],o.margin),l=c.default.div.attrs(i.default).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-5e39e462-1"})(["display:flex;align-items:stretch;justify-content:center;flex-direction:column;box-sizing:border-box;width:",";"," &&{","}"],(({$width:e})=>e||"100%"),(({$variant:o,$borders:t,$isExpanded:i,$allowMotion:n})=>e.css([""," ",""],"standard"===o&&e.css(["& + &{margin-top:-1px;}border:1px solid var(--container-action-border-default);",";",";"],"default"===t&&e.css(["border-left:none;border-right:none;"]),"none"===t&&e.css(["border:none;"])),"simple"===o&&e.css(["gap:",";",""],i?"var(--global-space-comp-l)":"0px",n&&e.css(["transition:gap 0.4s;"])))),o.space),d=c.default.h3.withConfig({displayName:"accordion.style__StyledAccordionTitle",componentId:"sc-5e39e462-2"})([""," color:var(--container-action-txt-default);margin:0;"],(({$size:o})=>o&&e.css(["font:",";"],s[o].titleFont))),p=c.default.span.withConfig({displayName:"accordion.style__StyledAccordionSubTitle",componentId:"sc-5e39e462-3"})([""," color:var(--container-action-txt-alt-default);"],(({$size:o})=>o&&e.css(["font:",";"],s[o].subtitleFont))),g=c.default(t.default).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-5e39e462-4"})(["width:var(--global-size-2-xs);height:var(--global-size-2-xs);color:var(--container-action-icon-default);",";"],(({$isExpanded:o,$allowMotion:t})=>e.css(["transform:rotate(0deg);"," ",""],o&&e.css(["transform:rotate(-180deg);"]),t&&e.css(["transition:transform 0.4s;"])))),f=c.default.div.withConfig({displayName:"accordion.style__StyledAccordionTitleWrapper",componentId:"sc-5e39e462-5"})(["display:flex;flex-direction:column;align-items:flex-start;gap:var(--global-space-comp-xs);flex:1 0 0;"]),m=c.default.div.attrs(i.default).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-5e39e462-6"})(["",""],(({$size:t,$iconAlign:i})=>t&&e.css(["display:flex;flex:1 0 0;align-items:center;align-self:stretch;background-color:transparent;border:none;text-align:left;gap:var(--global-space-comp-l);padding:",";"," "," &:hover{cursor:pointer;background-color:var(--container-action-bg-hover);}&:focus{"," z-index:1;}"],s[t].headingPadding,"right"===i&&e.css(["flex-direction:row-reverse;"]),o.space,n.default()))),y=c.default.div.withConfig({displayName:"accordion.style__StyledAccordionLine",componentId:"sc-5e39e462-7"})(["position:absolute;width:2px;background-color:var(--input-typical-border-alt);border-radius:var(--global-radius-action-xs);height:100%;"]),u=c.default.div.withConfig({displayName:"accordion.style__StyledAccordionContentContainer",componentId:"sc-5e39e462-8"})(["position:relative;overflow:hidden;height:0;opacity:0;",""],(({$height:o,$isExpanded:t,$allowMotion:i})=>e.css([""," ",""],i&&e.css(["transition:height 0.4s,opacity 0.2s;"]),t&&e.css(["height:","px;opacity:1;"],o)))),h=c.default.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-5e39e462-9"})(["",""],(({$variant:o})=>e.css(["overflow:hidden;",""],"simple"===o&&e.css(["margin-left:var(--global-space-comp-l);"]))));exports.StyledAccordionContainer=l,exports.StyledAccordionContent=h,exports.StyledAccordionContentContainer=u,exports.StyledAccordionGroup=r,exports.StyledAccordionIcon=g,exports.StyledAccordionLine=y,exports.StyledAccordionSubTitle=p,exports.StyledAccordionTitle=d,exports.StyledAccordionTitleContainer=m,exports.StyledAccordionTitleWrapper=f;

package/lib/components/button/__next__/button.style.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("styled-components"),e=require("styled-system"),r=require("../../../style/utils/add-focus-styling.js"),i=require("./button.config.js");function n(o){return o&&o.__esModule?o:{default:o}}var t=n(o);const a=t.default.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-c07486b9-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),d=t.default.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-c07486b9-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],e.space,(({$allowMotion:e,disabled:r,$inverse:n,$size:t,$variant:a,$variantType:d,$iconOnly:l})=>n?(({disabled:e,size:r,variantType:n,iconOnly:t})=>{const{background:a,border:d,label:l}=i.inverseColourSettings[n],{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=i.propsForSize[r];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],a.default,"tertiary"===n?"1px":"2px",d.default,t?"var(--global-radius-action-circle)":s,l.default,c,u,t?u:"max-content",b,t?"":v,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],a.disabled,d.disabled,l.disabled):o.css(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],a.active,l.active,d.active,a.hover,l.hover,d.hover))})({disabled:r,size:t,variantType:d,iconOnly:l}):"gradient"===a?o.css([""," ",""],i.gradientAnimation,(({allowMotion:e=!0,disabled:r,size:n,iconOnly:t})=>{const{background:a,border:d,label:l}=i.colourSettings.gradient.secondary||{},{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=i.propsForSize[n];return o.css(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],t?"var(--global-radius-action-circle)":s,c,u,t?u:"max-content",b,t?"":v,e&&o.css(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),r&&o.css(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!r&&o.css(["&:active{background:",";color:",";border-color:",";}"],null==a?void 0:a.active,null==l?void 0:l.active,null==d?void 0:d.active))})({allowMotion:e,disabled:r,size:t,iconOnly:l})):(({disabled:e,size:r,variant:n,variantType:t,iconOnly:a})=>{const{background:d,border:l,label:s}=i.colourSettings[n][t]||{},{borderRadius:c,font:u,height:b,paddingVertical:v,paddingHorizontal:p}=i.propsForSize[r];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==d?void 0:d.default,"tertiary"===t?"1px":"2px",null==l?void 0:l.default,a?"var(--global-radius-action-circle)":c,null==s?void 0:s.default,u,b,a?b:"max-content",v,a?"":p,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==d?void 0:d.disabled,null==l?void 0:l.disabled,null==s?void 0:s.disabled):o.css(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==d?void 0:d.active,null==s?void 0:s.active,null==l?void 0:l.active,null==d?void 0:d.hover,null==s?void 0:s.hover,null==l?void 0:l.hover))})("xs"!==t||"primary"!==d&&"default"===a?"destructive"!==a||"tertiary"!==d&&"subtle"!==d?{disabled:r,size:t,variant:a,variantType:d,iconOnly:l}:{disabled:r,size:t,variant:a,variantType:"primary",iconOnly:l}:{disabled:r,size:"xs",variant:"default",variantType:"secondary",iconOnly:l})),(({$fullWidth:e,$size:r,$noWrap:n})=>o.css([""," ",""],e&&o.css(["width:100%;"]),n?"white-space: nowrap;":`\n        flex-flow: wrap;\n        min-height: ${i.propsForSize[r].height};\n        height: unset;\n      `)),r.default());exports.StyledButton=d,exports.StyledContentContainer=a,exports.default=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("styled-components"),e=require("styled-system"),i=require("../../../style/utils/add-focus-styling.js"),r=require("./button.config.js");function n(o){return o&&o.__esModule?o:{default:o}}var t=n(o);const a=t.default.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-1660f692-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),d=t.default.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-1660f692-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],e.space,(({$allowMotion:e,disabled:i,$inverse:n,$size:t,$variant:a,$variantType:d,$iconOnly:l})=>n?(({disabled:e,size:i,variantType:n,iconOnly:t})=>{const{background:a,border:d,label:l}=r.inverseColourSettings[n],{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=r.propsForSize[i];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],a.default,"tertiary"===n?"1px":"2px",d.default,t?"var(--global-radius-action-circle)":s,l.default,c,u,t?u:"max-content",b,t?"":v,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],a.disabled,d.disabled,l.disabled):o.css(["&:active,&.active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],a.active,l.active,d.active,a.hover,l.hover,d.hover))})({disabled:i,size:t,variantType:d,iconOnly:l}):"gradient"===a?o.css([""," ",""],r.gradientAnimation,(({allowMotion:e=!0,disabled:i,size:n,iconOnly:t})=>{const{background:a,border:d,label:l}=r.colourSettings.gradient.secondary||{},{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=r.propsForSize[n];return o.css(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],t?"var(--global-radius-action-circle)":s,c,u,t?u:"max-content",b,t?"":v,e&&o.css(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),i&&o.css(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!i&&o.css(["&:active,&.active{background:",";color:",";border-color:",";}"],null==a?void 0:a.active,null==l?void 0:l.active,null==d?void 0:d.active))})({allowMotion:e,disabled:i,size:t,iconOnly:l})):(({disabled:e,size:i,variant:n,variantType:t,iconOnly:a})=>{const{background:d,border:l,label:s}=r.colourSettings[n][t]||{},{borderRadius:c,font:u,height:b,paddingVertical:v,paddingHorizontal:p}=r.propsForSize[i];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==d?void 0:d.default,"tertiary"===t?"1px":"2px",null==l?void 0:l.default,a?"var(--global-radius-action-circle)":c,null==s?void 0:s.default,u,b,a?b:"max-content",v,a?"":p,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==d?void 0:d.disabled,null==l?void 0:l.disabled,null==s?void 0:s.disabled):o.css(["&:active,&.active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==d?void 0:d.active,null==s?void 0:s.active,null==l?void 0:l.active,null==d?void 0:d.hover,null==s?void 0:s.hover,null==l?void 0:l.hover))})("xs"!==t||"primary"!==d&&"default"===a?"destructive"!==a||"tertiary"!==d&&"subtle"!==d?{disabled:i,size:t,variant:a,variantType:d,iconOnly:l}:{disabled:i,size:t,variant:a,variantType:"primary",iconOnly:l}:{disabled:i,size:"xs",variant:"default",variantType:"secondary",iconOnly:l})),(({$fullWidth:e,$size:i,$noWrap:n})=>o.css([""," ",""],e&&o.css(["width:100%;"]),n?"white-space: nowrap;":`\n        flex-flow: wrap;\n        min-height: ${r.propsForSize[i].height};\n        height: unset;\n      `)),i.default());exports.StyledButton=d,exports.StyledContentContainer=a,exports.default=d;

package/lib/components/sidebar/sidebar.component.d.ts

@@ -49,6 +49,8 @@ export interface SidebarProps extends PaddingProps, TagProps, WidthProps, Pick<M
     role?: string;
     /** Sets the size of the sidebar when open. */
     size?: "extra-small" | "small" | "medium-small" | "medium" | "medium-large" | "large" | "extra-large";
+    /** Enables width animation when the sidebar width changes. */
+    widthAnimation?: boolean;
     /** an optional array of refs to containers whose content should also be reachable by tabbing from the sidebar */
     focusableContainers?: RefObject<HTMLElement>[];
     /** Optional selector to identify the focusable elements, if not provided a default selector is used */

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../__internal__/modal/modal.component.js"),a=require("./sidebar.style.js"),n=require("../icon-button/icon-button.component.js"),o=require("../icon/icon.component.js"),l=require("../../__internal__/focus-trap/focus-trap.component.js"),s=require("./__internal__/sidebar-header/sidebar-header.component.js"),i=require("../../__internal__/utils/helpers/guid/index.js"),d=require("../../hooks/__internal__/useLocale/useLocale.js"),c=require("../../style/utils/filter-styled-system-padding-props.js"),u=require("../../__internal__/utils/helpers/tags/tags.js"),b=require("../../hooks/__internal__/useModalAria/useModalAria.js"),p=require("./__internal__/sidebar.context.js");function f(e){return e&&e.__esModule?e:{default:e}}function y(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function j(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},a=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),a.forEach((function(r){y(e,r,t[r])}))}return e}function O(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const h=f(r).default.forwardRef(((f,y)=>{var{"aria-describedby":h,"aria-label":_,"aria-labelledby":m,"data-element":g="sidebar","data-role":P,open:S,bespokeFocusTrap:x,closeButtonDataProps:v,disableAutoFocus:w=!1,disableEscKey:q=!1,enableBackgroundUI:k=!1,header:C,headerVariant:F="light",subHeader:E,position:M="right",size:D="medium",children:I,onCancel:R,role:B="dialog",focusFirstElement:H,focusableContainers:A,focusableSelectors:N,width:z,headerPadding:K={},subHeaderPadding:L={},topModalOverride:T,restoreFocusOnClose:U=!0,className:V,hidden:W}=f,G=function(e,r){if(null==e)return{};var t,a,n=function(e,r){if(null==e)return{};var t,a,n={},o=Object.keys(e);for(a=0;a<o.length;a++)t=o[a],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)t=o[a],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(f,["aria-describedby","aria-label","aria-labelledby","data-element","data-role","open","bespokeFocusTrap","closeButtonDataProps","disableAutoFocus","disableEscKey","enableBackgroundUI","header","headerVariant","subHeader","position","size","children","onCancel","role","focusFirstElement","focusableContainers","focusableSelectors","width","headerPadding","subHeaderPadding","topModalOverride","restoreFocusOnClose","className","hidden"]);const J=d.default(),{current:Q}=r.useRef(i.default()),{current:X}=r.useRef(i.default()),Y=r.useRef(null),Z=r.useCallback((e=>{Y.current=e,y&&("object"==typeof y&&(y.current=e),"function"==typeof y&&y(e))}),[y]),$=b.default(Y,W),ee=()=>R?e.jsx(n.default,O(j({"aria-label":J.sidebar.ariaLabels.close(),onClick:R},u.default("close",j({"data-element":"close"},v))),{children:e.jsx(o.default,{type:"close"})})):null,re=e.jsxs(a.StyledSidebar,{"aria-modal":!k&&$,"aria-describedby":h||X,"aria-label":_,"aria-labelledby":m||_?m:Q,"data-component":"sidebar","data-element":g,"data-role":P,ref:Z,position:M,size:D,onCancel:R,role:B,width:z,className:V,children:[C&&e.jsx(s.default,O(j({headerVariant:F,closeIcon:ee()},K),{id:Q,children:C})),E&&e.jsx(s.SidebarSubHeader,O(j({},L),{id:X,children:E})),!C&&ee(),e.jsx(a.StyledSidebarContent,O(j({"data-element":"sidebar-content","data-role":"sidebar-content"},c.default(G)),{children:e.jsx(p.default.Provider,{value:{isInSidebar:!0},children:I})}))]});return e.jsx(t.default,{open:S,onCancel:R,disableEscKey:q,enableBackgroundUI:k,topModalOverride:T,restoreFocusOnClose:U,children:k?re:e.jsx(l.default,{wrapperRef:Y,isOpen:S,additionalWrapperRefs:A,focusableSelectors:N,focusFirstElement:H,autoFocus:!w,bespokeTrap:x,children:re})})}));h.displayName="Sidebar",exports.Sidebar=h,exports.default=h;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../__internal__/modal/modal.component.js"),a=require("./sidebar.style.js"),n=require("../icon-button/icon-button.component.js"),o=require("../icon/icon.component.js"),i=require("../../__internal__/focus-trap/focus-trap.component.js"),s=require("./__internal__/sidebar-header/sidebar-header.component.js"),l=require("../../__internal__/utils/helpers/guid/index.js"),d=require("../../hooks/__internal__/useLocale/useLocale.js"),u=require("../../style/utils/filter-styled-system-padding-props.js"),c=require("../../__internal__/utils/helpers/tags/tags.js"),b=require("../../hooks/__internal__/useModalAria/useModalAria.js"),p=require("./__internal__/sidebar.context.js"),f=require("../../hooks/useMediaQuery/useMediaQuery.js");function y(e){return e&&e.__esModule?e:{default:e}}function j(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function h(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},a=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),a.forEach((function(r){j(e,r,t[r])}))}return e}function m(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const O=y(r).default.forwardRef(((y,j)=>{var{"aria-describedby":O,"aria-label":_,"aria-labelledby":g,"data-element":P="sidebar","data-role":w,open:S,bespokeFocusTrap:x,closeButtonDataProps:v,disableAutoFocus:q=!1,disableEscKey:k=!1,enableBackgroundUI:C=!1,header:F,headerVariant:E="light",subHeader:M,position:A="right",size:D="medium",children:I,onCancel:R,role:B="dialog",focusFirstElement:H,focusableContainers:N,focusableSelectors:z,width:K,widthAnimation:L=!1,headerPadding:T={},subHeaderPadding:U={},topModalOverride:V,restoreFocusOnClose:Q=!0,className:W,hidden:G}=y,J=function(e,r){if(null==e)return{};var t,a,n=function(e,r){if(null==e)return{};var t,a,n={},o=Object.keys(e);for(a=0;a<o.length;a++)t=o[a],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)t=o[a],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(y,["aria-describedby","aria-label","aria-labelledby","data-element","data-role","open","bespokeFocusTrap","closeButtonDataProps","disableAutoFocus","disableEscKey","enableBackgroundUI","header","headerVariant","subHeader","position","size","children","onCancel","role","focusFirstElement","focusableContainers","focusableSelectors","width","widthAnimation","headerPadding","subHeaderPadding","topModalOverride","restoreFocusOnClose","className","hidden"]);const X=d.default(),Y=f.default("screen and (prefers-reduced-motion: no-preference)"),{current:Z}=r.useRef(l.default()),{current:$}=r.useRef(l.default()),ee=r.useRef(null),re=r.useCallback((e=>{ee.current=e,j&&("object"==typeof j&&(j.current=e),"function"==typeof j&&j(e))}),[j]),te=b.default(ee,G),ae=()=>R?e.jsx(n.default,m(h({"aria-label":X.sidebar.ariaLabels.close(),onClick:R},c.default("close",h({"data-element":"close"},v))),{children:e.jsx(o.default,{type:"close"})})):null,ne=e.jsxs(a.StyledSidebar,{"aria-modal":!C&&te,"aria-describedby":O||$,"aria-label":_,"aria-labelledby":g||_?g:Z,"data-component":"sidebar","data-element":P,"data-role":w,ref:re,position:A,size:D,onCancel:R,role:B,width:K,widthAnimation:L&&Y,className:W,children:[F&&e.jsx(s.default,m(h({headerVariant:E,closeIcon:ae()},T),{id:Z,children:F})),M&&e.jsx(s.SidebarSubHeader,m(h({},U),{id:$,children:M})),!F&&ae(),e.jsx(a.StyledSidebarContent,m(h({"data-element":"sidebar-content","data-role":"sidebar-content"},u.default(J)),{children:e.jsx(p.default.Provider,{value:{isInSidebar:!0},children:I})}))]});return e.jsx(t.default,{open:S,onCancel:R,disableEscKey:k,enableBackgroundUI:C,topModalOverride:V,restoreFocusOnClose:Q,children:C?ne:e.jsx(i.default,{wrapperRef:ee,isOpen:S,additionalWrapperRefs:N,focusableSelectors:z,focusFirstElement:H,autoFocus:!q,bespokeTrap:x,children:ne})})}));O.displayName="Sidebar",exports.Sidebar=O,exports.default=O;

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

@@ -1,6 +1,6 @@
 import { PaddingProps } from "styled-system";
 import { SidebarProps } from "./sidebar.component";
-type StyledSidebarProps = Pick<SidebarProps, "onCancel" | "position" | "size" | "width">;
+type StyledSidebarProps = Pick<SidebarProps, "onCancel" | "position" | "size" | "width" | "widthAnimation">;
 declare const StyledSidebar: import("styled-components").StyledComponent<"div", any, {
     theme: object;
 } & StyledSidebarProps, "theme">;

package/lib/components/sidebar/sidebar.style.js

@@ -1 +1 @@
-"use strict";var e=require("styled-components"),t=require("styled-system"),i=require("../../style/utils/element-sizing.js"),o=require("../../style/themes/apply-base-theme.js"),s=require("../icon-button/icon-button.style.js"),d=require("./sidebar.config.js"),r=require("../form/form.style.js");function n(e){return e&&e.__esModule?e:{default:e}}var a=n(e);const l=a.default.div.attrs(o.default).withConfig({displayName:"sidebar.style__StyledSidebar",componentId:"sc-de94cc74-0"})([":focus{outline:none;}",""],(({onCancel:t,position:o,size:r,theme:n,width:a})=>e.css(["background:var(--colorsUtilityYang100);border-radius:1px;bottom:0;position:fixed;display:flex;flex-direction:column;top:0;z-index:",";max-width:100vw;"," "," "," ",""],n.zIndex.fullScreenModal,!a&&r&&e.css(["width:",";"],d.SIDEBAR_SIZES_CSS[r]),a&&i.default({width:a}),o&&e.css(["box-shadow:var(--boxShadow300);",":0;"],o),t&&e.css(["> ",":first-of-type{position:absolute;z-index:1;right:25px;top:25px;}"],s.default)))),c=a.default.div.withConfig({displayName:"sidebar.style__StyledSidebarContent",componentId:"sc-de94cc74-1"})(["box-sizing:border-box;display:block;overflow-y:auto;flex-grow:1;padding:var(--spacing300) var(--spacing400) var(--spacing400);"," &:has(",".sticky){display:flex;flex-direction:column;overflow-y:hidden;padding:0;",".sticky{","{padding:var(--spacing300) var(--spacing400) var(--spacing400);","}}}"],t.padding,r.StyledForm,r.StyledForm,r.StyledFormContent,t.padding);exports.StyledSidebar=l,exports.StyledSidebarContent=c;
+"use strict";var e=require("styled-components"),i=require("styled-system"),t=require("../../style/utils/element-sizing.js"),s=require("../../style/themes/apply-base-theme.js"),o=require("../icon-button/icon-button.style.js"),d=require("./sidebar.config.js"),n=require("../form/form.style.js");function a(e){return e&&e.__esModule?e:{default:e}}var r=a(e);const l=r.default.div.attrs(s.default).withConfig({displayName:"sidebar.style__StyledSidebar",componentId:"sc-925b46ee-0"})([":focus{outline:none;}",""],(({onCancel:i,position:s,size:n,theme:a,width:r,widthAnimation:l})=>e.css(["background:var(--colorsUtilityYang100);border-radius:1px;bottom:0;position:fixed;display:flex;flex-direction:column;top:0;z-index:",";max-width:100vw;"," "," "," "," ",""],a.zIndex.fullScreenModal,!r&&n&&e.css(["width:",";"],d.SIDEBAR_SIZES_CSS[n]),r&&t.default({width:r}),l&&e.css(["transition:width 0.3s ease;"]),s&&e.css(["box-shadow:var(--boxShadow300);",":0;"],s),i&&e.css(["> ",":first-of-type{position:absolute;z-index:1;right:25px;top:25px;}"],o.default)))),c=r.default.div.withConfig({displayName:"sidebar.style__StyledSidebarContent",componentId:"sc-925b46ee-1"})(["box-sizing:border-box;display:block;overflow-y:auto;flex-grow:1;padding:var(--spacing300) var(--spacing400) var(--spacing400);"," &:has(",".sticky){display:flex;flex-direction:column;overflow-y:hidden;padding:0;",".sticky{","{padding:var(--spacing300) var(--spacing400) var(--spacing400);","}}}"],i.padding,n.StyledForm,n.StyledForm,n.StyledFormContent,i.padding);exports.StyledSidebar=l,exports.StyledSidebarContent=c;

package/lib/components/tile-select/__internal__/accordion/accordion.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./accordion.style.js"),n=require("../../../../hooks/__internal__/useResizeObserver/useResizeObserver.js");exports.default=({children:o,expanded:l,contentId:c,controlId:i})=>{const[a,s]=t.useState(0),d=t.useRef(null);return n.default(d,(()=>{d.current&&s(d.current.scrollHeight)})),e.jsx(r.StyledContentContainer,{isExpanded:l,maxHeight:a,"data-role":"tile-select-accordion-content-container",children:e.jsx(r.StyledContent,{role:"region","data-element":"tile-select-accordion-content","data-role":"tile-select-accordion-content",ref:d,id:c,"aria-labelledby":i,children:o})})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./accordion.style.js"),n=require("../../../../hooks/__internal__/useResizeObserver/useResizeObserver.js"),o=require("../../../../hooks/useMediaQuery/useMediaQuery.js");exports.default=({children:i,expanded:l,contentId:s,controlId:c})=>{const[a,d]=r.useState(0),u=r.useRef(null),f=o.default("screen and (prefers-reduced-motion: no-preference)");return n.default(u,(()=>{u.current&&d(u.current.scrollHeight)})),e.jsx(t.StyledContentContainer,{$isExpanded:l,$height:a,$allowMotion:f,"data-role":"tile-select-accordion-content-container",children:e.jsx(t.StyledContent,{role:"region","data-element":"tile-select-accordion-content","data-role":"tile-select-accordion-content",ref:u,id:s,"aria-labelledby":c,children:i})})};

package/lib/components/tile-select/__internal__/accordion/accordion.style.d.ts

@@ -1,3 +1,3 @@
-declare const StyledContentContainer: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionContentContainerProps, never>;
-declare const StyledContent: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionContentProps, never>;
+declare const StyledContentContainer: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionProps, never>;
+declare const StyledContent: import("styled-components").StyledComponent<"div", any, import("../../../accordion/accordion.style").StyledAccordionProps, never>;
 export { StyledContentContainer, StyledContent };

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

@@ -1 +1 @@
-"use strict";var o=require("styled-components"),t=require("../../../accordion/accordion.style.js");function n(o){return o&&o.__esModule?o:{default:o}}var e=n(o);const c=e.default(t.StyledAccordionContentContainer).withConfig({displayName:"accordion.style__StyledContentContainer",componentId:"sc-fa18ab9c-0"})(["background-color:var(--colorsActionMinor050);"]),i=e.default(t.StyledAccordionContent).withConfig({displayName:"accordion.style__StyledContent",componentId:"sc-fa18ab9c-1"})(["padding:24px;position:relative;z-index:200;"]);exports.StyledContent=i,exports.StyledContentContainer=c;
+"use strict";var o=require("styled-components"),t=require("../../../accordion/accordion.style.js");function e(o){return o&&o.__esModule?o:{default:o}}var n=e(o);const d=n.default(t.StyledAccordionContentContainer).withConfig({displayName:"accordion.style__StyledContentContainer",componentId:"sc-80dffb5e-0"})(["background-color:var(--colorsActionMinor050);opacity:1;"]),i=n.default(t.StyledAccordionContent).withConfig({displayName:"accordion.style__StyledContent",componentId:"sc-80dffb5e-1"})(["padding:24px;position:relative;z-index:200;"]);exports.StyledContent=i,exports.StyledContentContainer=d;

package/package.json

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