@volvo-cars/image-component

Image

An image component with with optiional lazy-loading, spinner, placeholder with aspect ratio, and background option as well as retina support.

Basic usage

<Image src="https://example.com/example.jpg" />

Props

Props	Type	Description	Required	Default
src	string	Image source url	✔︎	null
retinaSrc	string	Retina image source url		null
aspectRatio	array [width, height]	Aspect ratio for placeholder shown before image has loaded		null
displayAsBackground	boolean	Display image as background		false
loader	string	Set if a loading indicator should be shown during load (for now only "spinner" is available)		null
placeholderBackground	string	Custom background color of the placeholder		null
onLoad	func	Callback fired when image finish loading		null
extend	object	Extend styles of image		null
extendContainer	object	Extend styles of image container element		null
disableFader	boolean	Disable fade-in transition when image is loaded		false
disableLoading	boolean	Disable lazy-loading and load image as usual		false
errorText	string	Message shown when loading image results in an error		null
fallbackQueryParameter	string	Query parameter to append to image url and retry on error		null
alt	string			null
lazyload	boolean			false