@cloudscape-design/components-themeable 3.0.640 → 3.0.642

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "d24a84cd42ba6d57839ea2570651e249b7885970"
+  "commit": "275aeedb715a58150e4eb13e1fc9dcb105cb8305"
 }

package/lib/internal/scss/button/styles.scss

@@ -147,6 +147,18 @@
     margin-inline-start: awsui.$space-xxs;
   }
 
+  &.variant-inline-link {
+    > .icon-left {
+      inset-inline-start: 0;
+      margin-inline-end: awsui.$space-xs;
+    }
+
+    > .icon-right {
+      inset-inline-end: 0;
+      margin-inline-start: awsui.$space-xs;
+    }
+  }
+
   &.button-no-text > .icon {
     margin-inline-start: auto;
     margin-inline-end: auto;

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

@@ -10,8 +10,8 @@
 .drawer {
   @include styles.styles-reset;
   word-wrap: break-word;
-  padding-block-start: awsui.$space-scaled-l;
-  padding-block-end: awsui.$space-scaled-xxxl;
+  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;
 }
@@ -19,12 +19,12 @@
 .header {
   @include styles.font-panel-header;
   color: awsui.$color-text-heading-default;
-  padding-block-end: awsui.$space-scaled-l;
+  padding-block-end: 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-divider-default;
+  border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
   margin-block-start: 0;
-  margin-block-end: awsui.$space-scaled-l;
+  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});
 

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

@@ -10,7 +10,7 @@
 .help-panel {
   @include styles.styles-reset;
   word-wrap: break-word;
-  padding-block-start: awsui.$space-scaled-l;
+  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;
@@ -20,7 +20,7 @@
     border-inline: none;
     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-xs});
+    margin-inline: calc(-1 * #{awsui.$space-panel-divider-margin-horizontal});
   }
 
   ol,
@@ -85,7 +85,7 @@
   }
   // sets padding at the bottom of the panel
   & > :last-child {
-    margin-block-end: awsui.$space-scaled-xxxl;
+    margin-block-end: awsui.$space-panel-content-bottom;
   }
 
   // add basic font-sizes
@@ -118,14 +118,14 @@
   .header {
     @include styles.font-panel-header;
     color: awsui.$color-text-heading-default;
-    padding-block-end: awsui.$space-scaled-l;
+    padding-block-end: 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: none;
     border-inline: none;
-    border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-divider-default;
+    border-block-end: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
     margin-block-start: 0;
-    margin-block-end: awsui.$space-scaled-l;
+    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});
 
@@ -161,9 +161,9 @@
   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-xs});
+  margin-inline: calc(-1 * #{awsui.$space-panel-divider-margin-horizontal});
   padding-block: 0;
-  padding-inline: awsui.$space-s;
+  padding-inline: awsui.$space-panel-divider-margin-horizontal;
   > :first-child {
     margin-block-start: awsui.$space-scaled-xl;
   }

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

@@ -16,7 +16,7 @@
   @include styles.font-panel-header;
   margin-block: 0;
   margin-inline: 0;
-  padding-block: awsui.$space-scaled-l;
+  padding-block: awsui.$space-panel-header-vertical;
   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});
@@ -50,7 +50,7 @@
 }
 
 .list-container {
-  margin-block-start: awsui.$space-scaled-l;
+  margin-block-start: awsui.$space-panel-content-top;
 }
 
 .list {
@@ -69,7 +69,7 @@
   padding-inline-end: awsui.$space-panel-side-right;
 
   &--last {
-    margin-block-end: awsui.$space-scaled-xxxl;
+    margin-block-end: awsui.$space-panel-content-bottom;
   }
 }
 
@@ -172,14 +172,15 @@
 .divider {
   border-block: none;
   border-inline: none;
-  border-block-start: awsui.$border-divider-section-width solid awsui.$color-border-divider-default;
 }
 
 .divider-default {
   margin-block: awsui.$space-scaled-2x-xl;
-  margin-inline: calc(-1 * #{awsui.$space-s});
+  margin-inline: calc(-1 * #{awsui.$space-panel-divider-margin-horizontal});
+  border-block-start: awsui.$border-divider-section-width solid awsui.$color-border-divider-default;
 }
 
 .divider-header {
   margin-block-start: 0;
+  border-block-start: awsui.$border-divider-section-width solid awsui.$color-border-panel-header;
 }

package/lib/internal/scss/table/body-cell/styles.scss

@@ -25,6 +25,7 @@ $edit-button-padding-right: calc(
   #{awsui.$space-xs} + #{awsui.$space-xxs}
 ); // Cell vertical padding + xxs space that would normally come from the button.
 $success-icon-padding-right: calc(#{$edit-button-padding-right} + #{$icon-width-with-spacing});
+$interactive-column-padding-inline-end: calc(#{$cell-horizontal-padding} + #{awsui.$space-l});
 
 @mixin cell-focus-outline {
   @include styles.focus-highlight(calc(-1 * #{awsui.$space-scaled-xxs}));
@@ -357,10 +358,15 @@ $success-icon-padding-right: calc(#{$edit-button-padding-right} + #{$icon-width-
     &:not(.body-cell-edit-active) {
       &.body-cell-interactive {
         cursor: pointer;
+
+        // Include interactive padding even when a cell is not hovered to prevent jittering when resizableColumns=false.
+        &:not(.resizable-columns) {
+          padding-inline-end: $interactive-column-padding-inline-end;
+        }
       }
 
       @mixin focused-editor-styles {
-        padding-inline-end: calc(#{$cell-horizontal-padding} + #{awsui.$space-l});
+        padding-inline-end: $interactive-column-padding-inline-end;
         & > .body-cell-editor-wrapper,
         & > .expandable-cell-content > .body-cell-editor-wrapper {
           opacity: 1;
@@ -393,7 +399,6 @@ $success-icon-padding-right: calc(#{$edit-button-padding-right} + #{$icon-width-
       &:not(.body-cell-interactive),
       &:focus-within:focus-within,
       &.body-cell-edit-disabled-popover {
-        padding-inline-end: calc(#{$cell-horizontal-padding} + #{awsui.$space-l});
         &.body-cell-has-success {
           // After a successful edit, we display the success icon next to the edit button and need additional padding to not let the text overflow the success icon.
           padding-inline-end: calc(#{$cell-horizontal-padding} + #{awsui.$space-l} + #{$icon-width-with-spacing});

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

@@ -1,24 +1,24 @@
 
     import './styles.scoped.css';
     export default {
-  "content": "awsui_content_vjswe_17wax_103",
-  "button": "awsui_button_vjswe_17wax_107",
-  "variant-normal": "awsui_variant-normal_vjswe_17wax_158",
-  "variant-icon": "awsui_variant-icon_vjswe_17wax_201",
-  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_17wax_201",
-  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_17wax_201",
-  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_17wax_222",
-  "disabled": "awsui_disabled_vjswe_17wax_243",
-  "variant-primary": "awsui_variant-primary_vjswe_17wax_251",
-  "variant-link": "awsui_variant-link_vjswe_17wax_344",
-  "variant-inline-link": "awsui_variant-inline-link_vjswe_17wax_623",
-  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_17wax_906",
-  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_17wax_1004",
-  "button-no-text": "awsui_button-no-text_vjswe_17wax_1097",
-  "button-no-wrap": "awsui_button-no-wrap_vjswe_17wax_1101",
-  "full-width": "awsui_full-width_vjswe_17wax_1104",
-  "icon-left": "awsui_icon-left_vjswe_17wax_1123",
-  "icon-right": "awsui_icon-right_vjswe_17wax_1128",
-  "icon": "awsui_icon_vjswe_17wax_1123"
+  "content": "awsui_content_vjswe_1ifev_103",
+  "button": "awsui_button_vjswe_1ifev_107",
+  "variant-normal": "awsui_variant-normal_vjswe_1ifev_158",
+  "variant-icon": "awsui_variant-icon_vjswe_1ifev_201",
+  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_1ifev_201",
+  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_1ifev_201",
+  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_1ifev_222",
+  "disabled": "awsui_disabled_vjswe_1ifev_243",
+  "variant-primary": "awsui_variant-primary_vjswe_1ifev_251",
+  "variant-link": "awsui_variant-link_vjswe_1ifev_344",
+  "variant-inline-link": "awsui_variant-inline-link_vjswe_1ifev_623",
+  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_1ifev_906",
+  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_1ifev_1004",
+  "button-no-text": "awsui_button-no-text_vjswe_1ifev_1097",
+  "button-no-wrap": "awsui_button-no-wrap_vjswe_1ifev_1101",
+  "full-width": "awsui_full-width_vjswe_1ifev_1104",
+  "icon-left": "awsui_icon-left_vjswe_1ifev_1123",
+  "icon-right": "awsui_icon-right_vjswe_1ifev_1128",
+  "icon": "awsui_icon_vjswe_1ifev_1123"
 };