# azyarashi/obsidian-typst-mate architecture

> Architecture diagram of the GitHub repository azyarashi/obsidian-typst-mate, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/azyarashi/obsidian-typst-mate
- Repository: https://github.com/azyarashi/obsidian-typst-mate

## Overview

Typst Mate is an Obsidian plugin that turns Typst and math content into rendered previews and exports. The main workflow is editing a math region or code block, applying editor assistance and processor settings, then rendering through a worker-backed Typst/WASM runtime. The README also documents standalone .typ viewing, tools, package/font support, and integrations. Several subsystem paths are known from the tree and README, but their internal wiring was not sampled; those links are omitted where uncertain.

Main entry points: [`src/main.ts`](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/main.ts) (Plugin lifecycle), [`src/libs/worker.ts`](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/worker.ts) (Render worker), [`src/libs/typst.ts`](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/typst.ts) (Typst manager), [`src/editor/index.ts`](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/index.ts) (Editor setup)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_startup["Plugin runtime"]
  node_main["Plugin lifecycle<br/>[main.ts]"]
end

subgraph group_editing["Editing experience"]
  node_editor["Editor setup<br/>[index.ts]"]
  node_markdown["Markdown extensions<br/>[build.ts]"]
  node_inlinepreview["Inline preview"]
  node_codepreview["Code preview"]
  node_sharedfeatures["Editor assistance"]
  node_syntax["Typst syntax"]
end

subgraph group_rendering["Typst rendering"]
  node_manager["Typst manager<br/>[typst.ts]"]
  node_worker["Render worker<br/>[worker.ts]"]
  node_wasm["Typst WASM<br/>[lib.rs]"]
  node_packages[("Packages and fonts<br/>[worker.ts]")]
end

subgraph group_views["Views and tools"]
  node_typstview["Typst preview view<br/>[typstPreview.ts]"]
  node_textview["Typst text view<br/>[typstText.ts]"]
  node_tools["Typst tools<br/>[typstTools.ts]"]
  node_export["PDF export<br/>[export.ts]"]
end

subgraph group_configuration["Configuration and integrations"]
  node_processor["Processor settings<br/>[processor.ts]"]
  node_settings["Plugin settings UI"]
  node_excalidraw["Excalidraw plugin<br/>[excalidraw.ts]"]
end

node_user(("Obsidian user"))
node_host(("Obsidian host"))
node_network(("Release and package network"))

node_user -->|"uses"| node_host
node_host -->|"loads plugin"| node_main
node_main -->|"sets up"| node_editor
node_editor -->|"builds extensions"| node_markdown
node_markdown -->|"includes"| node_inlinepreview
node_markdown -->|"includes"| node_codepreview
node_editor -->|"registers extensions"| node_sharedfeatures
node_codepreview -->|"requests render"| node_manager
node_main -->|"prepares runtime"| node_manager
node_main -->|"initializes worker"| node_worker
node_worker -->|"calls compiler"| node_wasm
node_worker -->|"reads and writes"| node_packages
node_main -.->|"downloads WASM"| node_network
node_worker -.->|"fetches packages"| node_network
node_typstview -->|"requests page render"| node_manager
node_user -->|"opens .typ view"| node_typstview
node_user -->|"opens tools"| node_tools
node_user -->|"requests export"| node_export
node_settings -->|"configures plugin"| node_main
node_user -.->|"uses integration"| node_excalidraw
node_excalidraw -.->|"invokes integration"| node_main
node_processor -->|"configures rendering"| node_manager

click node_main "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/main.ts"
click node_editor "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/index.ts"
click node_markdown "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/build.ts"
click node_inlinepreview "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/extensions/InlineMathPreview.ts"
click node_codepreview "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/extensions/CodeBlockPreview.ts"
click node_sharedfeatures "https://github.com/azyarashi/obsidian-typst-mate/tree/main/src/editor/shared/extensions"
click node_syntax "https://github.com/azyarashi/obsidian-typst-mate/tree/main/packages/typst-syntax/src/typst-syntax"
click node_processor "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/processor.ts"
click node_settings "https://github.com/azyarashi/obsidian-typst-mate/tree/main/src/ui/settingsTab"
click node_manager "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/typst.ts"
click node_worker "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/worker.ts"
click node_wasm "https://github.com/azyarashi/obsidian-typst-mate/blob/main/wasm/src/lib.rs"
click node_packages "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/worker.ts"
click node_typstview "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-preview/typstPreview.ts"
click node_textview "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-text/typstText.ts"
click node_tools "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-tools/typstTools.ts"
click node_export "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/utils/export.ts"
click node_excalidraw "https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/plugins/excalidraw.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_main,node_user toneBlue
class node_editor,node_markdown,node_inlinepreview,node_codepreview,node_sharedfeatures,node_syntax toneAmber
class node_manager,node_worker,node_wasm,node_packages toneMint
class node_typstview,node_textview,node_tools,node_export toneRose
class node_processor,node_settings,node_excalidraw,node_host,node_network toneIndigo
```

## Components

### Plugin runtime

- [Plugin lifecycle](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/main.ts): `src/main.ts`

### Editing experience

- [Editor setup](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/index.ts): `src/editor/index.ts`
- [Markdown extensions](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/build.ts): `src/editor/markdown/build.ts`
- [Inline preview](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/extensions/InlineMathPreview.ts): `src/editor/markdown/extensions/InlineMathPreview.ts`
- [Code preview](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/editor/markdown/extensions/CodeBlockPreview.ts): `src/editor/markdown/extensions/CodeBlockPreview.ts`
- [Editor assistance](https://github.com/azyarashi/obsidian-typst-mate/tree/main/src/editor/shared/extensions): `src/editor/shared/extensions`
- [Typst syntax](https://github.com/azyarashi/obsidian-typst-mate/tree/main/packages/typst-syntax/src/typst-syntax): `packages/typst-syntax/src/typst-syntax`

### Typst rendering

- [Typst manager](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/typst.ts): `src/libs/typst.ts`
- [Render worker](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/worker.ts): `src/libs/worker.ts`
- [Typst WASM](https://github.com/azyarashi/obsidian-typst-mate/blob/main/wasm/src/lib.rs): `wasm/src/lib.rs`
- [Packages and fonts](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/worker.ts): `src/libs/worker.ts`

### Views and tools

- [Typst preview view](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-preview/typstPreview.ts): `src/ui/views/typst-preview/typstPreview.ts`
- [Typst text view](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-text/typstText.ts): `src/ui/views/typst-text/typstText.ts`
- [Typst tools](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/ui/views/typst-tools/typstTools.ts): `src/ui/views/typst-tools/typstTools.ts`
- [PDF export](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/utils/export.ts): `src/utils/export.ts`

### Configuration and integrations

- [Processor settings](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/libs/processor.ts): `src/libs/processor.ts`
- [Plugin settings UI](https://github.com/azyarashi/obsidian-typst-mate/tree/main/src/ui/settingsTab): `src/ui/settingsTab`
- [Excalidraw plugin](https://github.com/azyarashi/obsidian-typst-mate/blob/main/src/plugins/excalidraw.ts): `src/plugins/excalidraw.ts`

### Other components

- **Obsidian user**
- **Obsidian host**
- **Release and package network**

## Connections

- Obsidian user → Obsidian host: uses
- Obsidian host → Plugin lifecycle: loads plugin
- Plugin lifecycle → Editor setup: sets up
- Editor setup → Markdown extensions: builds extensions
- Markdown extensions → Inline preview: includes
- Markdown extensions → Code preview: includes
- Editor setup → Editor assistance: registers extensions
- Code preview → Typst manager: requests render
- Plugin lifecycle → Typst manager: prepares runtime
- Plugin lifecycle → Render worker: initializes worker
- Render worker → Typst WASM: calls compiler
- Render worker → Packages and fonts: reads and writes
- Plugin lifecycle → Release and package network: downloads WASM
- Render worker → Release and package network: fetches packages
- Typst preview view → Typst manager: requests page render
- Obsidian user → Typst preview view: opens .typ view
- Obsidian user → Typst tools: opens tools
- Obsidian user → PDF export: requests export
- Plugin settings UI → Plugin lifecycle: configures plugin
- Obsidian user → Excalidraw plugin: uses integration
- Excalidraw plugin → Plugin lifecycle: invokes integration
- Processor settings → Typst manager: configures rendering