@cloudscape-design/components-themeable 3.0.826 → 3.0.827

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "c527559a5d7b1d68e70fc006dc8743d195e2e494"
+  "commit": "0a72542604f346f70303b63f1c746e43bda962a5"
 }

package/lib/internal/scss/app-layout/constants.scss

@@ -33,4 +33,4 @@ $drawer-z-index-mobile: 1001;
 $toolbar-z-index: 1000;
 
 // Shared toolbar drawer component values
-$toolbar-vertical-panel-icon-offset: 10px;
+$toolbar-vertical-panel-icon-offset: 14px;

package/lib/internal/scss/drawer/styles.scss

@@ -9,29 +9,19 @@
 .drawer {
   @include styles.styles-reset;
   word-wrap: break-word;
-  padding-block-start: awsui.$space-panel-header-vertical;
-  padding-block-end: awsui.$space-panel-content-bottom;
-  padding-inline-start: awsui.$space-panel-side-left;
-  padding-inline-end: awsui.$space-panel-side-right;
-  &.with-toolbar {
-    padding-block-start: awsui.$space-static-m;
-  }
 }
 
 .header {
   @include styles.font-panel-header;
   color: awsui.$color-text-heading-default;
-  padding-block-end: awsui.$space-panel-header-vertical;
+  padding-block: awsui.$space-panel-header-vertical;
   padding-inline: awsui.$space-panel-side-left calc(#{awsui.$space-xl} + #{awsui.$space-scaled-xxl});
   // padding to make sure the header doesn't overlap with the close icon
   border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
   margin-block-start: 0;
   margin-block-end: awsui.$space-panel-content-top;
-  margin-inline-end: calc(-1 * #{awsui.$space-panel-side-right});
-  margin-inline-start: calc(-1 * #{awsui.$space-panel-side-left});
   .with-toolbar > & {
     border-color: transparent;
-    padding-block-end: awsui.$space-static-m;
     margin-block-end: 0px;
   }
 
@@ -48,6 +38,12 @@
   /* stylelint-enable @cloudscape-design/no-implicit-descendant, selector-max-type */
 }
 
+.content:not(:empty) {
+  padding-inline-start: awsui.$space-panel-side-left;
+  padding-inline-end: awsui.$space-panel-side-right;
+  padding-block-end: awsui.$space-panel-content-bottom;
+}
+
 .test-utils-drawer-content {
   /* used in test-utils */
 }

package/lib/internal/scss/help-panel/styles.scss

@@ -11,11 +11,6 @@
   word-wrap: break-word;
   padding-block-start: awsui.$space-panel-header-vertical;
   padding-block-end: 0;
-  padding-inline-end: awsui.$space-panel-side-right;
-  padding-inline-start: awsui.$space-panel-side-left;
-  &.with-toolbar {
-    padding-block-start: awsui.$space-static-m;
-  }
 
   /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
   hr {
@@ -120,6 +115,11 @@
   /* stylelint-enable @cloudscape-design/no-implicit-descendant, selector-max-type */
 }
 
+.loading {
+  padding-inline-start: awsui.$space-panel-side-left;
+  padding-inline-end: awsui.$space-panel-side-right;
+}
+
 .header {
   @include styles.font-panel-header;
   color: awsui.$color-text-heading-default;
@@ -131,11 +131,8 @@
   border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
   margin-block-start: 0;
   margin-block-end: awsui.$space-panel-content-top;
-  margin-inline-end: calc(-1 * #{awsui.$space-panel-side-right});
-  margin-inline-start: calc(-1 * #{awsui.$space-panel-side-left});
   .with-toolbar > & {
     border-color: transparent;
-    padding-block-end: awsui.$space-static-m;
     margin-block-end: 0px;
   }
 
@@ -154,13 +151,16 @@
 
 .content {
   color: awsui.$color-text-body-secondary;
+  padding-inline-start: awsui.$space-panel-side-left;
+  padding-inline-end: awsui.$space-panel-side-right;
 
   /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
   h2:first-child,
   h3:first-child,
   h4:first-child,
   h5:first-child,
-  h6:first-child {
+  h6:first-child,
+  p:first-child {
     margin-block-start: 0;
   }
 
@@ -172,14 +172,9 @@
 
 .footer {
   color: awsui.$color-text-body-secondary;
-  border-block-start: awsui.$border-divider-section-width solid awsui.$color-border-divider-default;
-  margin-block: awsui.$space-scaled-xl;
-  margin-inline: calc(-1 * #{awsui.$space-panel-divider-margin-horizontal});
   padding-block: 0;
-  padding-inline: awsui.$space-panel-divider-margin-horizontal;
-  > :first-child {
-    margin-block-start: awsui.$space-scaled-xl;
-  }
+  padding-inline-start: awsui.$space-panel-side-left;
+  padding-inline-end: awsui.$space-panel-side-right;
   /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
   ul {
     list-style: none;

package/lib/internal/scss/side-navigation/styles.scss

@@ -20,9 +20,6 @@
   padding-inline-start: awsui.$space-panel-nav-left;
   // Additional xl space to prevent text from overlapping the close button.
   padding-inline-end: calc(#{awsui.$space-scaled-xxl} + #{awsui.$space-xl});
-  .with-toolbar > & {
-    padding-block: awsui.$space-static-m;
-  }
 }
 
 .header-link {
@@ -53,14 +50,13 @@
 }
 
 .items-control {
-  margin-block-start: awsui.$space-panel-content-top;
   padding-inline: awsui.$space-l;
 }
 
 .list-container {
   margin-block-start: awsui.$space-panel-content-top;
-  .with-toolbar > & {
-    margin-block-start: 0px;
+  .with-toolbar > .divider + & {
+    margin-block-start: 0;
   }
 }
 
@@ -94,6 +90,20 @@
   padding-block: 0;
   padding-inline: 0;
   list-style: none;
+
+  @supports selector(:has(*)) {
+    /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
+    &:has(> .section:not(.refresh)) {
+      margin-block: calc(#{awsui.$space-scaled-2x-l} - #{awsui.$border-divider-section-width});
+    }
+    /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
+    &:has(> .section.refresh) {
+      margin-block: calc(#{awsui.$space-scaled-2x-m} - #{awsui.$border-divider-section-width});
+    }
+  }
+  .list-variant-root > &:first-child {
+    margin-block-start: 0px;
+  }
 }
 
 .section,
@@ -106,11 +116,12 @@
 }
 
 .section {
-  margin-block: calc(#{awsui.$space-scaled-2x-l} - #{awsui.$border-divider-section-width});
-  &.refresh {
-    margin-block: calc(#{awsui.$space-scaled-2x-m} - #{awsui.$border-divider-section-width});
+  @supports not selector(:has(*)) {
+    margin-block: calc(#{awsui.$space-scaled-2x-l} - #{awsui.$border-divider-section-width});
+    &.refresh {
+      margin-block: calc(#{awsui.$space-scaled-2x-m} - #{awsui.$border-divider-section-width});
+    }
   }
-
   // HACK: Remove padding from section header and content to rely on margin collapsing rules.
   /* stylelint-disable-next-line selector-max-type */
   > div {
@@ -193,8 +204,10 @@
 
 .divider-header {
   margin-block-start: 0;
+  margin-block-end: awsui.$space-panel-content-top;
   border-block-start: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
   .with-toolbar > & {
     border-color: transparent;
+    margin-block-end: 0;
   }
 }

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

@@ -1,15 +1,15 @@
 
     import './styles.scoped.css';
     export default {
-  "drawer": "awsui_drawer_12i0j_dpyab_185",
-  "legacy": "awsui_legacy_12i0j_dpyab_200",
-  "last-opened": "awsui_last-opened_12i0j_dpyab_208",
-  "drawer-global": "awsui_drawer-global_12i0j_dpyab_213",
-  "drawer-hidden": "awsui_drawer-hidden_12i0j_dpyab_220",
-  "drawer-content-container": "awsui_drawer-content-container_12i0j_dpyab_223",
-  "drawer-close-button": "awsui_drawer-close-button_12i0j_dpyab_231",
-  "drawer-content": "awsui_drawer-content_12i0j_dpyab_223",
-  "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_dpyab_240",
-  "drawer-slider": "awsui_drawer-slider_12i0j_dpyab_243"
+  "drawer": "awsui_drawer_12i0j_ys4ng_185",
+  "legacy": "awsui_legacy_12i0j_ys4ng_200",
+  "last-opened": "awsui_last-opened_12i0j_ys4ng_208",
+  "drawer-global": "awsui_drawer-global_12i0j_ys4ng_213",
+  "drawer-hidden": "awsui_drawer-hidden_12i0j_ys4ng_220",
+  "drawer-content-container": "awsui_drawer-content-container_12i0j_ys4ng_223",
+  "drawer-close-button": "awsui_drawer-close-button_12i0j_ys4ng_231",
+  "drawer-content": "awsui_drawer-content_12i0j_ys4ng_223",
+  "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_ys4ng_240",
+  "drawer-slider": "awsui_drawer-slider_12i0j_ys4ng_243"
 };
   

package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css

@@ -182,7 +182,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_drawer_12i0j_dpyab_185:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185:not(#\9) {
   position: sticky;
   z-index: 830;
   background-color: var(--color-background-container-content-myy7cn, #ffffff);
@@ -197,50 +197,50 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   word-wrap: break-word;
 }
 @media (min-width: 689px) {
-  .awsui_drawer_12i0j_dpyab_185:not(#\9):not(.awsui_legacy_12i0j_dpyab_200) {
+  .awsui_drawer_12i0j_ys4ng_185:not(#\9):not(.awsui_legacy_12i0j_ys4ng_200) {
     border-inline-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-layout-5gml03, #d5dbdb);
   }
 }
 @media (max-width: 688px) {
-  .awsui_drawer_12i0j_dpyab_185:not(#\9) {
+  .awsui_drawer_12i0j_ys4ng_185:not(#\9) {
     inline-size: 100%;
   }
-  .awsui_drawer_12i0j_dpyab_185.awsui_last-opened_12i0j_dpyab_208:not(#\9) {
+  .awsui_drawer_12i0j_ys4ng_185.awsui_last-opened_12i0j_ys4ng_208:not(#\9) {
     z-index: 1001;
   }
 }
 @media (max-width: 688px) {
-  .awsui_drawer_12i0j_dpyab_185.awsui_drawer-global_12i0j_dpyab_213:not(#\9) {
+  .awsui_drawer_12i0j_ys4ng_185.awsui_drawer-global_12i0j_ys4ng_213:not(#\9) {
     display: none;
   }
-  .awsui_drawer_12i0j_dpyab_185.awsui_drawer-global_12i0j_dpyab_213.awsui_last-opened_12i0j_dpyab_208:not(#\9) {
+  .awsui_drawer_12i0j_ys4ng_185.awsui_drawer-global_12i0j_ys4ng_213.awsui_last-opened_12i0j_ys4ng_208:not(#\9) {
     display: block;
   }
 }
-.awsui_drawer_12i0j_dpyab_185.awsui_drawer-hidden_12i0j_dpyab_220:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185.awsui_drawer-hidden_12i0j_ys4ng_220:not(#\9) {
   display: none;
 }
-.awsui_drawer_12i0j_dpyab_185 > .awsui_drawer-content-container_12i0j_dpyab_223:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185 > .awsui_drawer-content-container_12i0j_ys4ng_223:not(#\9) {
   grid-column: 1/span 2;
   grid-row: 1;
   display: grid;
   grid-template-columns: var(--space-m-u91ipm, 16px) 1fr auto var(--space-m-u91ipm, 16px);
-  grid-template-rows: 10px auto 1fr;
+  grid-template-rows: 14px auto 1fr;
   overflow-y: auto;
 }
-.awsui_drawer_12i0j_dpyab_185 > .awsui_drawer-content-container_12i0j_dpyab_223 > .awsui_drawer-close-button_12i0j_dpyab_231:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185 > .awsui_drawer-content-container_12i0j_ys4ng_223 > .awsui_drawer-close-button_12i0j_ys4ng_231:not(#\9) {
   grid-column: 3;
   grid-row: 2;
   z-index: 1;
 }
-.awsui_drawer_12i0j_dpyab_185 > .awsui_drawer-content-container_12i0j_dpyab_223 > .awsui_drawer-content_12i0j_dpyab_223:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185 > .awsui_drawer-content-container_12i0j_ys4ng_223 > .awsui_drawer-content_12i0j_ys4ng_223:not(#\9) {
   grid-column: 1/span 4;
   grid-row: 1/span 2;
 }
-.awsui_drawer_12i0j_dpyab_185 > .awsui_drawer-content-container_12i0j_dpyab_223 > .awsui_drawer-content_12i0j_dpyab_223.awsui_drawer-content-hidden_12i0j_dpyab_240:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185 > .awsui_drawer-content-container_12i0j_ys4ng_223 > .awsui_drawer-content_12i0j_ys4ng_223.awsui_drawer-content-hidden_12i0j_ys4ng_240:not(#\9) {
   display: none;
 }
-.awsui_drawer_12i0j_dpyab_185 > .awsui_drawer-slider_12i0j_dpyab_243:not(#\9) {
+.awsui_drawer_12i0j_ys4ng_185 > .awsui_drawer-slider_12i0j_ys4ng_243:not(#\9) {
   grid-column: 1;
   grid-row: 1;
   block-size: 100%;

package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js

@@ -2,15 +2,15 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "drawer": "awsui_drawer_12i0j_dpyab_185",
-  "legacy": "awsui_legacy_12i0j_dpyab_200",
-  "last-opened": "awsui_last-opened_12i0j_dpyab_208",
-  "drawer-global": "awsui_drawer-global_12i0j_dpyab_213",
-  "drawer-hidden": "awsui_drawer-hidden_12i0j_dpyab_220",
-  "drawer-content-container": "awsui_drawer-content-container_12i0j_dpyab_223",
-  "drawer-close-button": "awsui_drawer-close-button_12i0j_dpyab_231",
-  "drawer-content": "awsui_drawer-content_12i0j_dpyab_223",
-  "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_dpyab_240",
-  "drawer-slider": "awsui_drawer-slider_12i0j_dpyab_243"
+  "drawer": "awsui_drawer_12i0j_ys4ng_185",
+  "legacy": "awsui_legacy_12i0j_ys4ng_200",
+  "last-opened": "awsui_last-opened_12i0j_ys4ng_208",
+  "drawer-global": "awsui_drawer-global_12i0j_ys4ng_213",
+  "drawer-hidden": "awsui_drawer-hidden_12i0j_ys4ng_220",
+  "drawer-content-container": "awsui_drawer-content-container_12i0j_ys4ng_223",
+  "drawer-close-button": "awsui_drawer-close-button_12i0j_ys4ng_231",
+  "drawer-content": "awsui_drawer-content_12i0j_ys4ng_223",
+  "drawer-content-hidden": "awsui_drawer-content-hidden_12i0j_ys4ng_240",
+  "drawer-slider": "awsui_drawer-slider_12i0j_ys4ng_243"
 };
   

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

@@ -1,9 +1,9 @@
 
     import './styles.scoped.css';
     export default {
-  "navigation": "awsui_navigation_2p2ab_1dfb4_149",
-  "is-navigation-open": "awsui_is-navigation-open_2p2ab_1dfb4_167",
-  "animated-content": "awsui_animated-content_2p2ab_1dfb4_171",
-  "hide-navigation": "awsui_hide-navigation_2p2ab_1dfb4_181"
+  "navigation": "awsui_navigation_2p2ab_3i9d4_149",
+  "is-navigation-open": "awsui_is-navigation-open_2p2ab_3i9d4_167",
+  "animated-content": "awsui_animated-content_2p2ab_3i9d4_171",
+  "hide-navigation": "awsui_hide-navigation_2p2ab_3i9d4_181"
 };
   

package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css

@@ -146,7 +146,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_navigation_2p2ab_1dfb4_149:not(#\9) {
+.awsui_navigation_2p2ab_3i9d4_149:not(#\9) {
   position: sticky;
   z-index: 830;
   background-color: var(--color-background-container-content-myy7cn, #ffffff);
@@ -164,22 +164,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   prevent unwanted text wrapping.
   */
 }
-.awsui_navigation_2p2ab_1dfb4_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_1dfb4_167) {
+.awsui_navigation_2p2ab_3i9d4_149:not(#\9):not(.awsui_is-navigation-open_2p2ab_3i9d4_167) {
   inline-size: 0px;
   display: none;
 }
-.awsui_navigation_2p2ab_1dfb4_149 > .awsui_animated-content_2p2ab_1dfb4_171:not(#\9) {
+.awsui_navigation_2p2ab_3i9d4_149 > .awsui_animated-content_2p2ab_3i9d4_171:not(#\9) {
   inline-size: var(--awsui-navigation-width-g964ok);
 }
 @media (max-width: 688px) {
-  .awsui_navigation_2p2ab_1dfb4_149:not(#\9) {
+  .awsui_navigation_2p2ab_3i9d4_149:not(#\9) {
     --awsui-navigation-width-g964ok: 100vw;
     z-index: 1001;
   }
 }
 
-.awsui_hide-navigation_2p2ab_1dfb4_181:not(#\9) {
+.awsui_hide-navigation_2p2ab_3i9d4_181:not(#\9) {
   position: absolute;
   inset-inline-end: var(--space-m-u91ipm, 16px);
-  inset-block-start: 10px;
+  inset-block-start: 14px;
 }

package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js

@@ -2,9 +2,9 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "navigation": "awsui_navigation_2p2ab_1dfb4_149",
-  "is-navigation-open": "awsui_is-navigation-open_2p2ab_1dfb4_167",
-  "animated-content": "awsui_animated-content_2p2ab_1dfb4_171",
-  "hide-navigation": "awsui_hide-navigation_2p2ab_1dfb4_181"
+  "navigation": "awsui_navigation_2p2ab_3i9d4_149",
+  "is-navigation-open": "awsui_is-navigation-open_2p2ab_3i9d4_167",
+  "animated-content": "awsui_animated-content_2p2ab_3i9d4_171",
+  "hide-navigation": "awsui_hide-navigation_2p2ab_3i9d4_181"
 };
   

package/lib/internal/template/drawer/implementation.js

@@ -20,7 +20,7 @@ export function DrawerImplementation(_a) {
         React.createElement(InternalStatusIndicator, { type: "loading" },
             React.createElement(InternalLiveRegion, { tagName: "span" }, i18n('i18nStrings.loadingText', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.loadingText))))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
         header && React.createElement("div", { className: styles.header }, header),
-        React.createElement("div", { className: styles['test-utils-drawer-content'] }, children)));
+        React.createElement("div", { className: clsx(styles['test-utils-drawer-content'], styles.content) }, children)));
 }
 export const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);
 //# sourceMappingURL=implementation.js.map

package/lib/internal/template/drawer/implementation.js.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/drawer/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,oBAAoB,CAAC,EAOf;QAPe,EACnC,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEG,EADjB,SAAS,cANuB,qEAOpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GACzF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAC/B,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,CACvC,CACG,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO;QACxD,6BAAK,SAAS,EAAE,MAAM,CAAC,2BAA2B,CAAC,IAAG,QAAQ,CAAO,CACjE,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,yBAAyB,CAAC,oBAAoB,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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { DrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type DrawerInternalProps = DrawerProps & InternalBaseComponentProps;\n\nexport function DrawerImplementation({\n  header,\n  children,\n  loading,\n  i18nStrings,\n  __internalRootRef,\n  ...restProps\n}: DrawerInternalProps) {\n  const baseProps = getBaseProps(restProps);\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const i18n = useInternalI18n('drawer');\n  const containerProps = {\n    ...baseProps,\n    className: clsx(baseProps.className, styles.drawer, isToolbar && styles['with-toolbar']),\n  };\n  return loading ? (\n    <div {...containerProps} ref={__internalRootRef}>\n      <InternalStatusIndicator type=\"loading\">\n        <InternalLiveRegion tagName=\"span\">\n          {i18n('i18nStrings.loadingText', i18nStrings?.loadingText)}\n        </InternalLiveRegion>\n      </InternalStatusIndicator>\n    </div>\n  ) : (\n    <div {...containerProps} ref={__internalRootRef}>\n      {header && <div className={styles.header}>{header}</div>}\n      <div className={styles['test-utils-drawer-content']}>{children}</div>\n    </div>\n  );\n}\n\nexport const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);\n"]}
+{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/drawer/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,oBAAoB,CAAC,EAOf;QAPe,EACnC,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEG,EADjB,SAAS,cANuB,qEAOpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GACzF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAC/B,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,CACvC,CACG,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO;QACxD,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,2BAA2B,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,IAAG,QAAQ,CAAO,CACvF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,yBAAyB,CAAC,oBAAoB,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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { DrawerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type DrawerInternalProps = DrawerProps & InternalBaseComponentProps;\n\nexport function DrawerImplementation({\n  header,\n  children,\n  loading,\n  i18nStrings,\n  __internalRootRef,\n  ...restProps\n}: DrawerInternalProps) {\n  const baseProps = getBaseProps(restProps);\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const i18n = useInternalI18n('drawer');\n  const containerProps = {\n    ...baseProps,\n    className: clsx(baseProps.className, styles.drawer, isToolbar && styles['with-toolbar']),\n  };\n  return loading ? (\n    <div {...containerProps} ref={__internalRootRef}>\n      <InternalStatusIndicator type=\"loading\">\n        <InternalLiveRegion tagName=\"span\">\n          {i18n('i18nStrings.loadingText', i18nStrings?.loadingText)}\n        </InternalLiveRegion>\n      </InternalStatusIndicator>\n    </div>\n  ) : (\n    <div {...containerProps} ref={__internalRootRef}>\n      {header && <div className={styles.header}>{header}</div>}\n      <div className={clsx(styles['test-utils-drawer-content'], styles.content)}>{children}</div>\n    </div>\n  );\n}\n\nexport const createWidgetizedDrawer = createWidgetizedComponent(DrawerImplementation);\n"]}

package/lib/internal/template/drawer/styles.css.js

@@ -1,9 +1,10 @@
 
     import './styles.scoped.css';
     export default {
-  "drawer": "awsui_drawer_1sxt8_190p7_177",
-  "with-toolbar": "awsui_with-toolbar_1sxt8_190p7_216",
-  "header": "awsui_header_1sxt8_190p7_220",
-  "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_190p7_256"
+  "drawer": "awsui_drawer_1sxt8_11t5u_177",
+  "header": "awsui_header_1sxt8_11t5u_213",
+  "with-toolbar": "awsui_with-toolbar_1sxt8_11t5u_228",
+  "content": "awsui_content_1sxt8_11t5u_246",
+  "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_11t5u_252"
 };
   

package/lib/internal/template/drawer/styles.scoped.css

@@ -174,7 +174,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_drawer_1sxt8_190p7_177:not(#\9) {
+.awsui_drawer_1sxt8_11t5u_177:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -209,42 +209,32 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
   word-wrap: break-word;
-  padding-block-start: var(--space-panel-header-vertical-d3wku0, 20px);
-  padding-block-end: var(--space-panel-content-bottom-attpcy, 40px);
-  padding-inline-start: var(--space-panel-side-left-1i2jyv, 32px);
-  padding-inline-end: var(--space-panel-side-right-otvpm8, 32px);
-}
-.awsui_drawer_1sxt8_190p7_177.awsui_with-toolbar_1sxt8_190p7_216:not(#\9) {
-  padding-block-start: var(--space-static-m-rufxr5, 16px);
 }
 
-.awsui_header_1sxt8_190p7_220:not(#\9) {
+.awsui_header_1sxt8_11t5u_213:not(#\9) {
   font-size: var(--font-panel-header-size-197c0y, 18px);
   line-height: var(--font-panel-header-line-height-av95ns, 22px);
   font-weight: var(--font-weight-heading-l-ypbqtk, 700);
   -webkit-font-smoothing: var(--font-smoothing-webkit-trr1e8, auto);
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-hyxkxc, auto);
   color: var(--color-text-heading-default-8wpkvf, #16191f);
-  padding-block-end: var(--space-panel-header-vertical-d3wku0, 20px);
+  padding-block: var(--space-panel-header-vertical-d3wku0, 20px);
   padding-inline: var(--space-panel-side-left-1i2jyv, 32px) calc(var(--space-xl-vss8pc, 24px) + var(--space-scaled-xxl-6fqphi, 32px));
   border-block-end: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-panel-header-q2vg1j, #eaeded);
   margin-block-start: 0;
   margin-block-end: var(--space-panel-content-top-rr28ru, 20px);
-  margin-inline-end: calc(-1 * var(--space-panel-side-right-otvpm8, 32px));
-  margin-inline-start: calc(-1 * var(--space-panel-side-left-1i2jyv, 32px));
   /* stylelint-disable @cloudscape-design/no-implicit-descendant, selector-max-type */
   /* stylelint-enable @cloudscape-design/no-implicit-descendant, selector-max-type */
 }
-.awsui_with-toolbar_1sxt8_190p7_216 > .awsui_header_1sxt8_190p7_220:not(#\9) {
+.awsui_with-toolbar_1sxt8_11t5u_228 > .awsui_header_1sxt8_11t5u_213:not(#\9) {
   border-color: transparent;
-  padding-block-end: var(--space-static-m-rufxr5, 16px);
   margin-block-end: 0px;
 }
-.awsui_header_1sxt8_190p7_220 h2:not(#\9),
-.awsui_header_1sxt8_190p7_220 h3:not(#\9),
-.awsui_header_1sxt8_190p7_220 h4:not(#\9),
-.awsui_header_1sxt8_190p7_220 h5:not(#\9),
-.awsui_header_1sxt8_190p7_220 h6:not(#\9) {
+.awsui_header_1sxt8_11t5u_213 h2:not(#\9),
+.awsui_header_1sxt8_11t5u_213 h3:not(#\9),
+.awsui_header_1sxt8_11t5u_213 h4:not(#\9),
+.awsui_header_1sxt8_11t5u_213 h5:not(#\9),
+.awsui_header_1sxt8_11t5u_213 h6:not(#\9) {
   font-size: var(--font-panel-header-size-197c0y, 18px);
   line-height: var(--font-panel-header-line-height-av95ns, 22px);
   font-weight: var(--font-weight-heading-l-ypbqtk, 700);
@@ -254,6 +244,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block: 0;
 }
 
-.awsui_test-utils-drawer-content_1sxt8_190p7_256:not(#\9) {
+.awsui_content_1sxt8_11t5u_246:not(#\9):not(:empty) {
+  padding-inline-start: var(--space-panel-side-left-1i2jyv, 32px);
+  padding-inline-end: var(--space-panel-side-right-otvpm8, 32px);
+  padding-block-end: var(--space-panel-content-bottom-attpcy, 40px);
+}
+
+.awsui_test-utils-drawer-content_1sxt8_11t5u_252:not(#\9) {
   /* used in test-utils */
 }

package/lib/internal/template/drawer/styles.selectors.js

@@ -2,9 +2,10 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "drawer": "awsui_drawer_1sxt8_190p7_177",
-  "with-toolbar": "awsui_with-toolbar_1sxt8_190p7_216",
-  "header": "awsui_header_1sxt8_190p7_220",
-  "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_190p7_256"
+  "drawer": "awsui_drawer_1sxt8_11t5u_177",
+  "header": "awsui_header_1sxt8_11t5u_213",
+  "with-toolbar": "awsui_with-toolbar_1sxt8_11t5u_228",
+  "content": "awsui_content_1sxt8_11t5u_246",
+  "test-utils-drawer-content": "awsui_test-utils-drawer-content_1sxt8_11t5u_252"
 };
   

package/lib/internal/template/help-panel/implementation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,MAAM,sBAAsB,GAAG,cAAc,GAAG,0BAA0B,CAAC;AAEjF,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,sBAAsB,eAuBxB;AAED,eAAO,MAAM,yBAAyB,yFAAqD,CAAC"}
+{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,MAAM,sBAAsB,GAAG,cAAc,GAAG,0BAA0B,CAAC;AAEjF,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,sBAAsB,eAiCxB;AAED,eAAO,MAAM,yBAAyB,yFAAqD,CAAC"}

package/lib/internal/template/help-panel/implementation.js

@@ -16,14 +16,16 @@ export function HelpPanelImplementation(_a) {
     const baseProps = getBaseProps(restProps);
     const isToolbar = useAppLayoutToolbarEnabled();
     const i18n = useInternalI18n('help-panel');
-    const containerProps = Object.assign(Object.assign({}, baseProps), { className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar']) });
+    const containerProps = Object.assign(Object.assign({}, baseProps), { className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar'], loading && styles.loading) });
     return loading ? (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
         React.createElement(InternalStatusIndicator, { type: "loading" },
             React.createElement(InternalLiveRegion, { tagName: "span" }, i18n('loadingText', loadingText))))) : (React.createElement("div", Object.assign({}, containerProps, { ref: __internalRootRef }),
         header && React.createElement("div", { className: clsx(styles.header) }, header),
         React.createElement(LinkDefaultVariantContext.Provider, { value: { defaultVariant: 'primary' } },
             React.createElement("div", { className: styles.content }, children)),
-        footer && React.createElement("div", { className: styles.footer }, footer)));
+        footer && (React.createElement("div", { className: styles.footer },
+            React.createElement("hr", { role: "presentation" }),
+            footer))));
 }
 export const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);
 //# sourceMappingURL=implementation.js.map

package/lib/internal/template/help-panel/implementation.js.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAE7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,uBAAuB,CAAC,EAQf;QARe,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEM,EADpB,SAAS,cAP0B,+EAQvC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,GAChG,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAsB,CAClE,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;YACtE,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CACb;QACpC,MAAM,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO,CACpD,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,yBAAyB,CAAC,uBAAuB,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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { HelpPanelProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type HelpPanelInternalProps = HelpPanelProps & InternalBaseComponentProps;\n\nexport function HelpPanelImplementation({\n  header,\n  footer,\n  children,\n  loading,\n  loadingText,\n  __internalRootRef,\n  ...restProps\n}: HelpPanelInternalProps) {\n  const baseProps = getBaseProps(restProps);\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const i18n = useInternalI18n('help-panel');\n  const containerProps = {\n    ...baseProps,\n    className: clsx(baseProps.className, styles['help-panel'], isToolbar && styles['with-toolbar']),\n  };\n  return loading ? (\n    <div {...containerProps} ref={__internalRootRef}>\n      <InternalStatusIndicator type=\"loading\">\n        <InternalLiveRegion tagName=\"span\">{i18n('loadingText', loadingText)}</InternalLiveRegion>\n      </InternalStatusIndicator>\n    </div>\n  ) : (\n    <div {...containerProps} ref={__internalRootRef}>\n      {header && <div className={clsx(styles.header)}>{header}</div>}\n      <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n        <div className={styles.content}>{children}</div>\n      </LinkDefaultVariantContext.Provider>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </div>\n  );\n}\n\nexport const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);\n"]}
+{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/help-panel/implementation.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAE7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,uBAAuB,MAAM,8BAA8B,CAAC;AAGnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,UAAU,uBAAuB,CAAC,EAQf;QARe,EACtC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,iBAAiB,OAEM,EADpB,SAAS,cAP0B,+EAQvC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,0BAA0B,EAAE,CAAC;IAC/C,MAAM,IAAI,GAAG,eAAe,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,cAAc,mCACf,SAAS,KACZ,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,YAAY,CAAC,EACpB,SAAS,IAAI,MAAM,CAAC,cAAc,CAAC,EACnC,OAAO,IAAI,MAAM,CAAC,OAAO,CAC1B,GACF,CAAC;IACF,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC7C,oBAAC,uBAAuB,IAAC,IAAI,EAAC,SAAS;YACrC,oBAAC,kBAAkB,IAAC,OAAO,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAsB,CAClE,CACtB,CACP,CAAC,CAAC,CAAC,CACF,6CAAS,cAAc,IAAE,GAAG,EAAE,iBAAiB;QAC5C,MAAM,IAAI,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAG,MAAM,CAAO;QAC9D,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;YACtE,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAO,CACb;QACpC,MAAM,IAAI,CACT,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;YAC3B,4BAAI,IAAI,EAAC,cAAc,GAAG;YACzB,MAAM,CACH,CACP,CACG,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,yBAAyB,CAAC,uBAAuB,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 { useAppLayoutToolbarEnabled } from '../app-layout/utils/feature-flags';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport InternalLiveRegion from '../live-region/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport { HelpPanelProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport type HelpPanelInternalProps = HelpPanelProps & InternalBaseComponentProps;\n\nexport function HelpPanelImplementation({\n  header,\n  footer,\n  children,\n  loading,\n  loadingText,\n  __internalRootRef,\n  ...restProps\n}: HelpPanelInternalProps) {\n  const baseProps = getBaseProps(restProps);\n  const isToolbar = useAppLayoutToolbarEnabled();\n  const i18n = useInternalI18n('help-panel');\n  const containerProps = {\n    ...baseProps,\n    className: clsx(\n      baseProps.className,\n      styles['help-panel'],\n      isToolbar && styles['with-toolbar'],\n      loading && styles.loading\n    ),\n  };\n  return loading ? (\n    <div {...containerProps} ref={__internalRootRef}>\n      <InternalStatusIndicator type=\"loading\">\n        <InternalLiveRegion tagName=\"span\">{i18n('loadingText', loadingText)}</InternalLiveRegion>\n      </InternalStatusIndicator>\n    </div>\n  ) : (\n    <div {...containerProps} ref={__internalRootRef}>\n      {header && <div className={clsx(styles.header)}>{header}</div>}\n      <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n        <div className={styles.content}>{children}</div>\n      </LinkDefaultVariantContext.Provider>\n      {footer && (\n        <div className={styles.footer}>\n          <hr role=\"presentation\" />\n          {footer}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const createWidgetizedHelpPanel = createWidgetizedComponent(HelpPanelImplementation);\n"]}

package/lib/internal/template/help-panel/styles.css.js

@@ -1,10 +1,11 @@
 
     import './styles.scoped.css';
     export default {
-  "help-panel": "awsui_help-panel_1d237_1580q_177",
-  "with-toolbar": "awsui_with-toolbar_1d237_1580q_218",
-  "header": "awsui_header_1d237_1580q_352",
-  "content": "awsui_content_1d237_1580q_390",
-  "footer": "awsui_footer_1d237_1580q_438"
+  "help-panel": "awsui_help-panel_1d237_rcn2t_177",
+  "loading": "awsui_loading_1d237_rcn2t_347",
+  "header": "awsui_header_1d237_rcn2t_352",
+  "with-toolbar": "awsui_with-toolbar_1d237_rcn2t_369",
+  "content": "awsui_content_1d237_rcn2t_387",
+  "footer": "awsui_footer_1d237_rcn2t_438"
 };