@cloudscape-design/components-themeable 3.0.195 → 3.0.197

package/lib/internal/template/app-layout/navigation-panel.d.ts

@@ -4,7 +4,6 @@ import { DesktopDrawerProps } from './drawer';
 import useContentHeight from './utils/use-content-height';
 interface NavigationPanelProps {
     navigationOpen: boolean;
-    isHidden: DesktopDrawerProps['isHidden'];
     navigationDrawerWidth: number;
     navigationWidth: number;
     headerHeight: DesktopDrawerProps['topOffset'];
@@ -13,11 +12,10 @@ interface NavigationPanelProps {
     navigation: React.ReactNode;
     ariaLabels: AppLayoutProps['ariaLabels'];
     isMobile: boolean;
-    isMotionEnabled: boolean;
     onNavigationToggle: DesktopDrawerProps['onToggle'];
     onClick: DesktopDrawerProps['onClick'];
     toggleRefs: DesktopDrawerProps['toggleRefs'];
 }
-export declare function NavigationPanel({ ariaLabels, footerHeight, headerHeight, isHidden, isMobile, navigation, navigationDrawerWidth, navigationWidth, navigationOpen, onClick, onNavigationToggle, panelHeightStyle, toggleRefs, }: NavigationPanelProps): JSX.Element;
+export declare function NavigationPanel({ ariaLabels, footerHeight, headerHeight, isMobile, navigation, navigationDrawerWidth, navigationWidth, navigationOpen, onClick, onNavigationToggle, panelHeightStyle, toggleRefs, }: NavigationPanelProps): JSX.Element;
 export {};
 //# sourceMappingURL=navigation-panel.d.ts.map

package/lib/internal/template/app-layout/navigation-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-panel.d.ts","sourceRoot":"","sources":["../../../src/app-layout/navigation-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAU,MAAM,UAAU,CAAC;AAGtD,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAE1D,UAAU,oBAAoB;IAC5B,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAEzC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC9C,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,gBAAgB,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAE1E,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,UAAU,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IAEzC,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,OAAO,CAAC;IAEzB,kBAAkB,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACnD,OAAO,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IAEvC,UAAU,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;CAC9C;AAED,wBAAgB,eAAe,CAAC,EAC9B,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,OAAO,EACP,kBAAkB,EAClB,gBAAgB,EAChB,UAAU,GACX,EAAE,oBAAoB,eAiCtB"}
+{"version":3,"file":"navigation-panel.d.ts","sourceRoot":"","sources":["../../../src/app-layout/navigation-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAU,MAAM,UAAU,CAAC;AAGtD,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAE1D,UAAU,oBAAoB;IAC5B,cAAc,EAAE,OAAO,CAAC;IAExB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC9C,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,gBAAgB,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAE1E,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,UAAU,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IAEzC,QAAQ,EAAE,OAAO,CAAC;IAElB,kBAAkB,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACnD,OAAO,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IAEvC,UAAU,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;CAC9C;AAED,wBAAgB,eAAe,CAAC,EAC9B,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,OAAO,EACP,kBAAkB,EAClB,gBAAgB,EAChB,UAAU,GACX,EAAE,oBAAoB,eAgCtB"}

package/lib/internal/template/app-layout/navigation-panel.js

@@ -8,12 +8,12 @@ import styles from './styles.css.js';
 import testutilStyles from './test-classes/styles.css.js';
 export function NavigationPanel(_a) {
     var _b;
-    var ariaLabels = _a.ariaLabels, footerHeight = _a.footerHeight, headerHeight = _a.headerHeight, isHidden = _a.isHidden, isMobile = _a.isMobile, navigation = _a.navigation, navigationDrawerWidth = _a.navigationDrawerWidth, navigationWidth = _a.navigationWidth, navigationOpen = _a.navigationOpen, onClick = _a.onClick, onNavigationToggle = _a.onNavigationToggle, panelHeightStyle = _a.panelHeightStyle, toggleRefs = _a.toggleRefs;
+    var ariaLabels = _a.ariaLabels, footerHeight = _a.footerHeight, headerHeight = _a.headerHeight, isMobile = _a.isMobile, navigation = _a.navigation, navigationDrawerWidth = _a.navigationDrawerWidth, navigationWidth = _a.navigationWidth, navigationOpen = _a.navigationOpen, onClick = _a.onClick, onNavigationToggle = _a.onNavigationToggle, panelHeightStyle = _a.panelHeightStyle, toggleRefs = _a.toggleRefs;
     return (React.createElement("div", { className: styles['navigation-panel'], style: { width: navigationDrawerWidth } },
         React.createElement("div", { className: clsx(styles['panel-wrapper-outer'], (_b = {},
                 _b[styles.mobile] = isMobile,
                 _b[styles.open] = navigationOpen,
                 _b)), style: __assign({}, (isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle)) },
-            React.createElement(Drawer, { type: "navigation", isMobile: isMobile, width: navigationWidth, isOpen: navigationOpen, isHidden: isHidden, onToggle: onNavigationToggle, toggleRefs: toggleRefs, onClick: onClick, contentClassName: clsx(styles.navigation, testutilStyles.navigation), closeClassName: clsx(styles['navigation-close'], testutilStyles['navigation-close']), toggleClassName: clsx(styles['navigation-toggle'], testutilStyles['navigation-toggle']), topOffset: headerHeight, bottomOffset: footerHeight, ariaLabels: ariaLabels }, navigation))));
+            React.createElement(Drawer, { type: "navigation", isMobile: isMobile, width: navigationWidth, isOpen: navigationOpen, onToggle: onNavigationToggle, toggleRefs: toggleRefs, onClick: onClick, contentClassName: testutilStyles.navigation, closeClassName: testutilStyles['navigation-close'], toggleClassName: testutilStyles['navigation-toggle'], topOffset: headerHeight, bottomOffset: footerHeight, ariaLabels: ariaLabels }, navigation))));
 }
 //# sourceMappingURL=navigation-panel.js.map

package/lib/internal/template/app-layout/navigation-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-panel.js","sourceRoot":"","sources":["../../../src/app-layout/navigation-panel.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAsB,MAAM,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AA0B1D,MAAM,UAAU,eAAe,CAAC,EAcT;;QAbrB,UAAU,gBAAA,EACV,YAAY,kBAAA,EACZ,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,qBAAqB,2BAAA,EACrB,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,OAAO,aAAA,EACP,kBAAkB,wBAAA,EAClB,gBAAgB,sBAAA,EAChB,UAAU,gBAAA;IAEV,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,qBAAqB,EAAE;QACjF,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC;gBAC3C,GAAC,MAAM,CAAC,MAAM,IAAG,QAAQ;gBACzB,GAAC,MAAM,CAAC,IAAI,IAAG,cAAc;oBAC7B,EACF,KAAK,eACA,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;YAGhF,oBAAC,MAAM,IACL,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,eAAe,EACtB,MAAM,EAAE,cAAc,EACtB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,kBAAkB,EAC5B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,cAAc,CAAC,UAAU,CAAC,EACpE,cAAc,EAAE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAAE,cAAc,CAAC,kBAAkB,CAAC,CAAC,EACpF,eAAe,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC,EACvF,SAAS,EAAE,YAAY,EACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,IAErB,UAAU,CACJ,CACL,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { AppLayoutProps } from './interfaces';\nimport { DesktopDrawerProps, Drawer } from './drawer';\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\nimport useContentHeight from './utils/use-content-height';\n\ninterface NavigationPanelProps {\n  navigationOpen: boolean;\n  isHidden: DesktopDrawerProps['isHidden'];\n\n  navigationDrawerWidth: number;\n  navigationWidth: number;\n  headerHeight: DesktopDrawerProps['topOffset'];\n  footerHeight: DesktopDrawerProps['bottomOffset'];\n  panelHeightStyle: ReturnType<typeof useContentHeight>['panelHeightStyle'];\n\n  navigation: React.ReactNode;\n\n  ariaLabels: AppLayoutProps['ariaLabels'];\n\n  isMobile: boolean;\n  isMotionEnabled: boolean;\n\n  onNavigationToggle: DesktopDrawerProps['onToggle'];\n  onClick: DesktopDrawerProps['onClick'];\n\n  toggleRefs: DesktopDrawerProps['toggleRefs'];\n}\n\nexport function NavigationPanel({\n  ariaLabels,\n  footerHeight,\n  headerHeight,\n  isHidden,\n  isMobile,\n  navigation,\n  navigationDrawerWidth,\n  navigationWidth,\n  navigationOpen,\n  onClick,\n  onNavigationToggle,\n  panelHeightStyle,\n  toggleRefs,\n}: NavigationPanelProps) {\n  return (\n    <div className={styles['navigation-panel']} style={{ width: navigationDrawerWidth }}>\n      <div\n        className={clsx(styles['panel-wrapper-outer'], {\n          [styles.mobile]: isMobile,\n          [styles.open]: navigationOpen,\n        })}\n        style={{\n          ...(isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle),\n        }}\n      >\n        <Drawer\n          type=\"navigation\"\n          isMobile={isMobile}\n          width={navigationWidth}\n          isOpen={navigationOpen}\n          isHidden={isHidden}\n          onToggle={onNavigationToggle}\n          toggleRefs={toggleRefs}\n          onClick={onClick}\n          contentClassName={clsx(styles.navigation, testutilStyles.navigation)}\n          closeClassName={clsx(styles['navigation-close'], testutilStyles['navigation-close'])}\n          toggleClassName={clsx(styles['navigation-toggle'], testutilStyles['navigation-toggle'])}\n          topOffset={headerHeight}\n          bottomOffset={footerHeight}\n          ariaLabels={ariaLabels}\n        >\n          {navigation}\n        </Drawer>\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"navigation-panel.js","sourceRoot":"","sources":["../../../src/app-layout/navigation-panel.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAsB,MAAM,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAwB1D,MAAM,UAAU,eAAe,CAAC,EAaT;;QAZrB,UAAU,gBAAA,EACV,YAAY,kBAAA,EACZ,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,qBAAqB,2BAAA,EACrB,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,OAAO,aAAA,EACP,kBAAkB,wBAAA,EAClB,gBAAgB,sBAAA,EAChB,UAAU,gBAAA;IAEV,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,qBAAqB,EAAE;QACjF,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC;gBAC3C,GAAC,MAAM,CAAC,MAAM,IAAG,QAAQ;gBACzB,GAAC,MAAM,CAAC,IAAI,IAAG,cAAc;oBAC7B,EACF,KAAK,eACA,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;YAGhF,oBAAC,MAAM,IACL,IAAI,EAAC,YAAY,EACjB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,eAAe,EACtB,MAAM,EAAE,cAAc,EACtB,QAAQ,EAAE,kBAAkB,EAC5B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,cAAc,CAAC,UAAU,EAC3C,cAAc,EAAE,cAAc,CAAC,kBAAkB,CAAC,EAClD,eAAe,EAAE,cAAc,CAAC,mBAAmB,CAAC,EACpD,SAAS,EAAE,YAAY,EACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,IAErB,UAAU,CACJ,CACL,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { AppLayoutProps } from './interfaces';\nimport { DesktopDrawerProps, Drawer } from './drawer';\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\nimport useContentHeight from './utils/use-content-height';\n\ninterface NavigationPanelProps {\n  navigationOpen: boolean;\n\n  navigationDrawerWidth: number;\n  navigationWidth: number;\n  headerHeight: DesktopDrawerProps['topOffset'];\n  footerHeight: DesktopDrawerProps['bottomOffset'];\n  panelHeightStyle: ReturnType<typeof useContentHeight>['panelHeightStyle'];\n\n  navigation: React.ReactNode;\n\n  ariaLabels: AppLayoutProps['ariaLabels'];\n\n  isMobile: boolean;\n\n  onNavigationToggle: DesktopDrawerProps['onToggle'];\n  onClick: DesktopDrawerProps['onClick'];\n\n  toggleRefs: DesktopDrawerProps['toggleRefs'];\n}\n\nexport function NavigationPanel({\n  ariaLabels,\n  footerHeight,\n  headerHeight,\n  isMobile,\n  navigation,\n  navigationDrawerWidth,\n  navigationWidth,\n  navigationOpen,\n  onClick,\n  onNavigationToggle,\n  panelHeightStyle,\n  toggleRefs,\n}: NavigationPanelProps) {\n  return (\n    <div className={styles['navigation-panel']} style={{ width: navigationDrawerWidth }}>\n      <div\n        className={clsx(styles['panel-wrapper-outer'], {\n          [styles.mobile]: isMobile,\n          [styles.open]: navigationOpen,\n        })}\n        style={{\n          ...(isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle),\n        }}\n      >\n        <Drawer\n          type=\"navigation\"\n          isMobile={isMobile}\n          width={navigationWidth}\n          isOpen={navigationOpen}\n          onToggle={onNavigationToggle}\n          toggleRefs={toggleRefs}\n          onClick={onClick}\n          contentClassName={testutilStyles.navigation}\n          closeClassName={testutilStyles['navigation-close']}\n          toggleClassName={testutilStyles['navigation-toggle']}\n          topOffset={headerHeight}\n          bottomOffset={footerHeight}\n          ariaLabels={ariaLabels}\n        >\n          {navigation}\n        </Drawer>\n      </div>\n    </div>\n  );\n}\n"]}

package/lib/internal/template/app-layout/notifications/index.d.ts

@@ -5,13 +5,9 @@ interface NotificationsProps {
     children?: React.ReactNode;
     labels: AppLayoutProps.Labels | undefined;
     topOffset: number | undefined;
-    isMobile: boolean;
 }
 interface NotificationWrapperProps extends NotificationsProps {
     sticky: boolean | undefined;
-    navigationPadding: boolean;
-    toolsPadding: boolean;
-    contentWidthStyles?: React.CSSProperties;
 }
 export declare const Notifications: React.ForwardRefExoticComponent<NotificationWrapperProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/lib/internal/template/app-layout/notifications/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/notifications/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,kBAAkB;IAC1B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC1C,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,QAAQ,EAAE,OAAO,CAAC;CACnB;AACD,UAAU,wBAAyB,SAAQ,kBAAkB;IAC3D,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;IACtB,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC1C;AAED,eAAO,MAAM,aAAa,iGAczB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/notifications/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,UAAU,kBAAkB;IAC1B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC1C,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;CAC/B;AACD,UAAU,wBAAyB,SAAQ,kBAAkB;IAC3D,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;CAC7B;AAED,eAAO,MAAM,aAAa,iGAczB,CAAC"}

package/lib/internal/template/app-layout/notifications/index.js

@@ -2,12 +2,11 @@ import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
-import clsx from 'clsx';
 import styles from './styles.css.js';
 export var Notifications = React.forwardRef(function (_a, ref) {
     var _b, _c;
     var sticky = _a.sticky, props = __rest(_a, ["sticky"]);
     return sticky ? (React.createElement("div", { ref: ref, className: styles['notifications-sticky'], style: { top: props.topOffset } },
-        React.createElement("div", { role: "region", className: clsx(props.testUtilsClassName), "aria-label": (_b = props.labels) === null || _b === void 0 ? void 0 : _b.notifications }, props.children))) : (React.createElement("div", { role: "region", ref: ref, className: clsx(props.testUtilsClassName), "aria-label": (_c = props.labels) === null || _c === void 0 ? void 0 : _c.notifications }, props.children));
+        React.createElement("div", { role: "region", className: props.testUtilsClassName, "aria-label": (_b = props.labels) === null || _b === void 0 ? void 0 : _b.notifications }, props.children))) : (React.createElement("div", { role: "region", ref: ref, className: props.testUtilsClassName, "aria-label": (_c = props.labels) === null || _c === void 0 ? void 0 : _c.notifications }, props.children));
 });
 //# sourceMappingURL=index.js.map

package/lib/internal/template/app-layout/notifications/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/notifications/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAiBrC,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAC3C,UAAC,EAA8C,EAAE,GAA8B;;IAA5E,IAAA,MAAM,YAAA,EAAK,KAAK,cAAlB,UAAoB,CAAF;IACjB,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC,EAAE,KAAK,EAAE,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,EAAE;QACvF,6BAAK,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,gBAAc,MAAA,KAAK,CAAC,MAAM,0CAAE,aAAa,IAClG,KAAK,CAAC,QAAQ,CACX,CACF,CACP,CAAC,CAAC,CAAC,CACF,6BAAK,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,gBAAc,MAAA,KAAK,CAAC,MAAM,0CAAE,aAAa,IAC5G,KAAK,CAAC,QAAQ,CACX,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { AppLayoutProps } from '../interfaces';\n\ninterface NotificationsProps {\n  testUtilsClassName: string;\n  children?: React.ReactNode;\n  labels: AppLayoutProps.Labels | undefined;\n  topOffset: number | undefined;\n  isMobile: boolean;\n}\ninterface NotificationWrapperProps extends NotificationsProps {\n  sticky: boolean | undefined;\n  navigationPadding: boolean;\n  toolsPadding: boolean;\n  contentWidthStyles?: React.CSSProperties;\n}\n\nexport const Notifications = React.forwardRef(\n  ({ sticky, ...props }: NotificationWrapperProps, ref: React.Ref<HTMLDivElement>) => {\n    return sticky ? (\n      <div ref={ref} className={styles['notifications-sticky']} style={{ top: props.topOffset }}>\n        <div role=\"region\" className={clsx(props.testUtilsClassName)} aria-label={props.labels?.notifications}>\n          {props.children}\n        </div>\n      </div>\n    ) : (\n      <div role=\"region\" ref={ref} className={clsx(props.testUtilsClassName)} aria-label={props.labels?.notifications}>\n        {props.children}\n      </div>\n    );\n  }\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/notifications/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAarC,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAC3C,UAAC,EAA8C,EAAE,GAA8B;;IAA5E,IAAA,MAAM,YAAA,EAAK,KAAK,cAAlB,UAAoB,CAAF;IACjB,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,CAAC,sBAAsB,CAAC,EAAE,KAAK,EAAE,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,EAAE;QACvF,6BAAK,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,KAAK,CAAC,kBAAkB,gBAAc,MAAA,KAAK,CAAC,MAAM,0CAAE,aAAa,IAC5F,KAAK,CAAC,QAAQ,CACX,CACF,CACP,CAAC,CAAC,CAAC,CACF,6BAAK,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,CAAC,kBAAkB,gBAAc,MAAA,KAAK,CAAC,MAAM,0CAAE,aAAa,IACtG,KAAK,CAAC,QAAQ,CACX,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport styles from './styles.css.js';\nimport { AppLayoutProps } from '../interfaces';\n\ninterface NotificationsProps {\n  testUtilsClassName: string;\n  children?: React.ReactNode;\n  labels: AppLayoutProps.Labels | undefined;\n  topOffset: number | undefined;\n}\ninterface NotificationWrapperProps extends NotificationsProps {\n  sticky: boolean | undefined;\n}\n\nexport const Notifications = React.forwardRef(\n  ({ sticky, ...props }: NotificationWrapperProps, ref: React.Ref<HTMLDivElement>) => {\n    return sticky ? (\n      <div ref={ref} className={styles['notifications-sticky']} style={{ top: props.topOffset }}>\n        <div role=\"region\" className={props.testUtilsClassName} aria-label={props.labels?.notifications}>\n          {props.children}\n        </div>\n      </div>\n    ) : (\n      <div role=\"region\" ref={ref} className={props.testUtilsClassName} aria-label={props.labels?.notifications}>\n        {props.children}\n      </div>\n    );\n  }\n);\n"]}

package/lib/internal/template/app-layout/styles.css.js

@@ -1,43 +1,31 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_lm6vo_xtmft_97",
-  "layout-wrapper": "awsui_layout-wrapper_lm6vo_xtmft_98",
-  "root-no-scroll": "awsui_root-no-scroll_lm6vo_xtmft_104",
-  "layout": "awsui_layout_lm6vo_xtmft_98",
-  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_xtmft_115",
-  "layout-main": "awsui_layout-main_lm6vo_xtmft_119",
-  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_xtmft_125",
-  "unfocusable": "awsui_unfocusable_lm6vo_xtmft_130",
-  "navigation-panel": "awsui_navigation-panel_lm6vo_xtmft_134",
-  "drawer": "awsui_drawer_lm6vo_xtmft_138",
-  "drawer-mobile": "awsui_drawer-mobile_lm6vo_xtmft_144",
-  "drawer-closed": "awsui_drawer-closed_lm6vo_xtmft_147",
-  "opaque-background": "awsui_opaque-background_lm6vo_xtmft_154",
-  "drawer-content": "awsui_drawer-content_lm6vo_xtmft_158",
-  "toggle": "awsui_toggle_lm6vo_xtmft_183",
-  "visual-refresh-toggle": "awsui_visual-refresh-toggle_lm6vo_xtmft_188",
-  "visual-refresh-toggle-type-tools": "awsui_visual-refresh-toggle-type-tools_lm6vo_xtmft_192",
-  "visual-refresh-toggle-type-navigation": "awsui_visual-refresh-toggle-type-navigation_lm6vo_xtmft_195",
-  "button-toggles-container": "awsui_button-toggles-container_lm6vo_xtmft_205",
-  "button-toggles-container-is-hidden": "awsui_button-toggles-container-is-hidden_lm6vo_xtmft_210",
-  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_xtmft_224",
-  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_xtmft_229",
-  "content-wrapper": "awsui_content-wrapper_lm6vo_xtmft_233",
-  "content-overlapped": "awsui_content-overlapped_lm6vo_xtmft_237",
-  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_xtmft_241",
-  "navigation-toggle": "awsui_navigation-toggle_lm6vo_xtmft_246",
-  "tools-toggle": "awsui_tools-toggle_lm6vo_xtmft_251",
-  "navigation": "awsui_navigation_lm6vo_xtmft_134",
-  "navigation-close": "awsui_navigation-close_lm6vo_xtmft_263",
-  "tools": "awsui_tools_lm6vo_xtmft_251",
-  "tools-close": "awsui_tools-close_lm6vo_xtmft_275",
-  "notifications": "awsui_notifications_lm6vo_xtmft_279",
-  "breadcrumbs": "awsui_breadcrumbs_lm6vo_xtmft_224",
-  "content": "awsui_content_lm6vo_xtmft_229",
-  "panel-wrapper-outer": "awsui_panel-wrapper-outer_lm6vo_xtmft_291",
-  "panel-wrapper-inner": "awsui_panel-wrapper-inner_lm6vo_xtmft_292",
-  "mobile": "awsui_mobile_lm6vo_xtmft_301",
-  "open": "awsui_open_lm6vo_xtmft_307"
+  "root": "awsui_root_lm6vo_1slev_97",
+  "layout-wrapper": "awsui_layout-wrapper_lm6vo_1slev_98",
+  "root-no-scroll": "awsui_root-no-scroll_lm6vo_1slev_104",
+  "layout": "awsui_layout_lm6vo_1slev_98",
+  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_1slev_115",
+  "layout-main": "awsui_layout-main_lm6vo_1slev_119",
+  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_1slev_125",
+  "unfocusable": "awsui_unfocusable_lm6vo_1slev_130",
+  "navigation-panel": "awsui_navigation-panel_lm6vo_1slev_134",
+  "drawer": "awsui_drawer_lm6vo_1slev_138",
+  "drawer-mobile": "awsui_drawer-mobile_lm6vo_1slev_144",
+  "drawer-closed": "awsui_drawer-closed_lm6vo_1slev_147",
+  "drawer-content": "awsui_drawer-content_lm6vo_1slev_155",
+  "toggle": "awsui_toggle_lm6vo_1slev_177",
+  "visual-refresh-toggle": "awsui_visual-refresh-toggle_lm6vo_1slev_182",
+  "visual-refresh-toggle-type-tools": "awsui_visual-refresh-toggle-type-tools_lm6vo_1slev_186",
+  "visual-refresh-toggle-type-navigation": "awsui_visual-refresh-toggle-type-navigation_lm6vo_1slev_189",
+  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_1slev_199",
+  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_1slev_204",
+  "content-wrapper": "awsui_content-wrapper_lm6vo_1slev_208",
+  "content-overlapped": "awsui_content-overlapped_lm6vo_1slev_212",
+  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_1slev_216",
+  "panel-wrapper-outer": "awsui_panel-wrapper-outer_lm6vo_1slev_220",
+  "mobile": "awsui_mobile_lm6vo_1slev_226",
+  "open": "awsui_open_lm6vo_1slev_232",
+  "panel-wrapper-inner": "awsui_panel-wrapper-inner_lm6vo_1slev_238"
 };
   

package/lib/internal/template/app-layout/styles.scoped.css

@@ -94,222 +94,147 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_lm6vo_xtmft_97:not(#\9),
-.awsui_layout-wrapper_lm6vo_xtmft_98:not(#\9) {
+.awsui_root_lm6vo_1slev_97:not(#\9),
+.awsui_layout-wrapper_lm6vo_1slev_98:not(#\9) {
   display: flex;
   flex-direction: column;
   position: relative;
 }
 
-.awsui_root-no-scroll_lm6vo_xtmft_104:not(#\9) {
+.awsui_root-no-scroll_lm6vo_1slev_104:not(#\9) {
   position: relative;
   z-index: 1;
 }
 
-.awsui_layout_lm6vo_xtmft_98:not(#\9) {
+.awsui_layout_lm6vo_1slev_98:not(#\9) {
   flex: 1 1 auto;
   display: flex;
   align-items: stretch;
   background-color: var(--color-background-layout-main-q0tbxx, #f2f3f3);
 }
-.awsui_layout-no-scroll_lm6vo_xtmft_115:not(#\9) {
+.awsui_layout-no-scroll_lm6vo_1slev_115:not(#\9) {
   overflow: hidden;
 }
 
-.awsui_layout-main_lm6vo_xtmft_119:not(#\9) {
+.awsui_layout-main_lm6vo_1slev_119:not(#\9) {
   flex: 1;
   min-width: 0;
   background-color: var(--color-background-layout-main-q0tbxx, #f2f3f3);
   position: relative;
 }
-.awsui_layout-main-scrollable_lm6vo_xtmft_125:not(#\9) {
+.awsui_layout-main-scrollable_lm6vo_1slev_125:not(#\9) {
   overflow: auto;
 }
 
 /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
-.awsui_unfocusable_lm6vo_xtmft_130 *:not(#\9) {
+.awsui_unfocusable_lm6vo_1slev_130 *:not(#\9) {
   visibility: hidden;
 }
 
-.awsui_navigation-panel_lm6vo_xtmft_134:not(#\9) {
+.awsui_navigation-panel_lm6vo_1slev_134:not(#\9) {
   overflow-anchor: none;
 }
 
-.awsui_drawer_lm6vo_xtmft_138:not(#\9) {
+.awsui_drawer_lm6vo_1slev_138:not(#\9) {
   flex-shrink: 0;
   position: relative;
   word-wrap: break-word;
   box-shadow: var(--shadow-panel-v9vx7i, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
 }
-.awsui_drawer_lm6vo_xtmft_138:not(#\9):not(.awsui_drawer-mobile_lm6vo_xtmft_144) {
+.awsui_drawer_lm6vo_1slev_138:not(#\9):not(.awsui_drawer-mobile_lm6vo_1slev_144) {
   z-index: 850;
 }
-.awsui_drawer-closed_lm6vo_xtmft_147:not(#\9) {
+.awsui_drawer-closed_lm6vo_1slev_147:not(#\9) {
   min-width: 40px;
   cursor: pointer;
 }
-.awsui_drawer-closed_lm6vo_xtmft_147.awsui_drawer-mobile_lm6vo_xtmft_144:not(#\9) {
+.awsui_drawer-closed_lm6vo_1slev_147.awsui_drawer-mobile_lm6vo_1slev_144:not(#\9) {
   display: none;
 }
-.awsui_drawer_lm6vo_xtmft_138.awsui_opaque-background_lm6vo_xtmft_154:not(#\9) {
-  background: var(--color-background-layout-panel-content-r9pdjh, #ffffff);
-}
 
-.awsui_drawer-content_lm6vo_xtmft_158:not(#\9) {
+.awsui_drawer-content_lm6vo_1slev_155:not(#\9) {
   position: fixed;
   overflow: auto;
   background-color: var(--color-background-layout-panel-content-r9pdjh, #ffffff);
 }
-.awsui_opaque-background_lm6vo_xtmft_154 > .awsui_drawer-content_lm6vo_xtmft_158:not(#\9) {
-  border-right: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-panel-side-hxw8vd, transparent);
-}
-.awsui_drawer-mobile_lm6vo_xtmft_144 > .awsui_drawer-content_lm6vo_xtmft_158:not(#\9) {
+.awsui_drawer-mobile_lm6vo_1slev_144 > .awsui_drawer-content_lm6vo_1slev_155:not(#\9) {
   z-index: 1001;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
 }
-.awsui_drawer-closed_lm6vo_xtmft_147 > .awsui_drawer-content_lm6vo_xtmft_158:not(#\9) {
+.awsui_drawer-closed_lm6vo_1slev_147 > .awsui_drawer-content_lm6vo_1slev_155:not(#\9) {
   width: 40px;
 }
-.awsui_drawer-closed_lm6vo_xtmft_147 > .awsui_drawer-content_lm6vo_xtmft_158:not(#\9):hover {
+.awsui_drawer-closed_lm6vo_1slev_147 > .awsui_drawer-content_lm6vo_1slev_155:not(#\9):hover {
   background: var(--color-background-layout-panel-hover-thdv3z, #eaeded);
 }
-.awsui_drawer-content_lm6vo_xtmft_158 > [aria-hidden=true]:not(#\9) {
+.awsui_drawer-content_lm6vo_1slev_155 > [aria-hidden=true]:not(#\9) {
   display: none;
 }
 
-.awsui_toggle_lm6vo_xtmft_183:not(#\9) {
+.awsui_toggle_lm6vo_1slev_177:not(#\9) {
   box-sizing: border-box;
   padding: var(--space-xxs-ynfts5, 4px) 7px;
 }
 
-.awsui_visual-refresh-toggle_lm6vo_xtmft_188:not(#\9) {
+.awsui_visual-refresh-toggle_lm6vo_1slev_182:not(#\9) {
   position: fixed;
   padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-layout-toggle-padding-axl9jr, 20px);
 }
-.awsui_visual-refresh-toggle-type-tools_lm6vo_xtmft_192:not(#\9) {
+.awsui_visual-refresh-toggle-type-tools_lm6vo_1slev_186:not(#\9) {
   right: 0;
 }
-.awsui_visual-refresh-toggle-type-navigation_lm6vo_xtmft_195:not(#\9) {
+.awsui_visual-refresh-toggle-type-navigation_lm6vo_1slev_189:not(#\9) {
   left: 0;
 }
-.awsui_visual-refresh-toggle_lm6vo_xtmft_188[aria-hidden=true]:not(#\9) {
+.awsui_visual-refresh-toggle_lm6vo_1slev_182[aria-hidden=true]:not(#\9) {
   visibility: hidden;
 }
-.awsui_visual-refresh-toggle_lm6vo_xtmft_188[aria-hidden=false]:not(#\9) {
+.awsui_visual-refresh-toggle_lm6vo_1slev_182[aria-hidden=false]:not(#\9) {
   visibility: visible;
 }
 
-.awsui_button-toggles-container_lm6vo_xtmft_205:not(#\9) {
-  min-width: calc(var(--space-layout-toggle-diameter-hzvqtj, 40px) + 2 * var(--space-layout-toggle-padding-axl9jr, 20px));
-  position: relative;
-  z-index: 851;
-}
-.awsui_button-toggles-container-is-hidden_lm6vo_xtmft_210:not(#\9) {
-  min-width: 0;
-}
-.awsui_button-toggles-container_lm6vo_xtmft_205.awsui_opaque-background_lm6vo_xtmft_154:not(#\9)::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  width: calc(var(--space-layout-toggle-diameter-hzvqtj, 40px) + 2 * var(--space-layout-toggle-padding-axl9jr, 20px));
-  background: var(--color-background-layout-panel-content-r9pdjh, #ffffff);
-  border-left: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-panel-side-hxw8vd, transparent);
-}
-
-.awsui_breadcrumbs-desktop_lm6vo_xtmft_224:not(#\9) {
+.awsui_breadcrumbs-desktop_lm6vo_1slev_199:not(#\9) {
   padding-top: var(--space-scaled-m-pv0fmt, 16px);
   padding-bottom: var(--space-scaled-s-cu1hzn, 12px);
 }
 
-.awsui_content-header-wrapper_lm6vo_xtmft_229:not(#\9) {
+.awsui_content-header-wrapper_lm6vo_1slev_204:not(#\9) {
   padding-bottom: var(--space-content-header-padding-bottom-m7tdoi, 16px);
 }
 
-.awsui_content-wrapper_lm6vo_xtmft_233:not(#\9) {
+.awsui_content-wrapper_lm6vo_1slev_208:not(#\9) {
   padding-bottom: var(--space-layout-content-bottom-ebez2l, 20px);
 }
 
-.awsui_content-overlapped_lm6vo_xtmft_237:not(#\9) {
+.awsui_content-overlapped_lm6vo_1slev_212:not(#\9) {
   margin-top: calc(-1 * var(--space-dark-header-overlap-distance-ync2s3, 0px));
 }
 
-.awsui_content-extra-top-padding_lm6vo_xtmft_241:not(#\9) {
+.awsui_content-extra-top-padding_lm6vo_1slev_216:not(#\9) {
   padding-top: var(--space-scaled-m-pv0fmt, 16px);
 }
 
-/* stylelint-disable-next-line selector-max-universal */
-.awsui_navigation-toggle_lm6vo_xtmft_246 > *:not(#\9) {
-  pointer-events: none;
-}
-
-/* stylelint-disable-next-line selector-max-universal */
-.awsui_tools-toggle_lm6vo_xtmft_251 > *:not(#\9) {
-  pointer-events: none;
-}
-
-.awsui_navigation_lm6vo_xtmft_134:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_navigation-toggle_lm6vo_xtmft_246:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_navigation-close_lm6vo_xtmft_263:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_tools_lm6vo_xtmft_251:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_tools-toggle_lm6vo_xtmft_251:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_tools-close_lm6vo_xtmft_275:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_notifications_lm6vo_xtmft_279:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_breadcrumbs_lm6vo_xtmft_224:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_content_lm6vo_xtmft_229:not(#\9) {
-  /* used in test-utils */
-}
-
-.awsui_panel-wrapper-outer_lm6vo_xtmft_291:not(#\9),
-.awsui_panel-wrapper-inner_lm6vo_xtmft_292:not(#\9) {
-  z-index: 850;
-}
-
-.awsui_panel-wrapper-outer_lm6vo_xtmft_291:not(#\9) {
+.awsui_panel-wrapper-outer_lm6vo_1slev_220:not(#\9) {
   position: fixed;
   height: 100%;
+  z-index: 850;
   display: flex;
 }
-.awsui_panel-wrapper-outer_lm6vo_xtmft_291.awsui_mobile_lm6vo_xtmft_301:not(#\9) {
+.awsui_panel-wrapper-outer_lm6vo_1slev_220.awsui_mobile_lm6vo_1slev_226:not(#\9) {
   left: 0;
   right: 0;
   z-index: -1;
   pointer-events: none;
 }
-.awsui_panel-wrapper-outer_lm6vo_xtmft_291.awsui_mobile_lm6vo_xtmft_301.awsui_open_lm6vo_xtmft_307:not(#\9) {
+.awsui_panel-wrapper-outer_lm6vo_1slev_220.awsui_mobile_lm6vo_1slev_226.awsui_open_lm6vo_1slev_232:not(#\9) {
   z-index: 1001;
   width: 100vw;
   pointer-events: auto;
 }
 
-.awsui_panel-wrapper-inner_lm6vo_xtmft_292:not(#\9) {
+.awsui_panel-wrapper-inner_lm6vo_1slev_238:not(#\9) {
   background: var(--color-background-layout-panel-content-r9pdjh, #ffffff);
 }

package/lib/internal/template/app-layout/styles.selectors.js

@@ -2,43 +2,31 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_lm6vo_xtmft_97",
-  "layout-wrapper": "awsui_layout-wrapper_lm6vo_xtmft_98",
-  "root-no-scroll": "awsui_root-no-scroll_lm6vo_xtmft_104",
-  "layout": "awsui_layout_lm6vo_xtmft_98",
-  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_xtmft_115",
-  "layout-main": "awsui_layout-main_lm6vo_xtmft_119",
-  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_xtmft_125",
-  "unfocusable": "awsui_unfocusable_lm6vo_xtmft_130",
-  "navigation-panel": "awsui_navigation-panel_lm6vo_xtmft_134",
-  "drawer": "awsui_drawer_lm6vo_xtmft_138",
-  "drawer-mobile": "awsui_drawer-mobile_lm6vo_xtmft_144",
-  "drawer-closed": "awsui_drawer-closed_lm6vo_xtmft_147",
-  "opaque-background": "awsui_opaque-background_lm6vo_xtmft_154",
-  "drawer-content": "awsui_drawer-content_lm6vo_xtmft_158",
-  "toggle": "awsui_toggle_lm6vo_xtmft_183",
-  "visual-refresh-toggle": "awsui_visual-refresh-toggle_lm6vo_xtmft_188",
-  "visual-refresh-toggle-type-tools": "awsui_visual-refresh-toggle-type-tools_lm6vo_xtmft_192",
-  "visual-refresh-toggle-type-navigation": "awsui_visual-refresh-toggle-type-navigation_lm6vo_xtmft_195",
-  "button-toggles-container": "awsui_button-toggles-container_lm6vo_xtmft_205",
-  "button-toggles-container-is-hidden": "awsui_button-toggles-container-is-hidden_lm6vo_xtmft_210",
-  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_xtmft_224",
-  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_xtmft_229",
-  "content-wrapper": "awsui_content-wrapper_lm6vo_xtmft_233",
-  "content-overlapped": "awsui_content-overlapped_lm6vo_xtmft_237",
-  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_xtmft_241",
-  "navigation-toggle": "awsui_navigation-toggle_lm6vo_xtmft_246",
-  "tools-toggle": "awsui_tools-toggle_lm6vo_xtmft_251",
-  "navigation": "awsui_navigation_lm6vo_xtmft_134",
-  "navigation-close": "awsui_navigation-close_lm6vo_xtmft_263",
-  "tools": "awsui_tools_lm6vo_xtmft_251",
-  "tools-close": "awsui_tools-close_lm6vo_xtmft_275",
-  "notifications": "awsui_notifications_lm6vo_xtmft_279",
-  "breadcrumbs": "awsui_breadcrumbs_lm6vo_xtmft_224",
-  "content": "awsui_content_lm6vo_xtmft_229",
-  "panel-wrapper-outer": "awsui_panel-wrapper-outer_lm6vo_xtmft_291",
-  "panel-wrapper-inner": "awsui_panel-wrapper-inner_lm6vo_xtmft_292",
-  "mobile": "awsui_mobile_lm6vo_xtmft_301",
-  "open": "awsui_open_lm6vo_xtmft_307"
+  "root": "awsui_root_lm6vo_1slev_97",
+  "layout-wrapper": "awsui_layout-wrapper_lm6vo_1slev_98",
+  "root-no-scroll": "awsui_root-no-scroll_lm6vo_1slev_104",
+  "layout": "awsui_layout_lm6vo_1slev_98",
+  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_1slev_115",
+  "layout-main": "awsui_layout-main_lm6vo_1slev_119",
+  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_1slev_125",
+  "unfocusable": "awsui_unfocusable_lm6vo_1slev_130",
+  "navigation-panel": "awsui_navigation-panel_lm6vo_1slev_134",
+  "drawer": "awsui_drawer_lm6vo_1slev_138",
+  "drawer-mobile": "awsui_drawer-mobile_lm6vo_1slev_144",
+  "drawer-closed": "awsui_drawer-closed_lm6vo_1slev_147",
+  "drawer-content": "awsui_drawer-content_lm6vo_1slev_155",
+  "toggle": "awsui_toggle_lm6vo_1slev_177",
+  "visual-refresh-toggle": "awsui_visual-refresh-toggle_lm6vo_1slev_182",
+  "visual-refresh-toggle-type-tools": "awsui_visual-refresh-toggle-type-tools_lm6vo_1slev_186",
+  "visual-refresh-toggle-type-navigation": "awsui_visual-refresh-toggle-type-navigation_lm6vo_1slev_189",
+  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_1slev_199",
+  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_1slev_204",
+  "content-wrapper": "awsui_content-wrapper_lm6vo_1slev_208",
+  "content-overlapped": "awsui_content-overlapped_lm6vo_1slev_212",
+  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_1slev_216",
+  "panel-wrapper-outer": "awsui_panel-wrapper-outer_lm6vo_1slev_220",
+  "mobile": "awsui_mobile_lm6vo_1slev_226",
+  "open": "awsui_open_lm6vo_1slev_232",
+  "panel-wrapper-inner": "awsui_panel-wrapper-inner_lm6vo_1slev_238"
 };
   

package/lib/internal/template/app-layout/tools-and-split-panel.d.ts

@@ -5,26 +5,19 @@ import useContentHeight from './utils/use-content-height';
 interface ToolsAndSplitPanelProps {
     toolsHide: boolean;
     toolsOpen: boolean;
-    isHidden: DesktopDrawerProps['isHidden'];
-    splitPanelOpen: boolean;
     drawerWidth: number;
     toolsWidth: number;
-    splitPanelReportedSize: number;
-    closedDrawerWidth: number;
     headerHeight: DesktopDrawerProps['topOffset'];
     footerHeight: DesktopDrawerProps['bottomOffset'];
     panelHeightStyle: ReturnType<typeof useContentHeight>['panelHeightStyle'];
-    contentHeightStyle: ReturnType<typeof useContentHeight>['contentHeightStyle'];
     tools: React.ReactNode;
     splitPanel: React.ReactNode;
     ariaLabels: AppLayoutProps['ariaLabels'];
-    disableContentPaddings: AppLayoutProps['disableContentPaddings'];
     isMobile: boolean;
-    isMotionEnabled: boolean;
     onToolsToggle: DesktopDrawerProps['onToggle'];
     toggleRefs: DesktopDrawerProps['toggleRefs'];
     onLoseToolsFocus: (event: React.FocusEvent) => void;
 }
-export declare function ToolsAndSplitPanel({ ariaLabels, drawerWidth, footerHeight, headerHeight, isHidden, isMobile, onToolsToggle, panelHeightStyle, splitPanel, toggleRefs, onLoseToolsFocus, tools, toolsHide, toolsOpen, toolsWidth, splitPanelOpen, }: ToolsAndSplitPanelProps): JSX.Element;
+export declare function ToolsAndSplitPanel({ ariaLabels, drawerWidth, footerHeight, headerHeight, isMobile, onToolsToggle, panelHeightStyle, splitPanel, toggleRefs, onLoseToolsFocus, tools, toolsHide, toolsOpen, toolsWidth, }: ToolsAndSplitPanelProps): JSX.Element;
 export {};
 //# sourceMappingURL=tools-and-split-panel.d.ts.map

package/lib/internal/template/app-layout/tools-and-split-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tools-and-split-panel.d.ts","sourceRoot":"","sources":["../../../src/app-layout/tools-and-split-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAU,MAAM,UAAU,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAI1D,UAAU,uBAAuB;IAC/B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAEzC,cAAc,EAAE,OAAO,CAAC;IAExB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,iBAAiB,EAAE,MAAM,CAAC;IAE1B,YAAY,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC9C,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,gBAAgB,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAC1E,kBAAkB,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IAE9E,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,UAAU,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IAEzC,sBAAsB,EAAE,cAAc,CAAC,wBAAwB,CAAC,CAAC;IACjE,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,OAAO,CAAC;IAEzB,aAAa,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAE9C,UAAU,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAE7C,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACrD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,cAAc,GACf,EAAE,uBAAuB,eA8CzB"}
+{"version":3,"file":"tools-and-split-panel.d.ts","sourceRoot":"","sources":["../../../src/app-layout/tools-and-split-panel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAU,MAAM,UAAU,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAI1D,UAAU,uBAAuB;IAC/B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC9C,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,gBAAgB,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAC1E,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,UAAU,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACzC,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC9C,UAAU,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAC7C,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACrD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,GACX,EAAE,uBAAuB,eAyCzB"}

package/lib/internal/template/app-layout/tools-and-split-panel.js

@@ -8,8 +8,7 @@ import styles from './styles.css.js';
 import testutilStyles from './test-classes/styles.css.js';
 export function ToolsAndSplitPanel(_a) {
     var _b;
-    var ariaLabels = _a.ariaLabels, drawerWidth = _a.drawerWidth, footerHeight = _a.footerHeight, headerHeight = _a.headerHeight, isHidden = _a.isHidden, isMobile = _a.isMobile, onToolsToggle = _a.onToolsToggle, panelHeightStyle = _a.panelHeightStyle, splitPanel = _a.splitPanel, toggleRefs = _a.toggleRefs, onLoseToolsFocus = _a.onLoseToolsFocus, tools = _a.tools, toolsHide = _a.toolsHide, toolsOpen = _a.toolsOpen, toolsWidth = _a.toolsWidth, splitPanelOpen = _a.splitPanelOpen;
-    var splitPanelVisible = splitPanelOpen && Boolean(splitPanel);
+    var ariaLabels = _a.ariaLabels, drawerWidth = _a.drawerWidth, footerHeight = _a.footerHeight, headerHeight = _a.headerHeight, isMobile = _a.isMobile, onToolsToggle = _a.onToolsToggle, panelHeightStyle = _a.panelHeightStyle, splitPanel = _a.splitPanel, toggleRefs = _a.toggleRefs, onLoseToolsFocus = _a.onLoseToolsFocus, tools = _a.tools, toolsHide = _a.toolsHide, toolsOpen = _a.toolsOpen, toolsWidth = _a.toolsWidth;
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { style: {
                 width: drawerWidth
@@ -19,6 +18,6 @@ export function ToolsAndSplitPanel(_a) {
                     _b[styles.open] = toolsOpen,
                     _b)), style: __assign({}, (isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle)) },
                 splitPanel,
-                !toolsHide && (React.createElement(Drawer, { type: "tools", isMobile: isMobile, width: toolsWidth, isOpen: toolsOpen, onToggle: onToolsToggle, toggleRefs: toggleRefs, onLoseFocus: onLoseToolsFocus, isHidden: isHidden, contentClassName: clsx(styles.tools, testutilStyles.tools), closeClassName: clsx(styles['tools-close'], testutilStyles['tools-close']), toggleClassName: clsx(styles['tools-toggle'], testutilStyles['tools-toggle']), topOffset: headerHeight, bottomOffset: footerHeight, ariaLabels: ariaLabels, extendRight: 0, hasDividerWithSplitPanel: splitPanelVisible }, tools))))));
+                !toolsHide && (React.createElement(Drawer, { type: "tools", isMobile: isMobile, width: toolsWidth, isOpen: toolsOpen, onToggle: onToolsToggle, toggleRefs: toggleRefs, onLoseFocus: onLoseToolsFocus, contentClassName: testutilStyles.tools, closeClassName: testutilStyles['tools-close'], toggleClassName: testutilStyles['tools-toggle'], topOffset: headerHeight, bottomOffset: footerHeight, ariaLabels: ariaLabels }, tools))))));
 }
 //# sourceMappingURL=tools-and-split-panel.js.map

package/lib/internal/template/app-layout/tools-and-split-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"tools-and-split-panel.js","sourceRoot":"","sources":["../../../src/app-layout/tools-and-split-panel.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,MAAM,EAAE,MAAM,UAAU,CAAC;AAGtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAmC1D,MAAM,UAAU,kBAAkB,CAAC,EAiBT;;QAhBxB,UAAU,gBAAA,EACV,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,UAAU,gBAAA,EACV,UAAU,gBAAA,EACV,gBAAgB,sBAAA,EAChB,KAAK,WAAA,EACL,SAAS,eAAA,EACT,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,cAAc,oBAAA;IAEd,IAAM,iBAAiB,GAAG,cAAc,IAAI,OAAO,CAAC,UAAU,CAAC,CAAC;IAEhE,OAAO,CACL;QACE,6BACE,KAAK,EAAE;gBACL,KAAK,EAAE,WAAW;aACnB;YAED,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC;oBAC3C,GAAC,MAAM,CAAC,MAAM,IAAG,QAAQ;oBACzB,GAAC,MAAM,CAAC,IAAI,IAAG,SAAS;wBACxB,EACF,KAAK,eACA,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;gBAG/E,UAAU;gBACV,CAAC,SAAS,IAAI,CACb,oBAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,SAAS,EACjB,QAAQ,EAAE,aAAa,EACvB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,gBAAgB,EAC7B,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,EAC1D,cAAc,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,cAAc,CAAC,aAAa,CAAC,CAAC,EAC1E,eAAe,EAAE,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC,EAC7E,SAAS,EAAE,YAAY,EACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,CAAC,EACd,wBAAwB,EAAE,iBAAiB,IAE1C,KAAK,CACC,CACV,CACG,CACF,CACL,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { DesktopDrawerProps, Drawer } from './drawer';\nimport { AppLayoutProps } from './interfaces';\nimport useContentHeight from './utils/use-content-height';\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\ninterface ToolsAndSplitPanelProps {\n  toolsHide: boolean;\n  toolsOpen: boolean;\n  isHidden: DesktopDrawerProps['isHidden'];\n\n  splitPanelOpen: boolean;\n\n  drawerWidth: number;\n  toolsWidth: number;\n  splitPanelReportedSize: number;\n  closedDrawerWidth: number;\n\n  headerHeight: DesktopDrawerProps['topOffset'];\n  footerHeight: DesktopDrawerProps['bottomOffset'];\n  panelHeightStyle: ReturnType<typeof useContentHeight>['panelHeightStyle'];\n  contentHeightStyle: ReturnType<typeof useContentHeight>['contentHeightStyle'];\n\n  tools: React.ReactNode;\n  splitPanel: React.ReactNode;\n\n  ariaLabels: AppLayoutProps['ariaLabels'];\n\n  disableContentPaddings: AppLayoutProps['disableContentPaddings'];\n  isMobile: boolean;\n  isMotionEnabled: boolean;\n\n  onToolsToggle: DesktopDrawerProps['onToggle'];\n\n  toggleRefs: DesktopDrawerProps['toggleRefs'];\n\n  onLoseToolsFocus: (event: React.FocusEvent) => void;\n}\n\nexport function ToolsAndSplitPanel({\n  ariaLabels,\n  drawerWidth,\n  footerHeight,\n  headerHeight,\n  isHidden,\n  isMobile,\n  onToolsToggle,\n  panelHeightStyle,\n  splitPanel,\n  toggleRefs,\n  onLoseToolsFocus,\n  tools,\n  toolsHide,\n  toolsOpen,\n  toolsWidth,\n  splitPanelOpen,\n}: ToolsAndSplitPanelProps) {\n  const splitPanelVisible = splitPanelOpen && Boolean(splitPanel);\n\n  return (\n    <>\n      <div\n        style={{\n          width: drawerWidth,\n        }}\n      >\n        <div\n          className={clsx(styles['panel-wrapper-outer'], {\n            [styles.mobile]: isMobile,\n            [styles.open]: toolsOpen,\n          })}\n          style={{\n            ...(isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle),\n          }}\n        >\n          {splitPanel}\n          {!toolsHide && (\n            <Drawer\n              type=\"tools\"\n              isMobile={isMobile}\n              width={toolsWidth}\n              isOpen={toolsOpen}\n              onToggle={onToolsToggle}\n              toggleRefs={toggleRefs}\n              onLoseFocus={onLoseToolsFocus}\n              isHidden={isHidden}\n              contentClassName={clsx(styles.tools, testutilStyles.tools)}\n              closeClassName={clsx(styles['tools-close'], testutilStyles['tools-close'])}\n              toggleClassName={clsx(styles['tools-toggle'], testutilStyles['tools-toggle'])}\n              topOffset={headerHeight}\n              bottomOffset={footerHeight}\n              ariaLabels={ariaLabels}\n              extendRight={0}\n              hasDividerWithSplitPanel={splitPanelVisible}\n            >\n              {tools}\n            </Drawer>\n          )}\n        </div>\n      </div>\n    </>\n  );\n}\n"]}
+{"version":3,"file":"tools-and-split-panel.js","sourceRoot":"","sources":["../../../src/app-layout/tools-and-split-panel.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,MAAM,EAAE,MAAM,UAAU,CAAC;AAGtD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAmB1D,MAAM,UAAU,kBAAkB,CAAC,EAeT;;QAdxB,UAAU,gBAAA,EACV,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,UAAU,gBAAA,EACV,UAAU,gBAAA,EACV,gBAAgB,sBAAA,EAChB,KAAK,WAAA,EACL,SAAS,eAAA,EACT,SAAS,eAAA,EACT,UAAU,gBAAA;IAEV,OAAO,CACL;QACE,6BACE,KAAK,EAAE;gBACL,KAAK,EAAE,WAAW;aACnB;YAED,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC;oBAC3C,GAAC,MAAM,CAAC,MAAM,IAAG,QAAQ;oBACzB,GAAC,MAAM,CAAC,IAAI,IAAG,SAAS;wBACxB,EACF,KAAK,eACA,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;gBAG/E,UAAU;gBACV,CAAC,SAAS,IAAI,CACb,oBAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,UAAU,EACjB,MAAM,EAAE,SAAS,EACjB,QAAQ,EAAE,aAAa,EACvB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,gBAAgB,EAC7B,gBAAgB,EAAE,cAAc,CAAC,KAAK,EACtC,cAAc,EAAE,cAAc,CAAC,aAAa,CAAC,EAC7C,eAAe,EAAE,cAAc,CAAC,cAAc,CAAC,EAC/C,SAAS,EAAE,YAAY,EACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,IAErB,KAAK,CACC,CACV,CACG,CACF,CACL,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { DesktopDrawerProps, Drawer } from './drawer';\nimport { AppLayoutProps } from './interfaces';\nimport useContentHeight from './utils/use-content-height';\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\ninterface ToolsAndSplitPanelProps {\n  toolsHide: boolean;\n  toolsOpen: boolean;\n  drawerWidth: number;\n  toolsWidth: number;\n  headerHeight: DesktopDrawerProps['topOffset'];\n  footerHeight: DesktopDrawerProps['bottomOffset'];\n  panelHeightStyle: ReturnType<typeof useContentHeight>['panelHeightStyle'];\n  tools: React.ReactNode;\n  splitPanel: React.ReactNode;\n  ariaLabels: AppLayoutProps['ariaLabels'];\n  isMobile: boolean;\n  onToolsToggle: DesktopDrawerProps['onToggle'];\n  toggleRefs: DesktopDrawerProps['toggleRefs'];\n  onLoseToolsFocus: (event: React.FocusEvent) => void;\n}\n\nexport function ToolsAndSplitPanel({\n  ariaLabels,\n  drawerWidth,\n  footerHeight,\n  headerHeight,\n  isMobile,\n  onToolsToggle,\n  panelHeightStyle,\n  splitPanel,\n  toggleRefs,\n  onLoseToolsFocus,\n  tools,\n  toolsHide,\n  toolsOpen,\n  toolsWidth,\n}: ToolsAndSplitPanelProps) {\n  return (\n    <>\n      <div\n        style={{\n          width: drawerWidth,\n        }}\n      >\n        <div\n          className={clsx(styles['panel-wrapper-outer'], {\n            [styles.mobile]: isMobile,\n            [styles.open]: toolsOpen,\n          })}\n          style={{\n            ...(isMobile ? { top: headerHeight, bottom: footerHeight } : panelHeightStyle),\n          }}\n        >\n          {splitPanel}\n          {!toolsHide && (\n            <Drawer\n              type=\"tools\"\n              isMobile={isMobile}\n              width={toolsWidth}\n              isOpen={toolsOpen}\n              onToggle={onToolsToggle}\n              toggleRefs={toggleRefs}\n              onLoseFocus={onLoseToolsFocus}\n              contentClassName={testutilStyles.tools}\n              closeClassName={testutilStyles['tools-close']}\n              toggleClassName={testutilStyles['tools-toggle']}\n              topOffset={headerHeight}\n              bottomOffset={footerHeight}\n              ariaLabels={ariaLabels}\n            >\n              {tools}\n            </Drawer>\n          )}\n        </div>\n      </div>\n    </>\n  );\n}\n"]}

package/lib/internal/template/flashbar/collapsible-flashbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC;AAgBvE,OAAO,EAAE,aAAa,EAAE,CAAC;AAQzB,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,GAAG,wBAAwB,eA0S5G"}
+{"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC;AAgBvE,OAAO,EAAE,aAAa,EAAE,CAAC;AAQzB,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,GAAG,wBAAwB,eAuS5G"}