mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-18 17:25:16 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(renderer): Add flag to enable auto height for render iframe

Browse source 
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2022-10-06 22:05:31 +02:00
parent 2817740c94
commit 579919f142
2 changed files with 12 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/editor-page/renderer-pane/render-iframe.tsx
View file

@ -32,6 +32,7 @@ export interface RenderIframeProps extends RendererProps {
forcedDarkMode?: boolean forcedDarkMode?: boolean
frameClasses?: string frameClasses?: string
onRendererStatusChange?: undefined | ((rendererReady: boolean) => void) onRendererStatusChange?: undefined | ((rendererReady: boolean) => void)
adaptFrameHeightToContent?: boolean
} }
const log = new Logger('RenderIframe') const log = new Logger('RenderIframe')
@ -50,6 +51,7 @@ const log = new Logger('RenderIframe')
* @param frameClasses CSS classes that should be applied to the iframe * @param frameClasses CSS classes that should be applied to the iframe
* @param rendererType The {@link RendererType type} of the renderer to use. * @param rendererType The {@link RendererType type} of the renderer to use.
* @param forcedDarkMode If set, the dark mode will be set to the given value. Otherwise, the dark mode won't be changed. * @param forcedDarkMode If set, the dark mode will be set to the given value. Otherwise, the dark mode won't be changed.
* @param adaptFrameHeightToContent If set, the iframe height will be adjusted to the content height
* @param onRendererStatusChange Callback that is fired when the renderer in the iframe is ready * @param onRendererStatusChange Callback that is fired when the renderer in the iframe is ready
*/ */
export const RenderIframe: React.FC<RenderIframeProps> = ({ export const RenderIframe: React.FC<RenderIframeProps> = ({
@ -62,6 +64,7 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
frameClasses, frameClasses,
rendererType, rendererType,
forcedDarkMode, forcedDarkMode,
adaptFrameHeightToContent,
onRendererStatusChange onRendererStatusChange
}) => { }) => {
const [rendererReady, setRendererReady] = useState<boolean>(false) const [rendererReady, setRendererReady] = useState<boolean>(false)
@ -113,9 +116,14 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
useEditorReceiveHandler( useEditorReceiveHandler(
CommunicationMessageType.ON_HEIGHT_CHANGE, CommunicationMessageType.ON_HEIGHT_CHANGE,
useCallback((values: OnHeightChangeMessage) => { useCallback(
setFrameHeight?.(values.height) (values: OnHeightChangeMessage) => {
}, []) if (adaptFrameHeightToContent) {
setFrameHeight?.(values.height)
}
},
[adaptFrameHeightToContent]
)
) )
useEditorReceiveHandler( useEditorReceiveHandler(

1
src/components/intro-page/intro-custom-content.tsx
View file

@ -32,6 +32,7 @@ export const IntroCustomContent: React.FC = () => {
markdownContentLines={content} markdownContentLines={content}
rendererType={RendererType.INTRO} rendererType={RendererType.INTRO}
forcedDarkMode={true} forcedDarkMode={true}
adaptFrameHeightToContent={true}
/> />
) )
} }