@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.
- package/custom-elements.json +256 -256
- package/dist/accordion/item/accordion-item.css.js +0 -1
- package/dist/accordion/item/accordion-item.js +0 -29
- package/dist/accordion/root/accordion-root.css.js +0 -1
- package/dist/accordion/root/accordion-root.js +0 -20
- package/dist/announcement/root/announcement-root.css.js +0 -1
- package/dist/announcement/root/announcement-root.js +0 -16
- package/dist/app-header/root/app-header-root.css.js +0 -1
- package/dist/app-header/root/app-header-root.js +0 -45
- package/dist/aura/root/aura-axis.js +0 -58
- package/dist/aura/root/aura-root.css.js +0 -1
- package/dist/aura/root/aura-root.js +0 -520
- package/dist/aura/root/aura-shader.js +0 -35
- package/dist/avatar/group/avatar-group.css.js +0 -1
- package/dist/avatar/group/avatar-group.js +0 -24
- package/dist/avatar/root/avatar-root.css.js +0 -1
- package/dist/avatar/root/avatar-root.js +0 -23
- package/dist/badge/root/badge-root.css.js +0 -1
- package/dist/badge/root/badge-root.d.ts +2 -6
- package/dist/badge/root/badge-root.js +0 -18
- package/dist/bar-chart/root/bar-chart-root.css.js +0 -1
- package/dist/bar-chart/root/bar-chart-root.js +0 -50
- package/dist/blockquote/root/blockquote-root.css.js +0 -1
- package/dist/blockquote/root/blockquote-root.js +0 -17
- package/dist/breadcrumbs/breadcrumb/breadcrumb.css.js +0 -1
- package/dist/breadcrumbs/breadcrumb/breadcrumb.js +0 -28
- package/dist/breadcrumbs/root/breadcrumbs-root.css.js +0 -1
- package/dist/breadcrumbs/root/breadcrumbs-root.js +0 -19
- package/dist/button/root/button-root.css.js +0 -1
- package/dist/button/root/button-root.js +0 -38
- package/dist/button-group/root/button-group-root.css.js +0 -1
- package/dist/button-group/root/button-group-root.js +0 -24
- package/dist/callout/root/callout-root.css.js +0 -1
- package/dist/callout/root/callout-root.js +0 -26
- package/dist/card/root/card-root.css.js +0 -1
- package/dist/card/root/card-root.js +0 -45
- package/dist/carousel/root/carousel-root.css.js +0 -1
- package/dist/carousel/root/carousel-root.js +0 -24
- package/dist/chat/composer/chat-composer.css.js +0 -1
- package/dist/chat/composer/chat-composer.js +0 -26
- package/dist/chat/message/chat-message.css.js +0 -1
- package/dist/chat/message/chat-message.js +0 -29
- package/dist/chat/root/chat-root.css.js +0 -1
- package/dist/chat/root/chat-root.js +0 -38
- package/dist/checkbox/root/checkbox-root.css.js +0 -1
- package/dist/checkbox/root/checkbox-root.js +0 -26
- package/dist/checkbox-group/root/checkbox-group-root.css.js +0 -1
- package/dist/checkbox-group/root/checkbox-group-root.js +0 -15
- package/dist/code/root/code-root.css.js +0 -1
- package/dist/code/root/code-root.js +0 -21
- package/dist/code-block/root/code-block-root.css.js +0 -1
- package/dist/code-block/root/code-block-root.js +0 -19
- package/dist/color-input/root/color-input-root.css.js +0 -1
- package/dist/color-input/root/color-input-root.js +0 -42
- package/dist/color-picker/root/color-picker-root.css.js +0 -1
- package/dist/color-picker/root/color-picker-root.js +0 -42
- package/dist/combobox/root/combobox-root.css.js +0 -1
- package/dist/combobox/root/combobox-root.js +0 -28
- package/dist/command/root/command-root.css.js +0 -1
- package/dist/command/root/command-root.js +0 -21
- package/dist/copy-button/root/copy-button-root.css.js +0 -1
- package/dist/copy-button/root/copy-button-root.js +0 -14
- package/dist/data-table/root/data-table-root.css.js +0 -1
- package/dist/data-table/root/data-table-root.js +0 -39
- package/dist/date-input/root/date-input-root.css.js +0 -1
- package/dist/date-input/root/date-input-root.js +0 -38
- package/dist/date-picker/root/date-picker-root.css.js +0 -1
- package/dist/date-picker/root/date-picker-root.js +0 -28
- package/dist/dialog/root/dialog-root.css.js +0 -1
- package/dist/dialog/root/dialog-root.js +0 -31
- package/dist/divider/root/divider-root.css.js +0 -1
- package/dist/divider/root/divider-root.js +0 -24
- package/dist/donut-chart/root/donut-chart-root.css.js +0 -1
- package/dist/donut-chart/root/donut-chart-root.js +0 -49
- package/dist/drawer/root/drawer-root.css.js +0 -1
- package/dist/drawer/root/drawer-root.js +0 -38
- package/dist/drilldown/item/drilldown-item.css.js +0 -1
- package/dist/drilldown/item/drilldown-item.js +0 -15
- package/dist/drilldown/root/drilldown-root.css.js +0 -1
- package/dist/drilldown/root/drilldown-root.js +0 -23
- package/dist/element-events.generated.js +0 -5
- package/dist/empty/root/empty-root.css.js +0 -1
- package/dist/empty/root/empty-root.js +0 -16
- package/dist/file-input/root/file-input-root.css.js +0 -1
- package/dist/file-input/root/file-input-root.js +0 -30
- package/dist/flex/root/flex-root.css.js +0 -1
- package/dist/flex/root/flex-root.js +0 -32
- package/dist/format-date/root/format-date-root.css.js +0 -1
- package/dist/format-date/root/format-date-root.js +0 -17
- package/dist/grid/root/grid-root.css.js +0 -1
- package/dist/grid/root/grid-root.js +0 -69
- package/dist/heatmap/root/heatmap-root.css.js +0 -1
- package/dist/heatmap/root/heatmap-root.d.ts +9 -11
- package/dist/heatmap/root/heatmap-root.js +0 -73
- package/dist/icon/glyph.css.js +0 -1
- package/dist/icon/root/icon-root.css.js +0 -1
- package/dist/icon/root/icon-root.js +0 -19
- package/dist/icon-button/root/icon-button-root.css.js +0 -1
- package/dist/icon-button/root/icon-button-root.js +0 -35
- package/dist/image/root/image-root.css.js +0 -1
- package/dist/image/root/image-root.js +0 -28
- package/dist/index.js +0 -5
- package/dist/input/root/input-root.css.js +0 -1
- package/dist/input/root/input-root.js +0 -28
- package/dist/kbd/root/kbd-root.css.js +0 -1
- package/dist/kbd/root/kbd-root.js +0 -20
- package/dist/legend/root/legend-root.css.js +0 -1
- package/dist/legend/root/legend-root.js +0 -35
- package/dist/line-chart/root/line-chart-root.css.js +0 -1
- package/dist/line-chart/root/line-chart-root.js +0 -47
- package/dist/list/item/list-item.css.js +0 -1
- package/dist/list/item/list-item.js +0 -38
- package/dist/list/root/list-root.css.js +0 -1
- package/dist/list/root/list-root.js +0 -23
- package/dist/listbox/root/listbox-root.css.js +0 -1
- package/dist/listbox/root/listbox-root.js +0 -22
- package/dist/loader/root/loader-root.css.js +0 -1
- package/dist/loader/root/loader-root.js +0 -19
- package/dist/megamenu/root/megamenu-root.css.js +0 -1
- package/dist/megamenu/root/megamenu-root.js +0 -24
- package/dist/menu/item/menu-item.css.js +0 -1
- package/dist/menu/item/menu-item.js +0 -16
- package/dist/menu/root/menu-root.css.js +0 -1
- package/dist/menu/root/menu-root.js +0 -26
- package/dist/meter/root/meter-root.css.js +0 -1
- package/dist/meter/root/meter-root.js +0 -50
- package/dist/mixins/mixin-control-surface/mixin-control-surface.js +0 -3
- package/dist/navigation/root/navigation-root.css.js +0 -1
- package/dist/navigation/root/navigation-root.js +0 -18
- package/dist/notifications/notification/notification.css.js +0 -1
- package/dist/notifications/notification/notification.js +0 -53
- package/dist/notifications/root/notifications-root.css.js +0 -1
- package/dist/notifications/root/notifications-root.js +0 -31
- package/dist/number-input/root/number-input-root.css.js +0 -1
- package/dist/number-input/root/number-input-root.js +0 -31
- package/dist/option/group/option-group.css.js +0 -1
- package/dist/option/group/option-group.js +0 -13
- package/dist/option/root/option-root.css.js +0 -1
- package/dist/option/root/option-root.js +0 -20
- package/dist/outline/root/outline-root.css.js +0 -1
- package/dist/outline/root/outline-root.js +0 -21
- package/dist/pagination/root/pagination-root.css.js +0 -1
- package/dist/pagination/root/pagination-root.js +0 -49
- package/dist/pagination/size/pagination-size.css.js +0 -1
- package/dist/pagination/size/pagination-size.js +0 -25
- package/dist/pagination/summary/pagination-summary.css.js +0 -1
- package/dist/pagination/summary/pagination-summary.js +0 -13
- package/dist/pin-input/root/pin-input-root.css.js +0 -1
- package/dist/pin-input/root/pin-input-root.js +0 -27
- package/dist/popover/root/popover-root.css.js +0 -1
- package/dist/popover/root/popover-root.js +0 -30
- package/dist/progress/root/progress-root.css.js +0 -1
- package/dist/progress/root/progress-root.js +0 -25
- package/dist/qr-code/root/qr-code-root.css.js +0 -1
- package/dist/qr-code/root/qr-code-root.js +0 -27
- package/dist/quote/root/quote-root.css.js +0 -1
- package/dist/quote/root/quote-root.js +0 -15
- package/dist/radio/group/radio-group.css.js +0 -1
- package/dist/radio/group/radio-group.js +0 -16
- package/dist/radio/root/radio-root.css.js +0 -1
- package/dist/radio/root/radio-root.js +0 -46
- package/dist/rating/root/rating-root.css.js +0 -1
- package/dist/rating/root/rating-root.js +0 -22
- package/dist/sandbox/index.js +0 -14
- package/dist/sandbox/preview/sandbox-preview.css.js +0 -1
- package/dist/sandbox/preview/sandbox-preview.js +0 -182
- package/dist/sandbox/root/sandbox-root.css.js +0 -1
- package/dist/sandbox/root/sandbox-root.js +1 -295
- package/dist/sandbox/source/sandbox-source.css.js +0 -1
- package/dist/sandbox/source/sandbox-source.js +0 -77
- package/dist/sandbox/status-bar/sandbox-status-bar.css.js +0 -1
- package/dist/sandbox/status-bar/sandbox-status-bar.js +0 -38
- package/dist/sandbox/terminal/sandbox-terminal.css.js +0 -1
- package/dist/sandbox/terminal/sandbox-terminal.js +0 -54
- package/dist/sandbox/toolbar/sandbox-toolbar.css.js +0 -1
- package/dist/sandbox/toolbar/sandbox-toolbar.js +0 -29
- package/dist/scroll-area/root/scroll-area-root.css.js +0 -1
- package/dist/scroll-area/root/scroll-area-root.js +0 -24
- package/dist/select/root/select-root.css.js +0 -1
- package/dist/select/root/select-root.js +0 -33
- package/dist/shared/chart/series.css.js +0 -1
- package/dist/shared/chart/terminus.css.js +0 -1
- package/dist/shared/field/field-inline.css.js +0 -1
- package/dist/shared/field/field-stacked.css.js +0 -1
- package/dist/shared/field/field.css.js +0 -1
- package/dist/skeleton/root/skeleton-root.css.js +0 -1
- package/dist/skeleton/root/skeleton-root.js +0 -18
- package/dist/slider/root/slider-root.css.js +0 -1
- package/dist/slider/root/slider-root.js +0 -32
- package/dist/sparkline/root/sparkline-root.css.js +0 -1
- package/dist/sparkline/root/sparkline-root.js +0 -40
- package/dist/speed-dial/item/speed-dial-item.css.js +0 -1
- package/dist/speed-dial/item/speed-dial-item.js +0 -16
- package/dist/speed-dial/root/speed-dial-root.css.js +0 -1
- package/dist/speed-dial/root/speed-dial-root.js +0 -16
- package/dist/splitter/root/splitter-root.css.js +0 -1
- package/dist/splitter/root/splitter-root.js +0 -50
- package/dist/stat/group/stat-group.css.js +0 -1
- package/dist/stat/group/stat-group.js +0 -19
- package/dist/stat/root/stat-root.css.js +0 -1
- package/dist/stat/root/stat-root.js +0 -17
- package/dist/steps/root/steps-root.css.js +0 -1
- package/dist/steps/root/steps-root.js +0 -26
- package/dist/steps/step/step.css.js +0 -1
- package/dist/steps/step/step.js +0 -12
- package/dist/switch/root/switch-root.css.js +0 -1
- package/dist/switch/root/switch-root.js +0 -32
- package/dist/table/cell/table-cell.css.js +0 -1
- package/dist/table/cell/table-cell.js +0 -14
- package/dist/table/column/table-column.css.js +0 -1
- package/dist/table/column/table-column.js +0 -13
- package/dist/table/root/table-root.css.js +0 -1
- package/dist/table/root/table-root.js +0 -19
- package/dist/table/row/table-row.css.js +0 -1
- package/dist/table/row/table-row.js +0 -14
- package/dist/tabs/panel/tab-panel.css.js +0 -1
- package/dist/tabs/panel/tab-panel.js +0 -16
- package/dist/tabs/root/tabs-root.css.js +0 -1
- package/dist/tabs/root/tabs-root.js +0 -19
- package/dist/tabs/tab/tab.css.js +0 -1
- package/dist/tabs/tab/tab.js +0 -16
- package/dist/tag/root/tag-root.css.js +0 -1
- package/dist/tag/root/tag-root.js +0 -25
- package/dist/text/root/text-root.css.js +0 -1
- package/dist/text/root/text-root.js +0 -48
- package/dist/textarea/root/textarea-root.css.js +0 -1
- package/dist/textarea/root/textarea-root.js +0 -17
- package/dist/time-input/root/time-input-root.css.js +0 -1
- package/dist/time-input/root/time-input-root.js +0 -31
- package/dist/time-picker/root/time-picker-root.css.js +0 -1
- package/dist/time-picker/root/time-picker-root.js +0 -29
- package/dist/timeline/item/timeline-item.css.js +0 -1
- package/dist/timeline/item/timeline-item.js +0 -17
- package/dist/timeline/root/timeline-root.css.js +0 -1
- package/dist/timeline/root/timeline-root.js +0 -15
- package/dist/toast/item/toast-item.css.js +0 -1
- package/dist/toast/item/toast-item.js +0 -21
- package/dist/toast/root/toast-root.css.js +0 -1
- package/dist/toast/root/toast-root.js +0 -27
- package/dist/toggle/group/toggle-group.css.js +0 -1
- package/dist/toggle/group/toggle-group.js +0 -25
- package/dist/toggle/root/toggle-root.css.js +0 -1
- package/dist/toggle/root/toggle-root.js +0 -18
- package/dist/toolbar/root/toolbar-root.css.js +0 -1
- package/dist/toolbar/root/toolbar-root.js +0 -19
- package/dist/tooltip/root/tooltip-root.css.js +0 -1
- package/dist/tooltip/root/tooltip-root.js +0 -22
- package/dist/tour/root/tour-root.css.js +0 -1
- package/dist/tour/root/tour-root.js +0 -14
- package/dist/tour/stop/tour-stop.css.js +0 -1
- package/dist/tour/stop/tour-stop.js +0 -22
- package/dist/tree/item/tree-item.css.js +0 -1
- package/dist/tree/item/tree-item.js +0 -34
- package/dist/tree/root/tree-root.css.js +0 -1
- package/dist/tree/root/tree-root.js +0 -27
- package/dist/trend/root/trend-root.css.js +0 -1
- package/dist/trend/root/trend-root.js +0 -34
- package/dist/video/root/video-root.css.js +0 -1
- package/dist/video/root/video-root.js +0 -37
- package/dist/video-playlist/item/video-playlist-item.css.js +0 -1
- package/dist/video-playlist/item/video-playlist-item.js +0 -15
- package/dist/video-playlist/menu/video-playlist-menu.css.js +0 -1
- package/dist/video-playlist/menu/video-playlist-menu.js +0 -36
- package/dist/video-playlist/root/video-playlist-root.css.js +0 -1
- package/dist/video-playlist/root/video-playlist-root.js +0 -16
- package/dist/virtual-list/root/virtual-list-root.css.js +0 -1
- package/dist/virtual-list/root/virtual-list-root.js +0 -21
- package/jsx.d.ts +1538 -2818
- package/package.json +7 -7
- package/vue.d.ts +3 -7
|
@@ -8,74 +8,21 @@ import { customElement, HelixElement } from '@fusion.dev/helix-core';
|
|
|
8
8
|
import { html, nothing } from 'lit';
|
|
9
9
|
import { property, state } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './sandbox-terminal.css.js';
|
|
11
|
-
/** How many lines are kept. Older ones fall off the top. */
|
|
12
11
|
const LIMIT = 200;
|
|
13
|
-
/**
|
|
14
|
-
* @summary Shows what the previewed example wrote to the console.
|
|
15
|
-
*
|
|
16
|
-
* @description
|
|
17
|
-
* Fed by the sandbox, which hears `helix-console` from the preview and hands it
|
|
18
|
-
* here. The preview is a separate document, so what arrives has already crossed
|
|
19
|
-
* `postMessage`: text, not values.
|
|
20
|
-
*
|
|
21
|
-
* **Repeats collapse.** An example with a render loop can write the same
|
|
22
|
-
* warning hundreds of times, and two hundred identical lines say nothing that
|
|
23
|
-
* one line and a count does not. Only consecutive repeats collapse, so the
|
|
24
|
-
* order of what happened survives.
|
|
25
|
-
*
|
|
26
|
-
* A `role="log"` rather than a live region by hand. It is the semantic for an
|
|
27
|
-
* append-only stream, and it means a reader is told about new output without
|
|
28
|
-
* the whole panel being re-announced each time.
|
|
29
|
-
*
|
|
30
|
-
* @since 0.1.0
|
|
31
|
-
* @status experimental
|
|
32
|
-
* @aliases Console, Output
|
|
33
|
-
* @documentation https://helix.fusion.dev/sandbox/terminal
|
|
34
|
-
*
|
|
35
|
-
* @csspart count - How many times a repeated line arrived.
|
|
36
|
-
* @csspart empty - Shown while nothing has been written.
|
|
37
|
-
* @csspart entry - One line.
|
|
38
|
-
* @csspart level - The level a line came in at.
|
|
39
|
-
* @csspart log - The scrolling region.
|
|
40
|
-
* @csspart message - The text of a line.
|
|
41
|
-
*
|
|
42
|
-
* @cssproperty --sandbox-terminal-size - Height of the scrolling region.
|
|
43
|
-
*/
|
|
44
12
|
let HelixSandboxTerminal = class HelixSandboxTerminal extends HelixElement {
|
|
45
13
|
constructor() {
|
|
46
14
|
super(...arguments);
|
|
47
|
-
/**
|
|
48
|
-
* What to show before anything has been written.
|
|
49
|
-
*/
|
|
50
15
|
this.emptyLabel = 'Nothing written to the console yet.';
|
|
51
|
-
/**
|
|
52
|
-
* Accessible name for the log.
|
|
53
|
-
*/
|
|
54
16
|
this.label = 'Console output';
|
|
55
17
|
this.entries = [];
|
|
56
|
-
/**
|
|
57
|
-
* Whether the reader is at the bottom, and so wants to follow new output.
|
|
58
|
-
*
|
|
59
|
-
* Read before the render that adds a line and applied after it. Scrolling to
|
|
60
|
-
* the bottom on every line would drag a reader off whatever they had scrolled
|
|
61
|
-
* up to look at, which for a log of errors is the one thing they are doing.
|
|
62
|
-
*/
|
|
63
18
|
this.following = true;
|
|
64
19
|
}
|
|
65
20
|
get log() {
|
|
66
21
|
return this.renderRoot.querySelector('[part="log"]');
|
|
67
22
|
}
|
|
68
|
-
/**
|
|
69
|
-
* Adds a line, collapsing it into the one above when they are identical.
|
|
70
|
-
*
|
|
71
|
-
* `write` rather than `append`, which every element already has from
|
|
72
|
-
* `ParentNode` and which takes nodes. Shadowing it would break
|
|
73
|
-
* `terminal.append(node)` for anyone who reasonably expected the DOM method.
|
|
74
|
-
*/
|
|
75
23
|
write(detail) {
|
|
76
24
|
const log = this.log;
|
|
77
25
|
if (log) {
|
|
78
|
-
// A pixel of tolerance: fractional scroll positions do not land exactly.
|
|
79
26
|
this.following = log.scrollHeight - log.scrollTop - log.clientHeight < 2;
|
|
80
27
|
}
|
|
81
28
|
const last = this.entries.at(-1);
|
|
@@ -85,7 +32,6 @@ let HelixSandboxTerminal = class HelixSandboxTerminal extends HelixElement {
|
|
|
85
32
|
}
|
|
86
33
|
this.entries = [...this.entries, { ...detail, count: 1 }].slice(-LIMIT);
|
|
87
34
|
}
|
|
88
|
-
/** Empties the log. */
|
|
89
35
|
clear() {
|
|
90
36
|
this.entries = [];
|
|
91
37
|
this.following = true;
|
|
@@ -7,37 +7,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
7
7
|
import { customElement, HelixElement } from '@fusion.dev/helix-core';
|
|
8
8
|
import { html } from 'lit';
|
|
9
9
|
import { styles } from './sandbox-toolbar.css.js';
|
|
10
|
-
/**
|
|
11
|
-
* @summary The bar across the top of a sandbox.
|
|
12
|
-
*
|
|
13
|
-
* @description
|
|
14
|
-
* Spans the source pane and the preview together, so what it holds is about the
|
|
15
|
-
* sandbox rather than about one side of it. The files go at the start and the
|
|
16
|
-
* menus at the end, which is the arrangement every editor has settled on.
|
|
17
|
-
*
|
|
18
|
-
* **Not `role="toolbar"`.** That role brings a roving tabindex, one tab stop
|
|
19
|
-
* for the whole group, and it is for a set of controls of the same kind. This
|
|
20
|
-
* holds a tab list, which owns its own arrow-key behavior and would lose it.
|
|
21
|
-
* Use `helix-toolbar` where the contents really are a row of buttons.
|
|
22
|
-
*
|
|
23
|
-
* Both slots are bare, so an unfilled one generates no box and costs no gap.
|
|
24
|
-
*
|
|
25
|
-
* @since 0.1.0
|
|
26
|
-
* @status experimental
|
|
27
|
-
* @aliases Action bar
|
|
28
|
-
* @documentation https://helix.fusion.dev/sandbox/toolbar
|
|
29
|
-
*
|
|
30
|
-
* @slot - Items at the start, usually the files.
|
|
31
|
-
* @slot end - Items at the end, usually menus.
|
|
32
|
-
*
|
|
33
|
-
* @cssproperty --sandbox-toolbar-gap - Space between items.
|
|
34
|
-
* @cssproperty --sandbox-toolbar-size - The bar's height. Defaults to a large control.
|
|
35
|
-
*/
|
|
36
10
|
let HelixSandboxToolbar = class HelixSandboxToolbar extends HelixElement {
|
|
37
11
|
render() {
|
|
38
|
-
// The end slot opens the gap that separates the two ends, the same way the
|
|
39
|
-
// status bar does it. No wrapper: a slot that is not filled has to cost
|
|
40
|
-
// nothing, and `display: contents` is what gives that for free.
|
|
41
12
|
return html `<slot></slot>
|
|
42
13
|
<slot name="end"></slot>`;
|
|
43
14
|
}
|
|
@@ -7,30 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
7
7
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
8
|
import { HelixHeadlessScrollArea } from '@fusion.dev/helix-headless/scroll-area';
|
|
9
9
|
import { styles } from './scroll-area-root.css.js';
|
|
10
|
-
/**
|
|
11
|
-
* @summary A scrolling box that says there is more.
|
|
12
|
-
*
|
|
13
|
-
* @description
|
|
14
|
-
* Presentation only: the fades on the edges the base class names, and a
|
|
15
|
-
* scrollbar that belongs to the system rather than to the platform. Which edges
|
|
16
|
-
* have content past them is measured by the base class.
|
|
17
|
-
*
|
|
18
|
-
* @since 0.1.0
|
|
19
|
-
* @status stable
|
|
20
|
-
* @category layout
|
|
21
|
-
* @aliases Scroller, Overflow, Scroll container
|
|
22
|
-
* @documentation https://helix.fusion.dev/components/scroll-area
|
|
23
|
-
*
|
|
24
|
-
* @cssproperty --scroll-area-fade - How deep the fades are, at both edges.
|
|
25
|
-
* @cssproperty --scroll-area-fade-block-end - And the bottom one.
|
|
26
|
-
* @cssproperty --scroll-area-fade-block-start - How deep the top one is, or `0` to drop it.
|
|
27
|
-
* @cssproperty --scroll-area-fade-color - What they fade to, which is the ground behind.
|
|
28
|
-
* @cssproperty --scroll-area-fade-inline-end - And the trailing one.
|
|
29
|
-
* @cssproperty --scroll-area-fade-inline-start - How deep the leading sideways one is, or `0` to drop it.
|
|
30
|
-
* @cssproperty --scroll-area-scrollbar - The scrollbar width keyword.
|
|
31
|
-
* @cssproperty --scroll-area-thumb-color - The scrollbar's handle.
|
|
32
|
-
* @cssproperty --scroll-area-track-color - And its track.
|
|
33
|
-
*/
|
|
34
10
|
let HelixScrollArea = class HelixScrollArea extends HelixHeadlessScrollArea {
|
|
35
11
|
static { this.styles = styles; }
|
|
36
12
|
};
|
|
@@ -10,41 +10,8 @@ import { property } from 'lit/decorators.js';
|
|
|
10
10
|
import { styles as fieldStyles } from '../../shared/field/field.css.js';
|
|
11
11
|
import { styles as fieldStackedStyles } from '../../shared/field/field-stacked.css.js';
|
|
12
12
|
import { styles } from './select-root.css.js';
|
|
13
|
-
/* Side-effect imports, because this renders `<helix-listbox>` in its own shadow
|
|
14
|
-
root and a custom element registers on import. Without them a consumer who
|
|
15
|
-
imports `@fusion.dev/helix/select` and nothing else gets a select whose panel
|
|
16
|
-
never upgrades: an unknown element with unstyled options inside it, and no
|
|
17
|
-
error anywhere, because an unknown element is legal HTML. The suite hides it
|
|
18
|
-
too, some other file happening to supply the registration, so it shows as a
|
|
19
|
-
spec that passes together and fails alone. */
|
|
20
13
|
import '../../listbox/index.js';
|
|
21
14
|
import '../../option/index.js';
|
|
22
|
-
/**
|
|
23
|
-
* @summary A closed list that opens to be chosen from.
|
|
24
|
-
*
|
|
25
|
-
* @description
|
|
26
|
-
* The trigger wears the same frame as an `Input`, because in a form it stands
|
|
27
|
-
* in a row with them and a control that looks like a button among fields reads
|
|
28
|
-
* as an action rather than an answer.
|
|
29
|
-
*
|
|
30
|
-
* The panel is an overlay surface rather than a sunken one: it sits over the
|
|
31
|
-
* page instead of on it, which is what its shadow says and what tells it apart
|
|
32
|
-
* from the field it came out of.
|
|
33
|
-
*
|
|
34
|
-
* @since 0.1.0
|
|
35
|
-
* @status experimental
|
|
36
|
-
* @category forms
|
|
37
|
-
* @aliases Dropdown, Picker
|
|
38
|
-
* @documentation https://helix.fusion.dev/components/select
|
|
39
|
-
*
|
|
40
|
-
* @cssproperty --select-border-color - Color of the panel's edge.
|
|
41
|
-
* @cssproperty --select-border-width - Width of the panel's edge. Follows
|
|
42
|
-
* `--helix-border-floating`, which is `0`, so the panel is told apart by its lift unless a
|
|
43
|
-
* theme says otherwise.
|
|
44
|
-
* @cssproperty --select-shadow - Lift under the panel. Follows `--helix-shadow-floating`: a
|
|
45
|
-
* floating surface sits over content nobody can predict, so it keeps a lift by default.
|
|
46
|
-
* @cssproperty --select-surface-max-block-size - How tall the panel gets.
|
|
47
|
-
*/
|
|
48
15
|
let HelixSelect = class HelixSelect extends HelixHeadlessSelect {
|
|
49
16
|
static { this.tier = 'helix-'; }
|
|
50
17
|
static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }
|
|
@@ -8,24 +8,6 @@ import { customElement } from '@fusion.dev/helix-core';
|
|
|
8
8
|
import { HelixHeadlessSkeleton } from '@fusion.dev/helix-headless/skeleton';
|
|
9
9
|
import { property } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './skeleton-root.css.js';
|
|
11
|
-
/**
|
|
12
|
-
* @summary Stands in for content that has not arrived.
|
|
13
|
-
*
|
|
14
|
-
* @description
|
|
15
|
-
* A sweep rather than a pulse. A block fading in and out reads as something
|
|
16
|
-
* broken; a highlight traveling across it reads as work in progress, and it is
|
|
17
|
-
* the same one property animating either way.
|
|
18
|
-
*
|
|
19
|
-
* @since 0.1.0
|
|
20
|
-
* @status stable
|
|
21
|
-
* @category feedback
|
|
22
|
-
* @aliases Placeholder, Shimmer, Ghost
|
|
23
|
-
* @documentation https://helix.fusion.dev/components/skeleton
|
|
24
|
-
*
|
|
25
|
-
* @csspart skeleton - The placeholder surface.
|
|
26
|
-
*
|
|
27
|
-
* @cssproperty --skeleton-size - Diameter of the circle shape.
|
|
28
|
-
*/
|
|
29
11
|
let HelixSkeleton = class HelixSkeleton extends HelixHeadlessSkeleton {
|
|
30
12
|
static { this.styles = styles; }
|
|
31
13
|
};
|
|
@@ -9,38 +9,6 @@ import { HelixHeadlessSlider } from '@fusion.dev/helix-headless/slider';
|
|
|
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 './slider-root.css.js';
|
|
12
|
-
/**
|
|
13
|
-
* @summary A value chosen from a range by dragging.
|
|
14
|
-
*
|
|
15
|
-
* @description
|
|
16
|
-
* The track and the thumb are the browser's own, restyled through the range
|
|
17
|
-
* pseudo-elements rather than replaced. What that buys is everything a
|
|
18
|
-
* hand-built slider has to reimplement and usually gets slightly wrong: the
|
|
19
|
-
* drag, the keys, and a hit area sized by the platform for a finger.
|
|
20
|
-
*
|
|
21
|
-
* The filled part of the track is painted with a gradient driven by the
|
|
22
|
-
* fraction the headless tier writes, rather than by a second element laid over
|
|
23
|
-
* it. One element cannot be half one color by any other means that survives
|
|
24
|
-
* the thumb being dragged.
|
|
25
|
-
*
|
|
26
|
-
* @since 0.1.0
|
|
27
|
-
* @status experimental
|
|
28
|
-
* @category forms
|
|
29
|
-
* @aliases Range, Range input
|
|
30
|
-
* @documentation https://helix.fusion.dev/components/slider
|
|
31
|
-
*
|
|
32
|
-
* @cssproperty --slider-fill-color - The part behind the thumb.
|
|
33
|
-
* @cssproperty --slider-length - How long a vertical track is. Nine rem by default, and read only when `orientation` is `vertical`, a horizontal track taking the width of its row.
|
|
34
|
-
* @cssproperty --slider-marker-color - The ticks along the track.
|
|
35
|
-
* @cssproperty --slider-thumb-color - The handle.
|
|
36
|
-
* @cssproperty --slider-thumb-length - The handle along the track. Follows the size unless it is told otherwise, and setting one of the two is what makes the handle an oval.
|
|
37
|
-
* @cssproperty --slider-thumb-radius - The handle's corners. Fully round by default, so a handle given two dimensions is a capsule until this says otherwise.
|
|
38
|
-
* @cssproperty --slider-thumb-ring-color - The fence separating the handle from the track, for a slider that is not on the page.
|
|
39
|
-
* @cssproperty --slider-thumb-size - The handle across the track. Square with the length by default, which is what makes it round.
|
|
40
|
-
* @cssproperty --slider-track-color - The part not yet chosen.
|
|
41
|
-
* @cssproperty --slider-track-image - The whole track, for a slider whose color is the value.
|
|
42
|
-
* @cssproperty --slider-track-size - How thick the track is. The progress bar's own size by default, the two being the same object.
|
|
43
|
-
*/
|
|
44
12
|
let HelixSlider = class HelixSlider extends HelixHeadlessSlider {
|
|
45
13
|
static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }
|
|
46
14
|
};
|
|
@@ -9,46 +9,6 @@ import { HelixHeadlessSparkline } from '@fusion.dev/helix-headless/sparkline';
|
|
|
9
9
|
import { property } from 'lit/decorators.js';
|
|
10
10
|
import { styles as terminusStyles } from '../../shared/chart/terminus.css.js';
|
|
11
11
|
import { styles } from './sparkline-root.css.js';
|
|
12
|
-
/**
|
|
13
|
-
* @summary A line with no axes, for the shape of a series beside the number it belongs to.
|
|
14
|
-
*
|
|
15
|
-
* @description
|
|
16
|
-
* Sized in `em` by default, so a sparkline set beside a figure is a figure-sized
|
|
17
|
-
* thing and one set in a table row is a row-sized thing. The type scale is
|
|
18
|
-
* absolute and cannot say "a little wider than this".
|
|
19
|
-
*
|
|
20
|
-
* The stroke does not scale with the box. `preserveAspectRatio="none"` is what
|
|
21
|
-
* lets one drawing fill a 60px slot and a 600px one, and without
|
|
22
|
-
* `vector-effect: non-scaling-stroke` the same line comes out hairline in the
|
|
23
|
-
* first and heavy in the second.
|
|
24
|
-
*
|
|
25
|
-
* One color on the host, read by the line, the wash, the columns and the mark
|
|
26
|
-
* alike, so moving `--sparkline-color` cannot leave parts of one drawing
|
|
27
|
-
* disagreeing.
|
|
28
|
-
*
|
|
29
|
-
* The line's weight is set in `em` rather than pixels, so it grows with the
|
|
30
|
-
* drawing the way the drawing grows with its type. A fixed pixel width leaves a
|
|
31
|
-
* 200 pixel sparkline wearing a hairline: `vector-effect` keeps a stroke out of
|
|
32
|
-
* the view box's stretch, and it also keeps it out of every other reason it
|
|
33
|
-
* might want to be bigger.
|
|
34
|
-
*
|
|
35
|
-
* @since 0.1.0
|
|
36
|
-
* @status experimental
|
|
37
|
-
* @category charts
|
|
38
|
-
* @groups charts
|
|
39
|
-
* @aliases Micro Chart, Trend Line, Inline Chart
|
|
40
|
-
* @documentation https://helix.fusion.dev/components/sparkline
|
|
41
|
-
*
|
|
42
|
-
* @cssproperty --chart-terminus-hole - A fill for the middle of a `ring` terminus, which is otherwise open.
|
|
43
|
-
* @cssproperty --chart-terminus-size - Size of the mark on the last reading.
|
|
44
|
-
* @cssproperty --sparkline-area-opacity - How much of the line's color the wash takes where it meets the line.
|
|
45
|
-
* @cssproperty --sparkline-bar-radius - Corner radius on a column, under `plot="bar"`.
|
|
46
|
-
* @cssproperty --sparkline-bar-stroke - Thickness of a column's edge under `outlined`.
|
|
47
|
-
* @cssproperty --sparkline-block-size - Height of the drawing.
|
|
48
|
-
* @cssproperty --sparkline-color - Color of the line, the wash, the columns and the mark.
|
|
49
|
-
* @cssproperty --sparkline-inline-size - Width of the drawing.
|
|
50
|
-
* @cssproperty --sparkline-width - Thickness of the line, overriding `weight`.
|
|
51
|
-
*/
|
|
52
12
|
let HelixSparkline = class HelixSparkline extends HelixHeadlessSparkline {
|
|
53
13
|
static { this.styles = [terminusStyles, styles]; }
|
|
54
14
|
};
|
|
@@ -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 { HelixHeadlessSpeedDialItem } from '@fusion.dev/helix-headless/speed-dial';
|
|
9
9
|
import { styles } from './speed-dial-item.css.js';
|
|
10
|
-
/**
|
|
11
|
-
* @summary One action in a speed dial: a mark, and a name beside it.
|
|
12
|
-
*
|
|
13
|
-
* @description
|
|
14
|
-
* Presentation only: a round mark the size of a small control, and the name on
|
|
15
|
-
* a chip beside it so it can be read against whatever the dial is floating
|
|
16
|
-
* over. Everything about choosing it is the base class.
|
|
17
|
-
*
|
|
18
|
-
* @since 0.1.0
|
|
19
|
-
* @status experimental
|
|
20
|
-
* @category actions
|
|
21
|
-
* @aliases Speed dial action, FAB action, Quick action
|
|
22
|
-
* @documentation https://helix.fusion.dev/components/speed-dial
|
|
23
|
-
*
|
|
24
|
-
* @cssproperty --speed-dial-item-size - Edge length of the mark.
|
|
25
|
-
*/
|
|
26
10
|
let HelixSpeedDialItem = class HelixSpeedDialItem extends HelixHeadlessSpeedDialItem {
|
|
27
11
|
static { this.styles = styles; }
|
|
28
12
|
};
|
|
@@ -9,22 +9,6 @@ import { HelixHeadlessSpeedDial } from '@fusion.dev/helix-headless/speed-dial';
|
|
|
9
9
|
import { styles as glyphStyles } from '../../icon/glyph.css.js';
|
|
10
10
|
import { styles } from './speed-dial-root.css.js';
|
|
11
11
|
import '../../icon/index.js';
|
|
12
|
-
/**
|
|
13
|
-
* @summary A button that fans out the few actions a screen is for.
|
|
14
|
-
*
|
|
15
|
-
* @description
|
|
16
|
-
* Presentation only: the column the actions fan into, and which end they line
|
|
17
|
-
* up on. Everything about what opens it, what closes it and how a keyboard
|
|
18
|
-
* moves through it is the base class.
|
|
19
|
-
*
|
|
20
|
-
* @since 0.1.0
|
|
21
|
-
* @status experimental
|
|
22
|
-
* @category actions
|
|
23
|
-
* @aliases FAB, Floating action button, Action button, Quick actions
|
|
24
|
-
* @documentation https://helix.fusion.dev/components/speed-dial
|
|
25
|
-
*
|
|
26
|
-
* @cssproperty --speed-dial-gap - Space between the actions.
|
|
27
|
-
*/
|
|
28
12
|
let HelixSpeedDial = class HelixSpeedDial extends HelixHeadlessSpeedDial {
|
|
29
13
|
static { this.styles = [glyphStyles, styles]; }
|
|
30
14
|
};
|
|
@@ -8,56 +8,6 @@ import { customElement } from '@fusion.dev/helix-core';
|
|
|
8
8
|
import { HelixHeadlessSplitter } from '@fusion.dev/helix-headless/splitter';
|
|
9
9
|
import { property } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './splitter-root.css.js';
|
|
11
|
-
/**
|
|
12
|
-
* @summary Two panes and a divider the reader can move.
|
|
13
|
-
*
|
|
14
|
-
* @description
|
|
15
|
-
* The divider is a line to look at and a box to hit, and they are different
|
|
16
|
-
* sizes. Drawn at the border's own width it is a one pixel pointer target, which
|
|
17
|
-
* is the fault every hand-rolled splitter has; the line is a border and the
|
|
18
|
-
* target is the box around it.
|
|
19
|
-
*
|
|
20
|
-
* It lights on hover before it is touched, because a hairline says nothing about
|
|
21
|
-
* being movable, and the whole target lights rather than the line, so the thing
|
|
22
|
-
* that answers the pointer is the thing that changed.
|
|
23
|
-
*
|
|
24
|
-
* Both panes scroll and both have their minimum size taken off them. A flex
|
|
25
|
-
* item's floor is its content, so a pane holding anything scrollable would
|
|
26
|
-
* otherwise refuse to go below it: the divider would stop at a width nobody
|
|
27
|
-
* asked for and nothing would say why.
|
|
28
|
-
*
|
|
29
|
-
* The corner where a nested splitter crosses is twice the divider's target,
|
|
30
|
-
* because it is aimed at as a point rather than a line. It draws nothing of its
|
|
31
|
-
* own: the `move` cursor already says what it is, at the moment a reader is on
|
|
32
|
-
* it. A ring on focus is the exception, since with nothing drawn there would
|
|
33
|
-
* otherwise be no way to see where the keyboard is.
|
|
34
|
-
*
|
|
35
|
-
* A divider stays lit for as long as it is moving, which `:hover` cannot say on
|
|
36
|
-
* its own: a drag captures the pointer, and a corner moves the nested divider
|
|
37
|
-
* while the reader is nowhere near it. It goes primary while it moves rather
|
|
38
|
-
* than merely darker, because hover is a question and a drag is an answer, and
|
|
39
|
-
* because a corner moving two dividers at once needs the pair to read as one
|
|
40
|
-
* gesture.
|
|
41
|
-
*
|
|
42
|
-
* @since 0.1.0
|
|
43
|
-
* @status experimental
|
|
44
|
-
* @category layout
|
|
45
|
-
* @aliases SplitPane, Resizable, SplitView
|
|
46
|
-
* @documentation https://helix.fusion.dev/components/splitter
|
|
47
|
-
*
|
|
48
|
-
* @csspart corner - The handle where a nested splitter's divider crosses this one.
|
|
49
|
-
* @csspart end - The box holding the second.
|
|
50
|
-
* @csspart separator - The divider itself.
|
|
51
|
-
* @csspart start - The box holding the first pane.
|
|
52
|
-
*
|
|
53
|
-
* @cssproperty --splitter-color - The line between the panes.
|
|
54
|
-
* @cssproperty --splitter-corner - How wide the handle at a crossing is.
|
|
55
|
-
* @cssproperty --splitter-drag-color - The line while it is being moved.
|
|
56
|
-
* @cssproperty --splitter-grip-color - The grip beside the line, once it is shown.
|
|
57
|
-
* @cssproperty --splitter-grip-length - How far the grip runs along the divider.
|
|
58
|
-
* @cssproperty --splitter-hover-color - The target under the pointer.
|
|
59
|
-
* @cssproperty --splitter-target - How wide the draggable box is.
|
|
60
|
-
*/
|
|
61
11
|
let HelixSplitter = class HelixSplitter extends HelixHeadlessSplitter {
|
|
62
12
|
static { this.styles = styles; }
|
|
63
13
|
};
|
|
@@ -8,28 +8,9 @@ import { customElement } from '@fusion.dev/helix-core';
|
|
|
8
8
|
import { HelixHeadlessStatGroup } from '@fusion.dev/helix-headless/stat';
|
|
9
9
|
import { property } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './stat-group.css.js';
|
|
11
|
-
/**
|
|
12
|
-
* @summary A row of related measurements.
|
|
13
|
-
*
|
|
14
|
-
* @description
|
|
15
|
-
* Wraps rather than scrolls, and each figure keeps its own width instead of
|
|
16
|
-
* every one taking an equal share: a set of figures is read by comparing them,
|
|
17
|
-
* and equal columns make a four-digit number and a two-digit one look like the
|
|
18
|
-
* same quantity.
|
|
19
|
-
*
|
|
20
|
-
* @since 0.1.0
|
|
21
|
-
* @status stable
|
|
22
|
-
* @aliases Metrics, KPIs, Figures
|
|
23
|
-
* @documentation https://helix.fusion.dev/components/stat
|
|
24
|
-
*
|
|
25
|
-
* @cssproperty --stat-group-gap - Space between figures.
|
|
26
|
-
*/
|
|
27
11
|
let HelixStatGroup = class HelixStatGroup extends HelixHeadlessStatGroup {
|
|
28
12
|
constructor() {
|
|
29
13
|
super(...arguments);
|
|
30
|
-
/**
|
|
31
|
-
* Whether the figures are separated by a rule as well as by space.
|
|
32
|
-
*/
|
|
33
14
|
this.divided = false;
|
|
34
15
|
}
|
|
35
16
|
static { this.styles = styles; }
|
|
@@ -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 { HelixHeadlessStat } from '@fusion.dev/helix-headless/stat';
|
|
9
9
|
import { styles } from './stat-root.css.js';
|
|
10
|
-
/**
|
|
11
|
-
* @summary One measurement, with the word for what it measures.
|
|
12
|
-
*
|
|
13
|
-
* @description
|
|
14
|
-
* The value is set on the display face at a size the type scale does not reach,
|
|
15
|
-
* because a figure is the one place on a page where the number is the design.
|
|
16
|
-
* The label sits above it in the label ramp, quiet and wide-tracked, so the
|
|
17
|
-
* pair reads as one object rather than as two lines of text.
|
|
18
|
-
*
|
|
19
|
-
* @since 0.1.0
|
|
20
|
-
* @status stable
|
|
21
|
-
* @category data
|
|
22
|
-
* @aliases Metric, KPI, Figure
|
|
23
|
-
* @documentation https://helix.fusion.dev/components/stat
|
|
24
|
-
*
|
|
25
|
-
* @cssproperty --stat-value-size - Size of the figure.
|
|
26
|
-
*/
|
|
27
10
|
let HelixStat = class HelixStat extends HelixHeadlessStat {
|
|
28
11
|
static { this.styles = styles; }
|
|
29
12
|
};
|
|
@@ -7,32 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
7
7
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
8
|
import { HelixHeadlessSteps } from '@fusion.dev/helix-headless/steps';
|
|
9
9
|
import { styles } from './steps-root.css.js';
|
|
10
|
-
/**
|
|
11
|
-
* @summary A sequence of stages, and where the reader is in it.
|
|
12
|
-
*
|
|
13
|
-
* @description
|
|
14
|
-
* The numbering is a CSS counter rather than a property, so a step's position
|
|
15
|
-
* is drawn by the browser at layout and is right in the server's markup with no
|
|
16
|
-
* script involved. Reordering the steps renumbers them; nothing has to be told.
|
|
17
|
-
*
|
|
18
|
-
* A step's name is a `helix-button`, so what it looks like under the pointer,
|
|
19
|
-
* with focus, and when refused are Button's decisions and Button's hooks. There
|
|
20
|
-
* is no `--steps-hover-color`: `--button-background-color` is that hook, and a
|
|
21
|
-
* second name for it here would be a second thing to keep in step.
|
|
22
|
-
*
|
|
23
|
-
* @since 0.1.0
|
|
24
|
-
* @status experimental
|
|
25
|
-
* @category navigation
|
|
26
|
-
* @aliases Stepper, Wizard, Progress steps
|
|
27
|
-
* @documentation https://helix.fusion.dev/components/steps
|
|
28
|
-
*
|
|
29
|
-
* @cssproperty --steps-complete-color - The mark on a finished step.
|
|
30
|
-
* @cssproperty --steps-connector-color - The rule running through the steps.
|
|
31
|
-
* @cssproperty --steps-connector-inset - Air either side of a mark, before the rail.
|
|
32
|
-
* @cssproperty --steps-current-color - The mark on the current step.
|
|
33
|
-
* @cssproperty --steps-gap - Space between one step and the next.
|
|
34
|
-
* @cssproperty --steps-marker-size - Size of the mark, glyph or digit.
|
|
35
|
-
*/
|
|
36
10
|
let HelixSteps = class HelixSteps extends HelixHeadlessSteps {
|
|
37
11
|
static { this.styles = styles; }
|
|
38
12
|
};
|
package/dist/steps/step/step.js
CHANGED
|
@@ -6,20 +6,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
6
6
|
};
|
|
7
7
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
8
|
import { HelixHeadlessStep } from '@fusion.dev/helix-headless/steps';
|
|
9
|
-
/* Side-effect import, because the tier below renders `<helix-button>` and a custom
|
|
10
|
-
element registers on import. Inherited from the base along with the template,
|
|
11
|
-
which is why it is restated here: this file has no `<helix-button>` in it to
|
|
12
|
-
remind anyone. */
|
|
13
9
|
import '../../button/index.js';
|
|
14
10
|
import { styles } from './step.css.js';
|
|
15
|
-
/**
|
|
16
|
-
* @summary One stage in a sequence.
|
|
17
|
-
*
|
|
18
|
-
* @since 0.1.0
|
|
19
|
-
* @status experimental
|
|
20
|
-
* @aliases Stage
|
|
21
|
-
* @documentation https://helix.fusion.dev/components/steps
|
|
22
|
-
*/
|
|
23
11
|
let HelixStep = class HelixStep extends HelixHeadlessStep {
|
|
24
12
|
static { this.tier = 'helix-'; }
|
|
25
13
|
static { this.styles = styles; }
|