@cloudscape-design/components-themeable 3.0.1351 → 3.0.1353

package/lib/internal/scss/icon/styles.scss

@@ -6,6 +6,7 @@
 @use '../internal/styles/tokens' as awsui;
 @use '../internal/styles' as styles;
 @use './mixins' as mixins;
+@use './hover-motion' as hover-motion;
 
 .icon {
   position: relative;
@@ -54,6 +55,8 @@
   }
 }
 
+@include hover-motion.icon-hover-motion;
+
 .badge::after {
   content: '';
   position: absolute;

package/lib/internal/scss/internal/generated/custom-css-properties/index.scss

@@ -1,6 +1,6 @@
 
     // Build environment
-    $awsui-commit-hash: "0ebe4971";
+    $awsui-commit-hash: "4194984b";
     // Manually managed CSS-variables
     $maxContentWidth: --awsui-max-content-width-esndbs;
 $minContentWidth: --awsui-min-content-width-esndbs;

package/lib/internal/scss/internal/styles/style-api.scss

@@ -0,0 +1,45 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+@forward '@cloudscape-design/component-toolkit/internal/style-api';
+
+@use '@cloudscape-design/component-toolkit/internal/style-api' as toolkit;
+@use './tokens' as awsui;
+@use './foundation' as foundation;
+@use './forms/mixins' as forms;
+
+// Shared, component-agnostic Style API v2 token groups + the helpers that consume them. Components
+// combine these groups (see combine()), register() the public tokens, and re-anchor them with
+// carriers() on their boundary element so descendants / pseudo-elements read them per instance.
+
+// Common surface tokens (background / text / border / border-radius / border-width), shared by
+// badge, alert, button, etc.
+$surface: (color, background-color, border-color, border-width, border-radius);
+
+// Focus-outline tokens, shared by every focusable component (button, alert dismiss, ...).
+$focus-ring: (focus-ring-color, focus-ring-width, focus-ring-radius, focus-ring-gutter-block, focus-ring-gutter-inline);
+
+// Carrier map for the focus-outline group: reads resolve to the inherited --awsui-internal-style-*
+// carriers (re-anchored by carriers() on the component root), so the ring below reaches ::before.
+$_focus-ring-carriers: toolkit.resolve($focus-ring, carrier);
+
+// A wrapper for forms.focus-highlight with style API integration.
+@mixin focus-highlight(
+  $gutter-block: awsui.$space-button-focus-outline-gutter,
+  $gutter-inline: awsui.$space-button-focus-outline-gutter,
+  $radius: awsui.$border-radius-control-default-focus-ring,
+  $width: foundation.$box-shadow-focused-width,
+  $color: awsui.$color-border-item-focused
+) {
+  @include forms.focus-highlight(
+    $gutter: (
+      'vertical': var(#{toolkit.read($_focus-ring-carriers, focus-ring-gutter-block)}, #{$gutter-block}),
+      'horizontal': var(#{toolkit.read($_focus-ring-carriers, focus-ring-gutter-inline)}, #{$gutter-inline}),
+    ),
+    $border-radius: var(#{toolkit.read($_focus-ring-carriers, focus-ring-radius)}, #{$radius}),
+    $box-shadow: 0 0 0 var(#{toolkit.read($_focus-ring-carriers, focus-ring-width)}, #{$width})
+      var(#{toolkit.read($_focus-ring-carriers, focus-ring-color)}, #{$color})
+  );
+}

package/lib/internal/template/action-card/styles.css.js

@@ -1,22 +1,22 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_16248_ukyke_161",
-  "icon": "awsui_icon_16248_ukyke_193",
-  "header-inner": "awsui_header-inner_16248_ukyke_209",
-  "disabled": "awsui_disabled_16248_ukyke_218",
-  "header": "awsui_header_16248_ukyke_209",
-  "body": "awsui_body_16248_ukyke_221",
-  "header-row": "awsui_header-row_16248_ukyke_225",
-  "description": "awsui_description_16248_ukyke_238",
-  "has-header": "awsui_has-header_16248_ukyke_244",
-  "header-button": "awsui_header-button_16248_ukyke_258",
-  "overlay-button": "awsui_overlay-button_16248_ukyke_259",
-  "variant-embedded": "awsui_variant-embedded_16248_ukyke_278",
-  "variant-default": "awsui_variant-default_16248_ukyke_290",
-  "inner-card": "awsui_inner-card_16248_ukyke_391",
-  "no-padding": "awsui_no-padding_16248_ukyke_398",
-  "icon-vertical-align-center": "awsui_icon-vertical-align-center_16248_ukyke_409",
-  "icon-align-end": "awsui_icon-align-end_16248_ukyke_545"
+  "root": "awsui_root_16248_wvyxh_157",
+  "icon": "awsui_icon_16248_wvyxh_189",
+  "header-inner": "awsui_header-inner_16248_wvyxh_205",
+  "disabled": "awsui_disabled_16248_wvyxh_214",
+  "header": "awsui_header_16248_wvyxh_205",
+  "body": "awsui_body_16248_wvyxh_217",
+  "header-row": "awsui_header-row_16248_wvyxh_221",
+  "description": "awsui_description_16248_wvyxh_234",
+  "has-header": "awsui_has-header_16248_wvyxh_240",
+  "header-button": "awsui_header-button_16248_wvyxh_254",
+  "overlay-button": "awsui_overlay-button_16248_wvyxh_255",
+  "variant-embedded": "awsui_variant-embedded_16248_wvyxh_274",
+  "variant-default": "awsui_variant-default_16248_wvyxh_286",
+  "inner-card": "awsui_inner-card_16248_wvyxh_387",
+  "no-padding": "awsui_no-padding_16248_wvyxh_394",
+  "icon-vertical-align-center": "awsui_icon-vertical-align-center_16248_wvyxh_405",
+  "icon-align-end": "awsui_icon-align-end_16248_wvyxh_541"
 };