@gravity-ui/markdown-editor 13.16.0 → 13.17.1

package/build/esm/view/hocs/withYfmHtml/index.js

@@ -1,17 +1,17 @@
 import React, { forwardRef, useEffect } from 'react';
-import { useDiplodocHtml } from '@diplodoc/html-extension/react';
+import { useDiplodocEmbeddedContentController } from '@diplodoc/html-extension/react';
 import { useYfmHtmlBlockRuntime } from './useYfmHtmlBlockRuntime';
 export function withYfmHtmlBlock(opts) {
     return (Component) => forwardRef(function WithYfmHtml(props, ref) {
         const { meta, html, yfmHtmlBlockConfig } = props;
         useYfmHtmlBlockRuntime(meta, opts.runtime);
-        const yfmHtmlBlock = useDiplodocHtml();
+        const yfmHtmlBlock = useDiplodocEmbeddedContentController();
         useEffect(() => {
             if (yfmHtmlBlock) {
                 if (yfmHtmlBlockConfig) {
                     yfmHtmlBlock.setConfig(yfmHtmlBlockConfig);
                 }
-                yfmHtmlBlock.reinitialize();
+                yfmHtmlBlock.initialize();
             }
         }, [yfmHtmlBlock, html, yfmHtmlBlockConfig]);
         return React.createElement(Component, Object.assign({}, props, { ref: ref }));

package/build/styles.css

@@ -823,6 +823,44 @@ img.ProseMirror-separator {
   animation: placeholder_blink 1s;
   animation-iteration-count: infinite;
 }
+body :has(.g-md-resizable_resizing) {
+  cursor: col-resize;
+}
+
+.g-md-resizable {
+  position: relative;
+}
+.g-md-resizable_resizing .g-md-resizable__resizer-wrapper, .g-md-resizable_hover .g-md-resizable__resizer-wrapper {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 20px;
+  height: 100%;
+  cursor: col-resize;
+  pointer-events: auto;
+}
+.g-md-resizable_resizing .g-md-resizable__resizer-wrapper_left, .g-md-resizable_hover .g-md-resizable__resizer-wrapper_left {
+  left: 0;
+}
+.g-md-resizable_resizing .g-md-resizable__resizer-wrapper_right, .g-md-resizable_hover .g-md-resizable__resizer-wrapper_right {
+  right: 0;
+}
+.g-md-resizable__resizer {
+  opacity: 0;
+}
+.g-md-resizable_resizing .g-md-resizable__resizer, .g-md-resizable_hover .g-md-resizable__resizer {
+  box-sizing: content-box;
+  width: 4px;
+  height: 50px;
+  max-height: 50%;
+  opacity: 1;
+  border-radius: 6px;
+  background: rgba(127, 127, 127, 0.8);
+  transition: opacity 300ms ease-in 0s;
+}
 .g-md-editor.ProseMirror-focused .pm-node-selected {
   box-shadow: var(--g-color-text-info) 0 0 0 1px;
 }
@@ -1391,6 +1429,12 @@ img.ProseMirror-separator {
   position: relative;
   display: inline-block;
 }
+.g-md-img-settings-button {
+  position: absolute;
+  z-index: 2;
+  top: 3px;
+  right: 3px;
+}
 .yfm .yfm-note {
   max-width: 1296px;
   margin: 20px 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/markdown-editor",
-  "version": "13.16.0",
+  "version": "13.17.1",
   "description": "Markdown wysiwyg and markup editor",
   "license": "MIT",
   "repository": {
@@ -200,7 +200,7 @@
   },
   "devDependencies": {
     "@diplodoc/folding-headings-extension": "0.1.0",
-    "@diplodoc/html-extension": "1.5.0",
+    "@diplodoc/html-extension": "2.1.0",
     "@diplodoc/latex-extension": "1.0.3",
     "@diplodoc/mermaid-extension": "1.2.1",
     "@diplodoc/transform": "4.22.0",
@@ -275,10 +275,10 @@
   },
   "peerDependencies": {
     "@diplodoc/folding-headings-extension": "^0.1.0",
-    "@diplodoc/html-extension": "^1.2.7",
+    "@diplodoc/html-extension": "2.1.0",
     "@diplodoc/latex-extension": "^1.0.3",
     "@diplodoc/mermaid-extension": "^1.0.0",
-    "@diplodoc/transform": "^4.5.0",
+    "@diplodoc/transform": ">=4.5.0 <4.19.0",
     "@gravity-ui/components": "^3.0.0",
     "@gravity-ui/uikit": "^6.11.0",
     "highlight.js": "^11.8.0",