Skip to main content
Version: 1.x.x

Image

Properties

record

required

quip.apps.ImageRecord

ImageRecord containing the image data to be displayed.

width

required

number

Specify the width (px) of the rendered image. If not specified, the image is rendered according to the size stored in the ImageRecord

minWidth

required

number = 100

Specifies a minimum width (px) for this image. Prevents resizing to smaller than this width.

minHeight

required

number = 100

Specifies a minimum height (px) for this image. Prevents resizing to smaller than this height.

placeholderWidth

required

number = 100

When the ImageRecord does not have an associated image file yet, these props control the size of the placeholder.

placeholderHeight

required

number = 100

When the ImageRecord does not have an associated image file yet, these props control the size of the placeholder.

mode

required

quip.apps.ui.ImageMode

Defines the render mode for this image. See quip.apps.ui.ImageMode

onWidthAndAspectRatioUpdate

required

Function(
width: number | null,
aspectRatio: number | null
) => void

Callback for when the rendered size of the image has changed.

onFocusChanged

optional

Function(focused: boolean) => void

A callback for when the image was focused or unfocused.

onImageLoaded

optional

(record: ImageRecord) => void

A callback for when the image record was loaded.

onOperationCompleted

optional

() => void

A callback that is Called when completing or canceling commenting or cropping.

altText

optional

string

Text to show when hovering or screenreading this image.

className

optional

string

A CSS className to use for this image element.

quip.apps.ui.Image.prototype

openInLightbox

Function() => void

Opens the referenced image in a lightbox.

addCommentAtPoint

Function(clientX: number, clientY: number) => void

Adds a comment at the given x/y coordinate.

isFocused

Function() => boolean

Returns true if this image is currently focused, otherwise returns false.

quip.apps.ui.ImageMode

An enum for indicating a rendering mode for a ui.Image

enum ImageMode {
NONE,
FOCUSED,
COMMENT,
CROP,
}