Skip to content

Extend MediaReplaceFlow with additional options (toolbar icon, clear media) #34663

Closed

Description

@cr0ybot

What problem does this address?

I love that I have been able to use a premade component to handle adding & replacing media in my custom blocks, but the customization is a little bit lacking:

  1. I can change the text of the toolbar button, but I can't set a custom icon with label. I have a custom block that handles 2 images, a background and a foreground, so the toolbar gets really long with "Replace Background" and "Replace Foreground" in it.
  2. There is no option in the provided dropdown to clear the selected media. It would be really handy to include a "Clear Media" option under "Open Media Library" and "Upload" if an image is currently selected (which the MediaReplaceFlow component already knows about). I see that where this component is currently used (like the cover block), an extra setting has to be added in the sidebar to clear media.

What is your proposed solution?

  1. Add an icon prop to MediaReplaceFlow that, when defined, inserts an icon with label (using the name property) into the ToolbarButton.
  2. Add a "Clear Media" option in the dropdown if mediaID/mediaURL is not null/undefined. The onSelect callback set by the user should receive undefined (I think).

Activity

  1. added
    [Feature] Block APIAPI that allows to express the block paradigm.
    [Feature] ExtensibilityThe ability to extend blocks or the editing experience
    on Jul 5, 2023
  2. priethor commented on Aug 7, 2026

    @priethor
    Contributor

    Looks like both parts of this have landed. #64826 added Reset through onReset, and #68084 added renderToggle for custom toolbar controls. Both are still in the current component, so I think we can close this one. Please reopen if there's still an extension point missing here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Needs Design FeedbackNeeds general design feedback.[Feature] Block APIAPI that allows to express the block paradigm.[Feature] ExtensibilityThe ability to extend blocks or the editing experience[Feature] MediaAnything that impacts the experience of managing media[Type] EnhancementA suggestion for improvement.

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions