diff --git a/src/bundle/Resources/public/js/alloyeditor/src/buttons/ez-btn-styleslistitem.js b/src/bundle/Resources/public/js/alloyeditor/src/buttons/ez-btn-styleslistitem.js index e452cdf0a8..e18ff4df20 100644 --- a/src/bundle/Resources/public/js/alloyeditor/src/buttons/ez-btn-styleslistitem.js +++ b/src/bundle/Resources/public/js/alloyeditor/src/buttons/ez-btn-styleslistitem.js @@ -18,6 +18,7 @@ export default class EzBtnStylesListItem extends AlloyEditor.ButtonStylesListIte className={className} dangerouslySetInnerHTML={{ __html: this._preview }} onClick={() => { + this.clearEzAttributes(); this._onClick(); this.fireCustomUpdateEvent(); }} @@ -26,6 +27,17 @@ export default class EzBtnStylesListItem extends AlloyEditor.ButtonStylesListIte ); } + clearEzAttributes() { + const nativeEditor = this.props.editor.get('nativeEditor'); + const block = nativeEditor.elementPath().block; + const attrsToRemove = ['ezelement', 'eztype', 'ezname']; + const targetName = this.props.style.attributes ? this.props.style.attributes['data-ezname'] : ''; + + if (block.$.dataset.eztype === 'style' && block.$.dataset.ezname !== targetName) { + attrsToRemove.forEach(attr => block.$.removeAttribute(`data-${attr}`)); + } + } + fireCustomUpdateEvent() { const nativeEditor = this.props.editor.get('nativeEditor'); diff --git a/src/bundle/Resources/public/js/alloyeditor/src/toolbars/config/ez-custom-style.js b/src/bundle/Resources/public/js/alloyeditor/src/toolbars/config/ez-custom-style.js index 1683ee358a..10e4d8d71c 100644 --- a/src/bundle/Resources/public/js/alloyeditor/src/toolbars/config/ez-custom-style.js +++ b/src/bundle/Resources/public/js/alloyeditor/src/toolbars/config/ez-custom-style.js @@ -20,16 +20,6 @@ export default class EzCustomStyleConfig extends EzConfigBase { this.addExtraButtons(config.extraButtons); } - getStyles(customStyles = []) { - return { - name: 'styles', - cfg: { - showRemoveStylesItem: false, - styles: [...customStyles], - }, - }; - } - /** * Tests whether the `custom style` toolbar should be visible. It is * visible when an existing custom style gets the focus.