@fusion.dev/helix 0.162.1 → 0.164.0

package/types/vue.d.ts

@@ -2025,6 +2025,11 @@ A word property: register it for a locale under the host's key. A family
 that names the control otherwise, such as Tag's `Remove {label}`,
 declares its own English with `@words` above the override. */
   dismissLabel?: (HelixCallout["dismissLabel"]) | undefined;
+  /** Whether the callout is showing. A dismissal nobody canceled turns it
+false and the callout hides itself, and setting it true shows the callout
+again. Not reflected: open is the resting state, so an `open` attribute
+would appear on markup a server sent without it. */
+  open?: (HelixCallout["open"]) | undefined;
   /** What kind of attention the passage needs.
 
 `tone` is the axis for what a thing means, and this is a subset of it: a
@@ -2059,7 +2064,7 @@ out keeps its English, and `tone-label` wins over both.
 };
 
 export type HelixCalloutVueEvents = {
-  /** The dismiss button was pressed. The callout does not remove itself, so remove it in response. Cancelable. */
+  /** The dismiss button was pressed. Unless a listener cancels it, the callout hides itself, and a listener may remove it instead. Cancelable: cancel it to keep the callout showing. */
   "helix-dismiss": HelixCalloutHelixDismissElementEvent;
 };
 
@@ -2674,6 +2679,13 @@ zoom as a percentage, written the way the element's locale writes one. */
   /** What screen readers hear after a zoom button or key, with `{zoom}` for the
 zoom as a percentage, written the way the element's locale writes one. */
   zoomedLabel?: (HelixCanvas["zoomedLabel"]) | undefined;
+  /** Draws every connection's line: a function from where it leaves and
+arrives, and the sides it does, to its SVG path and where its label sits.
+
+Absent, or returning nothing for a connection, draws the board's own
+route. A function that throws draws the board's own too, and the error is
+reported to the page as an uncaught one. Set it as a property. */
+  edgeRoute?: (HelixCanvas["edgeRoute"]) | undefined;
   /** The board's current view: the document's point at the middle of the view,
 and the zoom.
 
@@ -3974,6 +3986,14 @@ app.ts", as `code-name-label` puts it. */
   "collapse-label"?: (HelixCodeBlock["collapseLabel"]) | undefined;
   /** The expand button's words while the block shows every line. */
   collapseLabel?: (HelixCodeBlock["collapseLabel"]) | undefined;
+  /** In a diff, how many unchanged lines to keep beside each change. Each
+longer run of unchanged lines is folded behind a button that shows it.
+Unset shows every line the diff holds. */
+  "context-lines"?: (HelixCodeBlock["contextLines"] | `${number}`) | undefined;
+  /** In a diff, how many unchanged lines to keep beside each change. Each
+longer run of unchanged lines is folded behind a button that shows it.
+Unset shows every line the diff holds. */
+  contextLines?: (HelixCodeBlock["contextLines"]) | undefined;
   /** The copy button's name and tooltip text after a copy. */
   "copied-label"?: (HelixCodeBlock["copiedLabel"]) | undefined;
   /** The copy button's name and tooltip text after a copy. */
@@ -4012,6 +4032,14 @@ block lays out. Not for a diff, whose files each scroll on their own. */
   "expand-label"?: (HelixCodeBlock["expandLabel"]) | undefined;
   /** The expand button's words while the cap hides lines. */
   expandLabel?: (HelixCodeBlock["expandLabel"]) | undefined;
+  /** The words of a button that hides a run of unchanged lines it showed, in a
+diff with `context-lines`. `{count}` is how many, and each language
+writes the forms it has. */
+  "hide-unchanged-label"?: (HelixCodeBlock["hideUnchangedLabel"]) | undefined;
+  /** The words of a button that hides a run of unchanged lines it showed, in a
+diff with `context-lines`. `{count}` is how many, and each language
+writes the forms it has. */
+  hideUnchangedLabel?: (HelixCodeBlock["hideUnchangedLabel"]) | undefined;
   /** The block's name, usually a file name, drawn in the header.
 
 Absent, the block is named by `language` where there is one. In a diff,
@@ -4087,6 +4115,12 @@ A false boolean reflects as the attribute's absence, so this costs no
 reflected property taking no default is satisfied by the default being
 `false`. */
   noCopy?: (HelixCodeBlock["noCopy"]) | undefined;
+  /** The words of a button that shows a folded run of unchanged lines, in a
+diff with `context-lines`. `{count}` is how many. */
+  "show-unchanged-label"?: (HelixCodeBlock["showUnchangedLabel"]) | undefined;
+  /** The words of a button that shows a folded run of unchanged lines, in a
+diff with `context-lines`. `{count}` is how many. */
+  showUnchangedLabel?: (HelixCodeBlock["showUnchangedLabel"]) | undefined;
   /** How a diff's two versions are arranged. It has no effect without `diff`.
 
 Absent is unified, each removal above its replacement, which fits any
@@ -11964,7 +11998,8 @@ was never tickable look identical from here. Announcing only the ticked one
 as a checkbox tells a reader its siblings are commands, which is the one
 thing they are not.
 
-`checked` implies it, so a row that is on never has to say both.
+`checked` and `exclusive` imply it, so a row that is on, or one of a set,
+never has to say both.
 
 Choosing the row checks or unchecks it, after a `helix-before-toggle` that
 you can cancel. */
@@ -11974,6 +12009,18 @@ you can cancel. */
 The row changes it when it is chosen. Not reflected: the attribute is the
 state you start the row in, and `:state(checked)` carries the current one. */
   checked?: (HelixMenuItem["checked"]) | undefined;
+  /** Whether choosing the row closes the menu.
+
+Unset takes the menu's `close-on-select`, which is on, and keeps the menu
+open after a Space on a choice row. Write `close-on-select="false"` for a
+row that changes something the reader is watching, such as a zoom step. */
+  "close-on-select"?: (HelixMenuItem["closeOnSelect"]) | undefined;
+  /** Whether choosing the row closes the menu.
+
+Unset takes the menu's `close-on-select`, which is on, and keeps the menu
+open after a Space on a choice row. Write `close-on-select="false"` for a
+row that changes something the reader is watching, such as a zoom step. */
+  closeOnSelect?: (HelixMenuItem["closeOnSelect"]) | undefined;
   /** Whether the row is disabled, so it cannot be chosen. */
   disabled?: (HelixMenuItem["disabled"]) | undefined;
   /** Whether the link downloads the file when the row is chosen.
@@ -11990,8 +12037,7 @@ that row and unchecks the others. Choosing the row that is checked leaves
 it checked. `menuitemradio` tells a reader which kind of set they are in,
 where `menuitemcheckbox` says every row is independent.
 
-Meaningless without `checkable`, since a row that cannot be ticked is not
-one of a set of anything. */
+It makes the row a choice, so it needs no `checkable` beside it. */
   exclusive?: (HelixMenuItem["exclusive"]) | undefined;
   /** The URL the row links to. Setting it renders the row as a link.
 
@@ -12079,6 +12125,18 @@ the resolved state for stylesheets, which is what the mirror is for. */
   "back-label"?: (HelixMenu["backLabel"]) | undefined;
   /** The text of the row that returns from a submenu. */
   backLabel?: (HelixMenu["backLabel"]) | undefined;
+  /** Whether choosing a row closes the menu.
+
+On by default, and a Space on a choice row leaves the menu open either way.
+Write `close-on-select="false"` to keep the menu open after every choice, as
+Ark UI's `closeOnSelect` does. A row's own `close-on-select` wins over this. */
+  "close-on-select"?: (HelixMenu["closeOnSelect"]) | undefined;
+  /** Whether choosing a row closes the menu.
+
+On by default, and a Space on a choice row leaves the menu open either way.
+Write `close-on-select="false"` to keep the menu open after every choice, as
+Ark UI's `closeOnSelect` does. A row's own `close-on-select` wins over this. */
+  closeOnSelect?: (HelixMenu["closeOnSelect"]) | undefined;
   /** Whether the menu is the trigger's context menu: it opens where the reader
 asks for one, with a right-click, a long press, Shift+F10 or the menu key. */
   context?: (HelixMenu["context"]) | undefined;
@@ -12962,6 +13020,12 @@ reader sees the shape of the value before its contents. `0` starts with the
 root closed; a large number opens everything, which on a big value is the
 wall of text this exists to avoid. */
   defaultDepth?: (HelixObjectInspector["defaultDepth"]) | undefined;
+  /** What the tree says while there is no value to show, such as before a
+fetch answers. The `empty` slot replaces it. */
+  "empty-label"?: (HelixObjectInspector["emptyLabel"]) | undefined;
+  /** What the tree says while there is no value to show, such as before a
+fetch answers. The `empty` slot replaces it. */
+  emptyLabel?: (HelixObjectInspector["emptyLabel"]) | undefined;
   /** Text the tree is narrowed to: the entries whose key or value holds it,
 ignoring case, and the branches that lead to them. Empty shows everything. */
   filter?: (HelixObjectInspector["filter"]) | undefined;
@@ -13031,6 +13095,12 @@ who set the property. This button is positioned out of the flow and takes no
 room, so nothing selects on it, and reflection exists so that a selector can
 reach a value. */
   noCopy?: (HelixObjectInspector["noCopy"]) | undefined;
+  /** What the tree says while a filter matched no entry. The `empty` slot
+replaces it. */
+  "no-matches-label"?: (HelixObjectInspector["noMatchesLabel"]) | undefined;
+  /** What the tree says while a filter matched no entry. The `empty` slot
+replaces it. */
+  noMatchesLabel?: (HelixObjectInspector["noMatchesLabel"]) | undefined;
   /** What a screen reader hears when a filter matches one entry, where
 `results-label` should not say it. `{count}` is the count. */
   "result-label"?: (HelixObjectInspector["resultLabel"]) | undefined;
@@ -14776,6 +14846,9 @@ keyed on this attribute, and of the 56 tokens that differ by scheme the
 theme engine emits 19. The other 37 would stay light in a dark preview,
 including every one of the 24 series colors a chart reads. */
   colorMode?: (HelixSandboxPreview["colorMode"]) | undefined;
+  /** Whether the preview draws a reload button and a button that opens the
+example in a new tab, in its corner. */
+  controls?: (HelixSandboxPreview["controls"]) | undefined;
   /** Writing direction inside the frame.
 
 Not reflected. It is payload for the render message and nothing selects on
@@ -14797,6 +14870,18 @@ Not reflected, for `direction`'s reason: the placement is applied by the
 document inside the frame, against its own root, so no rule on this side
 could read it. */
   layout?: (HelixSandboxPreview["layout"]) | undefined;
+  /** The name of the button that opens the example in a new tab, under
+`controls`. */
+  "open-label"?: (HelixSandboxPreview["openLabel"]) | undefined;
+  /** The name of the button that opens the example in a new tab, under
+`controls`. */
+  openLabel?: (HelixSandboxPreview["openLabel"]) | undefined;
+  /** The name of the button that reloads the frame's document, under
+`controls`. */
+  "reload-label"?: (HelixSandboxPreview["reloadLabel"]) | undefined;
+  /** The name of the button that reloads the frame's document, under
+`controls`. */
+  reloadLabel?: (HelixSandboxPreview["reloadLabel"]) | undefined;
   /** A script to run as a module after the markup, on every render of new
 source. A sandbox writes its `js` pane here. */
   script?: (HelixSandboxPreview["script"]) | undefined;
@@ -14818,6 +14903,9 @@ export type HelixSandboxPreviewVueEvents = {
 
 /** `HelixSandbox` component event */
 export type HelixSandboxElementEvent<E = Event> = TypedEvent<HelixSandbox, E>;
+/** `helix-before-change` event type */
+export type HelixSandboxHelixBeforeChangeElementEvent =
+  HelixSandboxElementEvent<HelixBeforeChangeEvent>;
 /** `helix-before-edit` event type */
 export type HelixSandboxHelixBeforeEditElementEvent =
   HelixSandboxElementEvent<HelixBeforeEditEvent>;
@@ -14885,6 +14973,14 @@ sandbox back to the size it already was.
 Declared rather than captured, so it is a number a consumer states and can
 change, and it needs no first frame to be read on. */
   defaultSplit?: (HelixSandbox["defaultSplit"]) | undefined;
+  /** The `name` of the source pane shown, where the sandbox holds several.
+
+Unset, or a name no pane has, shows the first. */
+  file?: (HelixSandbox["file"]) | undefined;
+  /** The name of the file tabs, read by screen readers. */
+  "files-label"?: (HelixSandbox["filesLabel"]) | undefined;
+  /** The name of the file tabs, read by screen readers. */
+  filesLabel?: (HelixSandbox["filesLabel"]) | undefined;
   /** Which pane comes first, before the divider.
 
 A sandbox is read in one of two directions and the two are not a
@@ -14958,6 +15054,10 @@ is `preview`. */
 };
 
 export type HelixSandboxVueEvents = {
+  /** A file tab showed its pane, whose `name` `file` now holds. */
+  change: HelixSandboxElementEvent;
+  /** Fired before a file tab shows its pane, with the pane's `name`. Cancelable: cancel it to keep the pane shown. */
+  "helix-before-change": HelixSandboxHelixBeforeChangeElementEvent;
   /** Fired before the source is edited. The source pane dispatches it, and you can listen for it on the sandbox. Cancelable: cancel it to keep the source unchanged. */
   "helix-before-edit": HelixSandboxHelixBeforeEditElementEvent;
   /** Fired before the panel's divider is released, with the panel's height in pixels. A panel dragged closed reports `panel-collapsed-size`, its smallest height. Cancelable: cancel it to keep the current height. */
@@ -15002,6 +15102,9 @@ export type HelixSandboxSourceVueProps = {
   "keys-description"?: (HelixSandboxSource["keysDescription"]) | undefined;
   /** The field's description, read by screen readers while Tab indents. */
   keysDescription?: (HelixSandboxSource["keysDescription"]) | undefined;
+  /** The pane's file name, such as `index.html`, on its tab where a sandbox
+holds several panes. Empty puts the pane's `name` on the tab. */
+  label?: (HelixSandboxSource["label"]) | undefined;
   /** Which source this pane holds. Every `helix-before-edit` event includes it.
 
 `html` and `css` are what the sandbox root routes on; any other name is
@@ -20117,9 +20220,15 @@ export type HelixVideoPlaylistHelixActivateElementEvent =
 /** `helix-before-activate` event type */
 export type HelixVideoPlaylistHelixBeforeActivateElementEvent =
   HelixVideoPlaylistElementEvent<HelixBeforeActivateEvent>;
+/** `helix-before-reorder` event type */
+export type HelixVideoPlaylistHelixBeforeReorderElementEvent =
+  HelixVideoPlaylistElementEvent<HelixBeforeReorderEvent>;
 /** `helix-end` event type */
 export type HelixVideoPlaylistHelixEndElementEvent =
   HelixVideoPlaylistElementEvent<HelixEndEvent>;
+/** `helix-reorder` event type */
+export type HelixVideoPlaylistHelixReorderElementEvent =
+  HelixVideoPlaylistElementEvent<HelixReorderEvent>;
 
 export type HelixVideoPlaylistVueProps = {
   /** The `value` of the current item.
@@ -20139,12 +20248,32 @@ Ignored once `active` is written. */
 
 Ignored once `active` is written. */
   defaultActive?: (HelixVideoPlaylist["defaultActive"]) | undefined;
+  /** What screen readers hear when a move is put back, in a `reorderable`
+playlist. `{name}` is the entry's words. */
+  "canceled-label"?: (HelixVideoPlaylist["canceledLabel"]) | undefined;
+  /** What screen readers hear when a move is put back, in a `reorderable`
+playlist. `{name}` is the entry's words. */
+  canceledLabel?: (HelixVideoPlaylist["canceledLabel"]) | undefined;
+  /** What screen readers hear when a moved entry is let go, in a `reorderable`
+playlist. `{name}` is the entry's words. */
+  "dropped-label"?: (HelixVideoPlaylist["droppedLabel"]) | undefined;
+  /** What screen readers hear when a moved entry is let go, in a `reorderable`
+playlist. `{name}` is the entry's words. */
+  droppedLabel?: (HelixVideoPlaylist["droppedLabel"]) | undefined;
   /** What the playlist says while it has no entries. The `empty` slot replaces it. */
   "empty-label"?: (HelixVideoPlaylist["emptyLabel"]) | undefined;
   /** What the playlist says while it has no entries. The `empty` slot replaces it. */
   emptyLabel?: (HelixVideoPlaylist["emptyLabel"]) | undefined;
   /** The list's name, read by screen readers. */
   label?: (HelixVideoPlaylist["label"]) | undefined;
+  /** What screen readers hear each time a key moves an entry, in a
+`reorderable` playlist. `{name}` is the entry's words, `{position}` its
+new place, counting from 1, and `{count}` the number of entries. */
+  "moved-label"?: (HelixVideoPlaylist["movedLabel"]) | undefined;
+  /** What screen readers hear each time a key moves an entry, in a
+`reorderable` playlist. `{name}` is the entry's words, `{position}` its
+new place, counting from 1, and `{count}` the number of entries. */
+  movedLabel?: (HelixVideoPlaylist["movedLabel"]) | undefined;
   /** Stays on an entry when its clip ends, where the playlist would otherwise
 play the next one. The player's controls, a press, and `next()` still
 move. `repeat="one"` still plays the entry again. */
@@ -20153,6 +20282,12 @@ move. `repeat="one"` still plays the entry again. */
 play the next one. The player's controls, a press, and `next()` still
 move. `repeat="one"` still plays the entry again. */
   noAdvance?: (HelixVideoPlaylist["noAdvance"]) | undefined;
+  /** What screen readers hear when a pointer picks up an entry, in a
+`reorderable` playlist. `{name}` is the entry's words. */
+  "picked-up-label"?: (HelixVideoPlaylist["pickedUpLabel"]) | undefined;
+  /** What screen readers hear when a pointer picks up an entry, in a
+`reorderable` playlist. `{name}` is the entry's words. */
+  pickedUpLabel?: (HelixVideoPlaylist["pickedUpLabel"]) | undefined;
   /** What the live region says when the playlist moves to another entry.
 `{title}` is the entry's name.
 
@@ -20167,6 +20302,10 @@ playlist starts the next one, and the only other trace of that is the
 playlist starts the next one, and the only other trace of that is the
 `aria-current` on a button the reader is not on. */
   playingLabel?: (HelixVideoPlaylist["playingLabel"]) | undefined;
+  /** Lets a reader move the entries, with Alt and the arrow keys or by
+dragging one. The playlist moves no entry itself: you move your entries
+on `helix-reorder`. */
+  reorderable?: (HelixVideoPlaylist["reorderable"]) | undefined;
   /** What happens when an entry ends with no next one to go to. `one` plays the
 same entry again, and `all` goes from the last entry back to the first.
 Absent, the playlist stops on the last entry and sends `helix-end`.
@@ -20186,8 +20325,12 @@ export type HelixVideoPlaylistVueEvents = {
   "helix-activate": HelixVideoPlaylistHelixActivateElementEvent;
   /** The current entry is about to change, and `detail.cause` says why: `press`, `next`, `previous`, `ended`, or `removed`. Cancelable: cancel it to keep the current entry. */
   "helix-before-activate": HelixVideoPlaylistHelixBeforeActivateElementEvent;
+  /** An entry was moved to a new place, in a `reorderable` playlist, with every entry's value in the new order in `detail.keys`. Cancelable: cancel it to keep the entry where it is. */
+  "helix-before-reorder": HelixVideoPlaylistHelixBeforeReorderElementEvent;
   /** The last entry finished playing, and the playlist stopped there. Not sent while `repeat` is set. */
   "helix-end": HelixVideoPlaylistHelixEndElementEvent;
+  /** Fired after `helix-before-reorder` when nobody canceled it. Move your entries to the order in `keys`. Cancelable: cancel it to say the move did not happen. */
+  "helix-reorder": HelixVideoPlaylistHelixReorderElementEvent;
 };
 
 /** `HelixVideo` component event */
@@ -21130,6 +21273,10 @@ export type CustomCssProperties = {
   "--canvas-label-editor-inline-size"?: (string) | undefined;
   /** The size of the label on a connection. */
   "--canvas-label-font-size"?: (string) | undefined;
+  /** The height of the minimap, under `controls="minimap"`. */
+  "--canvas-minimap-block-size"?: (string) | undefined;
+  /** The width of the minimap, under `controls="minimap"`. */
+  "--canvas-minimap-inline-size"?: (string) | undefined;
   /** The frame's corners. */
   "--canvas-radius"?: (string) | undefined;
   /** The color of what is selected: a card's outline, its corners and its move handle, a connection and its ends, and the box drawn to select. */
@@ -23966,13 +24113,13 @@ export interface WcToolkitVueGlobalComponents {
     HelixRatingVueProps,
     HelixRatingVueEvents
   >;
-  /** A sandboxed '<iframe>' that loads 'src', a document you provide. That document imports what the examples need, listens for a render message, and writes the markup into itself.  **Without 'src', the frame loads a built-in document**, so a sandbox renders with nothing to host. It runs HTML, CSS, and scripts, and reports the console, uncaught errors, its height, and presses as a frame on 'servePreview' does. It defines no element, so an example that uses Helix components needs a 'src' that imports them.  **Examples render in a frame**, so an example's styles and scripts do not affect the page around the sandbox, and 'position: fixed' stays inside the pane. The frame starts empty, with its own stylesheets and its own custom element registry, so 'src' must load the styles and components the examples use.  **The source is untrusted, and the frame keeps it isolated.** The frame uses 'sandbox="allow-scripts"' and never 'allow-same-origin'. Together, the two let a document on the same origin remove its own sandbox, which is the same as having none.  **A preview says where it is.** It is ':state(loading)' from the moment it has a 'src' until that document can take the example, and again through 'reload()'. It is ':state(failed)' once the example throws an error it does not catch, until the next source is sent, which a frame on 'servePreview' reports. A page draws its own spinner or message from either, such as a sibling shown by 'helix-sandbox-preview:state(failed) + .message'. */
+  /** A sandboxed '<iframe>' that loads 'src', a document you provide. That document imports what the examples need, listens for a render message, and writes the markup into itself.  **Without 'src', the frame loads a built-in document**, so a sandbox renders with nothing to host. It runs HTML, CSS, and scripts, and reports the console, uncaught errors, its height, and presses as a frame on 'servePreview' does. It defines no element, so an example that uses Helix components needs a 'src' that imports them.  **Examples render in a frame**, so an example's styles and scripts do not affect the page around the sandbox, and 'position: fixed' stays inside the pane. The frame starts empty, with its own stylesheets and its own custom element registry, so 'src' must load the styles and components the examples use.  **The source is untrusted, and the frame keeps it isolated.** The frame uses 'sandbox="allow-scripts"' and never 'allow-same-origin'. Together, the two let a document on the same origin remove its own sandbox, which is the same as having none.  **A preview says where it is.** It is ':state(loading)' from the moment it has a 'src' until that document can take the example, and again through 'reload()'. It is ':state(failed)' once the example throws an error it does not catch, until the next source is sent, which a frame on 'servePreview' reports. A page draws its own spinner or message from either, such as a sibling shown by 'helix-sandbox-preview:state(failed) + .message'.  **A failed preview shows the error over the example**, in the 'error' part, until the next source is sent. The terminal says it too, so the part is not announced. Hide it with '::part(error) { display: none }' where the page draws its own.  **'controls' draws two buttons in the preview's corner**: one reloads the frame's document, as 'reload()' does, and one opens the example in a new tab, as 'open()' does. The tab runs it in a frame sandboxed as this one is. */
   "helix-sandbox-preview": DefineCustomElement<
     HelixSandboxPreview,
     HelixSandboxPreviewVueProps,
     HelixSandboxPreviewVueEvents
   >;
-  /** A source pane dispatches 'helix-before-edit', which bubbles, and the sandbox passes the value to the preview slotted into it. The source pane and the preview do not reference each other, so you can replace either one or use it alone.  The event carries the pane's 'name', so one sandbox can hold several panes. 'html' sets the preview's markup, 'css' sets its stylesheet, and 'js' sets a script that runs as a module after the markup. The sandbox ignores a pane with any other name, so that pane can show content without changing the preview.  **The dividers are two nested 'helix-splitter' elements**, which handle the pointer, the keyboard, and the corner. The inner splitter holds the panes and the outer one holds the panel, so the panel spans the full width.  On a focused divider, the arrow keys move it, and 'Home' and 'End' move it to its ends. 'Enter' on the panes divider shuts the lead pane, and pressed again it opens the pane where it was. 'Enter' on the panel divider shuts the panel to 'panel-collapsed-size', and pressed again it opens the panel to its last height. */
+  /** A source pane dispatches 'helix-before-edit', which bubbles, and the sandbox passes the value to the preview slotted into it. The source pane and the preview do not reference each other, so you can replace either one or use it alone.  The event carries the pane's 'name', so one sandbox can hold several panes. 'html' sets the preview's markup, 'css' sets its stylesheet, and 'js' sets a script that runs as a module after the markup. The sandbox ignores a pane with any other name, so that pane can show content without changing the preview.  **The dividers are two nested 'helix-splitter' elements**, which handle the pointer, the keyboard, and the corner. The inner splitter holds the panes and the outer one holds the panel, so the panel spans the full width.  **Several source panes are files**, one shown at a time under a row of tabs, each named by the pane's 'label' or, without one, its 'name'. 'file' holds the 'name' of the pane shown. The tabs are a tab list: the arrow keys move between them and show each pane, and 'Home' and 'End' go to the first and the last. Choosing one sends 'helix-before-change' with the pane's 'name', which you can cancel, and 'change' once 'file' holds it. The panes not shown carry 'hidden'. One pane draws no tabs.  **Any editor can be the source pane**: an element in the 'source' slot with a 'name' that dispatches 'helix-before-edit' with its text, which bubbles. A wrapper around CodeMirror or Monaco sends one on each change and is a pane like 'helix-sandbox-source', and the sandbox reads its 'value' to seed the preview. Dispatch 'helix-caret' from it too for the status bar's position.  On a focused divider, the arrow keys move it, and 'Home' and 'End' move it to its ends. 'Enter' on the panes divider shuts the lead pane, and pressed again it opens the pane where it was. 'Enter' on the panel divider shuts the panel to 'panel-collapsed-size', and pressed again it opens the panel to its last height. */
   "helix-sandbox": DefineCustomElement<
     HelixSandbox,
     HelixSandboxVueProps,

package/types/words.d.ts

@@ -1157,6 +1157,21 @@ declare module '@fusion.dev/helix-core' {
        * English: `Show all lines`
        */
       expandLabel: Message
+      /**
+       * The words of a button that hides a run of unchanged lines it showed, in a
+       * diff with `context-lines`. `{count}` is how many, and each language
+       * writes the forms it has.
+       *
+       * English: `{count, plural, one {Hide # unchanged line} other {Hide # unchanged lines}}`
+       */
+      hideUnchangedLabel: Message
+      /**
+       * The words of a button that shows a folded run of unchanged lines, in a
+       * diff with `context-lines`. `{count}` is how many.
+       *
+       * English: `{count, plural, one {Show # unchanged line} other {Show # unchanged lines}}`
+       */
+      showUnchangedLabel: Message
       /**
        * The wrap button's name, which it keeps whether it is pressed or not.
        *
@@ -1895,6 +1910,13 @@ declare module '@fusion.dev/helix-core' {
        * English: `Copy value`
        */
       copyValueLabel: Message
+      /**
+       * What the tree says while there is no value to show, such as before a
+       * fetch answers. The `empty` slot replaces it.
+       *
+       * English: `Nothing to show`
+       */
+      emptyLabel: Message
       /**
        * The filter field's placeholder and accessible name.
        *
@@ -1917,6 +1939,13 @@ declare module '@fusion.dev/helix-core' {
        * English: `{count, plural, one {# key} other {# keys}}`
        */
       keysLabel: Message
+      /**
+       * What the tree says while a filter matched no entry. The `empty` slot
+       * replaces it.
+       *
+       * English: `No matches`
+       */
+      noMatchesLabel: Message
       /**
        * What a screen reader hears when a filter matches entries. `{count}` is
        * how many, written in the locale, and each language writes the forms it
@@ -2107,6 +2136,12 @@ declare module '@fusion.dev/helix-core' {
        * English: `Resize panes and panel`
        */
       cornerLabel: Message
+      /**
+       * The name of the file tabs, read by screen readers.
+       *
+       * English: `Files`
+       */
+      filesLabel: Message
       /**
        * The name of the panel's divider, read by screen readers.
        *
@@ -2130,6 +2165,20 @@ declare module '@fusion.dev/helix-core' {
        * English: `Preview`
        */
       label: Message
+      /**
+       * The name of the button that opens the example in a new tab, under
+       * `controls`.
+       *
+       * English: `Open preview in a new tab`
+       */
+      openLabel: Message
+      /**
+       * The name of the button that reloads the frame's document, under
+       * `controls`.
+       *
+       * English: `Reload preview`
+       */
+      reloadLabel: Message
     }
     'helix-sandbox-source': {
       /**
@@ -2780,6 +2829,20 @@ declare module '@fusion.dev/helix-core' {
       volumeLabel: Message
     }
     'helix-video-playlist': {
+      /**
+       * What screen readers hear when a move is put back, in a `reorderable`
+       * playlist. `{name}` is the entry's words.
+       *
+       * English: `Canceled`
+       */
+      canceledLabel: Message
+      /**
+       * What screen readers hear when a moved entry is let go, in a `reorderable`
+       * playlist. `{name}` is the entry's words.
+       *
+       * English: `Dropped`
+       */
+      droppedLabel: Message
       /**
        * What the playlist says while it has no entries. The `empty` slot replaces it.
        *
@@ -2792,6 +2855,21 @@ declare module '@fusion.dev/helix-core' {
        * English: `Playlist`
        */
       label: Message
+      /**
+       * What screen readers hear each time a key moves an entry, in a
+       * `reorderable` playlist. `{name}` is the entry's words, `{position}` its
+       * new place, counting from 1, and `{count}` the number of entries.
+       *
+       * English: `{name} moved to position {position} of {count}`
+       */
+      movedLabel: Message
+      /**
+       * What screen readers hear when a pointer picks up an entry, in a
+       * `reorderable` playlist. `{name}` is the entry's words.
+       *
+       * English: `Picked up {name}`
+       */
+      pickedUpLabel: Message
       /**
        * What the live region says when the playlist moves to another entry.
        * `{title}` is the entry's name.