fix: replace require() with esm import (#129)

Author: d3m1d0v

demo/md-plugins.ts

@@ -3,10 +3,10 @@ import type {PluginWithParams} from 'markdown-it/lib';
 import file from '@doc-tools/transform/lib/plugins/file';
 import imsize from '@doc-tools/transform/lib/plugins/imsize';
 
-const sub = require('markdown-it-sub');
-const ins = require('markdown-it-ins');
-const mark = require('markdown-it-mark');
-const color = require('markdown-it-color').colorPlugin;
+import sub from 'markdown-it-sub';
+import ins from 'markdown-it-ins';
+import mark from 'markdown-it-mark';
+import color from 'markdown-it-color';
 import math from 'markdown-it-katex';
 
 import meta from '@doc-tools/transform/lib/plugins/meta';

src/core/ExtensionsManager.ts

@@ -1,4 +1,5 @@
 import MarkdownIt from 'markdown-it';
+import attrsPlugin, {AttrsOptions} from 'markdown-it-attrs';
 import type {Plugin} from 'prosemirror-state';
 import {ActionsManager} from './ActionsManager';
 import {ExtensionBuilder} from './ExtensionBuilder';
@@ -15,8 +16,6 @@ import type {
 } from './types/extension';
 import type {MarkViewConstructor, NodeViewConstructor} from './types/node-views';
 
-const attrs = require('markdown-it-attrs');
-
 type ExtensionsManagerParams = {
     extensions: Extension;
     options?: ExtensionsManagerOptions;
@@ -59,7 +58,10 @@ export class ExtensionsManager {
     constructor({extensions, options = {}}: ExtensionsManagerParams) {
         this.#extensions = extensions;
 
-        this.#md = new MarkdownIt(options.mdOpts ?? {}).use(attrs, options.attrsOpts ?? {});
+        this.#md = new MarkdownIt(options.mdOpts ?? {}).use<AttrsOptions>(
+            attrsPlugin,
+            options.attrsOpts ?? {},
+        );
         this.#mdWithoutAttrs = new MarkdownIt(options.mdOpts ?? {});
 
         if (options.linkifyTlds) {

src/extensions/markdown/Deflist/DeflistSpecs/index.ts

@@ -1,4 +1,4 @@
-import type {PluginSimple} from 'markdown-it';
+import deflistPlugin from 'markdown-it-deflist';
 import type {NodeSpec} from 'prosemirror-model';
 import type {ExtensionAuto} from '../../../../core';
 import {nodeTypeFactory} from '../../../../utils/schema';
@@ -7,8 +7,6 @@ import {fromYfm} from './fromYfm';
 import {getSpec} from './spec';
 import {toYfm} from './toYfm';
 
-const mdPlugin: PluginSimple = require('markdown-it-deflist');
-
 export {DeflistNode} from './const';
 export const defListType = nodeTypeFactory(DeflistNode.List);
 export const defTermType = nodeTypeFactory(DeflistNode.Term);
@@ -22,7 +20,7 @@ export type DeflistSpecsOptions = {
 export const DeflistSpecs: ExtensionAuto<DeflistSpecsOptions> = (builder, opts) => {
     const spec = getSpec(opts);
 
-    builder.configureMd((md) => md.use(mdPlugin));
+    builder.configureMd((md) => md.use(deflistPlugin));
     builder
         .addNode(DeflistNode.List, () => ({
             spec: spec[DeflistNode.List],

src/extensions/markdown/Mark/MarkSpecs/index.ts

@@ -1,14 +1,13 @@
-import type {PluginSimple} from 'markdown-it';
+import markPlugin from 'markdown-it-mark';
 import type {ExtensionAuto} from '../../../../core';
 import {markTypeFactory} from '../../../../utils/schema';
-const mdPlugin: PluginSimple = require('markdown-it-mark');
 
 export const markMarkName = 'mark';
 export const markMarkType = markTypeFactory(markMarkName);
 
 export const MarkSpecs: ExtensionAuto = (builder) => {
     builder
-        .configureMd((md) => md.use(mdPlugin))
+        .configureMd((md) => md.use(markPlugin))
         .addMark(markMarkName, () => ({
             spec: {
                 parseDOM: [{tag: 'mark'}],

src/extensions/markdown/Subscript/SubscriptSpecs/index.ts

@@ -1,15 +1,13 @@
-import type {PluginSimple} from 'markdown-it';
+import subPlugin from 'markdown-it-sub';
 import type {ExtensionAuto} from '../../../../core';
 import {markTypeFactory} from '../../../../utils/schema';
 
-const sub: PluginSimple = require('markdown-it-sub');
-
 export const subscriptMarkName = 'sub';
 export const subscriptType = markTypeFactory(subscriptMarkName);
 
 export const SubscriptSpecs: ExtensionAuto = (builder) => {
     builder
-        .configureMd((md) => md.use(sub))
+        .configureMd((md) => md.use(subPlugin))
         .addMark(subscriptMarkName, () => ({
             spec: {
                 excludes: '_',

src/extensions/markdown/Underline/UnderlineSpecs/index.ts

@@ -1,15 +1,13 @@
-import type {PluginSimple} from 'markdown-it';
+import insPlugin from 'markdown-it-ins';
 import type {ExtensionAuto} from '../../../../core';
 import {markTypeFactory} from '../../../../utils/schema';
 
-const ins: PluginSimple = require('markdown-it-ins');
-
 export const underlineMarkName = 'ins';
 export const underlineType = markTypeFactory(underlineMarkName);
 
 export const UnderlineSpecs: ExtensionAuto = (builder) => {
     builder
-        .configureMd((md) => md.use(ins))
+        .configureMd((md) => md.use(insPlugin))
         .addMark(underlineMarkName, () => ({
             spec: {
                 parseDOM: [{tag: 'ins'}, {tag: 'u'}],

src/global.d.ts

@@ -0,0 +1,42 @@
+/* eslint-disable @typescript-eslint/no-duplicate-imports */
+
+declare module 'markdown-it-attrs' {
+    import type {PluginWithOptions} from 'markdown-it';
+    export type AttrsOptions = {
+        /** @default '{' */
+        leftDelimiter?: string;
+        /** @default '}' */
+        rightDelimiter?: string;
+        /**
+         * empty array = all attributes are allowed
+         * @default []
+         */
+        allowedAttributes?: (string | RegExp)[];
+    };
+    declare const plugin: PluginWithOptions<AttrsOptions>;
+    export = plugin;
+}
+
+declare module 'markdown-it-deflist' {
+    import type {PluginSimple} from 'markdown-it';
+    declare const plugin: PluginSimple;
+    export = plugin;
+}
+
+declare module 'markdown-it-mark' {
+    import type {PluginSimple} from 'markdown-it';
+    declare const plugin: PluginSimple;
+    export = plugin;
+}
+
+declare module 'markdown-it-sub' {
+    import type {PluginSimple} from 'markdown-it';
+    declare const plugin: PluginSimple;
+    export = plugin;
+}
+
+declare module 'markdown-it-ins' {
+    import type {PluginSimple} from 'markdown-it';
+    declare const plugin: PluginSimple;
+    export = plugin;
+}