# media (/themes/sdk/reference/media)

```ts
import { … } from '@poltura/theme-sdk/media';
```

## [Hooks](/themes/sdk/reference/media/hooks) [#hooks]

| Name | What it is |
| --- | --- |
| [`useMedia`](/themes/sdk/reference/media/hooks#usemedia) | The media library file or theme asset a media field's value names. |
| [`useMediaDrawn`](/themes/sdk/reference/media/hooks#usemediadrawn) | Whether a media field's value draws a picture, so a layout can drop the frame when it does not. |
| [`useThemeAsset`](/themes/sdk/reference/media/hooks#usethemeasset) | A theme asset as media renderers read it. |
| [`useAssetUrl`](/themes/sdk/reference/media/hooks#useasseturl) | The URL a theme asset loads from: one rendition of an image with a role, otherwise the file whole. |
| [`useVideoSetting`](/themes/sdk/reference/media/hooks#usevideosetting) | A `video` setting resolved to the file or player it plays, with its poster and how it plays. |

## [Parts](/themes/sdk/reference/media/parts) [#parts]

| Name | What it is |
| --- | --- |
| [`MediaImage`](/themes/sdk/reference/media/parts#mediaimage) | A responsive image in every format the browser takes, with blur-up and broken-link recovery. |
| [`MediaPlaceholder`](/themes/sdk/reference/media/parts#mediaplaceholder) | The neutral drawing shown where an image is not chosen yet. |
| [`SettingVideo`](/themes/sdk/reference/media/parts#settingvideo) | Draws a `video` setting: the file with its poster, autoplay, loop and mute, or the YouTube or Vimeo player, with its text alternative. |

## [Functions](/themes/sdk/reference/media/functions) [#functions]

| Name | What it is |
| --- | --- |
| [`asset`](/themes/sdk/reference/media/functions#asset) | A reference to a file under the theme's `assets/` folder, by its path there. |
| [`mediaUrl`](/themes/sdk/reference/media/functions#mediaurl) | The URL of one rendition of a stored image; any other URL comes back as it is. |

## [Constants](/themes/sdk/reference/media/constants) [#constants]

| Name | What it is |
| --- | --- |
| [`MEDIA_ROLES`](/themes/sdk/reference/media/constants#media_roles) | Every rendition a merchant or a setting can pick. |

## [Types](/themes/sdk/reference/media/types) [#types]

| Name | What it is |
| --- | --- |
| [`AssetRef`](/themes/sdk/reference/media/types#assetref) | A reference to a file under the theme's `assets/` folder, as `asset()` returns it. |
| [`MediaFormat`](/themes/sdk/reference/media/types#mediaformat) | An image file format a rendition can be served in. |
| [`MediaImageRef`](/themes/sdk/reference/media/types#mediaimageref) | An image a view model carries: the stored URL plus what was measured when it was uploaded. |
| [`MediaRole`](/themes/sdk/reference/media/types#mediarole) | The rendition an image is drawn at; each role has its own size and crop. |
| [`ResolvedMedia`](/themes/sdk/reference/media/types#resolvedmedia) | A media library file or theme asset, resolved for drawing. |
| [`VideoValue`](/themes/sdk/reference/media/types#videovalue) | The value of a `video` setting: the source alone, or the source with how it plays. |
| [`MediaImageProps`](/themes/sdk/reference/media/types#mediaimageprops) | Props of [`MediaImage`](/themes/sdk/reference/media/parts#mediaimage). |
| [`MediaPlaceholderProps`](/themes/sdk/reference/media/types#mediaplaceholderprops) | Props of [`MediaPlaceholder`](/themes/sdk/reference/media/parts#mediaplaceholder). |
| [`VideoSettingView`](/themes/sdk/reference/media/types#videosettingview) | A `video` setting ready to draw. |
| [`SettingVideoProps`](/themes/sdk/reference/media/types#settingvideoprops) | Props of [`SettingVideo`](/themes/sdk/reference/media/parts#settingvideo). |

<AnchorRedirect to={{"hooks":"/themes/sdk/reference/media/hooks","usemedia":"/themes/sdk/reference/media/hooks","usemediadrawn":"/themes/sdk/reference/media/hooks","usethemeasset":"/themes/sdk/reference/media/hooks","useasseturl":"/themes/sdk/reference/media/hooks","usevideosetting":"/themes/sdk/reference/media/hooks","parts":"/themes/sdk/reference/media/parts","mediaimage":"/themes/sdk/reference/media/parts","mediaplaceholder":"/themes/sdk/reference/media/parts","settingvideo":"/themes/sdk/reference/media/parts","functions":"/themes/sdk/reference/media/functions","asset":"/themes/sdk/reference/media/functions","mediaurl":"/themes/sdk/reference/media/functions","constants":"/themes/sdk/reference/media/constants","media_roles":"/themes/sdk/reference/media/constants","types":"/themes/sdk/reference/media/types","assetref":"/themes/sdk/reference/media/types","mediaformat":"/themes/sdk/reference/media/types","mediaimageref":"/themes/sdk/reference/media/types","mediarole":"/themes/sdk/reference/media/types","resolvedmedia":"/themes/sdk/reference/media/types","videovalue":"/themes/sdk/reference/media/types","mediaimageprops":"/themes/sdk/reference/media/types","mediaplaceholderprops":"/themes/sdk/reference/media/types","videosettingview":"/themes/sdk/reference/media/types","settingvideoprops":"/themes/sdk/reference/media/types"}} />