Kiri API reference
    Preparing search index...

    Interface KiriOptions

    interface KiriOptions {
        frame?: {
            shape?: FrameShape;
            width?: number;
            height?: number;
            cornerRadius?: number;
        };
        minZoom?: number;
        maxZoom?: number;
        rotatable?: boolean;
        flippable?: boolean;
        resizableFrame?: boolean;
        lockAspectRatio?: boolean;
        movableFrame?: boolean;
        mouseWheelZoom?: boolean
        | "ctrl";
        useExifOrientation?: boolean;
        filters?: Partial<Filters>;
        uploader?: Uploader;
        autoSizeStage?: boolean;
        showZoomer?: boolean;
        zoomerPosition?: ZoomerPosition;
    }
    Index
    frame? minZoom? maxZoom? rotatable? flippable? resizableFrame? lockAspectRatio? movableFrame? mouseWheelZoom? useExifOrientation? filters? uploader? autoSizeStage? showZoomer? zoomerPosition?
    frame?: {
        shape?: FrameShape;
        width?: number;
        height?: number;
        cornerRadius?: number;
    }

    Type Declaration

    • Optionalshape?: FrameShape

      Default "rectangle". "circle" and "rounded-rectangle" are real clips on export, not just a visual overlay.

    • Optionalwidth?: number

      Pixels. Default 200.

    • Optionalheight?: number

      Pixels. Default 200.

    • OptionalcornerRadius?: number

      Corner radius in pixels. Only used when shape is "rounded-rectangle". Default 20.

    minZoom?: number

    Default 1.

    maxZoom?: number

    Default 4.

    rotatable?: boolean

    Default true.

    flippable?: boolean

    Default true.

    resizableFrame?: boolean

    Adds drag handles at all four frame corners. Default false.

    lockAspectRatio?: boolean

    When resizableFrame is on, dragging a corner handle preserves the frame's current aspect ratio (the ratio it had when the drag started) instead of resizing width/height independently. Default false.

    movableFrame?: boolean

    Inverts which element is interactive. By default the image pans/zooms while the frame stays fixed. When movableFrame is true, the image is displayed at a fixed size and never pans or zooms — instead, dragging (or arrow keys) moves the frame around the static image, and (combine with resizableFrame) its corner handles resize it, clamped to the image's own bounds. setZoom()/setOffset() become no-ops in this mode (nothing to pan/zoom); use setFramePosition() instead. rotate()/flip still work — they transform the whole static image in place. Default false.

    mouseWheelZoom?: boolean | "ctrl"

    "ctrl" requires holding Ctrl while scrolling to zoom. Default true.

    useExifOrientation?: boolean

    Corrects rotation + horizontal flip from EXIF data on File/Blob sources. Default true.

    filters?: Partial<Filters>

    Initial filter values; see Filters.

    uploader?: Uploader

    A custom upload implementation, used by upload() unless overridden per-call.

    autoSizeStage?: boolean

    When true (default), the stage sizes itself to the frame's dimensions (plus a small margin) so it looks right with zero CSS. Set false to have the stage fill its container instead (100% width/height) — for embedding in a layout where you want to control the stage's size via your own CSS on the container element.

    showZoomer?: boolean

    Renders a built-in zoom slider, kept in sync with wheel/pinch/setZoom() in both directions. Default false.

    zoomerPosition?: ZoomerPosition

    Where the zoom slider sits relative to the stage. Purely a placement choice — identical behavior in every position. Default "bottom".

    Settings
    Member Visibility

    On This Page
    Properties