add system preview

src/PreviewView.tsx

@@ -0,0 +1,62 @@
+import { TFile, View, WorkspaceLeaf } from 'obsidian'
+import { Root, createRoot } from 'react-dom/client'
+
+import PreviewViewRoot from './components/preview-view/PreviewViewRoot'
+import { PREVIEW_VIEW_TYPE } from './constants'
+import { AppProvider } from './contexts/AppContext'
+
+export type PreviewViewState = {
+	content: string
+	title?: string
+	file?: TFile
+	onClose?: () => void
+}
+
+export class PreviewView extends View {
+	private root: Root | null = null
+	private state: PreviewViewState | null = null
+
+	constructor(leaf: WorkspaceLeaf) {
+		super(leaf)
+	}
+
+	getViewType() {
+		return PREVIEW_VIEW_TYPE
+	}
+
+	getDisplayText() {
+		if (this.state?.title) {
+			return `Preview: ${this.state.title}`
+		}
+		return `Preview: ${this.state?.file?.name ?? 'Markdown'}`
+	}
+
+	async setState(state: PreviewViewState) {
+		this.state = state
+		// Should render here because onOpen is called before setState
+		this.render()
+	}
+
+	async onOpen() {
+		this.root = createRoot(this.containerEl)
+	}
+
+	async onClose() {
+		if (this.state?.onClose) {
+			this.state.onClose()
+		}
+		this.root?.unmount()
+	}
+
+	async render() {
+		if (!this.root || !this.state) return
+		this.root.render(
+			<AppProvider app={this.app}>
+				<PreviewViewRoot 
+					state={this.state} 
+					close={() => this.leaf.detach()} 
+				/>
+			</AppProvider>,
+		)
+	}
+}