tiptap/packages/extension-italic/src/italic.ts
Jonas b9bd469645
feat: Add key bindings for uppercase letters for bold, italic and underline (#2478)
This way, key bindings 'Mod-B', 'Mod-I' and 'Mod-U' with active caps
lock have the same effect as their lowercase siblings.

Prosemirror examples did the same, see ProseMirror/prosemirror#895

Fixes: #2426

Signed-off-by: Jonas <jonas@freesources.org>
2022-02-03 14:41:36 +01:00

111 lines
2.2 KiB
TypeScript

import {
Mark,
markInputRule,
markPasteRule,
mergeAttributes,
} from '@tiptap/core'
export interface ItalicOptions {
HTMLAttributes: Record<string, any>,
}
declare module '@tiptap/core' {
interface Commands<ReturnType> {
italic: {
/**
* Set an italic mark
*/
setItalic: () => ReturnType,
/**
* Toggle an italic mark
*/
toggleItalic: () => ReturnType,
/**
* Unset an italic mark
*/
unsetItalic: () => ReturnType,
}
}
}
export const starInputRegex = /(?:^|\s)((?:\*)((?:[^*]+))(?:\*))$/
export const starPasteRegex = /(?:^|\s)((?:\*)((?:[^*]+))(?:\*))/g
export const underscoreInputRegex = /(?:^|\s)((?:_)((?:[^_]+))(?:_))$/
export const underscorePasteRegex = /(?:^|\s)((?:_)((?:[^_]+))(?:_))/g
export const Italic = Mark.create<ItalicOptions>({
name: 'italic',
addOptions() {
return {
HTMLAttributes: {},
}
},
parseHTML() {
return [
{
tag: 'em',
},
{
tag: 'i',
getAttrs: node => (node as HTMLElement).style.fontStyle !== 'normal' && null,
},
{
style: 'font-style=italic',
},
]
},
renderHTML({ HTMLAttributes }) {
return ['em', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
},
addCommands() {
return {
setItalic: () => ({ commands }) => {
return commands.setMark(this.name)
},
toggleItalic: () => ({ commands }) => {
return commands.toggleMark(this.name)
},
unsetItalic: () => ({ commands }) => {
return commands.unsetMark(this.name)
},
}
},
addKeyboardShortcuts() {
return {
'Mod-i': () => this.editor.commands.toggleItalic(),
'Mod-I': () => this.editor.commands.toggleItalic(),
}
},
addInputRules() {
return [
markInputRule({
find: starInputRegex,
type: this.type,
}),
markInputRule({
find: underscoreInputRegex,
type: this.type,
}),
]
},
addPasteRules() {
return [
markPasteRule({
find: starPasteRegex,
type: this.type,
}),
markPasteRule({
find: underscorePasteRegex,
type: this.type,
}),
]
},
})