@fusion.dev/helix 0.2.0 → 0.4.0

package/dist/switch/root/switch-root.js

@@ -9,38 +9,6 @@ import { HelixHeadlessSwitch } from '@fusion.dev/helix-headless/switch';
 import { styles as fieldStyles } from '../../shared/field/field.css.js';
 import { styles as fieldInlineStyles } from '../../shared/field/field-inline.css.js';
 import { styles } from './switch-root.css.js';
-/**
- * @summary A control that turns something on or off.
- *
- * @description
- * A thumb traveling in a groove, which is the one place in the library color
- * is used to say "on". A checkbox does not, because a tick is legible on its
- * own; a switch has no mark, so the fill is the whole of what distinguishes the
- * two states and there is nothing else for it to be.
- *
- * The input itself is the hit target and is drawn as the track, stretched over
- * it and invisible, so the press, the focus and the label forwarding are all
- * the platform's while the picture is ours.
- *
- * **Its height is `--helix-size-switch`, which is one step above the
- * checkbox's** at every density rather than the same as it. A checkbox is a box
- * with a mark in it; a switch is a track with a thumb inside it, and at the
- * checkbox's height the thumb has two pixels of groove around it and the whole
- * control reads as a small dash. The width follows the height, so setting
- * `--switch-block-size` widens it too and the proportion is not something a
- * consumer has to keep.
- *
- * @since 0.1.0
- * @status stable
- * @category forms
- * @aliases Toggle switch, On/off
- * @documentation https://helix.fusion.dev/components/switch
- *
- * @cssproperty --switch-block-size - Height of the track. The width follows it.
- * @cssproperty --switch-inline-size - Length of the track, if not the derived one.
- * @cssproperty --switch-on-color - Fill when it is on.
- * @cssproperty --switch-thumb-color - The handle, in both states.
- */
 let HelixSwitch = class HelixSwitch extends HelixHeadlessSwitch {
     static { this.styles = [fieldStyles, fieldInlineStyles, styles]; }
 };

package/dist/table/cell/table-cell.css.js

@@ -1,4 +1,3 @@
-// Generated from src/table/cell/table-cell.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 

package/dist/table/cell/table-cell.js

@@ -7,20 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTableCell } from '@fusion.dev/helix-headless/table';
 import { styles } from './table-cell.css.js';
-/**
- * @summary One cell of a table.
- *
- * @description
- * Hairline rules between rows and no fill, per the rule that depth comes from a
- * single border rather than from elevation. A dense table earns its density by
- * decorating none of it.
- *
- * @since 0.1.0
- * @status experimental
- * @documentation https://helix.fusion.dev/components/table
- *
- * @slot - The cell's content.
- */
 let HelixTableCell = class HelixTableCell extends HelixHeadlessTableCell {
     static { this.styles = styles; }
 };

package/dist/table/column/table-column.css.js

@@ -1,4 +1,3 @@
-// Generated from src/table/column/table-column.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: contents;

package/dist/table/column/table-column.js

@@ -7,19 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTableColumn } from '@fusion.dev/helix-headless/table';
 import { styles } from './table-column.css.js';
-/**
- * @summary One column of a table: its heading, and how wide it is.
- *
- * @description
- * Styled as the header cell it is, and it carries the same rule and inset as
- * the cells beneath it so the heading and its column read as one line down the
- * table.
- *
- * @since 0.1.0
- * @status experimental
- * @aliases Column header, Th
- * @documentation https://helix.fusion.dev/components/table
- */
 let HelixTableColumn = class HelixTableColumn extends HelixHeadlessTableColumn {
     static { this.styles = styles; }
 };

package/dist/table/root/table-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/table/root/table-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: block;

package/dist/table/root/table-root.js

@@ -7,25 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTable } from '@fusion.dev/helix-headless/table';
 import { styles } from './table-root.css.js';
-/**
- * @summary Tabular data laid out on a grid.
- *
- * @description
- * Hairline rules between rows and no fill, per the rule that depth comes from a
- * single border rather than from elevation. A dense table earns its density by
- * decorating none of it.
- *
- * @since 0.1.0
- * @status experimental
- * @category data
- * @documentation https://helix.fusion.dev/components/table
- *
- * @slot - The table's rows.
- *
- * @csspart table - The grid.
- *
- * @cssproperty --table-columns - Track list for the columns.
- */
 let HelixTable = class HelixTable extends HelixHeadlessTable {
     static { this.styles = styles; }
 };

package/dist/table/row/table-row.css.js

@@ -1,4 +1,3 @@
-// Generated from src/table/row/table-row.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: contents;

package/dist/table/row/table-row.js

@@ -7,20 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTableRow } from '@fusion.dev/helix-headless/table';
 import { styles } from './table-row.css.js';
-/**
- * @summary One row of a table.
- *
- * @description
- * Hairline rules between rows and no fill, per the rule that depth comes from a
- * single border rather than from elevation. A dense table earns its density by
- * decorating none of it.
- *
- * @since 0.1.0
- * @status experimental
- * @documentation https://helix.fusion.dev/components/table
- *
- * @slot - The row's cells.
- */
 let HelixTableRow = class HelixTableRow extends HelixHeadlessTableRow {
     static { this.styles = styles; }
 };

package/dist/tabs/panel/tab-panel.css.js

@@ -1,4 +1,3 @@
-// Generated from src/tabs/panel/tab-panel.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 

package/dist/tabs/panel/tab-panel.js

@@ -7,22 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTabPanel } from '@fusion.dev/helix-headless/tabs';
 import { styles } from './tab-panel.css.js';
-/**
- * @summary The content shown for one tab.
- *
- * @description
- * Selection is marked with a rule under the active tab rather than a filled
- * pill, which keeps the row flat and lets the underline animate between tabs as
- * a movement instead of two separate fills.
- *
- * @since 0.1.0
- * @status experimental
- * @documentation https://helix.fusion.dev/components/tabs
- *
- * @slot - The panel's content.
- *
- * @csspart panel - The panel container.
- */
 let HelixTabPanel = class HelixTabPanel extends HelixHeadlessTabPanel {
     static { this.styles = styles; }
 };

package/dist/tabs/root/tabs-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/tabs/root/tabs-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 

package/dist/tabs/root/tabs-root.js

@@ -7,25 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTabs } from '@fusion.dev/helix-headless/tabs';
 import { styles } from './tabs-root.css.js';
-/**
- * @summary A row of tabs and the panel each one shows.
- *
- * @description
- * Selection is marked with a rule under the active tab rather than a filled
- * pill, which keeps the row flat and lets the underline animate between tabs as
- * a movement instead of two separate fills.
- *
- * @since 0.1.0
- * @status experimental
- * @category navigation
- * @documentation https://helix.fusion.dev/components/tabs
- *
- * @slot - The tabs.
- * @slot panels - The panels.
- *
- * @csspart panels - The panel container.
- * @csspart tabs - The tab list.
- */
 let HelixTabs = class HelixTabs extends HelixHeadlessTabs {
     static { this.styles = styles; }
 };

package/dist/tabs/tab/tab.css.js

@@ -1,4 +1,3 @@
-// Generated from src/tabs/tab/tab.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: inline-flex;

package/dist/tabs/tab/tab.js

@@ -7,22 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTab } from '@fusion.dev/helix-headless/tabs';
 import { styles } from './tab.css.js';
-/**
- * @summary One tab in a tab list.
- *
- * @description
- * Selection is marked with a rule under the active tab rather than a filled
- * pill, which keeps the row flat and lets the underline animate between tabs as
- * a movement instead of two separate fills.
- *
- * @since 0.1.0
- * @status experimental
- * @documentation https://helix.fusion.dev/components/tabs
- *
- * @slot - The tab's label.
- *
- * @csspart tab - The tab itself.
- */
 let HelixTab = class HelixTab extends HelixHeadlessTab {
     static { this.styles = styles; }
 };

package/dist/tag/root/tag-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/tag/root/tag-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 align-items: center;

package/dist/tag/root/tag-root.js

@@ -8,31 +8,6 @@ import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTag } from '@fusion.dev/helix-headless/tag';
 import { property } from 'lit/decorators.js';
 import { styles } from './tag-root.css.js';
-/**
- * @summary Labels content with a short piece of metadata.
- *
- * @description
- * Seven tones. The fill is a tint of the status color, mixed with
- * `color-mix` rather than held as a token per status, so a theme that changes
- * the status colors gets the tints with them.
- *
- * @since 0.1.0
- * @status stable
- * @category markers
- * @aliases Chip, Pill, Label
- * @documentation https://helix.fusion.dev/components/tag
- *
- * @slot - The tag's label.
- *
- * @event {HelixDismissEvent} helix-dismiss - Fired when the reader asks to remove the tag. Cancelable: refusing it takes the decision and nothing moves.
- *
- * @csspart dismiss - The remove button, when `dismissible`.
- *
- * @cssproperty --tag-background-color - Fill behind the tag.
- * @cssproperty --tag-border-color - Color of the edge, for a chip that separates by fill alone.
- * @cssproperty --tag-foreground-color - Label color.
- * @cssproperty --tag-radius - Corner radius of the tag.
- */
 let HelixTag = class HelixTag extends HelixHeadlessTag {
     static { this.styles = styles; }
 };

package/dist/text/root/text-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/text/root/text-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: inline;

package/dist/text/root/text-root.js

@@ -8,7 +8,6 @@ import { customElement, HelixElement } from '@fusion.dev/helix-core';
 import { property } from 'lit/decorators.js';
 import { literal, html as staticHtml } from 'lit/static-html.js';
 import { styles } from './text-root.css.js';
-/** Tags this may render. Static values, so they can be interpolated as a tag. */
 const TAGS = {
     code: literal `code`,
     em: literal `em`,
@@ -23,55 +22,8 @@ const TAGS = {
     span: literal `span`,
     strong: literal `strong`,
 };
-/**
- * @summary A run of text, with the element and the look chosen separately.
- *
- * @description
- * Two properties, and they answer different questions. `as` is the element,
- * which decides the document outline and what a screen reader announces.
- * `variant` is the ramp, which decides size, weight, leading, and tracking
- * together.
- *
- * They are separate because they genuinely come apart: a section's second
- * heading sometimes has to look smaller without lying about the outline, and a
- * `<p>` sometimes has to read as a caption. They default to matching, so the
- * common case is `as="h2"` and nothing else.
- *
- * The pairing is resolved in CSS rather than by computing an attribute, so the
- * element writes nothing to its own host: `as="h2"` picks up the heading ramp
- * through a selector, and setting `variant` takes the pairing rule out of play.
- * Deriving it in `willUpdate` works and must not be done: it puts an attribute
- * on the host that the server's markup does not have, which is a hydration
- * mismatch in every React consumer.
- *
- * **Size, weight, and leading are not properties.** Exposing them separately
- * offers a few hundred combinations of which a handful are right, and every
- * caller then picks one. A ramp is a decision the system already made:
- * the ramp is named, and a page built from it is consistent because there was
- * nothing else to choose.
- *
- * `tone` stays separate, because color carries state rather than typography.
- * Folding it in would mean `caption-danger` and `label-primary` and the rest of
- * cross product, which is the explosion a named ramp exists to prevent.
- *
- * @since 0.1.0
- * @status experimental
- * @category typography
- * @aliases Paragraph, Copy, Label, Caption, Heading, Title
- * @documentation https://helix.fusion.dev/components/text
- *
- * @slot - The text.
- *
- * @csspart text - The rendered element.
- */
 let HelixText = class HelixText extends HelixElement {
     render() {
-        /* `Object.hasOwn`, not a truthy index.
-         *
-         * `TAGS[this.as]` reaches `Object.prototype`, so `as="constructor"` and
-         * every other inherited key came back truthy and were passed to
-         * `staticHtml` as a tag: the result is a lit marker rendered as an element
-         * name, not the span fallback and not a throw. Own keys only. */
         const tag = (this.as && Object.hasOwn(TAGS, this.as) ? TAGS[this.as] : undefined) ?? literal `span`;
         return staticHtml `<${tag} part="text"><slot></slot></${tag}>`;
     }

package/dist/textarea/root/textarea-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/textarea/root/textarea-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: flex;

package/dist/textarea/root/textarea-root.js

@@ -9,23 +9,6 @@ import { HelixHeadlessTextarea } from '@fusion.dev/helix-headless/textarea';
 import { styles as fieldStyles } from '../../shared/field/field.css.js';
 import { styles as fieldStackedStyles } from '../../shared/field/field-stacked.css.js';
 import { styles } from './textarea-root.css.js';
-/**
- * @summary Several lines of text a reader types into.
- *
- * @description
- * The same frame an `Input` wears, so a form of mixed fields reads as one set
- * rather than as two kinds of box. What differs is the resize handle, which is
- * the platform's and is left alone on the block axis only: a field that can be
- * dragged wider than the form holding it is a field that breaks the layout.
- *
- * @since 0.1.0
- * @status stable
- * @category forms
- * @aliases Multiline, TextArea
- * @documentation https://helix.fusion.dev/components/textarea
- *
- * @cssproperty --textarea-background-color - Fill behind the text.
- */
 let HelixTextarea = class HelixTextarea extends HelixHeadlessTextarea {
     static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }
 };

package/dist/time-input/root/time-input-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/time-input/root/time-input-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: block;

package/dist/time-input/root/time-input-root.js

@@ -6,43 +6,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTimeInput } from '@fusion.dev/helix-headless/time-input';
-/* Side-effect imports, because the tier below renders both of these and a custom
-   element registers on import. Inherited from the base along with the template,
-   which is why they are restated here. */
 import '../../icon/index.js';
 import '../../tag/index.js';
 import '../../time-picker/index.js';
 import { styles as fieldStyles } from '../../shared/field/field.css.js';
 import { styles as fieldStackedStyles } from '../../shared/field/field-stacked.css.js';
 import { styles } from './time-input-root.css.js';
-/**
- * @summary A time, typed or picked from a list.
- *
- * @description
- * The frame is the field rather than the input, so the trigger sits inside the
- * same box as the text and the focus ring is drawn once around the whole
- * control. The trigger is a mark within that box rather than a button beside it,
- * the arrangement Date Input settled on.
- *
- * The panel is the field's width, which is the one place this differs from Input
- * Date: a calendar is seven columns with a width of its own, and a list of times
- * is a column of one line each, so it should be as wide as the control it
- * belongs to. That is the same reasoning Select gives for its own list.
- *
- * @since 0.1.0
- * @status experimental
- * @category forms
- * @aliases TimeField, InputTime
- * @documentation https://helix.fusion.dev/components/time-input
- *
- * @cssproperty --time-input-background-color - Fill behind the field.
- * @cssproperty --time-input-border-color - Color of the panel's edge.
- * @cssproperty --time-input-border-width - Width of the panel's edge. Follows
- *   `--helix-border-floating`, which is `0`, so the panel is told apart by its lift unless a
- *   theme says otherwise.
- * @cssproperty --time-input-shadow - Lift under the panel. Follows `--helix-shadow-floating`:
- *   a floating surface sits over content nobody can predict, so it keeps a lift by default.
- */
 let HelixTimeInput = class HelixTimeInput extends HelixHeadlessTimeInput {
     static { this.tier = 'helix-'; }
     static { this.styles = [fieldStyles, fieldStackedStyles, styles]; }

package/dist/time-picker/root/time-picker-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/time-picker/root/time-picker-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: block;

package/dist/time-picker/root/time-picker-root.js

@@ -6,38 +6,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTimePicker } from '@fusion.dev/helix-headless/time-picker';
-/* Side-effect imports, because the tier below renders both of these and a custom
-   element registers on import. Inherited from the base along with the template,
-   which is why they are restated here: this file has neither tag in it to remind
-   anyone. */
 import '../../listbox/index.js';
 import '../../option/index.js';
 import { styles } from './time-picker-root.css.js';
-/**
- * @summary Picks a time, from a list of them.
- *
- * @description
- * A bounded list on a surface of its own, because ninety-six rows is taller than
- * anywhere it will be put. `--time-picker-list-block-size` is the bound and it is a height
- * rather than a count of rows: what a panel has is room, and a row count would
- * have to be recomputed every time the density changed.
- *
- * No border and no fill of its own. Flat on a page it takes what it is given,
- * and in Time Input's panel the panel supplies both: a list that brought its own
- * card would be a card inside a card there.
- *
- * @since 0.1.0
- * @status experimental
- * @category forms
- * @aliases Time, TimeList
- * @documentation https://helix.fusion.dev/components/time-picker
- *
- * @cssproperty --time-picker-list-block-size - How tall the list is before it scrolls.
- * @cssproperty --time-picker-range-color - Wash behind the times inside a range.
- * @cssproperty --time-picker-row-size - Height and least width of one row in a wheel.
- * @cssproperty --time-picker-selected-color - Fill on the chosen row of a wheel.
- * @cssproperty --time-picker-wheel-block-size - How tall a wheel is. Five rows by default.
- */
 let HelixTimePicker = class HelixTimePicker extends HelixHeadlessTimePicker {
     static { this.tier = 'helix-'; }
     static { this.styles = styles; }

package/dist/timeline/item/timeline-item.css.js

@@ -1,4 +1,3 @@
-// Generated from src/timeline/item/timeline-item.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 column-gap: var(--helix-space-md);

package/dist/timeline/item/timeline-item.js

@@ -7,23 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTimelineItem } from '@fusion.dev/helix-headless/timeline';
 import { styles } from './timeline-item.css.js';
-/**
- * @summary One event on a timeline: when it happened, and what it was.
- *
- * @description
- * Presentation only: the rail down the side, the mark on it, and the line that
- * arrives at this entry from the one before.
- *
- * @since 0.1.0
- * @status stable
- * @category data
- * @aliases Activity item, History entry, Event
- * @documentation https://helix.fusion.dev/components/timeline
- *
- * @cssproperty --timeline-marker-radius - How round the mark is. Zero is a square, and half its size is a disc.
- * @cssproperty --timeline-marker-size - Edge length of the mark.
- * @cssproperty --timeline-rail-size - Width of the line.
- */
 let HelixTimelineItem = class HelixTimelineItem extends HelixHeadlessTimelineItem {
     static { this.styles = styles; }
 };

package/dist/timeline/root/timeline-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/timeline/root/timeline-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: flex;

package/dist/timeline/root/timeline-root.js

@@ -7,21 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTimeline } from '@fusion.dev/helix-headless/timeline';
 import { styles } from './timeline-root.css.js';
-/**
- * @summary A record of what happened, in the order it happened.
- *
- * @description
- * Presentation only: the direction time runs in, and the spacing between one
- * event and the next. Every entry draws its own mark and its own line.
- *
- * @since 0.1.0
- * @status stable
- * @category data
- * @aliases Activity feed, History, Changelog, Audit trail
- * @documentation https://helix.fusion.dev/components/timeline
- *
- * @cssproperty --timeline-gap - Space between one entry and the next.
- */
 let HelixTimeline = class HelixTimeline extends HelixHeadlessTimeline {
     static { this.styles = styles; }
 };

package/dist/toast/item/toast-item.css.js

@@ -1,4 +1,3 @@
-// Generated from src/toast/item/toast-item.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 

package/dist/toast/item/toast-item.js

@@ -7,27 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessToastItem } from '@fusion.dev/helix-headless/toast';
 import { styles } from './toast-item.css.js';
-/**
- * @summary One message in the toast region.
- *
- * @description
- * A surface with a shadow, because a toast sits over whatever the reader was
- * looking at rather than in it. The severity is a bar down the leading edge and
- * not a fill: a message is text to be read, and a colored panel behind it
- * costs contrast for something the mark already says.
- *
- * @since 0.1.0
- * @status experimental
- * @documentation https://helix.fusion.dev/components/toast
- *
- * @cssproperty --toast-border-color - Color of the panel's edge.
- * @cssproperty --toast-border-width - Width of the panel's edge. Follows
- *   `--helix-border-floating`, which is `0`, so the panel is told apart by its lift unless a
- *   theme says otherwise.
- * @cssproperty --toast-item-padding - Space between the message's edge and its contents.
- * @cssproperty --toast-shadow - Lift under the panel. Follows `--helix-shadow-floating`: a
- *   floating surface sits over content nobody can predict, so it keeps a lift by default.
- */
 let HelixToastItem = class HelixToastItem extends HelixHeadlessToastItem {
     static { this.styles = styles; }
 };

package/dist/toast/root/toast-root.css.js

@@ -1,4 +1,3 @@
-// Generated from src/toast/root/toast-root.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 --_toast-inset: var(--toast-inset, var(--helix-space-lg));

package/dist/toast/root/toast-root.js

@@ -7,33 +7,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessToast } from '@fusion.dev/helix-headless/toast';
 import { styles } from './toast-root.css.js';
-/**
- * @summary The region messages arrive in, and the only thing that announces them.
- *
- * @description
- * Fixed to the window, and it catches nothing: the region spans a whole edge,
- * so a stack of one message in a corner would otherwise put an invisible bar
- * across everything beside it. The region is transparent to a pointer and the
- * messages take it back.
- *
- * **It belongs at the root of the application.** `position: fixed` is
- * positioned against the viewport only while no ancestor carries `transform`,
- * `filter`, `perspective` or `contain`, any of which makes that ancestor the
- * containing block instead, and it is still clipped by an ancestor with
- * `overflow: hidden`. That is a real constraint rather than a style note, and
- * it is the same fact that put every other floating surface in this library
- * into the top layer.
- *
- * @since 0.1.0
- * @status experimental
- * @category overlays
- * @aliases Toaster, Snackbar, Notifications
- * @documentation https://helix.fusion.dev/components/toast
- *
- * @cssproperty --toast-gap - Space between one message and the next.
- * @cssproperty --toast-inline-size - Width of a message.
- * @cssproperty --toast-inset - Distance from the edges of the window.
- */
 let HelixToast = class HelixToast extends HelixHeadlessToast {
     static { this.styles = styles; }
 };

package/dist/toggle/group/toggle-group.css.js

@@ -1,4 +1,3 @@
-// Generated from src/toggle/group/toggle-group.css by `turbo run styles`. Do not edit.
 import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 display: inline-flex;