@fusion.dev/helix 0.182.0 → 0.182.2
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 +7900 -5780
- package/dist/accordion/item/accordion-item.css.js +1 -4
- package/dist/accordion/item/accordion-item.js +1 -6
- package/dist/accordion/root/accordion-root.css.js +1 -2
- package/dist/accordion/root/accordion-root.js +1 -6
- package/dist/announcement/root/announcement-root.css.js +1 -25
- package/dist/announcement/root/announcement-root.js +1 -6
- package/dist/app-header/root/app-header-root.css.js +1 -9
- package/dist/app-header/root/app-header-root.js +1 -6
- package/dist/area-chart/root/area-chart-root.css.js +1 -8
- package/dist/area-chart/root/area-chart-root.js +1 -6
- package/dist/aura/root/aura-root.css.js +1 -10
- package/dist/aura/root/aura-root.js +1 -6
- package/dist/avatar/group/avatar-group.css.js +1 -15
- package/dist/avatar/group/avatar-group.js +1 -6
- package/dist/avatar/root/avatar-root.css.js +1 -1
- package/dist/avatar/root/avatar-root.js +1 -6
- package/dist/badge/root/badge-root.css.js +1 -21
- package/dist/badge/root/badge-root.js +1 -6
- package/dist/bar-chart/root/bar-chart-root.css.js +1 -19
- package/dist/bar-chart/root/bar-chart-root.js +1 -6
- package/dist/blockquote/root/blockquote-root.css.js +1 -2
- package/dist/blockquote/root/blockquote-root.js +1 -6
- package/dist/breadcrumbs/breadcrumb/breadcrumb.css.js +1 -25
- package/dist/breadcrumbs/breadcrumb/breadcrumb.js +1 -6
- package/dist/breadcrumbs/root/breadcrumbs-root.css.js +1 -7
- package/dist/breadcrumbs/root/breadcrumbs-root.js +1 -6
- package/dist/button/root/button-root.css.js +1 -46
- package/dist/button/root/button-root.js +1 -6
- package/dist/button-group/root/button-group-root.css.js +1 -11
- package/dist/button-group/root/button-group-root.js +1 -6
- package/dist/callout/root/callout-root.css.js +1 -10
- package/dist/callout/root/callout-root.js +1 -6
- package/dist/canvas/edge/canvas-edge.js +1 -6
- package/dist/canvas/node/canvas-node.css.js +1 -12
- package/dist/canvas/node/canvas-node.js +1 -6
- package/dist/canvas/root/canvas-root.css.js +1 -15
- package/dist/canvas/root/canvas-root.js +1 -6
- package/dist/card/root/card-root.css.js +1 -8
- package/dist/card/root/card-root.js +1 -6
- package/dist/carousel/root/carousel-root.css.js +1 -42
- package/dist/carousel/root/carousel-root.js +1 -6
- package/dist/chat/composer/chat-composer.css.js +1 -5
- package/dist/chat/composer/chat-composer.js +1 -6
- package/dist/chat/message/chat-message.css.js +1 -11
- package/dist/chat/message/chat-message.js +1 -6
- package/dist/chat/root/chat-root.css.js +1 -13
- package/dist/chat/root/chat-root.js +1 -6
- package/dist/chat/typing.css.js +1 -24
- package/dist/checkbox/root/checkbox-root.css.js +1 -16
- package/dist/checkbox/root/checkbox-root.js +1 -6
- package/dist/checkbox-group/root/checkbox-group-root.css.js +1 -1
- package/dist/checkbox-group/root/checkbox-group-root.js +1 -6
- package/dist/code/root/code-root.css.js +1 -7
- package/dist/code/root/code-root.js +1 -6
- package/dist/code-block/root/code-block-root.css.js +1 -62
- package/dist/code-block/root/code-block-root.js +1 -6
- package/dist/color-input/root/color-input-root.css.js +1 -13
- package/dist/color-input/root/color-input-root.js +1 -6
- package/dist/color-picker/root/color-picker-root.css.js +1 -75
- package/dist/color-picker/root/color-picker-root.js +1 -6
- package/dist/combobox/root/combobox-root.css.js +1 -11
- package/dist/combobox/root/combobox-root.js +1 -6
- package/dist/command/root/command-root.css.js +1 -3
- package/dist/command/root/command-root.js +1 -6
- package/dist/copy-button/root/copy-button-root.css.js +1 -5
- package/dist/copy-button/root/copy-button-root.js +1 -6
- package/dist/data-table/root/data-table-root.css.js +1 -52
- package/dist/data-table/root/data-table-root.js +1 -6
- package/dist/date-input/root/date-input-root.css.js +1 -19
- package/dist/date-input/root/date-input-root.js +1 -6
- package/dist/date-picker/root/date-picker-root.css.js +1 -37
- package/dist/date-picker/root/date-picker-root.js +1 -6
- package/dist/description-list/item/description-list-item.css.js +1 -1
- package/dist/description-list/item/description-list-item.js +1 -6
- package/dist/description-list/root/description-list-root.css.js +1 -2
- package/dist/description-list/root/description-list-root.js +1 -6
- package/dist/dialog/root/dialog-root.css.js +1 -15
- package/dist/dialog/root/dialog-root.js +1 -6
- package/dist/divider/root/divider-root.css.js +1 -9
- package/dist/divider/root/divider-root.js +1 -6
- package/dist/donut-chart/root/donut-chart-root.css.js +1 -20
- package/dist/donut-chart/root/donut-chart-root.js +1 -6
- package/dist/drawer/root/drawer-root.css.js +1 -22
- package/dist/drawer/root/drawer-root.js +1 -6
- package/dist/drilldown/item/drilldown-item.css.js +1 -6
- package/dist/drilldown/item/drilldown-item.js +1 -6
- package/dist/drilldown/root/drilldown-root.css.js +1 -8
- package/dist/drilldown/root/drilldown-root.js +1 -6
- package/dist/empty/root/empty-root.css.js +1 -2
- package/dist/empty/root/empty-root.js +1 -6
- package/dist/file-input/root/file-input-root.css.js +1 -9
- package/dist/file-input/root/file-input-root.js +1 -6
- package/dist/filter-input/chip/filter-chip.css.js +1 -2
- package/dist/filter-input/chip/filter-chip.js +1 -6
- package/dist/filter-input/field/filter-field.css.js +1 -1
- package/dist/filter-input/field/filter-field.js +1 -6
- package/dist/filter-input/menu/filter-menu.css.js +1 -1
- package/dist/filter-input/menu/filter-menu.js +1 -6
- package/dist/filter-input/operator/filter-operator.css.js +1 -1
- package/dist/filter-input/operator/filter-operator.js +1 -6
- package/dist/filter-input/root/filter-input-root.css.js +1 -8
- package/dist/filter-input/root/filter-input-root.js +1 -6
- package/dist/flex/root/flex-root.css.js +1 -6
- package/dist/flex/root/flex-root.js +1 -6
- package/dist/format-date/root/format-date-root.css.js +1 -1
- package/dist/format-date/root/format-date-root.js +1 -6
- package/dist/graph/root/graph-root.css.js +1 -23
- package/dist/graph/root/graph-root.js +1 -6
- package/dist/grid/root/grid-root.css.js +1 -1
- package/dist/grid/root/grid-root.js +1 -6
- package/dist/heatmap/root/heatmap-root.css.js +1 -22
- package/dist/heatmap/root/heatmap-root.js +1 -6
- package/dist/icon/root/icon-root.css.js +1 -8
- package/dist/icon/root/icon-root.js +1 -6
- package/dist/icon-button/root/icon-button-root.css.js +1 -97
- package/dist/icon-button/root/icon-button-root.js +1 -6
- package/dist/image/root/image-root.css.js +1 -7
- package/dist/image/root/image-root.js +1 -6
- package/dist/input/root/input-root.css.js +1 -7
- package/dist/input/root/input-root.js +1 -6
- package/dist/kbd/root/kbd-root.css.js +1 -3
- package/dist/kbd/root/kbd-root.js +1 -6
- package/dist/legend/root/legend-root.css.js +1 -15
- package/dist/legend/root/legend-root.js +1 -6
- package/dist/lightbox/item/lightbox-item.css.js +1 -1
- package/dist/lightbox/item/lightbox-item.js +1 -6
- package/dist/lightbox/root/lightbox-root.css.js +1 -50
- package/dist/lightbox/root/lightbox-root.js +1 -6
- package/dist/line-chart/root/line-chart-root.css.js +1 -7
- package/dist/line-chart/root/line-chart-root.js +1 -6
- package/dist/list/item/list-item.css.js +1 -4
- package/dist/list/item/list-item.js +1 -6
- package/dist/list/root/list-root.css.js +1 -5
- package/dist/list/root/list-root.js +1 -6
- package/dist/listbox/reorder/listbox-drag-preview.css.js +1 -2
- package/dist/listbox/reorder/listbox-reorder.css.js +1 -3
- package/dist/listbox/root/listbox-root.css.js +1 -7
- package/dist/listbox/root/listbox-root.js +1 -6
- package/dist/loader/root/loader-root.css.js +1 -5
- package/dist/loader/root/loader-root.js +1 -6
- package/dist/map/area/map-area.css.js +1 -1
- package/dist/map/area/map-area.js +1 -6
- package/dist/map/buildings/map-buildings.css.js +1 -1
- package/dist/map/buildings/map-buildings.js +1 -6
- package/dist/map/contours/map-contours.css.js +1 -4
- package/dist/map/contours/map-contours.js +1 -6
- package/dist/map/landcover/map-landcover.css.js +1 -1
- package/dist/map/landcover/map-landcover.js +1 -6
- package/dist/map/marker/map-marker.css.js +1 -31
- package/dist/map/marker/map-marker.js +1 -6
- package/dist/map/points/map-points.css.js +1 -1
- package/dist/map/points/map-points.js +1 -6
- package/dist/map/position/map-position.css.js +1 -21
- package/dist/map/position/map-position.js +1 -6
- package/dist/map/raster/map-raster.css.js +1 -1
- package/dist/map/raster/map-raster.js +1 -6
- package/dist/map/root/map-root.css.js +1 -23
- package/dist/map/root/map-root.js +1 -6
- package/dist/map/route/map-route.css.js +1 -1
- package/dist/map/route/map-route.js +1 -6
- package/dist/map/terrain/map-terrain.css.js +1 -7
- package/dist/map/terrain/map-terrain.js +1 -6
- package/dist/megamenu/root/megamenu-root.css.js +1 -21
- package/dist/megamenu/root/megamenu-root.js +1 -6
- package/dist/menu/item/menu-item.css.js +1 -17
- package/dist/menu/item/menu-item.js +1 -6
- package/dist/menu/root/menu-root.css.js +1 -1
- package/dist/menu/root/menu-root.js +1 -6
- package/dist/menu/section/menu-section.css.js +1 -1
- package/dist/menu/section/menu-section.js +1 -6
- package/dist/meter/root/meter-root.css.js +1 -30
- package/dist/meter/root/meter-root.js +1 -6
- package/dist/navigation/root/navigation-root.css.js +1 -10
- package/dist/navigation/root/navigation-root.js +1 -6
- package/dist/notifications/group/notification-group.css.js +1 -1
- package/dist/notifications/group/notification-group.js +1 -6
- package/dist/notifications/notification/notification.css.js +1 -30
- package/dist/notifications/notification/notification.js +1 -6
- package/dist/notifications/root/notifications-root.css.js +1 -9
- package/dist/notifications/root/notifications-root.js +1 -6
- package/dist/number-input/root/number-input-root.css.js +1 -13
- package/dist/number-input/root/number-input-root.js +1 -6
- package/dist/object-inspector/root/object-inspector-root.css.js +1 -23
- package/dist/object-inspector/root/object-inspector-root.js +1 -6
- package/dist/option/group/option-group.css.js +1 -1
- package/dist/option/group/option-group.js +1 -6
- package/dist/option/root/option-root.css.js +1 -9
- package/dist/option/root/option-root.js +1 -6
- package/dist/option/separator/option-separator.css.js +1 -2
- package/dist/option/separator/option-separator.js +1 -6
- package/dist/orb/root/orb-root.css.js +1 -1
- package/dist/orb/root/orb-root.js +1 -6
- package/dist/outline/root/outline-root.css.js +1 -41
- package/dist/outline/root/outline-root.js +1 -6
- package/dist/pagination/root/pagination-root.css.js +1 -36
- package/dist/pagination/root/pagination-root.js +1 -6
- package/dist/pagination/size/pagination-size.css.js +1 -1
- package/dist/pagination/size/pagination-size.js +1 -6
- package/dist/pagination/summary/pagination-summary.css.js +1 -1
- package/dist/pagination/summary/pagination-summary.js +1 -6
- package/dist/pin-input/root/pin-input-root.css.js +1 -2
- package/dist/pin-input/root/pin-input-root.js +1 -6
- package/dist/popover/root/popover-root.css.js +1 -10
- package/dist/popover/root/popover-root.js +1 -6
- package/dist/progress/root/progress-root.css.js +1 -25
- package/dist/progress/root/progress-root.js +1 -6
- package/dist/qr-code/root/qr-code-root.css.js +1 -1
- package/dist/qr-code/root/qr-code-root.js +1 -6
- package/dist/quote/root/quote-root.css.js +1 -1
- package/dist/quote/root/quote-root.js +1 -6
- package/dist/radio/group/radio-group.css.js +1 -1
- package/dist/radio/group/radio-group.js +1 -6
- package/dist/radio/root/radio-root.css.js +1 -9
- package/dist/radio/root/radio-root.js +1 -6
- package/dist/rating/root/rating-root.css.js +1 -13
- package/dist/rating/root/rating-root.js +1 -6
- package/dist/sandbox/preview/sandbox-preview.css.js +1 -4
- package/dist/sandbox/preview/sandbox-preview.js +1 -6
- package/dist/sandbox/root/sandbox-root.css.js +1 -3
- package/dist/sandbox/root/sandbox-root.js +1 -6
- package/dist/sandbox/source/sandbox-source.css.js +1 -4
- package/dist/sandbox/source/sandbox-source.js +1 -6
- package/dist/sandbox/status-bar/sandbox-status-bar.css.js +1 -1
- package/dist/sandbox/status-bar/sandbox-status-bar.js +1 -6
- package/dist/sandbox/terminal/sandbox-terminal.css.js +1 -5
- package/dist/sandbox/terminal/sandbox-terminal.js +1 -6
- package/dist/sandbox/toolbar/sandbox-toolbar.css.js +1 -1
- package/dist/sandbox/toolbar/sandbox-toolbar.js +1 -6
- package/dist/scatter-chart/root/scatter-chart-root.css.js +1 -16
- package/dist/scatter-chart/root/scatter-chart-root.js +1 -6
- package/dist/scroll-area/root/scroll-area-root.css.js +1 -37
- package/dist/scroll-area/root/scroll-area-root.js +1 -6
- package/dist/select/root/select-root.css.js +1 -8
- package/dist/select/root/select-root.js +1 -6
- package/dist/shared/chart/series.css.js +1 -1
- package/dist/shared/chart/status.css.js +1 -2
- package/dist/shared/chart/terminus.css.js +1 -1
- package/dist/shared/chart/tooltip.css.js +1 -1
- package/dist/shared/collection/state.css.js +1 -2
- package/dist/shared/field/field-frame.css.js +1 -5
- package/dist/shared/field/field-inline.css.js +1 -2
- package/dist/shared/field/field-segments.css.js +1 -1
- package/dist/shared/field/field-stacked.css.js +1 -1
- package/dist/shared/field/field.css.js +1 -3
- package/dist/shared/floating/entrance.css.js +1 -7
- package/dist/shared/floating/panel.css.js +1 -2
- package/dist/shared/glyph/glyph.css.js +1 -1
- package/dist/shared/live/live.css.js +1 -1
- package/dist/shared/mixin-control-surface/mixin-control-surface.js +1 -6
- package/dist/shared/tags/tags.css.js +1 -1
- package/dist/shared/viewport/viewport.css.js +1 -20
- package/dist/skeleton/root/skeleton-root.css.js +1 -23
- package/dist/skeleton/root/skeleton-root.js +1 -6
- package/dist/skip-link/root/skip-link-root.css.js +1 -2
- package/dist/skip-link/root/skip-link-root.js +1 -6
- package/dist/slider/root/slider-root.css.js +1 -83
- package/dist/slider/root/slider-root.js +1 -6
- package/dist/sparkline/root/sparkline-root.css.js +1 -16
- package/dist/sparkline/root/sparkline-root.js +1 -6
- package/dist/speed-dial/group/speed-dial-group.css.js +1 -1
- package/dist/speed-dial/group/speed-dial-group.js +1 -6
- package/dist/speed-dial/item/speed-dial-item.css.js +1 -7
- package/dist/speed-dial/item/speed-dial-item.js +1 -6
- package/dist/speed-dial/root/speed-dial-root.css.js +1 -5
- package/dist/speed-dial/root/speed-dial-root.js +1 -6
- package/dist/splitter/root/splitter-root.css.js +1 -29
- package/dist/splitter/root/splitter-root.js +1 -6
- package/dist/stat/group/stat-group.css.js +1 -1
- package/dist/stat/group/stat-group.js +1 -6
- package/dist/stat/root/stat-root.css.js +1 -3
- package/dist/stat/root/stat-root.js +1 -6
- package/dist/steps/root/steps-root.css.js +1 -33
- package/dist/steps/root/steps-root.js +1 -6
- package/dist/steps/step/step.css.js +1 -7
- package/dist/steps/step/step.js +1 -6
- package/dist/strands/root/strands-root.css.js +1 -7
- package/dist/strands/root/strands-root.js +1 -6
- package/dist/strands/stop/strands-stop.css.js +1 -1
- package/dist/strands/stop/strands-stop.js +1 -6
- package/dist/switch/root/switch-root.css.js +1 -3
- package/dist/switch/root/switch-root.js +1 -6
- package/dist/table/cell/table-cell.css.js +1 -1
- package/dist/table/cell/table-cell.js +1 -6
- package/dist/table/column/table-column.css.js +1 -10
- package/dist/table/column/table-column.js +1 -6
- package/dist/table/root/table-root.css.js +1 -10
- package/dist/table/root/table-root.js +1 -6
- package/dist/table/row/table-row.css.js +1 -24
- package/dist/table/row/table-row.js +1 -6
- package/dist/tabs/panel/tab-panel.css.js +1 -4
- package/dist/tabs/panel/tab-panel.js +1 -6
- package/dist/tabs/root/tabs-root.css.js +1 -22
- package/dist/tabs/root/tabs-root.js +1 -6
- package/dist/tabs/tab/tab.css.js +1 -12
- package/dist/tabs/tab/tab.js +1 -6
- package/dist/tag/group/tag-group.css.js +1 -1
- package/dist/tag/group/tag-group.js +1 -6
- package/dist/tag/root/tag-root.css.js +1 -1
- package/dist/tag/root/tag-root.js +1 -6
- package/dist/text/root/text-root.css.js +1 -30
- package/dist/text/root/text-root.js +1 -6
- package/dist/textarea/root/textarea-root.css.js +1 -4
- package/dist/textarea/root/textarea-root.js +1 -6
- package/dist/time-input/root/time-input-root.css.js +1 -18
- package/dist/time-input/root/time-input-root.js +1 -6
- package/dist/time-picker/root/time-picker-root.css.js +1 -22
- package/dist/time-picker/root/time-picker-root.js +1 -6
- package/dist/timeline/group/timeline-group.css.js +1 -1
- package/dist/timeline/group/timeline-group.js +1 -6
- package/dist/timeline/item/timeline-item.css.js +1 -11
- package/dist/timeline/item/timeline-item.js +1 -6
- package/dist/timeline/root/timeline-root.css.js +1 -1
- package/dist/timeline/root/timeline-root.js +1 -6
- package/dist/toast/item/toast-item.css.js +1 -25
- package/dist/toast/item/toast-item.js +1 -6
- package/dist/toast/root/toast-root.css.js +1 -1
- package/dist/toast/root/toast-root.js +1 -6
- package/dist/toggle/group/toggle-group.css.js +1 -13
- package/dist/toggle/group/toggle-group.js +1 -6
- package/dist/toggle/root/toggle-root.css.js +1 -1
- package/dist/toggle/root/toggle-root.js +1 -6
- package/dist/toolbar/root/toolbar-root.css.js +1 -1
- package/dist/toolbar/root/toolbar-root.js +1 -6
- package/dist/tooltip/root/tooltip-root.css.js +1 -8
- package/dist/tooltip/root/tooltip-root.js +1 -6
- package/dist/tour/root/tour-root.css.js +1 -5
- package/dist/tour/root/tour-root.js +1 -6
- package/dist/tour/stop/tour-stop.css.js +1 -2
- package/dist/tour/stop/tour-stop.js +1 -6
- package/dist/tree/item/tree-item.css.js +1 -26
- package/dist/tree/item/tree-item.js +1 -6
- package/dist/tree/root/tree-root.css.js +1 -2
- package/dist/tree/root/tree-root.js +1 -6
- package/dist/trend/root/trend-root.css.js +1 -5
- package/dist/trend/root/trend-root.js +1 -6
- package/dist/video/root/video-root.css.js +1 -28
- package/dist/video/root/video-root.js +1 -6
- package/dist/video-playlist/item/video-playlist-item.css.js +1 -15
- package/dist/video-playlist/item/video-playlist-item.js +1 -6
- package/dist/video-playlist/menu/video-playlist-menu.css.js +1 -1
- package/dist/video-playlist/menu/video-playlist-menu.js +1 -6
- package/dist/video-playlist/root/video-playlist-root.css.js +1 -1
- package/dist/video-playlist/root/video-playlist-root.js +1 -6
- package/dist/virtual-list/reorder/virtual-list-reorder.css.js +1 -11
- package/dist/virtual-list/root/virtual-list-root.css.js +1 -10
- package/dist/virtual-list/root/virtual-list-root.js +1 -6
- package/lint.json +1 -1
- package/package.json +7 -6
- package/types/jsx.d.ts +214 -204
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTimeInput } from '@fusion.dev/helix-headless/time-input';
|
|
9
4
|
import '../../tag/root/index.js';
|
|
@@ -1,23 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: block
|
|
3
|
-
--time-picker-list-block-size,
|
|
4
|
-
calc(var(--helix-size-control-tight) * 7)
|
|
5
|
-
);display: block;}[part="list"]::part(items) {background-color: transparent;border: none;border-radius: var(--helix-radii-none);padding-block: var(--helix-space-none);}:host([mode="range"]) [part~="option"]:state(selected)::part(item) {background-color: var(--helix-color-surface-inverse);color: var(--helix-color-foreground-inverse);}[part~="option"][data-between]::part(item) {background-color: var(
|
|
6
|
-
--time-picker-range-color,
|
|
7
|
-
light-dark(
|
|
8
|
-
color-mix(in oklab, var(--helix-color-foreground) 10%, transparent),
|
|
9
|
-
color-mix(in oklab, var(--helix-color-foreground) 14%, transparent)
|
|
10
|
-
)
|
|
11
|
-
);}[part~="option"][data-between]::part(item)::after {content: "";background-color: currentColor;block-size: var(--helix-size-icon-tight);border-radius: var(--helix-radii-full);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto;opacity: 0.4;scale: 0.3;}[part="columns"] {display: flex;gap: var(--time-picker-columns-gap, var(--helix-space-none));}[part="column"] {--_time-row: var(--time-picker-row-size, var(--helix-size-control));--listbox-max-block-size: var(--time-picker-wheel-block-size, calc(var(--_time-row) * 5));flex: 1 1 auto;min-inline-size: max-content;}[part="column"]::part(items) {background-color: transparent;border: none;border-radius: var(--helix-radii-none);mask-image: var(
|
|
12
|
-
--time-picker-wheel-mask,
|
|
13
|
-
linear-gradient(to bottom, transparent, black 25%, black 75%, transparent)
|
|
14
|
-
);padding-block: calc((var(--listbox-max-block-size) - var(--_time-row)) / 2);scroll-snap-type: y mandatory;scrollbar-width: none;}[part="column"] [part~="option"] {scroll-snap-align: center;}[part="column"] [part~="option"]::part(item) {justify-content: center;}[part="column"] [part~="option"]::part(label) {text-align: center;}[part="column"] [part~="option"]::part(item) {min-block-size: var(--_time-row);min-inline-size: var(--_time-row);padding-block: var(--helix-space-none);padding-inline: var(--helix-space-sm);}[part="column"] [part~="option"]::part(item) {background-color: transparent;}[part="column"] [part~="option"]::part(label) {align-items: center;block-size: var(--_time-row);border-radius: var(--time-picker-mark-radius, var(--helix-radii-sm));display: inline-flex;justify-content: center;min-inline-size: var(--_time-row);padding-inline: var(--helix-space-2xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard);}[part="column"] [part~="option"]:not([disabled]):hover::part(label),
|
|
15
|
-
[part="column"] [part~="option"]:state(active)::part(label) {background-color: var(--time-picker-hover-background-color, var(--helix-color-surface-sunken));}[part="column"] [part~="option"]:state(selected)::part(label) {background-color: var(--time-picker-selected-color, var(--helix-color-surface-inverse));color: var(--time-picker-selected-foreground-color, var(--helix-color-foreground-inverse));}[part="column"] [part~="option"]::part(item)::after {content: none;}:host([invalid]) [part~="option"]:state(selected)::part(item),
|
|
16
|
-
:host([invalid]) [part="column"] [part~="option"]:state(selected)::part(label),
|
|
17
|
-
:host(:state(invalid)) [part~="option"]:state(selected)::part(item),
|
|
18
|
-
:host(:state(invalid)) [part="column"] [part~="option"]:state(selected)::part(label) {outline: var(--helix-size-focus-ring) solid
|
|
19
|
-
var(--time-picker-invalid-color, var(--helix-color-danger));outline-offset: var(--helix-size-focus-offset);}:host([invalid]) [part="list"][data-unset],
|
|
20
|
-
:host([invalid]) [part="columns"][data-unset],
|
|
21
|
-
:host(:state(invalid)) [part="list"][data-unset],
|
|
22
|
-
:host(:state(invalid)) [part="columns"][data-unset] {border-radius: var(--helix-radii-sm);outline: var(--helix-size-focus-ring) solid
|
|
23
|
-
var(--time-picker-invalid-color, var(--helix-color-danger));outline-offset: var(--helix-size-focus-offset);}[part="hint"] {color: var(--helix-color-foreground-subtle);font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);margin: var(--helix-space-sm) var(--helix-space-none) var(--helix-space-none);}[part="feedback"] {color: var(--time-picker-feedback-color, var(--helix-color-danger));font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);margin: var(--helix-space-sm) var(--helix-space-none) var(--helix-space-none);}[part="now"] {all: unset;align-items: center;block-size: var(--helix-size-control-tight);border-radius: var(--helix-radii-sm);box-sizing: border-box;color: var(--time-picker-now-color, var(--helix-color-primary));cursor: pointer;display: inline-flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);margin-block-start: var(--helix-space-xs);padding-inline: var(--helix-space-xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard);}[part="now"]:not(:disabled):hover {background-color: var(--helix-color-surface-raised);}[part="now"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset);}[part="now"]:disabled {color: var(--helix-color-foreground-subtle);cursor: not-allowed;}@media print {:host {print-color-adjust: exact;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: block}[part="label"] {color: var(--helix-color-foreground);display: block;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);line-height: var(--helix-leading-tight);padding-block-end: var(--helix-space-2xs)}[part="list"] {--listbox-max-block-size: var(--time-picker-list-block-size, calc(var(--helix-size-control-tight) * 7));display: block}[part="list"]::part(items) {background-color: transparent;border: none;border-radius: var(--helix-radii-none);padding-block: var(--helix-space-none)}:host([mode="range"]) [part~="option"]:state(selected)::part(item) {background-color: var(--helix-color-surface-inverse);color: var(--helix-color-foreground-inverse)}[part~="option"][data-between]::part(item) {background-color: var(--time-picker-range-color, light-dark(color-mix(in oklab, var(--helix-color-foreground) 10%, transparent), color-mix(in oklab, var(--helix-color-foreground) 14%, transparent)))}[part~="option"][data-between]::part(item)::after {content: "";background-color: currentColor;block-size: var(--helix-size-icon-tight);border-radius: var(--helix-radii-full);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto;opacity: 0.4;scale: 0.3}[part="columns"] {display: flex;gap: var(--time-picker-columns-gap, var(--helix-space-none))}[part="column"] {--_time-row: var(--time-picker-row-size, var(--helix-size-control));--listbox-max-block-size: var(--time-picker-wheel-block-size, calc(var(--_time-row) * 5));flex: 1 1 auto;min-inline-size: max-content}[part="column"]::part(items) {background-color: transparent;border: none;border-radius: var(--helix-radii-none);mask-image: var(--time-picker-wheel-mask, linear-gradient(to bottom, transparent, black 25%, black 75%, transparent));padding-block: calc((var(--listbox-max-block-size) - var(--_time-row)) / 2);scroll-snap-type: y mandatory;scrollbar-width: none}[part="column"] [part~="option"] {scroll-snap-align: center}[part="column"] [part~="option"]::part(item) {justify-content: center}[part="column"] [part~="option"]::part(label) {text-align: center}[part="column"] [part~="option"]::part(item) {min-block-size: var(--_time-row);min-inline-size: var(--_time-row);padding-block: var(--helix-space-none);padding-inline: var(--helix-space-sm)}[part="column"] [part~="option"]::part(item) {background-color: transparent}[part="column"] [part~="option"]::part(label) {align-items: center;block-size: var(--_time-row);border-radius: var(--time-picker-mark-radius, var(--helix-radii-sm));display: inline-flex;justify-content: center;min-inline-size: var(--_time-row);padding-inline: var(--helix-space-2xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard)}[part="column"] [part~="option"]:not([disabled]):hover::part(label), [part="column"] [part~="option"]:state(active)::part(label) {background-color: var(--time-picker-hover-background-color, var(--helix-color-surface-sunken))}[part="column"] [part~="option"]:state(selected)::part(label) {background-color: var(--time-picker-selected-color, var(--helix-color-surface-inverse));color: var(--time-picker-selected-foreground-color, var(--helix-color-foreground-inverse))}[part="column"] [part~="option"]::part(item)::after {content: none}:host([invalid]) [part~="option"]:state(selected)::part(item), :host([invalid]) [part="column"] [part~="option"]:state(selected)::part(label), :host(:state(invalid)) [part~="option"]:state(selected)::part(item), :host(:state(invalid)) [part="column"] [part~="option"]:state(selected)::part(label) {outline: var(--helix-size-focus-ring) solid var(--time-picker-invalid-color, var(--helix-color-danger));outline-offset: var(--helix-size-focus-offset)}:host([invalid]) [part="list"][data-unset], :host([invalid]) [part="columns"][data-unset], :host(:state(invalid)) [part="list"][data-unset], :host(:state(invalid)) [part="columns"][data-unset] {border-radius: var(--helix-radii-sm);outline: var(--helix-size-focus-ring) solid var(--time-picker-invalid-color, var(--helix-color-danger));outline-offset: var(--helix-size-focus-offset)}[part="hint"] {color: var(--helix-color-foreground-subtle);font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);margin: var(--helix-space-sm) var(--helix-space-none) var(--helix-space-none)}[part="feedback"] {color: var(--time-picker-feedback-color, var(--helix-color-danger));font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);margin: var(--helix-space-sm) var(--helix-space-none) var(--helix-space-none)}[part="now"] {all: unset;align-items: center;block-size: var(--helix-size-control-tight);border-radius: var(--helix-radii-sm);box-sizing: border-box;color: var(--time-picker-now-color, var(--helix-color-primary));cursor: pointer;display: inline-flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);margin-block-start: var(--helix-space-xs);padding-inline: var(--helix-space-xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard)}[part="now"]:not(:disabled):hover {background-color: var(--helix-color-surface-raised)}[part="now"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}[part="now"]:disabled {color: var(--helix-color-foreground-subtle);cursor: not-allowed}@media print {:host {print-color-adjust: exact}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTimePicker } from '@fusion.dev/helix-headless/time-picker';
|
|
9
4
|
import '../../listbox/index.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: block;padding-block-end: var(--timeline-gap, var(--helix-space-lg))
|
|
2
|
+
export const styles = createSheet(`:host {display: block;padding-block-end: var(--timeline-gap, var(--helix-space-lg))}:host(:last-child) {padding-block-end: var(--helix-space-none)}[part="heading"] {color: var(--timeline-group-heading-color, var(--helix-color-foreground));font-size: var(--helix-text-sm);font-weight: var(--helix-weight-semibold);padding-block-end: var(--helix-space-sm)}[part="entries"] {display: flex;flex-direction: var(--_timeline-direction, column)}::slotted(*) {flex: var(--_timeline-entry-flex, 0 1 auto);min-inline-size: 0}@media print {:host {break-inside: avoid-page}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTimelineGroup } from '@fusion.dev/helix-headless/timeline';
|
|
9
4
|
import { styles } from './timeline-group.css.js';
|
|
@@ -1,12 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {column-gap: var(--timeline-column-gap, var(--helix-space-md));display: grid;grid-template-columns: var(--_timeline-columns, auto minmax(0, 1fr));grid-template-rows: var(--_timeline-rows, auto minmax(0, 1fr))
|
|
3
|
-
to bottom,
|
|
4
|
-
var(--timeline-rail-color, var(--helix-color-border)) 0 var(--helix-space-2xs),
|
|
5
|
-
transparent var(--helix-space-2xs) var(--helix-space-xs)
|
|
6
|
-
);}[part="rail"]::after {align-self: var(--_timeline-leave-align, stretch);background-color: var(--timeline-rail-color, var(--helix-color-border));block-size: var(--_timeline-leave-block-size, auto);content: "";grid-column: var(--_timeline-leave-column, 1);grid-row: var(--_timeline-leave-row, 2);inline-size: var(
|
|
7
|
-
--_timeline-leave-inline-size,
|
|
8
|
-
var(--timeline-rail-size, var(--helix-border-thin))
|
|
9
|
-
);justify-self: var(--_timeline-leave-justify, auto);margin-block-start: var(
|
|
10
|
-
--_timeline-leave-margin-block,
|
|
11
|
-
var(--timeline-marker-size, var(--helix-size-icon-md))
|
|
12
|
-
);}:host(:last-child) [part="rail"]::after {visibility: hidden;}[part="marker"] {--icon-size: var(--helix-size-icon-sm);align-items: center;align-self: start;aspect-ratio: 1;border-radius: var(--timeline-marker-radius, var(--helix-radii-full));color: var(--_timeline-tone, var(--timeline-marker-color, var(--helix-color-foreground-subtle)));display: inline-flex;grid-column: 1;grid-row: var(--_timeline-marker-row, 2);inline-size: var(--timeline-marker-size, var(--helix-size-icon-md));justify-content: center;}[part="dot"] {block-size: var(--helix-size-icon-sm);inline-size: var(--helix-size-icon-sm);}:host([tone="danger"]) {--_timeline-tone: var(--helix-color-danger);}:host([tone="info"]) {--_timeline-tone: var(--helix-color-info);}:host([tone="neutral"]) {--_timeline-tone: var(--helix-color-foreground-muted);}:host([tone="primary"]) {--_timeline-tone: var(--helix-color-primary);}:host([tone="success"]) {--_timeline-tone: var(--helix-color-success);}:host([tone="warning"]) {--_timeline-tone: var(--helix-color-warning);}[part="time"] {color: var(--timeline-time-color, var(--helix-color-foreground-muted));font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);font-weight: var(--helix-weight-medium);grid-column: var(--_timeline-time-column, 2);grid-row: var(--_timeline-time-row, 1);padding-block-end: var(--helix-space-2xs);text-align: var(--_timeline-time-align);}[part="content"] {display: flex;flex-direction: column;gap: var(--helix-space-2xs);grid-column: var(--_timeline-content-column, 2);grid-row: var(--_timeline-content-row, 2);min-inline-size: 0;padding-block-end: var(--_timeline-content-block-end, var(--timeline-gap, var(--helix-space-lg)));padding-inline-end: var(--_timeline-content-inline-end, var(--helix-space-none));}:host(:last-child) [part="content"] {padding-block-end: var(--helix-space-none);padding-inline-end: var(--helix-space-none);}:host(:nth-child(even)) [part="time"] {grid-column: var(--_timeline-even-column, var(--_timeline-time-column, 2));text-align: var(--_timeline-even-align, var(--_timeline-time-align));}:host(:nth-child(even)) [part="content"] {grid-column: var(--_timeline-even-column, var(--_timeline-content-column, 2));text-align: var(--_timeline-even-align);}`);
|
|
2
|
+
export const styles = createSheet(`:host {column-gap: var(--timeline-column-gap, var(--helix-space-md));display: grid;grid-template-columns: var(--_timeline-columns, auto minmax(0, 1fr));grid-template-rows: var(--_timeline-rows, auto minmax(0, 1fr))}[part="rail"] {align-items: var(--_timeline-rail-align, normal);display: grid;grid-column: var(--_timeline-rail-column, auto);grid-row: var(--_timeline-rail-row, 1 / -1);grid-template-columns: var(--_timeline-rail-columns, none);grid-template-rows: var(--_timeline-rail-rows, subgrid);justify-items: var(--_timeline-rail-justify, center)}[part="rail"]::before {background-color: var(--timeline-rail-color, var(--helix-color-border));block-size: 100%;content: "";display: var(--_timeline-arrive-display, block);grid-column: 1;grid-row: 1;inline-size: var(--timeline-rail-size, var(--helix-border-thin))}:host(:first-child) [part="rail"]::before {visibility: hidden}:host([pending]) [part="rail"]::before {background-color: transparent;background-image: repeating-linear-gradient(to bottom, var(--timeline-rail-color, var(--helix-color-border)) 0 var(--helix-space-2xs), transparent var(--helix-space-2xs) var(--helix-space-xs))}[part="rail"]::after {align-self: var(--_timeline-leave-align, stretch);background-color: var(--timeline-rail-color, var(--helix-color-border));block-size: var(--_timeline-leave-block-size, auto);content: "";grid-column: var(--_timeline-leave-column, 1);grid-row: var(--_timeline-leave-row, 2);inline-size: var(--_timeline-leave-inline-size, var(--timeline-rail-size, var(--helix-border-thin)));justify-self: var(--_timeline-leave-justify, auto);margin-block-start: var(--_timeline-leave-margin-block, var(--timeline-marker-size, var(--helix-size-icon-md)))}:host(:last-child) [part="rail"]::after {visibility: hidden}[part="marker"] {--icon-size: var(--helix-size-icon-sm);align-items: center;align-self: start;aspect-ratio: 1;border-radius: var(--timeline-marker-radius, var(--helix-radii-full));color: var(--_timeline-tone, var(--timeline-marker-color, var(--helix-color-foreground-subtle)));display: inline-flex;grid-column: 1;grid-row: var(--_timeline-marker-row, 2);inline-size: var(--timeline-marker-size, var(--helix-size-icon-md));justify-content: center}[part="dot"] {block-size: var(--helix-size-icon-sm);inline-size: var(--helix-size-icon-sm)}:host([tone="danger"]) {--_timeline-tone: var(--helix-color-danger)}:host([tone="info"]) {--_timeline-tone: var(--helix-color-info)}:host([tone="neutral"]) {--_timeline-tone: var(--helix-color-foreground-muted)}:host([tone="primary"]) {--_timeline-tone: var(--helix-color-primary)}:host([tone="success"]) {--_timeline-tone: var(--helix-color-success)}:host([tone="warning"]) {--_timeline-tone: var(--helix-color-warning)}[part="time"] {color: var(--timeline-time-color, var(--helix-color-foreground-muted));font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);font-weight: var(--helix-weight-medium);grid-column: var(--_timeline-time-column, 2);grid-row: var(--_timeline-time-row, 1);padding-block-end: var(--helix-space-2xs);text-align: var(--_timeline-time-align)}[part="content"] {display: flex;flex-direction: column;gap: var(--helix-space-2xs);grid-column: var(--_timeline-content-column, 2);grid-row: var(--_timeline-content-row, 2);min-inline-size: 0;padding-block-end: var(--_timeline-content-block-end, var(--timeline-gap, var(--helix-space-lg)));padding-inline-end: var(--_timeline-content-inline-end, var(--helix-space-none))}:host(:last-child) [part="content"] {padding-block-end: var(--helix-space-none);padding-inline-end: var(--helix-space-none)}:host(:nth-child(even)) [part="time"] {grid-column: var(--_timeline-even-column, var(--_timeline-time-column, 2));text-align: var(--_timeline-even-align, var(--_timeline-time-align))}:host(:nth-child(even)) [part="content"] {grid-column: var(--_timeline-even-column, var(--_timeline-content-column, 2));text-align: var(--_timeline-even-align)}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTimelineItem } from '@fusion.dev/helix-headless/timeline';
|
|
9
4
|
import { styles } from './timeline-item.css.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: flex;flex-direction: column
|
|
2
|
+
export const styles = createSheet(`:host {display: flex;flex-direction: column}:host([layout="opposite"]) {--_timeline-columns: minmax(0, 1fr) auto minmax(0, 1fr);--_timeline-content-column: 3;--_timeline-rail-column: 2;--_timeline-time-align: end;--_timeline-time-column: 1;--_timeline-time-row: 2}:host([layout="alternate"]) {--_timeline-columns: minmax(0, 1fr) auto minmax(0, 1fr);--_timeline-content-column: 3;--_timeline-even-align: end;--_timeline-even-column: 1;--_timeline-rail-column: 2;--_timeline-time-column: 3}:host([orientation="horizontal"]) {--_timeline-arrive-display: none;--_timeline-columns: minmax(0, 1fr);--_timeline-content-block-end: var(--helix-space-none);--_timeline-content-column: 1;--_timeline-content-inline-end: var(--timeline-gap, var(--helix-space-lg));--_timeline-content-row: 3;--_timeline-direction: row;--_timeline-entry-flex: 1 1 0;--_timeline-even-align: initial;--_timeline-even-column: initial;--_timeline-leave-align: center;--_timeline-leave-block-size: var(--timeline-rail-size, var(--helix-border-thin));--_timeline-leave-column: 2;--_timeline-leave-inline-size: auto;--_timeline-leave-justify: stretch;--_timeline-leave-margin-block: var(--helix-space-none);--_timeline-leave-row: 1;--_timeline-marker-row: 1;--_timeline-rail-align: center;--_timeline-rail-column: 1;--_timeline-rail-columns: auto minmax(0, 1fr);--_timeline-rail-justify: start;--_timeline-rail-row: 1;--_timeline-rail-rows: auto;--_timeline-rows: auto auto minmax(0, 1fr);--_timeline-time-align: initial;--_timeline-time-column: 1;--_timeline-time-row: 2;flex-direction: row}:host([orientation="horizontal"]) ::slotted(*) {flex: 1 1 0;min-inline-size: 0}[part="loading"] {color: var(--timeline-time-color, var(--helix-color-foreground-muted));font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);padding-block-start: var(--timeline-gap, var(--helix-space-lg))}:host([orientation="horizontal"]) [part="loading"] {padding-block-start: var(--helix-space-none)}@media print {:host {print-color-adjust: economy}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTimeline } from '@fusion.dev/helix-headless/timeline';
|
|
9
4
|
import { property } from 'lit/decorators.js';
|
|
@@ -1,26 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-sm);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--_toast-line: calc(var(--toast-font-size, var(--helix-text-sm)) * var(--helix-leading-normal));display: grid;grid-template-rows: minmax(0, 1fr);margin-block-start: var(--_toast-gap, var(--helix-space-xs));transition:
|
|
3
|
-
grid-template-rows var(--helix-duration-normal) var(--helix-easing-decelerate),
|
|
4
|
-
margin-block-start var(--helix-duration-normal) var(--helix-easing-decelerate),
|
|
5
|
-
opacity var(--helix-duration-normal) var(--helix-easing-decelerate),
|
|
6
|
-
translate var(--helix-duration-normal) var(--helix-easing-decelerate);inline-size: var(--toast-inline-size, 22rem);max-inline-size: calc(100vw - var(--helix-space-xl));}[part="item"] {align-items: start;display: grid;grid-template-columns: auto 1fr;background-color: var(--toast-background-color, var(--helix-color-surface-overlay));border-radius: var(--toast-radius, var(--helix-radii-sm));border: var(--toast-border-width, var(--helix-border-floating)) solid
|
|
7
|
-
var(--toast-border-color, var(--helix-color-border));box-shadow: var(--toast-shadow, var(--helix-shadow-floating));box-sizing: border-box;color: var(--toast-color, var(--helix-color-foreground));font-family: var(--helix-font-sans);font-size: var(--toast-font-size, var(--helix-text-sm));line-height: var(--helix-leading-normal);padding: var(--toast-item-padding, var(--helix-space-sm));padding-inline-end: calc(
|
|
8
|
-
var(--helix-space-sm) +
|
|
9
|
-
var(--helix-size-control) +
|
|
10
|
-
var(--helix-space-2xs)
|
|
11
|
-
);min-block-size: 0;position: relative;overflow: hidden;}[part="icon"] {color: var(--toast-tone-color, var(--_toast-severity, var(--helix-color-foreground-muted)));display: inline-flex;grid-area: 1 / 1;margin-inline-end: var(--helix-space-sm);margin-block-start: calc((var(--_toast-line) - var(--helix-size-icon)) / 2);}[part="icon"] svg {block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon);}slot[name="icon"]::slotted(*) {--icon-size: var(--helix-size-icon);block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon);}[part="content"] {grid-area: 1 / 2;min-inline-size: 0;}::slotted([slot="heading"]) {display: block;font-weight: var(--toast-heading-weight, var(--helix-weight-semibold));}::slotted([slot="description"]) {color: var(--toast-description-color, var(--helix-color-foreground-muted));display: block;}[part="actions"] {display: flex;gap: var(--helix-space-2xs);grid-area: 2 / 2;}[part="actions"] slot::slotted(*) {margin-block-start: var(--helix-space-xs);}:host([tone="info"]) {--_toast-severity: var(--helix-color-primary);}:host([tone="success"]) {--_toast-severity: var(--helix-color-success);}:host([tone="warning"]) {--_toast-severity: var(--helix-color-warning);}:host([tone="danger"]) {--_toast-severity: var(--helix-color-danger);}[part="dismiss"] {all: unset;box-sizing: border-box;position: absolute;inset-block-start: calc(
|
|
12
|
-
var(--toast-item-padding, var(--helix-space-sm)) +
|
|
13
|
-
(var(--_toast-line) - var(--helix-size-control)) /
|
|
14
|
-
2
|
|
15
|
-
);inset-inline-end: var(--helix-space-sm);block-size: var(--helix-size-control);border-radius: var(--helix-radii-sm);color: var(--toast-dismiss-color, var(--helix-color-foreground-muted));cursor: pointer;display: inline-flex;flex: 0 0 auto;inline-size: var(--helix-size-control);place-content: center;place-items: center;transition: color var(--helix-duration-fast) var(--helix-easing-standard);}[part="dismiss"] svg {block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon);}[part="dismiss"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 8%, transparent);color: var(--helix-color-foreground);}[part="dismiss"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset);}[part="item"],
|
|
16
|
-
[part="item"] > * {touch-action: pan-y;}[part="content"] > slot {display: block;touch-action: pan-y;}[part="item"][data-swiping] {transition: none;translate: var(--toast-swipe-x, 0) var(--toast-swipe-y, 0);user-select: none;}[part="timer"] {animation: helix-toast-drain var(--toast-duration, 0ms) linear forwards;background-color: var(
|
|
17
|
-
--toast-tone-color,
|
|
18
|
-
var(--_toast-severity, var(--helix-color-foreground-muted))
|
|
19
|
-
);block-size: var(--toast-timer-size, var(--helix-space-2xs));inset-block-start: 0;inset-inline: 0;position: absolute;transform-origin: 0 50%;}[part="timer"]:dir(rtl) {transform-origin: 100% 50%;}:host([data-paused]) [part="timer"] {animation-play-state: paused;}@keyframes helix-toast-drain {to {scale: 0 1;}}@media (prefers-reduced-motion: no-preference) {[part="item"] {animation: helix-toast-in var(--helix-duration-normal) var(--helix-easing-decelerate) backwards;}}@keyframes helix-toast-in {from {opacity: 0;translate: 0 var(--_toast-enter, var(--helix-space-lg));}}:host([data-closed]) [part="item"] {padding-block: 0;transition: padding-block var(--helix-duration-normal) var(--helix-easing-accelerate);}:host([hidden]:not([hidden="until-found"], :state(waiting))) {display: grid;}:host(:state(waiting)) {display: none;}:host([data-closed]) {grid-template-rows: minmax(0, 0fr);margin-block-start: 0;opacity: 0;translate: 0 var(--_toast-enter, var(--helix-space-lg));visibility: hidden;transition:
|
|
20
|
-
grid-template-rows var(--helix-duration-normal) var(--helix-easing-accelerate),
|
|
21
|
-
margin-block-start var(--helix-duration-normal) var(--helix-easing-accelerate),
|
|
22
|
-
opacity var(--helix-duration-normal) var(--helix-easing-accelerate),
|
|
23
|
-
translate var(--helix-duration-normal) var(--helix-easing-accelerate),
|
|
24
|
-
visibility var(--helix-duration-normal) step-end;}@media (prefers-reduced-motion: reduce) {[part="item"] {animation: none;}[part="dismiss"] {transition: none;}}@media (prefers-reduced-motion: reduce) {:host,
|
|
25
|
-
:host([data-closed]),
|
|
26
|
-
:host([data-closed]) [part="item"] {transition: none;}[part="timer"] {animation: helix-toast-drain var(--toast-duration, 0ms) linear forwards;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-sm);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--_toast-line: calc(var(--toast-font-size, var(--helix-text-sm)) * var(--helix-leading-normal));display: grid;grid-template-rows: minmax(0, 1fr);margin-block-start: var(--_toast-gap, var(--helix-space-xs));transition: grid-template-rows var(--helix-duration-normal) var(--helix-easing-decelerate), margin-block-start var(--helix-duration-normal) var(--helix-easing-decelerate), opacity var(--helix-duration-normal) var(--helix-easing-decelerate), translate var(--helix-duration-normal) var(--helix-easing-decelerate);inline-size: var(--toast-inline-size, 22rem);max-inline-size: calc(100vw - var(--helix-space-xl))}[part="item"] {align-items: start;display: grid;grid-template-columns: auto 1fr;background-color: var(--toast-background-color, var(--helix-color-surface-overlay));border-radius: var(--toast-radius, var(--helix-radii-sm));border: var(--toast-border-width, var(--helix-border-floating)) solid var(--toast-border-color, var(--helix-color-border));box-shadow: var(--toast-shadow, var(--helix-shadow-floating));box-sizing: border-box;color: var(--toast-color, var(--helix-color-foreground));font-family: var(--helix-font-sans);font-size: var(--toast-font-size, var(--helix-text-sm));line-height: var(--helix-leading-normal);padding: var(--toast-item-padding, var(--helix-space-sm));padding-inline-end: calc(var(--helix-space-sm) + var(--helix-size-control) + var(--helix-space-2xs));min-block-size: 0;position: relative;overflow: hidden}[part="icon"] {color: var(--toast-tone-color, var(--_toast-severity, var(--helix-color-foreground-muted)));display: inline-flex;grid-area: 1 / 1;margin-inline-end: var(--helix-space-sm);margin-block-start: calc((var(--_toast-line) - var(--helix-size-icon)) / 2)}[part="icon"] svg {block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon)}slot[name="icon"]::slotted(*) {--icon-size: var(--helix-size-icon);block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon)}[part="content"] {grid-area: 1 / 2;min-inline-size: 0}::slotted([slot="heading"]) {display: block;font-weight: var(--toast-heading-weight, var(--helix-weight-semibold))}::slotted([slot="description"]) {color: var(--toast-description-color, var(--helix-color-foreground-muted));display: block}[part="actions"] {display: flex;gap: var(--helix-space-2xs);grid-area: 2 / 2}[part="actions"] slot::slotted(*) {margin-block-start: var(--helix-space-xs)}:host([tone="info"]) {--_toast-severity: var(--helix-color-primary)}:host([tone="success"]) {--_toast-severity: var(--helix-color-success)}:host([tone="warning"]) {--_toast-severity: var(--helix-color-warning)}:host([tone="danger"]) {--_toast-severity: var(--helix-color-danger)}[part="dismiss"] {all: unset;box-sizing: border-box;position: absolute;inset-block-start: calc(var(--toast-item-padding, var(--helix-space-sm)) + (var(--_toast-line) - var(--helix-size-control)) / 2);inset-inline-end: var(--helix-space-sm);block-size: var(--helix-size-control);border-radius: var(--helix-radii-sm);color: var(--toast-dismiss-color, var(--helix-color-foreground-muted));cursor: pointer;display: inline-flex;flex: 0 0 auto;inline-size: var(--helix-size-control);place-content: center;place-items: center;transition: color var(--helix-duration-fast) var(--helix-easing-standard)}[part="dismiss"] svg {block-size: var(--helix-size-icon);inline-size: var(--helix-size-icon)}[part="dismiss"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 8%, transparent);color: var(--helix-color-foreground)}[part="dismiss"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}[part="item"], [part="item"] > * {touch-action: pan-y}[part="content"] > slot {display: block;touch-action: pan-y}[part="item"][data-swiping] {transition: none;translate: var(--toast-swipe-x, 0) var(--toast-swipe-y, 0);user-select: none}[part="timer"] {animation: helix-toast-drain var(--toast-duration, 0ms) linear forwards;background-color: var(--toast-tone-color, var(--_toast-severity, var(--helix-color-foreground-muted)));block-size: var(--toast-timer-size, var(--helix-space-2xs));inset-block-start: 0;inset-inline: 0;position: absolute;transform-origin: 0 50%}[part="timer"]:dir(rtl) {transform-origin: 100% 50%}:host([data-paused]) [part="timer"] {animation-play-state: paused}@keyframes helix-toast-drain {to {scale: 0 1}}@media (prefers-reduced-motion: no-preference) {[part="item"] {animation: helix-toast-in var(--helix-duration-normal) var(--helix-easing-decelerate) backwards}}@keyframes helix-toast-in {from {opacity: 0;translate: 0 var(--_toast-enter, var(--helix-space-lg))}}:host([data-closed]) [part="item"] {padding-block: 0;transition: padding-block var(--helix-duration-normal) var(--helix-easing-accelerate)}:host([hidden]:not([hidden="until-found"], :state(waiting))) {display: grid}:host(:state(waiting)) {display: none}:host([data-closed]) {grid-template-rows: minmax(0, 0fr);margin-block-start: 0;opacity: 0;translate: 0 var(--_toast-enter, var(--helix-space-lg));visibility: hidden;transition: grid-template-rows var(--helix-duration-normal) var(--helix-easing-accelerate), margin-block-start var(--helix-duration-normal) var(--helix-easing-accelerate), opacity var(--helix-duration-normal) var(--helix-easing-accelerate), translate var(--helix-duration-normal) var(--helix-easing-accelerate), visibility var(--helix-duration-normal) step-end}@media (prefers-reduced-motion: reduce) {[part="item"] {animation: none}[part="dismiss"] {transition: none}}@media (prefers-reduced-motion: reduce) {:host, :host([data-closed]), :host([data-closed]) [part="item"] {transition: none}[part="timer"] {animation: helix-toast-drain var(--toast-duration, 0ms) linear forwards}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessToastItem } from '@fusion.dev/helix-headless/toast';
|
|
9
4
|
import { styles } from './toast-item.css.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {--_toast-inset: var(--toast-inset, var(--helix-space-lg));display: contents
|
|
2
|
+
export const styles = createSheet(`:host {--_toast-inset: var(--toast-inset, var(--helix-space-lg));display: contents}:host(:not([placement])) {--_toast-enter: var(--helix-space-lg)}[part="region"] {--_toast-gap: var(--toast-gap, var(--helix-space-xs));background: none;block-size: auto;border: none;color: inherit;display: flex;flex-direction: column;inline-size: auto;inset: auto;inset-inline: var(--_toast-inset);margin: var(--helix-space-none);max-block-size: none;max-inline-size: none;overflow: visible;padding: var(--helix-space-none);pointer-events: none;position: fixed;z-index: var(--helix-layer-toast)}:host(:not([placement])) [part="region"] {inset-block-end: var(--_toast-inset)}[part="region"]:not(:popover-open) {display: none}::slotted(*) {pointer-events: auto}:host([placement^="bottom"]) {--_toast-enter: var(--helix-space-lg)}:host([placement^="bottom"]) [part="region"] {inset-block-end: var(--_toast-inset)}:host([placement^="top"]) {--_toast-enter: calc(var(--helix-space-lg) * -1)}:host([placement^="top"]) [part="region"] {inset-block-start: var(--_toast-inset)}:host([placement^="top"]) [part="region"] {flex-direction: column-reverse}:host(:not([placement])) [part="region"] {align-items: flex-end}:host([placement$="start"]) [part="region"] {align-items: flex-start}:host([placement$="end"]) [part="region"] {align-items: flex-end}:host([placement$="center"]) [part="region"] {align-items: center}@media print {:host {display: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessToast } from '@fusion.dev/helix-headless/toast';
|
|
9
4
|
import { styles as liveStyles } from '../../shared/live/live.css.js';
|
|
@@ -1,14 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: inline-flex;flex-direction: column;gap: var(--helix-space-2xs)
|
|
3
|
-
:host([separation="outlined"]) [part="track"] {--_toggle-radius: var(
|
|
4
|
-
--toggle-group-item-radius,
|
|
5
|
-
calc(var(--toggle-group-radius, var(--helix-radii-sm)) - var(--helix-border-thin))
|
|
6
|
-
);--_toggle-height: calc(
|
|
7
|
-
var(--helix-size-control) -
|
|
8
|
-
(var(--helix-space-2xs) + var(--helix-border-thin)) *
|
|
9
|
-
2
|
|
10
|
-
);--_indicator-surface: var(--helix-color-surface-overlay);background-color: var(--toggle-group-background-color, var(--helix-color-surface-sunken));border: var(--helix-border-thin) solid var(--toggle-group-border-color, var(--helix-color-border));border-radius: var(--toggle-group-radius, var(--helix-radii-sm));}::slotted(helix-toggle) {block-size: var(--_toggle-height);flex: 1 1 auto;}[part="indicator"],
|
|
11
|
-
:host([selection-mode="multiple"]) ::slotted(helix-toggle:state(pressed)) {background-color: var(--toggle-group-indicator-color, var(--_indicator-surface));border-radius: var(--_toggle-radius);box-shadow: var(--toggle-group-indicator-shadow, var(--helix-shadow-sm));}[part="indicator"] {block-size: var(--indicator-block-size, 0);inline-size: var(--indicator-inline-size, 0);inset-block-start: 0;inset-inline-start: 0;position: absolute;translate: var(--indicator-x, 0) var(--indicator-y, 0);transition:
|
|
12
|
-
translate var(--helix-duration-normal) var(--helix-easing-emphasized),
|
|
13
|
-
inline-size var(--helix-duration-normal) var(--helix-easing-emphasized),
|
|
14
|
-
opacity var(--helix-duration-fast) var(--helix-easing-standard);z-index: var(--helix-layer-base);}[part="indicator"]:not([data-placed]) {opacity: 0;}:host(:state(invalid)) [part="track"] {outline: var(--helix-size-focus-ring) solid var(--helix-color-danger);outline-offset: calc(var(--helix-size-focus-offset) * -1);}[part="row"] {align-items: center;display: flex;gap: var(--helix-space-sm);}:host([orientation="vertical"]) [part="track"] {align-items: stretch;flex-direction: column;flex-wrap: nowrap;}:host([orientation="vertical"]) ::slotted(helix-toggle) {flex: 0 0 auto;}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: inline-flex;flex-direction: column;gap: var(--helix-space-2xs)}:host([label-placement="start"]) [part="label"] {align-self: center;margin-block: 0;order: -2;padding-block: 0;padding-inline-start: var(--helix-space-xs);white-space: nowrap}:host([label-placement="start"]) [part="track"]::before {align-self: center;background-color: var(--helix-color-border);block-size: calc(var(--_toggle-height) * 0.6);content: "";flex: none;inline-size: var(--helix-border-thin);margin-inline: var(--helix-space-xs);order: -1}:host([label-placement="start"]) {align-items: start}[part="track"] {--_toggle-height: calc(var(--helix-size-control) - var(--helix-space-2xs) * 2);--_toggle-radius: var(--toggle-group-item-radius, var(--helix-radii-sm));--_indicator-surface: var(--helix-color-surface-raised);display: inline-flex;flex: 1 1 auto;position: relative;align-content: flex-start;flex-wrap: wrap;min-block-size: var(--helix-size-control);padding: var(--helix-space-2xs)}:host(:not([separation])) [part="track"], :host([separation="outlined"]) [part="track"] {--_toggle-radius: var(--toggle-group-item-radius, calc(var(--toggle-group-radius, var(--helix-radii-sm)) - var(--helix-border-thin)));--_toggle-height: calc(var(--helix-size-control) - (var(--helix-space-2xs) + var(--helix-border-thin)) * 2);--_indicator-surface: var(--helix-color-surface-overlay);background-color: var(--toggle-group-background-color, var(--helix-color-surface-sunken));border: var(--helix-border-thin) solid var(--toggle-group-border-color, var(--helix-color-border));border-radius: var(--toggle-group-radius, var(--helix-radii-sm))}::slotted(helix-toggle) {block-size: var(--_toggle-height);flex: 1 1 auto}[part="indicator"], :host([selection-mode="multiple"]) ::slotted(helix-toggle:state(pressed)) {background-color: var(--toggle-group-indicator-color, var(--_indicator-surface));border-radius: var(--_toggle-radius);box-shadow: var(--toggle-group-indicator-shadow, var(--helix-shadow-sm))}[part="indicator"] {block-size: var(--indicator-block-size, 0);inline-size: var(--indicator-inline-size, 0);inset-block-start: 0;inset-inline-start: 0;position: absolute;translate: var(--indicator-x, 0) var(--indicator-y, 0);transition: translate var(--helix-duration-normal) var(--helix-easing-emphasized), inline-size var(--helix-duration-normal) var(--helix-easing-emphasized), opacity var(--helix-duration-fast) var(--helix-easing-standard);z-index: var(--helix-layer-base)}[part="indicator"]:not([data-placed]) {opacity: 0}:host(:state(invalid)) [part="track"] {outline: var(--helix-size-focus-ring) solid var(--helix-color-danger);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="row"] {align-items: center;display: flex;gap: var(--helix-space-sm)}:host([orientation="vertical"]) [part="track"] {align-items: stretch;flex-direction: column;flex-wrap: nowrap}:host([orientation="vertical"]) ::slotted(helix-toggle) {flex: 0 0 auto}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessToggleGroup } from '@fusion.dev/helix-headless/toggle';
|
|
9
4
|
import { property } from 'lit/decorators.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: inline-flex;position: relative;z-index: var(--helix-layer-raised)
|
|
2
|
+
export const styles = createSheet(`:host {display: inline-flex;position: relative;z-index: var(--helix-layer-raised)}[part="item"] {all: unset;box-sizing: border-box}::slotted([slot="start"]) {margin-inline-end: var(--helix-space-xs)}::slotted([slot="end"]) {margin-inline-start: var(--helix-space-xs)}[part="item"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}@media print {:host {display: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessToggle } from '@fusion.dev/helix-headless/toggle';
|
|
9
4
|
import { styles } from './toggle-root.css.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {--helix-size-checkbox: var(--helix-size-checkbox-sm);--helix-size-checkbox-loose: calc(var(--helix-size-checkbox) * 1.2);--helix-size-checkbox-tight: calc(var(--helix-size-checkbox) * 0.8);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-sm);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-tag: var(--helix-size-tag-sm);display: inline-flex
|
|
2
|
+
export const styles = createSheet(`:host {--helix-size-checkbox: var(--helix-size-checkbox-sm);--helix-size-checkbox-loose: calc(var(--helix-size-checkbox) * 1.2);--helix-size-checkbox-tight: calc(var(--helix-size-checkbox) * 0.8);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-sm);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-tag: var(--helix-size-tag-sm);display: inline-flex}:host([size="md"]) {--helix-size-checkbox: var(--helix-size-checkbox-md);--helix-size-checkbox-loose: calc(var(--helix-size-checkbox) * 1.2);--helix-size-checkbox-tight: calc(var(--helix-size-checkbox) * 0.8);--helix-size-icon: var(--helix-size-icon-md);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-md);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-tag: var(--helix-size-tag-md)}:host([size="lg"]) {--helix-size-checkbox: var(--helix-size-checkbox-lg);--helix-size-checkbox-loose: calc(var(--helix-size-checkbox) * 1.2);--helix-size-checkbox-tight: calc(var(--helix-size-checkbox) * 0.8);--helix-size-icon: var(--helix-size-icon-lg);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);--helix-size-control: var(--helix-size-control-lg);--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-tag: var(--helix-size-tag-lg)}[part="toolbar"] {align-items: var(--toolbar-align, center);background-color: var(--toolbar-background-color, transparent);border: var(--toolbar-border-width, 0) solid var(--toolbar-border-color, transparent);border-radius: var(--toolbar-radius, var(--helix-radii-none));display: flex;gap: var(--toolbar-gap, var(--helix-space-2xs));padding: var(--toolbar-padding, var(--helix-space-none))}:host([orientation="vertical"]) [part="toolbar"] {flex-direction: column}::slotted(helix-divider) {margin-inline: var(--toolbar-separator-gap, 0)}:host([orientation="vertical"]) ::slotted(helix-divider) {align-self: stretch;margin-block: var(--toolbar-separator-gap, 0);margin-inline: 0}@media print {:host {display: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessToolbar } from '@fusion.dev/helix-headless/toolbar';
|
|
9
4
|
import { property } from 'lit/decorators.js';
|
|
@@ -1,9 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: contents
|
|
3
|
-
opacity var(--helix-duration-fast) var(--helix-easing-standard),
|
|
4
|
-
scale var(--helix-duration-fast) var(--helix-easing-emphasized),
|
|
5
|
-
display var(--helix-duration-fast) allow-discrete,
|
|
6
|
-
overlay var(--helix-duration-fast) allow-discrete;}[part~="tooltip"][data-placed] {opacity: 1;scale: 1;}[part~="arrow"] {background-color: var(--tooltip-background-color, var(--helix-color-surface-inverse));block-size: var(--tooltip-arrow-size, 0.5rem);inline-size: var(--tooltip-arrow-size, 0.5rem);position: absolute;rotate: 45deg;}:host([material="glass"]) [part~="tooltip"],
|
|
7
|
-
:host([material="glass"]) [part~="arrow"] {backdrop-filter: var(--tooltip-backdrop, var(--helix-material-backdrop));background-color: var(--tooltip-background-color, var(--helix-material-translucent));}:host([material="frosted"]) [part~="tooltip"],
|
|
8
|
-
:host([material="frosted"]) [part~="arrow"] {backdrop-filter: var(--tooltip-backdrop, blur(var(--helix-material-blur-lg)));background-color: var(--tooltip-background-color, var(--helix-material-translucent-strong));}:host([material="frosted"]) [part~="tooltip"],
|
|
9
|
-
:host([material="glass"]) [part~="tooltip"] {border: var(--helix-border-thin) solid var(--tooltip-border-color, var(--helix-color-border));color: var(--tooltip-color, var(--helix-color-foreground));}[part~="tooltip"][data-placement^="top"] {transform-origin: var(--floating-arrow-x, 50%) 100%;}[part~="tooltip"][data-placement^="bottom"] {transform-origin: var(--floating-arrow-x, 50%) 0;}[part~="tooltip"][data-placement^="left"] {transform-origin: 100% var(--floating-arrow-y, 50%);}[part~="tooltip"][data-placement^="right"] {transform-origin: 0 var(--floating-arrow-y, 50%);}[part~="tooltip"]:not(:popover-open) {display: none;}@media (prefers-reduced-motion: reduce) {[part~="tooltip"] {scale: 1;transition: none;}[part~="tooltip"][data-placed] {scale: 1;}}@media print {:host {display: none;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: contents}[part~="tooltip"] {overflow: visible;align-items: center;display: flex;gap: var(--tooltip-gap, var(--helix-space-2xs));background-color: var(--tooltip-background-color, var(--helix-color-surface-inverse));border: none;border-radius: var(--tooltip-radius, var(--helix-radii-sm));color: var(--tooltip-color, var(--helix-color-foreground-inverse));font-family: var(--helix-font-sans);font-size: var(--tooltip-font-size, var(--helix-text-xs));font-weight: var(--helix-weight-regular);inline-size: max-content;line-height: var(--helix-leading-tight);margin: var(--helix-space-none);max-inline-size: var(--tooltip-max-inline-size, 16rem);opacity: 0;padding: var(--tooltip-padding, var(--helix-space-2xs) var(--helix-space-xs));position: fixed;scale: 0;transition: opacity var(--helix-duration-fast) var(--helix-easing-standard), scale var(--helix-duration-fast) var(--helix-easing-emphasized), display var(--helix-duration-fast) allow-discrete, overlay var(--helix-duration-fast) allow-discrete}[part~="tooltip"][data-placed] {opacity: 1;scale: 1}[part~="arrow"] {background-color: var(--tooltip-background-color, var(--helix-color-surface-inverse));block-size: var(--tooltip-arrow-size, 0.5rem);inline-size: var(--tooltip-arrow-size, 0.5rem);position: absolute;rotate: 45deg}:host([material="glass"]) [part~="tooltip"], :host([material="glass"]) [part~="arrow"] {backdrop-filter: var(--tooltip-backdrop, var(--helix-material-backdrop));background-color: var(--tooltip-background-color, var(--helix-material-translucent))}:host([material="frosted"]) [part~="tooltip"], :host([material="frosted"]) [part~="arrow"] {backdrop-filter: var(--tooltip-backdrop, blur(var(--helix-material-blur-lg)));background-color: var(--tooltip-background-color, var(--helix-material-translucent-strong))}:host([material="frosted"]) [part~="tooltip"], :host([material="glass"]) [part~="tooltip"] {border: var(--helix-border-thin) solid var(--tooltip-border-color, var(--helix-color-border));color: var(--tooltip-color, var(--helix-color-foreground))}[part~="tooltip"][data-placement^="top"] {transform-origin: var(--floating-arrow-x, 50%) 100%}[part~="tooltip"][data-placement^="bottom"] {transform-origin: var(--floating-arrow-x, 50%) 0}[part~="tooltip"][data-placement^="left"] {transform-origin: 100% var(--floating-arrow-y, 50%)}[part~="tooltip"][data-placement^="right"] {transform-origin: 0 var(--floating-arrow-y, 50%)}[part~="tooltip"]:not(:popover-open) {display: none}@media (prefers-reduced-motion: reduce) {[part~="tooltip"] {scale: 1;transition: none}[part~="tooltip"][data-placed] {scale: 1}}@media print {:host {display: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTooltip } from '@fusion.dev/helix-headless/tooltip';
|
|
9
4
|
import { property } from 'lit/decorators.js';
|
|
@@ -1,6 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: contents
|
|
3
|
-
left var(--helix-duration-normal) var(--helix-easing-standard),
|
|
4
|
-
top var(--helix-duration-normal) var(--helix-easing-standard),
|
|
5
|
-
block-size var(--helix-duration-normal) var(--helix-easing-standard),
|
|
6
|
-
inline-size var(--helix-duration-normal) var(--helix-easing-standard);z-index: var(--helix-layer-overlay);}[part="backdrop"] {background-color: var(--tour-scrim-color, var(--helix-color-overlay));inset: 0;pointer-events: none;position: fixed;z-index: var(--helix-layer-overlay);}@media print {:host {display: none;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: contents}[part="spotlight"] {border-radius: var(--tour-spotlight-radius, var(--helix-radii-md));box-shadow: 0 0 0 100vmax var(--tour-scrim-color, var(--helix-color-overlay));pointer-events: none;position: fixed;transition: left var(--helix-duration-normal) var(--helix-easing-standard), top var(--helix-duration-normal) var(--helix-easing-standard), block-size var(--helix-duration-normal) var(--helix-easing-standard), inline-size var(--helix-duration-normal) var(--helix-easing-standard);z-index: var(--helix-layer-overlay)}[part="backdrop"] {background-color: var(--tour-scrim-color, var(--helix-color-overlay));inset: 0;pointer-events: none;position: fixed;z-index: var(--helix-layer-overlay)}@media print {:host {display: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTour } from '@fusion.dev/helix-headless/tour';
|
|
9
4
|
import { styles } from './tour-root.css.js';
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: contents
|
|
3
|
-
[part="bubble"]:focus-visible {outline: none;}:host [part="bubble"][hidden] {display: none;}:host([type="dialog"]) [part="bubble"] {margin: auto;}:host([type="floating"]) [part="bubble"] {inset: auto;inset-block-end: var(--helix-space-lg);inset-inline-end: var(--helix-space-lg);}::slotted([slot="heading"]) {font-size: var(--helix-text-md);font-weight: var(--helix-weight-semibold);margin: var(--helix-space-none);}::slotted([slot="description"]) {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);margin: var(--helix-space-none);}[part="progress"] {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);font-variant-numeric: tabular-nums;}[part="content"] {display: flex;flex-direction: column;gap: var(--helix-space-xs);}[part="actions"] {align-items: center;display: flex;gap: var(--helix-space-xs);justify-content: flex-end;}[part="skip"] {margin-inline-end: auto;}[part~="arrow"] {background-color: var(--tour-surface-color, var(--helix-color-surface-raised));block-size: var(--tour-arrow-size, 0.5rem);inline-size: var(--tour-arrow-size, 0.5rem);position: absolute;rotate: 45deg;}[part="bubble"][data-placement^="bottom"] [part~="arrow"] {border-left: var(--helix-border-thin) solid var(--helix-color-border);border-top: var(--helix-border-thin) solid var(--helix-color-border);}[part="bubble"][data-placement^="top"] [part~="arrow"] {border-bottom: var(--helix-border-thin) solid var(--helix-color-border);border-right: var(--helix-border-thin) solid var(--helix-color-border);}[part="bubble"][data-placement^="right"] [part~="arrow"] {border-bottom: var(--helix-border-thin) solid var(--helix-color-border);border-left: var(--helix-border-thin) solid var(--helix-color-border);}[part="bubble"][data-placement^="left"] [part~="arrow"] {border-right: var(--helix-border-thin) solid var(--helix-color-border);border-top: var(--helix-border-thin) solid var(--helix-color-border);}:host([type]) [part~="arrow"] {display: none;}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: contents}[part="bubble"] {background-color: var(--tour-surface-color, var(--helix-color-surface-raised));border: var(--tour-border-width, var(--helix-border-thin)) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--tour-shadow, var(--helix-shadow-floating));box-sizing: border-box;color: var(--helix-color-foreground);display: flex;flex-direction: column;gap: var(--helix-space-md);inline-size: max-content;margin: var(--helix-space-none);max-inline-size: var(--tour-bubble-size, 22rem);overflow: visible;padding: var(--tour-padding, var(--helix-space-md));position: fixed}[part="bubble"]:focus, [part="bubble"]:focus-visible {outline: none}:host [part="bubble"][hidden] {display: none}:host([type="dialog"]) [part="bubble"] {margin: auto}:host([type="floating"]) [part="bubble"] {inset: auto;inset-block-end: var(--helix-space-lg);inset-inline-end: var(--helix-space-lg)}::slotted([slot="heading"]) {font-size: var(--helix-text-md);font-weight: var(--helix-weight-semibold);margin: var(--helix-space-none)}::slotted([slot="description"]) {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);margin: var(--helix-space-none)}[part="progress"] {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);font-variant-numeric: tabular-nums}[part="content"] {display: flex;flex-direction: column;gap: var(--helix-space-xs)}[part="actions"] {align-items: center;display: flex;gap: var(--helix-space-xs);justify-content: flex-end}[part="skip"] {margin-inline-end: auto}[part~="arrow"] {background-color: var(--tour-surface-color, var(--helix-color-surface-raised));block-size: var(--tour-arrow-size, 0.5rem);inline-size: var(--tour-arrow-size, 0.5rem);position: absolute;rotate: 45deg}[part="bubble"][data-placement^="bottom"] [part~="arrow"] {border-left: var(--helix-border-thin) solid var(--helix-color-border);border-top: var(--helix-border-thin) solid var(--helix-color-border)}[part="bubble"][data-placement^="top"] [part~="arrow"] {border-bottom: var(--helix-border-thin) solid var(--helix-color-border);border-right: var(--helix-border-thin) solid var(--helix-color-border)}[part="bubble"][data-placement^="right"] [part~="arrow"] {border-bottom: var(--helix-border-thin) solid var(--helix-color-border);border-left: var(--helix-border-thin) solid var(--helix-color-border)}[part="bubble"][data-placement^="left"] [part~="arrow"] {border-right: var(--helix-border-thin) solid var(--helix-color-border);border-top: var(--helix-border-thin) solid var(--helix-color-border)}:host([type]) [part~="arrow"] {display: none}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTourStop } from '@fusion.dev/helix-headless/tour';
|
|
9
4
|
import { styles } from './tour-stop.css.js';
|
|
@@ -1,27 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {--_tree-chevron: var(--tree-chevron-size, var(--helix-size-icon-tight));display: block
|
|
3
|
-
var(--tree-row-size, var(--helix-size-control-tight)),
|
|
4
|
-
calc(1lh + var(--helix-space-xs) * 2)
|
|
5
|
-
);min-block-size: var(--tree-row-size, var(--helix-size-control-tight));padding-block: var(--helix-space-xs);padding-inline: var(--helix-space-xs);padding-inline-start: calc(
|
|
6
|
-
var(--helix-space-xs) +
|
|
7
|
-
(var(--tree-level, 1) - 1) *
|
|
8
|
-
var(--tree-indent, calc(var(--_tree-chevron) + var(--helix-space-2xs)))
|
|
9
|
-
);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard);user-select: none;}[part="row"]:not(:has([part="toggle"])) {padding-inline-start: calc(
|
|
10
|
-
var(--helix-space-xs) +
|
|
11
|
-
(var(--tree-level, 1) - 1) *
|
|
12
|
-
var(--tree-indent, calc(var(--_tree-chevron) + var(--helix-space-2xs))) +
|
|
13
|
-
var(--_tree-reserve, calc(var(--_tree-chevron) + var(--helix-space-2xs)))
|
|
14
|
-
);}[part="row"]:has([part="toggle"]) {color: var(
|
|
15
|
-
--_tree-row-ink,
|
|
16
|
-
var(--_tree-heading-ink, var(--tree-row-color, var(--helix-color-foreground-muted)))
|
|
17
|
-
);font-size: var(--_tree-heading-text, var(--_tree-text, var(--helix-text-sm)));font-weight: var(--helix-weight-medium);letter-spacing: var(--_tree-heading-tracking, var(--helix-tracking-normal));}[part="row"]:not(:has([part="toggle"])) {font-weight: var(--helix-weight-medium);}slot[name="children"]::slotted(*) {--_tree-text: var(--_tree-nested-text, var(--helix-text-sm));}[part="row"]:hover {background-color: var(--tree-row-hover-background-color, var(--helix-color-surface-raised));color: var(--tree-row-hover-color, var(--helix-color-foreground));}:host(:state(selected)) [part="row"] {background-color: var(--tree-row-selected-background-color, var(--helix-color-surface-sunken));color: var(--tree-row-selected-color, var(--helix-color-foreground));}:host(:state(checked)) [part="row"] {--_tree-row-fill: var(--tree-row-checked-background-color, transparent);--_tree-row-ink: var(--tree-row-checked-color);}[part="item"]:focus-visible [part="row"],
|
|
18
|
-
[part="row"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1);}a[part="row"] {text-decoration: none;}[part="toggle"] {block-size: var(--_tree-chevron);color: var(--helix-color-foreground-subtle);flex: 0 0 auto;inline-size: var(--_tree-chevron);transform: rotate(-90deg);transition: transform var(--helix-duration-fast) var(--helix-easing-standard);}:host(:dir(rtl)) [part="toggle"] {transform: rotate(90deg);}:host(:state(open)) [part="toggle"] {transform: rotate(0deg);}[part="label"] {align-self: stretch;flex: 1;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}[part="label"] slot::slotted(a) {display: block;overflow: hidden;text-overflow: ellipsis;}slot[name="start"]::slotted(*),
|
|
19
|
-
slot[name="end"]::slotted(*) {flex: 0 0 auto;}slot[name="end"] {align-items: center;display: flex;gap: var(--helix-space-2xs);margin-inline-start: auto;order: 1;}slot[name="start"]::slotted(*) {color: var(--helix-color-foreground-subtle);}[part="group"] {display: grid;grid-template-rows: 1fr;transition:
|
|
20
|
-
grid-template-rows var(--helix-duration-fast) var(--helix-easing-standard),
|
|
21
|
-
display var(--helix-duration-fast) allow-discrete;}[part="group"] > slot {display: block;min-block-size: 0;overflow: hidden;}[part="group"][hidden] {display: none;grid-template-rows: 0fr;}@starting-style {[part="group"]:not([hidden]) {grid-template-rows: 0fr;}}[part="toggle"] {align-self: center;margin-inline-start: var(--tree-chevron-gap, var(--helix-space-none));order: var(--tree-chevron-order, 0);}slot[name="chevron"]::slotted(*) {align-self: center;block-size: var(--_tree-chevron);color: var(--helix-color-foreground-subtle);flex: 0 0 auto;inline-size: var(--_tree-chevron);margin-inline-start: var(--tree-chevron-gap, var(--helix-space-none));order: var(--tree-chevron-order, 0);transform: rotate(-90deg);transition: transform var(--helix-duration-fast) var(--helix-easing-standard);}:host(:dir(rtl)) slot[name="chevron"]::slotted(*) {transform: rotate(90deg);}:host(:state(open)) slot[name="chevron"]::slotted(*) {transform: rotate(0deg);}[part~="checkbox"] {align-self: center;background-color: var(--tree-checkbox-background-color, var(--helix-color-background));block-size: var(--tree-checkbox-size, var(--_tree-chevron));border: var(--helix-border-thin) solid
|
|
22
|
-
var(--tree-checkbox-border-color, var(--helix-color-border));border-radius: var(--helix-radii-sm);color: var(--tree-checkbox-mark-color, var(--helix-color-foreground));display: grid;flex: 0 0 auto;inline-size: var(--tree-checkbox-size, var(--_tree-chevron));place-items: center;}[part~="checkbox-checked"],
|
|
23
|
-
[part~="checkbox-mixed"] {border-color: var(--tree-checkbox-border-color, var(--helix-color-foreground));}[part~="checkbox"] svg {block-size: 80%;inline-size: 80%;}[part="grip"] {align-items: center;color: var(--tree-grip-color, var(--helix-color-foreground-subtle));cursor: grab;display: inline-flex;flex: 0 0 auto;order: 3;touch-action: none;}[part="grip"]:active {cursor: grabbing;}[part="grip-mark"] {block-size: var(--_tree-chevron);inline-size: var(--_tree-chevron);}:host(:state(dragging)) [part="item"] {opacity: var(--tree-dragging-opacity, 0.5);}:host(:state(drop-before)) [part="item"],
|
|
24
|
-
:host(:state(drop-after)) [part="item"] {position: relative;}:host(:state(drop-before)) [part="item"]::before,
|
|
25
|
-
:host(:state(drop-after)) [part="item"]::after {background-color: var(--tree-drop-indicator-color, var(--helix-color-primary));block-size: var(--tree-drop-indicator-size, var(--helix-border-thick));content: "";inset-inline: 0;pointer-events: none;position: absolute;z-index: 1;}:host(:state(drop-before)) [part="item"]::before {inset-block-start: 0;}:host(:state(drop-after)) [part="item"]::after {inset-block-end: 0;}:host([disabled]) [part="row"] {cursor: not-allowed;opacity: var(--tree-row-disabled-opacity, 0.5);}:host([disabled]) [part="row"]:hover {background-color: transparent;color: var(--tree-row-color, var(--helix-color-foreground-muted));}:host(:state(loading)) [part="toggle"],
|
|
26
|
-
:host(:state(loading)) slot[name="chevron"]::slotted(*) {animation: tree-loading var(--helix-duration-slow) var(--helix-easing-standard) infinite alternate;}@keyframes tree-loading {to {opacity: 0.3;}}@media (prefers-reduced-motion: reduce) {:host(:state(loading)) [part="toggle"],
|
|
27
|
-
:host(:state(loading)) slot[name="chevron"]::slotted(*) {animation: none;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {--_tree-chevron: var(--tree-chevron-size, var(--helix-size-icon-tight));display: block}[part="item"] {border-radius: var(--helix-radii-sm);outline: none}[part="row"] {align-items: center;background-color: var(--_tree-row-fill, transparent);border-radius: var(--tree-row-radius, var(--helix-radii-sm));color: var(--_tree-row-ink, var(--tree-row-color, var(--helix-color-foreground-muted)));cursor: pointer;display: flex;font-size: var(--_tree-text, var(--helix-text-sm));gap: var(--helix-space-2xs);margin-block-end: var(--tree-gap, var(--helix-space-2xs));block-size: max(var(--tree-row-size, var(--helix-size-control-tight)), calc(1lh + var(--helix-space-xs) * 2));min-block-size: var(--tree-row-size, var(--helix-size-control-tight));padding-block: var(--helix-space-xs);padding-inline: var(--helix-space-xs);padding-inline-start: calc(var(--helix-space-xs) + (var(--tree-level, 1) - 1) * var(--tree-indent, calc(var(--_tree-chevron) + var(--helix-space-2xs))));transition: background-color var(--helix-duration-fast) var(--helix-easing-standard);user-select: none}[part="row"]:not(:has([part="toggle"])) {padding-inline-start: calc(var(--helix-space-xs) + (var(--tree-level, 1) - 1) * var(--tree-indent, calc(var(--_tree-chevron) + var(--helix-space-2xs))) + var(--_tree-reserve, calc(var(--_tree-chevron) + var(--helix-space-2xs))))}[part="row"]:has([part="toggle"]) {color: var(--_tree-row-ink, var(--_tree-heading-ink, var(--tree-row-color, var(--helix-color-foreground-muted))));font-size: var(--_tree-heading-text, var(--_tree-text, var(--helix-text-sm)));font-weight: var(--helix-weight-medium);letter-spacing: var(--_tree-heading-tracking, var(--helix-tracking-normal))}[part="row"]:not(:has([part="toggle"])) {font-weight: var(--helix-weight-medium)}slot[name="children"]::slotted(*) {--_tree-text: var(--_tree-nested-text, var(--helix-text-sm))}[part="row"]:hover {background-color: var(--tree-row-hover-background-color, var(--helix-color-surface-raised));color: var(--tree-row-hover-color, var(--helix-color-foreground))}:host(:state(selected)) [part="row"] {background-color: var(--tree-row-selected-background-color, var(--helix-color-surface-sunken));color: var(--tree-row-selected-color, var(--helix-color-foreground))}:host(:state(checked)) [part="row"] {--_tree-row-fill: var(--tree-row-checked-background-color, transparent);--_tree-row-ink: var(--tree-row-checked-color)}[part="item"]:focus-visible [part="row"], [part="row"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}a[part="row"] {text-decoration: none}[part="toggle"] {block-size: var(--_tree-chevron);color: var(--helix-color-foreground-subtle);flex: 0 0 auto;inline-size: var(--_tree-chevron);transform: rotate(-90deg);transition: transform var(--helix-duration-fast) var(--helix-easing-standard)}:host(:dir(rtl)) [part="toggle"] {transform: rotate(90deg)}:host(:state(open)) [part="toggle"] {transform: rotate(0deg)}[part="label"] {align-self: stretch;flex: 1;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}[part="label"] slot::slotted(a) {display: block;overflow: hidden;text-overflow: ellipsis}slot[name="start"]::slotted(*), slot[name="end"]::slotted(*) {flex: 0 0 auto}slot[name="end"] {align-items: center;display: flex;gap: var(--helix-space-2xs);margin-inline-start: auto;order: 1}slot[name="start"]::slotted(*) {color: var(--helix-color-foreground-subtle)}[part="group"] {display: grid;grid-template-rows: 1fr;transition: grid-template-rows var(--helix-duration-fast) var(--helix-easing-standard), display var(--helix-duration-fast) allow-discrete}[part="group"] > slot {display: block;min-block-size: 0;overflow: hidden}[part="group"][hidden] {display: none;grid-template-rows: 0fr}@starting-style {[part="group"]:not([hidden]) {grid-template-rows: 0fr}}[part="toggle"] {align-self: center;margin-inline-start: var(--tree-chevron-gap, var(--helix-space-none));order: var(--tree-chevron-order, 0)}slot[name="chevron"]::slotted(*) {align-self: center;block-size: var(--_tree-chevron);color: var(--helix-color-foreground-subtle);flex: 0 0 auto;inline-size: var(--_tree-chevron);margin-inline-start: var(--tree-chevron-gap, var(--helix-space-none));order: var(--tree-chevron-order, 0);transform: rotate(-90deg);transition: transform var(--helix-duration-fast) var(--helix-easing-standard)}:host(:dir(rtl)) slot[name="chevron"]::slotted(*) {transform: rotate(90deg)}:host(:state(open)) slot[name="chevron"]::slotted(*) {transform: rotate(0deg)}[part~="checkbox"] {align-self: center;background-color: var(--tree-checkbox-background-color, var(--helix-color-background));block-size: var(--tree-checkbox-size, var(--_tree-chevron));border: var(--helix-border-thin) solid var(--tree-checkbox-border-color, var(--helix-color-border));border-radius: var(--helix-radii-sm);color: var(--tree-checkbox-mark-color, var(--helix-color-foreground));display: grid;flex: 0 0 auto;inline-size: var(--tree-checkbox-size, var(--_tree-chevron));place-items: center}[part~="checkbox-checked"], [part~="checkbox-mixed"] {border-color: var(--tree-checkbox-border-color, var(--helix-color-foreground))}[part~="checkbox"] svg {block-size: 80%;inline-size: 80%}[part="grip"] {align-items: center;color: var(--tree-grip-color, var(--helix-color-foreground-subtle));cursor: grab;display: inline-flex;flex: 0 0 auto;order: 3;touch-action: none}[part="grip"]:active {cursor: grabbing}[part="grip-mark"] {block-size: var(--_tree-chevron);inline-size: var(--_tree-chevron)}:host(:state(dragging)) [part="item"] {opacity: var(--tree-dragging-opacity, 0.5)}:host(:state(drop-before)) [part="item"], :host(:state(drop-after)) [part="item"] {position: relative}:host(:state(drop-before)) [part="item"]::before, :host(:state(drop-after)) [part="item"]::after {background-color: var(--tree-drop-indicator-color, var(--helix-color-primary));block-size: var(--tree-drop-indicator-size, var(--helix-border-thick));content: "";inset-inline: 0;pointer-events: none;position: absolute;z-index: 1}:host(:state(drop-before)) [part="item"]::before {inset-block-start: 0}:host(:state(drop-after)) [part="item"]::after {inset-block-end: 0}:host([disabled]) [part="row"] {cursor: not-allowed;opacity: var(--tree-row-disabled-opacity, 0.5)}:host([disabled]) [part="row"]:hover {background-color: transparent;color: var(--tree-row-color, var(--helix-color-foreground-muted))}:host(:state(loading)) [part="toggle"], :host(:state(loading)) slot[name="chevron"]::slotted(*) {animation: tree-loading var(--helix-duration-slow) var(--helix-easing-standard) infinite alternate}@keyframes tree-loading {to {opacity: 0.3}}@media (prefers-reduced-motion: reduce) {:host(:state(loading)) [part="toggle"], :host(:state(loading)) slot[name="chevron"]::slotted(*) {animation: none}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTreeItem } from '@fusion.dev/helix-headless/tree';
|
|
9
4
|
import { styles } from './tree-item.css.js';
|
|
@@ -1,3 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: block
|
|
3
|
-
var(--tree-drag-preview-border-color, var(--helix-color-border));border-radius: var(--tree-drag-preview-radius, var(--helix-radii-sm));box-shadow: var(--tree-drag-preview-shadow, var(--helix-shadow-floating));opacity: var(--tree-drag-preview-opacity, 0.9);}@media print {:host {print-color-adjust: economy;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: block}[part="tree"] {display: flex;flex-direction: column}:host {--tree-chevron-order: 0}:host([chevron-placement="end"]) {--tree-chevron-order: 2;--tree-chevron-gap: var(--helix-space-none);--_tree-reserve: var(--helix-space-none)}:host([nesting="subordinate"]) {--_tree-nested-text: var(--helix-text-xs)}:host([nesting="heading"]) {--_tree-heading-ink: var(--helix-color-foreground-subtle);--_tree-heading-text: var(--helix-text-xs);--_tree-heading-tracking: var(--helix-tracking-wide)}:host([loading]) [part="tree"] {opacity: 0.5}[part="drag-preview"] {background-color: var(--tree-drag-preview-background-color, var(--helix-color-surface-raised));border: var(--tree-drag-preview-border-width, var(--helix-border-floating)) solid var(--tree-drag-preview-border-color, var(--helix-color-border));border-radius: var(--tree-drag-preview-radius, var(--helix-radii-sm));box-shadow: var(--tree-drag-preview-shadow, var(--helix-shadow-floating));opacity: var(--tree-drag-preview-opacity, 0.9)}@media print {:host {print-color-adjust: economy}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTree } from '@fusion.dev/helix-headless/tree';
|
|
9
4
|
import { property } from 'lit/decorators.js';
|
|
@@ -1,6 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {align-items: center;display: inline-flex;font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);gap: var(--trend-gap, var(--helix-space-2xs));line-height: var(--helix-leading-tight)
|
|
3
|
-
:host(:not(:defined)[good="up"][movement="up"]),
|
|
4
|
-
:host(:not(:defined)[good="down"][movement="down"]) {--_trend-color: var(--trend-better-color, var(--helix-color-success));}:host(:state(worse)),
|
|
5
|
-
:host(:not(:defined)[good="up"][movement="down"]),
|
|
6
|
-
:host(:not(:defined)[good="down"][movement="up"]) {--_trend-color: var(--trend-worse-color, var(--helix-color-danger));}[part="direction"] {block-size: 1px;clip-path: inset(50%);inline-size: 1px;overflow: hidden;position: absolute;white-space: nowrap;}slot[name="label"] {color: var(--trend-label-color, var(--helix-color-foreground-muted));font-weight: var(--helix-weight-regular);}@media print {:host {print-color-adjust: economy;}}`);
|
|
2
|
+
export const styles = createSheet(`:host {align-items: center;display: inline-flex;font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);gap: var(--trend-gap, var(--helix-space-2xs));line-height: var(--helix-leading-tight)}:host {--_trend-color: var(--trend-neutral-color, var(--helix-color-foreground-muted));color: var(--trend-color, var(--_trend-color))}[part="icon"] {--icon-size: var(--trend-icon-size, 1em)}slot[name$="icon"]::slotted(*) {--icon-size: var(--trend-icon-size, 1em);block-size: var(--trend-icon-size, 1em);inline-size: var(--trend-icon-size, 1em)}:host(:state(better)), :host(:not(:defined)[good="up"][movement="up"]), :host(:not(:defined)[good="down"][movement="down"]) {--_trend-color: var(--trend-better-color, var(--helix-color-success))}:host(:state(worse)), :host(:not(:defined)[good="up"][movement="down"]), :host(:not(:defined)[good="down"][movement="up"]) {--_trend-color: var(--trend-worse-color, var(--helix-color-danger))}[part="direction"] {block-size: 1px;clip-path: inset(50%);inline-size: 1px;overflow: hidden;position: absolute;white-space: nowrap}slot[name="label"] {color: var(--trend-label-color, var(--helix-color-foreground-muted));font-weight: var(--helix-weight-regular)}@media print {:host {print-color-adjust: economy}}`);
|
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
7
2
|
import { customElement } from '@fusion.dev/helix-core';
|
|
8
3
|
import { HelixHeadlessTrend } from '@fusion.dev/helix-headless/trend';
|
|
9
4
|
import { styles as glyphStyles } from '../../shared/glyph/glyph.css.js';
|