carbon-react 158.2.1 → 158.3.0

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

@@ -2,7 +2,10 @@ import React from "react";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
 import DrawerSidebarContext from "./__internal__/drawer-sidebar.context";
 export interface DrawerProps extends TagProps {
-    /** Duration of a animation */
+    /**
+     * Duration of a animation
+     * @deprecated This prop will soon be removed.
+     */
     animationDuration?: string;
     /** Specify an aria-label for the Drawer component */
     "aria-label"?: string;
@@ -10,18 +13,27 @@ export interface DrawerProps extends TagProps {
     sidebarAriaLabel?: string;
     /** Sets color of sidebar's background */
     backgroundColor?: string;
+    /** Main content to display */
     children: React.ReactNode;
-    /** Set the default state of expansion of the Drawer if component is meant to be used as uncontrolled */
+    /**
+     * Set the default state of expansion of the Drawer if component is meant to be used as uncontrolled
+     * @deprecated This prop will soon be removed, please use the `expanded` prop instead.
+     */
     defaultExpanded?: boolean;
     /** Sets the expansion state of the Drawer if component is meant to be used as controlled */
     expanded?: boolean;
+    /** The width of the expanded sidebar */
     expandedWidth?: string;
-    /** Sets custom height to Drawer component */
+    /** Sets the height of the component */
     height?: string;
     /** Callback fired when expansion state changes, onChange(event: object, isExpanded: boolean) */
     onChange?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
+    /** Drawer sidebar content */
     sidebar?: React.ReactNode;
-    /** Enables expand/collapse button that controls drawer */
+    /**
+     * Enables expand/collapse button that controls drawer
+     * @deprecated This prop will soon be removed, this component is now intended to be non-dismissible.
+     */
     showControls?: boolean;
     /** Sets the heading of the drawer */
     title?: React.ReactNode;
@@ -32,6 +44,6 @@ export interface DrawerProps extends TagProps {
     /** Makes the footer of the drawer sticky. Footer prop must also be set. */
     stickyFooter?: boolean;
 }
-export declare const Drawer: ({ "aria-label": ariaLabel, sidebarAriaLabel, "data-element": dataElement, "data-role": dataRole, defaultExpanded, expanded, onChange, children, expandedWidth, sidebar, animationDuration, backgroundColor, title, footer, showControls, height, stickyHeader, stickyFooter, }: DrawerProps) => React.JSX.Element;
+export declare const Drawer: ({ "aria-label": ariaLabel, sidebarAriaLabel, defaultExpanded, expanded, onChange, children, expandedWidth, sidebar, animationDuration, backgroundColor, title, footer, showControls, height, stickyHeader, stickyFooter, ...rest }: DrawerProps) => React.JSX.Element;
 export { DrawerSidebarContext };
 export default Drawer;

package/esm/components/drawer/drawer.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import{useRef as t,useState as o,useCallback as i,useEffect as a}from"react";import l from"invariant";import d from"../../__internal__/utils/helpers/guid/index.js";import c from"../../hooks/__internal__/usePrevious/index.js";import s from"../icon/icon.component.js";import{StyledDrawerWrapper as u,StyledDrawerContent as m,StyledSidebarHeader as h,StyledSidebarTitle as p,StyledDrawerSidebar as f,StyledDrawerChildren as b,StyledSidebarToggleButton as g}from"./drawer.style.js";import _ from"../../__internal__/sticky-footer/sticky-footer.component.js";import w from"./__internal__/drawer-sidebar.context.js";const x=({"aria-label":x,sidebarAriaLabel:v,"data-element":k,"data-role":j="drawer",defaultExpanded:y=!0,expanded:D,onChange:C,children:T,expandedWidth:E="40%",sidebar:I,animationDuration:O="400ms",backgroundColor:S,title:F,footer:P,showControls:W,height:$="100%",stickyHeader:A,stickyFooter:H})=>{const L=t(null),N=t(null),R=t(void 0!==D),[V,Y]=o(!1),[q,z]=o(!1),[B,G]=o(R.current?D:y),J=t(null),K=i((()=>{if(-1!==O.indexOf("ms")){const e=O.substring(0,O.length-2);return parseInt(e)}if(-1!==O.indexOf(".")||-1!==O.indexOf("s")){const e=O.substring(0,O.length-1);return 1e3*parseFloat(e)}return parseInt(O)}),[O]),M=i((()=>{const e=K();J.current&&clearTimeout(J.current),B?(Y(!1),z(!0),J.current=setTimeout((()=>{z(!1)}),e)):(z(!1),Y(!0),J.current=setTimeout((()=>{Y(!1)}),e))}),[K,B]),Q=c(D);a((()=>{l(R.current===(void 0!==D),"Drawer should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled Drawer element for the lifetime of the component"),R.current&&Q!==D&&(G(D),W||[D,Q].includes(void 0)||M())}),[D,M,Q,W]),a((()=>function(){J.current&&clearTimeout(J.current)}),[]);const U=i((e=>{G(!B),null==C||C(e,!B),B&&L.current&&(L.current.scrollTop=0),M()}),[M,B,C]),X=t(d()),Z=`DrawerSidebar_${X.current}`,ee=`DrawerTitle_${X.current}`,re=i((()=>{const e=[B?"open":"closed"];return V&&e.push("opening"),q&&e.push("closing"),e.join(" ")}),[B,V,q]),ne=()=>void 0===W?null:r(g,{"aria-label":"toggle sidebar","aria-expanded":B,"aria-controls":Z,"data-element":"drawer-toggle",onClick:U,isExpanded:B,animationDuration:O,children:r(s,{type:"chevron_right"})});return e(u,{"aria-label":x,"data-component":"drawer","data-element":k,"data-role":j,height:$,children:[e(m,{expandedWidth:E,animationDuration:O,className:re(),ref:L,backgroundColor:S,"data-element":"drawer-content","data-role":"drawer-content","aria-label":v,"aria-labelledby":F?ee:void 0,children:[A&&e(h,{"data-role":"drawer-sidebar-header",isExpanded:B,children:[F&&r(p,{id:ee,children:F}),ne()]}),!A&&e(n,{children:[F&&r(p,{id:ee,children:F}),ne()]}),e(f,{hasControls:!!W,id:Z,isExpanded:B,overflowY:B?"auto":void 0,scrollVariant:"light",ref:N,children:[r(w.Provider,{value:{isInSidebar:!0},children:I}),P&&r(_,{containerRef:N,disableSticky:!H,children:P})]})]}),r(b,{children:T})]})};export{x as Drawer,w as DrawerSidebarContext,x as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useRef as t,useState as n,useEffect as o,useCallback as i}from"react";import a from"invariant";import l from"../../__internal__/utils/helpers/guid/index.js";import d from"../../hooks/__internal__/usePrevious/index.js";import c from"../icon/icon.component.js";import{StyledDrawerWrapper as s,StyledDrawerContent as p,StyledSidebarTitle as u,StyledDrawerSidebar as b,StyledSidebarFooter as f,StyledSidebarToggleButton as m}from"./drawer.style.js";import h from"../../__internal__/utils/helpers/tags/tags.js";import g from"./__internal__/drawer-sidebar.context.js";import w from"../../__internal__/utils/logger/index.js";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}let O=!1,v=!1,j=!1;const _=_=>{var{"aria-label":x,sidebarAriaLabel:D,defaultExpanded:P,expanded:k,onChange:C,children:E,expandedWidth:S="30vw",sidebar:H,animationDuration:T="400ms",backgroundColor:A,title:F,footer:W,showControls:I,height:L="100%",stickyHeader:$,stickyFooter:q}=_,z=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}(_,["aria-label","sidebarAriaLabel","defaultExpanded","expanded","onChange","children","expandedWidth","sidebar","animationDuration","backgroundColor","title","footer","showControls","height","stickyHeader","stickyFooter"]);"400ms"===T||O||(w.deprecate("The `animationDuration` prop in `Drawer` is deprecated and will soon be removed."),O=!0),void 0===I||j||(w.deprecate("The `showControls` prop in `Drawer` is deprecated and will soon be removed."),j=!0),void 0===P||v||(w.deprecate("The `defaultExpanded` prop in `Drawer` is deprecated and will soon be removed."),v=!0);const B=t(l()),G=`DrawerSidebar_${B.current}`,J=`DrawerTitle_${B.current}`,K=t(null),M=t(null),N=t(void 0!==k),[Q,R]=n(N.current?k:null==P||P),U=d(k);o((()=>{a(N.current===(void 0!==k),"Drawer should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled Drawer element for the lifetime of the component"),N.current&&U!==k&&R(k)}),[k,U,I]),o((()=>{const e=M.current;e&&(e.scrollHeight>e.clientHeight?e.setAttribute("tabindex","0"):e.removeAttribute("tabindex"))}),[H,Q]);const V=i((e=>{R(!Q),null==C||C(e,!Q),Q&&K.current&&(K.current.scrollTop=0)}),[Q,C]);return e(s,(X=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){y(e,r,t[r])}))}return e}({"aria-label":x,height:L},h("drawer",z)),Y=null!=(Y={children:[e(p,{expandedWidth:S,animationDuration:T,isExpanded:Q,showControls:I,ref:K,backgroundColor:A,"data-element":"drawer-content","data-role":"drawer-content","aria-label":D,"aria-labelledby":F?J:void 0,children:[F&&r(u,{id:J,stickyHeader:$,children:F}),I&&r(m,{"aria-label":"toggle sidebar","aria-expanded":Q,"aria-controls":G,"data-element":"drawer-toggle",onClick:V,isExpanded:Q,children:r(c,{type:"chevron_right"})}),r(b,{"data-element":"drawer-sidebar",id:G,ref:M,children:r(g.Provider,{value:{isInSidebar:!0},children:H})}),W&&r(f,{stickyFooter:q,children:W})]}),E]})?Y:{},Object.getOwnPropertyDescriptors?Object.defineProperties(X,Object.getOwnPropertyDescriptors(Y)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(Y)).forEach((function(e){Object.defineProperty(X,e,Object.getOwnPropertyDescriptor(Y,e))})),X));var X,Y};export{_ as Drawer,g as DrawerSidebarContext,_ as default};

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

@@ -1,21 +1,19 @@
-declare const StyledSidebarHeader: import("styled-components").StyledComponent<"div", any, {
-    isExpanded?: boolean;
+export declare const StyledSidebarTitle: import("styled-components").StyledComponent<"div", any, {
+    stickyHeader?: boolean;
 }, never>;
-declare const StyledSidebarTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
-declare const StyledDrawerChildren: import("styled-components").StyledComponent<"div", any, {}, never>;
-interface StyledDrawerSidebarProps {
-    isExpanded?: boolean;
-    hasControls: boolean;
-}
-declare const StyledDrawerSidebar: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../box").BoxProps & import("react").RefAttributes<HTMLDivElement>>, any, StyledDrawerSidebarProps, never>;
+export declare const StyledSidebarFooter: import("styled-components").StyledComponent<"div", any, {
+    stickyFooter?: boolean;
+}, never>;
+declare const StyledDrawerSidebar: import("styled-components").StyledComponent<"div", any, {}, never>;
 interface StyledDrawerContentProps {
     animationDuration?: string;
     backgroundColor?: string;
-    expandedWidth: string;
+    expandedWidth?: string;
+    isExpanded?: boolean;
+    showControls?: boolean;
 }
 declare const StyledDrawerContent: import("styled-components").StyledComponent<"aside", any, StyledDrawerContentProps, never>;
 interface StyledSidebarToggleButtonProps {
-    animationDuration?: string;
     isExpanded?: boolean;
 }
 declare const StyledSidebarToggleButton: import("styled-components").StyledComponent<"button", any, {
@@ -24,6 +22,6 @@ declare const StyledSidebarToggleButton: import("styled-components").StyledCompo
     type: "button";
 } & StyledSidebarToggleButtonProps, "theme" | "type">;
 declare const StyledDrawerWrapper: import("styled-components").StyledComponent<"div", any, {
-    height: string;
+    height?: string;
 }, never>;
-export { StyledSidebarHeader, StyledDrawerWrapper, StyledDrawerContent, StyledDrawerChildren, StyledDrawerSidebar, StyledSidebarTitle, StyledSidebarToggleButton, };
+export { StyledDrawerWrapper, StyledDrawerContent, StyledDrawerSidebar, StyledSidebarToggleButton, };

package/esm/components/drawer/drawer.style.js

@@ -1 +1 @@
-import i,{css as t,keyframes as o}from"styled-components";import{StyledTabs as a}from"../tabs/__next__/tabs.style.js";import{Box as e}from"../box/box.component.js";import n from"../../__internal__/sticky-footer/sticky-footer.style.js";import r from"../../style/utils/add-focus-styling.js";import d from"../../style/themes/apply-base-theme.js";const s="var(--sizing500)",l=i.div.withConfig({displayName:"drawer.style__StyledSidebarHeader",componentId:"sc-b4625785-0"})(["",""],(({isExpanded:i})=>t(["position:sticky;top:0;",""],i&&t(["border-bottom:var(--sizing010) solid #ccd6db;"])))),p=i.div.withConfig({displayName:"drawer.style__StyledSidebarTitle",componentId:"sc-b4625785-1"})(["white-space:nowrap;padding:var(--spacing300) var(--spacing500);"]),c=i.div.withConfig({displayName:"drawer.style__StyledDrawerChildren",componentId:"sc-b4625785-2"})(["flex:1;margin-left:1px;overflow:auto;"]),m=i(e).withConfig({displayName:"drawer.style__StyledDrawerSidebar",componentId:"sc-b4625785-3"})([""," &::-webkit-scrollbar{width:12px;}"],(({hasControls:i,isExpanded:o})=>t([""," "," ",""],!o&&t(["display:none;opacity:0;"]),o&&t(["display:flex;flex-direction:column;flex:1 1 0%;"]),i&&t(["","{margin-top:48px;","}"],a,!o&&t(["display:none;"]))))),y=()=>o(["0%{float:right;}100%{float:right;}"]),h=()=>o(["0%{float:right;}80%{float:right;}100%{float:left;}"]),g=i.aside.withConfig({displayName:"drawer.style__StyledDrawerContent",componentId:"sc-b4625785-4"})(["display:flex;flex-direction:column;min-width:",";width:",";min-height:40px;height:auto;position:relative;overflow:auto;",";&.open{min-width:52px;width:",";",",","{display:block;opacity:1;}}&.opening{animation:"," ease-in-out;",",","{animation:"," "," ease-in-out;}}&.closed{overflow:hidden;",",",",","{display:block;opacity:0;}}&.closing{animation:"," ease-in-out;",",",",","{animation:"," "," ease-in-out;}}"],s,s,(({backgroundColor:i})=>t(["background-color:",";border-right:1px solid ",";"],i||"var(--colorsUtilityMajor040)",i||"var(--colorsUtilityMajor075)")),(({expandedWidth:i})=>i),m,p,(({animationDuration:i,expandedWidth:a})=>t([""," ",""],(i=>o(["0%{width:",";overflow:hidden;min-width:",";}100%{width:",";min-width:52px;}"],s,s,i))(a),i)),m,p,(()=>o(["0%{opacity:0;}50%{opacity:0;}100%{opacity:1;}"])),(({animationDuration:i})=>i),m,p,n,(({animationDuration:i,expandedWidth:a})=>t([""," ",""],(i=>o(["0%{width:",";}100%{width:",";}"],i,s))(a),i)),m,p,n,(()=>o(["0%{opacity:1;}100%{opacity:0;display:none;}"])),(({animationDuration:i})=>i)),f=i.button.attrs(d).attrs({type:"button"}).withConfig({displayName:"drawer.style__StyledSidebarToggleButton",componentId:"sc-b4625785-5"})(["",""],(({animationDuration:i,isExpanded:o})=>t(["position:absolute;top:var(--spacing300);right:8px;padding:var(--spacing100);width:var(--spacing300);height:var(--spacing300);display:flex;justify-content:center;align-items:center;transition:margin-right "," ease-in-out;background-color:transparent;border:none;z-index:1;animation:"," "," ease-in-out;border-radius:var(--borderRadius050);&:focus{","}&:hover{cursor:pointer;}",""],i,h,i,r(),o&&t(["transform:scaleX(-1);animation:"," "," ease-in-out;"],y,i)))),w=i.div.withConfig({displayName:"drawer.style__StyledDrawerWrapper",componentId:"sc-b4625785-6"})(["display:flex;height:",";"],(({height:i})=>i));export{c as StyledDrawerChildren,g as StyledDrawerContent,m as StyledDrawerSidebar,w as StyledDrawerWrapper,l as StyledSidebarHeader,p as StyledSidebarTitle,f as StyledSidebarToggleButton};
+import t,{css as e}from"styled-components";import i from"../../style/utils/add-focus-styling.js";import o from"../../style/themes/apply-base-theme.js";const a=t.div.withConfig({displayName:"drawer.style__StyledSidebarTitle",componentId:"sc-4497ce5f-0"})(["padding:var(--spacing300);",""],(({stickyHeader:t})=>t&&e(["position:sticky;top:0;border-bottom:var(--sizing010) solid #a0a0a0;"]))),r=t.div.withConfig({displayName:"drawer.style__StyledSidebarFooter",componentId:"sc-4497ce5f-1"})(["padding:var(--spacing300);background-color:var(--colorsUtilityYang100);",""],(({stickyFooter:t})=>t&&e(["position:sticky;bottom:0;"]))),n=t.div.withConfig({displayName:"drawer.style__StyledDrawerSidebar",componentId:"sc-4497ce5f-2"})(["display:flex;flex-direction:column;flex:1 1 0%;overflow-y:auto;outline:none;"]),d=t.aside.withConfig({displayName:"drawer.style__StyledDrawerContent",componentId:"sc-4497ce5f-3"})(["",";"],(({animationDuration:t,backgroundColor:i,expandedWidth:o,isExpanded:d,showControls:s})=>e(['flex-direction:column;height:auto;position:relative;overflow:auto;display:flex;min-width:"288px";width:',';max-width:"760px";'," background-color:",";",""],o,!d&&e(["display:none;width:0;min-width:0;"]),i||"var(--colorsUtilityYang100)",s&&e(["display:flex;overflow:hidden;min-height:40px;transition:all "," ease-in-out;",",",",","{transition:all "," ease-in-out;white-space:nowrap;overflow:hidden;opacity:1;}",""],t,n,a,r,t,!d&&e(["min-width:var(--sizing500);width:var(--sizing500);",",",",","{opacity:0;}"],n,a,r))))),s=t.button.attrs(o).attrs({type:"button"}).withConfig({displayName:"drawer.style__StyledSidebarToggleButton",componentId:"sc-4497ce5f-4"})(["",""],(({isExpanded:t})=>e(["position:absolute;top:var(--spacing300);right:8px;padding:var(--spacing100);width:var(--spacing300);height:var(--spacing300);display:flex;justify-content:center;align-items:center;background-color:transparent;border:none;z-index:1;border-radius:var(--borderRadius050);transform:rotate(0deg);&:focus{","}&:hover{cursor:pointer;}",""],i(),t&&e(["transform:rotate(180deg);"])))),l=t.div.withConfig({displayName:"drawer.style__StyledDrawerWrapper",componentId:"sc-4497ce5f-5"})(["display:flex;",""],(({height:t})=>e(["height:",";"],t)));export{d as StyledDrawerContent,n as StyledDrawerSidebar,l as StyledDrawerWrapper,r as StyledSidebarFooter,a as StyledSidebarTitle,s as StyledSidebarToggleButton};

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

@@ -2,7 +2,10 @@ import React from "react";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
 import DrawerSidebarContext from "./__internal__/drawer-sidebar.context";
 export interface DrawerProps extends TagProps {
-    /** Duration of a animation */
+    /**
+     * Duration of a animation
+     * @deprecated This prop will soon be removed.
+     */
     animationDuration?: string;
     /** Specify an aria-label for the Drawer component */
     "aria-label"?: string;
@@ -10,18 +13,27 @@ export interface DrawerProps extends TagProps {
     sidebarAriaLabel?: string;
     /** Sets color of sidebar's background */
     backgroundColor?: string;
+    /** Main content to display */
     children: React.ReactNode;
-    /** Set the default state of expansion of the Drawer if component is meant to be used as uncontrolled */
+    /**
+     * Set the default state of expansion of the Drawer if component is meant to be used as uncontrolled
+     * @deprecated This prop will soon be removed, please use the `expanded` prop instead.
+     */
     defaultExpanded?: boolean;
     /** Sets the expansion state of the Drawer if component is meant to be used as controlled */
     expanded?: boolean;
+    /** The width of the expanded sidebar */
     expandedWidth?: string;
-    /** Sets custom height to Drawer component */
+    /** Sets the height of the component */
     height?: string;
     /** Callback fired when expansion state changes, onChange(event: object, isExpanded: boolean) */
     onChange?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
+    /** Drawer sidebar content */
     sidebar?: React.ReactNode;
-    /** Enables expand/collapse button that controls drawer */
+    /**
+     * Enables expand/collapse button that controls drawer
+     * @deprecated This prop will soon be removed, this component is now intended to be non-dismissible.
+     */
     showControls?: boolean;
     /** Sets the heading of the drawer */
     title?: React.ReactNode;
@@ -32,6 +44,6 @@ export interface DrawerProps extends TagProps {
     /** Makes the footer of the drawer sticky. Footer prop must also be set. */
     stickyFooter?: boolean;
 }
-export declare const Drawer: ({ "aria-label": ariaLabel, sidebarAriaLabel, "data-element": dataElement, "data-role": dataRole, defaultExpanded, expanded, onChange, children, expandedWidth, sidebar, animationDuration, backgroundColor, title, footer, showControls, height, stickyHeader, stickyFooter, }: DrawerProps) => React.JSX.Element;
+export declare const Drawer: ({ "aria-label": ariaLabel, sidebarAriaLabel, defaultExpanded, expanded, onChange, children, expandedWidth, sidebar, animationDuration, backgroundColor, title, footer, showControls, height, stickyHeader, stickyFooter, ...rest }: DrawerProps) => React.JSX.Element;
 export { DrawerSidebarContext };
 export default Drawer;

package/lib/components/drawer/drawer.component.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("invariant"),a=require("../../__internal__/utils/helpers/guid/index.js"),n=require("../../hooks/__internal__/usePrevious/index.js"),i=require("../icon/icon.component.js"),l=require("./drawer.style.js"),d=require("../../__internal__/sticky-footer/sticky-footer.component.js"),o=require("./__internal__/drawer-sidebar.context.js");function s(e){return e&&e.__esModule?e:{default:e}}var u=s(t);const c=({"aria-label":t,sidebarAriaLabel:s,"data-element":c,"data-role":f="drawer",defaultExpanded:h=!0,expanded:x,onChange:b,children:p,expandedWidth:m="40%",sidebar:_,animationDuration:g="400ms",backgroundColor:w,title:j,footer:S,showControls:v,height:y="100%",stickyHeader:D,stickyFooter:k})=>{const C=r.useRef(null),q=r.useRef(null),T=r.useRef(void 0!==x),[E,R]=r.useState(!1),[O,F]=r.useState(!1),[I,P]=r.useState(T.current?x:h),W=r.useRef(null),H=r.useCallback((()=>{if(-1!==g.indexOf("ms")){const e=g.substring(0,g.length-2);return parseInt(e)}if(-1!==g.indexOf(".")||-1!==g.indexOf("s")){const e=g.substring(0,g.length-1);return 1e3*parseFloat(e)}return parseInt(g)}),[g]),M=r.useCallback((()=>{const e=H();W.current&&clearTimeout(W.current),I?(R(!1),F(!0),W.current=setTimeout((()=>{F(!1)}),e)):(F(!1),R(!0),W.current=setTimeout((()=>{R(!1)}),e))}),[H,I]),$=n.default(x);r.useEffect((()=>{u.default(T.current===(void 0!==x),"Drawer should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled Drawer element for the lifetime of the component"),T.current&&$!==x&&(P(x),v||[x,$].includes(void 0)||M())}),[x,M,$,v]),r.useEffect((()=>function(){W.current&&clearTimeout(W.current)}),[]);const A=r.useCallback((e=>{P(!I),null==b||b(e,!I),I&&C.current&&(C.current.scrollTop=0),M()}),[M,I,b]),B=r.useRef(a.default()),L=`DrawerSidebar_${B.current}`,N=`DrawerTitle_${B.current}`,V=r.useCallback((()=>{const e=[I?"open":"closed"];return E&&e.push("opening"),O&&e.push("closing"),e.join(" ")}),[I,E,O]),Y=()=>void 0===v?null:e.jsx(l.StyledSidebarToggleButton,{"aria-label":"toggle sidebar","aria-expanded":I,"aria-controls":L,"data-element":"drawer-toggle",onClick:A,isExpanded:I,animationDuration:g,children:e.jsx(i.default,{type:"chevron_right"})});return e.jsxs(l.StyledDrawerWrapper,{"aria-label":t,"data-component":"drawer","data-element":c,"data-role":f,height:y,children:[e.jsxs(l.StyledDrawerContent,{expandedWidth:m,animationDuration:g,className:V(),ref:C,backgroundColor:w,"data-element":"drawer-content","data-role":"drawer-content","aria-label":s,"aria-labelledby":j?N:void 0,children:[D&&e.jsxs(l.StyledSidebarHeader,{"data-role":"drawer-sidebar-header",isExpanded:I,children:[j&&e.jsx(l.StyledSidebarTitle,{id:N,children:j}),Y()]}),!D&&e.jsxs(e.Fragment,{children:[j&&e.jsx(l.StyledSidebarTitle,{id:N,children:j}),Y()]}),e.jsxs(l.StyledDrawerSidebar,{hasControls:!!v,id:L,isExpanded:I,overflowY:I?"auto":void 0,scrollVariant:"light",ref:q,children:[e.jsx(o.default.Provider,{value:{isInSidebar:!0},children:_}),S&&e.jsx(d.default,{containerRef:q,disableSticky:!k,children:S})]})]}),e.jsx(l.StyledDrawerChildren,{children:p})]})};exports.DrawerSidebarContext=o.default,exports.Drawer=c,exports.default=c;
+"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/guid/index.js"),a=require("../../hooks/__internal__/usePrevious/index.js"),o=require("../icon/icon.component.js"),i=require("./drawer.style.js"),l=require("../../__internal__/utils/helpers/tags/tags.js"),d=require("./__internal__/drawer-sidebar.context.js"),s=require("../../__internal__/utils/logger/index.js");function c(e){return e&&e.__esModule?e:{default:e}}var u=c(t);function b(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}let p=!1,f=!1,h=!1;const y=t=>{var{"aria-label":c,sidebarAriaLabel:y,defaultExpanded:w,expanded:g,onChange:j,children:x,expandedWidth:O="30vw",sidebar:v,animationDuration:m="400ms",backgroundColor:_,title:D,footer:S,showControls:P,height:k="100%",stickyHeader:C,stickyFooter:q}=t,E=function(e,r){if(null==e)return{};var t,n,a=function(e,r){if(null==e)return{};var t,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(a[t]=e[t]);return a}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}(t,["aria-label","sidebarAriaLabel","defaultExpanded","expanded","onChange","children","expandedWidth","sidebar","animationDuration","backgroundColor","title","footer","showControls","height","stickyHeader","stickyFooter"]);"400ms"===m||p||(s.default.deprecate("The `animationDuration` prop in `Drawer` is deprecated and will soon be removed."),p=!0),void 0===P||h||(s.default.deprecate("The `showControls` prop in `Drawer` is deprecated and will soon be removed."),h=!0),void 0===w||f||(s.default.deprecate("The `defaultExpanded` prop in `Drawer` is deprecated and will soon be removed."),f=!0);const T=r.useRef(n.default()),H=`DrawerSidebar_${T.current}`,A=`DrawerTitle_${T.current}`,F=r.useRef(null),R=r.useRef(null),W=r.useRef(void 0!==g),[I,L]=r.useState(W.current?g:null==w||w),M=a.default(g);r.useEffect((()=>{u.default(W.current===(void 0!==g),"Drawer should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled Drawer element for the lifetime of the component"),W.current&&M!==g&&L(g)}),[g,M,P]),r.useEffect((()=>{const e=R.current;e&&(e.scrollHeight>e.clientHeight?e.setAttribute("tabindex","0"):e.removeAttribute("tabindex"))}),[v,I]);const $=r.useCallback((e=>{L(!I),null==j||j(e,!I),I&&F.current&&(F.current.scrollTop=0)}),[I,j]);return e.jsxs(i.StyledDrawerWrapper,(B=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){b(e,r,t[r])}))}return e}({"aria-label":c,height:k},l.default("drawer",E)),z=null!=(z={children:[e.jsxs(i.StyledDrawerContent,{expandedWidth:O,animationDuration:m,isExpanded:I,showControls:P,ref:F,backgroundColor:_,"data-element":"drawer-content","data-role":"drawer-content","aria-label":y,"aria-labelledby":D?A:void 0,children:[D&&e.jsx(i.StyledSidebarTitle,{id:A,stickyHeader:C,children:D}),P&&e.jsx(i.StyledSidebarToggleButton,{"aria-label":"toggle sidebar","aria-expanded":I,"aria-controls":H,"data-element":"drawer-toggle",onClick:$,isExpanded:I,children:e.jsx(o.default,{type:"chevron_right"})}),e.jsx(i.StyledDrawerSidebar,{"data-element":"drawer-sidebar",id:H,ref:R,children:e.jsx(d.default.Provider,{value:{isInSidebar:!0},children:v})}),S&&e.jsx(i.StyledSidebarFooter,{stickyFooter:q,children:S})]}),x]})?z:{},Object.getOwnPropertyDescriptors?Object.defineProperties(B,Object.getOwnPropertyDescriptors(z)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(z)).forEach((function(e){Object.defineProperty(B,e,Object.getOwnPropertyDescriptor(z,e))})),B));var B,z};exports.DrawerSidebarContext=d.default,exports.Drawer=y,exports.default=y;

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

@@ -1,21 +1,19 @@
-declare const StyledSidebarHeader: import("styled-components").StyledComponent<"div", any, {
-    isExpanded?: boolean;
+export declare const StyledSidebarTitle: import("styled-components").StyledComponent<"div", any, {
+    stickyHeader?: boolean;
 }, never>;
-declare const StyledSidebarTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
-declare const StyledDrawerChildren: import("styled-components").StyledComponent<"div", any, {}, never>;
-interface StyledDrawerSidebarProps {
-    isExpanded?: boolean;
-    hasControls: boolean;
-}
-declare const StyledDrawerSidebar: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../box").BoxProps & import("react").RefAttributes<HTMLDivElement>>, any, StyledDrawerSidebarProps, never>;
+export declare const StyledSidebarFooter: import("styled-components").StyledComponent<"div", any, {
+    stickyFooter?: boolean;
+}, never>;
+declare const StyledDrawerSidebar: import("styled-components").StyledComponent<"div", any, {}, never>;
 interface StyledDrawerContentProps {
     animationDuration?: string;
     backgroundColor?: string;
-    expandedWidth: string;
+    expandedWidth?: string;
+    isExpanded?: boolean;
+    showControls?: boolean;
 }
 declare const StyledDrawerContent: import("styled-components").StyledComponent<"aside", any, StyledDrawerContentProps, never>;
 interface StyledSidebarToggleButtonProps {
-    animationDuration?: string;
     isExpanded?: boolean;
 }
 declare const StyledSidebarToggleButton: import("styled-components").StyledComponent<"button", any, {
@@ -24,6 +22,6 @@ declare const StyledSidebarToggleButton: import("styled-components").StyledCompo
     type: "button";
 } & StyledSidebarToggleButtonProps, "theme" | "type">;
 declare const StyledDrawerWrapper: import("styled-components").StyledComponent<"div", any, {
-    height: string;
+    height?: string;
 }, never>;
-export { StyledSidebarHeader, StyledDrawerWrapper, StyledDrawerContent, StyledDrawerChildren, StyledDrawerSidebar, StyledSidebarTitle, StyledSidebarToggleButton, };
+export { StyledDrawerWrapper, StyledDrawerContent, StyledDrawerSidebar, StyledSidebarToggleButton, };

package/lib/components/drawer/drawer.style.js

@@ -1 +1 @@
-"use strict";var e=require("styled-components"),t=require("../tabs/__next__/tabs.style.js"),i=require("../box/box.component.js"),a=require("../../__internal__/sticky-footer/sticky-footer.style.js"),o=require("../../style/utils/add-focus-styling.js"),r=require("../../style/themes/apply-base-theme.js");function n(e){return e&&e.__esModule?e:{default:e}}var s=n(e);const d="var(--sizing500)",l=s.default.div.withConfig({displayName:"drawer.style__StyledSidebarHeader",componentId:"sc-b4625785-0"})(["",""],(({isExpanded:t})=>e.css(["position:sticky;top:0;",""],t&&e.css(["border-bottom:var(--sizing010) solid #ccd6db;"])))),p=s.default.div.withConfig({displayName:"drawer.style__StyledSidebarTitle",componentId:"sc-b4625785-1"})(["white-space:nowrap;padding:var(--spacing300) var(--spacing500);"]),c=s.default.div.withConfig({displayName:"drawer.style__StyledDrawerChildren",componentId:"sc-b4625785-2"})(["flex:1;margin-left:1px;overflow:auto;"]),y=s.default(i.Box).withConfig({displayName:"drawer.style__StyledDrawerSidebar",componentId:"sc-b4625785-3"})([""," &::-webkit-scrollbar{width:12px;}"],(({hasControls:i,isExpanded:a})=>e.css([""," "," ",""],!a&&e.css(["display:none;opacity:0;"]),a&&e.css(["display:flex;flex-direction:column;flex:1 1 0%;"]),i&&e.css(["","{margin-top:48px;","}"],t.StyledTabs,!a&&e.css(["display:none;"]))))),u=()=>e.keyframes(["0%{float:right;}100%{float:right;}"]),f=()=>e.keyframes(["0%{float:right;}80%{float:right;}100%{float:left;}"]),h=s.default.aside.withConfig({displayName:"drawer.style__StyledDrawerContent",componentId:"sc-b4625785-4"})(["display:flex;flex-direction:column;min-width:",";width:",";min-height:40px;height:auto;position:relative;overflow:auto;",";&.open{min-width:52px;width:",";",",","{display:block;opacity:1;}}&.opening{animation:"," ease-in-out;",",","{animation:"," "," ease-in-out;}}&.closed{overflow:hidden;",",",",","{display:block;opacity:0;}}&.closing{animation:"," ease-in-out;",",",",","{animation:"," "," ease-in-out;}}"],d,d,(({backgroundColor:t})=>e.css(["background-color:",";border-right:1px solid ",";"],t||"var(--colorsUtilityMajor040)",t||"var(--colorsUtilityMajor075)")),(({expandedWidth:e})=>e),y,p,(({animationDuration:t,expandedWidth:i})=>e.css([""," ",""],(t=>e.keyframes(["0%{width:",";overflow:hidden;min-width:",";}100%{width:",";min-width:52px;}"],d,d,t))(i),t)),y,p,(()=>e.keyframes(["0%{opacity:0;}50%{opacity:0;}100%{opacity:1;}"])),(({animationDuration:e})=>e),y,p,a.default,(({animationDuration:t,expandedWidth:i})=>e.css([""," ",""],(t=>e.keyframes(["0%{width:",";}100%{width:",";}"],t,d))(i),t)),y,p,a.default,(()=>e.keyframes(["0%{opacity:1;}100%{opacity:0;display:none;}"])),(({animationDuration:e})=>e)),m=s.default.button.attrs(r.default).attrs({type:"button"}).withConfig({displayName:"drawer.style__StyledSidebarToggleButton",componentId:"sc-b4625785-5"})(["",""],(({animationDuration:t,isExpanded:i})=>e.css(["position:absolute;top:var(--spacing300);right:8px;padding:var(--spacing100);width:var(--spacing300);height:var(--spacing300);display:flex;justify-content:center;align-items:center;transition:margin-right "," ease-in-out;background-color:transparent;border:none;z-index:1;animation:"," "," ease-in-out;border-radius:var(--borderRadius050);&:focus{","}&:hover{cursor:pointer;}",""],t,f,t,o.default(),i&&e.css(["transform:scaleX(-1);animation:"," "," ease-in-out;"],u,t)))),g=s.default.div.withConfig({displayName:"drawer.style__StyledDrawerWrapper",componentId:"sc-b4625785-6"})(["display:flex;height:",";"],(({height:e})=>e));exports.StyledDrawerChildren=c,exports.StyledDrawerContent=h,exports.StyledDrawerSidebar=y,exports.StyledDrawerWrapper=g,exports.StyledSidebarHeader=l,exports.StyledSidebarTitle=p,exports.StyledSidebarToggleButton=m;
+"use strict";var e=require("styled-components"),t=require("../../style/utils/add-focus-styling.js"),i=require("../../style/themes/apply-base-theme.js");function o(e){return e&&e.__esModule?e:{default:e}}var a=o(e);const r=a.default.div.withConfig({displayName:"drawer.style__StyledSidebarTitle",componentId:"sc-4497ce5f-0"})(["padding:var(--spacing300);",""],(({stickyHeader:t})=>t&&e.css(["position:sticky;top:0;border-bottom:var(--sizing010) solid #a0a0a0;"]))),s=a.default.div.withConfig({displayName:"drawer.style__StyledSidebarFooter",componentId:"sc-4497ce5f-1"})(["padding:var(--spacing300);background-color:var(--colorsUtilityYang100);",""],(({stickyFooter:t})=>t&&e.css(["position:sticky;bottom:0;"]))),d=a.default.div.withConfig({displayName:"drawer.style__StyledDrawerSidebar",componentId:"sc-4497ce5f-2"})(["display:flex;flex-direction:column;flex:1 1 0%;overflow-y:auto;outline:none;"]),n=a.default.aside.withConfig({displayName:"drawer.style__StyledDrawerContent",componentId:"sc-4497ce5f-3"})(["",";"],(({animationDuration:t,backgroundColor:i,expandedWidth:o,isExpanded:a,showControls:n})=>e.css(['flex-direction:column;height:auto;position:relative;overflow:auto;display:flex;min-width:"288px";width:',';max-width:"760px";'," background-color:",";",""],o,!a&&e.css(["display:none;width:0;min-width:0;"]),i||"var(--colorsUtilityYang100)",n&&e.css(["display:flex;overflow:hidden;min-height:40px;transition:all "," ease-in-out;",",",",","{transition:all "," ease-in-out;white-space:nowrap;overflow:hidden;opacity:1;}",""],t,d,r,s,t,!a&&e.css(["min-width:var(--sizing500);width:var(--sizing500);",",",",","{opacity:0;}"],d,r,s))))),l=a.default.button.attrs(i.default).attrs({type:"button"}).withConfig({displayName:"drawer.style__StyledSidebarToggleButton",componentId:"sc-4497ce5f-4"})(["",""],(({isExpanded:i})=>e.css(["position:absolute;top:var(--spacing300);right:8px;padding:var(--spacing100);width:var(--spacing300);height:var(--spacing300);display:flex;justify-content:center;align-items:center;background-color:transparent;border:none;z-index:1;border-radius:var(--borderRadius050);transform:rotate(0deg);&:focus{","}&:hover{cursor:pointer;}",""],t.default(),i&&e.css(["transform:rotate(180deg);"])))),c=a.default.div.withConfig({displayName:"drawer.style__StyledDrawerWrapper",componentId:"sc-4497ce5f-5"})(["display:flex;",""],(({height:t})=>e.css(["height:",";"],t)));exports.StyledDrawerContent=n,exports.StyledDrawerSidebar=d,exports.StyledDrawerWrapper=c,exports.StyledSidebarFooter=s,exports.StyledSidebarTitle=r,exports.StyledSidebarToggleButton=l;

package/package.json

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

package/esm/__internal__/sticky-footer/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from "./sticky-footer.component";
-export type { StickyFooterProps } from "./sticky-footer.component";

package/esm/__internal__/sticky-footer/index.js

@@ -1 +0,0 @@
-export{default}from"./sticky-footer.component.js";

package/esm/__internal__/sticky-footer/sticky-footer.component.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-export interface StickyFooterProps {
-    /** child elements */
-    children: React.ReactNode;
-    /** Ref of the container the footer should be sticky on */
-    containerRef: React.RefObject<HTMLElement>;
-    /** Disable the sticky behaviour manually */
-    disableSticky?: boolean;
-}
-declare const StickyFooter: ({ children, containerRef, disableSticky, ...rest }: StickyFooterProps) => React.JSX.Element;
-export default StickyFooter;

package/esm/__internal__/sticky-footer/sticky-footer.component.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{useState as t,useRef as r,useCallback as n,useEffect as o}from"react";import c from"lodash/throttle";import l from"./sticky-footer.style.js";function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const s=s=>{var{children:u,containerRef:f,disableSticky:a}=s,p=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}(s,["children","containerRef","disableSticky"]);const[b,y]=t(!0),O=r(null),j=n(c((()=>{const e=f.current,t=O.current?O.current.clientHeight/2:0;let r;e&&(r=e.scrollHeight-e.scrollTop-t<=e.clientHeight),y(!r)}),50),[f]);return o((()=>{const e=f.current;return null==e||e.addEventListener("scroll",j,!1),()=>{null==e||e.removeEventListener("scroll",j,!1)}}),[j,f]),e(l,(m=function(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){i(e,t,r[t])}))}return e}({"data-component":"sticky-footer",sticky:!a&&b,ref:O},p),g=null!=(g={children:u})?g:{},Object.getOwnPropertyDescriptors?Object.defineProperties(m,Object.getOwnPropertyDescriptors(g)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(g)).forEach((function(e){Object.defineProperty(m,e,Object.getOwnPropertyDescriptor(g,e))})),m));var m,g};export{s as default};

package/esm/__internal__/sticky-footer/sticky-footer.style.d.ts

@@ -1,4 +0,0 @@
-declare const StyledStickyFooter: import("styled-components").StyledComponent<"div", any, {
-    sticky: boolean;
-}, never>;
-export default StyledStickyFooter;

package/esm/__internal__/sticky-footer/sticky-footer.style.js

@@ -1 +0,0 @@
-import o,{keyframes as t,css as a}from"styled-components";const i=t(["0%{transform:translateY(50px);}100%{transform:translateY(0px);}"]),n=o.div.withConfig({displayName:"sticky-footer.style__StyledStickyFooter",componentId:"sc-e0475900-0"})(["padding:var(--spacing200) var(--spacing400);box-sizing:border-box;width:100%;",""],(({sticky:o})=>o&&a(["animation:"," 0.25s ease;position:sticky;bottom:0;left:0;background-color:var(--colorsActionMinorYang100);box-shadow:var(--boxShadow150);z-index:1000;"],i)));export{n as default};

package/lib/__internal__/sticky-footer/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from "./sticky-footer.component";
-export type { StickyFooterProps } from "./sticky-footer.component";

package/lib/__internal__/sticky-footer/index.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./sticky-footer.component.js");exports.default=e.default;

package/lib/__internal__/sticky-footer/package.json

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

package/lib/__internal__/sticky-footer/sticky-footer.component.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-export interface StickyFooterProps {
-    /** child elements */
-    children: React.ReactNode;
-    /** Ref of the container the footer should be sticky on */
-    containerRef: React.RefObject<HTMLElement>;
-    /** Disable the sticky behaviour manually */
-    disableSticky?: boolean;
-}
-declare const StickyFooter: ({ children, containerRef, disableSticky, ...rest }: StickyFooterProps) => React.JSX.Element;
-export default StickyFooter;

package/lib/__internal__/sticky-footer/sticky-footer.component.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("lodash/throttle"),n=require("./sticky-footer.style.js");function c(e){return e&&e.__esModule?e:{default:e}}var o=c(r);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}exports.default=r=>{var{children:c,containerRef:u,disableSticky:i}=r,s=function(e,t){if(null==e)return{};var r,n,c=function(e,t){if(null==e)return{};var r,n,c={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(c[r]=e[r]);return c}(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)&&(c[r]=e[r])}return c}(r,["children","containerRef","disableSticky"]);const[a,f]=t.useState(!0),b=t.useRef(null),y=t.useCallback(o.default((()=>{const e=u.current,t=b.current?b.current.clientHeight/2:0;let r;e&&(r=e.scrollHeight-e.scrollTop-t<=e.clientHeight),f(!r)}),50),[u]);return t.useEffect((()=>{const e=u.current;return null==e||e.addEventListener("scroll",y,!1),()=>{null==e||e.removeEventListener("scroll",y,!1)}}),[y,u]),e.jsx(n.default,(O=function(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}({"data-component":"sticky-footer",sticky:!i&&a,ref:b},s),p=null!=(p={children:c})?p:{},Object.getOwnPropertyDescriptors?Object.defineProperties(O,Object.getOwnPropertyDescriptors(p)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(p)).forEach((function(e){Object.defineProperty(O,e,Object.getOwnPropertyDescriptor(p,e))})),O));var O,p};

package/lib/__internal__/sticky-footer/sticky-footer.style.d.ts

@@ -1,4 +0,0 @@
-declare const StyledStickyFooter: import("styled-components").StyledComponent<"div", any, {
-    sticky: boolean;
-}, never>;
-export default StyledStickyFooter;

package/lib/__internal__/sticky-footer/sticky-footer.style.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("styled-components");function t(o){return o&&o.__esModule?o:{default:o}}var e=t(o);const r=o.keyframes(["0%{transform:translateY(50px);}100%{transform:translateY(0px);}"]),s=e.default.div.withConfig({displayName:"sticky-footer.style__StyledStickyFooter",componentId:"sc-e0475900-0"})(["padding:var(--spacing200) var(--spacing400);box-sizing:border-box;width:100%;",""],(({sticky:t})=>t&&o.css(["animation:"," 0.25s ease;position:sticky;bottom:0;left:0;background-color:var(--colorsActionMinorYang100);box-shadow:var(--boxShadow150);z-index:1000;"],r)));exports.default=s;