# lyaxz/dsh-fonttune architecture

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

- Interactive diagram: https://gitdiagram.com/lyaxz/dsh-fonttune
- Repository: https://github.com/lyaxz/dsh-fonttune

## Overview

dsh-fonttune is a DeepSeek Harness web plugin that lets users tune conversation, interface, and code typography, with presets and live application. The main workflow is: open the plugin settings card, edit typography or choose a preset, persist changes through DSH settings, then apply generated styles in the page. The graph reflects README capabilities; source excerpts are partial, so uncertain internal wiring is omitted.

Main entry points: [`src/client.js`](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js) (Browser plugin), [`src/index.mjs`](https://github.com/lyaxz/dsh-fonttune/blob/main/src/index.mjs) (Host plugin), [`src/shared.cjs`](https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs) (Shared core)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_host["Host integration"]
  node_host_plugin["Host plugin<br/>[index.mjs]"]
  node_bootstrap["Bootstrap style<br/>[index.mjs]"]
end

subgraph group_config["Settings experience"]
  node_client["Browser plugin<br/>[client.js]"]
  node_settings_card["Settings card<br/>[client.js]"]
  node_font_picker["Font picker<br/>[client.js]"]
  node_font_enum["Local font discovery<br/>[client.js]"]
  node_preset_manager["Preset manager<br/>[client.js]"]
  node_axis_controls["Typography controls<br/>[client.js]"]
end

subgraph group_engine["Typography engine"]
  node_shared["Shared core<br/>[shared.cjs]"]
  node_config_normalizer["Config normalization<br/>[shared.cjs]"]
  node_css_generator["Style generation<br/>[shared.cjs]"]
  node_font_stacks["Font stack editing<br/>[shared.cjs]"]
end

subgraph group_apply["Page application"]
  node_style_element["Page style element"]
  node_theme_tokens["Theme token overrides<br/>[client.js]"]
end

node_user(("Plugin user"))
node_dsh["DSH host"]
node_settings["Settings document"]
node_font_api["Browser font API"]
node_web_page["DSH web page"]

node_user -->|"opens and edits"| node_settings_card
node_dsh -->|"loads plugin"| node_host_plugin
node_host_plugin -->|"registers settings"| node_settings
node_host_plugin -->|"injects initial style"| node_bootstrap
node_bootstrap -->|"seeds style"| node_style_element
node_dsh -->|"loads browser module"| node_client
node_client -->|"reads and subscribes"| node_settings
node_client -->|"renders"| node_settings_card
node_settings_card -->|"exposes typography axes"| node_axis_controls
node_settings_card -->|"opens font selection"| node_font_picker
node_font_picker -->|"edits font stacks"| node_font_stacks
node_font_picker -->|"requests local fonts"| node_font_enum
node_font_enum -.->|"enumerates fonts"| node_font_api
node_settings_card -->|"manages presets"| node_preset_manager
node_axis_controls -->|"submits changes"| node_client
node_preset_manager -->|"applies preset"| node_client
node_client -->|"writes settings"| node_settings
node_client -->|"uses shared functions"| node_shared
node_shared -->|"normalizes configuration"| node_config_normalizer
node_shared -->|"generates CSS"| node_css_generator
node_client -->|"requests styles"| node_css_generator
node_client -->|"updates style element"| node_style_element
node_client -->|"overrides family tokens"| node_theme_tokens
node_style_element -->|"styles page"| node_web_page
node_theme_tokens -->|"sets theme fonts"| node_web_page

click node_host_plugin "https://github.com/lyaxz/dsh-fonttune/blob/main/src/index.mjs"
click node_bootstrap "https://github.com/lyaxz/dsh-fonttune/blob/main/src/index.mjs"
click node_client "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_settings_card "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_font_picker "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_font_enum "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_preset_manager "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_axis_controls "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"
click node_shared "https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs"
click node_config_normalizer "https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs"
click node_css_generator "https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs"
click node_font_stacks "https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs"
click node_theme_tokens "https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js"

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_host_plugin,node_bootstrap,node_user,node_font_api toneBlue
class node_client,node_settings_card,node_font_picker,node_font_enum,node_preset_manager,node_axis_controls toneAmber
class node_shared,node_config_normalizer,node_css_generator,node_font_stacks toneMint
class node_style_element,node_theme_tokens toneRose
class node_dsh,node_settings,node_web_page toneIndigo
```

## Components

### Host integration

- [Host plugin](https://github.com/lyaxz/dsh-fonttune/blob/main/src/index.mjs): `src/index.mjs`
- [Bootstrap style](https://github.com/lyaxz/dsh-fonttune/blob/main/src/index.mjs): `src/index.mjs`

### Settings experience

- [Browser plugin](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`
- [Settings card](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`
- [Font picker](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`
- [Local font discovery](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`
- [Preset manager](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`
- [Typography controls](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`

### Typography engine

- [Shared core](https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs): `src/shared.cjs`
- [Config normalization](https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs): `src/shared.cjs`
- [Style generation](https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs): `src/shared.cjs`
- [Font stack editing](https://github.com/lyaxz/dsh-fonttune/blob/main/src/shared.cjs): `src/shared.cjs`

### Page application

- **Page style element**
- [Theme token overrides](https://github.com/lyaxz/dsh-fonttune/blob/main/src/client.js): `src/client.js`

### Other components

- **Plugin user**
- **DSH host**
- **Settings document**
- **Browser font API**
- **DSH web page**

## Connections

- Plugin user → Settings card: opens and edits
- DSH host → Host plugin: loads plugin
- Host plugin → Settings document: registers settings
- Host plugin → Bootstrap style: injects initial style
- Bootstrap style → Page style element: seeds style
- DSH host → Browser plugin: loads browser module
- Browser plugin → Settings document: reads and subscribes
- Browser plugin → Settings card: renders
- Settings card → Typography controls: exposes typography axes
- Settings card → Font picker: opens font selection
- Font picker → Font stack editing: edits font stacks
- Font picker → Local font discovery: requests local fonts
- Local font discovery → Browser font API: enumerates fonts
- Settings card → Preset manager: manages presets
- Typography controls → Browser plugin: submits changes
- Preset manager → Browser plugin: applies preset
- Browser plugin → Settings document: writes settings
- Browser plugin → Shared core: uses shared functions
- Shared core → Config normalization: normalizes configuration
- Shared core → Style generation: generates CSS
- Browser plugin → Style generation: requests styles
- Browser plugin → Page style element: updates style element
- Browser plugin → Theme token overrides: overrides family tokens
- Page style element → DSH web page: styles page
- Theme token overrides → DSH web page: sets theme fonts