feat!: import yfmCut plugin from separate cut-extension package

demo/md-plugins.ts

@@ -1,4 +1,5 @@
 /* eslint-disable import/no-extraneous-dependencies */
+import {transform as yfmCut} from '@diplodoc/cut-extension';
 import {transform as foldingHeadings} from '@diplodoc/folding-headings-extension';
 import '@diplodoc/folding-headings-extension/runtime';
 import {transform as yfmHtmlBlock} from '@diplodoc/html-extension';
@@ -7,7 +8,6 @@ import {transform as mermaid} from '@diplodoc/mermaid-extension';
 import anchors from '@diplodoc/transform/lib/plugins/anchors';
 import checkbox from '@diplodoc/transform/lib/plugins/checkbox';
 import code from '@diplodoc/transform/lib/plugins/code';
-import cut from '@diplodoc/transform/lib/plugins/cut';
 import deflist from '@diplodoc/transform/lib/plugins/deflist';
 import file from '@diplodoc/transform/lib/plugins/file';
 import imsize from '@diplodoc/transform/lib/plugins/imsize';
@@ -34,7 +34,7 @@ export const YFM_HTML_BLOCK_RUNTIME = 'extension:yfm-html-block';
 const defaultPlugins: PluginWithParams[] = [
     anchors,
     code,
-    cut,
+    yfmCut({bundle: false}) as PluginWithParams,
     deflist,
     file,
     imsize,

package.json

@@ -200,6 +200,7 @@
     "tslib": "^2.3.1"
   },
   "devDependencies": {
+    "@diplodoc/cut-extension": "^0.3.1",
     "@diplodoc/folding-headings-extension": "0.1.0",
     "@diplodoc/html-extension": "2.3.2",
     "@diplodoc/latex-extension": "1.0.3",
@@ -276,6 +277,7 @@
     }
   },
   "peerDependencies": {
+    "@diplodoc/cut-extension": "^0.3.1",
     "@diplodoc/folding-headings-extension": "^0.1.0",
     "@diplodoc/html-extension": "2.3.2",
     "@diplodoc/latex-extension": "^1.0.3",

src/extensions/yfm/YfmCut/YfmCutSpecs/index.ts

@@ -1,5 +1,4 @@
-import log from '@diplodoc/transform/lib/log';
-import yfmPlugin from '@diplodoc/transform/lib/plugins/cut';
+import {transform as yfmCut} from '@diplodoc/cut-extension';
 import type {NodeSpec} from 'prosemirror-model';
 
 import type {ExtensionAuto, ExtensionNodeSpec} from '../../../../core';
@@ -29,7 +28,7 @@ export const YfmCutSpecs: ExtensionAuto<YfmCutSpecsOptions> = (builder, opts) =>
     const schemaSpecs = getSchemaSpecs(opts, builder.context.get('placeholder'));
 
     builder
-        .configureMd((md) => md.use(yfmPlugin, {log}))
+        .configureMd((md) => md.use(yfmCut({bundle: false})))
         .addNode(CutNode.Cut, () => ({
             spec: schemaSpecs[CutNode.Cut],
             toMd: serializerTokens[CutNode.Cut],

src/extensions/yfm/YfmCut/index.scss

@@ -9,14 +9,4 @@
     .yfm-cut-title:focus {
         outline: 0;
     }
-
-    /* TODO: Remove this after updating @diplodoc/transform to version 4.19.0 or higher */
-    /* This ensures backward compatibility with earlier versions of cut-extension */
-    .yfm-cut-title {
-        list-style: none;
-    }
-    .yfm-cut-title::-webkit-details-marker,
-    .yfm-cut-title::marker {
-        display: none;
-    }
 }

src/extensions/yfm/YfmCut/index.ts

@@ -1,3 +1,4 @@
+import '@diplodoc/cut-extension/runtime';
 import {chainCommands} from 'prosemirror-commands';
 
 import type {Action, ExtensionAuto} from '../../../core';
@@ -12,7 +13,8 @@ import {YfmCutTitleNodeView} from './nodeviews/yfm-cut-title';
 import {cutActivePlugin} from './plugins/active';
 import {cutAutoOpenPlugin} from './plugins/auto-open';
 
-import './index.scss';
+import '@diplodoc/cut-extension/runtime/styles.css';
+import './index.scss'; // eslint-disable-line import/order
 
 const cutAction = 'toYfmCut';