Skip to content

Commit 1ec1ab9

Browse files
authored
feat(docs): document image bubble menu form and unlink (#3372)
1 parent f5b1338 commit 1ec1ab9

2 files changed

Lines changed: 24 additions & 3 deletions

File tree

apps/docs/editor/api-reference/ui/bubble-menu.mdx

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -69,8 +69,8 @@ Image editing menu that appears when clicking an image.
6969
<BubbleMenu.ImageDefault />
7070
```
7171

72-
<ResponseField name="excludeItems" type="('edit-link')[]" default="[]">
73-
Actions to hide.
72+
<ResponseField name="excludeItems" type="('edit-link' | 'unlink')[]" default="[]">
73+
Actions to hide from the toolbar.
7474
</ResponseField>
7575

7676
<ResponseField name="placement" type="'top' | 'bottom'" default="'top'">
@@ -85,6 +85,18 @@ Image editing menu that appears when clicking an image.
8585
Called when the bubble menu is hidden.
8686
</ResponseField>
8787

88+
<ResponseField name="validateUrl" type="(value: string) => string | null">
89+
Custom URL validator. Return the valid URL string or `null`.
90+
</ResponseField>
91+
92+
<ResponseField name="onLinkApply" type="(href: string) => void">
93+
Called after a link is applied to the image.
94+
</ResponseField>
95+
96+
<ResponseField name="onLinkRemove" type="() => void">
97+
Called after a link is removed from the image.
98+
</ResponseField>
99+
88100
---
89101

90102
## Combining menus
@@ -216,6 +228,8 @@ Factory for common `trigger` functions:
216228
| -- | -- |
217229
| `BubbleMenu.ImageToolbar` | Wrapper -- hides when editing mode is active |
218230
| `BubbleMenu.ImageEditLink` | Button that enters editing mode |
231+
| `BubbleMenu.ImageUnlink` | Removes the link wrapping the image |
232+
| `BubbleMenu.ImageForm` | Inline form for editing the image's link |
219233

220234
---
221235

apps/docs/editor/features/styling.mdx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -198,12 +198,19 @@ The menu that appears when clicking an image
198198
/* Container */
199199
[data-re-img-bm] { }
200200

201-
/* Toolbar */
201+
/* Toolbar with action buttons */
202202
[data-re-img-bm-toolbar] { }
203203

204204
/* Action buttons */
205205
[data-re-img-bm-item] { }
206206
[data-re-img-bm-item][data-item="edit-link"] { }
207+
[data-re-img-bm-item][data-item="unlink"] { }
208+
209+
/* Edit form */
210+
[data-re-img-bm-form] { }
211+
[data-re-img-bm-input] { }
212+
[data-re-img-bm-apply] { }
213+
[data-re-img-bm-unlink] { }
207214
```
208215

209216
### Slash command

0 commit comments

Comments
 (0)