Perseus
    Preparing search index...

    Type Alias Props

    type Props = {
        allowFullBleed?: boolean;
        allowZoom: boolean;
        alt: string;
        apiOptions?: APIOptions;
        constrainHeight?: boolean;
        extraGraphie?: {
            box: Size;
            labels: ReadonlyArray<any>;
            range: [Coord, Coord];
        };
        height?: number;
        onUpdate: () => void;
        overrideAriaHidden?: boolean;
        preloader?: (dimensions: Dimensions) => React.ReactNode;
        responsive: boolean;
        scale: number;
        setAssetStatus: (assetKey: string, loaded: boolean) => void;
        src: string;
        title?: string;
        trackInteraction?: () => void;
        width?: number;
        zoomToFullSizeOnMobile?: boolean;
    }
    Index

    Properties

    allowFullBleed? allowZoom alt apiOptions? constrainHeight? extraGraphie? height? onUpdate overrideAriaHidden? preloader? responsive scale setAssetStatus src title? trackInteraction? width? zoomToFullSizeOnMobile?

    Properties

    allowFullBleed?: boolean
    allowZoom: boolean
    alt: string
    apiOptions?: APIOptions
    constrainHeight?: boolean
    extraGraphie?: { box: Size; labels: ReadonlyArray<any>; range: [Coord, Coord] }
    height?: number
    onUpdate: () => void

    When the DOM updates to replace the preloader with the image, or vice-versa, we trigger this callback.

    overrideAriaHidden?: boolean

    If alt is provided, DO NOT set aria-hidden=true unless this override flag is set.

    preloader?: (dimensions: Dimensions) => React.ReactNode
    responsive: boolean

    By default, this component attempts to be responsive whenever possible (specifically, when width and height are passed in).

    You can expliclty force unresponsive behavior by either not passing in width/height or setting this prop to false.

    The difference is that forcing via this prop will result in explicit width and height styles being set on the rendered component.

    scale: number
    setAssetStatus: (assetKey: string, loaded: boolean) => void

    If provided, use AssetContext.Consumer, see renderer.jsx. If not, it defaults to a no-op.

    src: string
    title?: string
    trackInteraction?: () => void
    width?: number
    zoomToFullSizeOnMobile?: boolean

    Whether clicking this image will allow it to be fully zoomed in to its original size on click, and allow the user to scroll in that state. This also does some hacky viewport meta tag changing to ensure this works on mobile devices, so I (david@) don't recommend enabling this on desktop yet.

    Settings

    Member Visibility

    On This Page

    Properties