Merge branch 'main' into update(CodeBlock)/updated-new-code-paste

Author: ReFFaT

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [15.27.2](https://github.com/gravity-ui/markdown-editor/compare/v15.27.1...v15.27.2) (2025-12-19)
+
+
+### Bug Fixes
+
+* **CodeBlock:** apply syntax highlighting on initial render ([#902](https://github.com/gravity-ui/markdown-editor/issues/902)) ([87d7d98](https://github.com/gravity-ui/markdown-editor/commit/87d7d981e7a2815ecae5d11bd0170abdfee5c45f))
+
 ## [15.27.1](https://github.com/gravity-ui/markdown-editor/compare/v15.27.0...v15.27.1) (2025-12-12)
 
 

demo/stories/markdown/markup.ts

@@ -252,7 +252,7 @@ Sample text here...
 
 Syntax highlighting
 
-\`\`\` js
+\`\`\`javascript
 var foo = function (bar) {
     return bar++;
 };

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/markdown-editor",
-  "version": "15.27.1",
+  "version": "15.27.2",
   "description": "Markdown wysiwyg and markup editor",
   "license": "MIT",
   "repository": {

package.json

@@ -7,7 +7,7 @@ import {Plugin, PluginKey} from 'prosemirror-state';
 import type {Step} from 'prosemirror-transform';
 // @ts-ignore // TODO: fix cjs build
 import {findChildrenByType} from 'prosemirror-utils';
-import {Decoration, DecorationSet} from 'prosemirror-view';
+import {Decoration, DecorationSet, type EditorView} from 'prosemirror-view';
 
 import type {ExtensionAuto} from '../../../../core';
 import {capitalize} from '../../../../lodash';
@@ -64,6 +64,7 @@ export const CodeBlockHighlight: ExtensionAuto<CodeBlockHighlightOptions> = (bui
 
     builder.addPlugin(() => {
         let modulesLoaded = false;
+        let view: EditorView | null = null;
 
         const selectItems: LangSelectItem[] = [];
         const mapping: Record<string, string> = {};
@@ -90,6 +91,8 @@ export const CodeBlockHighlight: ExtensionAuto<CodeBlockHighlightOptions> = (bui
                                     }
                                 }
                             }
+
+                            view?.dispatch(view.state.tr.setMeta(key, {modulesLoaded}));
                         }
                     });
                     return getDecorations(state.doc);
@@ -99,6 +102,10 @@ export const CodeBlockHighlight: ExtensionAuto<CodeBlockHighlightOptions> = (bui
                         return DecorationSet.empty;
                     }
 
+                    if (tr.getMeta(key)?.modulesLoaded) {
+                        return getDecorations(tr.doc);
+                    }
+
                     if (tr.docChanged) {
                         const oldNodeName = oldState.selection.$head.parent.type.name;
                         const newNodeName = newState.selection.$head.parent.type.name;
@@ -143,13 +150,15 @@ export const CodeBlockHighlight: ExtensionAuto<CodeBlockHighlightOptions> = (bui
                     return decos.map(tr.mapping, tr.doc);
                 },
             },
-            view: (view) =>
-                codeLangSelectTooltipViewCreator(
+            view: (v) => {
+                view = v;
+                return codeLangSelectTooltipViewCreator(
                     view,
                     selectItems,
                     mapping,
                     Boolean(opts.lineNumbers?.enabled),
-                ),
+                );
+            },
             props: {
                 decorations: (state) => {
                     return key.getState(state);