All files / app/assets/javascripts/content_editor/extensions table_of_contents.js

100% Statements 10/10
50% Branches 1/2
100% Functions 5/5
100% Lines 10/10

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                        95x                 3x                     95x 95x   95x   190x     2x   2x 2x     2x            
import { Node, InputRule } from '@tiptap/core';
import { s__ } from '~/locale';
import { PARSE_HTML_PRIORITY_HIGHEST } from '../constants';
 
export default Node.create({
  name: 'tableOfContents',
 
  inline: false,
 
  group: 'block',
 
  parseHTML() {
    return [
      {
        tag: 'ul.section-nav',
        priority: PARSE_HTML_PRIORITY_HIGHEST,
      },
    ];
  },
 
  renderHTML() {
    return [
      'div',
      {
        class:
          'table-of-contents gl-border-1 gl-border-solid gl-text-center gl-border-gray-100 gl-mb-5',
      },
      s__('ContentEditor|Table of Contents'),
    ];
  },
 
  addInputRules() {
    const { type } = this;
    const inputRuleRegExps = [/^\[\[_TOC_\]\]$/, /^\[TOC\]$/];
 
    return inputRuleRegExps.map(
      (regex) =>
        new InputRule({
          find: regex,
          handler: ({ state, range: { from, to }, match }) => {
            const { tr } = state;
 
            Eif (match) {
              tr.replaceWith(from - 1, to, type.create());
            }
 
            return tr;
          },
        }),
    );
  },
});