Using a decorator which spans multiple rows

[tbrockman]

Hey there, thanks for the project! Not sure if I'm using the library incorrectly, but I'm trying to "embed" some HTML content (in response a specific OSC sequence). It seems to work well enough, except that as soon as the marker leaves the visible portion of the terminal, the decoration is styled with display: none, and its top offset is no longer calculated (regardless of whether some of its content still extends into the viewport from above). This seems to be due to these lines in BufferDecorationRenderer, where it seems like I would need to add an exception in order to accomplish what I want (like an autoHide option or similar). Am I correct in my understanding? Is this the best way to go about doing this?

Here's an example from my current code, if it helps:

export default {
	id: 80086,
	handler: async ({ terminal, data }) => {
		const marker = terminal.registerMarker(0);

		if (marker) {
			const node = document.createElement('div');
			const id = new TextDecoder()
				.decode(Uint8Array.from(atob(data), (c) => c.charCodeAt(0)));
			createRoot(node).render(<SoundcloudPlayer ids={[id]} />);
			const { height } = calculateDecorationSize(terminal, 0, 300);
			const decoration = terminal.registerDecoration({
				marker,
				width: terminal.cols,
				height,
				layer: 'top'
			});

			decoration?.onRender((e: HTMLElement) => {
				if (!Array.from(e.children).includes(node)) {
					e.appendChild(node);
				}
			});
                        
                        // ... some other dumb code which just writes the necessary number of newlines to create enough rows to accommodate the element
		}

		return true;
	}
} as OscHandler;

Thanks for any help you can offer!