Image

Es un componente que carga una imagen en su interior, manteniendo todos los atributos de accesibilidad. Este componente ajustará la imagen a un cuadrado.

Utlización

import { Image } from "firefly-components/image";
                    
<Image src="/assets/blue-lamp.jpg" alt="Alternative text" />

Props

srcRecibe un string que especifica la ruta a la imagen.
sizeRecibe un string que especifica el tamaño de la imagen.
altRecibe un string que especifica el texto alternativo de la imagen.
cornerPermite aplicar border-radius a la imagen. Esta propiedad se comporta igual que la propiedad border-radius de CSS.
allowBackgroundRecibe un valor booleano que permite mostrar el contenedor de la imagen. Si no se especifica, su valor por defecto es false.

Ejemplos

<Image
    src="/assets/blue-lamp.jpg"
    size="90px"
/>
<Image
    src="/assets/blue-lamp.jpg"
    size="140px"
    corner="24px"
/>
<Image
    src="/assets/blue-lamp.jpg"
    size="120px"
    corner="100%"
/>