@fusion.dev/helix 0.1.0 → 0.3.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.
Files changed (270) hide show
  1. package/custom-elements.json +256 -256
  2. package/dist/accordion/item/accordion-item.css.js +0 -1
  3. package/dist/accordion/item/accordion-item.js +0 -29
  4. package/dist/accordion/root/accordion-root.css.js +0 -1
  5. package/dist/accordion/root/accordion-root.js +0 -20
  6. package/dist/announcement/root/announcement-root.css.js +0 -1
  7. package/dist/announcement/root/announcement-root.js +0 -16
  8. package/dist/app-header/root/app-header-root.css.js +0 -1
  9. package/dist/app-header/root/app-header-root.js +0 -45
  10. package/dist/aura/root/aura-axis.js +0 -58
  11. package/dist/aura/root/aura-root.css.js +0 -1
  12. package/dist/aura/root/aura-root.js +0 -520
  13. package/dist/aura/root/aura-shader.js +0 -35
  14. package/dist/avatar/group/avatar-group.css.js +0 -1
  15. package/dist/avatar/group/avatar-group.js +0 -24
  16. package/dist/avatar/root/avatar-root.css.js +0 -1
  17. package/dist/avatar/root/avatar-root.js +0 -23
  18. package/dist/badge/root/badge-root.css.js +0 -1
  19. package/dist/badge/root/badge-root.d.ts +2 -6
  20. package/dist/badge/root/badge-root.js +0 -18
  21. package/dist/bar-chart/root/bar-chart-root.css.js +0 -1
  22. package/dist/bar-chart/root/bar-chart-root.js +0 -50
  23. package/dist/blockquote/root/blockquote-root.css.js +0 -1
  24. package/dist/blockquote/root/blockquote-root.js +0 -17
  25. package/dist/breadcrumbs/breadcrumb/breadcrumb.css.js +0 -1
  26. package/dist/breadcrumbs/breadcrumb/breadcrumb.js +0 -28
  27. package/dist/breadcrumbs/root/breadcrumbs-root.css.js +0 -1
  28. package/dist/breadcrumbs/root/breadcrumbs-root.js +0 -19
  29. package/dist/button/root/button-root.css.js +0 -1
  30. package/dist/button/root/button-root.js +0 -38
  31. package/dist/button-group/root/button-group-root.css.js +0 -1
  32. package/dist/button-group/root/button-group-root.js +0 -24
  33. package/dist/callout/root/callout-root.css.js +0 -1
  34. package/dist/callout/root/callout-root.js +0 -26
  35. package/dist/card/root/card-root.css.js +0 -1
  36. package/dist/card/root/card-root.js +0 -45
  37. package/dist/carousel/root/carousel-root.css.js +0 -1
  38. package/dist/carousel/root/carousel-root.js +0 -24
  39. package/dist/chat/composer/chat-composer.css.js +0 -1
  40. package/dist/chat/composer/chat-composer.js +0 -26
  41. package/dist/chat/message/chat-message.css.js +0 -1
  42. package/dist/chat/message/chat-message.js +0 -29
  43. package/dist/chat/root/chat-root.css.js +0 -1
  44. package/dist/chat/root/chat-root.js +0 -38
  45. package/dist/checkbox/root/checkbox-root.css.js +0 -1
  46. package/dist/checkbox/root/checkbox-root.js +0 -26
  47. package/dist/checkbox-group/root/checkbox-group-root.css.js +0 -1
  48. package/dist/checkbox-group/root/checkbox-group-root.js +0 -15
  49. package/dist/code/root/code-root.css.js +0 -1
  50. package/dist/code/root/code-root.js +0 -21
  51. package/dist/code-block/root/code-block-root.css.js +0 -1
  52. package/dist/code-block/root/code-block-root.js +0 -19
  53. package/dist/color-input/root/color-input-root.css.js +0 -1
  54. package/dist/color-input/root/color-input-root.js +0 -42
  55. package/dist/color-picker/root/color-picker-root.css.js +0 -1
  56. package/dist/color-picker/root/color-picker-root.js +0 -42
  57. package/dist/combobox/root/combobox-root.css.js +0 -1
  58. package/dist/combobox/root/combobox-root.js +0 -28
  59. package/dist/command/root/command-root.css.js +0 -1
  60. package/dist/command/root/command-root.js +0 -21
  61. package/dist/copy-button/root/copy-button-root.css.js +0 -1
  62. package/dist/copy-button/root/copy-button-root.js +0 -14
  63. package/dist/data-table/root/data-table-root.css.js +0 -1
  64. package/dist/data-table/root/data-table-root.js +0 -39
  65. package/dist/date-input/root/date-input-root.css.js +0 -1
  66. package/dist/date-input/root/date-input-root.js +0 -38
  67. package/dist/date-picker/root/date-picker-root.css.js +0 -1
  68. package/dist/date-picker/root/date-picker-root.js +0 -28
  69. package/dist/dialog/root/dialog-root.css.js +0 -1
  70. package/dist/dialog/root/dialog-root.js +0 -31
  71. package/dist/divider/root/divider-root.css.js +0 -1
  72. package/dist/divider/root/divider-root.js +0 -24
  73. package/dist/donut-chart/root/donut-chart-root.css.js +0 -1
  74. package/dist/donut-chart/root/donut-chart-root.js +0 -49
  75. package/dist/drawer/root/drawer-root.css.js +0 -1
  76. package/dist/drawer/root/drawer-root.js +0 -38
  77. package/dist/drilldown/item/drilldown-item.css.js +0 -1
  78. package/dist/drilldown/item/drilldown-item.js +0 -15
  79. package/dist/drilldown/root/drilldown-root.css.js +0 -1
  80. package/dist/drilldown/root/drilldown-root.js +0 -23
  81. package/dist/element-events.generated.js +0 -5
  82. package/dist/empty/root/empty-root.css.js +0 -1
  83. package/dist/empty/root/empty-root.js +0 -16
  84. package/dist/file-input/root/file-input-root.css.js +0 -1
  85. package/dist/file-input/root/file-input-root.js +0 -30
  86. package/dist/flex/root/flex-root.css.js +0 -1
  87. package/dist/flex/root/flex-root.js +0 -32
  88. package/dist/format-date/root/format-date-root.css.js +0 -1
  89. package/dist/format-date/root/format-date-root.js +0 -17
  90. package/dist/grid/root/grid-root.css.js +0 -1
  91. package/dist/grid/root/grid-root.js +0 -69
  92. package/dist/heatmap/root/heatmap-root.css.js +0 -1
  93. package/dist/heatmap/root/heatmap-root.d.ts +9 -11
  94. package/dist/heatmap/root/heatmap-root.js +0 -73
  95. package/dist/icon/glyph.css.js +0 -1
  96. package/dist/icon/root/icon-root.css.js +0 -1
  97. package/dist/icon/root/icon-root.js +0 -19
  98. package/dist/icon-button/root/icon-button-root.css.js +0 -1
  99. package/dist/icon-button/root/icon-button-root.js +0 -35
  100. package/dist/image/root/image-root.css.js +0 -1
  101. package/dist/image/root/image-root.js +0 -28
  102. package/dist/index.js +0 -5
  103. package/dist/input/root/input-root.css.js +0 -1
  104. package/dist/input/root/input-root.js +0 -28
  105. package/dist/kbd/root/kbd-root.css.js +0 -1
  106. package/dist/kbd/root/kbd-root.js +0 -20
  107. package/dist/legend/root/legend-root.css.js +0 -1
  108. package/dist/legend/root/legend-root.js +0 -35
  109. package/dist/line-chart/root/line-chart-root.css.js +0 -1
  110. package/dist/line-chart/root/line-chart-root.js +0 -47
  111. package/dist/list/item/list-item.css.js +0 -1
  112. package/dist/list/item/list-item.js +0 -38
  113. package/dist/list/root/list-root.css.js +0 -1
  114. package/dist/list/root/list-root.js +0 -23
  115. package/dist/listbox/root/listbox-root.css.js +0 -1
  116. package/dist/listbox/root/listbox-root.js +0 -22
  117. package/dist/loader/root/loader-root.css.js +0 -1
  118. package/dist/loader/root/loader-root.js +0 -19
  119. package/dist/megamenu/root/megamenu-root.css.js +0 -1
  120. package/dist/megamenu/root/megamenu-root.js +0 -24
  121. package/dist/menu/item/menu-item.css.js +0 -1
  122. package/dist/menu/item/menu-item.js +0 -16
  123. package/dist/menu/root/menu-root.css.js +0 -1
  124. package/dist/menu/root/menu-root.js +0 -26
  125. package/dist/meter/root/meter-root.css.js +0 -1
  126. package/dist/meter/root/meter-root.js +0 -50
  127. package/dist/mixins/mixin-control-surface/mixin-control-surface.js +0 -3
  128. package/dist/navigation/root/navigation-root.css.js +0 -1
  129. package/dist/navigation/root/navigation-root.js +0 -18
  130. package/dist/notifications/notification/notification.css.js +0 -1
  131. package/dist/notifications/notification/notification.js +0 -53
  132. package/dist/notifications/root/notifications-root.css.js +0 -1
  133. package/dist/notifications/root/notifications-root.js +0 -31
  134. package/dist/number-input/root/number-input-root.css.js +0 -1
  135. package/dist/number-input/root/number-input-root.js +0 -31
  136. package/dist/option/group/option-group.css.js +0 -1
  137. package/dist/option/group/option-group.js +0 -13
  138. package/dist/option/root/option-root.css.js +0 -1
  139. package/dist/option/root/option-root.js +0 -20
  140. package/dist/outline/root/outline-root.css.js +0 -1
  141. package/dist/outline/root/outline-root.js +0 -21
  142. package/dist/pagination/root/pagination-root.css.js +0 -1
  143. package/dist/pagination/root/pagination-root.js +0 -49
  144. package/dist/pagination/size/pagination-size.css.js +0 -1
  145. package/dist/pagination/size/pagination-size.js +0 -25
  146. package/dist/pagination/summary/pagination-summary.css.js +0 -1
  147. package/dist/pagination/summary/pagination-summary.js +0 -13
  148. package/dist/pin-input/root/pin-input-root.css.js +0 -1
  149. package/dist/pin-input/root/pin-input-root.js +0 -27
  150. package/dist/popover/root/popover-root.css.js +0 -1
  151. package/dist/popover/root/popover-root.js +0 -30
  152. package/dist/progress/root/progress-root.css.js +0 -1
  153. package/dist/progress/root/progress-root.js +0 -25
  154. package/dist/qr-code/root/qr-code-root.css.js +0 -1
  155. package/dist/qr-code/root/qr-code-root.js +0 -27
  156. package/dist/quote/root/quote-root.css.js +0 -1
  157. package/dist/quote/root/quote-root.js +0 -15
  158. package/dist/radio/group/radio-group.css.js +0 -1
  159. package/dist/radio/group/radio-group.js +0 -16
  160. package/dist/radio/root/radio-root.css.js +0 -1
  161. package/dist/radio/root/radio-root.js +0 -46
  162. package/dist/rating/root/rating-root.css.js +0 -1
  163. package/dist/rating/root/rating-root.js +0 -22
  164. package/dist/sandbox/index.js +0 -14
  165. package/dist/sandbox/preview/sandbox-preview.css.js +0 -1
  166. package/dist/sandbox/preview/sandbox-preview.js +0 -182
  167. package/dist/sandbox/root/sandbox-root.css.js +0 -1
  168. package/dist/sandbox/root/sandbox-root.js +1 -295
  169. package/dist/sandbox/source/sandbox-source.css.js +0 -1
  170. package/dist/sandbox/source/sandbox-source.js +0 -77
  171. package/dist/sandbox/status-bar/sandbox-status-bar.css.js +0 -1
  172. package/dist/sandbox/status-bar/sandbox-status-bar.js +0 -38
  173. package/dist/sandbox/terminal/sandbox-terminal.css.js +0 -1
  174. package/dist/sandbox/terminal/sandbox-terminal.js +0 -54
  175. package/dist/sandbox/toolbar/sandbox-toolbar.css.js +0 -1
  176. package/dist/sandbox/toolbar/sandbox-toolbar.js +0 -29
  177. package/dist/scroll-area/root/scroll-area-root.css.js +0 -1
  178. package/dist/scroll-area/root/scroll-area-root.js +0 -24
  179. package/dist/select/root/select-root.css.js +0 -1
  180. package/dist/select/root/select-root.js +0 -33
  181. package/dist/shared/chart/series.css.js +0 -1
  182. package/dist/shared/chart/terminus.css.js +0 -1
  183. package/dist/shared/field/field-inline.css.js +0 -1
  184. package/dist/shared/field/field-stacked.css.js +0 -1
  185. package/dist/shared/field/field.css.js +0 -1
  186. package/dist/skeleton/root/skeleton-root.css.js +0 -1
  187. package/dist/skeleton/root/skeleton-root.js +0 -18
  188. package/dist/slider/root/slider-root.css.js +0 -1
  189. package/dist/slider/root/slider-root.js +0 -32
  190. package/dist/sparkline/root/sparkline-root.css.js +0 -1
  191. package/dist/sparkline/root/sparkline-root.js +0 -40
  192. package/dist/speed-dial/item/speed-dial-item.css.js +0 -1
  193. package/dist/speed-dial/item/speed-dial-item.js +0 -16
  194. package/dist/speed-dial/root/speed-dial-root.css.js +0 -1
  195. package/dist/speed-dial/root/speed-dial-root.js +0 -16
  196. package/dist/splitter/root/splitter-root.css.js +0 -1
  197. package/dist/splitter/root/splitter-root.js +0 -50
  198. package/dist/stat/group/stat-group.css.js +0 -1
  199. package/dist/stat/group/stat-group.js +0 -19
  200. package/dist/stat/root/stat-root.css.js +0 -1
  201. package/dist/stat/root/stat-root.js +0 -17
  202. package/dist/steps/root/steps-root.css.js +0 -1
  203. package/dist/steps/root/steps-root.js +0 -26
  204. package/dist/steps/step/step.css.js +0 -1
  205. package/dist/steps/step/step.js +0 -12
  206. package/dist/switch/root/switch-root.css.js +0 -1
  207. package/dist/switch/root/switch-root.js +0 -32
  208. package/dist/table/cell/table-cell.css.js +0 -1
  209. package/dist/table/cell/table-cell.js +0 -14
  210. package/dist/table/column/table-column.css.js +0 -1
  211. package/dist/table/column/table-column.js +0 -13
  212. package/dist/table/root/table-root.css.js +0 -1
  213. package/dist/table/root/table-root.js +0 -19
  214. package/dist/table/row/table-row.css.js +0 -1
  215. package/dist/table/row/table-row.js +0 -14
  216. package/dist/tabs/panel/tab-panel.css.js +0 -1
  217. package/dist/tabs/panel/tab-panel.js +0 -16
  218. package/dist/tabs/root/tabs-root.css.js +0 -1
  219. package/dist/tabs/root/tabs-root.js +0 -19
  220. package/dist/tabs/tab/tab.css.js +0 -1
  221. package/dist/tabs/tab/tab.js +0 -16
  222. package/dist/tag/root/tag-root.css.js +0 -1
  223. package/dist/tag/root/tag-root.js +0 -25
  224. package/dist/text/root/text-root.css.js +0 -1
  225. package/dist/text/root/text-root.js +0 -48
  226. package/dist/textarea/root/textarea-root.css.js +0 -1
  227. package/dist/textarea/root/textarea-root.js +0 -17
  228. package/dist/time-input/root/time-input-root.css.js +0 -1
  229. package/dist/time-input/root/time-input-root.js +0 -31
  230. package/dist/time-picker/root/time-picker-root.css.js +0 -1
  231. package/dist/time-picker/root/time-picker-root.js +0 -29
  232. package/dist/timeline/item/timeline-item.css.js +0 -1
  233. package/dist/timeline/item/timeline-item.js +0 -17
  234. package/dist/timeline/root/timeline-root.css.js +0 -1
  235. package/dist/timeline/root/timeline-root.js +0 -15
  236. package/dist/toast/item/toast-item.css.js +0 -1
  237. package/dist/toast/item/toast-item.js +0 -21
  238. package/dist/toast/root/toast-root.css.js +0 -1
  239. package/dist/toast/root/toast-root.js +0 -27
  240. package/dist/toggle/group/toggle-group.css.js +0 -1
  241. package/dist/toggle/group/toggle-group.js +0 -25
  242. package/dist/toggle/root/toggle-root.css.js +0 -1
  243. package/dist/toggle/root/toggle-root.js +0 -18
  244. package/dist/toolbar/root/toolbar-root.css.js +0 -1
  245. package/dist/toolbar/root/toolbar-root.js +0 -19
  246. package/dist/tooltip/root/tooltip-root.css.js +0 -1
  247. package/dist/tooltip/root/tooltip-root.js +0 -22
  248. package/dist/tour/root/tour-root.css.js +0 -1
  249. package/dist/tour/root/tour-root.js +0 -14
  250. package/dist/tour/stop/tour-stop.css.js +0 -1
  251. package/dist/tour/stop/tour-stop.js +0 -22
  252. package/dist/tree/item/tree-item.css.js +0 -1
  253. package/dist/tree/item/tree-item.js +0 -34
  254. package/dist/tree/root/tree-root.css.js +0 -1
  255. package/dist/tree/root/tree-root.js +0 -27
  256. package/dist/trend/root/trend-root.css.js +0 -1
  257. package/dist/trend/root/trend-root.js +0 -34
  258. package/dist/video/root/video-root.css.js +0 -1
  259. package/dist/video/root/video-root.js +0 -37
  260. package/dist/video-playlist/item/video-playlist-item.css.js +0 -1
  261. package/dist/video-playlist/item/video-playlist-item.js +0 -15
  262. package/dist/video-playlist/menu/video-playlist-menu.css.js +0 -1
  263. package/dist/video-playlist/menu/video-playlist-menu.js +0 -36
  264. package/dist/video-playlist/root/video-playlist-root.css.js +0 -1
  265. package/dist/video-playlist/root/video-playlist-root.js +0 -16
  266. package/dist/virtual-list/root/virtual-list-root.css.js +0 -1
  267. package/dist/virtual-list/root/virtual-list-root.js +0 -21
  268. package/jsx.d.ts +1538 -2818
  269. package/package.json +7 -7
  270. package/vue.d.ts +3 -7
@@ -9,38 +9,6 @@ import { HelixHeadlessSwitch } from '@fusion.dev/helix-headless/switch';
9
9
  import { styles as fieldStyles } from '../../shared/field/field.css.js';
10
10
  import { styles as fieldInlineStyles } from '../../shared/field/field-inline.css.js';
11
11
  import { styles } from './switch-root.css.js';
12
- /**
13
- * @summary A control that turns something on or off.
14
- *
15
- * @description
16
- * A thumb traveling in a groove, which is the one place in the library color
17
- * is used to say "on". A checkbox does not, because a tick is legible on its
18
- * own; a switch has no mark, so the fill is the whole of what distinguishes the
19
- * two states and there is nothing else for it to be.
20
- *
21
- * The input itself is the hit target and is drawn as the track, stretched over
22
- * it and invisible, so the press, the focus and the label forwarding are all
23
- * the platform's while the picture is ours.
24
- *
25
- * **Its height is `--helix-size-switch`, which is one step above the
26
- * checkbox's** at every density rather than the same as it. A checkbox is a box
27
- * with a mark in it; a switch is a track with a thumb inside it, and at the
28
- * checkbox's height the thumb has two pixels of groove around it and the whole
29
- * control reads as a small dash. The width follows the height, so setting
30
- * `--switch-block-size` widens it too and the proportion is not something a
31
- * consumer has to keep.
32
- *
33
- * @since 0.1.0
34
- * @status stable
35
- * @category forms
36
- * @aliases Toggle switch, On/off
37
- * @documentation https://helix.fusion.dev/components/switch
38
- *
39
- * @cssproperty --switch-block-size - Height of the track. The width follows it.
40
- * @cssproperty --switch-inline-size - Length of the track, if not the derived one.
41
- * @cssproperty --switch-on-color - Fill when it is on.
42
- * @cssproperty --switch-thumb-color - The handle, in both states.
43
- */
44
12
  let HelixSwitch = class HelixSwitch extends HelixHeadlessSwitch {
45
13
  static { this.styles = [fieldStyles, fieldInlineStyles, styles]; }
46
14
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/table/cell/table-cell.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
 
@@ -7,20 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTableCell } from '@fusion.dev/helix-headless/table';
9
9
  import { styles } from './table-cell.css.js';
10
- /**
11
- * @summary One cell of a table.
12
- *
13
- * @description
14
- * Hairline rules between rows and no fill, per the rule that depth comes from a
15
- * single border rather than from elevation. A dense table earns its density by
16
- * decorating none of it.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @documentation https://helix.fusion.dev/components/table
21
- *
22
- * @slot - The cell's content.
23
- */
24
10
  let HelixTableCell = class HelixTableCell extends HelixHeadlessTableCell {
25
11
  static { this.styles = styles; }
26
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/table/column/table-column.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: contents;
@@ -7,19 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTableColumn } from '@fusion.dev/helix-headless/table';
9
9
  import { styles } from './table-column.css.js';
10
- /**
11
- * @summary One column of a table: its heading, and how wide it is.
12
- *
13
- * @description
14
- * Styled as the header cell it is, and it carries the same rule and inset as
15
- * the cells beneath it so the heading and its column read as one line down the
16
- * table.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @aliases Column header, Th
21
- * @documentation https://helix.fusion.dev/components/table
22
- */
23
10
  let HelixTableColumn = class HelixTableColumn extends HelixHeadlessTableColumn {
24
11
  static { this.styles = styles; }
25
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/table/root/table-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: block;
@@ -7,25 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTable } from '@fusion.dev/helix-headless/table';
9
9
  import { styles } from './table-root.css.js';
10
- /**
11
- * @summary Tabular data laid out on a grid.
12
- *
13
- * @description
14
- * Hairline rules between rows and no fill, per the rule that depth comes from a
15
- * single border rather than from elevation. A dense table earns its density by
16
- * decorating none of it.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @category data
21
- * @documentation https://helix.fusion.dev/components/table
22
- *
23
- * @slot - The table's rows.
24
- *
25
- * @csspart table - The grid.
26
- *
27
- * @cssproperty --table-columns - Track list for the columns.
28
- */
29
10
  let HelixTable = class HelixTable extends HelixHeadlessTable {
30
11
  static { this.styles = styles; }
31
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/table/row/table-row.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: contents;
@@ -7,20 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTableRow } from '@fusion.dev/helix-headless/table';
9
9
  import { styles } from './table-row.css.js';
10
- /**
11
- * @summary One row of a table.
12
- *
13
- * @description
14
- * Hairline rules between rows and no fill, per the rule that depth comes from a
15
- * single border rather than from elevation. A dense table earns its density by
16
- * decorating none of it.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @documentation https://helix.fusion.dev/components/table
21
- *
22
- * @slot - The row's cells.
23
- */
24
10
  let HelixTableRow = class HelixTableRow extends HelixHeadlessTableRow {
25
11
  static { this.styles = styles; }
26
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/tabs/panel/tab-panel.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
 
@@ -7,22 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTabPanel } from '@fusion.dev/helix-headless/tabs';
9
9
  import { styles } from './tab-panel.css.js';
10
- /**
11
- * @summary The content shown for one tab.
12
- *
13
- * @description
14
- * Selection is marked with a rule under the active tab rather than a filled
15
- * pill, which keeps the row flat and lets the underline animate between tabs as
16
- * a movement instead of two separate fills.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @documentation https://helix.fusion.dev/components/tabs
21
- *
22
- * @slot - The panel's content.
23
- *
24
- * @csspart panel - The panel container.
25
- */
26
10
  let HelixTabPanel = class HelixTabPanel extends HelixHeadlessTabPanel {
27
11
  static { this.styles = styles; }
28
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/tabs/root/tabs-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
 
@@ -7,25 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTabs } from '@fusion.dev/helix-headless/tabs';
9
9
  import { styles } from './tabs-root.css.js';
10
- /**
11
- * @summary A row of tabs and the panel each one shows.
12
- *
13
- * @description
14
- * Selection is marked with a rule under the active tab rather than a filled
15
- * pill, which keeps the row flat and lets the underline animate between tabs as
16
- * a movement instead of two separate fills.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @category navigation
21
- * @documentation https://helix.fusion.dev/components/tabs
22
- *
23
- * @slot - The tabs.
24
- * @slot panels - The panels.
25
- *
26
- * @csspart panels - The panel container.
27
- * @csspart tabs - The tab list.
28
- */
29
10
  let HelixTabs = class HelixTabs extends HelixHeadlessTabs {
30
11
  static { this.styles = styles; }
31
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/tabs/tab/tab.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: inline-flex;
@@ -7,22 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTab } from '@fusion.dev/helix-headless/tabs';
9
9
  import { styles } from './tab.css.js';
10
- /**
11
- * @summary One tab in a tab list.
12
- *
13
- * @description
14
- * Selection is marked with a rule under the active tab rather than a filled
15
- * pill, which keeps the row flat and lets the underline animate between tabs as
16
- * a movement instead of two separate fills.
17
- *
18
- * @since 0.1.0
19
- * @status experimental
20
- * @documentation https://helix.fusion.dev/components/tabs
21
- *
22
- * @slot - The tab's label.
23
- *
24
- * @csspart tab - The tab itself.
25
- */
26
10
  let HelixTab = class HelixTab extends HelixHeadlessTab {
27
11
  static { this.styles = styles; }
28
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/tag/root/tag-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  align-items: center;
@@ -8,31 +8,6 @@ import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTag } from '@fusion.dev/helix-headless/tag';
9
9
  import { property } from 'lit/decorators.js';
10
10
  import { styles } from './tag-root.css.js';
11
- /**
12
- * @summary Labels content with a short piece of metadata.
13
- *
14
- * @description
15
- * Seven tones. The fill is a tint of the status color, mixed with
16
- * `color-mix` rather than held as a token per status, so a theme that changes
17
- * the status colors gets the tints with them.
18
- *
19
- * @since 0.1.0
20
- * @status stable
21
- * @category markers
22
- * @aliases Chip, Pill, Label
23
- * @documentation https://helix.fusion.dev/components/tag
24
- *
25
- * @slot - The tag's label.
26
- *
27
- * @event {HelixDismissEvent} helix-dismiss - Fired when the reader asks to remove the tag. Cancelable: refusing it takes the decision and nothing moves.
28
- *
29
- * @csspart dismiss - The remove button, when `dismissible`.
30
- *
31
- * @cssproperty --tag-background-color - Fill behind the tag.
32
- * @cssproperty --tag-border-color - Color of the edge, for a chip that separates by fill alone.
33
- * @cssproperty --tag-foreground-color - Label color.
34
- * @cssproperty --tag-radius - Corner radius of the tag.
35
- */
36
11
  let HelixTag = class HelixTag extends HelixHeadlessTag {
37
12
  static { this.styles = styles; }
38
13
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/text/root/text-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: inline;
@@ -8,7 +8,6 @@ import { customElement, HelixElement } from '@fusion.dev/helix-core';
8
8
  import { property } from 'lit/decorators.js';
9
9
  import { literal, html as staticHtml } from 'lit/static-html.js';
10
10
  import { styles } from './text-root.css.js';
11
- /** Tags this may render. Static values, so they can be interpolated as a tag. */
12
11
  const TAGS = {
13
12
  code: literal `code`,
14
13
  em: literal `em`,
@@ -23,55 +22,8 @@ const TAGS = {
23
22
  span: literal `span`,
24
23
  strong: literal `strong`,
25
24
  };
26
- /**
27
- * @summary A run of text, with the element and the look chosen separately.
28
- *
29
- * @description
30
- * Two properties, and they answer different questions. `as` is the element,
31
- * which decides the document outline and what a screen reader announces.
32
- * `variant` is the ramp, which decides size, weight, leading, and tracking
33
- * together.
34
- *
35
- * They are separate because they genuinely come apart: a section's second
36
- * heading sometimes has to look smaller without lying about the outline, and a
37
- * `<p>` sometimes has to read as a caption. They default to matching, so the
38
- * common case is `as="h2"` and nothing else.
39
- *
40
- * The pairing is resolved in CSS rather than by computing an attribute, so the
41
- * element writes nothing to its own host: `as="h2"` picks up the heading ramp
42
- * through a selector, and setting `variant` takes the pairing rule out of play.
43
- * Deriving it in `willUpdate` works and must not be done: it puts an attribute
44
- * on the host that the server's markup does not have, which is a hydration
45
- * mismatch in every React consumer.
46
- *
47
- * **Size, weight, and leading are not properties.** Exposing them separately
48
- * offers a few hundred combinations of which a handful are right, and every
49
- * caller then picks one. A ramp is a decision the system already made:
50
- * the ramp is named, and a page built from it is consistent because there was
51
- * nothing else to choose.
52
- *
53
- * `tone` stays separate, because color carries state rather than typography.
54
- * Folding it in would mean `caption-danger` and `label-primary` and the rest of
55
- * cross product, which is the explosion a named ramp exists to prevent.
56
- *
57
- * @since 0.1.0
58
- * @status experimental
59
- * @category typography
60
- * @aliases Paragraph, Copy, Label, Caption, Heading, Title
61
- * @documentation https://helix.fusion.dev/components/text
62
- *
63
- * @slot - The text.
64
- *
65
- * @csspart text - The rendered element.
66
- */
67
25
  let HelixText = class HelixText extends HelixElement {
68
26
  render() {
69
- /* `Object.hasOwn`, not a truthy index.
70
- *
71
- * `TAGS[this.as]` reaches `Object.prototype`, so `as="constructor"` and
72
- * every other inherited key came back truthy and were passed to
73
- * `staticHtml` as a tag: the result is a lit marker rendered as an element
74
- * name, not the span fallback and not a throw. Own keys only. */
75
27
  const tag = (this.as && Object.hasOwn(TAGS, this.as) ? TAGS[this.as] : undefined) ?? literal `span`;
76
28
  return staticHtml `<${tag} part="text"><slot></slot></${tag}>`;
77
29
  }
@@ -1,4 +1,3 @@
1
- // Generated from src/textarea/root/textarea-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: flex;
@@ -9,23 +9,6 @@ import { HelixHeadlessTextarea } from '@fusion.dev/helix-headless/textarea';
9
9
  import { styles as fieldStyles } from '../../shared/field/field.css.js';
10
10
  import { styles as fieldStackedStyles } from '../../shared/field/field-stacked.css.js';
11
11
  import { styles } from './textarea-root.css.js';
12
- /**
13
- * @summary Several lines of text a reader types into.
14
- *
15
- * @description
16
- * The same frame an `Input` wears, so a form of mixed fields reads as one set
17
- * rather than as two kinds of box. What differs is the resize handle, which is
18
- * the platform's and is left alone on the block axis only: a field that can be
19
- * dragged wider than the form holding it is a field that breaks the layout.
20
- *
21
- * @since 0.1.0
22
- * @status stable
23
- * @category forms
24
- * @aliases Multiline, TextArea
25
- * @documentation https://helix.fusion.dev/components/textarea
26
- *
27
- * @cssproperty --textarea-background-color - Fill behind the text.
28
- */
29
12
  let HelixTextarea = class HelixTextarea extends HelixHeadlessTextarea {
30
13
  static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }
31
14
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/time-input/root/time-input-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: block;
@@ -6,43 +6,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTimeInput } from '@fusion.dev/helix-headless/time-input';
9
- /* Side-effect imports, because the tier below renders both of these and a custom
10
- element registers on import. Inherited from the base along with the template,
11
- which is why they are restated here. */
12
9
  import '../../icon/index.js';
13
10
  import '../../tag/index.js';
14
11
  import '../../time-picker/index.js';
15
12
  import { styles as fieldStyles } from '../../shared/field/field.css.js';
16
13
  import { styles as fieldStackedStyles } from '../../shared/field/field-stacked.css.js';
17
14
  import { styles } from './time-input-root.css.js';
18
- /**
19
- * @summary A time, typed or picked from a list.
20
- *
21
- * @description
22
- * The frame is the field rather than the input, so the trigger sits inside the
23
- * same box as the text and the focus ring is drawn once around the whole
24
- * control. The trigger is a mark within that box rather than a button beside it,
25
- * the arrangement Date Input settled on.
26
- *
27
- * The panel is the field's width, which is the one place this differs from Input
28
- * Date: a calendar is seven columns with a width of its own, and a list of times
29
- * is a column of one line each, so it should be as wide as the control it
30
- * belongs to. That is the same reasoning Select gives for its own list.
31
- *
32
- * @since 0.1.0
33
- * @status experimental
34
- * @category forms
35
- * @aliases TimeField, InputTime
36
- * @documentation https://helix.fusion.dev/components/time-input
37
- *
38
- * @cssproperty --time-input-background-color - Fill behind the field.
39
- * @cssproperty --time-input-border-color - Color of the panel's edge.
40
- * @cssproperty --time-input-border-width - Width of the panel's edge. Follows
41
- * `--helix-border-floating`, which is `0`, so the panel is told apart by its lift unless a
42
- * theme says otherwise.
43
- * @cssproperty --time-input-shadow - Lift under the panel. Follows `--helix-shadow-floating`:
44
- * a floating surface sits over content nobody can predict, so it keeps a lift by default.
45
- */
46
15
  let HelixTimeInput = class HelixTimeInput extends HelixHeadlessTimeInput {
47
16
  static { this.tier = 'helix-'; }
48
17
  static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }
@@ -1,4 +1,3 @@
1
- // Generated from src/time-picker/root/time-picker-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: block;
@@ -6,38 +6,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTimePicker } from '@fusion.dev/helix-headless/time-picker';
9
- /* Side-effect imports, because the tier below renders both of these and a custom
10
- element registers on import. Inherited from the base along with the template,
11
- which is why they are restated here: this file has neither tag in it to remind
12
- anyone. */
13
9
  import '../../listbox/index.js';
14
10
  import '../../option/index.js';
15
11
  import { styles } from './time-picker-root.css.js';
16
- /**
17
- * @summary Picks a time, from a list of them.
18
- *
19
- * @description
20
- * A bounded list on a surface of its own, because ninety-six rows is taller than
21
- * anywhere it will be put. `--time-picker-list-block-size` is the bound and it is a height
22
- * rather than a count of rows: what a panel has is room, and a row count would
23
- * have to be recomputed every time the density changed.
24
- *
25
- * No border and no fill of its own. Flat on a page it takes what it is given,
26
- * and in Time Input's panel the panel supplies both: a list that brought its own
27
- * card would be a card inside a card there.
28
- *
29
- * @since 0.1.0
30
- * @status experimental
31
- * @category forms
32
- * @aliases Time, TimeList
33
- * @documentation https://helix.fusion.dev/components/time-picker
34
- *
35
- * @cssproperty --time-picker-list-block-size - How tall the list is before it scrolls.
36
- * @cssproperty --time-picker-range-color - Wash behind the times inside a range.
37
- * @cssproperty --time-picker-row-size - Height and least width of one row in a wheel.
38
- * @cssproperty --time-picker-selected-color - Fill on the chosen row of a wheel.
39
- * @cssproperty --time-picker-wheel-block-size - How tall a wheel is. Five rows by default.
40
- */
41
12
  let HelixTimePicker = class HelixTimePicker extends HelixHeadlessTimePicker {
42
13
  static { this.tier = 'helix-'; }
43
14
  static { this.styles = styles; }
@@ -1,4 +1,3 @@
1
- // Generated from src/timeline/item/timeline-item.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  column-gap: var(--helix-space-md);
@@ -7,23 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTimelineItem } from '@fusion.dev/helix-headless/timeline';
9
9
  import { styles } from './timeline-item.css.js';
10
- /**
11
- * @summary One event on a timeline: when it happened, and what it was.
12
- *
13
- * @description
14
- * Presentation only: the rail down the side, the mark on it, and the line that
15
- * arrives at this entry from the one before.
16
- *
17
- * @since 0.1.0
18
- * @status stable
19
- * @category data
20
- * @aliases Activity item, History entry, Event
21
- * @documentation https://helix.fusion.dev/components/timeline
22
- *
23
- * @cssproperty --timeline-marker-radius - How round the mark is. Zero is a square, and half its size is a disc.
24
- * @cssproperty --timeline-marker-size - Edge length of the mark.
25
- * @cssproperty --timeline-rail-size - Width of the line.
26
- */
27
10
  let HelixTimelineItem = class HelixTimelineItem extends HelixHeadlessTimelineItem {
28
11
  static { this.styles = styles; }
29
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/timeline/root/timeline-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: flex;
@@ -7,21 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessTimeline } from '@fusion.dev/helix-headless/timeline';
9
9
  import { styles } from './timeline-root.css.js';
10
- /**
11
- * @summary A record of what happened, in the order it happened.
12
- *
13
- * @description
14
- * Presentation only: the direction time runs in, and the spacing between one
15
- * event and the next. Every entry draws its own mark and its own line.
16
- *
17
- * @since 0.1.0
18
- * @status stable
19
- * @category data
20
- * @aliases Activity feed, History, Changelog, Audit trail
21
- * @documentation https://helix.fusion.dev/components/timeline
22
- *
23
- * @cssproperty --timeline-gap - Space between one entry and the next.
24
- */
25
10
  let HelixTimeline = class HelixTimeline extends HelixHeadlessTimeline {
26
11
  static { this.styles = styles; }
27
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/toast/item/toast-item.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
 
@@ -7,27 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessToastItem } from '@fusion.dev/helix-headless/toast';
9
9
  import { styles } from './toast-item.css.js';
10
- /**
11
- * @summary One message in the toast region.
12
- *
13
- * @description
14
- * A surface with a shadow, because a toast sits over whatever the reader was
15
- * looking at rather than in it. The severity is a bar down the leading edge and
16
- * not a fill: a message is text to be read, and a colored panel behind it
17
- * costs contrast for something the mark already says.
18
- *
19
- * @since 0.1.0
20
- * @status experimental
21
- * @documentation https://helix.fusion.dev/components/toast
22
- *
23
- * @cssproperty --toast-border-color - Color of the panel's edge.
24
- * @cssproperty --toast-border-width - Width of the panel's edge. Follows
25
- * `--helix-border-floating`, which is `0`, so the panel is told apart by its lift unless a
26
- * theme says otherwise.
27
- * @cssproperty --toast-item-padding - Space between the message's edge and its contents.
28
- * @cssproperty --toast-shadow - Lift under the panel. Follows `--helix-shadow-floating`: a
29
- * floating surface sits over content nobody can predict, so it keeps a lift by default.
30
- */
31
10
  let HelixToastItem = class HelixToastItem extends HelixHeadlessToastItem {
32
11
  static { this.styles = styles; }
33
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/toast/root/toast-root.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  --_toast-inset: var(--toast-inset, var(--helix-space-lg));
@@ -7,33 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
7
7
  import { customElement } from '@fusion.dev/helix-core';
8
8
  import { HelixHeadlessToast } from '@fusion.dev/helix-headless/toast';
9
9
  import { styles } from './toast-root.css.js';
10
- /**
11
- * @summary The region messages arrive in, and the only thing that announces them.
12
- *
13
- * @description
14
- * Fixed to the window, and it catches nothing: the region spans a whole edge,
15
- * so a stack of one message in a corner would otherwise put an invisible bar
16
- * across everything beside it. The region is transparent to a pointer and the
17
- * messages take it back.
18
- *
19
- * **It belongs at the root of the application.** `position: fixed` is
20
- * positioned against the viewport only while no ancestor carries `transform`,
21
- * `filter`, `perspective` or `contain`, any of which makes that ancestor the
22
- * containing block instead, and it is still clipped by an ancestor with
23
- * `overflow: hidden`. That is a real constraint rather than a style note, and
24
- * it is the same fact that put every other floating surface in this library
25
- * into the top layer.
26
- *
27
- * @since 0.1.0
28
- * @status experimental
29
- * @category overlays
30
- * @aliases Toaster, Snackbar, Notifications
31
- * @documentation https://helix.fusion.dev/components/toast
32
- *
33
- * @cssproperty --toast-gap - Space between one message and the next.
34
- * @cssproperty --toast-inline-size - Width of a message.
35
- * @cssproperty --toast-inset - Distance from the edges of the window.
36
- */
37
10
  let HelixToast = class HelixToast extends HelixHeadlessToast {
38
11
  static { this.styles = styles; }
39
12
  };
@@ -1,4 +1,3 @@
1
- // Generated from src/toggle/group/toggle-group.css by `turbo run styles`. Do not edit.
2
1
  import { createSheet } from '@fusion.dev/helix-core';
3
2
  export const styles = createSheet(`:host {
4
3
  display: inline-flex;