This article provides practical examples of using native actions, custom actions, and display filters in your component manifests.
A simple override that changes the labels without changing the behavior:
The TemplateContainer component adds a "Settings" custom action that dispatches an event to the editor script:
The Button component surfaces its child AnimatedIcon's customization panel. The AnimatedIcon is a ref element with selectable: false, so users can't select it directly. The forward action lets the parent Button expose the icon's editing UI.
When using actionName: "custom", the target element must have a matching customActions entry in its own manifest. In this case, the AnimatedIcon component defines customActions.animatedIcon which the forward action invokes.
The Slideshow component overrides manageItems to manage slides, and adds a custom forward action for the navigation icon:
Quick-access buttons for specific styling controls:
The following example uses hide to remove specific actions and data items from the editor:
The following example uses show to allow only the settings and design actions to be visible: