Add backgroundImage style property (#800)

* Add backgroundImage style property * Create nervous-keys-film.md
aws-amplify · Nov 19, 2021 · c8ce944 · c8ce944
1 parent 6111a9c
commit c8ce944
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 0 deletions.
diff --git a/.changeset/nervous-keys-film.md b/.changeset/nervous-keys-film.md
@@ -0,0 +1,5 @@
+---
+"@aws-amplify/ui-react": patch
+---
+
+Add backgroundImage style property
diff --git a/packages/react/src/primitives/shared/styleUtils.ts b/packages/react/src/primitives/shared/styleUtils.ts
@@ -197,6 +197,7 @@ const BaseStylePropsMap: Required<{ [key in keyof BaseStyleProps]: true }> = {
   alignSelf: true,
   area: true,
   backgroundColor: true,
+  backgroundImage: true,
   basis: true,
   border: true,
   borderRadius: true,

diff --git a/packages/react/src/primitives/types/style.ts b/packages/react/src/primitives/types/style.ts
@@ -40,6 +40,7 @@ export type ResponsiveStyle<PropertyType> =
 export interface BaseStyleProps extends FlexItemStyleProps, GridItemStyleProps {
   alignSelf?: ResponsiveStyle<StyleToken<Property.AlignSelf>>;
   backgroundColor?: ResponsiveStyle<StyleToken<Property.BackgroundColor>>;
+  backgroundImage?: ResponsiveStyle<StyleToken<Property.BackgroundImage>>;
   border?: ResponsiveStyle<StyleToken<Property.Border>>;
   borderRadius?: ResponsiveStyle<StyleToken<Property.BorderRadius>>;
   bottom?: ResponsiveStyle<StyleToken<Property.Bottom>>;
@@ -130,6 +131,7 @@ export const ComponentPropsToStylePropsMap: ComponentPropToStyleProp = {
   autoFlow: 'gridAutoFlow',
   autoRows: 'gridAutoRows',
   backgroundColor: 'backgroundColor',
+  backgroundImage: 'backgroundImage',
   basis: 'flexBasis',
   border: 'border',
   borderRadius: 'borderRadius',