npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.839 → 3.0.841 - Mend

@cloudscape-design/components-themeable 3.0.839 → 3.0.841

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (243) hide show

package/lib/internal/manifest.json CHANGED Viewed

@@ -1,3 +1,3 @@
 {
-  "commit": "4e0727270315277c1d40bd8976c05dee29343840"
+  "commit": "31cd27dc010abe8a73286baf449f499cc7d46360"
 }

package/lib/internal/scss/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.scss ADDED Viewed

@@ -0,0 +1,9 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+// backward compatibility before this commit: 7a4b7b3e3b1d50830383805a8f4ab6cd93c9701f
+.breadcrumbs-own:not(:empty) + .breadcrumbs-discovered {
+  display: none;
+}

package/lib/internal/scss/app-layout/visual-refresh-toolbar/toolbar/styles.scss CHANGED Viewed

@@ -100,11 +100,6 @@
   }
 }
-// backward compatibility before this commit: 7a4b7b3e3b1d50830383805a8f4ab6cd93c9701f
-.breadcrumbs-own:not(:empty) + .breadcrumbs-discovered {
-  display: none;
-}
 .block-body-scroll {
   overflow: hidden;
 }

package/lib/internal/scss/breadcrumb-group/item/styles.scss CHANGED Viewed

@@ -49,7 +49,3 @@
     }
   }
 }
-.text-hidden {
-  display: none;
-}

package/lib/internal/scss/breadcrumb-group/styles.scss CHANGED Viewed

@@ -60,3 +60,7 @@
     }
   }
 }
+.breadcrumbs-skeleton {
+  display: none;
+}

package/lib/internal/scss/{internal/components/file-dropzone → file-dropzone}/styles.scss RENAMED Viewed

@@ -3,31 +3,34 @@
  SPDX-License-Identifier: Apache-2.0
 */
-@use '../../styles/tokens' as awsui;
-@use '../../styles' as styles;
+@use '../internal/styles/tokens' as awsui;
+@use '../internal/styles' as styles;
 .root {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: awsui.$space-static-xxs;
   padding-block: awsui.$space-static-l;
   padding-inline: awsui.$space-static-l;
   border-start-start-radius: awsui.$border-radius-dropzone;
   border-start-end-radius: awsui.$border-radius-dropzone;
   border-end-start-radius: awsui.$border-radius-dropzone;
   border-end-end-radius: awsui.$border-radius-dropzone;
-  color: awsui.$color-dropzone-text-active;
-  background-color: awsui.$color-dropzone-background-active;
-  font-weight: styles.$font-weight-bold;
+  color: awsui.$color-dropzone-text-default;
+  background-color: awsui.$color-dropzone-background-default;
+  border-color: awsui.$color-dropzone-border-default;
+  border-block: 1px dashed awsui.$color-dropzone-border-default;
+  border-inline: 1px dashed awsui.$color-dropzone-border-default;
   &.hovered {
     color: awsui.$color-dropzone-text-hover;
     background-color: awsui.$color-dropzone-background-hover;
+    border-block: 1px dashed awsui.$color-dropzone-border-hover;
+    border-inline: 1px dashed awsui.$color-dropzone-border-hover;
   }
 }
 .content {
-  /* used in test-utils */
+  display: flex;
+  flex-direction: column;
+  gap: awsui.$space-static-xxs;
+  align-items: center;
+  justify-content: center;
 }

package/lib/internal/scss/{internal/components/file-input → file-input}/styles.scss RENAMED Viewed

@@ -2,8 +2,8 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-@use '../../styles/tokens' as awsui;
-@use '../../styles' as styles;
+@use '../internal/styles/tokens' as awsui;
+@use '../internal/styles' as styles;
 @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
 .root,

package/lib/internal/scss/{internal/components/file-token-group → file-token-group}/constants.scss RENAMED Viewed

@@ -3,7 +3,7 @@
  SPDX-License-Identifier: Apache-2.0
 */
-@use '../../styles/tokens' as awsui;
+@use '../internal/styles/tokens' as awsui;
 $image-size: 48px;
 $file-token-height: 68px;

package/lib/internal/scss/{internal/components/file-token-group → file-token-group}/styles.scss RENAMED Viewed

@@ -3,10 +3,10 @@
  SPDX-License-Identifier: Apache-2.0
 */
-@use '../../styles/tokens' as awsui;
-@use '../../styles' as styles;
+@use '../internal/styles/tokens' as awsui;
+@use '../internal/styles' as styles;
 @use './constants' as constants;
-@use '../../../token-group/mixins.scss' as mixins;
+@use '../token-group/mixins.scss' as mixins;
 @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
 @mixin token-box-validation {

package/lib/internal/scss/internal/components/token-list/styles.scss CHANGED Viewed

@@ -5,7 +5,7 @@
 @use '../../styles/tokens' as awsui;
 @use '../../styles' as styles;
-@use '../../../internal/components/file-token-group/constants' as constants;
+@use '../../../file-token-group/constants' as constants;
 @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
 .root {

package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/navigation/index.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;~~AAMnD~~,UAAU,sCAAsC;IAC9C,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAED,wBAAgB,iCAAiC,CAAC,EAAE,kBAAkB,EAAE,EAAE,sCAAsC,eA4D/G;AAED,eAAO,MAAM,mCAAmC,~~6GAA+D~~,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/navigation/index.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,UAAU,sCAAsC;IAC9C,kBAAkB,EAAE,kBAAkB,CAAC;CACxC;AAED,wBAAgB,iCAAiC,CAAC,EAAE,kBAAkB,EAAE,EAAE,sCAAsC,eA4D/G;AAED,eAAO,MAAM,mCAAmC,6GAG/C,CAAC"}

package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { findUpUntil } from '@cloudscape-design/component-toolkit/dom';
 import { InternalButton } from '../../../button/internal';
 import { createWidgetizedComponent } from '../../../internal/widgets';
 import { getDrawerStyles } from '../compute-layout';
+import { NotificationsSlot } from '../skeleton/slot-wrappers';
 import sharedStyles from '../../resize/styles.css.js';
 import testutilStyles from '../../test-classes/styles.css.js';
 import styles from './styles.css.js';
@@ -32,5 +33,5 @@ export function AppLayoutNavigationImplementation({ appLayoutInternals }) {
                 React.createElement(InternalButton, { ariaLabel: (_b = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.navigationClose) !== null && _b !== void 0 ? _b : undefined, iconName: isMobile ? 'close' : 'angle-left', onClick: () => onNavigationToggle(false), variant: "icon", formAction: "none", className: testutilStyles['navigation-close'], ref: navigationFocusControl.refs.close })),
             navigation)));
 }
-export const createWidgetizedAppLayoutNavigation = createWidgetizedComponent(AppLayoutNavigationImplementation);
+export const createWidgetizedAppLayoutNavigation = createWidgetizedComponent(AppLayoutNavigationImplementation, NotificationsSlot);
 //# sourceMappingURL=index.js.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/navigation/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAEvE,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;~~AAGpD~~,OAAO,YAAY,MAAM,4BAA4B,CAAC;AACtD,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAMrC,MAAM,UAAU,iCAAiC,CAAC,EAAE,kBAAkB,EAA0C;;IAC9G,MAAM,EACJ,UAAU,EACV,kBAAkB,EAClB,QAAQ,EACR,cAAc,EACd,UAAU,EACV,sBAAsB,EACtB,SAAS,EACT,eAAe,GAChB,GAAG,kBAAkB,CAAC;IAEvB,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEhG,0EAA0E;IAC1E,MAAM,iBAAiB,GAAG,CAAC,KAAuB,EAAE,EAAE;QACpD,MAAM,OAAO,GAAG,WAAW,CACzB,KAAK,CAAC,MAAqB,EAC3B,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,KAAK,GAAG,IAAI,CAAC,CAAE,IAA0B,CAAC,IAAI,CACnE,CAAC;QACF,IAAI,OAAO,IAAI,QAAQ,EAAE;YACvB,kBAAkB,CAAC,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC,CAAC;IAEF,OAAO,CACL,2CACc,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,mCAAI,SAAS,EAC/C,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,EACjB;YACE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,cAAc;YAC9C,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,cAAc;SACnD,EACD,cAAc,CAAC,UAAU,EACzB,YAAY,CAAC,wBAAwB,CAAC,CACvC,iBACY,CAAC,cAAc,EAC5B,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE;YACL,SAAS,EAAE,YAAY;YACvB,eAAe,EAAE,eAAe;SACjC;QAED,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC;YAC3E,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC;gBAC7C,oBAAC,cAAc,IACb,SAAS,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,eAAe,mCAAI,SAAS,EACnD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,EAC3C,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,EACxC,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,cAAc,CAAC,kBAAkB,CAAC,EAC7C,GAAG,EAAE,sBAAsB,CAAC,IAAI,CAAC,KAAK,GACtC,CACE;YACL,UAAU,CACP,CACF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,mCAAmC,GAAG,yBAAyB,~~CAAC~~,iCAAiC,~~CAAC~~,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';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\n\nimport { InternalButton } from '../../../button/internal';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { getDrawerStyles } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutNavigationImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n}\n\nexport function AppLayoutNavigationImplementation({ appLayoutInternals }: AppLayoutNavigationImplementationProps) {\n const {\n ariaLabels,\n onNavigationToggle,\n isMobile,\n navigationOpen,\n navigation,\n navigationFocusControl,\n placement,\n verticalOffsets,\n } = appLayoutInternals;\n\n const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);\n\n // Close the Navigation drawer on mobile when a user clicks a link inside.\n const onNavigationClick = (event: React.MouseEvent) => {\n const hasLink = findUpUntil(\n event.target as HTMLElement,\n node => node.tagName === 'A' && !!(node as HTMLAnchorElement).href\n );\n if (hasLink && isMobile) {\n onNavigationToggle(false);\n }\n };\n\n return (\n <nav\n aria-label={ariaLabels?.navigation ?? undefined}\n className={clsx(\n styles.navigation,\n {\n [styles['is-navigation-open']]: navigationOpen,\n [testutilStyles['drawer-closed']]: !navigationOpen,\n },\n testutilStyles.navigation,\n sharedStyles['with-motion-horizontal']\n )}\n aria-hidden={!navigationOpen}\n onClick={onNavigationClick}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: drawerTopOffset,\n }}\n >\n <div className={clsx(styles['content-container'], styles['animated-content'])}>\n <div className={clsx(styles['hide-navigation'])}>\n <InternalButton\n ariaLabel={ariaLabels?.navigationClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-left'}\n onClick={() => onNavigationToggle(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['navigation-close']}\n ref={navigationFocusControl.refs.close}\n />\n </div>\n {navigation}\n </div>\n </nav>\n );\n}\n\nexport const createWidgetizedAppLayoutNavigation = createWidgetizedComponent(AppLayoutNavigationImplementation);\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/navigation/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,MAAM,0CAA0C,CAAC;AAEvE,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,YAAY,MAAM,4BAA4B,CAAC;AACtD,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAMrC,MAAM,UAAU,iCAAiC,CAAC,EAAE,kBAAkB,EAA0C;;IAC9G,MAAM,EACJ,UAAU,EACV,kBAAkB,EAClB,QAAQ,EACR,cAAc,EACd,UAAU,EACV,sBAAsB,EACtB,SAAS,EACT,eAAe,GAChB,GAAG,kBAAkB,CAAC;IAEvB,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEhG,0EAA0E;IAC1E,MAAM,iBAAiB,GAAG,CAAC,KAAuB,EAAE,EAAE;QACpD,MAAM,OAAO,GAAG,WAAW,CACzB,KAAK,CAAC,MAAqB,EAC3B,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,KAAK,GAAG,IAAI,CAAC,CAAE,IAA0B,CAAC,IAAI,CACnE,CAAC;QACF,IAAI,OAAO,IAAI,QAAQ,EAAE;YACvB,kBAAkB,CAAC,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC,CAAC;IAEF,OAAO,CACL,2CACc,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,UAAU,mCAAI,SAAS,EAC/C,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,EACjB;YACE,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,cAAc;YAC9C,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,cAAc;SACnD,EACD,cAAc,CAAC,UAAU,EACzB,YAAY,CAAC,wBAAwB,CAAC,CACvC,iBACY,CAAC,cAAc,EAC5B,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE;YACL,SAAS,EAAE,YAAY;YACvB,eAAe,EAAE,eAAe;SACjC;QAED,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC;YAC3E,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC;gBAC7C,oBAAC,cAAc,IACb,SAAS,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,eAAe,mCAAI,SAAS,EACnD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,EAC3C,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,EACxC,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,cAAc,CAAC,kBAAkB,CAAC,EAC7C,GAAG,EAAE,sBAAsB,CAAC,IAAI,CAAC,KAAK,GACtC,CACE;YACL,UAAU,CACP,CACF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,mCAAmC,GAAG,yBAAyB,CAC1E,iCAAiC,EACjC,iBAAiB,CAClB,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';\n\nimport { findUpUntil } from '@cloudscape-design/component-toolkit/dom';\n\nimport { InternalButton } from '../../../button/internal';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { getDrawerStyles } from '../compute-layout';\nimport { AppLayoutInternals } from '../interfaces';\nimport { NotificationsSlot } from '../skeleton/slot-wrappers';\n\nimport sharedStyles from '../../resize/styles.css.js';\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\ninterface AppLayoutNavigationImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n}\n\nexport function AppLayoutNavigationImplementation({ appLayoutInternals }: AppLayoutNavigationImplementationProps) {\n const {\n ariaLabels,\n onNavigationToggle,\n isMobile,\n navigationOpen,\n navigation,\n navigationFocusControl,\n placement,\n verticalOffsets,\n } = appLayoutInternals;\n\n const { drawerTopOffset, drawerHeight } = getDrawerStyles(verticalOffsets, isMobile, placement);\n\n // Close the Navigation drawer on mobile when a user clicks a link inside.\n const onNavigationClick = (event: React.MouseEvent) => {\n const hasLink = findUpUntil(\n event.target as HTMLElement,\n node => node.tagName === 'A' && !!(node as HTMLAnchorElement).href\n );\n if (hasLink && isMobile) {\n onNavigationToggle(false);\n }\n };\n\n return (\n <nav\n aria-label={ariaLabels?.navigation ?? undefined}\n className={clsx(\n styles.navigation,\n {\n [styles['is-navigation-open']]: navigationOpen,\n [testutilStyles['drawer-closed']]: !navigationOpen,\n },\n testutilStyles.navigation,\n sharedStyles['with-motion-horizontal']\n )}\n aria-hidden={!navigationOpen}\n onClick={onNavigationClick}\n style={{\n blockSize: drawerHeight,\n insetBlockStart: drawerTopOffset,\n }}\n >\n <div className={clsx(styles['content-container'], styles['animated-content'])}>\n <div className={clsx(styles['hide-navigation'])}>\n <InternalButton\n ariaLabel={ariaLabels?.navigationClose ?? undefined}\n iconName={isMobile ? 'close' : 'angle-left'}\n onClick={() => onNavigationToggle(false)}\n variant=\"icon\"\n formAction=\"none\"\n className={testutilStyles['navigation-close']}\n ref={navigationFocusControl.refs.close}\n />\n </div>\n {navigation}\n </div>\n </nav>\n );\n}\n\nexport const createWidgetizedAppLayoutNavigation = createWidgetizedComponent(\n AppLayoutNavigationImplementation,\n NotificationsSlot\n);\n"]}

package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.d.ts CHANGED Viewed

@@ -1,10 +1,9 @@
 import React from 'react';
 import { AppLayoutInternals } from '../interfaces';
-interface AppLayoutNotificationsImplementationProps {
+export interface AppLayoutNotificationsImplementationProps {
     appLayoutInternals: AppLayoutInternals;
     children: React.ReactNode;
 }
 export declare function AppLayoutNotificationsImplementation({ appLayoutInternals, children, }: AppLayoutNotificationsImplementationProps): JSX.Element;
 export declare const createWidgetizedAppLayoutNotifications: (Loader?: typeof AppLayoutNotificationsImplementation | undefined) => typeof AppLayoutNotificationsImplementation;
-export {};
 //# sourceMappingURL=index.d.ts.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/notifications/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAQjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;~~AAMnD~~,~~UAAU~~,yCAAyC;~~IACjD~~,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oCAAoC,CAAC,EACnD,kBAAkB,EAClB,QAAQ,GACT,EAAE,yCAAyC,eAmC3C;AAED,eAAO,MAAM,sCAAsC,~~mHAAkE~~,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/notifications/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAQjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,WAAW,yCAAyC;IACxD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oCAAoC,CAAC,EACnD,kBAAkB,EAClB,QAAQ,GACT,EAAE,yCAAyC,eAmC3C;AAED,eAAO,MAAM,sCAAsC,mHAGlD,CAAC"}

package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { useContainerQuery } from '@cloudscape-design/component-toolkit';
 import { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';
 import { highContrastHeaderClassName } from '../../../internal/utils/content-header-utils';
 import { createWidgetizedComponent } from '../../../internal/widgets';
+import { NotificationsSkeleton } from '../skeleton/slot-skeletons';
 import { NotificationsSlot } from '../skeleton/slot-wrappers';
 import testutilStyles from '../../test-classes/styles.css.js';
 import styles from './styles.css.js';
@@ -26,5 +27,5 @@ export function AppLayoutNotificationsImplementation({ appLayoutInternals, child
         } },
         React.createElement("div", { ref: contentRef, className: testutilStyles.notifications, role: "region", "aria-label": ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.notifications }, children)));
 }
-export const createWidgetizedAppLayoutNotifications = createWidgetizedComponent(AppLayoutNotificationsImplementation);
+export const createWidgetizedAppLayoutNotifications = createWidgetizedComponent(AppLayoutNotificationsImplementation, NotificationsSkeleton);
 //# sourceMappingURL=index.js.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/notifications/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/notifications/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,2BAA2B,EAAE,MAAM,8CAA8C,CAAC;AAC3F,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAEtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,UAAU,oCAAoC,CAAC,EACnD,kBAAkB,EAClB,QAAQ,GACkC;IAC1C,MAAM,EAAE,UAAU,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,eAAe,EAAE,GAAG,kBAAkB,CAAC;IACxG,MAAM,CAAC,uBAAuB,EAAE,UAAU,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAClG,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,iBAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC;IACnF,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,sBAAsB,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,CAAC;QACF,sBAAsB;QACtB,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,oBAAC,iBAAiB,IAChB,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,IAAI,CACb,kBAAkB,CAAC,aAAa,KAAK,eAAe,IAAI,2BAA2B,EACnF,mBAAmB,IAAI,MAAM,CAAC,sBAAsB,CAAC,EACrD,uBAAuB,IAAI,MAAM,CAAC,2BAA2B,CAAC,EAC9D,kBAAkB,CAAC,aAAa,KAAK,eAAe,IAAI,MAAM,CAAC,sCAAsC,CAAC,CACvG,EACD,KAAK,EAAE;YACL,eAAe,EAAE,mBAAmB,CAAC,CAAC,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;SACjF;QAED,6BACE,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,cAAc,CAAC,aAAa,EACvC,IAAI,EAAC,QAAQ,gBACD,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,aAAa,IAEpC,QAAQ,CACL,CACY,CACrB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sCAAsC,GAAG,yBAAyB,~~CAAC~~,oCAAoC,~~CAAC~~,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { highContrastHeaderClassName } from '../../../internal/utils/content-header-utils';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { AppLayoutInternals } from '../interfaces';\nimport { NotificationsSlot } from '../skeleton/slot-wrappers';\n\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\~~ninterface~~ AppLayoutNotificationsImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n children: React.ReactNode;\n}\n\nexport function AppLayoutNotificationsImplementation({\n appLayoutInternals,\n children,\n}: AppLayoutNotificationsImplementationProps) {\n const { ariaLabels, stickyNotifications, setNotificationsHeight, verticalOffsets } = appLayoutInternals;\n const [hasNotificationsContent, contentRef] = useContainerQuery(rect => rect.borderBoxHeight > 0);\n const rootRef = useRef<HTMLDivElement>(null);\n useResizeObserver(rootRef, entry => setNotificationsHeight(entry.borderBoxHeight));\n useEffect(() => {\n return () => {\n setNotificationsHeight(0);\n };\n // unmount effect only\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n return (\n <NotificationsSlot\n ref={rootRef}\n className={clsx(\n appLayoutInternals.headerVariant === 'high-contrast' && highContrastHeaderClassName,\n stickyNotifications && styles['sticky-notifications'],\n hasNotificationsContent && styles['has-notifications-content'],\n appLayoutInternals.headerVariant !== 'high-contrast' && styles['sticky-notifications-with-background']\n )}\n style={{\n insetBlockStart: stickyNotifications ? verticalOffsets.notifications : undefined,\n }}\n >\n <div\n ref={contentRef}\n className={testutilStyles.notifications}\n role=\"region\"\n aria-label={ariaLabels?.notifications}\n >\n {children}\n </div>\n </NotificationsSlot>\n );\n}\n\nexport const createWidgetizedAppLayoutNotifications = createWidgetizedComponent(AppLayoutNotificationsImplementation);\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/notifications/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,2BAA2B,EAAE,MAAM,8CAA8C,CAAC;AAC3F,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAEtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,cAAc,MAAM,kCAAkC,CAAC;AAC9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,UAAU,oCAAoC,CAAC,EACnD,kBAAkB,EAClB,QAAQ,GACkC;IAC1C,MAAM,EAAE,UAAU,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,eAAe,EAAE,GAAG,kBAAkB,CAAC;IACxG,MAAM,CAAC,uBAAuB,EAAE,UAAU,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC;IAClG,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,iBAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC;IACnF,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,sBAAsB,CAAC,CAAC,CAAC,CAAC;QAC5B,CAAC,CAAC;QACF,sBAAsB;QACtB,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,oBAAC,iBAAiB,IAChB,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,IAAI,CACb,kBAAkB,CAAC,aAAa,KAAK,eAAe,IAAI,2BAA2B,EACnF,mBAAmB,IAAI,MAAM,CAAC,sBAAsB,CAAC,EACrD,uBAAuB,IAAI,MAAM,CAAC,2BAA2B,CAAC,EAC9D,kBAAkB,CAAC,aAAa,KAAK,eAAe,IAAI,MAAM,CAAC,sCAAsC,CAAC,CACvG,EACD,KAAK,EAAE;YACL,eAAe,EAAE,mBAAmB,CAAC,CAAC,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;SACjF;QAED,6BACE,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,cAAc,CAAC,aAAa,EACvC,IAAI,EAAC,QAAQ,gBACD,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,aAAa,IAEpC,QAAQ,CACL,CACY,CACrB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sCAAsC,GAAG,yBAAyB,CAC7E,oCAAoC,EACpC,qBAAqB,CACtB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { highContrastHeaderClassName } from '../../../internal/utils/content-header-utils';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { AppLayoutInternals } from '../interfaces';\nimport { NotificationsSkeleton } from '../skeleton/slot-skeletons';\nimport { NotificationsSlot } from '../skeleton/slot-wrappers';\n\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport interface AppLayoutNotificationsImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n children: React.ReactNode;\n}\n\nexport function AppLayoutNotificationsImplementation({\n appLayoutInternals,\n children,\n}: AppLayoutNotificationsImplementationProps) {\n const { ariaLabels, stickyNotifications, setNotificationsHeight, verticalOffsets } = appLayoutInternals;\n const [hasNotificationsContent, contentRef] = useContainerQuery(rect => rect.borderBoxHeight > 0);\n const rootRef = useRef<HTMLDivElement>(null);\n useResizeObserver(rootRef, entry => setNotificationsHeight(entry.borderBoxHeight));\n useEffect(() => {\n return () => {\n setNotificationsHeight(0);\n };\n // unmount effect only\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n return (\n <NotificationsSlot\n ref={rootRef}\n className={clsx(\n appLayoutInternals.headerVariant === 'high-contrast' && highContrastHeaderClassName,\n stickyNotifications && styles['sticky-notifications'],\n hasNotificationsContent && styles['has-notifications-content'],\n appLayoutInternals.headerVariant !== 'high-contrast' && styles['sticky-notifications-with-background']\n )}\n style={{\n insetBlockStart: stickyNotifications ? verticalOffsets.notifications : undefined,\n }}\n >\n <div\n ref={contentRef}\n className={testutilStyles.notifications}\n role=\"region\"\n aria-label={ariaLabels?.notifications}\n >\n {children}\n </div>\n </NotificationsSlot>\n );\n}\n\nexport const createWidgetizedAppLayoutNotifications = createWidgetizedComponent(\n AppLayoutNotificationsImplementation,\n NotificationsSkeleton\n);\n"]}

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import React from 'react';
+import { BreadcrumbGroupProps } from '../../../../breadcrumb-group/interfaces';
+interface BreadcrumbsSlotProps {
+    ownBreadcrumbs: React.ReactNode;
+    discoveredBreadcrumbs: BreadcrumbGroupProps | null;
+}
+export declare function BreadcrumbsSlot({ ownBreadcrumbs, discoveredBreadcrumbs }: BreadcrumbsSlotProps): JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAK/E,UAAU,oBAAoB;IAC5B,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,qBAAqB,EAAE,oBAAoB,GAAG,IAAI,CAAC;CACpD;AAED,wBAAgB,eAAe,CAAC,EAAE,cAAc,EAAE,qBAAqB,EAAE,EAAE,oBAAoB,eAe9F"}

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.js ADDED Viewed

@@ -0,0 +1,13 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import { BreadcrumbGroupImplementation } from '../../../../breadcrumb-group/implementation';
+import { BreadcrumbsSlotContext } from '../../contexts';
+import styles from './styles.css.js';
+export function BreadcrumbsSlot({ ownBreadcrumbs, discoveredBreadcrumbs }) {
+    return (React.createElement(BreadcrumbsSlotContext.Provider, { value: { isInToolbar: true } },
+        React.createElement("div", { className: styles['breadcrumbs-own'] }, ownBreadcrumbs),
+        discoveredBreadcrumbs && (React.createElement("div", { className: styles['breadcrumbs-discovered'] },
+            React.createElement(BreadcrumbGroupImplementation, Object.assign({}, discoveredBreadcrumbs, { "data-awsui-discovered-breadcrumbs": true, __injectAnalyticsComponentMetadata: true }))))));
+}
+//# sourceMappingURL=index.js.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,6CAA6C,CAAC;AAE5F,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAExD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,UAAU,eAAe,CAAC,EAAE,cAAc,EAAE,qBAAqB,EAAwB;IAC7F,OAAO,CACL,oBAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;QAC3D,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,IAAG,cAAc,CAAO;QAChE,qBAAqB,IAAI,CACxB,6BAAK,SAAS,EAAE,MAAM,CAAC,wBAAwB,CAAC;YAC9C,oBAAC,6BAA6B,oBACxB,qBAAqB,yCACU,IAAI,EACvC,kCAAkC,EAAE,IAAI,IACxC,CACE,CACP,CAC+B,CACnC,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BreadcrumbGroupImplementation } from '../../../../breadcrumb-group/implementation';\nimport { BreadcrumbGroupProps } from '../../../../breadcrumb-group/interfaces';\nimport { BreadcrumbsSlotContext } from '../../contexts';\n\nimport styles from './styles.css.js';\n\ninterface BreadcrumbsSlotProps {\n ownBreadcrumbs: React.ReactNode;\n discoveredBreadcrumbs: BreadcrumbGroupProps | null;\n}\n\nexport function BreadcrumbsSlot({ ownBreadcrumbs, discoveredBreadcrumbs }: BreadcrumbsSlotProps) {\n return (\n <BreadcrumbsSlotContext.Provider value={{ isInToolbar: true }}>\n <div className={styles['breadcrumbs-own']}>{ownBreadcrumbs}</div>\n {discoveredBreadcrumbs && (\n <div className={styles['breadcrumbs-discovered']}>\n <BreadcrumbGroupImplementation\n {...discoveredBreadcrumbs}\n data-awsui-discovered-breadcrumbs={true}\n __injectAnalyticsComponentMetadata={true}\n />\n </div>\n )}\n </BreadcrumbsSlotContext.Provider>\n );\n}\n"]}

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.css.js ADDED Viewed

@@ -0,0 +1,7 @@
+    import './styles.scoped.css';
+    export default {
+  "breadcrumbs-own": "awsui_breadcrumbs-own_ete58_yonx9_5",
+  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_ete58_yonx9_5"
+};

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.scoped.css ADDED Viewed

@@ -0,0 +1,7 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+.awsui_breadcrumbs-own_ete58_yonx9_5:not(#\9):not(:empty) + .awsui_breadcrumbs-discovered_ete58_yonx9_5 {
+  display: none;
+}

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/breadcrumbs/styles.selectors.js ADDED Viewed

@@ -0,0 +1,8 @@
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "breadcrumbs-own": "awsui_breadcrumbs-own_ete58_yonx9_5",
+  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_ete58_yonx9_5"
+};

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+import React from 'react';
+import { AppLayoutNotificationsImplementationProps } from '../notifications';
+import { AppLayoutToolbarImplementationProps } from '../toolbar';
+export declare const ToolbarSkeleton: React.ForwardRefExoticComponent<AppLayoutToolbarImplementationProps & React.RefAttributes<HTMLElement>>;
+export declare const NotificationsSkeleton: React.ForwardRefExoticComponent<AppLayoutNotificationsImplementationProps & React.RefAttributes<HTMLElement>>;
+//# sourceMappingURL=slot-skeletons.d.ts.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"slot-skeletons.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,yCAAyC,EAAE,MAAM,kBAAkB,CAAC;AAC7E,OAAO,EAAE,mCAAmC,EAAE,MAAM,YAAY,CAAC;AAIjE,eAAO,MAAM,eAAe,yGAS3B,CAAC;AAEF,eAAO,MAAM,qBAAqB,+GAEjC,CAAC"}

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.js ADDED Viewed

@@ -0,0 +1,9 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import { BreadcrumbsSlot } from './breadcrumbs';
+import { NotificationsSlot, ToolbarSlot } from './slot-wrappers';
+export const ToolbarSkeleton = React.forwardRef(({ appLayoutInternals }, ref) => (React.createElement(ToolbarSlot, { ref: ref },
+    React.createElement(BreadcrumbsSlot, { ownBreadcrumbs: appLayoutInternals.breadcrumbs, discoveredBreadcrumbs: appLayoutInternals.discoveredBreadcrumbs }))));
+export const NotificationsSkeleton = React.forwardRef((props, ref) => React.createElement(NotificationsSlot, { ref: ref }));
+//# sourceMappingURL=slot-skeletons.js.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"slot-skeletons.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/slot-skeletons.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEjE,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAC7C,CAAC,EAAE,kBAAkB,EAAuC,EAAE,GAAG,EAAE,EAAE,CAAC,CACpE,oBAAC,WAAW,IAAC,GAAG,EAAE,GAAG;IACnB,oBAAC,eAAe,IACd,cAAc,EAAE,kBAAkB,CAAC,WAAW,EAC9C,qBAAqB,EAAE,kBAAkB,CAAC,qBAAqB,GAC/D,CACU,CACf,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CACnD,CAAC,KAAgD,EAAE,GAAG,EAAE,EAAE,CAAC,oBAAC,iBAAiB,IAAC,GAAG,EAAE,GAAG,GAAI,CAC3F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { AppLayoutNotificationsImplementationProps } from '../notifications';\nimport { AppLayoutToolbarImplementationProps } from '../toolbar';\nimport { BreadcrumbsSlot } from './breadcrumbs';\nimport { NotificationsSlot, ToolbarSlot } from './slot-wrappers';\n\nexport const ToolbarSkeleton = React.forwardRef<HTMLElement, AppLayoutToolbarImplementationProps>(\n ({ appLayoutInternals }: AppLayoutToolbarImplementationProps, ref) => (\n <ToolbarSlot ref={ref}>\n <BreadcrumbsSlot\n ownBreadcrumbs={appLayoutInternals.breadcrumbs}\n discoveredBreadcrumbs={appLayoutInternals.discoveredBreadcrumbs}\n />\n </ToolbarSlot>\n )\n);\n\nexport const NotificationsSkeleton = React.forwardRef<HTMLElement, AppLayoutNotificationsImplementationProps>(\n (props: AppLayoutNotificationsImplementationProps, ref) => <NotificationsSlot ref={ref} />\n);\n"]}

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.d.ts CHANGED Viewed

@@ -24,7 +24,7 @@ export interface ToolbarProps {
     activeGlobalDrawersIds?: ReadonlyArray<string>;
     onActiveGlobalDrawersChange?: ((drawerId: string) => void) | undefined;
 }
-interface AppLayoutToolbarImplementationProps {
+export interface AppLayoutToolbarImplementationProps {
     appLayoutInternals: AppLayoutInternals;
     toolbarProps: ToolbarProps;
 }

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/toolbar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;~~AAOjD~~,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC;~~AAEtF~~,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;~~AAEnD~~,OAAO,EAAkB,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAM1E,OAAO,EAAE,qBAAqB,EAAE,CAAC;AAEjC,MAAM,WAAW,YAAY;IAC3B,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC;IAEnC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAG1C,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAG/B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;IAC9C,kBAAkB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAC1C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAGhC,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,OAAO,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAC/C,eAAe,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IACvC,yBAAyB,CAAC,EAAE,0BAA0B,CAAC;IACvD,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzD,aAAa,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjE,sBAAsB,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC/C,2BAA2B,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACxE;AAED,~~UAAU~~,mCAAmC;~~IAC3C~~,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,YAAY,EAAE,YAAY,CAAC;CAC5B;AA8BD,wBAAgB,8BAA8B,CAAC,EAC7C,kBAAkB,EAGlB,YAAiB,GAClB,EAAE,mCAAmC,~~eAgJrC~~;AAED,eAAO,MAAM,gCAAgC,~~uGAA4D~~,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/toolbar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC;AACtF,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAInD,OAAO,EAAkB,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAM1E,OAAO,EAAE,qBAAqB,EAAE,CAAC;AAEjC,MAAM,WAAW,YAAY;IAC3B,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC;IAEnC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAG1C,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAG/B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;IAC9C,kBAAkB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAC1C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAGhC,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,OAAO,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAC/C,eAAe,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IACvC,yBAAyB,CAAC,EAAE,0BAA0B,CAAC;IACvD,oBAAoB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzD,aAAa,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjE,sBAAsB,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC/C,2BAA2B,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACxE;AAED,MAAM,WAAW,mCAAmC;IAClD,kBAAkB,EAAE,kBAAkB,CAAC;IACvC,YAAY,EAAE,YAAY,CAAC;CAC5B;AA8BD,wBAAgB,8BAA8B,CAAC,EAC7C,kBAAkB,EAGlB,YAAiB,GAClB,EAAE,mCAAmC,eAwIrC;AAED,eAAO,MAAM,gCAAgC,uGAG5C,CAAC"}

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js CHANGED Viewed

@@ -3,9 +3,9 @@
 import React, { useEffect, useRef } from 'react';
 import clsx from 'clsx';
 import { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';
-import { BreadcrumbGroupImplementation } from '../../../breadcrumb-group/implementation';
 import { createWidgetizedComponent } from '../../../internal/widgets';
-import { BreadcrumbsSlotContext } from '../contexts';
+import { BreadcrumbsSlot } from '../skeleton/breadcrumbs';
+import { ToolbarSkeleton } from '../skeleton/slot-skeletons';
 import { ToolbarSlot } from '../skeleton/slot-wrappers';
 import { DrawerTriggers } from './drawer-triggers';
 import TriggerButton from './trigger-button';
@@ -97,12 +97,9 @@ toolbarProps = {}, }) {
             hasNavigation && (React.createElement("nav", { className: clsx(styles['universal-toolbar-nav']) },
                 React.createElement(TriggerButton, { ariaLabel: (_a = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.navigationToggle) !== null && _a !== void 0 ? _a : undefined, ariaExpanded: false, iconName: "menu", className: testutilStyles['navigation-toggle'], onClick: () => onNavigationToggle === null || onNavigationToggle === void 0 ? void 0 : onNavigationToggle(!navigationOpen), ref: navigationFocusRef, selected: navigationOpen, disabled: anyPanelOpenInMobile }))),
             (breadcrumbs || discoveredBreadcrumbs) && (React.createElement("div", { className: clsx(styles['universal-toolbar-breadcrumbs'], testutilStyles.breadcrumbs) },
-                React.createElement(BreadcrumbsSlotContext.Provider, { value: { isInToolbar: true } },
-                    React.createElement("div", { className: styles['breadcrumbs-own'] }, breadcrumbs),
-                    discoveredBreadcrumbs && (React.createElement("div", { className: styles['breadcrumbs-discovered'] },
-                        React.createElement(BreadcrumbGroupImplementation, Object.assign({}, discoveredBreadcrumbs, { "data-awsui-discovered-breadcrumbs": true, __injectAnalyticsComponentMetadata: true }))))))),
+                React.createElement(BreadcrumbsSlot, { ownBreadcrumbs: appLayoutInternals.breadcrumbs, discoveredBreadcrumbs: appLayoutInternals.discoveredBreadcrumbs }))),
             ((drawers && drawers.length > 0) || (hasSplitPanel && (splitPanelToggleProps === null || splitPanelToggleProps === void 0 ? void 0 : splitPanelToggleProps.displayed))) && (React.createElement("div", { className: clsx(styles['universal-toolbar-drawers']) },
                 React.createElement(DrawerTriggers, { ariaLabels: ariaLabels, activeDrawerId: activeDrawerId !== null && activeDrawerId !== void 0 ? activeDrawerId : null, drawers: (_b = drawers === null || drawers === void 0 ? void 0 : drawers.filter(item => !!item.trigger)) !== null && _b !== void 0 ? _b : [], drawersFocusRef: drawersFocusRef, onActiveDrawerChange: onActiveDrawerChange, splitPanelToggleProps: (splitPanelToggleProps === null || splitPanelToggleProps === void 0 ? void 0 : splitPanelToggleProps.displayed) ? splitPanelToggleProps : undefined, splitPanelFocusRef: splitPanelFocusRef, onSplitPanelToggle: onSplitPanelToggle, disabled: anyPanelOpenInMobile, globalDrawersFocusControl: globalDrawersFocusControl, globalDrawers: (_c = globalDrawers === null || globalDrawers === void 0 ? void 0 : globalDrawers.filter(item => !!item.trigger)) !== null && _c !== void 0 ? _c : [], activeGlobalDrawersIds: activeGlobalDrawersIds !== null && activeGlobalDrawersIds !== void 0 ? activeGlobalDrawersIds : [], onActiveGlobalDrawersChange: onActiveGlobalDrawersChange }))))));
 }
-export const createWidgetizedAppLayoutToolbar = createWidgetizedComponent(AppLayoutToolbarImplementation);
+export const createWidgetizedAppLayoutToolbar = createWidgetizedComponent(AppLayoutToolbarImplementation, ToolbarSkeleton);
 //# sourceMappingURL=index.js.map

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/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 React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { BreadcrumbGroupImplementation } from '../../../breadcrumb-group/implementation';\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { AppLayoutProps } from '../../interfaces';\nimport { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';\nimport { BreadcrumbsSlotContext } from '../contexts';\nimport { AppLayoutInternals } from '../interfaces';\nimport { ToolbarSlot } from '../skeleton/slot-wrappers';\nimport { DrawerTriggers, SplitPanelToggleProps } from './drawer-triggers';\nimport TriggerButton from './trigger-button';\n\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { SplitPanelToggleProps };\n\nexport interface ToolbarProps {\n ariaLabels?: AppLayoutProps.Labels;\n // navigation\n hasNavigation?: boolean;\n navigationOpen?: boolean;\n onNavigationToggle?: (open: boolean) => void;\n navigationFocusRef?: React.Ref<Focusable>;\n\n // breadcrumbs\n hasBreadcrumbsPortal?: boolean;\n\n // split panel\n hasSplitPanel?: boolean;\n splitPanelToggleProps?: SplitPanelToggleProps;\n splitPanelFocusRef?: React.Ref<Focusable>;\n onSplitPanelToggle?: () => void;\n\n // drawers\n activeDrawerId?: string \| null;\n drawers?: ReadonlyArray<AppLayoutProps.Drawer>;\n drawersFocusRef?: React.Ref<Focusable>;\n globalDrawersFocusControl?: FocusControlMultipleStates;\n onActiveDrawerChange?: (drawerId: string \| null) => void;\n globalDrawers?: ReadonlyArray<AppLayoutProps.Drawer> \| undefined;\n activeGlobalDrawersIds?: ReadonlyArray<string>;\n onActiveGlobalDrawersChange?: ((drawerId: string) => void) \| undefined;\n}\n\ninterface AppLayoutToolbarImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n toolbarProps: ToolbarProps;\n}\n\n// support compatibility with changes before this commit: cf0f2b0755af1a28ac7c3c9476418a7ea807d0fd\nfunction convertLegacyProps(toolbarProps: ToolbarProps, legacyProps: AppLayoutInternals): ToolbarProps {\n return {\n ariaLabels: toolbarProps.ariaLabels ?? legacyProps.ariaLabels,\n activeDrawerId: toolbarProps.activeDrawerId ?? legacyProps.activeDrawer?.id,\n drawers: toolbarProps.drawers ?? legacyProps.drawers,\n drawersFocusRef: toolbarProps.drawersFocusRef ?? legacyProps.drawersFocusControl?.refs.toggle,\n globalDrawersFocusControl: toolbarProps.globalDrawersFocusControl,\n onActiveDrawerChange: toolbarProps.onActiveDrawerChange ?? legacyProps.onActiveDrawerChange,\n globalDrawers: toolbarProps.globalDrawers ?? legacyProps.globalDrawers,\n activeGlobalDrawersIds: toolbarProps.activeGlobalDrawersIds ?? legacyProps.activeGlobalDrawersIds,\n onActiveGlobalDrawersChange: toolbarProps.onActiveGlobalDrawersChange ?? legacyProps.onActiveGlobalDrawersChange,\n hasNavigation: toolbarProps.hasNavigation ?? !!legacyProps.navigation,\n navigationOpen: toolbarProps.navigationOpen ?? legacyProps.navigationOpen,\n navigationFocusRef: toolbarProps.navigationFocusRef ?? legacyProps.navigationFocusControl?.refs.toggle,\n onNavigationToggle: toolbarProps.onNavigationToggle ?? legacyProps.onNavigationToggle,\n hasSplitPanel: toolbarProps.hasSplitPanel ?? true,\n splitPanelFocusRef: legacyProps.splitPanelFocusControl?.refs.toggle,\n splitPanelToggleProps: toolbarProps.splitPanelToggleProps ?? {\n ...legacyProps.splitPanelToggleConfig,\n active: legacyProps.splitPanelOpen,\n controlId: legacyProps.splitPanelControlId,\n position: legacyProps.splitPanelPosition,\n },\n onSplitPanelToggle: toolbarProps.onSplitPanelToggle ?? legacyProps.onSplitPanelToggle,\n };\n}\n\nexport function AppLayoutToolbarImplementation({\n appLayoutInternals,\n // the value could be undefined if this component is loaded as a widget by a different app layout version\n // not testable in a single-version setup\n toolbarProps = {},\n}: AppLayoutToolbarImplementationProps) {\n const {\n breadcrumbs,\n discoveredBreadcrumbs,\n verticalOffsets,\n isMobile,\n toolbarState,\n setToolbarState,\n setToolbarHeight,\n } = appLayoutInternals;\n const {\n ariaLabels,\n activeDrawerId,\n drawers,\n drawersFocusRef,\n onActiveDrawerChange,\n globalDrawersFocusControl,\n globalDrawers,\n activeGlobalDrawersIds,\n onActiveGlobalDrawersChange,\n hasNavigation,\n navigationOpen,\n navigationFocusRef,\n onNavigationToggle,\n hasSplitPanel,\n splitPanelFocusRef,\n splitPanelToggleProps,\n onSplitPanelToggle,\n } = convertLegacyProps(toolbarProps, appLayoutInternals);\n // TODO: expose configuration property\n const pinnedToolbar = true;\n const ref = useRef<HTMLElement>(null);\n useResizeObserver(ref, entry => setToolbarHeight(entry.borderBoxHeight));\n useEffect(() => {\n return () => {\n setToolbarHeight(0);\n };\n // unmount effect only\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n let lastScrollY = window.scrollY;\n\n /* istanbul ignore next not testable in JSDOM */\n const updateScrollDirection = () => {\n if (pinnedToolbar) {\n setToolbarState('show');\n return;\n }\n const scrollY = window.scrollY;\n // 80 is an arbitrary number to have a pause before the toolbar scrolls out of view at the top of the page\n const direction = scrollY > lastScrollY && scrollY > 80 ? 'hide' : 'show';\n // 2 as a buffer to avoid mistaking minor accidental mouse moves as scroll\n if (direction !== toolbarState && (scrollY - lastScrollY > 2 \|\| scrollY - lastScrollY < -2)) {\n setToolbarState(direction);\n }\n lastScrollY = scrollY > 0 ? scrollY : 0;\n };\n\n window.addEventListener('scroll', updateScrollDirection);\n return () => {\n window.removeEventListener('scroll', updateScrollDirection);\n };\n }, [pinnedToolbar, setToolbarState, toolbarState]);\n\n const anyPanelOpenInMobile = !!isMobile && (!!activeDrawerId \|\| (!!navigationOpen && !!hasNavigation));\n useEffect(() => {\n if (anyPanelOpenInMobile) {\n document.body.classList.add(styles['block-body-scroll']);\n } else {\n document.body.classList.remove(styles['block-body-scroll']);\n }\n return () => {\n document.body.classList.remove(styles['block-body-scroll']);\n };\n }, [anyPanelOpenInMobile]);\n\n const toolbarHidden = toolbarState === 'hide' && !pinnedToolbar;\n\n return (\n <ToolbarSlot\n ref={ref}\n className={clsx(styles['universal-toolbar'], testutilStyles.toolbar, {\n [testutilStyles['mobile-bar']]: isMobile,\n [styles['toolbar-hidden']]: toolbarHidden,\n })}\n style={{\n insetBlockStart: toolbarHidden ? '-60px' : verticalOffsets.toolbar,\n }}\n >\n <div className={styles['toolbar-container']}>\n {hasNavigation && (\n <nav className={clsx(styles['universal-toolbar-nav'])}>\n <TriggerButton\n ariaLabel={ariaLabels?.navigationToggle ?? undefined}\n ariaExpanded={false}\n iconName=\"menu\"\n className={testutilStyles['navigation-toggle']}\n onClick={() => onNavigationToggle?.(!navigationOpen)}\n ref={navigationFocusRef}\n selected={navigationOpen}\n disabled={anyPanelOpenInMobile}\n />\n </nav>\n )}\n {(breadcrumbs \|\| discoveredBreadcrumbs) && (\n <div className={clsx(styles['universal-toolbar-breadcrumbs'], testutilStyles.breadcrumbs)}>\n <BreadcrumbsSlotContext.Provider value={{ isInToolbar: true }}>\n <div className={styles['breadcrumbs-own']}>{breadcrumbs}</div>\n {discoveredBreadcrumbs && (\n <div className={styles['breadcrumbs-discovered']}>\n <BreadcrumbGroupImplementation\n {...discoveredBreadcrumbs}\n data-awsui-discovered-breadcrumbs={true}\n __injectAnalyticsComponentMetadata={true}\n />\n </div>\n )}\n </BreadcrumbsSlotContext.Provider>\n </div>\n )}\n {((drawers && drawers.length > 0) \|\| (hasSplitPanel && splitPanelToggleProps?.displayed)) && (\n <div className={clsx(styles['universal-toolbar-drawers'])}>\n <DrawerTriggers\n ariaLabels={ariaLabels}\n activeDrawerId={activeDrawerId ?? null}\n drawers={drawers?.filter(item => !!item.trigger) ?? []}\n drawersFocusRef={drawersFocusRef}\n onActiveDrawerChange={onActiveDrawerChange}\n splitPanelToggleProps={splitPanelToggleProps?.displayed ? splitPanelToggleProps : undefined}\n splitPanelFocusRef={splitPanelFocusRef}\n onSplitPanelToggle={onSplitPanelToggle}\n disabled={anyPanelOpenInMobile}\n globalDrawersFocusControl={globalDrawersFocusControl}\n globalDrawers={globalDrawers?.filter(item => !!item.trigger) ?? []}\n activeGlobalDrawersIds={activeGlobalDrawersIds ?? []}\n onActiveGlobalDrawersChange={onActiveGlobalDrawersChange}\n />\n </div>\n )}\n </div>\n </ToolbarSlot>\n );\n}\n\nexport const createWidgetizedAppLayoutToolbar = createWidgetizedComponent(AppLayoutToolbarImplementation);\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/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 React, { useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { AppLayoutProps } from '../../interfaces';\nimport { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';\nimport { AppLayoutInternals } from '../interfaces';\nimport { BreadcrumbsSlot } from '../skeleton/breadcrumbs';\nimport { ToolbarSkeleton } from '../skeleton/slot-skeletons';\nimport { ToolbarSlot } from '../skeleton/slot-wrappers';\nimport { DrawerTriggers, SplitPanelToggleProps } from './drawer-triggers';\nimport TriggerButton from './trigger-button';\n\nimport testutilStyles from '../../test-classes/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { SplitPanelToggleProps };\n\nexport interface ToolbarProps {\n ariaLabels?: AppLayoutProps.Labels;\n // navigation\n hasNavigation?: boolean;\n navigationOpen?: boolean;\n onNavigationToggle?: (open: boolean) => void;\n navigationFocusRef?: React.Ref<Focusable>;\n\n // breadcrumbs\n hasBreadcrumbsPortal?: boolean;\n\n // split panel\n hasSplitPanel?: boolean;\n splitPanelToggleProps?: SplitPanelToggleProps;\n splitPanelFocusRef?: React.Ref<Focusable>;\n onSplitPanelToggle?: () => void;\n\n // drawers\n activeDrawerId?: string \| null;\n drawers?: ReadonlyArray<AppLayoutProps.Drawer>;\n drawersFocusRef?: React.Ref<Focusable>;\n globalDrawersFocusControl?: FocusControlMultipleStates;\n onActiveDrawerChange?: (drawerId: string \| null) => void;\n globalDrawers?: ReadonlyArray<AppLayoutProps.Drawer> \| undefined;\n activeGlobalDrawersIds?: ReadonlyArray<string>;\n onActiveGlobalDrawersChange?: ((drawerId: string) => void) \| undefined;\n}\n\nexport interface AppLayoutToolbarImplementationProps {\n appLayoutInternals: AppLayoutInternals;\n toolbarProps: ToolbarProps;\n}\n\n// support compatibility with changes before this commit: cf0f2b0755af1a28ac7c3c9476418a7ea807d0fd\nfunction convertLegacyProps(toolbarProps: ToolbarProps, legacyProps: AppLayoutInternals): ToolbarProps {\n return {\n ariaLabels: toolbarProps.ariaLabels ?? legacyProps.ariaLabels,\n activeDrawerId: toolbarProps.activeDrawerId ?? legacyProps.activeDrawer?.id,\n drawers: toolbarProps.drawers ?? legacyProps.drawers,\n drawersFocusRef: toolbarProps.drawersFocusRef ?? legacyProps.drawersFocusControl?.refs.toggle,\n globalDrawersFocusControl: toolbarProps.globalDrawersFocusControl,\n onActiveDrawerChange: toolbarProps.onActiveDrawerChange ?? legacyProps.onActiveDrawerChange,\n globalDrawers: toolbarProps.globalDrawers ?? legacyProps.globalDrawers,\n activeGlobalDrawersIds: toolbarProps.activeGlobalDrawersIds ?? legacyProps.activeGlobalDrawersIds,\n onActiveGlobalDrawersChange: toolbarProps.onActiveGlobalDrawersChange ?? legacyProps.onActiveGlobalDrawersChange,\n hasNavigation: toolbarProps.hasNavigation ?? !!legacyProps.navigation,\n navigationOpen: toolbarProps.navigationOpen ?? legacyProps.navigationOpen,\n navigationFocusRef: toolbarProps.navigationFocusRef ?? legacyProps.navigationFocusControl?.refs.toggle,\n onNavigationToggle: toolbarProps.onNavigationToggle ?? legacyProps.onNavigationToggle,\n hasSplitPanel: toolbarProps.hasSplitPanel ?? true,\n splitPanelFocusRef: legacyProps.splitPanelFocusControl?.refs.toggle,\n splitPanelToggleProps: toolbarProps.splitPanelToggleProps ?? {\n ...legacyProps.splitPanelToggleConfig,\n active: legacyProps.splitPanelOpen,\n controlId: legacyProps.splitPanelControlId,\n position: legacyProps.splitPanelPosition,\n },\n onSplitPanelToggle: toolbarProps.onSplitPanelToggle ?? legacyProps.onSplitPanelToggle,\n };\n}\n\nexport function AppLayoutToolbarImplementation({\n appLayoutInternals,\n // the value could be undefined if this component is loaded as a widget by a different app layout version\n // not testable in a single-version setup\n toolbarProps = {},\n}: AppLayoutToolbarImplementationProps) {\n const {\n breadcrumbs,\n discoveredBreadcrumbs,\n verticalOffsets,\n isMobile,\n toolbarState,\n setToolbarState,\n setToolbarHeight,\n } = appLayoutInternals;\n const {\n ariaLabels,\n activeDrawerId,\n drawers,\n drawersFocusRef,\n onActiveDrawerChange,\n globalDrawersFocusControl,\n globalDrawers,\n activeGlobalDrawersIds,\n onActiveGlobalDrawersChange,\n hasNavigation,\n navigationOpen,\n navigationFocusRef,\n onNavigationToggle,\n hasSplitPanel,\n splitPanelFocusRef,\n splitPanelToggleProps,\n onSplitPanelToggle,\n } = convertLegacyProps(toolbarProps, appLayoutInternals);\n // TODO: expose configuration property\n const pinnedToolbar = true;\n const ref = useRef<HTMLElement>(null);\n useResizeObserver(ref, entry => setToolbarHeight(entry.borderBoxHeight));\n useEffect(() => {\n return () => {\n setToolbarHeight(0);\n };\n // unmount effect only\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n let lastScrollY = window.scrollY;\n\n /* istanbul ignore next not testable in JSDOM */\n const updateScrollDirection = () => {\n if (pinnedToolbar) {\n setToolbarState('show');\n return;\n }\n const scrollY = window.scrollY;\n // 80 is an arbitrary number to have a pause before the toolbar scrolls out of view at the top of the page\n const direction = scrollY > lastScrollY && scrollY > 80 ? 'hide' : 'show';\n // 2 as a buffer to avoid mistaking minor accidental mouse moves as scroll\n if (direction !== toolbarState && (scrollY - lastScrollY > 2 \|\| scrollY - lastScrollY < -2)) {\n setToolbarState(direction);\n }\n lastScrollY = scrollY > 0 ? scrollY : 0;\n };\n\n window.addEventListener('scroll', updateScrollDirection);\n return () => {\n window.removeEventListener('scroll', updateScrollDirection);\n };\n }, [pinnedToolbar, setToolbarState, toolbarState]);\n\n const anyPanelOpenInMobile = !!isMobile && (!!activeDrawerId \|\| (!!navigationOpen && !!hasNavigation));\n useEffect(() => {\n if (anyPanelOpenInMobile) {\n document.body.classList.add(styles['block-body-scroll']);\n } else {\n document.body.classList.remove(styles['block-body-scroll']);\n }\n return () => {\n document.body.classList.remove(styles['block-body-scroll']);\n };\n }, [anyPanelOpenInMobile]);\n\n const toolbarHidden = toolbarState === 'hide' && !pinnedToolbar;\n\n return (\n <ToolbarSlot\n ref={ref}\n className={clsx(styles['universal-toolbar'], testutilStyles.toolbar, {\n [testutilStyles['mobile-bar']]: isMobile,\n [styles['toolbar-hidden']]: toolbarHidden,\n })}\n style={{\n insetBlockStart: toolbarHidden ? '-60px' : verticalOffsets.toolbar,\n }}\n >\n <div className={styles['toolbar-container']}>\n {hasNavigation && (\n <nav className={clsx(styles['universal-toolbar-nav'])}>\n <TriggerButton\n ariaLabel={ariaLabels?.navigationToggle ?? undefined}\n ariaExpanded={false}\n iconName=\"menu\"\n className={testutilStyles['navigation-toggle']}\n onClick={() => onNavigationToggle?.(!navigationOpen)}\n ref={navigationFocusRef}\n selected={navigationOpen}\n disabled={anyPanelOpenInMobile}\n />\n </nav>\n )}\n {(breadcrumbs \|\| discoveredBreadcrumbs) && (\n <div className={clsx(styles['universal-toolbar-breadcrumbs'], testutilStyles.breadcrumbs)}>\n <BreadcrumbsSlot\n ownBreadcrumbs={appLayoutInternals.breadcrumbs}\n discoveredBreadcrumbs={appLayoutInternals.discoveredBreadcrumbs}\n />\n </div>\n )}\n {((drawers && drawers.length > 0) \|\| (hasSplitPanel && splitPanelToggleProps?.displayed)) && (\n <div className={clsx(styles['universal-toolbar-drawers'])}>\n <DrawerTriggers\n ariaLabels={ariaLabels}\n activeDrawerId={activeDrawerId ?? null}\n drawers={drawers?.filter(item => !!item.trigger) ?? []}\n drawersFocusRef={drawersFocusRef}\n onActiveDrawerChange={onActiveDrawerChange}\n splitPanelToggleProps={splitPanelToggleProps?.displayed ? splitPanelToggleProps : undefined}\n splitPanelFocusRef={splitPanelFocusRef}\n onSplitPanelToggle={onSplitPanelToggle}\n disabled={anyPanelOpenInMobile}\n globalDrawersFocusControl={globalDrawersFocusControl}\n globalDrawers={globalDrawers?.filter(item => !!item.trigger) ?? []}\n activeGlobalDrawersIds={activeGlobalDrawersIds ?? []}\n onActiveGlobalDrawersChange={onActiveGlobalDrawersChange}\n />\n </div>\n )}\n </div>\n </ToolbarSlot>\n );\n}\n\nexport const createWidgetizedAppLayoutToolbar = createWidgetizedComponent(\n AppLayoutToolbarImplementation,\n ToolbarSkeleton\n);\n"]}

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.css.js CHANGED Viewed

@@ -1,20 +1,18 @@
     import './styles.scoped.css';
     export default {
-  "universal-toolbar": "awsui_universal-toolbar_1kzri_q9i4f_149",
-  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_q9i4f_170",
-  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_q9i4f_173",
-  "toolbar-container": "awsui_toolbar-container_1kzri_q9i4f_176",
-  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_q9i4f_185",
-  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_q9i4f_189",
-  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_q9i4f_194",
-  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_q9i4f_202",
-  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_q9i4f_203",
-  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_q9i4f_249",
-  "group-divider": "awsui_group-divider_1kzri_q9i4f_259",
-  "drawers-trigger": "awsui_drawers-trigger_1kzri_q9i4f_249",
-  "breadcrumbs-own": "awsui_breadcrumbs-own_1kzri_q9i4f_272",
-  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_1kzri_q9i4f_272",
-  "block-body-scroll": "awsui_block-body-scroll_1kzri_q9i4f_276"
+  "universal-toolbar": "awsui_universal-toolbar_1kzri_1ewgi_149",
+  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_1ewgi_170",
+  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_1ewgi_173",
+  "toolbar-container": "awsui_toolbar-container_1kzri_1ewgi_176",
+  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_1ewgi_185",
+  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_1ewgi_189",
+  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_1ewgi_194",
+  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_1ewgi_202",
+  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_1ewgi_203",
+  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_1ewgi_249",
+  "group-divider": "awsui_group-divider_1kzri_1ewgi_259",
+  "drawers-trigger": "awsui_drawers-trigger_1kzri_1ewgi_249",
+  "block-body-scroll": "awsui_block-body-scroll_1kzri_1ewgi_272"
 };