@mongodb-js/compass-components 1.43.0 → 1.45.0

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+/**
+ * @internal
+ *
+ * DrawerToolbarLayout is a component that provides a layout for displaying content in a drawer with a toolbar.
+ */
+export declare const DrawerToolbarLayout: React.ForwardRefExoticComponent<{
+    onClose?: React.MouseEventHandler<HTMLButtonElement> | undefined;
+    displayMode?: import("..").DisplayMode | undefined;
+} & import("@leafygreen-ui/lib").DarkModeProps & import("@leafygreen-ui/lib").LgIdProps & {
+    toolbarData: Array<import("./drawer-toolbar-layout.types").LayoutData>;
+    className?: string;
+    children: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=drawer-toolbar-layout.d.ts.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAO1C;;;;GAIG;AACH,eAAO,MAAM,mBAAmB;;;;;;;wCAoB/B,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.js

@@ -0,0 +1,50 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerToolbarLayout = void 0;
+const react_1 = __importStar(require("react"));
+const drawer_toolbar_context_1 = require("../drawer-toolbar-context");
+const drawer_toolbar_layout_container_1 = require("./drawer-toolbar-layout-container");
+/**
+ * @internal
+ *
+ * DrawerToolbarLayout is a component that provides a layout for displaying content in a drawer with a toolbar.
+ */
+exports.DrawerToolbarLayout = (0, react_1.forwardRef)(({ children, toolbarData, ...rest }, forwardRef) => {
+    return (react_1.default.createElement(drawer_toolbar_context_1.DrawerToolbarProvider, { data: toolbarData },
+        react_1.default.createElement(drawer_toolbar_layout_container_1.DrawerToolbarLayoutContainer, { ref: forwardRef, toolbarData: toolbarData, ...rest }, children)));
+});
+exports.DrawerToolbarLayout.displayName = 'DrawerToolbarLayout';
+//# sourceMappingURL=drawer-toolbar-layout.js.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,sEAAkE;AAGlE,uFAAiF;AAEjF;;;;GAIG;AACU,QAAA,mBAAmB,GAAG,IAAA,kBAAU,EAI3C,CACE,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,IAAI,EAA4B,EAC5D,UAAU,EACV,EAAE;IACF,OAAO,CACL,8BAAC,8CAAqB,IAAC,IAAI,EAAE,WAAW;QACtC,8BAAC,8DAA4B,IAC3B,GAAG,EAAE,UAAU,EACf,WAAW,EAAE,WAAW,KACpB,IAAI,IAEP,QAAQ,CACoB,CACT,CACzB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,2BAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const contentStyles: string;
+//# sourceMappingURL=drawer-toolbar-layout.styles.d.ts.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa,QAIzB,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.contentStyles = void 0;
+const emotion_1 = require("@leafygreen-ui/emotion");
+const constants_1 = require("../constants");
+exports.contentStyles = (0, emotion_1.css) `
+  grid-area: ${constants_1.GRID_AREA.content};
+  overflow: scroll;
+  height: inherit;
+`;
+//# sourceMappingURL=drawer-toolbar-layout.styles.js.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.styles.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.styles.ts"],"names":[],"mappings":";;;AAAA,oDAA6C;AAE7C,4CAAyC;AAE5B,QAAA,aAAa,GAAG,IAAA,aAAG,EAAA;eACjB,qBAAS,CAAC,OAAO;;;CAG/B,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.d.ts

@@ -0,0 +1,44 @@
+import type React from 'react';
+import type { DarkModeProps, LgIdProps } from '@leafygreen-ui/lib';
+import type { ToolbarIconButtonProps } from '../../toolbar';
+import type { DrawerProps } from '../drawer/drawer.types';
+type PickedOptionalDrawerProps = Pick<DrawerProps, 'onClose' | 'displayMode'>;
+type PickedRequiredToolbarIconButtonProps = Pick<ToolbarIconButtonProps, 'glyph' | 'label' | 'onClick' | 'disabled'>;
+interface LayoutBase extends PickedRequiredToolbarIconButtonProps {
+    /**
+     * The id of the layout. This is used to open the drawer.
+     */
+    id: string;
+}
+interface LayoutWithContent extends LayoutBase {
+    /**
+     * The title of the drawer. This is not required if the toolbar item should not open a drawer.
+     */
+    title: React.ReactNode;
+    /**
+     * The content of the drawer. This is not required if the toolbar item should not open a drawer.
+     */
+    content: React.ReactNode;
+}
+interface LayoutWithoutContent extends LayoutBase {
+    /**
+     * The title of the drawer. This is not required if the toolbar item should not open a drawer.
+     */
+    title?: never;
+    /**
+     * The content of the drawer. This is not required if the toolbar item should not open a drawer.
+     */
+    content?: never;
+}
+export type LayoutData = LayoutWithContent | LayoutWithoutContent;
+export type DrawerToolbarLayoutProps = PickedOptionalDrawerProps & DarkModeProps & LgIdProps & {
+    /**
+     * An array of data that will be used to render the toolbar items and the drawer content.
+     */
+    toolbarData: Array<LayoutData>;
+    className?: string;
+    children: React.ReactNode;
+};
+export type DrawerToolbarLayoutContainerProps = DrawerToolbarLayoutProps;
+export {};
+//# sourceMappingURL=drawer-toolbar-layout.types.d.ts.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.types.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAE5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAE1D,KAAK,yBAAyB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,aAAa,CAAC,CAAC;AAC9E,KAAK,oCAAoC,GAAG,IAAI,CAC9C,sBAAsB,EACtB,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAC3C,CAAC;AAEF,UAAU,UAAW,SAAQ,oCAAoC;IAC/D;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,UAAU,iBAAkB,SAAQ,UAAU;IAC5C;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,UAAU,oBAAqB,SAAQ,UAAU;IAC/C;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,MAAM,MAAM,UAAU,GAAG,iBAAiB,GAAG,oBAAoB,CAAC;AAElE,MAAM,MAAM,wBAAwB,GAAG,yBAAyB,GAC9D,aAAa,GACb,SAAS,GAAG;IACV;;OAEG;IACH,WAAW,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEJ,MAAM,MAAM,iCAAiC,GAAG,wBAAwB,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=drawer-toolbar-layout.types.js.map

package/lib/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-toolbar-layout.types.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/drawer-toolbar-layout.types.ts"],"names":[],"mappings":""}

package/lib/components/drawer/drawer-toolbar-layout/index.d.ts

@@ -0,0 +1,3 @@
+export { DrawerToolbarLayout } from './drawer-toolbar-layout';
+export type { DrawerToolbarLayoutProps, LayoutData, } from './drawer-toolbar-layout.types';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/drawer/drawer-toolbar-layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EACV,wBAAwB,EACxB,UAAU,GACX,MAAM,+BAA+B,CAAC"}

package/lib/components/drawer/drawer-toolbar-layout/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerToolbarLayout = void 0;
+var drawer_toolbar_layout_1 = require("./drawer-toolbar-layout");
+Object.defineProperty(exports, "DrawerToolbarLayout", { enumerable: true, get: function () { return drawer_toolbar_layout_1.DrawerToolbarLayout; } });
+//# sourceMappingURL=index.js.map

package/lib/components/drawer/drawer-toolbar-layout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-toolbar-layout/index.ts"],"names":[],"mappings":";;;AAAA,iEAA8D;AAArD,4HAAA,mBAAmB,OAAA"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { DrawerWithToolbarWrapperProps } from './drawer-with-toolbar-wrapper.types';
+/**
+ * @internal
+ *
+ * This layout wrapper is used to position the toolbar and drawer together. When the drawer is open, the toolbar and drawer will shift to the right.
+ *
+ * If the drawer is overlay, a box shadow will be applied to the left side of this component.
+ */
+export declare const DrawerWithToolbarWrapper: React.ForwardRefExoticComponent<Omit<DrawerWithToolbarWrapperProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=drawer-with-toolbar-wrapper.d.ts.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAK/D,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,qCAAqC,CAAC;AAEzF;;;;;;GAMG;AACH,eAAO,MAAM,wBAAwB,mHAmCpC,CAAC"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.js

@@ -0,0 +1,63 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerWithToolbarWrapper = void 0;
+const react_1 = __importStar(require("react"));
+const leafygreen_provider_1 = require("@leafygreen-ui/leafygreen-provider");
+const drawer_with_toolbar_wrapper_styles_1 = require("./drawer-with-toolbar-wrapper.styles");
+/**
+ * @internal
+ *
+ * This layout wrapper is used to position the toolbar and drawer together. When the drawer is open, the toolbar and drawer will shift to the right.
+ *
+ * If the drawer is overlay, a box shadow will be applied to the left side of this component.
+ */
+exports.DrawerWithToolbarWrapper = (0, react_1.forwardRef)(({ children, className, isDrawerOpen, displayMode, }, forwardedRef) => {
+    const { theme } = (0, leafygreen_provider_1.useDarkMode)();
+    const [shouldAnimate, setShouldAnimate] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (isDrawerOpen)
+            setShouldAnimate(true);
+    }, [isDrawerOpen]);
+    return (react_1.default.createElement("div", { ref: forwardedRef, className: (0, drawer_with_toolbar_wrapper_styles_1.getDrawerWithToolbarWrapperStyles)({
+            className,
+            isDrawerOpen,
+            shouldAnimate,
+            displayMode,
+            theme,
+        }) }, children));
+});
+exports.DrawerWithToolbarWrapper.displayName = 'DrawerWithToolbarWrapper';
+//# sourceMappingURL=drawer-with-toolbar-wrapper.js.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA+D;AAE/D,4EAAiE;AAEjE,6FAAyF;AAGzF;;;;;;GAMG;AACU,QAAA,wBAAwB,GAAG,IAAA,kBAAU,EAIhD,CACE,EACE,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,WAAW,GACmB,EAChC,YAAY,EACZ,EAAE;IACF,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,iCAAW,GAAE,CAAC;IAChC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE1D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,YAAY;YAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC3C,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,OAAO,CACL,uCACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,sEAAiC,EAAC;YAC3C,SAAS;YACT,YAAY;YACZ,aAAa;YACb,WAAW;YACX,KAAK;SACN,CAAC,IAED,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gCAAwB,CAAC,WAAW,GAAG,0BAA0B,CAAC"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.d.ts

@@ -0,0 +1,10 @@
+import type { Theme } from '@leafygreen-ui/lib';
+import { DisplayMode } from '../drawer/drawer.types';
+export declare const getDrawerWithToolbarWrapperStyles: ({ className, isDrawerOpen, shouldAnimate, displayMode, theme, }: {
+    className?: string;
+    isDrawerOpen: boolean;
+    shouldAnimate?: boolean;
+    displayMode: DisplayMode;
+    theme: Theme;
+}) => string;
+//# sourceMappingURL=drawer-with-toolbar-wrapper.styles.d.ts.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAUhD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAwIrD,eAAO,MAAM,iCAAiC,GAAI,iEAM/C;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,WAAW,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC;CACd,WAWE,CAAC"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.js

@@ -0,0 +1,137 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDrawerWithToolbarWrapperStyles = void 0;
+const emotion_1 = require("@leafygreen-ui/emotion");
+const tokens_1 = require("@leafygreen-ui/tokens");
+const toolbar_1 = require("../../toolbar");
+const constants_1 = require("../constants");
+const constants_2 = require("../constants");
+const drawer_styles_1 = require("../drawer/drawer.styles");
+const drawer_types_1 = require("../drawer/drawer.types");
+const MOBILE_BREAKPOINT = tokens_1.breakpoints.Tablet;
+const SHADOW_WIDTH = 36; // Width of the shadow padding on the left side
+const drawerIn = (0, emotion_1.keyframes) `
+  from {
+    // Because of .show() and .close() in the drawer component, transitioning from 0px to (x)px does not transition correctly. Using 1px along with css animations is a workaround to get the animation to work.
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px 1px;
+  }
+  to {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px ${constants_2.PANEL_WIDTH}px;
+  }
+`;
+const drawerOut = (0, emotion_1.keyframes) `
+  from {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px ${constants_2.PANEL_WIDTH}px;
+  }
+  to {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px 0px;
+  }
+`;
+const drawerOutMobile = (0, emotion_1.keyframes) `
+  from {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px calc(100vw - ${constants_2.TOOLBAR_WIDTH * 2}px);
+  }
+  to {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px 0px;
+  }
+`;
+const drawerInMobile = (0, emotion_1.keyframes) `
+  from {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px 1px;
+  }
+  to {
+    grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px calc(100vw - ${constants_2.TOOLBAR_WIDTH * 2}px);
+  }
+`;
+// This animation is used to animate the padding of the drawer when it closes, so that the padding does not block the content underneath it.
+const drawerPaddingOut = (0, emotion_1.keyframes) `
+  0% {
+    padding-left: ${SHADOW_WIDTH}px;
+  }
+  99% {
+    padding-left: ${SHADOW_WIDTH}px;
+  }
+  100% {
+    padding-left: 0px;
+  }
+`;
+const openStyles = (0, emotion_1.css) `
+  animation-name: ${drawerIn};
+  animation-fill-mode: forwards;
+
+  @media only screen and (max-width: ${MOBILE_BREAKPOINT}px) {
+    animation-name: ${drawerInMobile};
+  }
+`;
+const closedStyles = (0, emotion_1.css) `
+  animation-name: ${drawerOut};
+
+  @media only screen and (max-width: ${MOBILE_BREAKPOINT}px) {
+    animation-name: ${drawerOutMobile};
+  }
+`;
+const getDrawerShadowStyles = ({ theme }) => (0, emotion_1.css) `
+  ${(0, tokens_1.addOverflowShadow)({ isInside: false, side: tokens_1.Side.Left, theme })};
+
+  // Need this to show the box shadow since we are using overflow: hidden
+  padding-left: ${SHADOW_WIDTH}px;
+
+  &::before {
+    transition-property: opacity;
+    transition-duration: ${drawer_styles_1.drawerTransitionDuration}ms;
+    transition-timing-function: ease-in-out;
+    opacity: 1;
+    left: ${SHADOW_WIDTH}px;
+  }
+`;
+const baseStyles = (0, emotion_1.css) `
+  display: grid;
+  grid-template-columns: ${constants_2.TOOLBAR_WIDTH}px 0px;
+  grid-template-areas: '${constants_1.GRID_AREA.toolbar} ${constants_1.GRID_AREA.innerDrawer}';
+  grid-area: ${constants_1.GRID_AREA.drawer};
+  justify-self: end;
+  animation-timing-function: ease-in-out;
+  animation-duration: ${drawer_styles_1.drawerTransitionDuration}ms;
+  z-index: 0;
+  height: 100%;
+  overflow: hidden;
+
+  .${toolbar_1.toolbarClassName} {
+    grid-area: ${constants_1.GRID_AREA.toolbar};
+  }
+
+  .${drawer_styles_1.drawerClassName} {
+    grid-area: ${constants_1.GRID_AREA.innerDrawer};
+    position: unset;
+    transition: none;
+    transform: unset;
+    overflow: hidden;
+    opacity: 1;
+    border-left: 0;
+    border-right: 0;
+    height: 100%;
+    animation: none;
+
+    > div::before {
+      box-shadow: unset;
+    }
+  }
+`;
+const closedDrawerShadowStyles = (0, emotion_1.css) `
+  padding-left: 0;
+  animation-name: ${drawerPaddingOut};
+  animation-timing-function: ease-in-out;
+  animation-duration: ${drawer_styles_1.drawerTransitionDuration}ms;
+
+  ::before {
+    opacity: 0;
+  }
+`;
+const getDrawerWithToolbarWrapperStyles = ({ className, isDrawerOpen, shouldAnimate, displayMode, theme, }) => (0, emotion_1.cx)(baseStyles, {
+    [getDrawerShadowStyles({ theme })]: displayMode === drawer_types_1.DisplayMode.Overlay,
+    [closedDrawerShadowStyles]: displayMode === drawer_types_1.DisplayMode.Overlay && !isDrawerOpen,
+    [openStyles]: isDrawerOpen,
+    [closedStyles]: !isDrawerOpen && shouldAnimate, // This ensures that the drawer does not animate closed on initial render
+}, className);
+exports.getDrawerWithToolbarWrapperStyles = getDrawerWithToolbarWrapperStyles;
+//# sourceMappingURL=drawer-with-toolbar-wrapper.styles.js.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.styles.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.styles.ts"],"names":[],"mappings":";;;AAAA,oDAA4D;AAE5D,kDAA6E;AAC7E,2CAAiD;AAEjD,4CAAyC;AACzC,4CAA0D;AAC1D,2DAGiC;AACjC,yDAAqD;AAErD,MAAM,iBAAiB,GAAG,oBAAW,CAAC,MAAM,CAAC;AAC7C,MAAM,YAAY,GAAG,EAAE,CAAC,CAAC,+CAA+C;AAExE,MAAM,QAAQ,GAAG,IAAA,mBAAS,EAAA;;;6BAGG,yBAAa;;;6BAGb,yBAAa,MAAM,uBAAW;;CAE1D,CAAC;AAEF,MAAM,SAAS,GAAG,IAAA,mBAAS,EAAA;;6BAEE,yBAAa,MAAM,uBAAW;;;6BAG9B,yBAAa;;CAEzC,CAAC;AAEF,MAAM,eAAe,GAAG,IAAA,mBAAS,EAAA;;6BAEJ,yBAAa,mBACxC,yBAAa,GAAG,CAClB;;;6BAG6B,yBAAa;;CAEzC,CAAC;AAEF,MAAM,cAAc,GAAG,IAAA,mBAAS,EAAA;;6BAEH,yBAAa;;;6BAGb,yBAAa,mBACxC,yBAAa,GAAG,CAClB;;CAEC,CAAC;AAEF,4IAA4I;AAC5I,MAAM,gBAAgB,GAAG,IAAA,mBAAS,EAAA;;oBAEd,YAAY;;;oBAGZ,YAAY;;;;;CAK/B,CAAC;AAEF,MAAM,UAAU,GAAG,IAAA,aAAG,EAAA;oBACF,QAAQ;;;uCAGW,iBAAiB;sBAClC,cAAc;;CAEnC,CAAC;AAEF,MAAM,YAAY,GAAG,IAAA,aAAG,EAAA;oBACJ,SAAS;;uCAEU,iBAAiB;sBAClC,eAAe;;CAEpC,CAAC;AAEF,MAAM,qBAAqB,GAAG,CAAC,EAAE,KAAK,EAAoB,EAAE,EAAE,CAAC,IAAA,aAAG,EAAA;IAC9D,IAAA,0BAAiB,EAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,aAAI,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;;;kBAGhD,YAAY;;;;2BAIH,wCAAwB;;;YAGvC,YAAY;;CAEvB,CAAC;AAEF,MAAM,UAAU,GAAG,IAAA,aAAG,EAAA;;2BAEK,yBAAa;0BACd,qBAAS,CAAC,OAAO,IAAI,qBAAS,CAAC,WAAW;eACrD,qBAAS,CAAC,MAAM;;;wBAGP,wCAAwB;;;;;KAK3C,0BAAgB;iBACJ,qBAAS,CAAC,OAAO;;;KAG7B,+BAAe;iBACH,qBAAS,CAAC,WAAW;;;;;;;;;;;;;;;CAerC,CAAC;AAEF,MAAM,wBAAwB,GAAG,IAAA,aAAG,EAAA;;oBAEhB,gBAAgB;;wBAEZ,wCAAwB;;;;;CAK/C,CAAC;AAEK,MAAM,iCAAiC,GAAG,CAAC,EAChD,SAAS,EACT,YAAY,EACZ,aAAa,EACb,WAAW,EACX,KAAK,GAON,EAAE,EAAE,CACH,IAAA,YAAE,EACA,UAAU,EACV;IACE,CAAC,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,0BAAW,CAAC,OAAO;IACvE,CAAC,wBAAwB,CAAC,EACxB,WAAW,KAAK,0BAAW,CAAC,OAAO,IAAI,CAAC,YAAY;IACtD,CAAC,UAAU,CAAC,EAAE,YAAY;IAC1B,CAAC,YAAY,CAAC,EAAE,CAAC,YAAY,IAAI,aAAa,EAAE,yEAAyE;CAC1H,EACD,SAAS,CACV,CAAC;AAvBS,QAAA,iCAAiC,qCAuB1C"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLElementProps } from '@leafygreen-ui/lib';
+import type { DrawerProps } from '../drawer/drawer.types';
+type PickedDrawerProps = Required<Pick<DrawerProps, 'displayMode'>>;
+export interface DrawerWithToolbarWrapperProps extends HTMLElementProps<'div'>, PickedDrawerProps {
+    /**
+     * Determines if the Drawer instance is open or closed
+     */
+    isDrawerOpen: boolean;
+}
+export {};
+//# sourceMappingURL=drawer-with-toolbar-wrapper.types.d.ts.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.types.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAE3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAE1D,KAAK,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC,CAAC;AAEpE,MAAM,WAAW,6BACf,SAAQ,gBAAgB,CAAC,KAAK,CAAC,EAC7B,iBAAiB;IACnB;;OAEG;IACH,YAAY,EAAE,OAAO,CAAC;CACvB"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=drawer-with-toolbar-wrapper.types.js.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-with-toolbar-wrapper.types.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/drawer-with-toolbar-wrapper.types.ts"],"names":[],"mappings":""}

package/lib/components/drawer/drawer-with-toolbar-wrapper/index.d.ts

@@ -0,0 +1,2 @@
+export { DrawerWithToolbarWrapper } from './drawer-with-toolbar-wrapper';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC"}

package/lib/components/drawer/drawer-with-toolbar-wrapper/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DrawerWithToolbarWrapper = void 0;
+var drawer_with_toolbar_wrapper_1 = require("./drawer-with-toolbar-wrapper");
+Object.defineProperty(exports, "DrawerWithToolbarWrapper", { enumerable: true, get: function () { return drawer_with_toolbar_wrapper_1.DrawerWithToolbarWrapper; } });
+//# sourceMappingURL=index.js.map

package/lib/components/drawer/drawer-with-toolbar-wrapper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer-with-toolbar-wrapper/index.ts"],"names":[],"mappings":";;;AAAA,6EAAyE;AAAhE,uIAAA,wBAAwB,OAAA"}

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { EmbeddedDrawerLayoutProps } from './embedded-drawer-layout.types';
+/**
+ * @internal
+ *
+ * This layout wrapper is used to create a layout that has 2 grid columns. The main content is on the left and the drawer is on the right.
+ *
+ * Since this layout is used for embedded drawers, when the drawer is open, the layout will shift to the right by the width of the drawer + toolbar if it exists.
+ *
+ */
+export declare const EmbeddedDrawerLayout: React.ForwardRefExoticComponent<Omit<EmbeddedDrawerLayoutProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=embedded-drawer-layout.d.ts.map

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"embedded-drawer-layout.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/embedded-drawer-layout/embedded-drawer-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAEhF;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB,+GA0BhC,CAAC"}

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.js

@@ -0,0 +1,55 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmbeddedDrawerLayout = void 0;
+const react_1 = __importStar(require("react"));
+const embedded_drawer_layout_styles_1 = require("./embedded-drawer-layout.styles");
+/**
+ * @internal
+ *
+ * This layout wrapper is used to create a layout that has 2 grid columns. The main content is on the left and the drawer is on the right.
+ *
+ * Since this layout is used for embedded drawers, when the drawer is open, the layout will shift to the right by the width of the drawer + toolbar if it exists.
+ *
+ */
+exports.EmbeddedDrawerLayout = (0, react_1.forwardRef)(({ children, className, isDrawerOpen = false, hasToolbar = false, }, forwardedRef) => {
+    return (react_1.default.createElement("div", { ref: forwardedRef, className: (0, embedded_drawer_layout_styles_1.getEmbeddedDrawerLayoutStyles)({
+            className,
+            isDrawerOpen,
+            hasToolbar,
+        }) }, children));
+});
+exports.EmbeddedDrawerLayout.displayName = 'EmbeddedDrawerLayout';
+//# sourceMappingURL=embedded-drawer-layout.js.map

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"embedded-drawer-layout.js","sourceRoot":"","sources":["../../../../src/components/drawer/embedded-drawer-layout/embedded-drawer-layout.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,mFAAgF;AAGhF;;;;;;;GAOG;AACU,QAAA,oBAAoB,GAAG,IAAA,kBAAU,EAI5C,CACE,EACE,QAAQ,EACR,SAAS,EACT,YAAY,GAAG,KAAK,EACpB,UAAU,GAAG,KAAK,GACQ,EAC5B,YAAY,EACZ,EAAE;IACF,OAAO,CACL,uCACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,6DAA6B,EAAC;YACvC,SAAS;YACT,YAAY;YACZ,UAAU;SACX,CAAC,IAED,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,4BAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC"}

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.d.ts

@@ -0,0 +1,6 @@
+export declare const getEmbeddedDrawerLayoutStyles: ({ className, isDrawerOpen, hasToolbar, }: {
+    className?: string;
+    isDrawerOpen: boolean;
+    hasToolbar?: boolean;
+}) => string;
+//# sourceMappingURL=embedded-drawer-layout.styles.d.ts.map

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"embedded-drawer-layout.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.ts"],"names":[],"mappings":"AAkDA,eAAO,MAAM,6BAA6B,GAAI,0CAI3C;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,WAUE,CAAC"}

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getEmbeddedDrawerLayoutStyles = void 0;
+const emotion_1 = require("@leafygreen-ui/emotion");
+const tokens_1 = require("@leafygreen-ui/tokens");
+const constants_1 = require("../constants");
+const constants_2 = require("../constants");
+const drawer_1 = require("../drawer");
+const drawer_styles_1 = require("../drawer/drawer.styles");
+const baseStyles = (0, emotion_1.css) `
+  width: 100%;
+  display: grid;
+  grid-template-columns: auto 0;
+  transition-property: grid-template-columns, grid-template-rows;
+  transition-timing-function: ease-in-out;
+  transition-duration: ${drawer_styles_1.drawerTransitionDuration}ms;
+  overflow: hidden;
+  position: relative;
+  height: 100%;
+`;
+const drawerBaseStyles = (0, emotion_1.css) `
+  @media only screen and (max-width: ${drawer_1.MOBILE_BREAKPOINT}px) {
+    grid-template-columns: unset;
+    grid-template-rows: 100% 0;
+  }
+`;
+// If there is no toolbar and the drawer is open, we need to shift the layout by the panel width;
+const drawerOpenStyles = (0, emotion_1.css) `
+  grid-template-columns: auto ${constants_2.PANEL_WIDTH}px;
+
+  @media only screen and (max-width: ${drawer_1.MOBILE_BREAKPOINT}px) {
+    grid-template-rows: 50% 50%;
+  }
+`;
+const withToolbarBaseStyles = (0, emotion_1.css) `
+  grid-template-columns: auto ${constants_2.TOOLBAR_WIDTH}px;
+  grid-template-areas: '${constants_1.GRID_AREA.content} ${constants_1.GRID_AREA.drawer}';
+`;
+// If there is a toolbar and the drawer is open, we need to shift the layout by toolbar width + panel width;
+const withToolbarOpenStyles = (0, emotion_1.css) `
+  grid-template-columns: auto ${constants_2.PANEL_WIDTH + constants_2.TOOLBAR_WIDTH}px;
+
+  @media only screen and (max-width: ${tokens_1.breakpoints.Tablet}px) {
+    grid-template-columns: auto ${constants_2.TOOLBAR_WIDTH}px;
+  }
+`;
+const getEmbeddedDrawerLayoutStyles = ({ className, isDrawerOpen, hasToolbar = false, }) => (0, emotion_1.cx)(baseStyles, {
+    [withToolbarBaseStyles]: hasToolbar,
+    [withToolbarOpenStyles]: isDrawerOpen && hasToolbar,
+    [drawerBaseStyles]: !hasToolbar,
+    [drawerOpenStyles]: isDrawerOpen && !hasToolbar,
+}, className);
+exports.getEmbeddedDrawerLayoutStyles = getEmbeddedDrawerLayoutStyles;
+//# sourceMappingURL=embedded-drawer-layout.styles.js.map

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"embedded-drawer-layout.styles.js","sourceRoot":"","sources":["../../../../src/components/drawer/embedded-drawer-layout/embedded-drawer-layout.styles.ts"],"names":[],"mappings":";;;AAAA,oDAAiD;AACjD,kDAAoD;AAEpD,4CAAyC;AACzC,4CAA0D;AAC1D,sCAA8C;AAC9C,2DAAmE;AAEnE,MAAM,UAAU,GAAG,IAAA,aAAG,EAAA;;;;;;yBAMG,wCAAwB;;;;CAIhD,CAAC;AAEF,MAAM,gBAAgB,GAAG,IAAA,aAAG,EAAA;uCACW,0BAAiB;;;;CAIvD,CAAC;AAEF,iGAAiG;AACjG,MAAM,gBAAgB,GAAG,IAAA,aAAG,EAAA;gCACI,uBAAW;;uCAEJ,0BAAiB;;;CAGvD,CAAC;AAEF,MAAM,qBAAqB,GAAG,IAAA,aAAG,EAAA;gCACD,yBAAa;0BACnB,qBAAS,CAAC,OAAO,IAAI,qBAAS,CAAC,MAAM;CAC9D,CAAC;AAEF,4GAA4G;AAC5G,MAAM,qBAAqB,GAAG,IAAA,aAAG,EAAA;gCACD,uBAAW,GAAG,yBAAa;;uCAEpB,oBAAW,CAAC,MAAM;kCACvB,yBAAa;;CAE9C,CAAC;AAEK,MAAM,6BAA6B,GAAG,CAAC,EAC5C,SAAS,EACT,YAAY,EACZ,UAAU,GAAG,KAAK,GAKnB,EAAE,EAAE,CACH,IAAA,YAAE,EACA,UAAU,EACV;IACE,CAAC,qBAAqB,CAAC,EAAE,UAAU;IACnC,CAAC,qBAAqB,CAAC,EAAE,YAAY,IAAI,UAAU;IACnD,CAAC,gBAAgB,CAAC,EAAE,CAAC,UAAU;IAC/B,CAAC,gBAAgB,CAAC,EAAE,YAAY,IAAI,CAAC,UAAU;CAChD,EACD,SAAS,CACV,CAAC;AAlBS,QAAA,6BAA6B,iCAkBtC"}

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.types.d.ts

@@ -0,0 +1,8 @@
+import type { BaseLayoutComponentProps } from '../layout-component/layout-component.styles';
+export type EmbeddedDrawerLayoutProps = BaseLayoutComponentProps & {
+    /**
+     * Determines if the Drawer is open. This will shift the layout to the right by the width of the drawer + toolbar if it exists if the display mode is set to 'embedded'.
+     */
+    isDrawerOpen?: boolean;
+};
+//# sourceMappingURL=embedded-drawer-layout.types.d.ts.map

package/lib/components/drawer/embedded-drawer-layout/embedded-drawer-layout.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"embedded-drawer-layout.types.d.ts","sourceRoot":"","sources":["../../../../src/components/drawer/embedded-drawer-layout/embedded-drawer-layout.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,6CAA6C,CAAC;AAE5F,MAAM,MAAM,yBAAyB,GAAG,wBAAwB,GAAG;IACjE;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC"}