summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/content_editor/extensions/html_marks.js
blob: 54adb9efa0c2e5864dc528423eba5deef88dd483 (plain)
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
import { Mark, mergeAttributes, markInputRule } from '@tiptap/core';
import { PARSE_HTML_PRIORITY_LOWEST } from '../constants';
import { markInputRegex, extractMarkAttributesFromMatch } from '../services/mark_utils';

const marks = [
  'ins',
  'abbr',
  'bdo',
  'cite',
  'dfn',
  'mark',
  'small',
  'span',
  'time',
  'kbd',
  'q',
  'samp',
  'var',
  'ruby',
  'rp',
  'rt',
];

const attrs = {
  time: ['datetime'],
  abbr: ['title'],
  span: ['dir'],
  bdo: ['dir'],
};

export default marks.map((name) =>
  Mark.create({
    name,

    inclusive: false,

    defaultOptions: {
      HTMLAttributes: {},
    },

    addAttributes() {
      return (attrs[name] || []).reduce(
        (acc, attr) => ({
          ...acc,
          [attr]: {
            default: null,
            parseHTML: (element) => element.getAttribute(attr),
          },
        }),
        {},
      );
    },

    parseHTML() {
      return [{ tag: name, priority: PARSE_HTML_PRIORITY_LOWEST }];
    },

    renderHTML({ HTMLAttributes }) {
      return [name, mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0];
    },

    addInputRules() {
      return [markInputRule(markInputRegex(name), this.type, extractMarkAttributesFromMatch)];
    },
  }),
);