@fusion.dev/helix-docs 0.187.0 → 0.189.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 +44 -2
- package/content/charting.mdx +18 -2
- package/content/coding-agents.mdx +2 -1
- package/content/metrics.mdx +230 -226
- package/content/using-helix-with-an-agent.mdx +24 -22
- package/dist/reference.d.ts +2 -2
- package/dist/sources.generated.js +318 -253
- package/package.json +9 -9
|
@@ -53,11 +53,11 @@ open.
|
|
|
53
53
|
|
|
54
54
|
[//]: # (renders)
|
|
55
55
|
|
|
56
|
-
**
|
|
56
|
+
**34 of the 101 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`, `
|
|
60
|
+
| `area-chart`, `bar-chart`, `copy-button`, `donut-chart`, `heatmap`, `line-chart`, `scatter-chart`, `spatial-heatmap`, `spatial-scatter-chart`, `spatial-surface-chart` | `tooltip` |
|
|
61
61
|
| `breadcrumbs` | `breadcrumb` |
|
|
62
62
|
| `chat` | `chat-message` |
|
|
63
63
|
| `checkbox-group`, `table` | `checkbox` |
|
|
@@ -155,6 +155,48 @@ TypeScript declares custom elements this way. The interface merges from your
|
|
|
155
155
|
source, and a generated file cannot name a class that is not in the same
|
|
156
156
|
program.
|
|
157
157
|
|
|
158
|
+
## Check your components with `helix component`
|
|
159
|
+
|
|
160
|
+
`helix component` checks the components you write on Helix's base classes. Name
|
|
161
|
+
the folders that hold them in `helix.json` at your project's root:
|
|
162
|
+
|
|
163
|
+
```json
|
|
164
|
+
{ "tiers": ["src/components"] }
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
Then run it:
|
|
168
|
+
|
|
169
|
+
```sh
|
|
170
|
+
helix component audit
|
|
171
|
+
helix component check
|
|
172
|
+
```
|
|
173
|
+
|
|
174
|
+
`audit` prints each rule and what it found, and `check` prints nothing when
|
|
175
|
+
there is nothing to report. Both exit 1 on a finding, and `--json` prints the
|
|
176
|
+
findings as data. The rules check what your components document and write:
|
|
177
|
+
|
|
178
|
+
| Rule | What it checks |
|
|
179
|
+
|---|---|
|
|
180
|
+
| `tier` | A component built on a headless one that renders children sets `tier`, so its children are yours and not Helix's |
|
|
181
|
+
| `registered` | Every element a component's base renders is registered under the prefix it sets |
|
|
182
|
+
| `composed` | A module that renders one of your elements, by its base or in its own template, imports the module that registers it |
|
|
183
|
+
| `slots` | A `@slot` you document is one the Helix class under it takes, or one your template renders |
|
|
184
|
+
| `exportparts` | A `::part()` written at your elements or at Helix's names a part that element publishes |
|
|
185
|
+
| `words` | A component with `static words` declares its English defaults `@words`, and joins no word into a sentence outside the message |
|
|
186
|
+
| `dispatched` | An event your component sends by name, with `new CustomEvent` or `new Event`, is documented with `@event` |
|
|
187
|
+
| `parts` | A `@csspart` you document is rendered, and a `part` you render is documented |
|
|
188
|
+
| `states` | A custom state you record is documented with `@cssstate`, and a documented one is recorded |
|
|
189
|
+
| `hooks` | A `@cssproperty` you document is read, and one you read is documented |
|
|
190
|
+
| `restated` | A part, a slot, or an event is declared once |
|
|
191
|
+
| `reflected` | A property that reflects has no default, so a host carries no attribute nobody wrote |
|
|
192
|
+
| `reflected-defaults` | A reflected property writes no attribute on upgrade that a server did not send |
|
|
193
|
+
| `attribute-names` | A property that mirrors a platform attribute answers to the platform's spelling |
|
|
194
|
+
| `constructed` | No class field reads the element's attributes in its initializer, where a parsed element has none yet |
|
|
195
|
+
| `observers` | An observer built once is not torn down by a lifecycle that runs many times |
|
|
196
|
+
| `leaks` | A listener on something the element does not own is removed when the element is |
|
|
197
|
+
|
|
198
|
+
`--only parts,states` runs a few of them.
|
|
199
|
+
|
|
158
200
|
## What the headless tier handles for you
|
|
159
201
|
|
|
160
202
|
### Tree-shaking
|
package/content/charting.mdx
CHANGED
|
@@ -12,9 +12,11 @@ Helix has these chart families, and each one has its own API page:
|
|
|
12
12
|
- `Line Chart`
|
|
13
13
|
- `Area Chart`
|
|
14
14
|
- `Scatter Chart`
|
|
15
|
+
- `Spatial Scatter Chart`, drawn in three dimensions by `@fusion.dev/helix-plot`
|
|
16
|
+
- `Spatial Surface Chart`, drawn in three dimensions by `@fusion.dev/helix-plot`
|
|
15
17
|
- `Donut Chart`
|
|
16
18
|
- `Heatmap`
|
|
17
|
-
- `
|
|
19
|
+
- `Spatial Heatmap`
|
|
18
20
|
- `Sparkline`
|
|
19
21
|
- `Trend`
|
|
20
22
|
- `Legend`, which all of the charts share
|
|
@@ -38,9 +40,23 @@ Choose a chart by the question it answers.
|
|
|
38
40
|
overlaps the series, and `Area Chart` adds them.
|
|
39
41
|
- **Parts of one whole, at one moment.** `Donut Chart`.
|
|
40
42
|
- **Whether two measures relate.** `Scatter Chart`, with one point per row.
|
|
43
|
+
- **Where rows fall on three measures, and which gather together.** `Scatter
|
|
44
|
+
3D`, with one point per row in a box you can turn. Use it for data that has
|
|
45
|
+
three dimensions, such as clusters or embeddings. Its table and its flat
|
|
46
|
+
scatter carry the exact values.
|
|
47
|
+
- **How one measure rises and falls over two others.** `Spatial Surface Chart`, with one
|
|
48
|
+
row per place on a grid, drawn as a surface you can turn. Use it for a measure
|
|
49
|
+
over two ranges, such as load by hour and by day. Its table carries the exact
|
|
50
|
+
values.
|
|
51
|
+
|
|
52
|
+
The spatial charts and `Spatial Heatmap` draw themselves in 3D in SVG, which a
|
|
53
|
+
server, a print, and a page without WebGL all show. Shift with an arrow turns
|
|
54
|
+
the spatial charts' drawing. `@fusion.dev/helix-plot` draws all three with
|
|
55
|
+
three.js instead, lit and in perspective, in a view you can drag round and
|
|
56
|
+
zoom.
|
|
41
57
|
- **How each day or check went.** `Heatmap`, for uptime, contributions, or
|
|
42
58
|
activity.
|
|
43
|
-
- **The same days, as a relief.** `
|
|
59
|
+
- **The same days, as a relief.** `Spatial Heatmap` reads the same table as
|
|
44
60
|
`Heatmap` and draws each reading as a prism as tall as its value. Use it where
|
|
45
61
|
the overall shape matters more than any one exact value, such as a busy
|
|
46
62
|
stretch in a year of commits. The tooltip and the table carry the exact
|
|
@@ -154,7 +154,7 @@ the file your client reads and keeps every other server in it:
|
|
|
154
154
|
| `vscode` | `.vscode/mcp.json` |
|
|
155
155
|
|
|
156
156
|
The server runs `npx @fusion.dev/helix-cli mcp`, which is the copy in your
|
|
157
|
-
project. It has
|
|
157
|
+
project. It has nine tools:
|
|
158
158
|
|
|
159
159
|
| Tool | What it returns |
|
|
160
160
|
|---|---|
|
|
@@ -164,6 +164,7 @@ project. It has eight tools:
|
|
|
164
164
|
| `helix_imports` | The import lines for a list of tags, and the closest tag to any unknown one |
|
|
165
165
|
| `helix_tokens` | The semantic tokens, by a word in the name or description and by category |
|
|
166
166
|
| `helix_check` | The findings `helix scan` reports for the files you name, or for a snippet before you write it |
|
|
167
|
+
| `helix_check_page` | The findings the page diagnostics report for each address you name, opened headless, with what the library logged as the page ran |
|
|
167
168
|
| `helix_audit_theme` | Every foreground and background pair a brand color derives to, with its ratio and target |
|
|
168
169
|
| `helix_derive_theme` | The theme's CSS |
|
|
169
170
|
|