@worktile/theia 20.1.0-next.4 → 20.1.0-next.6

package/fesm2022/worktile-theia.mjs

@@ -10,7 +10,7 @@ import { cloneDeep, map, assign, defaults, groupBy, uniq, isEqual } from 'lodash
 export { assign, cloneDeep, debounce, defaults, groupBy, isEqual, map, uniq } from 'lodash';
 import { Editor, Element, Span, Range, Path, Node, Point, Text, Transforms, Operation, createEditor } from 'slate';
 import * as i4 from 'slate-angular';
-import { FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, getClipboardData, AngularEditor, hotkeys, getPlainText as getPlainText$1, createClipboardData, setClipboardData, BaseElementComponent, IS_SAFARI, ELEMENT_TO_COMPONENT, SlateModule, getBlockCardByNativeElement, SLATE_BLOCK_CARD_CLASS_NAME, BaseElementFlavour, hasBlockCard, isCardLeft, DefaultTextFlavour, defaultScrollSelectionIntoView, getDataTransferClipboard, JUST_NOW_UPDATED_VIRTUAL_VIEW, SLATE_DEBUG_KEY, withAngular } from 'slate-angular';
+import { FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, getClipboardData, AngularEditor, hotkeys, getPlainText as getPlainText$1, createClipboardData, setClipboardData, BaseElementComponent, IS_SAFARI, ELEMENT_TO_COMPONENT, SlateModule, getBlockCardByNativeElement, SLATE_BLOCK_CARD_CLASS_NAME, BaseElementFlavour, hasBlockCard, isCardLeft, ELEMENT_KEY_TO_HEIGHTS, DefaultTextFlavour, defaultScrollSelectionIntoView, getDataTransferClipboard, JUST_NOW_UPDATED_VIRTUAL_VIEW, SLATE_DEBUG_KEY, withAngular } from 'slate-angular';
 import { HistoryEditor, withHistory } from 'slate-history';
 import { NODE_TO_PARENT, NODE_TO_INDEX, NODE_TO_ELEMENT, DOMEditor, EDITOR_TO_ELEMENT } from 'slate-dom';
 import { TheiaConverter } from '@atinc/selene';
@@ -14340,6 +14340,10 @@ class TheImage extends TheBaseElement {
         this.subscribeMouseUp();
         this.subscribeImageUploadingState();
     }
+    afterViewInit() {
+        super.afterViewInit();
+        this.setImageMinHeight();
+    }
     onContextChange() {
         super.onContextChange();
         if (this.initialized && !isMobileMode(this.editor)) {
@@ -14352,6 +14356,9 @@ class TheImage extends TheBaseElement {
         }
     }
     ngOnDestroy() {
+        if (this.imageLoadedCacheHeightTimer) {
+            clearTimeout(this.imageLoadedCacheHeightTimer);
+        }
         this.uploadingSubscription.unsubscribe();
         this.theContextService.removeUploadFile(this.fileItem);
         if (this.uploading) {
@@ -14359,6 +14366,28 @@ class TheImage extends TheBaseElement {
         }
         super.ngOnDestroy();
     }
+    cacheImageHeight(height) {
+        const heights = ELEMENT_KEY_TO_HEIGHTS.get(this.editor);
+        const key = AngularEditor.findKey(this.editor, this.element);
+        heights.set(key.id, height);
+    }
+    setImageMinHeight() {
+        const heights = ELEMENT_KEY_TO_HEIGHTS.get(this.editor);
+        const key = AngularEditor.findKey(this.editor, this.element);
+        if (heights && heights.get(key.id)) {
+            const blockCard = getBlockCardByNativeElement(this.nativeElement);
+            if (blockCard) {
+                const style = getComputedStyle(blockCard);
+                blockCard.style.minHeight = heights.get(key.id) - parseFloat(style.marginTop) - parseFloat(style.marginBottom) + 'px';
+            }
+        }
+    }
+    clearMinHeight() {
+        const blockCard = getBlockCardByNativeElement(this.nativeElement);
+        if (blockCard) {
+            blockCard.style.minHeight = '';
+        }
+    }
     setImagePluginOptions() {
         this.imagePluginOptions = getPluginOptions(this.editor, PluginKeys.image);
     }
@@ -14511,6 +14540,7 @@ class TheImage extends TheBaseElement {
                 width: this.imageEntry.width,
                 height: this.imageEntry.height
             }, { at: this.selection });
+            this.cacheImageHeight(this.getRealHeight());
         }
     }
     cancelUpload() {
@@ -14595,9 +14625,13 @@ class TheImage extends TheBaseElement {
             .withPositions([bottomPosition]);
     }
     imageLoaded(event) {
+        this.clearMinHeight();
         const img = event.target;
         this.naturalWidth = img.naturalWidth;
         this.naturalHeight = img.naturalHeight;
+        this.imageLoadedCacheHeightTimer = setTimeout(() => {
+            this.cacheImageHeight(this.getRealHeight());
+        }, 0);
     }
     imageError(event) {
         const img = event.target;