carbon-react 158.19.1 → 158.21.0

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 p from"../../__internal__/utils/helpers/events/events.js";import{StyledAccordionContainer as u,StyledAccordionTitleContainer as b,StyledAccordionHeadingsContainer as f,StyledAccordionTitle as g,StyledAccordionSubTitle as h,StyledAccordionIcon as y,StyledAccordionContentContainer as m,StyledAccordionContent as O}from"./accordion.style.js";import{ValidationIcon as v}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:N=!1,error:V,warning:q,info:B,openTitle:F,variant:G="standard"}=t,J=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 L=void 0!==A,[M,Q]=i(P||!1),[U,W]=i(M?"auto":0),X=o(null),Y=L?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)}),[Y]);const Z=c((e=>{L||Q(!Y),null==E||E(e,!Y)}),[L,Y,E]),ee=c((e=>{C&&C(e,z),(p.isEnterKey(e)||p.isSpaceKey(e))&&(e.preventDefault(),Z(e))}),[C,z,Z]),ne=o(s()),re=k||`Accordion_${ne.current}`,te=`AccordionHeader_${ne.current}`,ie=`AccordionContent_${ne.current}`,oe=!!(V||q||B);return e(u,w(j({id:re,width:R,borders:"subtle"===G?"none":x,variant:G},J,l("accordion",J)),{children:[e(b,w(j({"data-element":"accordion-title-container",id:te,"aria-expanded":Y,"aria-controls":ie,onClick:Z,onKeyDown:ee,tabIndex:0,iconAlign:T||("standard"===G?"right":"left"),ref:_,size:K,isExpanded:Y,variant:G,role:"button"},$),{children:[e(f,{"data-element":"accordion-headings-container",hasValidationIcon:oe,children:["string"==typeof I?n(g,{"data-element":"accordion-title",size:K,variant:G,children:Y&&F||I}):Y&&F||I,"subtle"!==G&&e(r,{children:[oe&&n(v,{error:V,warning:q,info:B,tooltipPosition:"top",tabIndex:0,ml:1}),H&&"large"===K&&"standard"===G&&n(h,{children:H})]})]}),n(y,{"data-element":"accordion-icon",type:D||("small"===K||"subtle"===G?"chevron_down_thick":"chevron_down"),isExpanded:Y,iconAlign:T||("standard"===G?"right":"left")})]})),n(m,{isExpanded:Y,maxHeight:U,"data-role":"accordion-content-container",children:n(O,{role:"region","data-element":"accordion-content","data-role":"accordion-content",id:ie,"aria-labelledby":te,ref:X,disableContentPadding:N,variant:G,children:S})})]}))}));x.displayName="Accordion";export{x as Accordion,x as default};
+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};

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-f1b48a4b-0"})(["",""],t),d=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-f1b48a4b-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-f1b48a4b-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-f1b48a4b-3"})(["margin-top:8px;"]),g=o(r).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-f1b48a4b-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-f1b48a4b-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))),f=o.div.attrs(a).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-f1b48a4b-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);}"])))),v=o.div.withConfig({displayName:"accordion.style__StyledAccordionContentContainer",componentId:"sc-f1b48a4b-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",!t&&"\n      visibility: hidden;\n    "))),y=o.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-f1b48a4b-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,y as StyledAccordionContent,v as StyledAccordionContentContainer,c as StyledAccordionGroup,m as StyledAccordionHeadingsContainer,g as StyledAccordionIcon,p as StyledAccordionSubTitle,l as StyledAccordionTitle,f as StyledAccordionTitleContainer};
+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};

package/esm/components/vertical-menu/index.d.ts

@@ -1,7 +1,7 @@
 export { default as VerticalMenu } from "./vertical-menu.component";
 export type { VerticalMenuProps } from "./vertical-menu.component";
 export { default as VerticalMenuItem } from "./vertical-menu-item/vertical-menu-item.component";
-export type { VerticalMenuItemProps } from "./vertical-menu-item/vertical-menu-item.component";
+export type { VerticalMenuItemClickEvent, VerticalMenuItemProps, } from "./vertical-menu-item/vertical-menu-item.component";
 export { default as VerticalMenuFullScreen } from "./vertical-menu-full-screen/vertical-menu-full-screen.component";
 export type { VerticalMenuFullScreenProps } from "./vertical-menu-full-screen/vertical-menu-full-screen.component";
 export { default as VerticalMenuTrigger } from "./vertical-menu-trigger/vertical-menu-trigger.component";

package/esm/components/vertical-menu/vertical-menu-item/vertical-menu-item.component.d.ts

@@ -1,17 +1,20 @@
-import React from "react";
+import React, { ReactNode } from "react";
 import { PaddingProps } from "styled-system";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 import { IconType } from "../../icon";
+export type VerticalMenuItemClickEvent = React.MouseEvent<HTMLButtonElement | HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>;
 export interface VerticalMenuItemProps<T = React.ElementType> extends PaddingProps, TagProps {
     /** Children of the menu item - another level of VerticalMenuItems */
     children?: React.ReactNode;
+    /** Custom icon to be displayed. Takes precedence over `iconType` if both are specified. */
+    customIcon?: ReactNode;
     /** Default open state of the component */
     defaultOpen?: boolean;
     /** Title of the menu item */
     title: string;
     /** Adornment of the menu item meant to be rendered on the right side */
     adornment?: React.ReactNode | ((isOpen: boolean) => React.ReactNode);
-    /** Icon meant to be rendered on the left side */
+    /** The Carbon icon to be displayed. Defers to `customIcon` if both are defined. */
     iconType?: IconType;
     /** Whether the menu item is active or not */
     active?: boolean | ((isOpen: boolean) => boolean);
@@ -19,9 +22,11 @@ export interface VerticalMenuItemProps<T = React.ElementType> extends PaddingPro
     height?: string;
     /**  Href, when passed the menu item will be rendered as an anchor tag */
     href?: string;
+    /** A custom click handler to run when the menu item is clicked */
+    onClick?: (event: VerticalMenuItemClickEvent) => void;
     /** Optional component to render instead of the default div, useful for rendering router link components */
     component?: T;
 }
 type InferredComponentProps<T extends React.ElementType> = Omit<React.ComponentProps<T>, keyof VerticalMenuItemProps<T>>;
-export declare const VerticalMenuItem: <T>({ defaultOpen, title, iconType, adornment, children, component, active, height, href, ...rest }: T extends React.ElementType ? InferredComponentProps<T> & VerticalMenuItemProps<T> : VerticalMenuItemProps) => React.JSX.Element;
+export declare const VerticalMenuItem: <T>({ defaultOpen, title, iconType, adornment, children, customIcon, component, active, height, href, onClick, ...rest }: T extends React.ElementType ? InferredComponentProps<T> & VerticalMenuItemProps<T> : VerticalMenuItemProps) => React.JSX.Element;
 export default VerticalMenuItem;

package/esm/components/vertical-menu/vertical-menu-item/vertical-menu-item.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r,useContext as n}from"react";import o from"../../../__internal__/utils/helpers/tags/tags.js";import i from"../../../style/utils/filter-styled-system-padding-props.js";import{StyledVerticalMenuItem as c,StyledTitleIcon as l,StyledTitle as p,StyledAdornment as a,StyledChevronIcon as f,StyledList as u}from"../vertical-menu.style.js";import s from"./__internal__/menu-item.context.js";import{useVerticalMenuContext as y}from"../__internal__/vertical-menu.context.js";function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function b(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){m(e,t,r[t])}))}return e}const O=m=>{var{defaultOpen:O=!1,title:h,iconType:d,adornment:j,children:v,component:g,active:_,height:P="56px",href:w}=m,x=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(m,["defaultOpen","title","iconType","adornment","children","component","active","height","href"]);const[S,k]=r(O),{level:D}=n(s),{isFullScreen:E}=y(),I="function"==typeof _?_(S):_;let T={};return w&&(T={as:"a",href:w}),g&&(T=b({as:g,href:w,tabIndex:0},x)),v&&(T={as:"button",type:"button","aria-expanded":S,onClick:()=>{k((e=>!e))}}),e("li",{children:[e(c,(C=b({height:P,px:`calc(var(--spacing500) + (${D} * var(--spacing400)))`,py:2,active:I},T,i(x),o("vertical-menu-item",x)),F={children:[d&&t(l,{type:d}),t(p,{children:h}),j&&t(a,{children:"function"==typeof j?j(S):j}),v&&!E&&t(f,{type:S?"chevron_up_thick":"chevron_down_thick"})]},F=null!=F?F:{},Object.getOwnPropertyDescriptors?Object.defineProperties(C,Object.getOwnPropertyDescriptors(F)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(F)).forEach((function(e){Object.defineProperty(C,e,Object.getOwnPropertyDescriptor(F,e))})),C)),(S||E)&&t(s.Provider,{value:{level:D+1},children:t(u,{children:v})})]});var C,F};export{O as VerticalMenuItem,O as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r,useContext as n}from"react";import o from"../../../__internal__/utils/helpers/tags/tags.js";import c from"../../../style/utils/filter-styled-system-padding-props.js";import{StyledVerticalMenuItem as i,StyledCustomIconWrapper as l,StyledTitleIcon as p,StyledTitle as a,StyledAdornment as u,StyledChevronIcon as s,StyledList as f}from"../vertical-menu.style.js";import m from"./__internal__/menu-item.context.js";import{useVerticalMenuContext as y}from"../__internal__/vertical-menu.context.js";function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(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){b(e,t,r[t])}))}return e}const h=b=>{var{defaultOpen:h=!1,title:d,iconType:j,adornment:v,children:g,customIcon:_,component:P,active:w,height:x="56px",href:k,onClick:S}=b,D=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},c=Object.keys(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(b,["defaultOpen","title","iconType","adornment","children","customIcon","component","active","height","href","onClick"]);const[I,C]=r(h),{level:E}=n(m),{isFullScreen:T}=y(),F="function"==typeof w?w(I):w,$=O({},k&&{as:"a",href:k},!k&&P&&{as:P,tabIndex:0},!k&&!P&&(g||S)&&{as:"button",type:"button","aria-expanded":I},(k||!P)&&{onClick:e=>{C((e=>!e)),S&&S(e)}},D);return e("li",{children:[e(i,(q=O({height:x,px:`calc(var(--spacing500) + (${E} * var(--spacing400)))`,py:2,active:F},$,c(D),o("vertical-menu-item",D)),z={children:[(j||_)&&(_?t(l,{children:_}):j&&t(p,{type:j})),t(a,{children:d}),v&&t(u,{children:"function"==typeof v?v(I):v}),g&&!T&&t(s,{type:I?"chevron_up_thick":"chevron_down_thick"})]},z=null!=z?z:{},Object.getOwnPropertyDescriptors?Object.defineProperties(q,Object.getOwnPropertyDescriptors(z)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(z)).forEach((function(e){Object.defineProperty(q,e,Object.getOwnPropertyDescriptor(z,e))})),q)),(I||T)&&t(m.Provider,{value:{level:E+1},children:t(f,{children:g})})]});var q,z};export{h as VerticalMenuItem,h as default};

package/esm/components/vertical-menu/vertical-menu.style.d.ts

@@ -10,6 +10,7 @@ export declare const StyledVerticalMenuItem: import("styled-components").StyledC
 export declare const StyledTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledTitleIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
+export declare const StyledCustomIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledChevronIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, {
     theme: object;

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

@@ -1 +1 @@
-import e,{css as t}from"styled-components";import{padding as o}from"styled-system";import n from"../../style/utils/add-focus-styling.js";import i from"../../style/themes/apply-base-theme.js";import r from"../icon/icon.style.js";import a from"../icon/icon.component.js";import l from"../box/box.style.js";const d=e.ul.withConfig({displayName:"vertical-menu.style__StyledList",componentId:"sc-b3a4d279-0"})(["list-style:none;margin:0;padding:0;"]),s=e.div.attrs(i).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuItem",componentId:"sc-b3a4d279-1"})(["min-height:",";width:100%;display:flex;border:none;align-items:center;font-weight:500;font-size:14px;cursor:pointer;color:var(--colorsComponentsLeftnavWinterStandardContent);position:relative;box-sizing:border-box;text-decoration:none;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);"," &:hover{background-color:var(--colorsComponentsLeftnavWinterStandardHover);}&:focus{","}"," ","{width:20px;}"],(({height:e})=>e),o,n(!0),(({active:e})=>e&&t(['&:before{background:var(--colorsComponentsLeftnavWinterStandardSelected);border-radius:var(--borderRadius100);content:"";height:calc(100% - 16px);left:24px;position:absolute;top:8px;width:calc(100% - 48px);z-index:0;}&:hover{&:before{background:var(--colorsComponentsLeftnavWinterStandardHover);}}'])),r),c=e.span.withConfig({displayName:"vertical-menu.style__StyledTitle",componentId:"sc-b3a4d279-2"})(["font-weight:500;font-size:14px;line-height:21px;margin:0;z-index:1;text-align:left;"]),p=e.div.withConfig({displayName:"vertical-menu.style__StyledAdornment",componentId:"sc-b3a4d279-3"})(["display:flex;align-items:center;justify-content:flex-end;flex:1;"]),m=e(a).withConfig({displayName:"vertical-menu.style__StyledTitleIcon",componentId:"sc-b3a4d279-4"})(["margin-right:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),f=e(a).withConfig({displayName:"vertical-menu.style__StyledChevronIcon",componentId:"sc-b3a4d279-5"})(["margin-left:auto;padding-left:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),v=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenu",componentId:"sc-b3a4d279-6"})(["&::-webkit-scrollbar{width:12px;}"]),y=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuFullScreen",componentId:"sc-b3a4d279-7"})(["position:fixed;top:0;bottom:0;height:100vh;width:100%;outline:none;padding:8px 0px;overflow:auto;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);box-sizing:border-box;z-index:",";"," "," "," &::-webkit-scrollbar{width:12px;}"],(({theme:e})=>e.zIndex.fullScreenModal),(({prefersReducedMotion:e})=>!e&&t(["transition:all 0.3s ease;"])),(({isOpen:e})=>e&&t(["visibility:visible;transform:translateX(0);"])),(({isOpen:e})=>!e&&t(["transform:translateX(-100%);visibility:hidden;"])));export{p as StyledAdornment,f as StyledChevronIcon,d as StyledList,c as StyledTitle,m as StyledTitleIcon,v as StyledVerticalMenu,y as StyledVerticalMenuFullScreen,s as StyledVerticalMenuItem};
+import e,{css as t}from"styled-components";import{padding as o}from"styled-system";import n from"../../style/utils/add-focus-styling.js";import i from"../../style/themes/apply-base-theme.js";import r from"../icon/icon.style.js";import a from"../icon/icon.component.js";import l from"../box/box.style.js";const s=e.ul.withConfig({displayName:"vertical-menu.style__StyledList",componentId:"sc-eb6582b7-0"})(["list-style:none;margin:0;padding:0;"]),d=e.div.attrs(i).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuItem",componentId:"sc-eb6582b7-1"})(["min-height:",";width:100%;display:flex;border:none;align-items:center;font-weight:500;font-size:14px;cursor:pointer;color:var(--colorsComponentsLeftnavWinterStandardContent);position:relative;box-sizing:border-box;text-decoration:none;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);"," &:hover{background-color:var(--colorsComponentsLeftnavWinterStandardHover);}&:focus{","}"," ","{width:20px;}"],(({height:e})=>e),o,n(!0),(({active:e})=>e&&t(['&:before{background:var(--colorsComponentsLeftnavWinterStandardSelected);border-radius:var(--borderRadius100);content:"";height:calc(100% - 16px);left:24px;position:absolute;top:8px;width:calc(100% - 48px);z-index:0;}&:hover{&:before{background:var(--colorsComponentsLeftnavWinterStandardHover);}}'])),r),c=e.span.withConfig({displayName:"vertical-menu.style__StyledTitle",componentId:"sc-eb6582b7-2"})(["font-weight:500;font-size:14px;line-height:21px;margin:0;z-index:1;text-align:left;"]),p=e.div.withConfig({displayName:"vertical-menu.style__StyledAdornment",componentId:"sc-eb6582b7-3"})(["display:flex;align-items:center;justify-content:flex-end;flex:1;"]),m=e(a).withConfig({displayName:"vertical-menu.style__StyledTitleIcon",componentId:"sc-eb6582b7-4"})(["margin-right:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),f=e.div.withConfig({displayName:"vertical-menu.style__StyledCustomIconWrapper",componentId:"sc-eb6582b7-5"})(["margin-right:12px;width:20px;"]),b=e(a).withConfig({displayName:"vertical-menu.style__StyledChevronIcon",componentId:"sc-eb6582b7-6"})(["margin-left:auto;padding-left:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),y=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenu",componentId:"sc-eb6582b7-7"})(["&::-webkit-scrollbar{width:12px;}"]),v=e(l).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuFullScreen",componentId:"sc-eb6582b7-8"})(["position:fixed;top:0;bottom:0;height:100vh;width:100%;outline:none;padding:8px 0px;overflow:auto;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);box-sizing:border-box;z-index:",";"," "," "," &::-webkit-scrollbar{width:12px;}"],(({theme:e})=>e.zIndex.fullScreenModal),(({prefersReducedMotion:e})=>!e&&t(["transition:all 0.3s ease;"])),(({isOpen:e})=>e&&t(["visibility:visible;transform:translateX(0);"])),(({isOpen:e})=>!e&&t(["transform:translateX(-100%);visibility:hidden;"])));export{p as StyledAdornment,b as StyledChevronIcon,f as StyledCustomIconWrapper,s as StyledList,c as StyledTitle,m as StyledTitleIcon,y as StyledVerticalMenu,v as StyledVerticalMenuFullScreen,d as StyledVerticalMenuItem};

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 l(e){return e&&e.__esModule?e:{default:e}}function d(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){d(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 b=l(n).default.forwardRef(((l,d)=>{var{borders:b="default",defaultExpanded:f,expanded:p,onChange:y,children:g,handleKeyboardAccessibility:h,id:j,index:v,iconType:O,iconAlign:x,size:_="large",subTitle:m,title:w,width:S,headerSpacing:A,disableContentPadding:P=!1,error:C,warning:E,info:T,openTitle:k,variant:q="standard"}=l,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}(l,["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,H]=n.useState(f||!1),[K,R]=n.useState(I?"auto":0),$=n.useRef(null),M=D?p:I;r.default($,(()=>{var e;R(null===(e=$.current)||void 0===e?void 0:e.scrollHeight)})),n.useEffect((()=>{var e;R(null===(e=$.current)||void 0===e?void 0:e.scrollHeight)}),[M]);const V=n.useCallback((e=>{D||H(!M),null==y||y(e,!M)}),[D,M,y]),F=n.useCallback((e=>{h&&h(e,v),(o.default.isEnterKey(e)||o.default.isSpaceKey(e))&&(e.preventDefault(),V(e))}),[h,v,V]),N=n.useRef(i.default()),B=j||`Accordion_${N.current}`,G=`AccordionHeader_${N.current}`,J=`AccordionContent_${N.current}`,L=!!(C||E||T);return e.jsxs(a.StyledAccordionContainer,u(s({id:B,width:S,borders:"subtle"===q?"none":b,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:d,size:_,isExpanded:M,variant:q,role:"button"},A),{children:[e.jsxs(a.StyledAccordionHeadingsContainer,{"data-element":"accordion-headings-container",hasValidationIcon:L,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:[L&&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,{isExpanded:M,maxHeight:K,"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})})]}))}));b.displayName="Accordion",exports.Accordion=b,exports.default=b;
+"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;

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-f1b48a4b-0"})(["",""],t.margin),d=s.default.div.attrs(e.default).withConfig({displayName:"accordion.style__StyledAccordionContainer",componentId:"sc-f1b48a4b-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-f1b48a4b-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-f1b48a4b-3"})(["margin-top:8px;"]),g=s.default(i.default).withConfig({displayName:"accordion.style__StyledAccordionIcon",componentId:"sc-f1b48a4b-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);"))),f=s.default.div.withConfig({displayName:"accordion.style__StyledAccordionHeadingsContainer",componentId:"sc-f1b48a4b-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))),y=s.default.div.attrs(e.default).withConfig({displayName:"accordion.style__StyledAccordionTitleContainer",componentId:"sc-f1b48a4b-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-f1b48a4b-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",!i&&"\n      visibility: hidden;\n    "))),v=s.default.div.withConfig({displayName:"accordion.style__StyledAccordionContent",componentId:"sc-f1b48a4b-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=f,exports.StyledAccordionIcon=g,exports.StyledAccordionSubTitle=p,exports.StyledAccordionTitle=l,exports.StyledAccordionTitleContainer=y;
+"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;

package/lib/components/vertical-menu/index.d.ts

@@ -1,7 +1,7 @@
 export { default as VerticalMenu } from "./vertical-menu.component";
 export type { VerticalMenuProps } from "./vertical-menu.component";
 export { default as VerticalMenuItem } from "./vertical-menu-item/vertical-menu-item.component";
-export type { VerticalMenuItemProps } from "./vertical-menu-item/vertical-menu-item.component";
+export type { VerticalMenuItemClickEvent, VerticalMenuItemProps, } from "./vertical-menu-item/vertical-menu-item.component";
 export { default as VerticalMenuFullScreen } from "./vertical-menu-full-screen/vertical-menu-full-screen.component";
 export type { VerticalMenuFullScreenProps } from "./vertical-menu-full-screen/vertical-menu-full-screen.component";
 export { default as VerticalMenuTrigger } from "./vertical-menu-trigger/vertical-menu-trigger.component";

package/lib/components/vertical-menu/vertical-menu-item/vertical-menu-item.component.d.ts

@@ -1,17 +1,20 @@
-import React from "react";
+import React, { ReactNode } from "react";
 import { PaddingProps } from "styled-system";
 import { TagProps } from "../../../__internal__/utils/helpers/tags";
 import { IconType } from "../../icon";
+export type VerticalMenuItemClickEvent = React.MouseEvent<HTMLButtonElement | HTMLAnchorElement> | React.KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>;
 export interface VerticalMenuItemProps<T = React.ElementType> extends PaddingProps, TagProps {
     /** Children of the menu item - another level of VerticalMenuItems */
     children?: React.ReactNode;
+    /** Custom icon to be displayed. Takes precedence over `iconType` if both are specified. */
+    customIcon?: ReactNode;
     /** Default open state of the component */
     defaultOpen?: boolean;
     /** Title of the menu item */
     title: string;
     /** Adornment of the menu item meant to be rendered on the right side */
     adornment?: React.ReactNode | ((isOpen: boolean) => React.ReactNode);
-    /** Icon meant to be rendered on the left side */
+    /** The Carbon icon to be displayed. Defers to `customIcon` if both are defined. */
     iconType?: IconType;
     /** Whether the menu item is active or not */
     active?: boolean | ((isOpen: boolean) => boolean);
@@ -19,9 +22,11 @@ export interface VerticalMenuItemProps<T = React.ElementType> extends PaddingPro
     height?: string;
     /**  Href, when passed the menu item will be rendered as an anchor tag */
     href?: string;
+    /** A custom click handler to run when the menu item is clicked */
+    onClick?: (event: VerticalMenuItemClickEvent) => void;
     /** Optional component to render instead of the default div, useful for rendering router link components */
     component?: T;
 }
 type InferredComponentProps<T extends React.ElementType> = Omit<React.ComponentProps<T>, keyof VerticalMenuItemProps<T>>;
-export declare const VerticalMenuItem: <T>({ defaultOpen, title, iconType, adornment, children, component, active, height, href, ...rest }: T extends React.ElementType ? InferredComponentProps<T> & VerticalMenuItemProps<T> : VerticalMenuItemProps) => React.JSX.Element;
+export declare const VerticalMenuItem: <T>({ defaultOpen, title, iconType, adornment, children, customIcon, component, active, height, href, onClick, ...rest }: T extends React.ElementType ? InferredComponentProps<T> & VerticalMenuItemProps<T> : VerticalMenuItemProps) => React.JSX.Element;
 export default VerticalMenuItem;

package/lib/components/vertical-menu/vertical-menu-item/vertical-menu-item.component.js

@@ -1 +1 @@
-"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("../../../style/utils/filter-styled-system-padding-props.js"),i=require("../vertical-menu.style.js"),c=require("./__internal__/menu-item.context.js"),l=require("../__internal__/vertical-menu.context.js");function o(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){o(e,t,r[t])}))}return e}const s=o=>{var{defaultOpen:s=!1,title:a,iconType:p,adornment:y,children:f,component:d,active:b,height:j="56px",href:O}=o,h=function(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},c=Object.keys(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(n=0;n<c.length;n++)r=c[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}(o,["defaultOpen","title","iconType","adornment","children","component","active","height","href"]);const[v,m]=t.useState(s),{level:g}=t.useContext(c.default),{isFullScreen:x}=l.useVerticalMenuContext(),_="function"==typeof b?b(v):b;let P={};O&&(P={as:"a",href:O}),d&&(P=u({as:d,href:O,tabIndex:0},h)),f&&(P={as:"button",type:"button","aria-expanded":v,onClick:()=>{m((e=>!e))}});const S=`calc(var(--spacing500) + (${g} * var(--spacing400)))`;return e.jsxs("li",{children:[e.jsxs(i.StyledVerticalMenuItem,(w=u({height:j,px:S,py:2,active:_},P,n.default(h),r.default("vertical-menu-item",h)),q={children:[p&&e.jsx(i.StyledTitleIcon,{type:p}),e.jsx(i.StyledTitle,{children:a}),y&&e.jsx(i.StyledAdornment,{children:"function"==typeof y?y(v):y}),f&&!x&&e.jsx(i.StyledChevronIcon,{type:v?"chevron_up_thick":"chevron_down_thick"})]},q=null!=q?q:{},Object.getOwnPropertyDescriptors?Object.defineProperties(w,Object.getOwnPropertyDescriptors(q)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(q)).forEach((function(e){Object.defineProperty(w,e,Object.getOwnPropertyDescriptor(q,e))})),w)),(v||x)&&e.jsx(c.default.Provider,{value:{level:g+1},children:e.jsx(i.StyledList,{children:f})})]});var w,q};exports.VerticalMenuItem=s,exports.default=s;
+"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("../../../style/utils/filter-styled-system-padding-props.js"),c=require("../vertical-menu.style.js"),i=require("./__internal__/menu-item.context.js"),o=require("../__internal__/vertical-menu.context.js");function l(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){l(e,t,r[t])}))}return e}const s=l=>{var{defaultOpen:s=!1,title:a,iconType:p,adornment:y,children:f,customIcon:d,component:j,active:b,height:O="56px",href:h,onClick:m}=l,v=function(e,t){if(null==e)return{};var r,n,c=function(e,t){if(null==e)return{};var r,n,c={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(c[r]=e[r]);return c}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(c[r]=e[r])}return c}(l,["defaultOpen","title","iconType","adornment","children","customIcon","component","active","height","href","onClick"]);const[x,g]=t.useState(s),{level:_}=t.useContext(i.default),{isFullScreen:P}=o.useVerticalMenuContext(),S="function"==typeof b?b(x):b,w=u({},h&&{as:"a",href:h},!h&&j&&{as:j,tabIndex:0},!h&&!j&&(f||m)&&{as:"button",type:"button","aria-expanded":x},(h||!j)&&{onClick:e=>{g((e=>!e)),m&&m(e)}},v),I=`calc(var(--spacing500) + (${_} * var(--spacing400)))`;return e.jsxs("li",{children:[e.jsxs(c.StyledVerticalMenuItem,(k=u({height:O,px:I,py:2,active:S},w,n.default(v),r.default("vertical-menu-item",v)),q={children:[(p||d)&&(d?e.jsx(c.StyledCustomIconWrapper,{children:d}):p&&e.jsx(c.StyledTitleIcon,{type:p})),e.jsx(c.StyledTitle,{children:a}),y&&e.jsx(c.StyledAdornment,{children:"function"==typeof y?y(x):y}),f&&!P&&e.jsx(c.StyledChevronIcon,{type:x?"chevron_up_thick":"chevron_down_thick"})]},q=null!=q?q:{},Object.getOwnPropertyDescriptors?Object.defineProperties(k,Object.getOwnPropertyDescriptors(q)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(q)).forEach((function(e){Object.defineProperty(k,e,Object.getOwnPropertyDescriptor(q,e))})),k)),(x||P)&&e.jsx(i.default.Provider,{value:{level:_+1},children:e.jsx(c.StyledList,{children:f})})]});var k,q};exports.VerticalMenuItem=s,exports.default=s;

package/lib/components/vertical-menu/vertical-menu.style.d.ts

@@ -10,6 +10,7 @@ export declare const StyledVerticalMenuItem: import("styled-components").StyledC
 export declare const StyledTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledTitleIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
+export declare const StyledCustomIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledChevronIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../icon").IconProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const StyledVerticalMenu: import("styled-components").StyledComponent<"div", any, {
     theme: object;

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

@@ -1 +1 @@
-"use strict";var e=require("styled-components"),t=require("styled-system"),n=require("../../style/utils/add-focus-styling.js"),o=require("../../style/themes/apply-base-theme.js"),i=require("../icon/icon.style.js"),r=require("../icon/icon.component.js"),a=require("../box/box.style.js");function l(e){return e&&e.__esModule?e:{default:e}}var d=l(e);const s=d.default.ul.withConfig({displayName:"vertical-menu.style__StyledList",componentId:"sc-b3a4d279-0"})(["list-style:none;margin:0;padding:0;"]),c=d.default.div.attrs(o.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuItem",componentId:"sc-b3a4d279-1"})(["min-height:",";width:100%;display:flex;border:none;align-items:center;font-weight:500;font-size:14px;cursor:pointer;color:var(--colorsComponentsLeftnavWinterStandardContent);position:relative;box-sizing:border-box;text-decoration:none;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);"," &:hover{background-color:var(--colorsComponentsLeftnavWinterStandardHover);}&:focus{","}"," ","{width:20px;}"],(({height:e})=>e),t.padding,n.default(!0),(({active:t})=>t&&e.css(['&:before{background:var(--colorsComponentsLeftnavWinterStandardSelected);border-radius:var(--borderRadius100);content:"";height:calc(100% - 16px);left:24px;position:absolute;top:8px;width:calc(100% - 48px);z-index:0;}&:hover{&:before{background:var(--colorsComponentsLeftnavWinterStandardHover);}}'])),i.default),p=d.default.span.withConfig({displayName:"vertical-menu.style__StyledTitle",componentId:"sc-b3a4d279-2"})(["font-weight:500;font-size:14px;line-height:21px;margin:0;z-index:1;text-align:left;"]),u=d.default.div.withConfig({displayName:"vertical-menu.style__StyledAdornment",componentId:"sc-b3a4d279-3"})(["display:flex;align-items:center;justify-content:flex-end;flex:1;"]),f=d.default(r.default).withConfig({displayName:"vertical-menu.style__StyledTitleIcon",componentId:"sc-b3a4d279-4"})(["margin-right:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),m=d.default(r.default).withConfig({displayName:"vertical-menu.style__StyledChevronIcon",componentId:"sc-b3a4d279-5"})(["margin-left:auto;padding-left:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),y=d.default(a.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenu",componentId:"sc-b3a4d279-6"})(["&::-webkit-scrollbar{width:12px;}"]),v=d.default(a.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuFullScreen",componentId:"sc-b3a4d279-7"})(["position:fixed;top:0;bottom:0;height:100vh;width:100%;outline:none;padding:8px 0px;overflow:auto;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);box-sizing:border-box;z-index:",";"," "," "," &::-webkit-scrollbar{width:12px;}"],(({theme:e})=>e.zIndex.fullScreenModal),(({prefersReducedMotion:t})=>!t&&e.css(["transition:all 0.3s ease;"])),(({isOpen:t})=>t&&e.css(["visibility:visible;transform:translateX(0);"])),(({isOpen:t})=>!t&&e.css(["transform:translateX(-100%);visibility:hidden;"])));exports.StyledAdornment=u,exports.StyledChevronIcon=m,exports.StyledList=s,exports.StyledTitle=p,exports.StyledTitleIcon=f,exports.StyledVerticalMenu=y,exports.StyledVerticalMenuFullScreen=v,exports.StyledVerticalMenuItem=c;
+"use strict";var e=require("styled-components"),t=require("styled-system"),n=require("../../style/utils/add-focus-styling.js"),o=require("../../style/themes/apply-base-theme.js"),i=require("../icon/icon.style.js"),r=require("../icon/icon.component.js"),l=require("../box/box.style.js");function a(e){return e&&e.__esModule?e:{default:e}}var d=a(e);const s=d.default.ul.withConfig({displayName:"vertical-menu.style__StyledList",componentId:"sc-eb6582b7-0"})(["list-style:none;margin:0;padding:0;"]),c=d.default.div.attrs(o.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuItem",componentId:"sc-eb6582b7-1"})(["min-height:",";width:100%;display:flex;border:none;align-items:center;font-weight:500;font-size:14px;cursor:pointer;color:var(--colorsComponentsLeftnavWinterStandardContent);position:relative;box-sizing:border-box;text-decoration:none;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);"," &:hover{background-color:var(--colorsComponentsLeftnavWinterStandardHover);}&:focus{","}"," ","{width:20px;}"],(({height:e})=>e),t.padding,n.default(!0),(({active:t})=>t&&e.css(['&:before{background:var(--colorsComponentsLeftnavWinterStandardSelected);border-radius:var(--borderRadius100);content:"";height:calc(100% - 16px);left:24px;position:absolute;top:8px;width:calc(100% - 48px);z-index:0;}&:hover{&:before{background:var(--colorsComponentsLeftnavWinterStandardHover);}}'])),i.default),p=d.default.span.withConfig({displayName:"vertical-menu.style__StyledTitle",componentId:"sc-eb6582b7-2"})(["font-weight:500;font-size:14px;line-height:21px;margin:0;z-index:1;text-align:left;"]),u=d.default.div.withConfig({displayName:"vertical-menu.style__StyledAdornment",componentId:"sc-eb6582b7-3"})(["display:flex;align-items:center;justify-content:flex-end;flex:1;"]),f=d.default(r.default).withConfig({displayName:"vertical-menu.style__StyledTitleIcon",componentId:"sc-eb6582b7-4"})(["margin-right:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),m=d.default.div.withConfig({displayName:"vertical-menu.style__StyledCustomIconWrapper",componentId:"sc-eb6582b7-5"})(["margin-right:12px;width:20px;"]),y=d.default(r.default).withConfig({displayName:"vertical-menu.style__StyledChevronIcon",componentId:"sc-eb6582b7-6"})(["margin-left:auto;padding-left:12px;width:20px;color:var(--colorsComponentsLeftnavWinterStandardContent);"]),b=d.default(l.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenu",componentId:"sc-eb6582b7-7"})(["&::-webkit-scrollbar{width:12px;}"]),v=d.default(l.default).withConfig({displayName:"vertical-menu.style__StyledVerticalMenuFullScreen",componentId:"sc-eb6582b7-8"})(["position:fixed;top:0;bottom:0;height:100vh;width:100%;outline:none;padding:8px 0px;overflow:auto;background-color:var(--colorsComponentsLeftnavWinterStandardBackground);box-sizing:border-box;z-index:",";"," "," "," &::-webkit-scrollbar{width:12px;}"],(({theme:e})=>e.zIndex.fullScreenModal),(({prefersReducedMotion:t})=>!t&&e.css(["transition:all 0.3s ease;"])),(({isOpen:t})=>t&&e.css(["visibility:visible;transform:translateX(0);"])),(({isOpen:t})=>!t&&e.css(["transform:translateX(-100%);visibility:hidden;"])));exports.StyledAdornment=u,exports.StyledChevronIcon=y,exports.StyledCustomIconWrapper=m,exports.StyledList=s,exports.StyledTitle=p,exports.StyledTitleIcon=f,exports.StyledVerticalMenu=b,exports.StyledVerticalMenuFullScreen=v,exports.StyledVerticalMenuItem=c;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "158.19.1",
+  "version": "158.21.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",
@@ -126,7 +126,7 @@
     "@typescript-eslint/parser": "^8.35.1",
     "babel-jest": "^29.7.0",
     "babel-plugin-dev-expression": "^0.2.3",
-    "browserslist": "^4.26.3",
+    "browserslist": "^4.28.1",
     "chromatic": "13.3.3",
     "conventional-changelog-conventionalcommits": "^8.0.0",
     "core-js": "^3.45.1",