Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 | 1442x 69x 1x 69x 69x 2x 2x 2x 2x 2x 1x 1x 1x 65x | import { Node, InputRule } from '@tiptap/core';
import { initEmojiMap, getEmojiMap } from '~/emoji';
import { PARSE_HTML_PRIORITY_HIGHEST } from '../constants';
export default Node.create({
name: 'emoji',
inline: true,
group: 'inline',
draggable: true,
addAttributes() {
return {
moji: { default: null },
name: { default: null },
title: { default: null },
unicodeVersion: { default: '6.0' },
};
},
parseHTML() {
return [
{
tag: 'gl-emoji',
getAttrs: (el) => ({
name: el.dataset.name,
title: el.getAttribute('title'),
moji: el.textContent,
unicodeVersion: el.dataset.unicodeVersion || '6.0',
}),
},
{
tag: 'img.emoji',
getAttrs: (el) => {
const name = el.getAttribute('title').replace(/^:|:$/g, '');
return {
name,
title: name,
moji: name,
unicodeVersion: 'custom',
};
},
priority: PARSE_HTML_PRIORITY_HIGHEST,
},
];
},
renderHTML({ node }) {
return [
'gl-emoji',
{
'data-name': node.attrs.name,
title: node.attrs.title,
'data-unicode-version': node.attrs.unicodeVersion,
},
node.attrs.moji || '',
];
},
addInputRules() {
const emojiInputRegex = /(?:^|\s)(:(\w+):)$/;
return [
new InputRule({
find: emojiInputRegex,
handler: ({ state, range: { from, to }, match }) => {
const [, , name] = match;
const emojis = getEmojiMap();
const emoji = emojis[name];
const { tr } = state;
if (emoji) {
tr.replaceWith(from, to, [
state.schema.text(' '),
this.type.create({ name, moji: emoji.e, unicodeVersion: emoji.u, title: emoji.d }),
]);
return tr;
}
return null;
},
}),
];
},
onCreate() {
initEmojiMap();
},
});
|