@cloudscape-design/components-themeable 3.0.1279 → 3.0.1281

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "53439b2b38989b0ed9dba615c84845bf6ee93b95"
+  "commit": "9d03c89609f1c2f56311a882db2e1fd648dc4894"
 }

package/lib/internal/scss/action-card/constants.scss

@@ -0,0 +1,43 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+@use '../internal/styles/tokens' as awsui;
+
+// State configuration for the action card root element.
+// Each state maps to background, box-shadow, border-color, border-width, text-color, and icon-color.
+$states: (
+  'default': (
+    'background': awsui.$color-background-action-card-default,
+    'box-shadow': none,
+    'border-color': awsui.$color-border-action-card-default,
+    'border-width': awsui.$border-width-action-card-default,
+    'text-color': inherit,
+    'icon-color': awsui.$color-icon-action-card-default,
+  ),
+  'hover': (
+    'background': awsui.$color-background-action-card-hover,
+    'box-shadow': none,
+    'border-color': awsui.$color-border-action-card-hover,
+    'border-width': awsui.$border-width-action-card-hover,
+    'text-color': inherit,
+    'icon-color': awsui.$color-icon-action-card-hover,
+  ),
+  'active': (
+    'background': awsui.$color-background-action-card-active,
+    'box-shadow': none,
+    'border-color': awsui.$color-border-action-card-active,
+    'border-width': awsui.$border-width-action-card-active,
+    'text-color': inherit,
+    'icon-color': awsui.$color-icon-action-card-active,
+  ),
+  'disabled': (
+    'background': awsui.$color-background-action-card-disabled,
+    'box-shadow': none,
+    'border-color': awsui.$color-border-action-card-disabled,
+    'border-width': awsui.$border-width-action-card-disabled,
+    'text-color': awsui.$color-text-action-card-disabled,
+    'icon-color': awsui.$color-icon-action-card-disabled,
+  ),
+);

package/lib/internal/scss/action-card/mixins.scss

@@ -0,0 +1,69 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+@use 'sass:map';
+@use '../internal/styles/tokens' as awsui;
+@use './constants' as constants;
+
+$variant-border-radius: (
+  'embedded': awsui.$border-radius-action-card-embedded,
+  'default': awsui.$border-radius-action-card-default,
+);
+
+$variant-padding-block: (
+  'embedded': awsui.$space-action-card-vertical-embedded,
+  'default': awsui.$space-action-card-vertical-default,
+);
+
+$variant-padding-inline: (
+  'embedded': awsui.$space-action-card-horizontal-embedded,
+  'default': awsui.$space-action-card-horizontal-default,
+);
+
+@mixin border-radius-all($value) {
+  border-start-start-radius: $value;
+  border-start-end-radius: $value;
+  border-end-start-radius: $value;
+  border-end-end-radius: $value;
+}
+
+@mixin state-border-radius($variant: 'default', $state: 'default') {
+  $token: map.get($variant-border-radius, $variant);
+  @include border-radius-all($token);
+}
+
+@mixin state-border-radius-all-variants($state: 'default') {
+  @each $variant in ('embedded', 'default') {
+    &.variant-#{$variant} {
+      &,
+      &:after {
+        @include state-border-radius($variant, $state);
+      }
+    }
+  }
+}
+
+@mixin apply-state-styles($state) {
+  $s: map.get(constants.$states, $state);
+
+  background-color: map.get($s, 'background');
+  box-shadow: map.get($s, 'box-shadow');
+  color: map.get($s, 'text-color');
+
+  @if $state != 'default' {
+    @include state-border-radius-all-variants($state);
+  }
+
+  &:after {
+    border-color: map.get($s, 'border-color');
+    border-block-width: map.get($s, 'border-width');
+    border-inline-width: map.get($s, 'border-width');
+  }
+
+  > .icon,
+  > .inner-card > .header-row > .icon {
+    color: map.get($s, 'icon-color');
+  }
+}

package/lib/internal/scss/action-card/motion.scss

@@ -0,0 +1,31 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+@use '../internal/styles' as styles;
+@use '../internal/styles/tokens' as awsui;
+
+.root {
+  @include styles.with-motion {
+    transition-property: background-color;
+    transition-duration: awsui.$motion-duration-transition-show-paced;
+    transition-timing-function: awsui.$motion-easing-transition-show-paced;
+  }
+}
+
+.root::after {
+  @include styles.with-motion {
+    transition-property: border-top-color, border-right-color, border-bottom-color, border-left-color;
+    transition-duration: awsui.$motion-duration-transition-show-paced;
+    transition-timing-function: awsui.$motion-easing-transition-show-paced;
+  }
+}
+
+.icon {
+  @include styles.with-motion {
+    transition-property: color;
+    transition-duration: awsui.$motion-duration-transition-show-paced;
+    transition-timing-function: awsui.$motion-easing-transition-show-paced;
+  }
+}

package/lib/internal/scss/action-card/styles.scss

@@ -0,0 +1,229 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+@use 'sass:map';
+
+@use '../internal/styles' as styles;
+@use '../internal/styles/tokens' as awsui;
+@use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
+@use './constants' as constants;
+@use './mixins' as mixins;
+@use './motion';
+
+.header {
+  &-inner {
+    @include styles.font-heading-s;
+    &.disabled {
+      color: map.get(constants.$states, 'disabled', 'text-color');
+    }
+  }
+  &:not(:has(+ .body)) {
+    flex: 1;
+  }
+}
+
+.header-row {
+  display: flex;
+  align-items: flex-start;
+  > .header {
+    flex: 1;
+    min-inline-size: 0;
+  }
+}
+
+.body {
+  flex: 1;
+}
+
+.description {
+  @include styles.font-body-s;
+  color: awsui.$color-text-body-secondary;
+  &.has-header {
+    padding-block-start: awsui.$space-action-card-description-padding-top;
+  }
+  &.disabled {
+    color: map.get(constants.$states, 'disabled', 'text-color');
+  }
+}
+
+.icon {
+  flex-shrink: 0;
+  display: flex;
+  color: map.get(constants.$states, 'default', 'icon-color');
+  pointer-events: none;
+}
+
+.header-button,
+.overlay-button {
+  all: unset;
+  cursor: pointer;
+  &.disabled {
+    cursor: default;
+  }
+}
+
+.header-button {
+  color: inherit;
+  font: inherit;
+  &::after {
+    content: '';
+    position: absolute;
+    inset: 0;
+    z-index: 1;
+  }
+  @each $variant in ('embedded', 'default') {
+    &.variant-#{$variant} {
+      &::after {
+        @include mixins.state-border-radius($variant);
+      }
+      &.disabled::after {
+        @include mixins.state-border-radius($variant, 'disabled');
+      }
+    }
+  }
+}
+
+.overlay-button {
+  position: absolute;
+  inset: 0;
+  opacity: 0;
+  @each $variant in ('embedded', 'default') {
+    &.variant-#{$variant} {
+      @include mixins.state-border-radius($variant);
+      &.disabled {
+        @include mixins.state-border-radius($variant, 'disabled');
+      }
+    }
+  }
+}
+
+.root {
+  @include styles.styles-reset();
+  box-sizing: border-box;
+  position: relative;
+  inline-size: 100%;
+  min-inline-size: 0;
+  text-align: start;
+  display: flex;
+  $default-state: map.get(constants.$states, 'default');
+  background: map.get($default-state, 'background');
+  box-shadow: map.get($default-state, 'box-shadow');
+  color: map.get($default-state, 'text-color');
+  padding-inline: 0;
+  padding-block: 0;
+  border-block: none;
+  border-inline: none;
+
+  &:after {
+    @include styles.base-pseudo-element;
+
+    box-shadow: none;
+    border-block: solid map.get($default-state, 'border-width') map.get($default-state, 'border-color');
+    border-inline: solid map.get($default-state, 'border-width') map.get($default-state, 'border-color');
+  }
+
+  &.variant-default,
+  &.variant-embedded {
+    > .inner-card {
+      display: flex;
+      flex-direction: column;
+      block-size: 100%;
+      inline-size: 100%;
+      min-inline-size: 0;
+
+      > .header + .body,
+      > .header-row + .body {
+        &:not(.no-padding) {
+          padding-block-start: awsui.$space-xxs;
+        }
+      }
+
+      > .header:not(.no-padding):has(+ .body) {
+        padding-block-end: awsui.$space-xxs;
+      }
+
+      > .header-row:has(+ .body) > .header:not(.no-padding) {
+        padding-block-end: awsui.$space-xxs;
+      }
+    }
+  }
+
+  &.icon-vertical-align-center > .icon {
+    align-self: center;
+  }
+
+  &.disabled {
+    cursor: default;
+    @include mixins.apply-state-styles('disabled');
+  }
+
+  &:not(.disabled):has(button:hover) {
+    @include mixins.apply-state-styles('hover');
+  }
+
+  &:not(.disabled):has(button:active) {
+    @include mixins.apply-state-styles('active');
+  }
+
+  &:has(.header-button:focus-visible),
+  &:has(.overlay-button:focus-visible) {
+    @include styles.focus-highlight(
+      2px,
+      awsui.$border-radius-control-default-focus-ring,
+      0 0 0 2px awsui.$color-border-item-focused
+    );
+
+    @each $variant in ('embedded', 'default') {
+      &.variant-#{$variant}::before {
+        @include mixins.border-radius-all(awsui.$border-radius-control-default-focus-ring);
+      }
+    }
+  }
+
+  @each $variant in ('embedded', 'default') {
+    &.variant-#{$variant} {
+      &,
+      &:after {
+        @include mixins.state-border-radius($variant);
+      }
+
+      $padding-block: map.get(mixins.$variant-padding-block, $variant);
+      $padding-inline: map.get(mixins.$variant-padding-inline, $variant);
+
+      > .inner-card > .header,
+      > .inner-card > .body,
+      > .inner-card > .header-row > .header {
+        &:not(.no-padding) {
+          padding-block: $padding-block;
+          padding-inline: $padding-inline;
+        }
+      }
+
+      > .icon,
+      > .inner-card > .header-row > .icon {
+        padding-block-start: $padding-block;
+      }
+
+      > .icon {
+        padding-block-end: $padding-block;
+      }
+
+      &.icon-align-end {
+        > .icon,
+        > .inner-card > .header-row > .icon {
+          padding-inline-end: $padding-inline;
+        }
+
+        > .inner-card > .header,
+        > .inner-card > .body,
+        > .inner-card > .header-row > .header {
+          &:not(.no-padding) {
+            padding-inline-end: awsui.$space-xs;
+          }
+        }
+      }
+    }
+  }
+}

package/lib/internal/scss/action-card/test-classes/styles.scss

@@ -0,0 +1,13 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+.header,
+.description,
+.body,
+.icon,
+.disabled,
+.button {
+  /* used in test-utils */
+}

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

@@ -16,11 +16,20 @@
 .drawer {
   @include styles.styles-reset;
   word-wrap: break-word;
+  background-color: awsui.$color-background-drawer;
+
+  &.position-absolute,
+  &.position-sticky,
+  &.position-fixed {
+    box-shadow: awsui.$shadow-panel;
+  }
 
   &.with-footer {
     display: flex;
     flex-direction: column;
-    min-block-size: 100%;
+    &.position-static {
+      min-block-size: 100%;
+    }
 
     > .content {
       flex: 1;

package/lib/internal/scss/internal/components/structured-item/styles.scss

@@ -8,6 +8,7 @@
 .root {
   @include styles.styles-reset;
   @include styles.text-wrapping;
+  cursor: inherit;
   display: flex;
   flex: 1;
   flex-direction: row;

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

@@ -1,6 +1,6 @@
 
     // Build environment
-    $awsui-commit-hash: "53439b2b";
+    $awsui-commit-hash: "9d03c896";
     // Manually managed CSS-variables
     $maxContentWidth: --awsui-max-content-width-6b9ypa;
 $minContentWidth: --awsui-min-content-width-6b9ypa;

package/lib/internal/scss/item-card/styles.scss

@@ -88,8 +88,8 @@ $action-padding-horizontal: awsui.$space-xxs;
     background: awsui.$color-background-item-selected;
 
     &:before {
-      border-block: solid awsui.$border-width-item-card-highlighted awsui.$color-border-item-card-highlighted;
-      border-inline: solid awsui.$border-width-item-card-highlighted awsui.$color-border-item-card-highlighted;
+      border-block: solid awsui.$border-width-card-selected awsui.$color-border-item-card-highlighted;
+      border-inline: solid awsui.$border-width-card-selected awsui.$color-border-item-card-highlighted;
     }
   }
 

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

@@ -16,7 +16,7 @@ $cell-vertical-padding-w-border: calc(
 $cell-horizontal-padding: awsui.$space-scaled-l;
 $cell-edge-horizontal-padding: calc(#{awsui.$space-l} - #{awsui.$border-item-width});
 $cell-horizontal-padding-w-border: calc(#{$cell-edge-horizontal-padding} + #{awsui.$border-item-width});
-$selected-border: awsui.$border-item-width solid awsui.$color-border-item-selected;
+$selected-border: awsui.$border-width-item-selected solid awsui.$color-border-item-selected;
 $selected-border-placeholder: awsui.$border-divider-list-width solid awsui.$color-border-item-placeholder;
 $border-placeholder: awsui.$border-item-width solid transparent;
 $icon-width-with-spacing: calc(#{awsui.$size-icon-normal} + #{awsui.$space-xs});

package/lib/internal/scss/table/styles.scss

@@ -140,7 +140,7 @@ filter search icon.
   &.selection-control-header {
     padding-block: awsui.$space-scaled-xs;
     padding-inline: awsui.$space-scaled-l;
-    border-inline-start: awsui.$border-item-width solid transparent;
+    border-inline-start: awsui.$border-width-item-selected solid transparent;
   }
 }
 

package/lib/internal/scss/tiles/styles.scss

@@ -11,6 +11,7 @@
 @use '../column-layout/styles.scss' as mixins;
 
 $gutter: awsui.$space-tile-gutter;
+$selected-line: calc(awsui.$border-width-item-selected - 1px);
 
 .root {
   @include styles.styles-reset;
@@ -49,7 +50,7 @@ $gutter: awsui.$space-tile-gutter;
     padding-block: awsui.$space-xs;
     padding-inline: awsui.$space-s;
     &.selected:not(.disabled):not(.readonly) {
-      box-shadow: inset 0 0 0 awsui.$border-width-field awsui.$color-border-item-focused;
+      box-shadow: inset 0 0 0 $selected-line awsui.$color-border-item-focused;
     }
   }
 

package/lib/internal/template/action-card/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { type ActionCardProps } from './interfaces';
+export { ActionCardProps };
+declare const ActionCard: React.ForwardRefExoticComponent<ActionCardProps & React.RefAttributes<ActionCardProps.Ref>>;
+export default ActionCard;
+//# sourceMappingURL=index.d.ts.map

package/lib/internal/template/action-card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/action-card/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGpD,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FA2Cf,CAAC;AAGF,eAAe,UAAU,CAAC"}

package/lib/internal/template/action-card/index.js

@@ -0,0 +1,30 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+'use client';
+import React from 'react';
+import useBaseComponent from '../internal/hooks/use-base-component';
+import { applyDisplayName } from '../internal/utils/apply-display-name';
+import { getExternalProps } from '../internal/utils/external-props';
+import InternalActionCard from './internal';
+const ActionCard = React.forwardRef(({ disabled = false, disableHeaderPaddings = false, disableContentPaddings = false, iconVerticalAlignment = 'top', variant = 'default', ...props }, ref) => {
+    const baseComponentProps = useBaseComponent('ActionCard', {
+        props: {
+            disabled,
+            disableHeaderPaddings,
+            disableContentPaddings,
+            iconVerticalAlignment,
+            variant,
+        },
+        metadata: {
+            hasHeader: Boolean(props.header),
+            hasDescription: Boolean(props.description),
+            hasContent: Boolean(props.children),
+            hasIcon: Boolean(props.icon),
+        },
+    });
+    const externalProps = getExternalProps(props);
+    return (React.createElement(InternalActionCard, { ref: ref, disabled: disabled, disableHeaderPaddings: disableHeaderPaddings, disableContentPaddings: disableContentPaddings, iconVerticalAlignment: iconVerticalAlignment, variant: variant, ...externalProps, ...baseComponentProps }));
+});
+applyDisplayName(ActionCard, 'ActionCard');
+export default ActionCard;
+//# sourceMappingURL=index.js.map

package/lib/internal/template/action-card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/action-card/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAEpE,OAAO,kBAAkB,MAAM,YAAY,CAAC;AAI5C,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACjC,CACE,EACE,QAAQ,GAAG,KAAK,EAChB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,EAC9B,qBAAqB,GAAG,KAAK,EAC7B,OAAO,GAAG,SAAS,EACnB,GAAG,KAAK,EACQ,EAClB,GAAmC,EACnC,EAAE;IACF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,YAAY,EAAE;QACxD,KAAK,EAAE;YACL,QAAQ;YACR,qBAAqB;YACrB,sBAAsB;YACtB,qBAAqB;YACrB,OAAO;SACR;QACD,QAAQ,EAAE;YACR,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC;YAChC,cAAc,EAAE,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC;YAC1C,UAAU,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;YACnC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;SAC7B;KACF,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACL,oBAAC,kBAAkB,IACjB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,EAC9C,qBAAqB,EAAE,qBAAqB,EAC5C,OAAO,EAAE,OAAO,KACZ,aAAa,KACb,kBAAkB,GACtB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;AAC3C,eAAe,UAAU,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { type ActionCardProps } from './interfaces';\nimport InternalActionCard from './internal';\n\nexport { ActionCardProps };\n\nconst ActionCard = React.forwardRef(\n  (\n    {\n      disabled = false,\n      disableHeaderPaddings = false,\n      disableContentPaddings = false,\n      iconVerticalAlignment = 'top',\n      variant = 'default',\n      ...props\n    }: ActionCardProps,\n    ref: React.Ref<ActionCardProps.Ref>\n  ) => {\n    const baseComponentProps = useBaseComponent('ActionCard', {\n      props: {\n        disabled,\n        disableHeaderPaddings,\n        disableContentPaddings,\n        iconVerticalAlignment,\n        variant,\n      },\n      metadata: {\n        hasHeader: Boolean(props.header),\n        hasDescription: Boolean(props.description),\n        hasContent: Boolean(props.children),\n        hasIcon: Boolean(props.icon),\n      },\n    });\n\n    const externalProps = getExternalProps(props);\n\n    return (\n      <InternalActionCard\n        ref={ref}\n        disabled={disabled}\n        disableHeaderPaddings={disableHeaderPaddings}\n        disableContentPaddings={disableContentPaddings}\n        iconVerticalAlignment={iconVerticalAlignment}\n        variant={variant}\n        {...externalProps}\n        {...baseComponentProps}\n      />\n    );\n  }\n);\n\napplyDisplayName(ActionCard, 'ActionCard');\nexport default ActionCard;\n"]}

package/lib/internal/template/action-card/interfaces.d.ts

@@ -0,0 +1,81 @@
+import React, { ReactNode } from 'react';
+import { BaseComponentProps } from '../internal/base-component';
+import { CancelableEventHandler } from '../internal/events';
+import { NativeAttributes } from '../internal/utils/with-native-attributes';
+export interface ActionCardProps extends BaseComponentProps {
+    /**
+     * The header content displayed at the top of the action card.
+     */
+    header?: ReactNode;
+    /**
+     * The description content displayed below the header.
+     */
+    description?: ReactNode;
+    /**
+     * The main content of the action card.
+     */
+    children?: ReactNode;
+    /**
+     * Called when the user clicks on the action card.
+     */
+    onClick?: CancelableEventHandler<ActionCardProps.ClickDetail>;
+    /**
+     * Adds an aria-label to the action card.
+     */
+    ariaLabel?: string;
+    /**
+     * Adds an aria-describedby reference for the action card.
+     */
+    ariaDescribedby?: string;
+    /**
+     * Determines whether the action card is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Removes the default padding from the header area.
+     */
+    disableHeaderPaddings?: boolean;
+    /**
+     * Removes the default padding from the content area.
+     */
+    disableContentPaddings?: boolean;
+    /**
+     * Displays an icon next to the content. You can use the `iconVerticalAlignment` property to control vertical alignment.
+     */
+    icon?: React.ReactNode;
+    /**
+     * Specifies the vertical alignment of the icon.
+     */
+    iconVerticalAlignment?: ActionCardProps.IconVerticalAlignment;
+    /**
+     * Specifies the visual variant of the card, which controls the border radius and padding.
+     *
+     * - `default` - Uses container-level border radius and padding (larger).
+     * - `embedded` - Uses compact border radius and padding (smaller).
+     */
+    variant?: ActionCardProps.Variant;
+    /**
+     * Attributes to add to the native button element.
+     * Some attributes will be automatically combined with internal attribute values:
+     * - `className` will be appended.
+     * - Event handlers will be chained, unless the default is prevented.
+     *
+     * We do not support using this attribute to apply custom styling.
+     *
+     * @awsuiSystem core
+     */
+    nativeButtonAttributes?: NativeAttributes<React.ButtonHTMLAttributes<HTMLButtonElement>>;
+}
+export declare namespace ActionCardProps {
+    interface ClickDetail {
+    }
+    type IconVerticalAlignment = 'top' | 'center';
+    type Variant = 'default' | 'embedded';
+    interface Ref {
+        /**
+         * Sets focus on the action card.
+         */
+        focus(): void;
+    }
+}
+//# sourceMappingURL=interfaces.d.ts.map

package/lib/internal/template/action-card/interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/action-card/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAE5E,MAAM,WAAW,eAAgB,SAAQ,kBAAkB;IACzD;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAE9D;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB;;OAEG;IACH,qBAAqB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAE9D;;;;;OAKG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC;IAElC;;;;;;;;;OASG;IACH,sBAAsB,CAAC,EAAE,gBAAgB,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,CAAC;CAC1F;AAED,yBAAiB,eAAe,CAAC;IAE/B,UAAiB,WAAW;KAAG;IAE/B,KAAY,qBAAqB,GAAG,KAAK,GAAG,QAAQ,CAAC;IACrD,KAAY,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;IAE7C,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}

package/lib/internal/template/action-card/interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interfaces.js.map

package/lib/internal/template/action-card/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/action-card/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { ReactNode } from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\nimport { CancelableEventHandler } from '../internal/events';\nimport { NativeAttributes } from '../internal/utils/with-native-attributes';\n\nexport interface ActionCardProps extends BaseComponentProps {\n  /**\n   * The header content displayed at the top of the action card.\n   */\n  header?: ReactNode;\n\n  /**\n   * The description content displayed below the header.\n   */\n  description?: ReactNode;\n\n  /**\n   * The main content of the action card.\n   */\n  children?: ReactNode;\n\n  /**\n   * Called when the user clicks on the action card.\n   */\n  onClick?: CancelableEventHandler<ActionCardProps.ClickDetail>;\n\n  /**\n   * Adds an aria-label to the action card.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Adds an aria-describedby reference for the action card.\n   */\n  ariaDescribedby?: string;\n\n  /**\n   * Determines whether the action card is disabled.\n   */\n  disabled?: boolean;\n\n  /**\n   * Removes the default padding from the header area.\n   */\n  disableHeaderPaddings?: boolean;\n\n  /**\n   * Removes the default padding from the content area.\n   */\n  disableContentPaddings?: boolean;\n\n  /**\n   * Displays an icon next to the content. You can use the `iconVerticalAlignment` property to control vertical alignment.\n   */\n  icon?: React.ReactNode;\n\n  /**\n   * Specifies the vertical alignment of the icon.\n   */\n  iconVerticalAlignment?: ActionCardProps.IconVerticalAlignment;\n\n  /**\n   * Specifies the visual variant of the card, which controls the border radius and padding.\n   *\n   * - `default` - Uses container-level border radius and padding (larger).\n   * - `embedded` - Uses compact border radius and padding (smaller).\n   */\n  variant?: ActionCardProps.Variant;\n\n  /**\n   * Attributes to add to the native button element.\n   * Some attributes will be automatically combined with internal attribute values:\n   * - `className` will be appended.\n   * - Event handlers will be chained, unless the default is prevented.\n   *\n   * We do not support using this attribute to apply custom styling.\n   *\n   * @awsuiSystem core\n   */\n  nativeButtonAttributes?: NativeAttributes<React.ButtonHTMLAttributes<HTMLButtonElement>>;\n}\n\nexport namespace ActionCardProps {\n  // eslint-disable-next-line @typescript-eslint/no-empty-object-type\n  export interface ClickDetail {}\n\n  export type IconVerticalAlignment = 'top' | 'center';\n  export type Variant = 'default' | 'embedded';\n\n  export interface Ref {\n    /**\n     * Sets focus on the action card.\n     */\n    focus(): void;\n  }\n}\n"]}

package/lib/internal/template/action-card/internal.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
+import { type ActionCardProps } from './interfaces';
+export type InternalActionCardProps = ActionCardProps & InternalBaseComponentProps;
+declare const InternalActionCard: React.ForwardRefExoticComponent<ActionCardProps & InternalBaseComponentProps & React.RefAttributes<ActionCardProps.Ref>>;
+export default InternalActionCard;
+//# sourceMappingURL=internal.d.ts.map

package/lib/internal/template/action-card/internal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/action-card/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAStC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAKpD,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG,0BAA0B,CAAC;AAEnF,QAAA,MAAM,kBAAkB,0HA8LvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}