Maofeng
35 lines
1.1 KiB
Plaintext
35 lines
1.1 KiB
Plaintext
---
|
|
title: Asset picker
|
|
description: Reuse the media library as a controlled single- or multiple-selection dialog.
|
|
order: 30
|
|
toc:
|
|
- id: open-the-picker
|
|
title: Open the picker
|
|
- id: constrain-selection
|
|
title: Constrain selection
|
|
- id: consume-results
|
|
title: Consume results
|
|
---
|
|
|
|
## Open the picker {#open-the-picker}
|
|
|
|
`MediaPickerDialog` reuses the same adapter and folder model as the full library:
|
|
|
|
```tsx
|
|
import { MediaPickerDialog } from "@workspace/media"
|
|
|
|
;<MediaPickerDialog
|
|
open={open}
|
|
onOpenChange={setOpen}
|
|
onConfirm={(assets) => editor.insertImages(assets)}
|
|
/>
|
|
```
|
|
|
|
## Constrain selection {#constrain-selection}
|
|
|
|
Pass `allowedKinds={["image"]}` for an image-only workflow. The dialog selects one asset by default; pass `multiple` when the consumer accepts several assets, and provide `initialSelection` when editing an existing value.
|
|
|
|
## Consume results {#consume-results}
|
|
|
|
The confirmation callback receives complete `MediaAsset` records. Store the adapter-provided reference rather than a temporary preview URL when the result must survive signed-URL expiration.
|