TLImageShapeProps

Properties for an image shape. Image shapes display raster images on the canvas, with support for cropping, flipping, and asset management.

interface TLImageShapeProps {}

Example

const imageProps: TLImageShapeProps = {
  w: 300,
  h: 200,
  playing: true,
  url: 'https://example.com/image.jpg',
  assetId: 'asset:image123',
  crop: null,
  flipX: false,
  flipY: false,
  altText: 'A sample image',
}

Properties

Alternative text for accessibility and when image fails to load

altText: string

ID of the associated asset record, null if no asset

assetId: null | TLAssetId

Crop data defining visible region of the image, null for no cropping

crop: null | TLShapeCrop

Whether to flip the image horizontally

flipX: boolean

Whether to flip the image vertically

flipY: boolean

Height of the image shape in canvas units

h: number

Whether animated images (like GIFs) should play

playing: boolean

URL of the image resource

url: string

Width of the image shape in canvas units

w: number