Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Add button with shortcode icon into richText panel

Browse Source 
[MAILPOET-6354]
This commit is contained in:
Jan Lysý
2024-11-29 13:32:44 +01:00
committed by Aschepikov
parent 1a9b711b1f
commit 99d4c3bcaf
3 changed files with 58 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/js/email-editor/src/blocks/core/rich-text.ts
View File

@ -1,18 +0,0 @@
import { unregisterFormatType } from '@wordpress/rich-text';
/**
* Disable Rich text formats we currently cannot support
* Note: This will remove its support for all blocks in the email editor e.g., p, h1,h2, etc
*/
function disableCertainRichTextFormats() {
// remove support for inline image - We can't use it
unregisterFormatType( 'core/image' );
// remove support for Inline code - Not well formatted
unregisterFormatType( 'core/code' );
// remove support for Language - Not supported for now
unregisterFormatType( 'core/language' );
}
export { disableCertainRichTextFormats };

53
packages/js/email-editor/src/blocks/core/rich-text.tsx Normal file
View File

@ -0,0 +1,53 @@
import { registerFormatType, unregisterFormatType } from '@wordpress/rich-text';
import { __ } from '@wordpress/i18n';
import { BlockControls } from '@wordpress/block-editor';
import { ToolbarButton, ToolbarGroup } from '@wordpress/components';
/**
* Disable Rich text formats we currently cannot support
* Note: This will remove its support for all blocks in the email editor e.g., p, h1,h2, etc
*/
function disableCertainRichTextFormats() {
// remove support for inline image - We can't use it
unregisterFormatType( 'core/image' );
// remove support for Inline code - Not well formatted
unregisterFormatType( 'core/code' );
// remove support for Language - Not supported for now
unregisterFormatType( 'core/language' );
}
/**
* A button to the rich text editor to open modal with registered personalization tags.
*/
function PersonalizationTagsButton() {
return (
<BlockControls>
<ToolbarGroup>
<ToolbarButton
icon="shortcode"
title={ __( 'Personalization Tags', 'mailpoet' ) }
onClick={ () => {} }
/>
</ToolbarGroup>
</BlockControls>
);
}
/**
* Extend the rich text formats with a button for personalization tags.
*/
function extendRichTextFormats() {
registerFormatType( 'mailpoet-email-editor/shortcode', {
title: __( 'Personalization Tags', 'mailpoet' ),
className: 'mailpoet-email-editor-personalization-tags',
tagName: 'span',
// eslint-disable-next-line @typescript-eslint/ban-ts-comment -- The types does not match
// @ts-ignore
attributes: {},
edit: PersonalizationTagsButton,
} );
}
export { disableCertainRichTextFormats, extendRichTextFormats };

6
packages/js/email-editor/src/blocks/index.ts
View File

@ -8,7 +8,10 @@ import {
import { enhancePostContentBlock } from './core/post-content';
import { disableGroupVariations } from './core/group';
import { disableImageFilter, hideExpandOnClick } from './core/image';
import { disableCertainRichTextFormats } from './core/rich-text';
import {
disableCertainRichTextFormats,
extendRichTextFormats,
} from './core/rich-text';
import { enhanceButtonBlock } from './core/button';
import { enhanceButtonsBlock } from './core/buttons';
import { alterSupportConfiguration } from './core/general-block-support';
@ -25,6 +28,7 @@ export function initBlocks() {
enhanceColumnBlock();
enhanceColumnsBlock();
enhancePostContentBlock();
extendRichTextFormats();
alterSupportConfiguration();
registerCoreBlocks();
}