@fusion.dev/helix-docs 0.197.1 → 0.199.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/content/building-on-the-headless-tier.mdx +2 -2
- package/content/charting.mdx +28 -2
- package/content/coding-agents.mdx +18 -4
- package/content/metrics.mdx +237 -229
- package/content/motion.mdx +38 -0
- package/content/spatial-charts.mdx +110 -4
- package/dist/sources.generated.js +433 -241
- package/package.json +11 -11
|
@@ -53,11 +53,11 @@ open.
|
|
|
53
53
|
|
|
54
54
|
[//]: # (renders)
|
|
55
55
|
|
|
56
|
-
**
|
|
56
|
+
**37 of the 105 headless families interpolate another family's tag**, across 22 distinct children.
|
|
57
57
|
|
|
58
58
|
| Family | Renders |
|
|
59
59
|
|---|---|
|
|
60
|
-
| `area-chart`, `bar-chart`, `copy-button`, `donut-chart`, `heatmap`, `line-chart`, `scatter-chart`, `spatial-heatmap`, `spatial-scatter-chart`, `spatial-surface-chart` | `tooltip` |
|
|
60
|
+
| `area-chart`, `bar-chart`, `copy-button`, `donut-chart`, `heatmap`, `line-chart`, `scatter-chart`, `spatial-bar-chart`, `spatial-heatmap`, `spatial-ribbon-chart`, `spatial-scatter-chart`, `spatial-surface-chart`, `spatial-treemap` | `tooltip` |
|
|
61
61
|
| `breadcrumbs` | `breadcrumb` |
|
|
62
62
|
| `chat` | `chat-message` |
|
|
63
63
|
| `checkbox-group`, `table` | `checkbox` |
|
package/content/charting.mdx
CHANGED
|
@@ -9,12 +9,15 @@ title: Charting
|
|
|
9
9
|
Helix has these chart families, and each one has its own API page:
|
|
10
10
|
|
|
11
11
|
- `Bar Chart`
|
|
12
|
+
- `Spatial Bar Chart`, drawn in three dimensions
|
|
12
13
|
- `Line Chart`
|
|
14
|
+
- `Spatial Ribbon Chart`, drawn in three dimensions
|
|
13
15
|
- `Area Chart`
|
|
14
16
|
- `Scatter Chart`
|
|
15
17
|
- `Spatial Scatter Chart`, drawn in three dimensions
|
|
16
18
|
- `Spatial Surface Chart`, drawn in three dimensions
|
|
17
19
|
- `Donut Chart`
|
|
20
|
+
- `Spatial Treemap`, drawn in three dimensions
|
|
18
21
|
- `Heatmap`
|
|
19
22
|
- `Spatial Heatmap`, drawn in three dimensions
|
|
20
23
|
- `Sparkline`
|
|
@@ -30,15 +33,29 @@ Choose a chart by the question it answers.
|
|
|
30
33
|
|
|
31
34
|
- **How much, compared.** `Bar Chart`. A bar's length is its value, so it always
|
|
32
35
|
starts at zero.
|
|
36
|
+
- **How much, across two sets of names.** `Spatial Bar Chart`, with a bar for
|
|
37
|
+
each category and series, standing in a box you can turn. Use it where the
|
|
38
|
+
shape across both matters more than any one value. `Bar Chart` is read more
|
|
39
|
+
exactly.
|
|
33
40
|
- **How something moved over time.** `Line Chart`. It measures from the data's
|
|
34
41
|
own range, so a small change still shows. Its `area` puts a light wash under
|
|
35
42
|
each line. Each wash is drawn from the floor on its own and overlaps the
|
|
36
43
|
others.
|
|
44
|
+
- **How several series moved over the same places, each apart.** `Spatial
|
|
45
|
+
Ribbon Chart`, with a ribbon for each series, one behind another, in a box
|
|
46
|
+
you can turn. Use it where series cross and a line chart tangles them. `Line
|
|
47
|
+
Chart` is read more exactly.
|
|
37
48
|
- **How a total is made up over time.** `Area Chart`. Each column is stacked on
|
|
38
49
|
the one below, so the top edge is the total and a band's thickness is its
|
|
39
50
|
share. Use it when the parts add up to a total. `Line Chart` with `area`
|
|
40
51
|
overlaps the series, and `Area Chart` adds them.
|
|
41
52
|
- **Parts of one whole, at one moment.** `Donut Chart`.
|
|
53
|
+
- **How large each item is within its group, and how it stands on a second
|
|
54
|
+
measure.** `Spatial Treemap`, with a block for each row, its area its size
|
|
55
|
+
and its height the second measure, gathered by group on a floor you can
|
|
56
|
+
turn. Use it where many items share a whole, such as each service's
|
|
57
|
+
requests and its response time. Its table and its tooltip carry the exact
|
|
58
|
+
values.
|
|
42
59
|
- **Whether two measures relate.** `Scatter Chart`, with one point per row.
|
|
43
60
|
- **Where rows fall on three measures, and which gather together.** `Spatial
|
|
44
61
|
Scatter Chart`, with one point per row in a box you can turn. Use it for data
|
|
@@ -59,9 +76,9 @@ Choose a chart by the question it answers.
|
|
|
59
76
|
Use `Trend` to show which way one measurement moved and whether that is good
|
|
60
77
|
news.
|
|
61
78
|
|
|
62
|
-
The
|
|
79
|
+
The six spatial charts draw themselves in 3D in SVG, which a
|
|
63
80
|
print and a page without WebGL show too, and a drag or Shift with an arrow
|
|
64
|
-
turns. `@fusion.dev/helix-plot` can also draw all
|
|
81
|
+
turns. `@fusion.dev/helix-plot` can also draw all six with three.js, lit and
|
|
65
82
|
in perspective, in a view you can drag round and zoom. The
|
|
66
83
|
[spatial charts guide](./spatial-charts) covers both.
|
|
67
84
|
|
|
@@ -127,9 +144,15 @@ reading a chart is usually read for:
|
|
|
127
144
|
- `Donut Chart`: each slice's share of the whole.
|
|
128
145
|
- `Scatter Chart`: each series' number of points and how strongly the two
|
|
129
146
|
measures relate.
|
|
147
|
+
- `Spatial Bar Chart`: its number of bars, series, and categories, and the
|
|
148
|
+
range of its values.
|
|
149
|
+
- `Spatial Ribbon Chart`: its number of readings, series, and places, and the
|
|
150
|
+
range of its values.
|
|
130
151
|
- `Spatial Scatter Chart`: its three measures and its number of points.
|
|
131
152
|
- `Spatial Surface Chart`: its measures, its number of readings, and the range
|
|
132
153
|
of its heights.
|
|
154
|
+
- `Spatial Treemap`: its number of items and groups, and the range of their
|
|
155
|
+
sizes.
|
|
133
156
|
|
|
134
157
|
`Heatmap` and `Spatial Heatmap` are each an image with that name. `Sparkline` takes a `label` of its own.
|
|
135
158
|
|
|
@@ -205,6 +228,9 @@ These parts keep their direction:
|
|
|
205
228
|
- `Spatial Scatter Chart` and `Spatial Surface Chart` are laid out as on a
|
|
206
229
|
left-to-right page, because all three of their axes are measures. Their
|
|
207
230
|
summaries and tooltips follow the page's direction.
|
|
231
|
+
- `Spatial Bar Chart`, `Spatial Ribbon Chart`, and `Spatial Treemap` are laid
|
|
232
|
+
out as on a left-to-right page too, since each drawing is a box you turn. Its summary and tooltip follow the page's
|
|
233
|
+
direction.
|
|
208
234
|
|
|
209
235
|
To keep a chart left to right on a right-to-left page, such as a number line in
|
|
210
236
|
a mathematics text, set `dir="ltr"` on the chart element. You need nothing else.
|
|
@@ -72,10 +72,24 @@ helix mcp init --client claude
|
|
|
72
72
|
```
|
|
73
73
|
|
|
74
74
|
`helix mcp` answers from the Helix packages your project installs: families,
|
|
75
|
-
examples, import lines, tokens, and the theme a brand color produces.
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
75
|
+
examples, import lines, tokens, and the theme a brand color produces. It runs on
|
|
76
|
+
your machine, talks to a client you chose, and makes no network requests.
|
|
77
|
+
[The Helix MCP server](#the-helix-mcp-server) lists the tools.
|
|
78
|
+
|
|
79
|
+
`--client` writes the server into the project file that client reads:
|
|
80
|
+
|
|
81
|
+
| `--client` | File |
|
|
82
|
+
|---|---|
|
|
83
|
+
| `claude` | `.mcp.json` |
|
|
84
|
+
| `cursor` | `.cursor/mcp.json` |
|
|
85
|
+
| `vscode` | `.vscode/mcp.json` |
|
|
86
|
+
| `gemini` | `.gemini/settings.json` |
|
|
87
|
+
| `opencode` | `opencode.json` |
|
|
88
|
+
| `roo` | `.roo/mcp.json` |
|
|
89
|
+
| `junie` | `.junie/mcp/mcp.json` |
|
|
90
|
+
|
|
91
|
+
Codex, Cline, Devin, and Zed read their servers from your own settings, outside
|
|
92
|
+
the project, so add `npx @fusion.dev/helix-cli mcp` there.
|
|
79
93
|
|
|
80
94
|
## The manifest
|
|
81
95
|
|