Widgets and block types

```kiwi-chart
type: bar
title: Sprint velocity
data:
  - label: Sprint 1
    value: 21
  - label: Sprint 2
    value: 34
  - label: Sprint 3
    value: 28
```

```kiwi-query
TABLE title, status, priority
FROM "tasks"
WHERE status != "done"
SORT priority DESC
```

```kiwi-kanban
columns:
  - name: Todo
    cards:
      - title: Design API
        tags: [backend]
  - name: In Progress
    cards:
      - title: Build UI
        tags: [frontend]
  - name: Done
    cards:
      - title: Write tests
```

```kiwi-playground
widgets:
  - type: slider
    label: Opacity
    min: 0
    max: 100
    value: 75
  - type: toggle
    label: Dark mode
    value: true
  - type: select
    label: Theme
    options: [kiwi, ocean, forest, sunset]
    value: kiwi
  - type: color
    label: Accent
    value: "#6cbe45"
  - type: number
    label: Font size
    min: 12
    max: 24
    value: 16
  - type: text
    label: Title
    value: "My page"
```

```kiwi-app
<style>
  .counter { font-size: 2em; text-align: center; padding: 2em; }
  button { font-size: 1.2em; padding: 0.5em 1em; }
</style>
<div class="counter">
  <p id="count">0</p>
  <button onclick="document.getElementById('count').textContent = ++window.n">+1</button>
</div>
<script>window.n = 0;</script>
```

```kiwi-diff
- const timeout = 5000;
+ const timeout = 30000;
  const retries = 3;
- const backoff = "linear";
+ const backoff = "exponential";
```

```kiwi-progress
type: bar
label: Migration progress
value: 73
max: 100
```

```kiwi-color
colors:
  - name: Primary
    value: "#6cbe45"
  - name: Secondary
    value: "#4a8a2a"
  - name: Accent
    value: "#7dd356"
```

```mermaid
graph LR
    A[Agent] -->|MCP| B[KiwiFS]
    B --> C[Search]
    B --> D[Storage]
    B --> E[Git]
```

```widget:live
function Counter() {
  const [count, setCount] = React.useState(0);
  return <button onClick={() => setCount(c => c + 1)}>Count: {count}</button>;
}
```

```widget:code
import math
print(f"Pi is approximately {math.pi:.4f}")
```

```kiwi-calc
dau:        10 million
writes:     100
write_size: 1 KB
---
qps:     dau * writes / day
daily:   dau * writes * write_size
yearly:  daily * year
```

```kiwi-steps
diagram: |
  graph LR
    C[Client] --> A[API]
    A --> DB[(Postgres)]
steps:
  - focus: [C, A]
    note: write lands on the API
  - focus: [A, DB]
    dim: [C]
    note: then it commits
```

```kiwi-data
kind: dataset-schema
records:
  - name: target
    dtype: float
  - name: id
    dtype: int
    nullable: true
```

TABLE name, dtype
FROM RECORDS "dataset-schema"
WHERE dtype = "float"

:::claim{evidence=stated confidence=0.9 source=sources/architecture.md}
A non-linear level-2 stacker wins when the dominant feature is sparse.
:::

Inline: :claim[hill-climbing is worse]{evidence=inferred confidence=0.6}

:::figure{width=wide pin caption="Architecture overview"}
![[diagrams/arch.excalidraw.md|wide]]
:::

![[canvases/flow.canvas.json]]

title: System Design Primer
parts:
  - chapter-01/_index.md
  - chapter-01/intro.md
  - chapter-02/_index.md

```widget:tracker
state: leetcode-progress
modes:
  - id: tags
    label: Tags
    fields: [tags]
  - id: companies
    label: Companies
    fields: [companies]
```

:::tabs

::tab[REST]
Use `PUT /api/kiwi/file` to create or update a page.

::tab[MCP]
Call `kiwi_write` with `path` and `content` arguments.

::tab[CLI]
Write the file directly: `echo "# Title" > page.md`

:::

:::columns

:::col
Left column content here.
:::

:::col
Right column content here.
:::

:::

> [!NOTE]
> Standard informational callout.

> [!TIP]
> Helpful suggestion.

> [!WARNING]
> Potential issue to watch for.

> [!CAUTION]
> Dangerous action that could cause data loss.

> [!IMPORTANT]
> Critical information.

> [!NOTE]- Collapsed by default
> This content is hidden until expanded.

> [!TIP]+ Expanded by default
> This content is visible but can be collapsed.