Agents write compact **Markdown** and semantic `shw-*` elements. People receive a clear,
responsive document without hundreds of lines of repeated presentation code.
Keep the source efficient for agents and make the result comfortable for humans to read.
One versioned JavaScript file provides the components, Markdown rendering, and CSS.
The exact reduction depends on the document. The useful result is simpler editing: a text
change stays a text change instead of becoming a DOM and CSS change.
<script type="module"
src="https://cdn.jsdelivr.net/npm/@offorte/show-doc@0.0.3/dist/showdoc.js"></script>
<shw-doc>
<shw-header heading="Project review">A short **Markdown** lead.</shw-header>
<shw-summary>The release is **ready**.</shw-summary>
</shw-doc>
Layer | Responsibility | Result
Artifact | **Meaning**, content, and layout choices | Small source
ShowDoc | Components, Markdown, typography, and themes | Consistent rendering
Browser | Standards-based HTML and Shadow DOM | Accessible document
flowchart LR
A[Agent writes compact source] --> B[ShowDoc renders the document]
B --> C[Person reads a clear page]
1. The agent chooses the smallest semantic component for each idea.
2. Markdown carries the prose, lists, links, tasks, and emphasis.
3. The ShowDoc bundle registers the components and installs the global CSS once.
4. Lit renders reliable Shadow DOM while theme variables keep the document adjustable.
5. The reader gets a responsive page that also prints cleanly.
Use it for **reports, plans, reviews, decisions, and explanations**.
Do not use it for dashboards, forms, modals, or application-like tools. Those need custom
interaction and their own application code.