This is version 4 beta of Forma 36Go back to last stable version 3
Forma 36

Asset

The Asset component is a visual representation of an asset file such as a video or a PDF document. Use it when assets need to be presented to the user in a visual way but without necessarily showing the actual asset, for instance in a file selector, a drag-and-drop component, or when listing files. The Asset component composes the AssetIcon component.

Code examples

An image asset and an archived image asset

By default an asset with the type image will render the src attribute directly, like a HTML <img /> element.

If asset status is set to archived, an image icon is displayed instead of the actual image.

Props

NameRequiredDefaultTypeDescription
srcstringA `src` attribute to use for image assets
statusAssetStatusThe publish status of the asset
titlestringThe title of the asset
typeimage"archive" | "audio" | "code" | "image" | "markup" | "pdf" | "plaintext" | "presentation" | "richtext" | "spreadsheet" | "video"The type of asset being represented
classNamestringCSS class to be appended to the root element
styleCSSPropertiesAccepts a JavaScript object with camelCased properties rather than a CSS string
testIdcf-ui-assetstringA [data-test-id] attribute used for testing purposes