2021-06-08 01:23:25 +05:30
|
|
|
import { CodeBlockLowlight } from '@tiptap/extension-code-block-lowlight';
|
2021-09-04 01:27:46 +05:30
|
|
|
import * as lowlight from 'lowlight';
|
2021-04-29 21:17:54 +05:30
|
|
|
|
2021-09-04 01:27:46 +05:30
|
|
|
const extractLanguage = (element) => element.getAttribute('lang');
|
2021-04-29 21:17:54 +05:30
|
|
|
|
2021-10-27 15:23:28 +05:30
|
|
|
export default CodeBlockLowlight.extend({
|
2022-01-26 12:08:38 +05:30
|
|
|
isolating: true,
|
|
|
|
|
2021-06-08 01:23:25 +05:30
|
|
|
addAttributes() {
|
2021-04-29 21:17:54 +05:30
|
|
|
return {
|
2021-09-04 01:27:46 +05:30
|
|
|
language: {
|
|
|
|
default: null,
|
2021-11-11 11:23:49 +05:30
|
|
|
parseHTML: (element) => extractLanguage(element),
|
2021-09-04 01:27:46 +05:30
|
|
|
},
|
|
|
|
class: {
|
2021-11-18 22:05:49 +05:30
|
|
|
// eslint-disable-next-line @gitlab/require-i18n-strings
|
|
|
|
default: 'code highlight',
|
2021-09-04 01:27:46 +05:30
|
|
|
},
|
2021-04-29 21:17:54 +05:30
|
|
|
};
|
2021-06-08 01:23:25 +05:30
|
|
|
},
|
2021-09-04 01:27:46 +05:30
|
|
|
renderHTML({ HTMLAttributes }) {
|
2022-03-02 08:16:31 +05:30
|
|
|
return [
|
|
|
|
'pre',
|
|
|
|
{
|
|
|
|
...HTMLAttributes,
|
|
|
|
class: `content-editor-code-block ${HTMLAttributes.class}`,
|
|
|
|
},
|
|
|
|
['code', {}, 0],
|
|
|
|
];
|
2021-09-04 01:27:46 +05:30
|
|
|
},
|
|
|
|
}).configure({
|
|
|
|
lowlight,
|
2021-06-08 01:23:25 +05:30
|
|
|
});
|