From 0412f171b071a30e98688a10ea0bd91031338bcf Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Fri, 21 Feb 2025 15:59:15 +0400 Subject: [PATCH] Add minHeight to devices --- packages/core/src/canvas/model/Canvas.ts | 11 ++++++----- packages/core/src/canvas/view/FrameWrapView.ts | 14 ++++++-------- packages/core/src/device_manager/model/Device.ts | 5 +++++ 3 files changed, 17 insertions(+), 13 deletions(-) diff --git a/packages/core/src/canvas/model/Canvas.ts b/packages/core/src/canvas/model/Canvas.ts index 6e67e8866..7c539f6de 100644 --- a/packages/core/src/canvas/model/Canvas.ts +++ b/packages/core/src/canvas/model/Canvas.ts @@ -4,6 +4,7 @@ import { Coordinates, CoordinatesTypes, DEFAULT_COORDS } from '../../common'; import { evUpdate as evDeviceUpdate } from '../../device_manager'; import Page from '../../pages/model/Page'; import PagesEvents from '../../pages/types'; +import Frame from './Frame'; import Frames from './Frames'; export default class Canvas extends ModuleModel { @@ -56,14 +57,14 @@ export default class Canvas extends ModuleModel { this.updateDevice({ frame: page.getMainFrame() }); } - updateDevice(opts: any = {}) { + updateDevice(opts: { frame?: Frame } = {}) { const { em } = this; const device = em.getDeviceModel(); - const model = opts.frame || em.getCurrentFrameModel(); + const frame = opts.frame || em.getCurrentFrameModel(); - if (model && device) { - const { width, height } = device.attributes; - model.set({ width, height }, { noUndo: 1 }); + if (frame && device) { + const { width, height, minHeight } = device.attributes; + frame.set({ width, height, minHeight }, { noUndo: 1 }); } } diff --git a/packages/core/src/canvas/view/FrameWrapView.ts b/packages/core/src/canvas/view/FrameWrapView.ts index ca8c0b12a..e825e0121 100644 --- a/packages/core/src/canvas/view/FrameWrapView.ts +++ b/packages/core/src/canvas/view/FrameWrapView.ts @@ -151,7 +151,7 @@ export default class FrameWrapView extends ModuleView { __handleSize() { const un = 'px'; - const { model, el, em } = this; + const { model, el } = this; const { style } = el; const { width, height } = model.attributes; const currW = style.width || ''; @@ -166,15 +166,13 @@ export default class FrameWrapView extends ModuleView { if (model.hasAutoHeight()) { const iframe = this.frame.el; + const { contentDocument } = iframe; - if ( - iframe.contentDocument - // this doesn't work always - // && !this.sizeObserver - ) { - const { contentDocument } = iframe; + if (contentDocument) { const observer = new ResizeObserver(() => { - style.height = `${contentDocument.body.scrollHeight}px`; + const minHeight = parseFloat(model.get('minHeight')) || 0; + const heightResult = Math.max(contentDocument.body.scrollHeight, minHeight); + style.height = `${heightResult}px`; }); observer.observe(contentDocument.body); this.sizeObserver = observer; diff --git a/packages/core/src/device_manager/model/Device.ts b/packages/core/src/device_manager/model/Device.ts index 83fcabe37..81e64adcc 100644 --- a/packages/core/src/device_manager/model/Device.ts +++ b/packages/core/src/device_manager/model/Device.ts @@ -18,6 +18,11 @@ export interface DeviceProperties { * @example '600px' */ height?: string; + /** + * Min height to set for the editor iframe. + * @example '600px' + */ + minHeight?: string; /** * The width which will be used in media queries, if empty the `width` will be used. * @example '900px'