MediaStyleOptionDefinition
The definition of a single media style option used by the media embed style feature.
To customize a built-in style, re-declare it with the same name — only the fields you set will be replaced; the rest are inherited from the built-in. To register a brand-new style, provide a fresh name and a complete definition (title, icon, and — unless isDefault: true — className).
import sideIcon from 'path/to/icon.svg';
const sideStyle = {
name: 'side',
title: 'Side media',
icon: sideIcon,
className: 'media-style-side'
};
Each option registers a toggle button under the name 'mediaEmbed:{name}' in the UI component factory.
Properties
className : string | undefinedmodule:media-embed/mediaembedconfig~MediaStyleOptionDefinition#classNameThe CSS class added to the view
<figure>when this style is applied. Required for every non-default style — default styles are encoded as the absence of themediaStyleattribute, so they intentionally have no class.Inherited from the built-in style with the matching
namewhen not set.icon : string | undefinedmodule:media-embed/mediaembedconfig~MediaStyleOptionDefinition#iconThe button icon. Either an SVG XML source string, or one of the keys in
DEFAULT_ICONS('inlineLeft','left','center','right','inlineRight') to use one of the icons shipped with the plugin.Required when defining a custom style. Inherited from the built-in style with the matching
namewhen overriding a built-in.isDefault : boolean | undefinedmodule:media-embed/mediaembedconfig~MediaStyleOptionDefinition#isDefaultWhen
true, this style is the default state — applying it removes themediaStyleattribute from the model element (no class is written to the view). Default styles must not define aclassName.Inherited from the built-in style with the matching
namewhen not set.name : stringmodule:media-embed/mediaembedconfig~MediaStyleOptionDefinition#nameThe unique style name. It is used to:
- reference a built-in style or define a custom one,
- store the chosen style in the model as the
mediaStyleattribute, - register the toolbar button under
'mediaEmbed:{name}'.
title : string | undefinedmodule:media-embed/mediaembedconfig~MediaStyleOptionDefinition#titleThe button title. The title is wrapped in
editor.t()at button creation, so titles that match keys in the official translation set will be localized automatically.Required when defining a custom style. Inherited from the built-in style with the matching
namewhen overriding a built-in.