@wix/design-system
Version:
@wix/design-system
54 lines • 1.81 kB
TypeScript
import * as React from 'react';
export type ImageFit = 'contain' | 'cover' | 'tile' | 'fill' | 'none';
export interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
/**
* Sets the border radius of the image box.
*/
borderRadius?: React.CSSProperties['borderRadius'];
/** Applies a data-hook HTML attribute that can be used in the tests. */
dataHook?: string;
/** Specifies a CSS class name to be appended to the component's root element.
* @internal
*/
className?: string;
/**
* Specifies image fit mode inside a box.
* Check [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) CSS property values for more info.
* @default cover
*/
fit?: ImageFit;
/**
* Specifies source content position inside of an image box. Accepts any valid
* [CSS position](https://developer.mozilla.org/en-US/docs/Web/CSS/position_value) value.
* @default center
*/
position?: string;
/**
* Specifies whether to display a border around an image.
* @default false
*/
showBorder?: boolean;
/**
* Specifies whether background of Image is transparent
* @default false
*/
transparent?: boolean;
/**
* Specifies an alt text for an image. If not provided, will be set to empty and treated as decorative.
* @default ''
*/
alt?: string;
/**
* Sets the width of the image box.
* @default '100%'
*/
width?: string | number;
/**
* Sets the height of the image box.
* @default undefined
*/
height?: string | number;
/** Specifies an URL link to image source. If not provided, a default placeholder image will be displayed. */
src?: string;
}
//# sourceMappingURL=Image.types.d.ts.map