@cloudscape-design/components-themeable 3.0.453 → 3.0.455

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "b34f53b7c542ac59c0634c32822f366bf0575fe6"
+  "commit": "00c3e7ae5e175f7ad7a87a9b5e9571bad9aefe22"
 }

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

@@ -16,7 +16,8 @@
   border-width: map.get($variant, 'border-width');
   position: relative;
   text-decoration: none;
-  padding: map.get($variant, 'padding');
+  padding-block: map.get($variant, 'padding');
+  padding-inline: map.get($variant, 'padding');
   font-weight: map.get($variant, 'font-weight');
 
   &:hover {
@@ -78,9 +79,14 @@
   @include styles.text-wrapping;
   @include styles.font-button;
   letter-spacing: awsui.$font-button-letter-spacing;
-  border-radius: awsui.$border-radius-button;
-  border: styles.$control-border-width solid;
-  padding: styles.$control-padding-vertical awsui.$space-button-horizontal;
+  border-start-start-radius: awsui.$border-radius-button;
+  border-start-end-radius: awsui.$border-radius-button;
+  border-end-start-radius: awsui.$border-radius-button;
+  border-end-end-radius: awsui.$border-radius-button;
+  border-block: styles.$control-border-width solid;
+  border-inline: styles.$control-border-width solid;
+  padding-block: styles.$control-padding-vertical;
+  padding-inline: awsui.$space-button-horizontal;
   display: inline-block; // for <a> as a button
   text-decoration: none;
   cursor: pointer;
@@ -92,8 +98,8 @@
   }
 
   &.button-no-text {
-    padding-left: awsui.$space-button-icon-only-horizontal;
-    padding-right: awsui.$space-button-icon-only-horizontal;
+    padding-inline-start: awsui.$space-button-icon-only-horizontal;
+    padding-inline-end: awsui.$space-button-icon-only-horizontal;
   }
 
   &.button-no-wrap {
@@ -101,7 +107,7 @@
   }
 
   &.full-width {
-    width: 100%;
+    inline-size: 100%;
     text-align: center;
   }
 
@@ -110,40 +116,41 @@
   &.variant-flashbar-icon {
     // Icon has vertical padding, but no horizontal, we need to conpensate this
     // in order to have equal height and width
-    padding-left: awsui.$space-xxs;
-    padding-right: awsui.$space-xxs;
+    padding-inline-start: awsui.$space-xxs;
+    padding-inline-end: awsui.$space-xxs;
   }
 
   &.variant-modal-dismiss {
-    padding: awsui.$space-button-modal-dismiss-vertical awsui.$space-xxs;
-    margin-right: calc(-1 * #{awsui.$space-xxs});
+    padding-block: awsui.$space-button-modal-dismiss-vertical;
+    padding-inline: awsui.$space-xxs;
+    margin-inline-end: calc(-1 * #{awsui.$space-xxs});
   }
 
   &.variant-inline-icon {
-    padding-top: 0;
-    padding-bottom: 0;
-    border: 0;
+    padding-block-start: 0;
+    padding-block-end: 0;
+    border-block: 0;
+    border-inline: 0;
   }
 
   > .icon-left {
     position: relative;
     // margin-left was breaking layout on firefox
-    left: calc(-1 * #{awsui.$space-xxs});
-    margin-right: awsui.$space-xxs;
+    inset-inline-start: calc(-1 * #{awsui.$space-xxs});
+    margin-inline-end: awsui.$space-xxs;
   }
 
   > .icon-right {
     position: relative;
     // margin-right was breaking layout on firefox
-    right: calc(-1 * #{awsui.$space-xxs});
-    margin-left: awsui.$space-xxs;
+    inset-inline-end: calc(-1 * #{awsui.$space-xxs});
+    margin-inline-start: awsui.$space-xxs;
   }
 
   &.button-no-text > .icon {
-    margin-right: auto;
-    margin-left: auto;
+    margin-inline-start: auto;
+    margin-inline-end: auto;
     // IE does not understand `initial`
-    right: 0;
-    left: 0;
+    inset-inline: 0;
   }
 }

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

@@ -1,25 +1,25 @@
 
     import './styles.scoped.css';
     export default {
-  "content": "awsui_content_vjswe_sc7gt_97",
-  "button": "awsui_button_vjswe_sc7gt_101",
-  "variant-normal": "awsui_variant-normal_vjswe_sc7gt_125",
-  "is-activated": "awsui_is-activated_vjswe_sc7gt_138",
-  "variant-icon": "awsui_variant-icon_vjswe_sc7gt_165",
-  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_sc7gt_165",
-  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_sc7gt_165",
-  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_sc7gt_183",
-  "disabled": "awsui_disabled_vjswe_sc7gt_201",
-  "variant-primary": "awsui_variant-primary_vjswe_sc7gt_209",
-  "variant-link": "awsui_variant-link_vjswe_sc7gt_293",
-  "variant-inline-link": "awsui_variant-inline-link_vjswe_sc7gt_545",
-  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_sc7gt_799",
-  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_sc7gt_886",
-  "button-no-text": "awsui_button-no-text_vjswe_sc7gt_970",
-  "button-no-wrap": "awsui_button-no-wrap_vjswe_sc7gt_974",
-  "full-width": "awsui_full-width_vjswe_sc7gt_977",
-  "icon-left": "awsui_icon-left_vjswe_sc7gt_994",
-  "icon-right": "awsui_icon-right_vjswe_sc7gt_999",
-  "icon": "awsui_icon_vjswe_sc7gt_994"
+  "content": "awsui_content_vjswe_41uc8_97",
+  "button": "awsui_button_vjswe_41uc8_101",
+  "variant-normal": "awsui_variant-normal_vjswe_41uc8_130",
+  "is-activated": "awsui_is-activated_vjswe_41uc8_143",
+  "variant-icon": "awsui_variant-icon_vjswe_41uc8_170",
+  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_41uc8_170",
+  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_41uc8_170",
+  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_41uc8_188",
+  "disabled": "awsui_disabled_vjswe_41uc8_206",
+  "variant-primary": "awsui_variant-primary_vjswe_41uc8_214",
+  "variant-link": "awsui_variant-link_vjswe_41uc8_298",
+  "variant-inline-link": "awsui_variant-inline-link_vjswe_41uc8_550",
+  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_41uc8_805",
+  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_41uc8_893",
+  "button-no-text": "awsui_button-no-text_vjswe_41uc8_977",
+  "button-no-wrap": "awsui_button-no-wrap_vjswe_41uc8_981",
+  "full-width": "awsui_full-width_vjswe_41uc8_984",
+  "icon-left": "awsui_icon-left_vjswe_41uc8_1003",
+  "icon-right": "awsui_icon-right_vjswe_41uc8_1008",
+  "icon": "awsui_icon_vjswe_41uc8_1003"
 };