@fifteen/design-system-vue/dist/types/components/FImage.d.ts

Vue 3 (Composition API + Typescript) implementation of the Fifteen Design System

import { default as CSS } from 'csstype';
import { Color } from '../types/colors';
export interface FImageProps {
    /**
     * Source of the image
     */
    src: string;
    /**
     * Alternative text of the image
     */
    alt: string;
    /**
     * Height of the image
     */
    height?: string | number;
    /**
     * Width of the image
     */
    width?: string | number;
    /**
     * Determine how the image should adjust to its parent. Mapped to object-fit property
     */
    fit?: CSS.Properties['objectFit'];
    /**
     * Determine how the image should be aligned to its parent. Mapped to object-position property
     */
    position?: CSS.Properties['objectPosition'];
    /**
     * Loading mode of the image. Default to lazy.
     */
    loading?: 'eager' | 'lazy';
    /**
     * Placeholder image of the image
     */
    placeholder?: string;
    /**
     * If image angles should be sharped or not
     */
    corners?: 'sharp' | 'rounded' | 'circular';
    /**
     * Background color, default is transparent if an image is provided, 'neutral--light-3' otherwise
     */
    backgroundColor?: Color;
}
declare const _default: import('vue').DefineComponent<FImageProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FImageProps> & Readonly<{}>, {
    width: string | number;
    placeholder: string;
    loading: "eager" | "lazy";
    height: string | number;
    fit: CSS.Property.ObjectFit;
    position: CSS.Property.ObjectPosition<0 | (string & {})>;
    corners: "sharp" | "rounded" | "circular";
    backgroundColor: Color;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
export default _default;