@fusion.dev/helix-docs 0.32.0 → 0.33.1

package/dist/sources.generated.js

@@ -229,6 +229,12 @@ they are load-bearing: the first is how every token expresses both color modes
 in one declaration, and the second is how every overlay is drawn in the top
 layer.
 
+Chromium 132 has both and still misses two things a page's stylesheet can say
+through \`::part()\`, measured 15 Sep 2026: it ignores a range input's
+\`::-webkit-slider-thumb\` and \`::-webkit-slider-runnable-track\` after a part, and
+it looks for the \`@keyframes\` a \`::part()\` rule names inside the component's
+shadow root, so no animation starts; the headless examples use neither.
+
 \`:state()\` is the third and is deliberately not with them, because it does
 degrade: a component that cannot record a state keeps whatever its resting rule
 draws, so a checkbox is drawn unchecked rather than drawn wrong or not at all.
@@ -505,6 +511,32 @@ The legend reads the same table, so the names and the colors cannot disagree
 with the chart's. Pointing them at two different tables is the only way to make
 them disagree, and it is not something to do by accident.
 
+## Right-to-left
+
+On a page with \`dir="rtl"\`, an axis that follows reading order starts where the
+text does, on the right: categories and time. The words around a drawing are
+HTML and turn on their own, and the drawing turns with them, so the name under
+a column is that column's name in either direction. The pointer and the tooltip
+read the drawing the same way. An axis of values keeps its own direction.
+
+- **What turns.** \`Bar Chart\`'s columns, and its rows, which grow out of their
+  names at the right. \`Line Chart\`, \`Area Chart\` and \`Sparkline\`, with their
+  end marks. \`Heatmap\`'s weeks, which were already a grid laid out along the
+  line. A half \`Donut Chart\`, which is read across.
+- **What does not.** Up is more in every script, so values keep their vertical
+  sense, and numerals are text beside the drawing, so none reads backwards. A
+  whole \`Donut Chart\` keeps its first slice at twelve and runs clockwise, which
+  is a clock's convention rather than a script's. \`Scatter Chart\` is laid out as
+  on a left-to-right page, its y axis on the left and more to the right, because
+  both of its axes are measures and a number line runs that way in every
+  script. Its axis names read in their own direction, so a name in Arabic reads
+  right to left under the plot's far end, and its summary and tooltip read the
+  way the page does.
+
+A chart that should read left to right anyway, a number line in a mathematics
+text for instance, takes \`dir="ltr"\` on the element, and the platform's own
+attribute is the whole of the switch.
+
 ## Reduced motion
 
 Charts animate on entry and on data change, and every one of them answers
@@ -1445,6 +1477,20 @@ An icon with no \`label\` is hidden from assistive technology, which is right wh
 the words are beside it and wrong when they are not. \`Icon.Button\` takes a
 \`label\` because it never has words beside it.
 
+## One that points along the line
+
+\`\`\`html
+<helix-icon
+  mirror
+  name="arrow-right"
+></helix-icon>
+\`\`\`
+
+The names are physical, so \`arrow-right\` points right on every page. An arrow
+that means forward or back asks with \`mirror\` to turn round on a right-to-left
+page, which every caret the library draws already does.
+[Localization](./localization) has the rest.
+
 ## Importing a glyph directly
 
 \`\`\`ts
@@ -1797,11 +1843,42 @@ Set \`dir\` and the layout flips:
 \`\`\`
 
 Every component is written in logical properties, \`inline-start\` rather than
-\`left\`, \`margin-block\` rather than \`margin-top\`. Sixty-seven stylesheets name a
-direction, and **not one of them names a physical side**: there is no
-\`margin-left\`, no \`padding-right\` and no \`inset-top\` anywhere in the library.
-Nothing infers the direction for you and nothing needs to: the document says it
-and the components follow.
+\`left\`, \`margin-block\` rather than \`margin-top\`. Nothing infers the direction
+for you and nothing needs to: the document says it and the components follow.
+
+**A physical side appears only where the thing it places is physical.** A
+floating panel is placed from coordinates measured from the viewport's left
+edge, so it and its arrow are written in \`left\` and \`top\`. Everything a reader
+would expect to mirror still does.
+
+**Charts mirror too.** A category or time axis starts where the text does, so
+on a right-to-left page the first reading is on the right and the drawing,
+its labels, its hover targets and its tooltips all turn together. Values keep
+their vertical sense and numerals are not reversed. A whole donut stays
+clockwise from twelve, which is a clock's convention rather than a script's,
+and a scatter chart keeps its left-to-right plane, both of its axes being
+measures. [Charting](./charting) has the rest.
+
+**Carets and arrow keys turn too.** A caret meaning next or previous, the one
+between two crumbs and a shut disclosure all point along the line, so on a
+right-to-left page they point the other way, and every arrow key moves where it
+points on screen: the left arrow moves to the next tab, the next day, the next
+control in a toolbar, and opens a tree's branch or a menu's submenu, whose caret
+points left. A slider and a splitter's divider move the way the key points.
+
+A media player is an exception: its timeline and its skip buttons run left to
+right in every script, a tape having one direction, so the left arrow rewinds.
+A pin input is the other. A code is read like a phone number, so its boxes run
+left to right on every page: the first character typed goes in the leftmost
+box, a pasted code fills rightward and the right arrow moves on, while its
+label, hint and error read the way the page does.
+
+That is also how \`placement\` reads. The side is physical and the alignment is
+logical: \`right\` is the right of the anchor in either direction, and
+\`bottom-start\` lines a panel up with the anchor's start edge, which is its right
+edge on a right-to-left page. A panel with no room on its side still flips to
+the other one, so a \`right-start\` panel beside a rail at the start of a
+right-to-left page opens to its left.
 
 The same is true of anything you write on top. Use logical properties and your
 layout flips with ours; use \`left\` and \`right\` and it will not.
@@ -1863,8 +1940,20 @@ would be a second one to keep in step with yours.
   and font fallback all key off it.
 - **Numerals.** \`Intl\` handles the digits; a hardcoded \`%\` or a currency symbol
   in your own markup will not move to the right side.
-- **Icons that point.** A chevron meaning "forward" is mirrored by the logical
-  properties; one baked into an SVG path is not.
+- **Icons that point.** A caret a component draws turns on its own. An icon you
+  place does not unless you ask, because the names are physical: \`mirror\` turns
+  one on a right-to-left page, for an arrow that means forward or back.
+
+  \`\`\`html
+  <helix-button>
+    Continue
+    <helix-icon
+      mirror
+      name="arrow-right"
+      slot="end"
+    ></helix-icon>
+  </helix-button>
+  \`\`\`
 
 ## What is not covered
 
@@ -1922,7 +2011,7 @@ nobody ever downloads this floor on its own.
 
 | | Raw | Gzip | Brotli |
 |---|---|---|---|
-| Lit and \`@fusion.dev/helix-core\` | 144,481 | 47,796 | 40,278 |
+| Lit and \`@fusion.dev/helix-core\` | 145,906 | 48,207 | 40,782 |
 
 ## Whole packages
 
@@ -1933,11 +2022,11 @@ repository does that. The per-component tables are what a page pays.
 
 | Package | Raw | Gzip | Brotli | |
 |---|---|---|---|---|
-| \`@fusion.dev/helix-core\` | 144,035 | 47,419 | 40,166 | Element base class, mixins, decorators, floating positioning. |
-| \`@fusion.dev/helix-headless\` | 593,666 | 152,841 | 119,120 | Every headless family, which is what the barrel means. |
+| \`@fusion.dev/helix-core\` | 145,460 | 47,853 | 40,503 | Element base class, mixins, decorators, floating positioning. |
+| \`@fusion.dev/helix-headless\` | 601,064 | 155,480 | 121,032 | Every headless family, which is what the barrel means. |
 | \`@fusion.dev/helix-icons\` | 47,484 | 14,907 | 12,553 | The whole glyph set. |
 | \`@fusion.dev/helix-theme\` | 3,288 | 1,571 | 1,355 | The derivation engine. Build time for most consumers, runtime for a theme switcher. |
-| \`@fusion.dev/helix\` | 1,061,512 | 247,499 | 181,210 | Every styled family. |
+| \`@fusion.dev/helix\` | 1,072,613 | 250,984 | 183,841 | Every styled family. |
 | \`lit\` | 15,394 | 6,118 | 5,460 | Not ours. Here so it can be subtracted from every row above it. |
 
 ## The stylesheets
@@ -1958,13 +2047,13 @@ is the whole cost of adopting the base layer on its own.
 
 ## What the numbers say
 
-**Most of a first component is the runtime under it.** The median styled family is 18,545 bytes gzipped alone and adds 2,215 to a page that already has Helix on it, so 88 percent of the first one is shared and 12 percent is the component. Ten typical components are one plus nine additions rather than ten of the first number, and the pair of columns below is what lets that be worked out rather than guessed.
+**Most of a first component is the runtime under it.** The median styled family is 18,709 bytes gzipped alone and adds 2,213 to a page that already has Helix on it, so 88 percent of the first one is shared and 12 percent is the component. Ten typical components are one plus nine additions rather than ten of the first number, and the pair of columns below is what lets that be worked out rather than guessed.
 
-Across the tier: the cheapest is \`code\` at 9,377 gzipped alone, the dearest \`data-table\` at 57,757, over 100 components. Every family at once is 247,499.
+Across the tier: the cheapest is \`code\` at 9,408 gzipped alone, the dearest \`data-table\` at 58,933, over 100 components. Every family at once is 250,984.
 
-**No family imports a barrel, and the \`barrels\` rule in \`fusion workspace\` is what keeps it that way.** \`@fusion.dev/helix-headless\` is \`sideEffects\` over every module in \`dist\`, which is true of a file that calls \`customElements.define\` and which means a bundler may drop none of it: one \`import { HelixHeadlessButton } from '@fusion.dev/helix-headless'\` costs 152,841 bytes gzipped whatever else the page does, which is 8 times the median family measured above. The styled tier imports the family it extends instead, all 100 of them, and the check refuses the shape rather than the package name, so the rule follows \`sideEffects\` wherever it goes.
+**No family imports a barrel, and the \`barrels\` rule in \`fusion workspace\` is what keeps it that way.** \`@fusion.dev/helix-headless\` is \`sideEffects\` over every module in \`dist\`, which is true of a file that calls \`customElements.define\` and which means a bundler may drop none of it: one \`import { HelixHeadlessButton } from '@fusion.dev/helix-headless'\` costs 155,480 bytes gzipped whatever else the page does, which is 8 times the median family measured above. The styled tier imports the family it extends instead, all 100 of them, and the check refuses the shape rather than the package name, so the rule follows \`sideEffects\` wherever it goes.
 
-The headless tier never had the problem, and it is the control: \`@fusion.dev/helix-core\` is \`sideEffects: false\`, and a headless family is a median of 20,156 bytes gzipped alone.
+The headless tier never had the problem, and it is the control: \`@fusion.dev/helix-core\` is \`sideEffects: false\`, and a headless family is a median of 20,496 bytes gzipped alone.
 
 ## Against other systems
 
@@ -1976,43 +2065,43 @@ Four other libraries of custom elements, pinned and measured on 2026-08-24 by \`
 
 | Component | System | Raw | Gzip | Brotli |
 |---|---|---|---|---|
-| \`button\` | **Helix** | 38,886 | 11,904 | 10,467 |
+| \`button\` | **Helix** | 38,953 | 11,938 | 10,536 |
 | | Carbon | 133,058 | 20,959 | 17,685 |
 | | Material Web | 47,060 | 14,173 | 12,591 |
 | | Shoelace | 62,628 | 18,287 | 15,805 |
 | | Spectrum | 98,792 | 22,045 | 18,674 |
-| \`checkbox\` | **Helix** | 42,202 | 12,916 | 11,366 |
+| \`checkbox\` | **Helix** | 42,269 | 12,948 | 11,411 |
 | | Carbon | 60,255 | 15,609 | 13,550 |
 | | Material Web | 43,785 | 13,556 | 12,015 |
 | | Shoelace | 47,614 | 15,177 | 13,301 |
 | | Spectrum | 62,492 | 15,437 | 13,481 |
-| \`dialog\` | **Helix** | 36,169 | 11,548 | 10,179 |
+| \`dialog\` | **Helix** | 36,236 | 11,582 | 10,224 |
 | | Carbon | 510,866 | 67,390 | 39,189 |
 | | Material Web | 34,238 | 11,510 | 10,229 |
 | | Shoelace | 52,754 | 17,698 | 15,554 |
 | | Spectrum | 155,708 | 31,899 | 26,262 |
-| \`radio\` | **Helix** | 44,927 | 13,176 | 11,651 |
+| \`radio\` | **Helix** | 45,127 | 13,282 | 11,744 |
 | | Carbon | 63,055 | 16,887 | 14,605 |
 | | Material Web | 41,044 | 13,234 | 11,757 |
 | | Shoelace | 34,865 | 12,027 | 10,559 |
 | | Spectrum | 38,685 | 10,660 | 9,370 |
-| \`switch\` | **Helix** | 39,897 | 12,469 | 10,972 |
+| \`switch\` | **Helix** | 39,964 | 12,500 | 11,024 |
 | | Carbon | 69,423 | 17,127 | 14,764 |
 | | Material Web | 50,155 | 14,577 | 12,935 |
 | | Shoelace | 37,833 | 11,814 | 10,568 |
 | | Spectrum | 62,322 | 15,059 | 13,321 |
-| \`tabs\` | **Helix** | 41,252 | 12,601 | 11,099 |
+| \`tabs\` | **Helix** | 41,452 | 12,679 | 11,189 |
 | | Carbon | 578,766 | 73,537 | 43,235 |
 | | Material Web | 38,883 | 12,820 | 11,368 |
 | | Shoelace | 54,573 | 17,140 | 15,068 |
 | | Spectrum | 64,875 | 18,298 | 16,283 |
-| \`tooltip\` | **Helix** | 62,160 | 21,054 | 18,660 |
+| \`tooltip\` | **Helix** | 63,078 | 21,403 | 18,968 |
 | | Carbon | 189,382 | 30,354 | 22,273 |
 | | Material Web | | not shipped | |
 | | Shoelace | 57,412 | 20,220 | 17,933 |
 | | Spectrum | 136,599 | 40,552 | 35,286 |
 
-**Where Helix loses**, which is the half of a comparison table worth reading: \`dialog\`, \`radio\`, \`switch\`, \`tooltip\`. The largest gap is radio against Spectrum, by 2,516 bytes gzipped. 5 of 28 peer measurements come in under ours.
+**Where Helix loses**, which is the half of a comparison table worth reading: \`dialog\`, \`radio\`, \`switch\`, \`tooltip\`. The largest gap is radio against Spectrum, by 2,622 bytes gzipped. 6 of 28 peer measurements come in under ours.
 
 - **Carbon** \`@carbon/web-components@2.61.0\`. Its dialog is Modal, its radio is Radio Button, and its switch is Toggle.
 - **Material Web** \`@material/web@2.5.0\`. Ships no tooltip. Its button is measured as the filled one, there being no single button element.
@@ -2057,100 +2146,100 @@ Structure, accessibility, state and form participation. No presentation, and no
 
 | Family | Alone raw | Alone gzip | Alone brotli | Added raw | Added gzip | Added brotli |
 |---|---|---|---|---|---|---|
-| \`accordion\` | 79,421 | 26,542 | 21,741 | 2,875 | 765 | 627 |
-| \`announcement\` | 76,729 | 25,651 | 21,044 | 1,349 | 390 | 360 |
-| \`app-header\` | 28,776 | 9,654 | 8,521 | 1,248 | 320 | 259 |
-| \`area-chart\` | 72,666 | 24,918 | 22,028 | 10,642 | 3,270 | 2,781 |
-| \`avatar\` | 30,825 | 10,257 | 9,063 | 3,257 | 928 | 793 |
-| \`badge\` | 28,311 | 9,586 | 8,437 | 1,162 | 304 | 253 |
-| \`bar-chart\` | 74,207 | 25,221 | 22,269 | 12,266 | 3,611 | 3,021 |
-| \`blockquote\` | 28,164 | 9,543 | 8,406 | 892 | 236 | 266 |
-| \`breadcrumbs\` | 76,375 | 25,281 | 20,829 | 1,953 | 444 | 427 |
-| \`button\` | 32,793 | 10,793 | 9,501 | 3,137 | 835 | 644 |
-| \`button-group\` | 28,182 | 9,499 | 8,366 | 661 | 151 | 171 |
-| \`callout\` | 75,505 | 25,144 | 20,734 | 912 | 251 | 270 |
-| \`card\` | 28,216 | 9,512 | 8,379 | 694 | 161 | 120 |
-| \`carousel\` | 82,719 | 27,315 | 22,511 | 8,148 | 2,143 | 1,724 |
-| \`chat\` | 98,475 | 32,741 | 26,980 | 17,275 | 5,032 | 4,221 |
-| \`checkbox\` | 36,158 | 11,523 | 10,158 | 2,306 | 676 | 461 |
-| \`checkbox-group\` | 39,172 | 12,170 | 10,734 | 4,801 | 1,270 | 943 |
-| \`code\` | 26,801 | 9,082 | 8,003 | 451 | 84 | 111 |
-| \`code-block\` | 119,169 | 39,882 | 33,578 | 16,137 | 4,308 | 3,714 |
-| \`color-input\` | 133,326 | 43,311 | 36,382 | 25,004 | 6,478 | 5,596 |
-| \`color-picker\` | 101,658 | 32,836 | 27,019 | 19,378 | 5,215 | 4,494 |
-| \`combobox\` | 131,258 | 42,431 | 35,602 | 20,245 | 5,034 | 4,189 |
-| \`command\` | 102,411 | 32,556 | 26,715 | 17,560 | 4,505 | 3,750 |
-| \`copy-button\` | 114,164 | 38,327 | 32,231 | 11,135 | 2,825 | 2,418 |
-| \`data-table\` | 168,346 | 52,101 | 43,933 | 54,202 | 13,723 | 11,546 |
-| \`date-input\` | 128,785 | 41,758 | 35,109 | 18,130 | 4,623 | 3,957 |
-| \`date-picker\` | 87,283 | 28,791 | 23,654 | 10,021 | 2,806 | 2,298 |
-| \`description-list\` | 28,285 | 9,451 | 8,314 | 1,132 | 194 | 132 |
-| \`dialog\` | 31,834 | 10,544 | 9,289 | 2,717 | 826 | 677 |
-| \`divider\` | 28,361 | 9,616 | 8,445 | 1,090 | 291 | 307 |
-| \`donut-chart\` | 70,062 | 23,796 | 21,060 | 9,474 | 2,814 | 2,420 |
-| \`drawer\` | 30,587 | 10,176 | 8,935 | 1,761 | 484 | 421 |
-| \`drilldown\` | 82,730 | 27,421 | 22,436 | 5,680 | 1,506 | 1,308 |
-| \`empty\` | 28,338 | 9,554 | 8,415 | 816 | 196 | 216 |
-| \`file-input\` | 86,640 | 28,577 | 23,419 | 6,008 | 1,704 | 1,453 |
-| \`filter-input\` | 142,120 | 45,230 | 38,040 | 28,036 | 6,775 | 5,702 |
-| \`format-date\` | 31,795 | 10,666 | 9,452 | 2,867 | 708 | 559 |
-| \`heatmap\` | 71,473 | 24,049 | 21,251 | 10,710 | 3,037 | 2,451 |
-| \`icon\` | 74,911 | 24,903 | 20,570 | 850 | 199 | 198 |
-| \`icon-button\` | 33,192 | 10,821 | 9,539 | 3,536 | 868 | 709 |
-| \`image\` | 30,355 | 10,050 | 8,859 | 3,156 | 823 | 659 |
-| \`input\` | 86,066 | 28,250 | 23,096 | 4,734 | 1,296 | 974 |
-| \`kbd\` | 30,136 | 10,275 | 9,059 | 2,976 | 1,047 | 856 |
-| \`legend\` | 32,054 | 10,722 | 9,442 | 1,097 | 305 | 234 |
-| \`line-chart\` | 72,152 | 24,606 | 21,777 | 10,212 | 3,018 | 2,542 |
-| \`list\` | 29,237 | 9,687 | 8,532 | 1,725 | 350 | 405 |
-| \`listbox\` | 94,162 | 30,705 | 25,081 | 10,797 | 2,980 | 2,413 |
-| \`loader\` | 28,422 | 9,617 | 8,460 | 900 | 235 | 227 |
-| \`megamenu\` | 57,873 | 20,070 | 17,743 | 4,950 | 1,372 | 1,063 |
-| \`menu\` | 113,092 | 38,232 | 31,975 | 8,835 | 2,230 | 1,795 |
-| \`meter\` | 31,612 | 10,471 | 9,246 | 4,099 | 1,057 | 922 |
-| \`navigation\` | 30,060 | 10,134 | 8,936 | 1,361 | 384 | 308 |
-| \`notifications\` | 90,885 | 29,503 | 24,194 | 11,898 | 2,829 | 2,348 |
-| \`number-input\` | 88,419 | 28,884 | 23,662 | 7,174 | 1,929 | 1,607 |
-| \`object-inspector\` | 126,235 | 42,294 | 35,590 | 18,151 | 4,934 | 4,149 |
-| \`option\` | 30,315 | 10,008 | 8,855 | 2,796 | 618 | 543 |
-| \`outline\` | 33,384 | 11,263 | 9,939 | 4,633 | 1,438 | 1,113 |
-| \`pagination\` | 135,408 | 43,119 | 36,191 | 26,995 | 6,278 | 5,324 |
-| \`pin-input\` | 38,834 | 12,333 | 10,869 | 5,061 | 1,496 | 1,220 |
-| \`popover\` | 55,070 | 19,299 | 17,070 | 1,901 | 537 | 454 |
-| \`progress\` | 29,463 | 9,891 | 8,709 | 1,951 | 498 | 512 |
-| \`qr-code\` | 40,110 | 13,923 | 12,299 | 12,981 | 4,649 | 4,116 |
-| \`quote\` | 27,705 | 9,367 | 8,238 | 552 | 143 | 136 |
-| \`radio\` | 37,348 | 11,762 | 10,376 | 3,114 | 828 | 568 |
-| \`rating\` | 39,596 | 12,615 | 11,097 | 5,806 | 1,654 | 1,306 |
-| \`scatter-chart\` | 71,926 | 24,478 | 21,673 | 10,772 | 3,262 | 2,702 |
-| \`scroll-area\` | 29,941 | 10,044 | 8,816 | 2,736 | 788 | 613 |
-| \`select\` | 123,588 | 40,591 | 33,974 | 15,301 | 3,899 | 3,234 |
-| \`skeleton\` | 26,894 | 9,115 | 8,037 | 544 | 116 | 92 |
-| \`skip-link\` | 28,377 | 9,634 | 8,469 | 1,226 | 389 | 319 |
-| \`slider\` | 39,194 | 12,374 | 10,926 | 5,177 | 1,426 | 1,214 |
-| \`sparkline\` | 34,520 | 11,744 | 10,384 | 2,539 | 835 | 677 |
-| \`speed-dial\` | 104,742 | 35,898 | 30,142 | 3,743 | 988 | 752 |
-| \`splitter\` | 37,680 | 11,981 | 10,630 | 10,163 | 2,560 | 2,210 |
-| \`stat\` | 28,670 | 9,551 | 8,404 | 1,148 | 199 | 168 |
-| \`steps\` | 84,498 | 27,718 | 22,747 | 6,293 | 1,522 | 1,269 |
-| \`switch\` | 35,673 | 11,424 | 10,107 | 1,699 | 537 | 422 |
-| \`table\` | 83,008 | 27,397 | 22,410 | 7,059 | 1,824 | 1,517 |
-| \`tabs\` | 35,013 | 11,326 | 9,963 | 4,097 | 913 | 795 |
-| \`tag\` | 75,789 | 25,244 | 20,728 | 897 | 201 | 171 |
-| \`textarea\` | 38,275 | 12,050 | 10,620 | 4,018 | 1,098 | 878 |
-| \`time-input\` | 141,432 | 45,092 | 37,835 | 27,849 | 6,937 | 5,885 |
-| \`time-picker\` | 102,717 | 33,197 | 27,277 | 18,808 | 5,112 | 4,310 |
-| \`timeline\` | 76,321 | 25,228 | 20,781 | 1,894 | 406 | 319 |
-| \`toast\` | 79,520 | 26,325 | 21,596 | 4,005 | 949 | 786 |
-| \`toggle\` | 39,310 | 12,366 | 10,924 | 3,535 | 926 | 756 |
-| \`toolbar\` | 30,084 | 10,147 | 8,926 | 2,932 | 942 | 725 |
-| \`tooltip\` | 58,594 | 20,242 | 17,926 | 5,914 | 1,661 | 1,324 |
-| \`tour\` | 64,754 | 21,671 | 19,187 | 10,856 | 2,714 | 2,307 |
-| \`tree\` | 85,956 | 28,308 | 23,118 | 7,132 | 1,929 | 1,596 |
-| \`trend\` | 75,114 | 25,006 | 20,655 | 1,056 | 289 | 334 |
-| \`video\` | 137,930 | 44,301 | 37,287 | 33,421 | 7,980 | 6,925 |
-| \`video-playlist\` | 120,629 | 39,847 | 33,440 | 14,968 | 3,483 | 2,941 |
-| \`virtual-list\` | 33,940 | 11,417 | 10,084 | 2,485 | 766 | 630 |
+| \`accordion\` | 79,621 | 26,649 | 21,808 | 2,875 | 765 | 648 |
+| \`announcement\` | 76,796 | 25,684 | 21,059 | 1,349 | 378 | 243 |
+| \`app-header\` | 28,843 | 9,685 | 8,548 | 1,248 | 318 | 194 |
+| \`area-chart\` | 74,493 | 25,490 | 22,501 | 11,180 | 3,423 | 2,797 |
+| \`avatar\` | 30,892 | 10,287 | 9,088 | 3,257 | 923 | 724 |
+| \`badge\` | 28,378 | 9,616 | 8,479 | 1,162 | 302 | 308 |
+| \`bar-chart\` | 76,063 | 25,800 | 22,767 | 12,833 | 3,779 | 3,081 |
+| \`blockquote\` | 28,231 | 9,575 | 8,441 | 892 | 232 | 59 |
+| \`breadcrumbs\` | 76,454 | 25,325 | 20,859 | 1,965 | 447 | 265 |
+| \`button\` | 32,860 | 10,824 | 9,547 | 3,137 | 835 | 573 |
+| \`button-group\` | 28,249 | 9,532 | 8,370 | 661 | 144 | 34 |
+| \`callout\` | 75,572 | 25,180 | 20,794 | 912 | 246 | 172 |
+| \`card\` | 28,283 | 9,543 | 8,409 | 694 | 156 | 161 |
+| \`carousel\` | 83,032 | 27,443 | 22,633 | 8,255 | 2,154 | 1,606 |
+| \`chat\` | 98,930 | 32,898 | 27,089 | 17,663 | 5,147 | 4,205 |
+| \`checkbox\` | 36,225 | 11,556 | 10,213 | 2,306 | 680 | 452 |
+| \`checkbox-group\` | 39,239 | 12,202 | 10,772 | 4,801 | 1,266 | 828 |
+| \`code\` | 26,868 | 9,113 | 8,043 | 451 | 79 | 61 |
+| \`code-block\` | 121,128 | 40,399 | 34,067 | 17,262 | 4,547 | 3,752 |
+| \`color-input\` | 134,246 | 43,598 | 36,618 | 25,050 | 6,488 | 5,459 |
+| \`color-picker\` | 101,771 | 32,905 | 27,144 | 19,424 | 5,234 | 4,422 |
+| \`combobox\` | 132,091 | 42,672 | 35,833 | 20,245 | 5,031 | 4,061 |
+| \`command\` | 102,478 | 32,589 | 26,678 | 17,560 | 4,503 | 3,699 |
+| \`copy-button\` | 115,724 | 38,763 | 32,609 | 11,861 | 2,989 | 2,435 |
+| \`data-table\` | 169,823 | 52,513 | 44,436 | 54,707 | 13,879 | 11,533 |
+| \`date-input\` | 130,210 | 42,205 | 35,484 | 18,542 | 4,763 | 3,946 |
+| \`date-picker\` | 87,466 | 28,913 | 23,785 | 9,997 | 2,822 | 2,198 |
+| \`description-list\` | 28,352 | 9,484 | 8,349 | 1,132 | 186 | 122 |
+| \`dialog\` | 31,901 | 10,573 | 9,316 | 2,717 | 823 | 637 |
+| \`divider\` | 28,428 | 9,648 | 8,489 | 1,090 | 289 | 159 |
+| \`donut-chart\` | 72,174 | 24,429 | 21,596 | 10,300 | 3,037 | 2,457 |
+| \`drawer\` | 30,654 | 10,208 | 8,977 | 1,761 | 479 | 362 |
+| \`drilldown\` | 82,953 | 27,534 | 22,524 | 5,697 | 1,528 | 1,170 |
+| \`empty\` | 28,405 | 9,585 | 8,451 | 816 | 192 | 82 |
+| \`file-input\` | 86,707 | 28,610 | 23,439 | 6,008 | 1,703 | 1,318 |
+| \`filter-input\` | 143,086 | 45,527 | 38,253 | 28,036 | 6,807 | 5,680 |
+| \`format-date\` | 31,862 | 10,699 | 9,457 | 2,867 | 711 | 485 |
+| \`heatmap\` | 73,226 | 24,578 | 21,763 | 11,228 | 3,181 | 2,444 |
+| \`icon\` | 75,077 | 24,979 | 20,541 | 952 | 223 | 142 |
+| \`icon-button\` | 33,259 | 10,854 | 9,548 | 3,536 | 867 | 641 |
+| \`image\` | 30,422 | 10,083 | 8,879 | 3,156 | 832 | 618 |
+| \`input\` | 86,133 | 28,284 | 23,222 | 4,734 | 1,304 | 985 |
+| \`kbd\` | 30,203 | 10,306 | 9,097 | 2,976 | 1,044 | 850 |
+| \`legend\` | 32,121 | 10,755 | 9,488 | 1,097 | 295 | 211 |
+| \`line-chart\` | 73,979 | 25,180 | 22,227 | 10,750 | 3,165 | 2,552 |
+| \`list\` | 29,304 | 9,718 | 8,571 | 1,725 | 345 | 218 |
+| \`listbox\` | 94,229 | 30,738 | 25,115 | 10,797 | 2,966 | 2,335 |
+| \`loader\` | 28,489 | 9,649 | 8,489 | 900 | 230 | 177 |
+| \`megamenu\` | 58,706 | 20,334 | 17,987 | 4,950 | 1,365 | 1,066 |
+| \`menu\` | 114,058 | 38,538 | 32,327 | 8,835 | 2,251 | 1,728 |
+| \`meter\` | 31,679 | 10,505 | 9,253 | 4,099 | 1,060 | 946 |
+| \`navigation\` | 30,127 | 10,165 | 8,969 | 1,361 | 374 | 211 |
+| \`notifications\` | 90,952 | 29,543 | 24,263 | 11,898 | 2,829 | 2,319 |
+| \`number-input\` | 88,486 | 28,915 | 23,677 | 7,174 | 1,928 | 1,441 |
+| \`object-inspector\` | 128,399 | 42,864 | 36,088 | 19,342 | 5,183 | 4,271 |
+| \`option\` | 30,382 | 10,040 | 8,870 | 2,796 | 618 | 402 |
+| \`outline\` | 33,451 | 11,294 | 9,948 | 4,633 | 1,430 | 1,067 |
+| \`pagination\` | 136,253 | 43,361 | 36,448 | 27,007 | 6,291 | 5,174 |
+| \`pin-input\` | 38,878 | 12,394 | 10,942 | 5,038 | 1,514 | 1,114 |
+| \`popover\` | 55,903 | 19,554 | 17,330 | 1,901 | 531 | 350 |
+| \`progress\` | 29,530 | 9,923 | 8,753 | 1,951 | 496 | 367 |
+| \`qr-code\` | 40,177 | 13,955 | 12,312 | 12,981 | 4,651 | 4,070 |
+| \`quote\` | 27,772 | 9,397 | 8,288 | 552 | 135 | -6 |
+| \`radio\` | 37,548 | 11,864 | 10,469 | 3,114 | 821 | 519 |
+| \`rating\` | 39,796 | 12,722 | 11,217 | 5,806 | 1,662 | 1,312 |
+| \`scatter-chart\` | 73,937 | 25,111 | 22,133 | 11,494 | 3,459 | 2,889 |
+| \`scroll-area\` | 30,015 | 10,086 | 8,884 | 2,743 | 793 | 554 |
+| \`select\` | 124,421 | 40,824 | 34,233 | 15,301 | 3,899 | 3,060 |
+| \`skeleton\` | 26,961 | 9,146 | 8,073 | 544 | 111 | 48 |
+| \`skip-link\` | 28,444 | 9,666 | 8,503 | 1,226 | 382 | 194 |
+| \`slider\` | 39,261 | 12,409 | 10,974 | 5,177 | 1,421 | 1,163 |
+| \`sparkline\` | 34,607 | 11,782 | 10,423 | 2,559 | 838 | 579 |
+| \`speed-dial\` | 105,708 | 36,192 | 30,377 | 3,743 | 980 | 748 |
+| \`splitter\` | 37,690 | 12,054 | 10,689 | 9,967 | 2,536 | 2,128 |
+| \`stat\` | 28,737 | 9,584 | 8,440 | 1,148 | 195 | 131 |
+| \`steps\` | 84,565 | 27,752 | 22,798 | 6,293 | 1,514 | 1,184 |
+| \`switch\` | 35,740 | 11,456 | 10,102 | 1,699 | 536 | 286 |
+| \`table\` | 85,348 | 28,315 | 23,200 | 9,193 | 2,578 | 2,012 |
+| \`tabs\` | 35,213 | 11,404 | 10,034 | 4,097 | 901 | 652 |
+| \`tag\` | 75,856 | 25,278 | 20,723 | 897 | 190 | 149 |
+| \`textarea\` | 38,342 | 12,083 | 10,661 | 4,018 | 1,109 | 692 |
+| \`time-input\` | 142,408 | 45,364 | 38,065 | 27,951 | 6,973 | 5,825 |
+| \`time-picker\` | 102,784 | 33,233 | 27,319 | 18,808 | 5,119 | 4,153 |
+| \`timeline\` | 76,388 | 25,264 | 20,833 | 1,894 | 399 | 311 |
+| \`toast\` | 79,587 | 26,362 | 21,603 | 4,005 | 945 | 749 |
+| \`toggle\` | 39,510 | 12,450 | 10,993 | 3,535 | 927 | 634 |
+| \`toolbar\` | 30,291 | 10,244 | 9,039 | 2,933 | 942 | 658 |
+| \`tooltip\` | 60,000 | 20,657 | 18,277 | 6,432 | 1,807 | 1,330 |
+| \`tour\` | 65,738 | 21,993 | 19,463 | 11,006 | 2,771 | 2,164 |
+| \`tree\` | 86,155 | 28,426 | 23,245 | 7,125 | 1,950 | 1,518 |
+| \`trend\` | 75,181 | 25,041 | 20,668 | 1,056 | 278 | 191 |
+| \`video\` | 139,358 | 44,823 | 37,815 | 33,883 | 8,222 | 7,111 |
+| \`video-playlist\` | 121,595 | 40,146 | 33,651 | 14,968 | 3,503 | 2,890 |
+| \`virtual-list\` | 34,007 | 11,448 | 10,112 | 2,485 | 756 | 513 |
 
 ### Styled tier
 
@@ -2158,106 +2247,106 @@ The headless tier plus presentation. This is what \`bun add @fusion.dev/helix\`
 
 | Family | Alone raw | Alone gzip | Alone brotli | Added raw | Added gzip | Added brotli |
 |---|---|---|---|---|---|---|
-| \`accordion\` | 82,763 | 27,359 | 22,434 | 6,204 | 1,571 | 1,371 |
-| \`announcement\` | 81,138 | 26,650 | 21,854 | 5,742 | 1,358 | 1,256 |
-| \`app-header\` | 32,666 | 10,544 | 9,300 | 5,121 | 1,223 | 1,076 |
-| \`area-chart\` | 80,540 | 26,554 | 23,532 | 18,496 | 4,930 | 4,084 |
-| \`aura\` | 89,213 | 31,171 | 26,957 | 60,901 | 21,434 | 18,555 |
-| \`avatar\` | 34,410 | 11,015 | 9,705 | 6,832 | 1,701 | 1,375 |
-| \`badge\` | 31,415 | 10,292 | 9,061 | 4,249 | 996 | 894 |
-| \`bar-chart\` | 87,482 | 27,793 | 24,604 | 25,521 | 6,217 | 5,328 |
-| \`blockquote\` | 29,320 | 9,833 | 8,691 | 2,032 | 528 | 496 |
-| \`breadcrumbs\` | 79,999 | 26,093 | 21,577 | 5,564 | 1,250 | 1,170 |
-| \`button\` | 38,886 | 11,904 | 10,467 | 9,212 | 1,949 | 1,671 |
-| \`button-group\` | 29,858 | 9,877 | 8,693 | 2,320 | 534 | 449 |
-| \`callout\` | 77,504 | 25,677 | 21,224 | 2,895 | 769 | 685 |
-| \`card\` | 31,449 | 10,337 | 9,120 | 3,915 | 979 | 878 |
-| \`carousel\` | 92,561 | 28,910 | 23,993 | 17,979 | 3,701 | 3,235 |
-| \`chat\` | 112,591 | 35,227 | 29,083 | 31,376 | 7,531 | 6,406 |
-| \`checkbox\` | 42,202 | 12,916 | 11,366 | 8,334 | 2,060 | 1,745 |
-| \`checkbox-group\` | 41,355 | 12,738 | 11,255 | 6,970 | 1,821 | 1,390 |
-| \`code\` | 27,878 | 9,377 | 8,269 | 1,511 | 378 | 334 |
-| \`code-block\` | 135,378 | 42,673 | 35,924 | 32,326 | 6,942 | 5,968 |
-| \`color-input\` | 165,286 | 48,196 | 40,707 | 56,947 | 11,377 | 9,904 |
-| \`color-picker\` | 127,915 | 37,019 | 30,775 | 45,628 | 9,461 | 8,220 |
-| \`combobox\` | 146,061 | 45,077 | 37,833 | 35,029 | 7,673 | 6,529 |
-| \`command\` | 112,874 | 34,587 | 28,458 | 28,007 | 6,523 | 5,589 |
-| \`copy-button\` | 124,707 | 40,165 | 33,777 | 21,660 | 4,573 | 3,907 |
-| \`data-table\` | 203,369 | 57,757 | 48,609 | 89,206 | 19,467 | 16,263 |
-| \`date-input\` | 144,731 | 44,810 | 37,706 | 34,053 | 7,579 | 6,613 |
-| \`date-picker\` | 92,925 | 29,957 | 24,667 | 15,645 | 3,955 | 3,340 |
-| \`description-list\` | 30,663 | 10,018 | 8,817 | 3,502 | 758 | 709 |
-| \`dialog\` | 36,169 | 11,548 | 10,179 | 7,037 | 1,828 | 1,610 |
-| \`divider\` | 30,517 | 10,136 | 8,901 | 3,229 | 794 | 662 |
-| \`donut-chart\` | 79,523 | 25,707 | 22,770 | 18,915 | 4,753 | 4,053 |
-| \`drawer\` | 34,818 | 11,184 | 9,831 | 5,975 | 1,492 | 1,294 |
-| \`drilldown\` | 87,379 | 28,452 | 23,344 | 10,317 | 2,499 | 2,188 |
-| \`empty\` | 29,625 | 9,918 | 8,725 | 2,087 | 557 | 455 |
-| \`file-input\` | 97,758 | 30,756 | 25,323 | 17,119 | 3,822 | 3,299 |
-| \`filter-input\` | 169,994 | 49,660 | 41,720 | 55,897 | 11,273 | 9,565 |
-| \`flex\` | 29,160 | 9,722 | 8,540 | 1,999 | 459 | 422 |
-| \`format-date\` | 32,443 | 10,811 | 9,580 | 3,497 | 859 | 721 |
-| \`grid\` | 29,687 | 9,887 | 8,712 | 2,522 | 626 | 570 |
-| \`heatmap\` | 78,759 | 25,490 | 22,577 | 17,977 | 4,496 | 3,814 |
-| \`icon\` | 75,617 | 25,085 | 20,682 | 1,539 | 358 | 301 |
-| \`icon-button\` | 39,207 | 11,832 | 10,411 | 9,537 | 1,871 | 1,574 |
-| \`image\` | 32,114 | 10,541 | 9,293 | 4,897 | 1,308 | 1,063 |
-| \`input\` | 92,168 | 29,566 | 24,219 | 10,828 | 2,590 | 2,198 |
-| \`kbd\` | 31,548 | 10,722 | 9,439 | 4,373 | 1,491 | 1,229 |
-| \`legend\` | 36,894 | 11,820 | 10,387 | 5,931 | 1,437 | 1,253 |
-| \`line-chart\` | 82,241 | 26,611 | 23,555 | 20,286 | 5,049 | 4,260 |
-| \`list\` | 33,301 | 10,631 | 9,368 | 5,779 | 1,304 | 1,178 |
-| \`listbox\` | 98,431 | 31,695 | 25,925 | 15,059 | 3,960 | 3,213 |
-| \`loader\` | 31,588 | 10,384 | 9,145 | 4,051 | 987 | 849 |
-| \`megamenu\` | 62,750 | 21,137 | 18,724 | 9,810 | 2,421 | 2,049 |
-| \`menu\` | 120,585 | 39,836 | 33,391 | 16,309 | 3,793 | 3,216 |
-| \`meter\` | 37,010 | 11,618 | 10,273 | 9,479 | 2,200 | 2,038 |
-| \`navigation\` | 31,441 | 10,524 | 9,280 | 2,726 | 771 | 638 |
-| \`notifications\` | 103,841 | 31,850 | 26,266 | 24,840 | 5,161 | 4,451 |
-| \`number-input\` | 93,201 | 30,014 | 24,566 | 11,944 | 3,030 | 2,517 |
-| \`object-inspector\` | 140,514 | 44,702 | 37,630 | 32,409 | 7,315 | 6,314 |
-| \`option\` | 33,569 | 10,912 | 9,619 | 6,038 | 1,513 | 1,229 |
-| \`orb\` | 37,038 | 12,934 | 11,431 | 9,466 | 3,484 | 3,066 |
-| \`outline\` | 37,124 | 12,044 | 10,640 | 8,356 | 2,223 | 1,857 |
-| \`pagination\` | 153,423 | 46,233 | 38,858 | 44,992 | 9,354 | 8,008 |
-| \`pin-input\` | 41,882 | 13,112 | 11,512 | 8,092 | 2,274 | 1,839 |
-| \`popover\` | 57,706 | 19,948 | 17,655 | 4,519 | 1,192 | 949 |
-| \`progress\` | 34,492 | 11,070 | 9,791 | 6,962 | 1,645 | 1,539 |
-| \`qr-code\` | 41,773 | 14,353 | 12,669 | 14,626 | 5,099 | 4,434 |
-| \`quote\` | 28,360 | 9,528 | 8,391 | 1,191 | 297 | 299 |
-| \`radio\` | 44,927 | 13,176 | 11,651 | 10,686 | 2,255 | 1,887 |
-| \`rating\` | 42,553 | 13,539 | 11,961 | 8,745 | 2,547 | 2,165 |
-| \`sandbox\` | 62,701 | 17,142 | 15,199 | 34,886 | 7,632 | 6,614 |
-| \`scatter-chart\` | 80,723 | 26,317 | 23,224 | 19,550 | 5,118 | 4,269 |
-| \`scroll-area\` | 32,867 | 10,666 | 9,361 | 5,645 | 1,398 | 1,170 |
-| \`select\` | 136,193 | 42,959 | 36,045 | 27,888 | 6,246 | 5,238 |
-| \`skeleton\` | 29,412 | 9,868 | 8,693 | 2,242 | 604 | 498 |
-| \`skip-link\` | 29,840 | 10,038 | 8,793 | 2,672 | 773 | 574 |
-| \`slider\` | 49,030 | 14,158 | 12,531 | 14,996 | 3,199 | 2,750 |
-| \`sparkline\` | 38,267 | 12,671 | 11,182 | 6,275 | 1,743 | 1,623 |
-| \`speed-dial\` | 112,206 | 37,348 | 31,387 | 11,187 | 2,353 | 1,957 |
-| \`splitter\` | 43,752 | 12,982 | 11,530 | 16,217 | 3,573 | 3,123 |
-| \`stat\` | 31,486 | 10,172 | 8,964 | 3,954 | 830 | 766 |
-| \`steps\` | 98,121 | 30,142 | 24,836 | 19,904 | 3,899 | 3,345 |
-| \`switch\` | 39,897 | 12,469 | 10,972 | 5,908 | 1,581 | 1,385 |
-| \`table\` | 88,284 | 28,476 | 23,363 | 12,324 | 2,902 | 2,507 |
-| \`tabs\` | 41,252 | 12,601 | 11,099 | 10,325 | 2,207 | 1,861 |
-| \`tag\` | 78,993 | 26,106 | 21,436 | 4,086 | 1,024 | 928 |
-| \`text\` | 31,146 | 10,013 | 8,811 | 3,987 | 816 | 667 |
-| \`textarea\` | 41,612 | 12,866 | 11,334 | 7,341 | 1,935 | 1,524 |
-| \`time-input\` | 162,671 | 48,608 | 40,866 | 49,073 | 10,505 | 8,947 |
-| \`time-picker\` | 114,193 | 35,345 | 29,200 | 30,279 | 7,305 | 6,223 |
-| \`timeline\` | 79,599 | 25,986 | 21,449 | 5,160 | 1,146 | 1,031 |
-| \`toast\` | 87,053 | 27,995 | 23,069 | 11,526 | 2,576 | 2,210 |
-| \`toggle\` | 44,297 | 13,510 | 11,914 | 8,514 | 2,093 | 1,746 |
-| \`toolbar\` | 31,376 | 10,437 | 9,178 | 4,207 | 1,235 | 995 |
-| \`tooltip\` | 62,160 | 21,054 | 18,660 | 9,462 | 2,434 | 2,069 |
-| \`tour\` | 74,621 | 23,348 | 20,656 | 20,703 | 4,355 | 3,712 |
-| \`tree\` | 90,979 | 29,505 | 24,159 | 12,144 | 3,135 | 2,683 |
-| \`trend\` | 78,170 | 25,675 | 21,171 | 4,103 | 916 | 905 |
-| \`video\` | 156,931 | 47,757 | 40,326 | 52,402 | 11,443 | 10,074 |
-| \`video-playlist\` | 134,543 | 42,356 | 35,553 | 28,861 | 5,949 | 4,973 |
-| \`virtual-list\` | 34,732 | 11,625 | 10,282 | 3,259 | 965 | 851 |
+| \`accordion\` | 82,963 | 27,465 | 22,541 | 6,204 | 1,577 | 1,301 |
+| \`announcement\` | 81,205 | 26,685 | 21,925 | 5,742 | 1,361 | 1,109 |
+| \`app-header\` | 32,733 | 10,580 | 9,309 | 5,121 | 1,224 | 977 |
+| \`area-chart\` | 81,879 | 27,087 | 23,936 | 18,546 | 5,029 | 4,110 |
+| \`aura\` | 90,451 | 31,413 | 27,165 | 62,072 | 21,659 | 18,703 |
+| \`avatar\` | 34,477 | 11,046 | 9,760 | 6,832 | 1,688 | 1,348 |
+| \`badge\` | 31,482 | 10,323 | 9,070 | 4,249 | 1,001 | 734 |
+| \`bar-chart\` | 88,928 | 28,348 | 25,044 | 25,678 | 6,362 | 5,296 |
+| \`blockquote\` | 29,387 | 9,864 | 8,692 | 2,032 | 526 | 378 |
+| \`breadcrumbs\` | 80,020 | 26,119 | 21,550 | 5,518 | 1,238 | 1,041 |
+| \`button\` | 38,953 | 11,938 | 10,536 | 9,212 | 1,948 | 1,644 |
+| \`button-group\` | 29,925 | 9,910 | 8,725 | 2,320 | 530 | 409 |
+| \`callout\` | 77,571 | 25,713 | 21,229 | 2,895 | 765 | 657 |
+| \`card\` | 31,516 | 10,370 | 9,122 | 3,915 | 977 | 767 |
+| \`carousel\` | 93,170 | 29,154 | 24,175 | 18,382 | 3,848 | 3,237 |
+| \`chat\` | 113,046 | 35,381 | 29,317 | 31,764 | 7,657 | 6,404 |
+| \`checkbox\` | 42,269 | 12,948 | 11,411 | 8,334 | 2,062 | 1,731 |
+| \`checkbox-group\` | 41,422 | 12,772 | 11,262 | 6,970 | 1,835 | 1,296 |
+| \`code\` | 27,945 | 9,408 | 8,291 | 1,511 | 367 | 267 |
+| \`code-block\` | 137,628 | 43,256 | 36,440 | 33,742 | 7,252 | 6,162 |
+| \`color-input\` | 167,660 | 48,717 | 41,179 | 58,447 | 11,656 | 10,079 |
+| \`color-picker\` | 129,481 | 37,338 | 31,054 | 47,128 | 9,736 | 8,341 |
+| \`combobox\` | 146,894 | 45,314 | 38,009 | 35,029 | 7,688 | 6,518 |
+| \`command\` | 112,941 | 34,615 | 28,512 | 28,007 | 6,551 | 5,466 |
+| \`copy-button\` | 125,779 | 40,540 | 34,159 | 21,898 | 4,696 | 3,896 |
+| \`data-table\` | 206,548 | 58,933 | 49,595 | 91,413 | 20,361 | 16,892 |
+| \`date-input\` | 146,080 | 45,236 | 38,121 | 34,389 | 7,724 | 6,576 |
+| \`date-picker\` | 93,032 | 30,073 | 24,744 | 15,545 | 3,964 | 3,319 |
+| \`description-list\` | 30,730 | 10,049 | 8,825 | 3,502 | 769 | 666 |
+| \`dialog\` | 36,236 | 11,582 | 10,224 | 7,037 | 1,826 | 1,568 |
+| \`divider\` | 30,584 | 10,167 | 8,929 | 3,229 | 801 | 683 |
+| \`donut-chart\` | 81,277 | 26,320 | 23,264 | 19,383 | 4,963 | 4,106 |
+| \`drawer\` | 34,885 | 11,217 | 9,888 | 5,975 | 1,486 | 1,160 |
+| \`drilldown\` | 87,500 | 28,534 | 23,430 | 10,232 | 2,482 | 2,083 |
+| \`empty\` | 29,692 | 9,949 | 8,761 | 2,087 | 551 | 370 |
+| \`file-input\` | 97,926 | 30,815 | 25,381 | 17,221 | 3,853 | 3,292 |
+| \`filter-input\` | 170,946 | 49,938 | 41,976 | 55,883 | 11,280 | 9,437 |
+| \`flex\` | 29,227 | 9,753 | 8,600 | 1,999 | 457 | 372 |
+| \`format-date\` | 32,510 | 10,844 | 9,616 | 3,497 | 857 | 623 |
+| \`grid\` | 29,754 | 9,917 | 8,756 | 2,522 | 619 | 479 |
+| \`heatmap\` | 80,024 | 25,974 | 22,960 | 18,007 | 4,606 | 3,822 |
+| \`icon\` | 75,783 | 25,159 | 20,714 | 1,641 | 380 | 234 |
+| \`icon-button\` | 39,274 | 11,865 | 10,468 | 9,537 | 1,875 | 1,498 |
+| \`image\` | 32,181 | 10,572 | 9,317 | 4,897 | 1,310 | 1,035 |
+| \`input\` | 92,336 | 29,629 | 24,271 | 10,930 | 2,622 | 2,091 |
+| \`kbd\` | 31,615 | 10,753 | 9,447 | 4,373 | 1,494 | 1,200 |
+| \`legend\` | 36,961 | 11,851 | 10,407 | 5,931 | 1,428 | 1,062 |
+| \`line-chart\` | 83,750 | 27,169 | 24,024 | 20,506 | 5,200 | 4,298 |
+| \`list\` | 33,368 | 10,664 | 9,398 | 5,779 | 1,309 | 1,027 |
+| \`listbox\` | 98,498 | 31,730 | 25,926 | 15,059 | 3,953 | 3,210 |
+| \`loader\` | 31,655 | 10,415 | 9,171 | 4,051 | 990 | 871 |
+| \`megamenu\` | 63,583 | 21,401 | 18,957 | 9,810 | 2,421 | 1,921 |
+| \`menu\` | 121,435 | 40,113 | 33,597 | 16,193 | 3,773 | 3,054 |
+| \`meter\` | 37,077 | 11,643 | 10,297 | 9,479 | 2,199 | 1,935 |
+| \`navigation\` | 31,508 | 10,556 | 9,284 | 2,726 | 769 | 541 |
+| \`notifications\` | 103,908 | 31,888 | 26,362 | 24,840 | 5,169 | 4,429 |
+| \`number-input\` | 93,268 | 30,048 | 24,599 | 11,944 | 3,031 | 2,421 |
+| \`object-inspector\` | 142,100 | 45,192 | 38,118 | 33,022 | 7,514 | 6,307 |
+| \`option\` | 33,636 | 10,946 | 9,654 | 6,038 | 1,512 | 1,193 |
+| \`orb\` | 37,783 | 13,110 | 11,586 | 10,144 | 3,616 | 3,082 |
+| \`outline\` | 37,191 | 12,076 | 10,656 | 8,356 | 2,227 | 1,813 |
+| \`pagination\` | 154,119 | 46,452 | 39,097 | 44,855 | 9,343 | 7,813 |
+| \`pin-input\` | 41,945 | 13,185 | 11,599 | 8,088 | 2,312 | 1,850 |
+| \`popover\` | 58,539 | 20,204 | 17,849 | 4,519 | 1,189 | 824 |
+| \`progress\` | 34,559 | 11,096 | 9,836 | 6,962 | 1,654 | 1,429 |
+| \`qr-code\` | 41,840 | 14,385 | 12,673 | 14,626 | 5,107 | 4,352 |
+| \`quote\` | 28,427 | 9,559 | 8,416 | 1,191 | 295 | 143 |
+| \`radio\` | 45,127 | 13,282 | 11,744 | 10,686 | 2,248 | 1,761 |
+| \`rating\` | 42,753 | 13,648 | 12,037 | 8,745 | 2,554 | 2,089 |
+| \`sandbox\` | 62,711 | 17,214 | 15,278 | 34,690 | 7,620 | 6,638 |
+| \`scatter-chart\` | 82,303 | 26,918 | 23,768 | 19,841 | 5,284 | 4,357 |
+| \`scroll-area\` | 33,163 | 10,747 | 9,450 | 5,874 | 1,444 | 1,139 |
+| \`select\` | 137,026 | 43,197 | 36,271 | 27,888 | 6,253 | 5,178 |
+| \`skeleton\` | 29,479 | 9,897 | 8,717 | 2,242 | 594 | 454 |
+| \`skip-link\` | 29,907 | 10,068 | 8,837 | 2,672 | 771 | 547 |
+| \`slider\` | 50,243 | 14,372 | 12,719 | 16,142 | 3,389 | 2,901 |
+| \`sparkline\` | 38,524 | 12,731 | 11,265 | 6,465 | 1,776 | 1,472 |
+| \`speed-dial\` | 113,274 | 37,669 | 31,679 | 11,289 | 2,390 | 1,911 |
+| \`splitter\` | 43,762 | 13,045 | 11,608 | 16,021 | 3,558 | 3,114 |
+| \`stat\` | 31,553 | 10,204 | 9,037 | 3,954 | 832 | 745 |
+| \`steps\` | 98,188 | 30,177 | 24,855 | 19,904 | 3,903 | 3,265 |
+| \`switch\` | 39,964 | 12,500 | 11,024 | 5,908 | 1,579 | 1,207 |
+| \`table\` | 90,706 | 29,413 | 24,137 | 14,540 | 3,644 | 2,994 |
+| \`tabs\` | 41,452 | 12,679 | 11,189 | 10,325 | 2,198 | 1,834 |
+| \`tag\` | 79,060 | 26,140 | 21,473 | 4,086 | 1,025 | 852 |
+| \`text\` | 31,213 | 10,043 | 8,826 | 3,987 | 789 | 526 |
+| \`textarea\` | 41,679 | 12,895 | 11,358 | 7,341 | 1,934 | 1,431 |
+| \`time-input\` | 163,647 | 48,868 | 41,210 | 49,175 | 10,538 | 8,941 |
+| \`time-picker\` | 114,260 | 35,379 | 29,186 | 30,279 | 7,316 | 6,095 |
+| \`timeline\` | 79,666 | 26,024 | 21,566 | 5,160 | 1,134 | 857 |
+| \`toast\` | 87,120 | 28,029 | 23,045 | 11,526 | 2,582 | 2,139 |
+| \`toggle\` | 44,497 | 13,600 | 12,049 | 8,514 | 2,092 | 1,607 |
+| \`toolbar\` | 31,583 | 10,541 | 9,268 | 4,208 | 1,250 | 960 |
+| \`tooltip\` | 63,078 | 21,403 | 18,968 | 9,492 | 2,546 | 2,061 |
+| \`tour\` | 75,289 | 23,611 | 20,886 | 20,537 | 4,381 | 3,576 |
+| \`tree\` | 91,242 | 29,636 | 24,321 | 12,201 | 3,165 | 2,607 |
+| \`trend\` | 78,338 | 25,747 | 21,284 | 4,205 | 948 | 823 |
+| \`video\` | 158,345 | 48,236 | 40,754 | 52,850 | 11,669 | 10,126 |
+| \`video-playlist\` | 135,495 | 42,650 | 35,778 | 28,847 | 5,972 | 4,969 |
+| \`virtual-list\` | 34,799 | 11,657 | 10,290 | 3,259 | 963 | 747 |
 
 ## What lands in \`node_modules\`
 
@@ -2269,12 +2358,12 @@ column is what was removed rather than part of what remains.
 
 | Package | Unpacked | Files | Source maps stripped | Runtime dependencies |
 |---|---|---|---|---|
-| \`@fusion.dev/helix-core\` | 822,112 | 121 | 181,418 | \`@floating-ui/dom\`, \`@fusion.dev/helix-icons\` |
-| \`@fusion.dev/helix-headless\` | 10,830,525 | 472 | 842,959 | \`@fusion.dev/helix-core\`, \`@fusion.dev/helix-icons\`, \`uqr\` |
+| \`@fusion.dev/helix-core\` | 837,166 | 123 | 184,846 | \`@floating-ui/dom\`, \`@fusion.dev/helix-icons\` |
+| \`@fusion.dev/helix-headless\` | 11,013,589 | 472 | 852,998 | \`@fusion.dev/helix-core\`, \`@fusion.dev/helix-icons\`, \`uqr\` |
 | \`@fusion.dev/helix-icons\` | 65,943 | 11 | 20,928 | none |
 | \`@fusion.dev/helix-styles\` | 101,139 | 6 | 0 | none |
 | \`@fusion.dev/helix-theme\` | 465,413 | 8 | 4,703 | none |
-| \`@fusion.dev/helix\` | 11,811,647 | 798 | 332,803 | \`@fusion.dev/helix-core\`, \`@fusion.dev/helix-headless\`, \`@fusion.dev/helix-styles\` |
+| \`@fusion.dev/helix\` | 11,991,824 | 798 | 336,307 | \`@fusion.dev/helix-core\`, \`@fusion.dev/helix-headless\`, \`@fusion.dev/helix-styles\` |
 
 ## Not measured yet
 
@@ -2654,6 +2743,12 @@ helix-video::part(overflow-header) { … }
 role stands alone: the tooltip inside \`<helix-copy-button>\` is \`tooltip\`, and
 its arrow is \`tooltip-arrow\`.
 
+A part that changes with a state takes a second name while the state holds, and
+that name is forwarded too. A tooltip that landed below its button is also
+\`tooltip-bottom\`, and its arrow \`tooltip-arrow-bottom\`, which is how a sheet out
+here draws by a side it cannot otherwise see. The arrow already faces the button
+whichever side that is; the name is for what you draw on top.
+
 **The prefix is not decoration.** Two levels can agree on a word, and did:
 \`Command\` forwarded the listbox's \`search-field\` under a name it also rendered
 itself, so \`::part(search-field)\` matched two elements at once.