From c59085f5fd9774b01aa9c0ba7efaba63201042f0 Mon Sep 17 00:00:00 2001
From: limpido <43034953+limpido@users.noreply.github.com>
Date: Mon, 9 Jun 2025 22:10:06 +0800
Subject: [PATCH] have obsidian manage component lifecycle

---
 src/TreeDiagramMarkdownRenderChild.ts | 35 +++++++++++++++++++++++++++
 src/main.ts                           | 24 +++---------------
 2 files changed, 39 insertions(+), 20 deletions(-)
 create mode 100644 src/TreeDiagramMarkdownRenderChild.ts

diff --git a/src/TreeDiagramMarkdownRenderChild.ts b/src/TreeDiagramMarkdownRenderChild.ts
new file mode 100644
index 0000000..dc3b48f
--- /dev/null
+++ b/src/TreeDiagramMarkdownRenderChild.ts
@@ -0,0 +1,35 @@
+import { MarkdownPostProcessorContext, MarkdownRenderChild } from "obsidian";
+import { parseInput, treeView } from './util';
+import { MarkdownRenderer } from 'obsidian';
+import TreeDiagramPlugin from "./main";
+
+export class TreeDiagramMarkdownRenderChild extends MarkdownRenderChild {
+	plugin: TreeDiagramPlugin;
+	source: string;
+	ctx: MarkdownPostProcessorContext;
+
+	constructor(
+		plugin: TreeDiagramPlugin,
+		source: string,
+		containerEl: HTMLElement,
+		ctx: MarkdownPostProcessorContext
+	) {
+		super(containerEl);
+		this.plugin = plugin;
+		this.source = source;
+		this.ctx = ctx;
+	}
+
+	async onload() {
+		let root;
+		let output: string[] = [];
+		let markdown: string;
+
+		root = parseInput(this.source);
+		if (root != null) {
+			output = treeView(root);
+		}
+		markdown = ["```", "\n", output.join("\n").trim(), "\n```"].join("");
+		await MarkdownRenderer.render(this.plugin.app, markdown, this.containerEl, this.ctx.sourcePath, this);
+	}
+}
diff --git a/src/main.ts b/src/main.ts
index 3357fa8..1f60df1 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,29 +1,13 @@
-import { Plugin, MarkdownRenderer, Component } from 'obsidian';
-import { parseInput, treeView } from './util';
+import { Plugin } from 'obsidian';
+import { TreeDiagramMarkdownRenderChild } from './TreeDiagramMarkdownRenderChild';
 
 export default class TreeDiagramPlugin extends Plugin {
-	component: Component;
 
 	async onload() {
-		console.log("tree load");
-		this.component = new Component();
-
 		this.registerMarkdownCodeBlockProcessor("tree", async (source, el, ctx) => {
-			let root;
-			let output: string[] = [];
-			let markdown: string;
-
-			root = parseInput(source);
-			if (root != null) {
-				output = treeView(root);
-			}
-			markdown = ["```", "\n", output.join("\n").trim(), "\n```"].join("");
-
-			await MarkdownRenderer.render(this.app, markdown, el, ctx.sourcePath, this.component);
+			ctx.addChild(new TreeDiagramMarkdownRenderChild(this, source, el, ctx));
 		});
 	}
 
-	onunload() {
-		console.log("tree unload");
-	}
+	onunload() { }
 }