tiptap/packages/extension-italic/src/italic.ts

110 lines
2.2 KiB
TypeScript
Raw Normal View History

2020-09-24 06:29:05 +08:00
import {
Mark,
2020-11-13 23:44:22 +08:00
markInputRule,
markPasteRule,
2020-11-25 16:50:54 +08:00
mergeAttributes,
2020-09-24 06:29:05 +08:00
} from '@tiptap/core'
2020-09-22 05:17:30 +08:00
2020-11-13 23:44:22 +08:00
export interface ItalicOptions {
2021-04-21 15:43:31 +08:00
HTMLAttributes: Record<string, any>,
2020-11-13 23:44:22 +08:00
}
2021-02-10 16:59:35 +08:00
declare module '@tiptap/core' {
2021-06-05 03:56:29 +08:00
interface Commands<ReturnType> {
2021-02-16 18:27:58 +08:00
italic: {
/**
* Set an italic mark
*/
2021-06-05 03:56:29 +08:00
setItalic: () => ReturnType,
2021-02-16 18:27:58 +08:00
/**
* Toggle an italic mark
*/
2021-06-05 03:56:29 +08:00
toggleItalic: () => ReturnType,
2021-02-16 18:27:58 +08:00
/**
* Unset an italic mark
*/
2021-06-05 03:56:29 +08:00
unsetItalic: () => ReturnType,
2021-02-16 18:27:58 +08:00
}
2021-02-10 16:59:35 +08:00
}
}
export const starInputRegex = /(?:^|\s)((?:\*)((?:[^*]+))(?:\*))$/
export const starPasteRegex = /(?:^|\s)((?:\*)((?:[^*]+))(?:\*))/g
export const underscoreInputRegex = /(?:^|\s)((?:_)((?:[^_]+))(?:_))$/
export const underscorePasteRegex = /(?:^|\s)((?:_)((?:[^_]+))(?:_))/g
2020-09-10 00:47:47 +08:00
2021-02-11 01:25:08 +08:00
export const Italic = Mark.create<ItalicOptions>({
2020-10-22 18:34:49 +08:00
name: 'italic',
addOptions() {
return {
HTMLAttributes: {},
}
2020-11-13 23:44:22 +08:00
},
2020-10-22 18:34:49 +08:00
parseHTML() {
return [
2020-10-08 09:57:45 +08:00
{
tag: 'em',
},
{
tag: 'i',
getAttrs: node => (node as HTMLElement).style.fontStyle !== 'normal' && null,
},
{
style: 'font-style=italic',
},
2020-10-22 18:34:49 +08:00
]
},
2020-11-13 23:07:20 +08:00
renderHTML({ HTMLAttributes }) {
2020-11-25 16:50:54 +08:00
return ['em', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
2020-10-22 18:34:49 +08:00
},
addCommands() {
return {
2021-02-10 16:59:35 +08:00
setItalic: () => ({ commands }) => {
2021-12-02 21:56:57 +08:00
return commands.setMark(this.name)
2020-11-18 04:49:23 +08:00
},
2021-02-10 16:59:35 +08:00
toggleItalic: () => ({ commands }) => {
2021-12-02 21:56:57 +08:00
return commands.toggleMark(this.name)
2020-10-22 18:34:49 +08:00
},
2021-02-10 16:59:35 +08:00
unsetItalic: () => ({ commands }) => {
2021-12-02 21:56:57 +08:00
return commands.unsetMark(this.name)
2020-11-18 04:49:23 +08:00
},
2020-10-22 18:34:49 +08:00
}
},
addKeyboardShortcuts() {
return {
2020-11-18 04:49:23 +08:00
'Mod-i': () => this.editor.commands.toggleItalic(),
2020-10-22 18:34:49 +08:00
}
},
addInputRules() {
return [
markInputRule({
find: starInputRegex,
type: this.type,
}),
markInputRule({
find: underscoreInputRegex,
type: this.type,
}),
2020-10-22 18:34:49 +08:00
]
},
addPasteRules() {
return [
markPasteRule({
find: starPasteRegex,
type: this.type,
}),
markPasteRule({
find: underscorePasteRegex,
type: this.type,
}),
2020-10-22 18:34:49 +08:00
]
},
})