@cloudscape-design/components-themeable 3.0.663 → 3.0.665

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/mobile-toolbar/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect } from 'react';\nimport { ButtonProps } from '../../button/interfaces';\nimport { AppLayoutProps } from '../interfaces';\nimport { ToggleButton, togglesConfig } from '../toggles';\nimport OverflowMenu from '../drawer/overflow-menu';\nimport styles from './styles.css.js';\nimport sharedStyles from '../styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { splitItems } from '../drawer/drawers-helpers';\nimport { TOOLS_DRAWER_ID } from '../utils/use-drawers';\n\ninterface MobileToggleProps {\n  className?: string;\n  ariaLabels?: AppLayoutProps.Labels;\n  type: keyof typeof togglesConfig;\n  disabled?: boolean;\n  onClick: () => void;\n}\nconst MobileToggle = React.forwardRef(\n  ({ className, ariaLabels, type, disabled, onClick }: MobileToggleProps, ref: React.Ref<ButtonProps.Ref>) => {\n    const { TagName, iconName, getLabels } = togglesConfig[type];\n    const { mainLabel, openLabel } = getLabels(ariaLabels);\n\n    return (\n      <TagName\n        className={clsx(styles['mobile-toggle'], styles[`mobile-toggle-type-${type}`])}\n        aria-hidden={disabled}\n        aria-label={mainLabel}\n        onClick={e => e.target === e.currentTarget && onClick()}\n      >\n        <ToggleButton\n          ref={ref}\n          className={className}\n          iconName={iconName}\n          onClick={onClick}\n          ariaLabel={openLabel}\n          disabled={disabled}\n          ariaExpanded={disabled}\n        />\n      </TagName>\n    );\n  }\n);\ninterface MobileToolbarProps {\n  anyPanelOpen: boolean;\n  unfocusable: boolean | undefined;\n  toggleRefs: {\n    navigation: React.Ref<ButtonProps.Ref>;\n    tools: React.Ref<ButtonProps.Ref>;\n  };\n  navigationHide: boolean | undefined;\n  toolsHide: boolean | undefined;\n  topOffset?: number;\n  ariaLabels: AppLayoutProps.Labels | undefined;\n  mobileBarRef: React.Ref<HTMLDivElement>;\n  children: React.ReactNode;\n  onNavigationOpen: () => void;\n  onToolsOpen: () => void;\n  drawers: Array<AppLayoutProps.Drawer> | undefined;\n  activeDrawerId: string | null;\n  onDrawerChange: (newDrawerId: string | null) => void;\n}\n\nexport function MobileToolbar({\n  ariaLabels,\n  toggleRefs,\n  topOffset,\n  navigationHide,\n  toolsHide,\n  anyPanelOpen,\n  unfocusable,\n  drawers,\n  activeDrawerId,\n  children,\n  onNavigationOpen,\n  onToolsOpen,\n  onDrawerChange,\n  mobileBarRef,\n}: MobileToolbarProps) {\n  useEffect(() => {\n    if (anyPanelOpen) {\n      document.body.classList.add(styles['block-body-scroll']);\n      return () => {\n        document.body.classList.remove(styles['block-body-scroll']);\n      };\n    } else {\n      document.body.classList.remove(styles['block-body-scroll']);\n    }\n  }, [anyPanelOpen]);\n\n  const { overflowItems, visibleItems } = splitItems(drawers, 2, activeDrawerId);\n  const overflowMenuHasBadge = !!overflowItems.find(item => item.badge);\n\n  return (\n    <div\n      ref={mobileBarRef}\n      className={clsx(styles['mobile-bar'], testutilStyles['mobile-bar'], unfocusable && sharedStyles.unfocusable)}\n      style={{ top: topOffset }}\n    >\n      {!navigationHide && (\n        <MobileToggle\n          ref={toggleRefs.navigation}\n          type=\"navigation\"\n          className={testutilStyles['navigation-toggle']}\n          ariaLabels={ariaLabels}\n          disabled={anyPanelOpen}\n          onClick={onNavigationOpen}\n        />\n      )}\n      <div className={styles['mobile-bar-breadcrumbs']}>\n        {children && <div className={testutilStyles.breadcrumbs}>{children}</div>}\n      </div>\n      {!toolsHide && !drawers && (\n        <MobileToggle\n          ref={toggleRefs.tools}\n          type=\"tools\"\n          className={testutilStyles['tools-toggle']}\n          ariaLabels={ariaLabels}\n          disabled={anyPanelOpen}\n          onClick={onToolsOpen}\n        />\n      )}\n      {drawers && (\n        <aside aria-label={ariaLabels?.drawers} role=\"region\">\n          <div className={clsx(styles['drawers-container'])} role=\"toolbar\" aria-orientation=\"horizontal\">\n            {visibleItems.map((item, index) => (\n              <div\n                className={clsx(styles['mobile-toggle'], styles['mobile-toggle-type-drawer'])}\n                key={index}\n                onClick={() => onDrawerChange(item.id)}\n              >\n                <ToggleButton\n                  className={clsx(\n                    testutilStyles['drawers-trigger'],\n                    item.id === TOOLS_DRAWER_ID && testutilStyles['tools-toggle']\n                  )}\n                  iconName={item.trigger.iconName}\n                  iconSvg={item.trigger.iconSvg}\n                  badge={item.badge}\n                  ariaLabel={item.ariaLabels?.triggerButton}\n                  ariaExpanded={activeDrawerId === item.id}\n                  testId={`awsui-app-layout-trigger-${item.id}`}\n                />\n              </div>\n            ))}\n            {overflowItems.length > 0 && (\n              <div className={clsx(styles['mobile-toggle'], styles['mobile-toggle-type-drawer'])}>\n                <OverflowMenu\n                  ariaLabel={overflowMenuHasBadge ? ariaLabels?.drawersOverflowWithBadge : ariaLabels?.drawersOverflow}\n                  items={overflowItems}\n                  onItemClick={({ detail }) => onDrawerChange(detail.id)}\n                />\n              </div>\n            )}\n          </div>\n        </aside>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/mobile-toolbar/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect } from 'react';\nimport { ButtonProps } from '../../button/interfaces';\nimport { AppLayoutProps } from '../interfaces';\nimport { ToggleButton, togglesConfig } from '../toggles';\nimport OverflowMenu from '../drawer/overflow-menu';\nimport styles from './styles.css.js';\nimport sharedStyles from '../styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport { splitItems } from '../drawer/drawers-helpers';\nimport { TOOLS_DRAWER_ID } from '../utils/use-drawers';\n\ninterface MobileToggleProps {\n  className?: string;\n  ariaLabels?: AppLayoutProps.Labels;\n  type: keyof typeof togglesConfig;\n  disabled?: boolean;\n  onClick: () => void;\n}\nconst MobileToggle = React.forwardRef(\n  ({ className, ariaLabels, type, disabled, onClick }: MobileToggleProps, ref: React.Ref<ButtonProps.Ref>) => {\n    const { TagName, iconName, getLabels } = togglesConfig[type];\n    const { mainLabel, openLabel } = getLabels(ariaLabels);\n\n    return (\n      <TagName\n        className={clsx(styles['mobile-toggle'], styles[`mobile-toggle-type-${type}`])}\n        aria-hidden={disabled}\n        aria-label={mainLabel}\n        onClick={e => e.target === e.currentTarget && onClick()}\n      >\n        <ToggleButton\n          ref={ref}\n          className={className}\n          iconName={iconName}\n          onClick={onClick}\n          ariaLabel={openLabel}\n          disabled={disabled}\n          ariaExpanded={disabled}\n        />\n      </TagName>\n    );\n  }\n);\ninterface MobileToolbarProps {\n  anyPanelOpen: boolean;\n  unfocusable: boolean | undefined;\n  toggleRefs: {\n    navigation: React.Ref<ButtonProps.Ref>;\n    tools: React.Ref<ButtonProps.Ref>;\n  };\n  navigationHide: boolean | undefined;\n  toolsHide: boolean | undefined;\n  topOffset?: number;\n  ariaLabels: AppLayoutProps.Labels | undefined;\n  mobileBarRef: React.Ref<HTMLDivElement>;\n  children: React.ReactNode;\n  onNavigationOpen: () => void;\n  onToolsOpen: () => void;\n  drawers: Array<AppLayoutProps.Drawer> | undefined;\n  activeDrawerId: string | null;\n  onDrawerChange: (newDrawerId: string | null) => void;\n}\n\nexport function MobileToolbar({\n  ariaLabels,\n  toggleRefs,\n  topOffset,\n  navigationHide,\n  toolsHide,\n  anyPanelOpen,\n  unfocusable,\n  drawers,\n  activeDrawerId,\n  children,\n  onNavigationOpen,\n  onToolsOpen,\n  onDrawerChange,\n  mobileBarRef,\n}: MobileToolbarProps) {\n  useEffect(() => {\n    if (anyPanelOpen) {\n      document.body.classList.add(styles['block-body-scroll']);\n      return () => {\n        document.body.classList.remove(styles['block-body-scroll']);\n      };\n    } else {\n      document.body.classList.remove(styles['block-body-scroll']);\n    }\n  }, [anyPanelOpen]);\n\n  const { overflowItems, visibleItems } = splitItems(drawers, 2, activeDrawerId);\n  const overflowMenuHasBadge = !!overflowItems.find(item => item.badge);\n\n  return (\n    <div\n      ref={mobileBarRef}\n      className={clsx(styles['mobile-bar'], testutilStyles['mobile-bar'], unfocusable && sharedStyles.unfocusable)}\n      style={{ top: topOffset }}\n    >\n      {!navigationHide && (\n        <MobileToggle\n          ref={toggleRefs.navigation}\n          type=\"navigation\"\n          className={testutilStyles['navigation-toggle']}\n          ariaLabels={ariaLabels}\n          disabled={anyPanelOpen}\n          onClick={onNavigationOpen}\n        />\n      )}\n      <div className={styles['mobile-bar-breadcrumbs']}>\n        {children && <div className={testutilStyles.breadcrumbs}>{children}</div>}\n      </div>\n      {!toolsHide && !drawers && (\n        <MobileToggle\n          ref={toggleRefs.tools}\n          type=\"tools\"\n          className={testutilStyles['tools-toggle']}\n          ariaLabels={ariaLabels}\n          disabled={anyPanelOpen}\n          onClick={onToolsOpen}\n        />\n      )}\n      {drawers && (\n        <aside aria-label={ariaLabels?.drawers} role=\"region\">\n          <div className={styles['drawers-container']} role=\"toolbar\" aria-orientation=\"horizontal\">\n            {visibleItems.map((item, index) => (\n              <div\n                className={clsx(styles['mobile-toggle'], styles['mobile-toggle-type-drawer'])}\n                key={index}\n                onClick={() => onDrawerChange(item.id)}\n              >\n                <ToggleButton\n                  className={clsx(\n                    testutilStyles['drawers-trigger'],\n                    item.id === TOOLS_DRAWER_ID && testutilStyles['tools-toggle']\n                  )}\n                  iconName={item.trigger.iconName}\n                  iconSvg={item.trigger.iconSvg}\n                  badge={item.badge}\n                  ariaLabel={item.ariaLabels?.triggerButton}\n                  ariaExpanded={activeDrawerId === item.id}\n                  testId={`awsui-app-layout-trigger-${item.id}`}\n                />\n              </div>\n            ))}\n            {overflowItems.length > 0 && (\n              <div className={clsx(styles['mobile-toggle'], styles['mobile-toggle-type-drawer'])}>\n                <OverflowMenu\n                  ariaLabel={overflowMenuHasBadge ? ariaLabels?.drawersOverflowWithBadge : ariaLabels?.drawersOverflow}\n                  items={overflowItems}\n                  onItemClick={({ detail }) => onDrawerChange(detail.id)}\n                />\n              </div>\n            )}\n          </div>\n        </aside>\n      )}\n    </div>\n  );\n}\n"]}

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

@@ -1,13 +1,13 @@
 
     import './styles.scoped.css';
     export default {
-  "block-body-scroll": "awsui_block-body-scroll_19d8l_yhnta_103",
-  "mobile-bar": "awsui_mobile-bar_19d8l_yhnta_107",
-  "mobile-bar-breadcrumbs": "awsui_mobile-bar-breadcrumbs_19d8l_yhnta_120",
-  "mobile-toggle": "awsui_mobile-toggle_19d8l_yhnta_127",
-  "mobile-toggle-type-navigation": "awsui_mobile-toggle-type-navigation_19d8l_yhnta_136",
-  "mobile-toggle-type-tools": "awsui_mobile-toggle-type-tools_19d8l_yhnta_139",
-  "mobile-toggle-type-drawer": "awsui_mobile-toggle-type-drawer_19d8l_yhnta_139",
-  "drawers-container": "awsui_drawers-container_19d8l_yhnta_146"
+  "block-body-scroll": "awsui_block-body-scroll_19d8l_17q1h_101",
+  "mobile-bar": "awsui_mobile-bar_19d8l_17q1h_105",
+  "mobile-bar-breadcrumbs": "awsui_mobile-bar-breadcrumbs_19d8l_17q1h_118",
+  "mobile-toggle": "awsui_mobile-toggle_19d8l_17q1h_125",
+  "mobile-toggle-type-navigation": "awsui_mobile-toggle-type-navigation_19d8l_17q1h_134",
+  "mobile-toggle-type-tools": "awsui_mobile-toggle-type-tools_19d8l_17q1h_137",
+  "mobile-toggle-type-drawer": "awsui_mobile-toggle-type-drawer_19d8l_17q1h_137",
+  "drawers-container": "awsui_drawers-container_19d8l_17q1h_144"
 };
   

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

@@ -2,8 +2,6 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-/* stylelint-disable plugin/no-unsupported-browser-features */
-/* stylelint-enable plugin/no-unsupported-browser-features */
 /*
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
@@ -100,11 +98,11 @@ 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_block-body-scroll_19d8l_yhnta_103:not(#\9) {
+.awsui_block-body-scroll_19d8l_17q1h_101:not(#\9) {
   overflow: hidden;
 }
 
-.awsui_mobile-bar_19d8l_yhnta_107:not(#\9) {
+.awsui_mobile-bar_19d8l_17q1h_105:not(#\9) {
   position: sticky;
   display: flex;
   align-items: center;
@@ -117,14 +115,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   block-size: calc(2 * var(--space-m-kpg8id, 16px) + var(--space-scaled-xs-x91h81, 8px));
 }
 
-.awsui_mobile-bar-breadcrumbs_19d8l_yhnta_120:not(#\9) {
+.awsui_mobile-bar-breadcrumbs_19d8l_17q1h_118:not(#\9) {
   min-inline-size: 0;
   flex: 1;
   margin-inline-start: var(--space-m-kpg8id, 16px);
   margin-inline-end: var(--space-m-kpg8id, 16px);
 }
 
-.awsui_mobile-toggle_19d8l_yhnta_127:not(#\9) {
+.awsui_mobile-toggle_19d8l_17q1h_125:not(#\9) {
   box-sizing: border-box;
   cursor: pointer;
   z-index: 1;
@@ -133,17 +131,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: 40px;
   color: var(--color-text-interactive-default-dt26aj, #545b64);
 }
-.awsui_mobile-toggle-type-navigation_19d8l_yhnta_136:not(#\9) {
+.awsui_mobile-toggle-type-navigation_19d8l_17q1h_134:not(#\9) {
   border-inline-end: 1px solid var(--color-border-layout-py7xy0, #d5dbdb);
 }
-.awsui_mobile-toggle-type-tools_19d8l_yhnta_139:not(#\9), .awsui_mobile-toggle-type-drawer_19d8l_yhnta_139:not(#\9) {
+.awsui_mobile-toggle-type-tools_19d8l_17q1h_137:not(#\9), .awsui_mobile-toggle-type-drawer_19d8l_17q1h_137:not(#\9) {
   border-inline-start: 1px solid var(--color-border-layout-py7xy0, #d5dbdb);
 }
-.awsui_mobile-toggle_19d8l_yhnta_127:not(#\9):hover {
+.awsui_mobile-toggle_19d8l_17q1h_125:not(#\9):hover {
   background: var(--color-background-layout-panel-hover-58t7r5, #eaeded);
 }
 
-.awsui_drawers-container_19d8l_yhnta_146:not(#\9) {
+.awsui_drawers-container_19d8l_17q1h_144:not(#\9) {
   display: flex;
   align-items: stretch;
 }

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

@@ -2,13 +2,13 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "block-body-scroll": "awsui_block-body-scroll_19d8l_yhnta_103",
-  "mobile-bar": "awsui_mobile-bar_19d8l_yhnta_107",
-  "mobile-bar-breadcrumbs": "awsui_mobile-bar-breadcrumbs_19d8l_yhnta_120",
-  "mobile-toggle": "awsui_mobile-toggle_19d8l_yhnta_127",
-  "mobile-toggle-type-navigation": "awsui_mobile-toggle-type-navigation_19d8l_yhnta_136",
-  "mobile-toggle-type-tools": "awsui_mobile-toggle-type-tools_19d8l_yhnta_139",
-  "mobile-toggle-type-drawer": "awsui_mobile-toggle-type-drawer_19d8l_yhnta_139",
-  "drawers-container": "awsui_drawers-container_19d8l_yhnta_146"
+  "block-body-scroll": "awsui_block-body-scroll_19d8l_17q1h_101",
+  "mobile-bar": "awsui_mobile-bar_19d8l_17q1h_105",
+  "mobile-bar-breadcrumbs": "awsui_mobile-bar-breadcrumbs_19d8l_17q1h_118",
+  "mobile-toggle": "awsui_mobile-toggle_19d8l_17q1h_125",
+  "mobile-toggle-type-navigation": "awsui_mobile-toggle-type-navigation_19d8l_17q1h_134",
+  "mobile-toggle-type-tools": "awsui_mobile-toggle-type-tools_19d8l_17q1h_137",
+  "mobile-toggle-type-drawer": "awsui_mobile-toggle-type-drawer_19d8l_17q1h_137",
+  "drawers-container": "awsui_drawers-container_19d8l_17q1h_144"
 };
   

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

@@ -1,16 +1,16 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1uxbz_y9uj1_103",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_y9uj1_152",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_y9uj1_167",
-  "navigation": "awsui_navigation_1uxbz_y9uj1_182",
-  "tools": "awsui_tools_1uxbz_y9uj1_183",
-  "top-bar": "awsui_top-bar_1uxbz_y9uj1_206",
-  "notifications": "awsui_notifications_1uxbz_y9uj1_212",
-  "main-landmark": "awsui_main-landmark_1uxbz_y9uj1_219",
-  "main": "awsui_main_1uxbz_y9uj1_219",
-  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_y9uj1_228",
-  "content-header": "awsui_content-header_1uxbz_y9uj1_238"
+  "root": "awsui_root_1uxbz_1hq72_101",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_1hq72_150",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_1hq72_165",
+  "navigation": "awsui_navigation_1uxbz_1hq72_180",
+  "tools": "awsui_tools_1uxbz_1hq72_181",
+  "top-bar": "awsui_top-bar_1uxbz_1hq72_204",
+  "notifications": "awsui_notifications_1uxbz_1hq72_210",
+  "main-landmark": "awsui_main-landmark_1uxbz_1hq72_217",
+  "main": "awsui_main_1uxbz_1hq72_217",
+  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_1hq72_226",
+  "content-header": "awsui_content-header_1uxbz_1hq72_236"
 };
   

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

@@ -2,8 +2,6 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-/* stylelint-disable plugin/no-unsupported-browser-features */
-/* stylelint-enable plugin/no-unsupported-browser-features */
 /*
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
@@ -100,7 +98,7 @@ 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_1uxbz_y9uj1_103:not(#\9) {
+.awsui_root_1uxbz_1hq72_101:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -143,45 +141,45 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-template-rows: min-content min-content 1fr;
 }
 @media (min-width: 689px) {
-  .awsui_root_1uxbz_y9uj1_103:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101:not(#\9) {
     grid-template-areas: "navigation topBar       topBar        topBar    tools" "navigation .         notifications    .         tools" "navigation .             main         .         tools";
     grid-template-columns: min-content minmax(var(--space-layout-content-horizontal-sin989, 40px), 1fr) minmax(0, var(--awsui-max-content-width-7t5ed6)) minmax(var(--space-layout-content-horizontal-sin989, 40px), 1fr) min-content;
     grid-template-rows: min-content min-content 1fr min-content;
   }
 }
 @media (min-width: 689px) and (min-width: 1401px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-default_1uxbz_y9uj1_152:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-default_1uxbz_1hq72_150:not(#\9) {
     --awsui-max-content-width-7t5ed6: 1280px;
   }
 }
 @media (min-width: 689px) and (min-width: 1921px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-default_1uxbz_y9uj1_152:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-default_1uxbz_1hq72_150:not(#\9) {
     --awsui-max-content-width-7t5ed6: 1440px;
   }
 }
 @media (min-width: 689px) and (min-width: 2541px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-default_1uxbz_y9uj1_152:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-default_1uxbz_1hq72_150:not(#\9) {
     --awsui-max-content-width-7t5ed6: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 1401px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-dashboard_1uxbz_y9uj1_167:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-dashboard_1uxbz_1hq72_165:not(#\9) {
     --awsui-max-content-width-7t5ed6: 1280px;
   }
 }
 @media (min-width: 689px) and (min-width: 1921px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-dashboard_1uxbz_y9uj1_167:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-dashboard_1uxbz_1hq72_165:not(#\9) {
     --awsui-max-content-width-7t5ed6: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 2541px) {
-  .awsui_root_1uxbz_y9uj1_103.awsui_has-adaptive-widths-dashboard_1uxbz_y9uj1_167:not(#\9) {
+  .awsui_root_1uxbz_1hq72_101.awsui_has-adaptive-widths-dashboard_1uxbz_1hq72_165:not(#\9) {
     --awsui-max-content-width-7t5ed6: 2160px;
   }
 }
 
-.awsui_navigation_1uxbz_y9uj1_182:not(#\9),
-.awsui_tools_1uxbz_y9uj1_183:not(#\9) {
+.awsui_navigation_1uxbz_1hq72_180:not(#\9),
+.awsui_tools_1uxbz_1hq72_181:not(#\9) {
   grid-row: 1/-1;
   grid-column: 1/-1;
   background: var(--color-background-container-content-il2pe5, #ffffff);
@@ -189,7 +187,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_navigation_1uxbz_y9uj1_182:not(#\9) {
+  .awsui_navigation_1uxbz_1hq72_180:not(#\9) {
     grid-area: navigation;
     inline-size: var(--awsui-navigation-width-7t5ed6);
     border-inline-end: 1px solid var(--color-border-divider-panel-side-btgups, transparent);
@@ -197,45 +195,45 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_tools_1uxbz_y9uj1_183:not(#\9) {
+  .awsui_tools_1uxbz_1hq72_181:not(#\9) {
     grid-area: tools;
     inline-size: var(--awsui-tools-width-7t5ed6);
     border-inline-start: 1px solid var(--color-border-divider-panel-side-btgups, transparent);
   }
 }
 
-.awsui_top-bar_1uxbz_y9uj1_206:not(#\9) {
+.awsui_top-bar_1uxbz_1hq72_204:not(#\9) {
   grid-area: topBar;
   block-size: 48px;
   border-block-end: 1px solid var(--color-border-divider-panel-bottom-sc2k0v, rgba(0, 28, 36, 0.15));
 }
 
-.awsui_notifications_1uxbz_y9uj1_212:not(#\9) {
+.awsui_notifications_1uxbz_1hq72_210:not(#\9) {
   grid-area: notifications;
 }
-.awsui_notifications_1uxbz_y9uj1_212:not(#\9):not(:empty) {
+.awsui_notifications_1uxbz_1hq72_210:not(#\9):not(:empty) {
   padding-block-start: var(--space-scaled-xs-x91h81, 8px);
 }
 
-.awsui_main-landmark_1uxbz_y9uj1_219:not(#\9) {
+.awsui_main-landmark_1uxbz_1hq72_217:not(#\9) {
   display: contents;
 }
 
-.awsui_main_1uxbz_y9uj1_219:not(#\9) {
+.awsui_main_1uxbz_1hq72_217:not(#\9) {
   grid-area: main;
   margin-block-start: var(--space-scaled-s-9q8n2q, 12px);
   margin-block-end: var(--space-layout-content-bottom-ve4osc, 20px);
 }
-.awsui_main-disable-paddings_1uxbz_y9uj1_228:not(#\9) {
+.awsui_main-disable-paddings_1uxbz_1hq72_226:not(#\9) {
   grid-column: 1/-1;
   margin-block: 0;
 }
 @media (min-width: 689px) {
-  .awsui_main-disable-paddings_1uxbz_y9uj1_228:not(#\9) {
+  .awsui_main-disable-paddings_1uxbz_1hq72_226:not(#\9) {
     grid-column: 2/span 3;
   }
 }
 
-.awsui_content-header_1uxbz_y9uj1_238:not(#\9) {
+.awsui_content-header_1uxbz_1hq72_236:not(#\9) {
   margin-block-end: var(--space-content-header-padding-bottom-d3iv03, 16px);
 }

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

@@ -2,16 +2,16 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1uxbz_y9uj1_103",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_y9uj1_152",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_y9uj1_167",
-  "navigation": "awsui_navigation_1uxbz_y9uj1_182",
-  "tools": "awsui_tools_1uxbz_y9uj1_183",
-  "top-bar": "awsui_top-bar_1uxbz_y9uj1_206",
-  "notifications": "awsui_notifications_1uxbz_y9uj1_212",
-  "main-landmark": "awsui_main-landmark_1uxbz_y9uj1_219",
-  "main": "awsui_main_1uxbz_y9uj1_219",
-  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_y9uj1_228",
-  "content-header": "awsui_content-header_1uxbz_y9uj1_238"
+  "root": "awsui_root_1uxbz_1hq72_101",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_1hq72_150",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_1hq72_165",
+  "navigation": "awsui_navigation_1uxbz_1hq72_180",
+  "tools": "awsui_tools_1uxbz_1hq72_181",
+  "top-bar": "awsui_top-bar_1uxbz_1hq72_204",
+  "notifications": "awsui_notifications_1uxbz_1hq72_210",
+  "main-landmark": "awsui_main-landmark_1uxbz_1hq72_217",
+  "main": "awsui_main_1uxbz_1hq72_217",
+  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_1hq72_226",
+  "content-header": "awsui_content-header_1uxbz_1hq72_236"
 };
   

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

@@ -1,7 +1,7 @@
 
     import './styles.scoped.css';
     export default {
-  "drawer-displayed": "awsui_drawer-displayed_1lh3u_17q8n_103",
-  "drawer-content": "awsui_drawer-content_1lh3u_17q8n_107"
+  "drawer-displayed": "awsui_drawer-displayed_1lh3u_mzbvz_101",
+  "drawer-content": "awsui_drawer-content_1lh3u_mzbvz_105"
 };
   

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

@@ -2,8 +2,6 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-/* stylelint-disable plugin/no-unsupported-browser-features */
-/* stylelint-enable plugin/no-unsupported-browser-features */
 /*
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
@@ -100,11 +98,11 @@ 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_drawer-displayed_1lh3u_17q8n_103:not(#\9) {
+.awsui_drawer-displayed_1lh3u_mzbvz_101:not(#\9) {
   min-inline-size: 40px;
 }
 
-.awsui_drawer-content_1lh3u_17q8n_107:not(#\9) {
+.awsui_drawer-content_1lh3u_mzbvz_105:not(#\9) {
   position: fixed;
   z-index: 830;
 }

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

@@ -2,7 +2,7 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "drawer-displayed": "awsui_drawer-displayed_1lh3u_17q8n_103",
-  "drawer-content": "awsui_drawer-content_1lh3u_17q8n_107"
+  "drawer-displayed": "awsui_drawer-displayed_1lh3u_mzbvz_101",
+  "drawer-content": "awsui_drawer-content_1lh3u_mzbvz_105"
 };
   

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

@@ -1,21 +1,21 @@
 
     import './styles.scoped.css';
     export default {
-  "resize-active": "awsui_resize-active_lm6vo_ttnir_104",
-  "resize-side": "awsui_resize-side_lm6vo_ttnir_110",
-  "resize-bottom": "awsui_resize-bottom_lm6vo_ttnir_113",
-  "with-motion": "awsui_with-motion_lm6vo_ttnir_118",
-  "root": "awsui_root_lm6vo_ttnir_133",
-  "root-no-scroll": "awsui_root-no-scroll_lm6vo_ttnir_140",
-  "layout": "awsui_layout_lm6vo_ttnir_145",
-  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_ttnir_151",
-  "layout-main": "awsui_layout-main_lm6vo_ttnir_155",
-  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_ttnir_161",
-  "unfocusable": "awsui_unfocusable_lm6vo_ttnir_166",
-  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_ttnir_170",
-  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_ttnir_175",
-  "content-wrapper": "awsui_content-wrapper_lm6vo_ttnir_179",
-  "content-overlapped": "awsui_content-overlapped_lm6vo_ttnir_183",
-  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_ttnir_187"
+  "resize-active": "awsui_resize-active_lm6vo_1sq3f_102",
+  "resize-side": "awsui_resize-side_lm6vo_1sq3f_108",
+  "resize-bottom": "awsui_resize-bottom_lm6vo_1sq3f_111",
+  "with-motion": "awsui_with-motion_lm6vo_1sq3f_116",
+  "root": "awsui_root_lm6vo_1sq3f_131",
+  "root-no-scroll": "awsui_root-no-scroll_lm6vo_1sq3f_138",
+  "layout": "awsui_layout_lm6vo_1sq3f_143",
+  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_1sq3f_149",
+  "layout-main": "awsui_layout-main_lm6vo_1sq3f_153",
+  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_1sq3f_159",
+  "unfocusable": "awsui_unfocusable_lm6vo_1sq3f_164",
+  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_1sq3f_168",
+  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_1sq3f_173",
+  "content-wrapper": "awsui_content-wrapper_lm6vo_1sq3f_177",
+  "content-overlapped": "awsui_content-overlapped_lm6vo_1sq3f_181",
+  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_1sq3f_185"
 };
   

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

@@ -2,8 +2,6 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-/* stylelint-disable plugin/no-unsupported-browser-features */
-/* stylelint-enable plugin/no-unsupported-browser-features */
 /*
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
@@ -101,90 +99,90 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  SPDX-License-Identifier: Apache-2.0
 */
 /* stylelint-disable selector-combinator-disallowed-list, selector-max-type, selector-max-universal */
-.awsui_resize-active_lm6vo_ttnir_104 *:not(#\9) {
+.awsui_resize-active_lm6vo_1sq3f_102 *:not(#\9) {
   -webkit-user-select: none;
           user-select: none;
 }
-.awsui_resize-active_lm6vo_ttnir_104 iframe:not(#\9) {
+.awsui_resize-active_lm6vo_1sq3f_102 iframe:not(#\9) {
   pointer-events: none;
 }
-.awsui_resize-side_lm6vo_ttnir_110 *:not(#\9) {
+.awsui_resize-side_lm6vo_1sq3f_108 *:not(#\9) {
   cursor: ew-resize;
 }
-.awsui_resize-bottom_lm6vo_ttnir_113 *:not(#\9) {
+.awsui_resize-bottom_lm6vo_1sq3f_111 *:not(#\9) {
   cursor: ns-resize;
 }
 
 /* stylelint-enable selector-combinator-disallowed-list, selector-max-type, selector-max-universal */
-.awsui_with-motion_lm6vo_ttnir_118:not(#\9) {
+.awsui_with-motion_lm6vo_1sq3f_116:not(#\9) {
   transition: var(--motion-duration-refresh-only-fast-y7h37k, 115ms);
   transition-property: border-color, opacity, width;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_with-motion_lm6vo_ttnir_118:not(#\9) {
+  .awsui_with-motion_lm6vo_1sq3f_116:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_with-motion_lm6vo_ttnir_118:not(#\9), .awsui-mode-entering .awsui_with-motion_lm6vo_ttnir_118:not(#\9) {
+.awsui-motion-disabled .awsui_with-motion_lm6vo_1sq3f_116:not(#\9), .awsui-mode-entering .awsui_with-motion_lm6vo_1sq3f_116:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_lm6vo_ttnir_133:not(#\9) {
+.awsui_root_lm6vo_1sq3f_131:not(#\9) {
   display: flex;
   flex-direction: column;
   position: relative;
   color: var(--color-text-body-default-ffdwgg, #16191f);
 }
 
-.awsui_root-no-scroll_lm6vo_ttnir_140:not(#\9) {
+.awsui_root-no-scroll_lm6vo_1sq3f_138:not(#\9) {
   position: relative;
   z-index: 1;
 }
 
-.awsui_layout_lm6vo_ttnir_145:not(#\9) {
+.awsui_layout_lm6vo_1sq3f_143:not(#\9) {
   flex: 1 1 auto;
   display: flex;
   align-items: stretch;
   background-color: var(--color-background-layout-main-td853a, #f2f3f3);
 }
-.awsui_layout-no-scroll_lm6vo_ttnir_151:not(#\9) {
+.awsui_layout-no-scroll_lm6vo_1sq3f_149:not(#\9) {
   overflow: hidden;
 }
 
-.awsui_layout-main_lm6vo_ttnir_155:not(#\9) {
+.awsui_layout-main_lm6vo_1sq3f_153:not(#\9) {
   flex: 1;
   min-inline-size: 0;
   background-color: var(--color-background-layout-main-td853a, #f2f3f3);
   position: relative;
 }
-.awsui_layout-main-scrollable_lm6vo_ttnir_161:not(#\9) {
+.awsui_layout-main-scrollable_lm6vo_1sq3f_159:not(#\9) {
   overflow: auto;
 }
 
 /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
-.awsui_unfocusable_lm6vo_ttnir_166 *:not(#\9) {
+.awsui_unfocusable_lm6vo_1sq3f_164 *:not(#\9) {
   visibility: hidden;
 }
 
-.awsui_breadcrumbs-desktop_lm6vo_ttnir_170:not(#\9) {
+.awsui_breadcrumbs-desktop_lm6vo_1sq3f_168:not(#\9) {
   padding-block-start: var(--space-scaled-m-er48cl, 16px);
   padding-block-end: var(--space-scaled-s-9q8n2q, 12px);
 }
 
-.awsui_content-header-wrapper_lm6vo_ttnir_175:not(#\9) {
+.awsui_content-header-wrapper_lm6vo_1sq3f_173:not(#\9) {
   padding-block-end: var(--space-content-header-padding-bottom-d3iv03, 16px);
 }
 
-.awsui_content-wrapper_lm6vo_ttnir_179:not(#\9) {
+.awsui_content-wrapper_lm6vo_1sq3f_177:not(#\9) {
   padding-block-end: var(--space-layout-content-bottom-ve4osc, 20px);
 }
 
-.awsui_content-overlapped_lm6vo_ttnir_183:not(#\9) {
+.awsui_content-overlapped_lm6vo_1sq3f_181:not(#\9) {
   margin-block-start: calc(-1 * var(--space-dark-header-overlap-distance-f6oo6u, 0px));
 }
 
-.awsui_content-extra-top-padding_lm6vo_ttnir_187:not(#\9) {
+.awsui_content-extra-top-padding_lm6vo_1sq3f_185:not(#\9) {
   padding-block-start: var(--space-scaled-m-er48cl, 16px);
 }

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

@@ -2,21 +2,21 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "resize-active": "awsui_resize-active_lm6vo_ttnir_104",
-  "resize-side": "awsui_resize-side_lm6vo_ttnir_110",
-  "resize-bottom": "awsui_resize-bottom_lm6vo_ttnir_113",
-  "with-motion": "awsui_with-motion_lm6vo_ttnir_118",
-  "root": "awsui_root_lm6vo_ttnir_133",
-  "root-no-scroll": "awsui_root-no-scroll_lm6vo_ttnir_140",
-  "layout": "awsui_layout_lm6vo_ttnir_145",
-  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_ttnir_151",
-  "layout-main": "awsui_layout-main_lm6vo_ttnir_155",
-  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_ttnir_161",
-  "unfocusable": "awsui_unfocusable_lm6vo_ttnir_166",
-  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_ttnir_170",
-  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_ttnir_175",
-  "content-wrapper": "awsui_content-wrapper_lm6vo_ttnir_179",
-  "content-overlapped": "awsui_content-overlapped_lm6vo_ttnir_183",
-  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_ttnir_187"
+  "resize-active": "awsui_resize-active_lm6vo_1sq3f_102",
+  "resize-side": "awsui_resize-side_lm6vo_1sq3f_108",
+  "resize-bottom": "awsui_resize-bottom_lm6vo_1sq3f_111",
+  "with-motion": "awsui_with-motion_lm6vo_1sq3f_116",
+  "root": "awsui_root_lm6vo_1sq3f_131",
+  "root-no-scroll": "awsui_root-no-scroll_lm6vo_1sq3f_138",
+  "layout": "awsui_layout_lm6vo_1sq3f_143",
+  "layout-no-scroll": "awsui_layout-no-scroll_lm6vo_1sq3f_149",
+  "layout-main": "awsui_layout-main_lm6vo_1sq3f_153",
+  "layout-main-scrollable": "awsui_layout-main-scrollable_lm6vo_1sq3f_159",
+  "unfocusable": "awsui_unfocusable_lm6vo_1sq3f_164",
+  "breadcrumbs-desktop": "awsui_breadcrumbs-desktop_lm6vo_1sq3f_168",
+  "content-header-wrapper": "awsui_content-header-wrapper_lm6vo_1sq3f_173",
+  "content-wrapper": "awsui_content-wrapper_lm6vo_1sq3f_177",
+  "content-overlapped": "awsui_content-overlapped_lm6vo_1sq3f_181",
+  "content-extra-top-padding": "awsui_content-extra-top-padding_lm6vo_1sq3f_185"
 };
   

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

@@ -1,7 +1,7 @@
 
     import './styles.scoped.css';
     export default {
-  "toggle-button": "awsui_toggle-button_16w0h_5k5pi_99",
-  "close-button": "awsui_close-button_16w0h_5k5pi_134"
+  "toggle-button": "awsui_toggle-button_16w0h_sir14_97",
+  "close-button": "awsui_close-button_16w0h_sir14_132"
 };