# chuspeeism/dashi-ppt-skill architecture

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

- Interactive diagram: https://gitdiagram.com/chuspeeism/dashi-ppt-skill
- Repository: https://github.com/chuspeeism/dashi-ppt-skill

## Overview

Dashi PPT is an AI-agent skill for creating browser-editable presentations and exporting HTML, PDF, or editable PPTX. Its user-facing workflow is to describe a presentation, choose among 12 themes, generate a deck, edit text/layout/media in the browser, and export a finished file. The graph includes the documented theme and layout library, plus sampled rendering, contract, and export layers. Some workflow internals are not shown in the excerpts, so documented product links are cited to the README rather than inferred from filenames.

Main entry points: [`skills/dashi-ppt/project/src/components/themes/client-runtime.jsx`](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/themes/client-runtime.jsx) (Browser runtime), [`skills/dashi-ppt/project`](https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project) (Presentation skill), [`skills/dashi-ppt/project/scripts/preview/export-routes.mjs`](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/preview/export-routes.mjs) (Export routes), [`skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx`](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx) (Bespoke slide renderer)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_creation["Deck creation"]
  node_skill["Presentation skill"]
end

subgraph group_rendering["Themes and rendering"]
  node_theme_library["12 themes, layouts"]
  node_deck_model["Deck view model<br/>[index.jsx]"]
  node_content_contract["Content and variant contracts"]
  node_prop_contract["Control prop contracts"]
  node_bespoke_slide["Bespoke slide renderer<br/>[BespokeSlide.jsx]"]
end

subgraph group_editing["Editing and state"]
  node_client_runtime["Browser runtime<br/>[client-runtime.jsx]"]
  node_deck_state[("Saved deck state")]
  node_html_deck["Editable HTML deck"]
end

subgraph group_delivery["Preview and export"]
  node_preview_server["Local preview server"]
  node_export_routes["Export routes<br/>[export-routes.mjs]"]
  node_export_engine["PPTX and screenshot engine"]
  node_output_file["PPTX, PDF, or HTML"]
end

node_user(("User"))
node_agent(("AI agent"))

node_user -->|"describes needs"| node_agent
node_agent -->|"requests deck"| node_skill
node_skill -->|"offers themes"| node_theme_library
node_skill -->|"generates deck"| node_html_deck
node_html_deck -->|"edits in browser"| node_user
node_deck_model -->|"resolves content"| node_content_contract
node_deck_model -->|"renders slides"| node_bespoke_slide
node_client_runtime -->|"normalizes props"| node_prop_contract
node_client_runtime -->|"resolves variants"| node_content_contract
node_client_runtime -->|"renders composition"| node_bespoke_slide
node_bespoke_slide -->|"gets theme profile"| node_theme_library
node_html_deck -->|"saves edits"| node_deck_state
node_user -->|"opens preview"| node_preview_server
node_preview_server -.->|"serves export"| node_export_routes
node_export_routes -->|"persists state"| node_deck_state
node_export_routes -->|"exports deck"| node_export_engine
node_export_engine -->|"creates file"| node_output_file
node_user -->|"requests export"| node_output_file

click node_skill "https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project"
click node_theme_library "https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project/src/components/themes"
click node_deck_model "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/view-model/index.jsx"
click node_content_contract "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/variant-contract.mjs"
click node_prop_contract "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/prop-contract-core.mjs"
click node_client_runtime "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/themes/client-runtime.jsx"
click node_bespoke_slide "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx"
click node_deck_state "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/persist-deck-state.mjs"
click node_preview_server "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/start-preview-server.mjs"
click node_export_routes "https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/preview/export-routes.mjs"
click node_export_engine "https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project/packages/html-deck-to-pptx"

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_skill,node_user toneBlue
class node_theme_library,node_deck_model,node_content_contract,node_prop_contract,node_bespoke_slide toneAmber
class node_client_runtime,node_deck_state,node_html_deck toneMint
class node_preview_server,node_export_routes,node_export_engine,node_output_file toneRose
class node_agent toneIndigo
```

## Components

### Deck creation

- [Presentation skill](https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project): `skills/dashi-ppt/project`

### Themes and rendering

- [12 themes, layouts](https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project/src/components/themes): `skills/dashi-ppt/project/src/components/themes`
- [Deck view model](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/view-model/index.jsx): `skills/dashi-ppt/project/src/view-model/index.jsx`
- [Content and variant contracts](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/variant-contract.mjs): `skills/dashi-ppt/project/src/variant-contract.mjs`
- [Control prop contracts](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/prop-contract-core.mjs): `skills/dashi-ppt/project/src/prop-contract-core.mjs`
- [Bespoke slide renderer](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx): `skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx`

### Editing and state

- [Browser runtime](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/src/components/themes/client-runtime.jsx): `skills/dashi-ppt/project/src/components/themes/client-runtime.jsx`
- [Saved deck state](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/persist-deck-state.mjs): `skills/dashi-ppt/project/scripts/persist-deck-state.mjs`
- **Editable HTML deck**

### Preview and export

- [Local preview server](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/start-preview-server.mjs): `skills/dashi-ppt/project/scripts/start-preview-server.mjs`
- [Export routes](https://github.com/chuspeeism/dashi-ppt-skill/blob/main/skills/dashi-ppt/project/scripts/preview/export-routes.mjs): `skills/dashi-ppt/project/scripts/preview/export-routes.mjs`
- [PPTX and screenshot engine](https://github.com/chuspeeism/dashi-ppt-skill/tree/main/skills/dashi-ppt/project/packages/html-deck-to-pptx): `skills/dashi-ppt/project/packages/html-deck-to-pptx`
- **PPTX, PDF, or HTML**

### Other components

- **User**
- **AI agent**

## Connections

- User → AI agent: describes needs (evidence: `README.md`)
- AI agent → Presentation skill: requests deck (evidence: `README.md`)
- Presentation skill → 12 themes, layouts: offers themes (evidence: `README.md`)
- Presentation skill → Editable HTML deck: generates deck (evidence: `README.md`)
- Editable HTML deck → User: edits in browser (evidence: `README.md`)
- Deck view model → Content and variant contracts: resolves content (evidence: `skills/dashi-ppt/project/src/view-model/index.jsx`)
- Deck view model → Bespoke slide renderer: renders slides (evidence: `skills/dashi-ppt/project/src/view-model/index.jsx`)
- Browser runtime → Control prop contracts: normalizes props (evidence: `skills/dashi-ppt/project/src/components/themes/client-runtime.jsx`)
- Browser runtime → Content and variant contracts: resolves variants (evidence: `skills/dashi-ppt/project/src/components/themes/client-runtime.jsx`)
- Browser runtime → Bespoke slide renderer: renders composition (evidence: `skills/dashi-ppt/project/src/components/themes/client-runtime.jsx`)
- Bespoke slide renderer → 12 themes, layouts: gets theme profile (evidence: `skills/dashi-ppt/project/src/components/bespoke/BespokeSlide.jsx`)
- Editable HTML deck → Saved deck state: saves edits (evidence: `README.md`)
- User → Local preview server: opens preview (evidence: `README.md`)
- Local preview server → Export routes: serves export
- Export routes → Saved deck state: persists state (evidence: `skills/dashi-ppt/project/scripts/preview/export-routes.mjs`)
- Export routes → PPTX and screenshot engine: exports deck (evidence: `skills/dashi-ppt/project/scripts/preview/export-routes.mjs`)
- PPTX and screenshot engine → PPTX, PDF, or HTML: creates file (evidence: `README.md`)
- User → PPTX, PDF, or HTML: requests export (evidence: `README.md`)