***

title: "AssetPickerDialog"
generated: true
---------------

## AssetPickerDialog

<GenerationInfo sourceFile="packages/dashboard/src/lib/components/shared/asset/asset-picker-dialog.tsx" sourceLine="73" packageName="@vendure/dashboard" />

A dialog which allows the creation and selection of assets.

```ts title="Signature"
function AssetPickerDialog(props: AssetPickerDialogProps): void
```

Parameters

### props

\<MemberInfo kind="parameter" type={`<a href='/current/core/reference/dashboard/components/asset-picker-dialog#assetpickerdialogprops'>AssetPickerDialogProps</a>`} />

## AssetPickerDialogProps

<GenerationInfo sourceFile="packages/dashboard/src/lib/components/shared/asset/asset-picker-dialog.tsx" sourceLine="24" packageName="@vendure/dashboard" />

Props for the [AssetPickerDialog](/current/core/reference/dashboard/components/asset-picker-dialog#assetpickerdialog) component.

```ts title="Signature"
interface AssetPickerDialogProps {
    open: boolean;
    onClose: () => void;
    onSelect: (assets: Asset[]) => void;
    multiSelect?: boolean;
    initialSelectedAssets?: Asset[];
    title?: string;
    pageId?: string;
}
```

<div className="members-wrapper">

### open

\<MemberInfo kind="property" type={`boolean`}   />

Whether the dialog is open.

### onClose

\<MemberInfo kind="property" type={`() => void`}   />

The function to call when the dialog is closed.

### onSelect

\<MemberInfo kind="property" type={`(assets: <a href='/current/core/reference/typescript-api/entities/asset#asset'>Asset</a>[]) => void`}   />

The function to call when assets are selected.

### multiSelect

\<MemberInfo kind="property" type={`boolean`}   />

Whether multiple assets can be selected.

### initialSelectedAssets

\<MemberInfo kind="property" type={`<a href='/current/core/reference/typescript-api/entities/asset#asset'>Asset</a>[]`}   />

The initial assets that should be selected.

### title

\<MemberInfo kind="property" type={`string`}   />

The title of the dialog.

### pageId

\<MemberInfo kind="property" type={`string`}   />

An optional page ID for the dialog. When provided, this is exposed via the
internal `PageContext` so that extensions can register
[DashboardActionBarItem](/current/core/reference/dashboard/extensions-api/action-bar#dashboardactionbaritem)s targeted at this specific dialog. Any
registered action bar items will be rendered in the dialog footer.

</div>