File "background-color.ts"
Full Path: /home/markqprx/iniasli.pro/client/text-editor/extensions/background-color.ts
File size: 1.45 KB
MIME-type: text/plain
Charset: utf-8
import {Extension} from '@tiptap/core';
import '@tiptap/extension-text-style';
export type ColorOptions = {
types: string[];
};
declare module '@tiptap/core' {
interface Commands<ReturnType> {
bgColor: {
setBackgroundColor: (color: string) => ReturnType;
unsetBackgroundColor: () => ReturnType;
};
}
}
export const BackgroundColor = Extension.create<ColorOptions>({
name: 'backgroundColor',
addOptions() {
return {
types: ['textStyle'],
};
},
addGlobalAttributes() {
return [
{
types: this.options.types,
attributes: {
backgroundColor: {
default: null,
parseHTML: element =>
element.style.backgroundColor.replace(/['"]+/g, ''),
renderHTML: attributes => {
if (!attributes.backgroundColor) {
return {};
}
return {
style: `background-color: ${attributes.backgroundColor}`,
};
},
},
},
},
];
},
addCommands() {
return {
setBackgroundColor:
backgroundColor =>
({chain}) => {
return chain().setMark('textStyle', {backgroundColor}).run();
},
unsetBackgroundColor:
() =>
({chain}) => {
return chain()
.setMark('textStyle', {backgroundColor: null})
.removeEmptyTextStyle()
.run();
},
};
},
});