useAsset • tldraw Docs

This is a handy helper hook that resolves an asset to an optimized URL for a given shape, or its placeholder if the asset is still uploading. This is used in particular for high-resolution images when you want lower and higher resolution depending on the context.

For image scaling to work, you need to implement scaled URLs in TLAssetStore.resolve.

function useAsset(options: {
  assetId: null | TLAssetId
  shapeId: TLShapeId
  width: number
}): {
  asset: import('@tldraw/editor').TLAsset | null | undefined
  isPlaceholder: boolean
  url: null | string
}

Parameters

Name	Description
`options`	`{ assetId: null \| TLAssetId shapeId: TLShapeId width: number }`

Returns

{
  asset: import('@tldraw/editor').TLAsset | null | undefined
  isPlaceholder: boolean
  url: null | string
}