npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.663 → 3.0.665 - Mend

@cloudscape-design/components-themeable 3.0.663 → 3.0.665

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 (515) hide show

package/lib/internal/template/collection-preferences/styles.selectors.js CHANGED Viewed

@@ -2,42 +2,42 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "visible-content": "awsui_visible-content_tc96w_nj3me_197",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_nj3me_198",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_nj3me_199",
-  "visible-content-group": "awsui_visible-content-group_tc96w_nj3me_199",
-  "visible-content-title": "awsui_visible-content-title_tc96w_nj3me_204",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_nj3me_214",
-  "visible-content-option": "awsui_visible-content-option_tc96w_nj3me_220",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_nj3me_233",
-  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_nj3me_436",
-  "content-display-option-content": "awsui_content-display-option-content_tc96w_nj3me_440",
-  "content-display-option": "awsui_content-display-option_tc96w_nj3me_436",
-  "placeholder": "awsui_placeholder_tc96w_nj3me_490",
-  "sorting": "awsui_sorting_tc96w_nj3me_490",
-  "content-display-option-label": "awsui_content-display-option-label_tc96w_nj3me_517",
-  "drag-overlay": "awsui_drag-overlay_tc96w_nj3me_524",
-  "content-display": "awsui_content-display_tc96w_nj3me_436",
-  "content-display-title": "awsui_content-display-title_tc96w_nj3me_557",
-  "content-display-description": "awsui_content-display-description_tc96w_nj3me_566",
-  "content-display-option-list": "awsui_content-display-option-list_tc96w_nj3me_574",
-  "root": "awsui_root_tc96w_nj3me_581",
-  "modal-root": "awsui_modal-root_tc96w_nj3me_582",
-  "trigger-button": "awsui_trigger-button_tc96w_nj3me_583",
-  "cancel-button": "awsui_cancel-button_tc96w_nj3me_584",
-  "confirm-button": "awsui_confirm-button_tc96w_nj3me_585",
-  "custom": "awsui_custom_tc96w_nj3me_586",
-  "second-column-small": "awsui_second-column-small_tc96w_nj3me_590",
-  "wrap-lines": "awsui_wrap-lines_tc96w_nj3me_594",
-  "striped-rows": "awsui_striped-rows_tc96w_nj3me_595",
-  "content-density": "awsui_content-density_tc96w_nj3me_596",
-  "page-size": "awsui_page-size_tc96w_nj3me_597",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_nj3me_598",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_nj3me_599",
-  "sticky-columns": "awsui_sticky-columns_tc96w_nj3me_600",
-  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_nj3me_601",
-  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_nj3me_602",
-  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_nj3me_603",
-  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_nj3me_604"
+  "visible-content": "awsui_visible-content_tc96w_pyuzd_193",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_pyuzd_194",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_pyuzd_195",
+  "visible-content-group": "awsui_visible-content-group_tc96w_pyuzd_195",
+  "visible-content-title": "awsui_visible-content-title_tc96w_pyuzd_200",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_pyuzd_210",
+  "visible-content-option": "awsui_visible-content-option_tc96w_pyuzd_216",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_pyuzd_229",
+  "content-display-option-toggle": "awsui_content-display-option-toggle_tc96w_pyuzd_428",
+  "content-display-option-content": "awsui_content-display-option-content_tc96w_pyuzd_432",
+  "content-display-option": "awsui_content-display-option_tc96w_pyuzd_428",
+  "placeholder": "awsui_placeholder_tc96w_pyuzd_482",
+  "sorting": "awsui_sorting_tc96w_pyuzd_482",
+  "content-display-option-label": "awsui_content-display-option-label_tc96w_pyuzd_509",
+  "drag-overlay": "awsui_drag-overlay_tc96w_pyuzd_516",
+  "content-display": "awsui_content-display_tc96w_pyuzd_428",
+  "content-display-title": "awsui_content-display-title_tc96w_pyuzd_549",
+  "content-display-description": "awsui_content-display-description_tc96w_pyuzd_558",
+  "content-display-option-list": "awsui_content-display-option-list_tc96w_pyuzd_566",
+  "root": "awsui_root_tc96w_pyuzd_573",
+  "modal-root": "awsui_modal-root_tc96w_pyuzd_574",
+  "trigger-button": "awsui_trigger-button_tc96w_pyuzd_575",
+  "cancel-button": "awsui_cancel-button_tc96w_pyuzd_576",
+  "confirm-button": "awsui_confirm-button_tc96w_pyuzd_577",
+  "custom": "awsui_custom_tc96w_pyuzd_578",
+  "second-column-small": "awsui_second-column-small_tc96w_pyuzd_582",
+  "wrap-lines": "awsui_wrap-lines_tc96w_pyuzd_586",
+  "striped-rows": "awsui_striped-rows_tc96w_pyuzd_587",
+  "content-density": "awsui_content-density_tc96w_pyuzd_588",
+  "page-size": "awsui_page-size_tc96w_pyuzd_589",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_pyuzd_590",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_pyuzd_591",
+  "sticky-columns": "awsui_sticky-columns_tc96w_pyuzd_592",
+  "sticky-columns-form-field": "awsui_sticky-columns-form-field_tc96w_pyuzd_593",
+  "sticky-columns-radio-group": "awsui_sticky-columns-radio-group_tc96w_pyuzd_594",
+  "sticky-columns-first": "awsui_sticky-columns-first_tc96w_pyuzd_595",
+  "sticky-columns-last": "awsui_sticky-columns-last_tc96w_pyuzd_596"
 };

package/lib/internal/template/column-layout/styles.css.js CHANGED Viewed

@@ -1,18 +1,18 @@
     import './styles.scoped.css';
     export default {
-  "column-layout": "awsui_column-layout_vvxn7_1b733_99",
-  "grid": "awsui_grid_vvxn7_1b733_134",
-  "grid-no-gutters": "awsui_grid-no-gutters_vvxn7_1b733_140",
-  "grid-variant-text-grid": "awsui_grid-variant-text-grid_vvxn7_1b733_144",
-  "grid-breakpoint-default": "awsui_grid-breakpoint-default_vvxn7_1b733_152",
-  "grid-columns-1": "awsui_grid-columns-1_vvxn7_1b733_155",
-  "grid-breakpoint-xxs": "awsui_grid-breakpoint-xxs_vvxn7_1b733_155",
-  "grid-breakpoint-xs": "awsui_grid-breakpoint-xs_vvxn7_1b733_158",
-  "grid-columns-2": "awsui_grid-columns-2_vvxn7_1b733_161",
-  "grid-columns-3": "awsui_grid-columns-3_vvxn7_1b733_167",
-  "grid-columns-4": "awsui_grid-columns-4_vvxn7_1b733_173",
-  "grid-vertical-borders": "awsui_grid-vertical-borders_vvxn7_1b733_189",
-  "grid-horizontal-borders": "awsui_grid-horizontal-borders_vvxn7_1b733_222"
+  "column-layout": "awsui_column-layout_vvxn7_1151i_97",
+  "grid": "awsui_grid_vvxn7_1151i_132",
+  "grid-no-gutters": "awsui_grid-no-gutters_vvxn7_1151i_138",
+  "grid-variant-text-grid": "awsui_grid-variant-text-grid_vvxn7_1151i_142",
+  "grid-breakpoint-default": "awsui_grid-breakpoint-default_vvxn7_1151i_150",
+  "grid-columns-1": "awsui_grid-columns-1_vvxn7_1151i_153",
+  "grid-breakpoint-xxs": "awsui_grid-breakpoint-xxs_vvxn7_1151i_153",
+  "grid-breakpoint-xs": "awsui_grid-breakpoint-xs_vvxn7_1151i_156",
+  "grid-columns-2": "awsui_grid-columns-2_vvxn7_1151i_159",
+  "grid-columns-3": "awsui_grid-columns-3_vvxn7_1151i_165",
+  "grid-columns-4": "awsui_grid-columns-4_vvxn7_1151i_171",
+  "grid-vertical-borders": "awsui_grid-vertical-borders_vvxn7_1151i_187",
+  "grid-horizontal-borders": "awsui_grid-horizontal-borders_vvxn7_1151i_220"
 };

package/lib/internal/template/column-layout/styles.scoped.css CHANGED Viewed

@@ -6,8 +6,6 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-/* stylelint-disable plugin/no-unsupported-browser-features */
-/* stylelint-enable plugin/no-unsupported-browser-features */
 /*
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
@@ -96,7 +94,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
 */
-div.awsui_column-layout_vvxn7_1b733_99:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -132,140 +130,140 @@ div.awsui_column-layout_vvxn7_1b733_99:not(#\9) {
   -moz-osx-font-smoothing: auto;
   word-wrap: break-word;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132:not(#\9) {
   margin-block: calc(var(--space-grid-gutter-fzqbbi, 20px) / -2);
   margin-inline: calc(var(--space-grid-gutter-fzqbbi, 20px) / -2);
   /* stylelint-disable-next-line selector-max-universal */
   /* stylelint-disable-next-line selector-max-universal */
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-no-gutters_vvxn7_1b733_140:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-no-gutters_vvxn7_1151i_138:not(#\9) {
   margin-block: 0;
   margin-inline: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142:not(#\9) {
   /* stylelint-disable-next-line selector-max-universal */
   margin-block: calc(-1 * var(--space-grid-gutter-fzqbbi, 20px) / 2);
   margin-inline: calc(-1 * var(--space-grid-gutter-fzqbbi, 20px));
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144 > *:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142 > *:not(#\9) {
   border-inline-start: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-default-in8dkg, #eaeded);
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-breakpoint-default_vvxn7_1b733_152 > *:not(#\9):nth-child(1n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-breakpoint-default_vvxn7_1151i_150 > *:not(#\9):nth-child(1n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-1_vvxn7_1b733_155.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(1n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-1_vvxn7_1151i_153.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(1n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-1_vvxn7_1b733_155.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(1n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-1_vvxn7_1151i_153.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(1n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(2n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(3n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(3n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-variant-text-grid_vvxn7_1b733_144.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(4n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-variant-text-grid_vvxn7_1151i_142.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(4n+1) {
   border-inline-start-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134:not(#\9):not(.awsui_grid-no-gutters_vvxn7_1b733_140) > * {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132:not(#\9):not(.awsui_grid-no-gutters_vvxn7_1151i_138) > * {
   padding-block: calc(var(--space-grid-gutter-fzqbbi, 20px) / 2);
   padding-inline: calc(var(--space-grid-gutter-fzqbbi, 20px) / 2);
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134:not(#\9):not(.awsui_grid-no-gutters_vvxn7_1b733_140).awsui_grid-variant-text-grid_vvxn7_1b733_144 > * {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132:not(#\9):not(.awsui_grid-no-gutters_vvxn7_1151i_138).awsui_grid-variant-text-grid_vvxn7_1151i_142 > * {
   padding-block: 0;
   padding-inline: var(--space-grid-gutter-fzqbbi, 20px);
   margin-block: calc(var(--space-grid-gutter-fzqbbi, 20px) / 2);
   margin-inline: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187:not(#\9) {
   /* stylelint-disable-next-line selector-max-universal */
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189 > *:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187 > *:not(#\9) {
   border-inline-end: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-default-in8dkg, #eaeded);
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-breakpoint-default_vvxn7_1b733_152 > *:not(#\9):nth-child(1n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-breakpoint-default_vvxn7_1151i_150 > *:not(#\9):nth-child(1n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-1_vvxn7_1b733_155.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(1n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-1_vvxn7_1151i_153.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(1n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-1_vvxn7_1b733_155.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(1n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-1_vvxn7_1151i_153.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(1n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(2n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(2n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(3n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(3n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-child(2n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-child(2n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-vertical-borders_vvxn7_1b733_189.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-child(4n) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-vertical-borders_vvxn7_1151i_187.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-child(4n) {
   border-inline-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220:not(#\9) {
   /* stylelint-disable selector-max-universal */
   /* stylelint-enable selector-max-universal */
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222 > *:not(#\9) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220 > *:not(#\9) {
   border-block-end: var(--border-divider-section-width-wl9k66, 1px) solid var(--color-border-divider-default-in8dkg, #eaeded);
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222 > *:not(#\9):last-child {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220 > *:not(#\9):last-child {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-2_vvxn7_1b733_161.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-2_vvxn7_1151i_159.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(3n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(3n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(3n+2) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(3n+2) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-3_vvxn7_1b733_167.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(3):nth-child(3n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-3_vvxn7_1151i_165.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(3):nth-child(3n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xxs_vvxn7_1b733_155 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xxs_vvxn7_1151i_153 > *:not(#\9):nth-last-child(2):nth-child(2n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(4n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(4n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(4n+2) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(4n+2) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(2):nth-child(4n+3) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(2):nth-child(4n+3) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(3):nth-child(4n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(3):nth-child(4n+1) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(3):nth-child(4n+2) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(3):nth-child(4n+2) {
   border-block-end-width: 0;
 }
-div.awsui_column-layout_vvxn7_1b733_99 > .awsui_grid_vvxn7_1b733_134.awsui_grid-horizontal-borders_vvxn7_1b733_222.awsui_grid-columns-4_vvxn7_1b733_173.awsui_grid-breakpoint-xs_vvxn7_1b733_158 > *:not(#\9):nth-last-child(4):nth-child(4n+1) {
+div.awsui_column-layout_vvxn7_1151i_97 > .awsui_grid_vvxn7_1151i_132.awsui_grid-horizontal-borders_vvxn7_1151i_220.awsui_grid-columns-4_vvxn7_1151i_171.awsui_grid-breakpoint-xs_vvxn7_1151i_156 > *:not(#\9):nth-last-child(4):nth-child(4n+1) {
   border-block-end-width: 0;
 }

package/lib/internal/template/column-layout/styles.selectors.js CHANGED Viewed

@@ -2,18 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "column-layout": "awsui_column-layout_vvxn7_1b733_99",
-  "grid": "awsui_grid_vvxn7_1b733_134",
-  "grid-no-gutters": "awsui_grid-no-gutters_vvxn7_1b733_140",
-  "grid-variant-text-grid": "awsui_grid-variant-text-grid_vvxn7_1b733_144",
-  "grid-breakpoint-default": "awsui_grid-breakpoint-default_vvxn7_1b733_152",
-  "grid-columns-1": "awsui_grid-columns-1_vvxn7_1b733_155",
-  "grid-breakpoint-xxs": "awsui_grid-breakpoint-xxs_vvxn7_1b733_155",
-  "grid-breakpoint-xs": "awsui_grid-breakpoint-xs_vvxn7_1b733_158",
-  "grid-columns-2": "awsui_grid-columns-2_vvxn7_1b733_161",
-  "grid-columns-3": "awsui_grid-columns-3_vvxn7_1b733_167",
-  "grid-columns-4": "awsui_grid-columns-4_vvxn7_1b733_173",
-  "grid-vertical-borders": "awsui_grid-vertical-borders_vvxn7_1b733_189",
-  "grid-horizontal-borders": "awsui_grid-horizontal-borders_vvxn7_1b733_222"
+  "column-layout": "awsui_column-layout_vvxn7_1151i_97",
+  "grid": "awsui_grid_vvxn7_1151i_132",
+  "grid-no-gutters": "awsui_grid-no-gutters_vvxn7_1151i_138",
+  "grid-variant-text-grid": "awsui_grid-variant-text-grid_vvxn7_1151i_142",
+  "grid-breakpoint-default": "awsui_grid-breakpoint-default_vvxn7_1151i_150",
+  "grid-columns-1": "awsui_grid-columns-1_vvxn7_1151i_153",
+  "grid-breakpoint-xxs": "awsui_grid-breakpoint-xxs_vvxn7_1151i_153",
+  "grid-breakpoint-xs": "awsui_grid-breakpoint-xs_vvxn7_1151i_156",
+  "grid-columns-2": "awsui_grid-columns-2_vvxn7_1151i_159",
+  "grid-columns-3": "awsui_grid-columns-3_vvxn7_1151i_165",
+  "grid-columns-4": "awsui_grid-columns-4_vvxn7_1151i_171",
+  "grid-vertical-borders": "awsui_grid-vertical-borders_vvxn7_1151i_187",
+  "grid-horizontal-borders": "awsui_grid-horizontal-borders_vvxn7_1151i_220"
 };

package/lib/internal/template/container/internal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,~~KAA4B~~,MAAM,OAAO,CAAC;~~AACjD~~,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;~~AAG9C~~,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;~~AAOlF~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAM1E,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAkB,EAClB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,~~eAsHxB~~"}
1	+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAM1E,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAkB,EAClB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eAoGxB"}

package/lib/internal/template/container/internal.js CHANGED Viewed

@@ -2,11 +2,9 @@ import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import clsx from 'clsx';
-import React, { useEffect, useRef } from 'react';
+import React, { useRef } from 'react';
 import { getBaseProps } from '../internal/base-component';
-import { useAppLayoutContext } from '../internal/context/app-layout-context';
 import { StickyHeaderContext, useStickyHeader } from './use-sticky-header';
-import { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';
 import { useMergeRefs } from '../internal/hooks/use-merge-refs';
 import { useMobile } from '../internal/hooks/use-mobile';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
@@ -25,33 +23,15 @@ export default function InternalContainer(_a) {
     var _b;
     var { header, footer, children, variant = 'default', disableHeaderPaddings = false, disableContentPaddings = false, fitHeight, media, __stickyOffset, __mobileStickyOffset, __stickyHeader = false, __internalRootRef = null, __disableFooterDivider = false, __disableFooterPaddings = false, __hiddenContent = false, __headerRef, __fullPage = false, __disableStickyMobile = true, __funnelSubStepProps, __subStepRef } = _a, restProps = __rest(_a, ["header", "footer", "children", "variant", "disableHeaderPaddings", "disableContentPaddings", "fitHeight", "media", "__stickyOffset", "__mobileStickyOffset", "__stickyHeader", "__internalRootRef", "__disableFooterDivider", "__disableFooterPaddings", "__hiddenContent", "__headerRef", "__fullPage", "__disableStickyMobile", "__funnelSubStepProps", "__subStepRef"]);
     const isMobile = useMobile();
+    const isRefresh = useVisualRefresh();
     const baseProps = getBaseProps(restProps);
     const rootRef = useRef(null);
     const headerRef = useRef(null);
-    const { isSticky, isStuck, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset, __mobileStickyOffset, __disableStickyMobile);
+    const { isSticky, isStuck, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset, __mobileStickyOffset, __disableStickyMobile, __fullPage && isRefresh && !isMobile);
     const contentId = useUniqueId();
-    const { setHasStickyBackground } = useAppLayoutContext();
-    const isRefresh = useVisualRefresh();
     const hasDynamicHeight = isRefresh && variant === 'full-page';
-    const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__fullPage });
     const mergedRef = useMergeRefs(rootRef, __internalRootRef);
-    const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);
-    /**
-     * The visual refresh AppLayout component needs to know if a child component
-     * has a high contrast sticky header. This is to make sure the background element
-     * stays in the same vertical position as the header content.
-     */
-    useEffect(() => {
-        const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;
-        if (shouldUpdateStickyBackground) {
-            setHasStickyBackground(true);
-        }
-        return () => {
-            if (shouldUpdateStickyBackground) {
-                setHasStickyBackground(false);
-            }
-        };
-    }, [isSticky, setHasStickyBackground, variant]);
+    const headerMergedRef = useMergeRefs(headerRef, __headerRef);
     // The container is only sticky on mobile if it is the header for the table.
     // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.
     const shouldHaveStickyStyles = isSticky && !isMobile;
@@ -72,7 +52,9 @@ export default function InternalContainer(_a) {
                             [styles['with-toolbar']]: hasToolbar,
                             [styles['with-hidden-content']]: !children || __hiddenContent,
                             [styles['header-with-media']]: hasMedia,
-                        }) }, stickyStyles, { ref: headerMergedRef }), header)))),
+                        }) }, stickyStyles, { ref: headerMergedRef }),
+                        isStuck && !isMobile && isRefresh && __fullPage && React.createElement("div", { className: styles['header-cover'] }),
+                        header)))),
             React.createElement("div", { className: clsx(styles.content, fitHeight && styles['content-fit-height'], {
                     [styles['with-paddings']]: !disableContentPaddings,
                 }) }, children),

package/lib/internal/template/container/internal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { getGlobalFlag } from '../internal/utils/global-flags';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __fullPage?: boolean;\n __disableStickyMobile?: boolean;\n /*\n Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n /\n variant?: ContainerProps['variant'] \| 'embedded' \| 'full-page' \| 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __fullPage = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile\n );\n const contentId = useUniqueId();\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight \|\| !__fullPage });\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n\n /\n The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const hasToolbar = getGlobalFlag('appLayoutWidget');\n const mediaPosition = media?.position ?? 'top';\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height \|\| '' } : { width: media?.width \|\| '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <ContainerHeaderContextProvider>\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(isRefresh && styles.refresh, styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-toolbar']]: hasToolbar,\n [styles['with-hidden-content']]: !children \|\| __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n })}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {header}\n </div>\n </StickyHeaderContext.Provider>\n </ContainerHeaderContextProvider>\n )}\n <div\n className={clsx(styles.content, fitHeight && styles['content-fit-height'], {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { getGlobalFlag } from '../internal/utils/global-flags';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __mobileStickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __fullPage?: boolean;\n __disableStickyMobile?: boolean;\n /*\n Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] \| 'embedded' \| 'full-page' \| 'cards';\n\n __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const modalContext = useModalContext();\n\n return (\n <InternalContainer\n {...props}\n __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n />\n );\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n media,\n __stickyOffset,\n __mobileStickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __fullPage = false,\n __disableStickyMobile = true,\n __funnelSubStepProps,\n __subStepRef,\n ...restProps\n}: InternalContainerProps) {\n const isMobile = useMobile();\n const isRefresh = useVisualRefresh();\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n rootRef,\n headerRef,\n __stickyHeader,\n __stickyOffset,\n __mobileStickyOffset,\n __disableStickyMobile,\n __fullPage && isRefresh && !isMobile\n );\n const contentId = useUniqueId();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, __headerRef);\n\n // The container is only sticky on mobile if it is the header for the table.\n // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n const shouldHaveStickyStyles = isSticky && !isMobile;\n\n const hasMedia = !!media?.content;\n const hasToolbar = getGlobalFlag('appLayoutWidget');\n const mediaPosition = media?.position ?? 'top';\n return (\n <div\n {...baseProps}\n {...__funnelSubStepProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['fit-height'],\n hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n shouldHaveStickyStyles && [styles['sticky-enabled']],\n isRefresh && styles.refresh\n )}\n ref={mergedRef}\n >\n {hasMedia && (\n <div\n className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n style={mediaPosition === 'top' ? { height: media?.height \|\| '' } : { width: media?.width \|\| '' }}\n >\n {media.content}\n </div>\n )}\n <div\n id={contentId}\n ref={__subStepRef}\n className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n >\n {header && (\n <ContainerHeaderContextProvider>\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(isRefresh && styles.refresh, styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-toolbar']]: hasToolbar,\n [styles['with-hidden-content']]: !children \|\| __hiddenContent,\n [styles['header-with-media']]: hasMedia,\n })}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {isStuck && !isMobile && isRefresh && __fullPage && <div className={styles['header-cover']}></div>}\n {header}\n </div>\n </StickyHeaderContext.Provider>\n </ContainerHeaderContextProvider>\n )}\n <div\n className={clsx(styles.content, fitHeight && styles['content-fit-height'], {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n );\n}\n"]}

package/lib/internal/template/container/styles.css.js CHANGED Viewed

@@ -1,34 +1,35 @@
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_14iqq_evm42_103",
-  "fit-height": "awsui_fit-height_14iqq_evm42_139",
-  "with-side-media": "awsui_with-side-media_14iqq_evm42_144",
-  "variant-default": "awsui_variant-default_14iqq_evm42_147",
-  "variant-stacked": "awsui_variant-stacked_14iqq_evm42_147",
-  "refresh": "awsui_refresh_14iqq_evm42_155",
-  "sticky-enabled": "awsui_sticky-enabled_14iqq_evm42_205",
-  "with-top-media": "awsui_with-top-media_14iqq_evm42_217",
-  "content-wrapper": "awsui_content-wrapper_14iqq_evm42_222",
-  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_evm42_227",
-  "media": "awsui_media_14iqq_evm42_234",
-  "media-top": "awsui_media-top_14iqq_evm42_252",
-  "media-side": "awsui_media-side_14iqq_evm42_257",
-  "header": "awsui_header_14iqq_evm42_263",
-  "header-with-media": "awsui_header-with-media_14iqq_evm42_268",
-  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_evm42_274",
-  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_evm42_278",
-  "header-stuck": "awsui_header-stuck_14iqq_evm42_284",
-  "header-variant-cards": "awsui_header-variant-cards_14iqq_evm42_294",
-  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_evm42_297",
-  "with-paddings": "awsui_with-paddings_14iqq_evm42_303",
-  "with-hidden-content": "awsui_with-hidden-content_14iqq_evm42_312",
-  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_evm42_370",
-  "with-toolbar": "awsui_with-toolbar_14iqq_evm42_370",
-  "content": "awsui_content_14iqq_evm42_222",
-  "content-fit-height": "awsui_content-fit-height_14iqq_evm42_397",
-  "content-with-media": "awsui_content-with-media_14iqq_evm42_407",
-  "footer": "awsui_footer_14iqq_evm42_411",
-  "with-divider": "awsui_with-divider_14iqq_evm42_415"
+  "root": "awsui_root_14iqq_1abie_101",
+  "fit-height": "awsui_fit-height_14iqq_1abie_137",
+  "with-side-media": "awsui_with-side-media_14iqq_1abie_142",
+  "variant-default": "awsui_variant-default_14iqq_1abie_145",
+  "variant-stacked": "awsui_variant-stacked_14iqq_1abie_145",
+  "refresh": "awsui_refresh_14iqq_1abie_153",
+  "sticky-enabled": "awsui_sticky-enabled_14iqq_1abie_203",
+  "with-top-media": "awsui_with-top-media_14iqq_1abie_215",
+  "content-wrapper": "awsui_content-wrapper_14iqq_1abie_220",
+  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_1abie_225",
+  "media": "awsui_media_14iqq_1abie_232",
+  "media-top": "awsui_media-top_14iqq_1abie_250",
+  "media-side": "awsui_media-side_14iqq_1abie_255",
+  "header": "awsui_header_14iqq_1abie_261",
+  "header-with-media": "awsui_header-with-media_14iqq_1abie_266",
+  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1abie_272",
+  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1abie_276",
+  "header-stuck": "awsui_header-stuck_14iqq_1abie_282",
+  "header-variant-cards": "awsui_header-variant-cards_14iqq_1abie_292",
+  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1abie_295",
+  "with-paddings": "awsui_with-paddings_14iqq_1abie_301",
+  "with-hidden-content": "awsui_with-hidden-content_14iqq_1abie_310",
+  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_1abie_368",
+  "with-toolbar": "awsui_with-toolbar_14iqq_1abie_368",
+  "header-cover": "awsui_header-cover_14iqq_1abie_374",
+  "content": "awsui_content_14iqq_1abie_220",
+  "content-fit-height": "awsui_content-fit-height_14iqq_1abie_402",
+  "content-with-media": "awsui_content-with-media_14iqq_1abie_412",
+  "footer": "awsui_footer_14iqq_1abie_416",
+  "with-divider": "awsui_with-divider_14iqq_1abie_420"
 };