@cloudscape-design/components-themeable 3.0.321 → 3.0.322

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "88e7a4bff5b3c6ed1f1e5ac600dd3f69b6d0f639"
+  "commit": "720ad75ce9d6b889ac7c439b52425ec7ed5585dd"
 }

package/lib/internal/scss/container/styles.scss

@@ -16,6 +16,9 @@
     display: flex;
     flex-direction: column;
     height: 100%;
+    &.with-side-media {
+      flex-direction: row;
+    }
   }
 
   &.variant {
@@ -61,11 +64,65 @@
   }
 }
 
+.with-side-media {
+  display: flex;
+  flex-direction: row;
+}
+
+.with-top-media {
+  display: flex;
+  flex-direction: column;
+}
+
+.content-wrapper {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  &-fit-height {
+    height: 100%;
+    overflow: hidden;
+  }
+}
+
+.media {
+  overflow: hidden;
+  flex-shrink: 0;
+
+  // stylelint-disable-next-line @cloudscape-design/no-implicit-descendant, selector-max-type
+  img,
+  video,
+  picture {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    object-position: center;
+  }
+
+  &-top {
+    max-height: 66%;
+    border-top-left-radius: awsui.$border-radius-container;
+    border-top-right-radius: awsui.$border-radius-container;
+  }
+
+  &-side {
+    max-width: 66%;
+    border-top-left-radius: awsui.$border-radius-container;
+    border-bottom-left-radius: awsui.$border-radius-container;
+  }
+}
+
 .header {
   background-color: awsui.$color-background-container-header;
   border-top-left-radius: awsui.$border-radius-container;
   border-top-right-radius: awsui.$border-radius-container;
 
+  &.header-with-media {
+    background: none;
+    &:not(:empty) {
+      border-bottom: none;
+    }
+  }
+
   // sticky positioning may be disabled (on mobile or if browser does not support it),
   // but some markup still requires a new stacking context
   &-sticky-disabled {
@@ -151,8 +208,8 @@ the default white background of the container component.
 }
 
 .content {
-  .fit-height > & {
-    flex: 1;
+  flex: 1;
+  &-fit-height {
     overflow: auto;
   }
   &.with-paddings {
@@ -160,6 +217,9 @@ the default white background of the container component.
 
     .header + & {
       padding-top: awsui.$space-container-content-top;
+      &.content-with-media {
+        padding-top: 0;
+      }
     }
   }
 }

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

@@ -102,12 +102,6 @@
   strong {
     font-weight: styles.$font-weight-bold;
   }
-  a {
-    @include styles.link-default;
-    &:focus {
-      @include styles.link-focus;
-    }
-  }
 
   .header {
     @include styles.font-panel-header;
@@ -144,6 +138,10 @@
   h6:first-child {
     margin-top: 0;
   }
+
+  a {
+    @include styles.link-inline;
+  }
 }
 
 .footer {
@@ -158,4 +156,14 @@
     list-style: none;
     padding-left: 0;
   }
+  a {
+    @include styles.link-default;
+  }
+}
+
+.content,
+.footer {
+  a:focus {
+    @include styles.link-focus;
+  }
 }

package/lib/internal/scss/internal/styles/utils/theming.scss

@@ -3,9 +3,11 @@
  SPDX-License-Identifier: Apache-2.0
 */
 @mixin dark-mode-only($selector: '') {
-  /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
-  :global(#{$selector}.awsui-polaris-dark-mode) &,
-  :global(#{$selector}.awsui-dark-mode) & {
-    @content;
+  @media not print {
+    /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
+    :global(#{$selector}.awsui-polaris-dark-mode) &,
+    :global(#{$selector}.awsui-dark-mode) & {
+      @content;
+    }
   }
 }

package/lib/internal/scss/text-content/styles.scss

@@ -72,7 +72,7 @@
   }
   /* stylelint-disable no-descending-specificity */
   a {
-    @include styles.link-default;
+    @include styles.link-inline;
 
     &:focus {
       @include styles.link-focus;

package/lib/internal/template/code-editor/resizable-box/styles.css.js

@@ -1,8 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "resizable-box": "awsui_resizable-box_cufu9_wgr8z_17",
-  "resizable-box-handle": "awsui_resizable-box-handle_cufu9_wgr8z_22",
-  "resize-active": "awsui_resize-active_cufu9_wgr8z_59"
+  "resizable-box": "awsui_resizable-box_cufu9_1cxge_17",
+  "resizable-box-handle": "awsui_resizable-box-handle_cufu9_1cxge_22",
+  "resize-active": "awsui_resize-active_cufu9_1cxge_63"
 };
   

package/lib/internal/template/code-editor/resizable-box/styles.scoped.css

@@ -14,12 +14,12 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_resizable-box_cufu9_wgr8z_17:not(#\9) {
+.awsui_resizable-box_cufu9_1cxge_17:not(#\9) {
   position: relative;
   width: 100%;
 }
 
-.awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
+.awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
   position: absolute;
   right: 0;
   bottom: 0;
@@ -37,26 +37,30 @@
   cursor: ns-resize;
 }
 @supports (--css-variable-support-check: #000) {
-  .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
-    /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
-  }
-  .awsui-polaris-dark-mode .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9), .awsui-dark-mode .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
-    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23687078' fill-opacity='0' stroke-width='1'%3E %3Cpath d='M 8 13 L 13 8 M 13 11 L 11 13 M 5 13 L 13 5'/%3E %3C/svg%3E");
+  @media not print {
+    .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
+      /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
+    }
+    .awsui-polaris-dark-mode .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9), .awsui-dark-mode .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
+      background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23687078' fill-opacity='0' stroke-width='1'%3E %3Cpath d='M 8 13 L 13 8 M 13 11 L 11 13 M 5 13 L 13 5'/%3E %3C/svg%3E");
+    }
   }
 }
 @supports (--css-variable-support-check: #000) {
-  .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
-    /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
-  }
-  .awsui-visual-refresh .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
+  .awsui-visual-refresh .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
     background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23414d5c' fill-opacity='0' stroke-width='1'%3E %3Cpath d='M 8 13 L 13 8 M 13 11 L 11 13 M 5 13 L 13 5'/%3E %3C/svg%3E");
   }
-  .awsui-visual-refresh.awsui-polaris-dark-mode .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9), .awsui-visual-refresh.awsui-dark-mode .awsui_resizable-box-handle_cufu9_wgr8z_22:not(#\9) {
-    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23d1d5db' fill-opacity='0' stroke-width='1'%3E %3Cpath d='M 8 13 L 13 8 M 13 11 L 11 13 M 5 13 L 13 5'/%3E %3C/svg%3E");
+  @media not print {
+    .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
+      /* stylelint-disable selector-combinator-disallowed-list, selector-class-pattern */
+    }
+    .awsui-visual-refresh.awsui-polaris-dark-mode .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9), .awsui-visual-refresh.awsui-dark-mode .awsui_resizable-box-handle_cufu9_1cxge_22:not(#\9) {
+      background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23d1d5db' fill-opacity='0' stroke-width='1'%3E %3Cpath d='M 8 13 L 13 8 M 13 11 L 11 13 M 5 13 L 13 5'/%3E %3C/svg%3E");
+    }
   }
 }
 
-.awsui_resize-active_cufu9_wgr8z_59:not(#\9) {
+.awsui_resize-active_cufu9_1cxge_63:not(#\9) {
   -webkit-user-select: none;
           user-select: none;
 }

package/lib/internal/template/code-editor/resizable-box/styles.selectors.js

@@ -2,8 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "resizable-box": "awsui_resizable-box_cufu9_wgr8z_17",
-  "resizable-box-handle": "awsui_resizable-box-handle_cufu9_wgr8z_22",
-  "resize-active": "awsui_resize-active_cufu9_wgr8z_59"
+  "resizable-box": "awsui_resizable-box_cufu9_1cxge_17",
+  "resizable-box-handle": "awsui_resizable-box-handle_cufu9_1cxge_22",
+  "resize-active": "awsui_resize-active_cufu9_1cxge_63"
 };
   

package/lib/internal/template/code-editor/styles.css.js

@@ -1,37 +1,37 @@
 
     import './styles.scoped.css';
     export default {
-  "code-editor": "awsui_code-editor_1gl9c_11y0o_98",
-  "code-editor-refresh": "awsui_code-editor-refresh_1gl9c_11y0o_534",
-  "pane": "awsui_pane_1gl9c_11y0o_546",
-  "pane__close-container": "awsui_pane__close-container_1gl9c_11y0o_557",
-  "pane__list": "awsui_pane__list_1gl9c_11y0o_562",
-  "pane__table": "awsui_pane__table_1gl9c_11y0o_569",
-  "pane__item": "awsui_pane__item_1gl9c_11y0o_574",
-  "pane__cell": "awsui_pane__cell_1gl9c_11y0o_574",
-  "pane__item--highlighted": "awsui_pane__item--highlighted_1gl9c_11y0o_588",
-  "pane__location": "awsui_pane__location_1gl9c_11y0o_609",
-  "pane__description": "awsui_pane__description_1gl9c_11y0o_609",
-  "focus-lock": "awsui_focus-lock_1gl9c_11y0o_624",
-  "editor": "awsui_editor_1gl9c_11y0o_649",
-  "editor-refresh": "awsui_editor-refresh_1gl9c_11y0o_677",
-  "status-bar": "awsui_status-bar_1gl9c_11y0o_682",
-  "status-bar-with-hidden-pane": "awsui_status-bar-with-hidden-pane_1gl9c_11y0o_691",
-  "status-bar__left": "awsui_status-bar__left_1gl9c_11y0o_695",
-  "status-bar__left-virtual": "awsui_status-bar__left-virtual_1gl9c_11y0o_702",
-  "status-bar__right": "awsui_status-bar__right_1gl9c_11y0o_706",
-  "status-bar__language-mode": "awsui_status-bar__language-mode_1gl9c_11y0o_710",
-  "status-bar__cursor-position": "awsui_status-bar__cursor-position_1gl9c_11y0o_710",
-  "status-bar__cog-button": "awsui_status-bar__cog-button_1gl9c_11y0o_715",
-  "status-bar-virtual": "awsui_status-bar-virtual_1gl9c_11y0o_719",
-  "tab-button": "awsui_tab-button_1gl9c_11y0o_725",
-  "tab-button--refresh": "awsui_tab-button--refresh_1gl9c_11y0o_738",
-  "tab-button--active": "awsui_tab-button--active_1gl9c_11y0o_752",
-  "tab-button--disabled": "awsui_tab-button--disabled_1gl9c_11y0o_772",
-  "tab-button--divider": "awsui_tab-button--divider_1gl9c_11y0o_802",
-  "tab-button--errors": "awsui_tab-button--errors_1gl9c_11y0o_809",
-  "tab-button--warnings": "awsui_tab-button--warnings_1gl9c_11y0o_809",
-  "loading-screen": "awsui_loading-screen_1gl9c_11y0o_813",
-  "error-screen": "awsui_error-screen_1gl9c_11y0o_814"
+  "code-editor": "awsui_code-editor_1gl9c_1nu8d_98",
+  "code-editor-refresh": "awsui_code-editor-refresh_1gl9c_1nu8d_598",
+  "pane": "awsui_pane_1gl9c_1nu8d_610",
+  "pane__close-container": "awsui_pane__close-container_1gl9c_1nu8d_621",
+  "pane__list": "awsui_pane__list_1gl9c_1nu8d_626",
+  "pane__table": "awsui_pane__table_1gl9c_1nu8d_633",
+  "pane__item": "awsui_pane__item_1gl9c_1nu8d_638",
+  "pane__cell": "awsui_pane__cell_1gl9c_1nu8d_638",
+  "pane__item--highlighted": "awsui_pane__item--highlighted_1gl9c_1nu8d_652",
+  "pane__location": "awsui_pane__location_1gl9c_1nu8d_673",
+  "pane__description": "awsui_pane__description_1gl9c_1nu8d_673",
+  "focus-lock": "awsui_focus-lock_1gl9c_1nu8d_688",
+  "editor": "awsui_editor_1gl9c_1nu8d_713",
+  "editor-refresh": "awsui_editor-refresh_1gl9c_1nu8d_741",
+  "status-bar": "awsui_status-bar_1gl9c_1nu8d_746",
+  "status-bar-with-hidden-pane": "awsui_status-bar-with-hidden-pane_1gl9c_1nu8d_755",
+  "status-bar__left": "awsui_status-bar__left_1gl9c_1nu8d_759",
+  "status-bar__left-virtual": "awsui_status-bar__left-virtual_1gl9c_1nu8d_766",
+  "status-bar__right": "awsui_status-bar__right_1gl9c_1nu8d_770",
+  "status-bar__language-mode": "awsui_status-bar__language-mode_1gl9c_1nu8d_774",
+  "status-bar__cursor-position": "awsui_status-bar__cursor-position_1gl9c_1nu8d_774",
+  "status-bar__cog-button": "awsui_status-bar__cog-button_1gl9c_1nu8d_779",
+  "status-bar-virtual": "awsui_status-bar-virtual_1gl9c_1nu8d_783",
+  "tab-button": "awsui_tab-button_1gl9c_1nu8d_789",
+  "tab-button--refresh": "awsui_tab-button--refresh_1gl9c_1nu8d_802",
+  "tab-button--active": "awsui_tab-button--active_1gl9c_1nu8d_816",
+  "tab-button--disabled": "awsui_tab-button--disabled_1gl9c_1nu8d_836",
+  "tab-button--divider": "awsui_tab-button--divider_1gl9c_1nu8d_866",
+  "tab-button--errors": "awsui_tab-button--errors_1gl9c_1nu8d_873",
+  "tab-button--warnings": "awsui_tab-button--warnings_1gl9c_1nu8d_873",
+  "loading-screen": "awsui_loading-screen_1gl9c_1nu8d_877",
+  "error-screen": "awsui_error-screen_1gl9c_1nu8d_878"
 };