@fusion.dev/helix-headless 0.220.0 → 0.221.0

package/types/jsx.d.ts

@@ -95,6 +95,7 @@ import type {
   HelixHeadlessDrawer,
   HelixHeadlessDrilldown,
   HelixHeadlessDrilldownItem,
+  HelixHeadlessEditor,
   HelixHeadlessEmpty,
   HelixHeadlessFileInput,
   HelixHeadlessFilterChip,
@@ -7413,7 +7414,7 @@ Here rather than on each control. */
   /** The problems in the text, each underlined and listed under the editor. */
   diagnostics?: (HelixHeadlessCodeEditor["diagnostics"]) | undefined;
   /** What draws the editor, such as `codeMirrorEngine()` from
-`@fusion.dev/helix-editor`. Absent, the editor is a plain text field. */
+`@fusion.dev/helix-code-editor`. Absent, the editor is a plain text field. */
   engine?: (HelixHeadlessCodeEditor["engine"]) | undefined;
 
   /** The reader finished an edit and focus left the code, in the engine or the plain field. */
@@ -7614,7 +7615,7 @@ Here rather than on each control. */
   /** The problems in the text, each underlined and listed under the editor. */
   "prop:diagnostics"?: (HelixHeadlessCodeEditor["diagnostics"]) | undefined;
   /** What draws the editor, such as `codeMirrorEngine()` from
-`@fusion.dev/helix-editor`. Absent, the editor is a plain text field. */
+`@fusion.dev/helix-code-editor`. Absent, the editor is a plain text field. */
   "prop:engine"?: (HelixHeadlessCodeEditor["engine"]) | undefined;
   /** The reader finished an edit and focus left the code, in the engine or the plain field. */
   "on:change"?: ((e: HelixHeadlessCodeEditorElementEvent) => void) | undefined;
@@ -15262,6 +15263,251 @@ say that without the component knowing what a row looks like. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixHeadlessEditor` component event */
+export type HelixHeadlessEditorElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessEditor,
+  E
+>;
+/** `helix-found` event type */
+export type HelixHeadlessEditorHelixFoundElementEvent =
+  HelixHeadlessEditorElementEvent<HelixFoundEvent>;
+
+export type HelixHeadlessEditorProps = {
+  /** The block menu button's name. `{name}` is the block type at the selection. */
+  "block-chosen-label"?: (HelixHeadlessEditor["blockChosenLabel"]) | undefined;
+  /** The block menu button's name. `{name}` is the block type at the selection. */
+  blockChosenLabel?: (HelixHeadlessEditor["blockChosenLabel"]) | undefined;
+  /** The block menu's name, read by screen readers. */
+  "block-label"?: (HelixHeadlessEditor["blockLabel"]) | undefined;
+  /** The block menu's name, read by screen readers. */
+  blockLabel?: (HelixHeadlessEditor["blockLabel"]) | undefined;
+  /** The Bold button's label. */
+  "bold-label"?: (HelixHeadlessEditor["boldLabel"]) | undefined;
+  /** The Bold button's label. */
+  boldLabel?: (HelixHeadlessEditor["boldLabel"]) | undefined;
+  /** The Bulleted list button's label. */
+  "bullet-list-label"?: (HelixHeadlessEditor["bulletListLabel"]) | undefined;
+  /** The Bulleted list button's label. */
+  bulletListLabel?: (HelixHeadlessEditor["bulletListLabel"]) | undefined;
+  /** The Code block row's label in the block menu. */
+  "code-block-label"?: (HelixHeadlessEditor["codeBlockLabel"]) | undefined;
+  /** The Code block row's label in the block menu. */
+  codeBlockLabel?: (HelixHeadlessEditor["codeBlockLabel"]) | undefined;
+  /** The Code button's label. */
+  "code-label"?: (HelixHeadlessEditor["codeLabel"]) | undefined;
+  /** The Code button's label. */
+  codeLabel?: (HelixHeadlessEditor["codeLabel"]) | undefined;
+  /** The toolbar's name, read by screen readers. */
+  "controls-label"?: (HelixHeadlessEditor["controlsLabel"]) | undefined;
+  /** The toolbar's name, read by screen readers. */
+  controlsLabel?: (HelixHeadlessEditor["controlsLabel"]) | undefined;
+  /** The document's name where `label` is empty and the host has no `aria-label`. */
+  "fallback-label"?: (HelixHeadlessEditor["fallbackLabel"]) | undefined;
+  /** The document's name where `label` is empty and the host has no `aria-label`. */
+  fallbackLabel?: (HelixHeadlessEditor["fallbackLabel"]) | undefined;
+  /** The Find button's label, and the find bar's name. */
+  "find-label"?: (HelixHeadlessEditor["findLabel"]) | undefined;
+  /** The Find button's label, and the find bar's name. */
+  findLabel?: (HelixHeadlessEditor["findLabel"]) | undefined;
+  /** A heading's name in the block menu. `{level}` is its level, 1 to 3. */
+  "heading-label"?: (HelixHeadlessEditor["headingLabel"]) | undefined;
+  /** A heading's name in the block menu. `{level}` is its level, 1 to 3. */
+  headingLabel?: (HelixHeadlessEditor["headingLabel"]) | undefined;
+  /** The Italic button's label. */
+  "italic-label"?: (HelixHeadlessEditor["italicLabel"]) | undefined;
+  /** The Italic button's label. */
+  italicLabel?: (HelixHeadlessEditor["italicLabel"]) | undefined;
+  /** The document's name, read by screen readers. Name what it holds, such as
+"Release notes", so that several editors on one page can be told apart.
+Required. */
+  label?: (HelixHeadlessEditor["label"]) | undefined;
+  /** The Apply button's label in the address bar. */
+  "link-apply-label"?: (HelixHeadlessEditor["linkApplyLabel"]) | undefined;
+  /** The Apply button's label in the address bar. */
+  linkApplyLabel?: (HelixHeadlessEditor["linkApplyLabel"]) | undefined;
+  /** The close button's label in the address bar. */
+  "link-close-label"?: (HelixHeadlessEditor["linkCloseLabel"]) | undefined;
+  /** The close button's label in the address bar. */
+  linkCloseLabel?: (HelixHeadlessEditor["linkCloseLabel"]) | undefined;
+  /** The name of the address bar's toolbar, read by screen readers. */
+  "link-controls-label"?: (HelixHeadlessEditor["linkControlsLabel"]) | undefined;
+  /** The name of the address bar's toolbar, read by screen readers. */
+  linkControlsLabel?: (HelixHeadlessEditor["linkControlsLabel"]) | undefined;
+  /** The address field's name, which it also shows while it is empty. */
+  "link-field-label"?: (HelixHeadlessEditor["linkFieldLabel"]) | undefined;
+  /** The address field's name, which it also shows while it is empty. */
+  linkFieldLabel?: (HelixHeadlessEditor["linkFieldLabel"]) | undefined;
+  /** The Link button's label, and the address bar's name. */
+  "link-label"?: (HelixHeadlessEditor["linkLabel"]) | undefined;
+  /** The Link button's label, and the address bar's name. */
+  linkLabel?: (HelixHeadlessEditor["linkLabel"]) | undefined;
+  /** The Remove button's label in the address bar. */
+  "link-remove-label"?: (HelixHeadlessEditor["linkRemoveLabel"]) | undefined;
+  /** The Remove button's label in the address bar. */
+  linkRemoveLabel?: (HelixHeadlessEditor["linkRemoveLabel"]) | undefined;
+  /** The Numbered list button's label. */
+  "ordered-list-label"?: (HelixHeadlessEditor["orderedListLabel"]) | undefined;
+  /** The Numbered list button's label. */
+  orderedListLabel?: (HelixHeadlessEditor["orderedListLabel"]) | undefined;
+  /** The Paragraph row's label in the block menu. */
+  "paragraph-label"?: (HelixHeadlessEditor["paragraphLabel"]) | undefined;
+  /** The Paragraph row's label in the block menu. */
+  paragraphLabel?: (HelixHeadlessEditor["paragraphLabel"]) | undefined;
+  /** The words shown in an empty document, such as "Write the release notes". */
+  placeholder?: (HelixHeadlessEditor["placeholder"]) | undefined;
+  /** The Quote button's label. */
+  "quote-label"?: (HelixHeadlessEditor["quoteLabel"]) | undefined;
+  /** The Quote button's label. */
+  quoteLabel?: (HelixHeadlessEditor["quoteLabel"]) | undefined;
+  /** Shows the document and takes no edits, with no toolbar, for a document
+someone reads, or one an agent is writing. The attribute is `readonly`,
+the platform's spelling. */
+  readonly?: (HelixHeadlessEditor["readOnly"]) | undefined;
+  /** Shows the document and takes no edits, with no toolbar, for a document
+someone reads, or one an agent is writing. The attribute is `readonly`,
+the platform's spelling. */
+  readOnly?: (HelixHeadlessEditor["readOnly"]) | undefined;
+  /** The Redo button's label. */
+  "redo-label"?: (HelixHeadlessEditor["redoLabel"]) | undefined;
+  /** The Redo button's label. */
+  redoLabel?: (HelixHeadlessEditor["redoLabel"]) | undefined;
+  /** The Strikethrough button's label. */
+  "strike-label"?: (HelixHeadlessEditor["strikeLabel"]) | undefined;
+  /** The Strikethrough button's label. */
+  strikeLabel?: (HelixHeadlessEditor["strikeLabel"]) | undefined;
+  /** Which groups of tools the toolbar draws, as a list of `history`, `block`,
+`marks`, `link`, `lists`, and `quote`, or `none`. They are drawn in that
+order, whatever order the list is in. Absent is all six. */
+  tools?: (HelixHeadlessEditor["tools"]) | undefined;
+  /** The Undo button's label. */
+  "undo-label"?: (HelixHeadlessEditor["undoLabel"]) | undefined;
+  /** The Undo button's label. */
+  undoLabel?: (HelixHeadlessEditor["undoLabel"]) | undefined;
+
+  /** The find bar searched or moved among the matches, with `count` and the selected match's `index`, counting from 0, or -1 for none. */
+  "onhelix-found"?: ((e: HelixHeadlessEditorHelixFoundElementEvent) => void) | undefined;
+};
+
+export type HelixHeadlessEditorSolidJsProps = {
+  /** The block menu button's name. `{name}` is the block type at the selection. */
+  "attr:block-chosen-label"?: (HelixHeadlessEditor["blockChosenLabel"]) | undefined;
+  /** The block menu button's name. `{name}` is the block type at the selection. */
+  "prop:blockChosenLabel"?: (HelixHeadlessEditor["blockChosenLabel"]) | undefined;
+  /** The block menu's name, read by screen readers. */
+  "attr:block-label"?: (HelixHeadlessEditor["blockLabel"]) | undefined;
+  /** The block menu's name, read by screen readers. */
+  "prop:blockLabel"?: (HelixHeadlessEditor["blockLabel"]) | undefined;
+  /** The Bold button's label. */
+  "attr:bold-label"?: (HelixHeadlessEditor["boldLabel"]) | undefined;
+  /** The Bold button's label. */
+  "prop:boldLabel"?: (HelixHeadlessEditor["boldLabel"]) | undefined;
+  /** The Bulleted list button's label. */
+  "attr:bullet-list-label"?: (HelixHeadlessEditor["bulletListLabel"]) | undefined;
+  /** The Bulleted list button's label. */
+  "prop:bulletListLabel"?: (HelixHeadlessEditor["bulletListLabel"]) | undefined;
+  /** The Code block row's label in the block menu. */
+  "attr:code-block-label"?: (HelixHeadlessEditor["codeBlockLabel"]) | undefined;
+  /** The Code block row's label in the block menu. */
+  "prop:codeBlockLabel"?: (HelixHeadlessEditor["codeBlockLabel"]) | undefined;
+  /** The Code button's label. */
+  "attr:code-label"?: (HelixHeadlessEditor["codeLabel"]) | undefined;
+  /** The Code button's label. */
+  "prop:codeLabel"?: (HelixHeadlessEditor["codeLabel"]) | undefined;
+  /** The toolbar's name, read by screen readers. */
+  "attr:controls-label"?: (HelixHeadlessEditor["controlsLabel"]) | undefined;
+  /** The toolbar's name, read by screen readers. */
+  "prop:controlsLabel"?: (HelixHeadlessEditor["controlsLabel"]) | undefined;
+  /** The document's name where `label` is empty and the host has no `aria-label`. */
+  "attr:fallback-label"?: (HelixHeadlessEditor["fallbackLabel"]) | undefined;
+  /** The document's name where `label` is empty and the host has no `aria-label`. */
+  "prop:fallbackLabel"?: (HelixHeadlessEditor["fallbackLabel"]) | undefined;
+  /** The Find button's label, and the find bar's name. */
+  "attr:find-label"?: (HelixHeadlessEditor["findLabel"]) | undefined;
+  /** The Find button's label, and the find bar's name. */
+  "prop:findLabel"?: (HelixHeadlessEditor["findLabel"]) | undefined;
+  /** A heading's name in the block menu. `{level}` is its level, 1 to 3. */
+  "attr:heading-label"?: (HelixHeadlessEditor["headingLabel"]) | undefined;
+  /** A heading's name in the block menu. `{level}` is its level, 1 to 3. */
+  "prop:headingLabel"?: (HelixHeadlessEditor["headingLabel"]) | undefined;
+  /** The Italic button's label. */
+  "attr:italic-label"?: (HelixHeadlessEditor["italicLabel"]) | undefined;
+  /** The Italic button's label. */
+  "prop:italicLabel"?: (HelixHeadlessEditor["italicLabel"]) | undefined;
+  /** The document's name, read by screen readers. Name what it holds, such as
+"Release notes", so that several editors on one page can be told apart.
+Required. */
+  "prop:label"?: (HelixHeadlessEditor["label"]) | undefined;
+  /** The Apply button's label in the address bar. */
+  "attr:link-apply-label"?: (HelixHeadlessEditor["linkApplyLabel"]) | undefined;
+  /** The Apply button's label in the address bar. */
+  "prop:linkApplyLabel"?: (HelixHeadlessEditor["linkApplyLabel"]) | undefined;
+  /** The close button's label in the address bar. */
+  "attr:link-close-label"?: (HelixHeadlessEditor["linkCloseLabel"]) | undefined;
+  /** The close button's label in the address bar. */
+  "prop:linkCloseLabel"?: (HelixHeadlessEditor["linkCloseLabel"]) | undefined;
+  /** The name of the address bar's toolbar, read by screen readers. */
+  "attr:link-controls-label"?: (HelixHeadlessEditor["linkControlsLabel"]) | undefined;
+  /** The name of the address bar's toolbar, read by screen readers. */
+  "prop:linkControlsLabel"?: (HelixHeadlessEditor["linkControlsLabel"]) | undefined;
+  /** The address field's name, which it also shows while it is empty. */
+  "attr:link-field-label"?: (HelixHeadlessEditor["linkFieldLabel"]) | undefined;
+  /** The address field's name, which it also shows while it is empty. */
+  "prop:linkFieldLabel"?: (HelixHeadlessEditor["linkFieldLabel"]) | undefined;
+  /** The Link button's label, and the address bar's name. */
+  "attr:link-label"?: (HelixHeadlessEditor["linkLabel"]) | undefined;
+  /** The Link button's label, and the address bar's name. */
+  "prop:linkLabel"?: (HelixHeadlessEditor["linkLabel"]) | undefined;
+  /** The Remove button's label in the address bar. */
+  "attr:link-remove-label"?: (HelixHeadlessEditor["linkRemoveLabel"]) | undefined;
+  /** The Remove button's label in the address bar. */
+  "prop:linkRemoveLabel"?: (HelixHeadlessEditor["linkRemoveLabel"]) | undefined;
+  /** The Numbered list button's label. */
+  "attr:ordered-list-label"?: (HelixHeadlessEditor["orderedListLabel"]) | undefined;
+  /** The Numbered list button's label. */
+  "prop:orderedListLabel"?: (HelixHeadlessEditor["orderedListLabel"]) | undefined;
+  /** The Paragraph row's label in the block menu. */
+  "attr:paragraph-label"?: (HelixHeadlessEditor["paragraphLabel"]) | undefined;
+  /** The Paragraph row's label in the block menu. */
+  "prop:paragraphLabel"?: (HelixHeadlessEditor["paragraphLabel"]) | undefined;
+  /** The words shown in an empty document, such as "Write the release notes". */
+  "prop:placeholder"?: (HelixHeadlessEditor["placeholder"]) | undefined;
+  /** The Quote button's label. */
+  "attr:quote-label"?: (HelixHeadlessEditor["quoteLabel"]) | undefined;
+  /** The Quote button's label. */
+  "prop:quoteLabel"?: (HelixHeadlessEditor["quoteLabel"]) | undefined;
+  /** Shows the document and takes no edits, with no toolbar, for a document
+someone reads, or one an agent is writing. The attribute is `readonly`,
+the platform's spelling. */
+  "bool:readonly"?: (HelixHeadlessEditor["readOnly"]) | undefined;
+  /** Shows the document and takes no edits, with no toolbar, for a document
+someone reads, or one an agent is writing. The attribute is `readonly`,
+the platform's spelling. */
+  "prop:readOnly"?: (HelixHeadlessEditor["readOnly"]) | undefined;
+  /** The Redo button's label. */
+  "attr:redo-label"?: (HelixHeadlessEditor["redoLabel"]) | undefined;
+  /** The Redo button's label. */
+  "prop:redoLabel"?: (HelixHeadlessEditor["redoLabel"]) | undefined;
+  /** The Strikethrough button's label. */
+  "attr:strike-label"?: (HelixHeadlessEditor["strikeLabel"]) | undefined;
+  /** The Strikethrough button's label. */
+  "prop:strikeLabel"?: (HelixHeadlessEditor["strikeLabel"]) | undefined;
+  /** Which groups of tools the toolbar draws, as a list of `history`, `block`,
+`marks`, `link`, `lists`, and `quote`, or `none`. They are drawn in that
+order, whatever order the list is in. Absent is all six. */
+  "prop:tools"?: (HelixHeadlessEditor["tools"]) | undefined;
+  /** The Undo button's label. */
+  "attr:undo-label"?: (HelixHeadlessEditor["undoLabel"]) | undefined;
+  /** The Undo button's label. */
+  "prop:undoLabel"?: (HelixHeadlessEditor["undoLabel"]) | undefined;
+  /** The find bar searched or moved among the matches, with `count` and the selected match's `index`, counting from 0, or -1 for none. */
+  "on:helix-found"?: ((e: HelixHeadlessEditorHelixFoundElementEvent) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 export type HelixHeadlessEmptyProps = {
   /** The heading as words, such as "No results", drawn as a heading when
 nothing is slotted into `heading`.
@@ -49072,8 +49318,8 @@ export type CustomElements<F extends Framework = "other"> = {
    * A pane for working on a file: a header with its name, its language and the
    * page's own actions, the code, the problems in it, and a status line that
    * says where the caret is. On its own the code is a `<textarea>` in the code
-   * face. Connect an engine and it draws the code instead: `connectEditor` from
-   * `@fusion.dev/helix-editor` connects CodeMirror, with highlighting in your
+   * face. Connect an engine and it draws the code instead: `connectCodeEditor` from
+   * `@fusion.dev/helix-code-editor` connects CodeMirror, with highlighting in your
    * theme's syntax colors, line numbers, folding, bracket matching and history.
    * The value, the form, validation and the events stay the editor's, so a page
    * reads and writes it the same either way.
@@ -49192,7 +49438,7 @@ export type CustomElements<F extends Framework = "other"> = {
    * Here rather than on each control.
    * - `diagnostics`: The problems in the text, each underlined and listed under the editor. (property only)
    * - `engine`: What draws the editor, such as `codeMirrorEngine()` from
-   * `@fusion.dev/helix-editor`. Absent, the editor is a plain text field. (property only)
+   * `@fusion.dev/helix-code-editor`. Absent, the editor is a plain text field. (property only)
    * - `validity`: Whether the control meets its constraints, and why not. (property only) (readonly)
    * - `validationMessage`: The message the browser would show for the control, or an empty string. (property only) (readonly)
    * - `willValidate`: Whether the control is checked when its form is submitted. (property only) (readonly)
@@ -54649,6 +54895,344 @@ export type CustomElements<F extends Framework = "other"> = {
     HelixHeadlessDrilldownProps & BaseProps<HelixHeadlessDrilldown, F> & BaseEvents<HelixHeadlessDrilldown>
   >;
 
+  /**
+   * Wraps a document drawn by ProseMirror or another rich text editor. The frame
+   * adds a toolbar, an address bar for links, and a box the document is drawn
+   * in. `connectEditor` from `@fusion.dev/helix-editor` connects ProseMirror:
+   * it gives the document Helix's typed blocks, each with a stable id, and draws
+   * them in your theme.
+   *
+   * The document is the element you write inside the frame, so it stays in the
+   * page: the browser's input methods, spellcheck, and right-to-left text work in
+   * it as they do in any field. A server can send the document's HTML there, and
+   * it reads before any script loads. Mark it `data-prose`, so the base layer
+   * draws its headings, lists, and quotes before a renderer connects.
+   *
+   * The toolbar's groups are named by `tools`, in this order: `history` (Undo
+   * and Redo), `block` (a menu of Paragraph, three headings, and Code block),
+   * `marks` (Bold, Italic, Strikethrough, and Code), `link`, `lists` (Bulleted
+   * and Numbered), and `quote`, which are drawn by default, and `find`, the Find
+   * button, which is drawn where `tools` names it. A tool the renderer cannot run
+   * is left out once it is connected, and a tool that cannot apply at the
+   * selection is disabled. A tool returns focus to the document once it has run.
+   * With `readonly`, the document cannot be edited and the toolbar is not drawn.
+   *
+   * Command+F opens a find bar under the toolbar, a Find that searches the
+   * document through the renderer, marks every match, and selects one. It
+   * replaces unless the document is `readonly`, which it searches too.
+   *
+   * **Keyboard.** In the document:
+   *
+   * - Command+B, Command+I, Command+Shift+X, and Command+E make text bold,
+   *   italic, struck through, and code. Use Control in place of Command on
+   *   Windows and Linux.
+   * - Command+Alt+0 makes a paragraph, Command+Alt+1 to 3 a heading, and
+   *   Command+Alt+8 a code block.
+   * - Command+Shift+8, Command+Shift+7, and Command+Shift+9 make a bulleted
+   *   list, a numbered list, and a quote.
+   * - Command+K opens the address bar for a link. Enter applies the address,
+   *   and Escape closes the bar.
+   * - Command+Z undoes, and Command+Shift+Z redoes.
+   * - In a list, Tab nests the item and Shift+Tab lifts it. Escape then Tab
+   *   leaves the document from anywhere, so a list never keeps focus.
+   * - Alt+F10 moves focus to the toolbar. The arrow keys move between its
+   *   tools, and Escape returns to the document.
+   * - Command+F opens the find bar. Enter and Shift+Enter move between the
+   *   matches, and Escape closes the bar and returns to the document.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `block-chosen-label`/`blockChosenLabel`: The block menu button's name. `{name}` is the block type at the selection.
+   * - `block-label`/`blockLabel`: The block menu's name, read by screen readers.
+   * - `bold-label`/`boldLabel`: The Bold button's label.
+   * - `bullet-list-label`/`bulletListLabel`: The Bulleted list button's label.
+   * - `code-block-label`/`codeBlockLabel`: The Code block row's label in the block menu.
+   * - `code-label`/`codeLabel`: The Code button's label.
+   * - `controls-label`/`controlsLabel`: The toolbar's name, read by screen readers.
+   * - `fallback-label`/`fallbackLabel`: The document's name where `label` is empty and the host has no `aria-label`.
+   * - `find-label`/`findLabel`: The Find button's label, and the find bar's name.
+   * - `heading-label`/`headingLabel`: A heading's name in the block menu. `{level}` is its level, 1 to 3.
+   * - `italic-label`/`italicLabel`: The Italic button's label.
+   * - `label`: The document's name, read by screen readers. Name what it holds, such as
+   * "Release notes", so that several editors on one page can be told apart.
+   * Required.
+   * - `link-apply-label`/`linkApplyLabel`: The Apply button's label in the address bar.
+   * - `link-close-label`/`linkCloseLabel`: The close button's label in the address bar.
+   * - `link-controls-label`/`linkControlsLabel`: The name of the address bar's toolbar, read by screen readers.
+   * - `link-field-label`/`linkFieldLabel`: The address field's name, which it also shows while it is empty.
+   * - `link-label`/`linkLabel`: The Link button's label, and the address bar's name.
+   * - `link-remove-label`/`linkRemoveLabel`: The Remove button's label in the address bar.
+   * - `ordered-list-label`/`orderedListLabel`: The Numbered list button's label.
+   * - `paragraph-label`/`paragraphLabel`: The Paragraph row's label in the block menu.
+   * - `placeholder`: The words shown in an empty document, such as "Write the release notes".
+   * - `quote-label`/`quoteLabel`: The Quote button's label.
+   * - `readonly`/`readOnly`: Shows the document and takes no edits, with no toolbar, for a document
+   * someone reads, or one an agent is writing. The attribute is `readonly`,
+   * the platform's spelling.
+   * - `redo-label`/`redoLabel`: The Redo button's label.
+   * - `strike-label`/`strikeLabel`: The Strikethrough button's label.
+   * - `tools`: Which groups of tools the toolbar draws, as a list of `history`, `block`,
+   * `marks`, `link`, `lists`, and `quote`, or `none`. They are drawn in that
+   * order, whatever order the list is in. Absent is all six.
+   * - `undo-label`/`undoLabel`: The Undo button's label.
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-found`: The find bar searched or moved among the matches, with `count` and the selected match's `index`, counting from 0, or -1 for none.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The element your renderer draws the document in.
+   * - `actions`: Controls of your own at the end of the toolbar, such as Share or Comment.
+   * - `bold-icon`: Replaces the glyph inside the Bold button.
+   * - `bullet-list-icon`: Replaces the glyph inside the Bulleted list button.
+   * - `code-icon`: Replaces the glyph inside the Code button.
+   * - `find-icon`: Replaces the glyph inside the Find button.
+   * - `footer`: Content under the document, such as a word count or whether it is saved.
+   * - `italic-icon`: Replaces the glyph inside the Italic button.
+   * - `link-icon`: Replaces the glyph inside the Link button.
+   * - `ordered-list-icon`: Replaces the glyph inside the Numbered list button.
+   * - `quote-icon`: Replaces the glyph inside the Quote button.
+   * - `redo-icon`: Replaces the glyph inside the Redo button.
+   * - `strike-icon`: Replaces the glyph inside the Strikethrough button.
+   * - `undo-icon`: Replaces the glyph inside the Undo button.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `attach(renderer: EditorRenderer) => EditorSink`: Hands the frame what draws the document. The frame sends it the settings
+   * now and as they change, asks it to run the tools the reader presses, and
+   * draws the toolbar from what it reports through the sink it gets back.
+   * Attaching another renderer detaches this one.
+   * - `run(tool: EditorTool, value?: string) => boolean`: Runs a tool at the selection, as its button does, and says whether it
+   * ran: a block type, a mark, a list, a quote, a step through history, or a
+   * link to `value`, where an empty `value` takes the link off. Nothing runs
+   * while no renderer is attached, or while `readonly`.
+   * - `focus(options?: FocusOptions) => void`: Puts focus in the document, with the selection where it was.
+   * - `openLink() => void`: Opens the address bar with the address of the link at the selection, and puts focus in its field.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `actions`: The `actions` slot, last in the toolbar.
+   * - `block`: The button that opens the block menu, which names the block type at the selection.
+   * - `block-button`: The block menu button's inner button.
+   * - `block-live`: The block menu button's live region, which speaks while the button is pending.
+   * - `block-menu`: The menu of block types.
+   * - `block-menu-back`: The control that returns from a submenu.
+   * - `block-menu-back-mark`: The glyph on the back control of a submenu.
+   * - `block-menu-empty`: The text shown when the menu has no items.
+   * - `block-menu-header`: The bar above a submenu, holding the way back and its name.
+   * - `block-menu-live`: The block menu's live region, which repeats the empty and loading text for screen readers.
+   * - `block-menu-loading`: The text shown while the items are loading.
+   * - `block-menu-search-field`: The block menu's filter field, drawn with `filterable`.
+   * - `block-menu-surface`: The floating panel the block menu is drawn on.
+   * - `block-menu-title`: The name of the submenu that is showing.
+   * - `block-name`: The name of the block type at the selection, in the block menu's button.
+   * - `block-option`: One block type in the block menu, checked while the selection is in one.
+   * - `block-option-end`: A block type's trailing column, which holds its shortcut.
+   * - `block-option-item`: A block type's row.
+   * - `block-option-mark`: The check beside the block type the selection is in.
+   * - `block-option-shortcut`: A block type's key.
+   * - `block-option-shortcut-kbd`: The key inside it.
+   * - `block-option-shortcut-key`: One key of a block type's chord.
+   * - `block-option-shortcut-separator`: The `+` between two keys of a block type's chord.
+   * - `block-option-start`: A block type's leading column.
+   * - `block-option-surface`: A block type's submenu panel, which a block type does not open.
+   * - `block-spinner`: The ring the block menu button turns while it is pending.
+   * - `block-text`: The box the block menu button's words sit in.
+   * - `bold`: The Bold button. Pressed while the selection is bold.
+   * - `bold-button`: The Bold button's inner button.
+   * - `bold-live`: The Bold button's live region, which speaks while the button is pending.
+   * - `bold-pressed`: The Bold button while the selection is bold, beside `bold`.
+   * - `bold-spinner`: The ring the Bold button turns while it is pending.
+   * - `bold-text`: The box the Bold button's icon sits in.
+   * - `bullet-list`: The Bulleted list button. Pressed while the selection is in a bulleted list.
+   * - `bullet-list-button`: The Bulleted list button's inner button.
+   * - `bullet-list-live`: The Bulleted list button's live region, which speaks while the button is pending.
+   * - `bullet-list-pressed`: The Bulleted list button while the selection is in a bulleted list, beside `bullet-list`.
+   * - `bullet-list-spinner`: The ring the Bulleted list button turns while it is pending.
+   * - `bullet-list-text`: The box the Bulleted list button's icon sits in.
+   * - `code`: The Code button. Pressed while the selection is code.
+   * - `code-button`: The Code button's inner button.
+   * - `code-live`: The Code button's live region, which speaks while the button is pending.
+   * - `code-pressed`: The Code button while the selection is code, beside `code`.
+   * - `code-spinner`: The ring the Code button turns while it is pending.
+   * - `code-text`: The box the Code button's icon sits in.
+   * - `controls`: The toolbar: the tools, then your actions, one tab stop that the arrows move along.
+   * - `controls-toolbar`: The box inside the toolbar that lays its buttons out.
+   * - `divider`: The line between two groups of tools.
+   * - `divider-content`: The content set into a divider, which the editor sets none into.
+   * - `divider-line`: The line itself.
+   * - `find`: The find bar under the toolbar, where the reader searches the document: a Find of its own.
+   * - `find-actions`: The find bar's `actions` slot, which the editor fills with nothing.
+   * - `find-bar`: The find bar's strip: the field, the count, the toolbar, and the replace row while it shows.
+   * - `find-close`: The button that closes the find bar.
+   * - `find-close-button`: The find bar's close button's inner button.
+   * - `find-close-live`: The find bar's close button's live region, which speaks while the button is pending.
+   * - `find-close-spinner`: The ring the find bar's close button turns while it is pending.
+   * - `find-close-text`: The box the find bar's close button's icon sits in.
+   * - `find-controls`: The find bar's toolbar of options and moves.
+   * - `find-controls-toolbar`: The box inside the find bar's toolbar that lays its buttons out.
+   * - `find-count`: Which match is selected, of how many.
+   * - `find-field`: The field the search is typed in.
+   * - `find-live`: The find bar's live region, which says the count as it changes.
+   * - `find-match-case`: The option that finds only the same case. Pressed while it applies.
+   * - `find-match-case-button`: The match case button's inner button.
+   * - `find-match-case-live`: The match case button's live region, which speaks while the button is pending.
+   * - `find-match-case-pressed`: The match case option while it applies, beside `find-match-case`.
+   * - `find-match-case-spinner`: The ring the match case button turns while it is pending.
+   * - `find-match-case-text`: The box the match case button's icon sits in.
+   * - `find-next`: The button that selects the next match.
+   * - `find-next-button`: The next match button's inner button.
+   * - `find-next-live`: The next match button's live region, which speaks while the button is pending.
+   * - `find-next-spinner`: The ring the next match button turns while it is pending.
+   * - `find-next-text`: The box the next match button's icon sits in.
+   * - `find-previous`: The button that selects the previous match.
+   * - `find-previous-button`: The previous match button's inner button.
+   * - `find-previous-live`: The previous match button's live region, which speaks while the button is pending.
+   * - `find-previous-spinner`: The ring the previous match button turns while it is pending.
+   * - `find-previous-text`: The box the previous match button's icon sits in.
+   * - `find-regex`: The option that reads the search as a regular expression. Pressed while it applies.
+   * - `find-regex-button`: The regular expression button's inner button.
+   * - `find-regex-live`: The regular expression button's live region, which speaks while the button is pending.
+   * - `find-regex-pressed`: The regular expression option while it applies, beside `find-regex`.
+   * - `find-regex-spinner`: The ring the regular expression button turns while it is pending.
+   * - `find-regex-text`: The box the regular expression button's icon sits in.
+   * - `find-replace`: The button that replaces the selected match.
+   * - `find-replace-all`: The button that replaces every match.
+   * - `find-replace-all-button`: The Replace all button's inner button.
+   * - `find-replace-all-live`: The Replace all button's live region, which speaks while the button is pending.
+   * - `find-replace-all-spinner`: The ring the Replace all button turns while it is pending.
+   * - `find-replace-all-text`: The box the Replace all button's words sits in.
+   * - `find-replace-button`: The Replace button's inner button.
+   * - `find-replace-field`: The field the replacement is typed in.
+   * - `find-replace-live`: The Replace button's live region, which speaks while the button is pending.
+   * - `find-replace-spinner`: The ring the Replace button turns while it is pending.
+   * - `find-replace-text`: The box the Replace button's words sits in.
+   * - `find-replace-toggle`: The button that shows the replace field under the find field. Expanded while it shows. Not drawn while `readonly`.
+   * - `find-replace-toggle-button`: The find and replace button's inner button.
+   * - `find-replace-toggle-live`: The find and replace button's live region, which speaks while the button is pending.
+   * - `find-replace-toggle-spinner`: The ring the find and replace button turns while it is pending.
+   * - `find-replace-toggle-text`: The box the find and replace button's icon sits in.
+   * - `find-toggle`: The Find button in the toolbar, drawn where `tools` names `find`, which opens and closes the find bar. Expanded while it is open.
+   * - `find-toggle-button`: The Find button's inner button.
+   * - `find-toggle-live`: The Find button's live region, which speaks while the button is pending.
+   * - `find-toggle-spinner`: The ring the Find button turns while it is pending.
+   * - `find-toggle-text`: The box the Find button's icon sits in.
+   * - `find-whole-word`: The option that finds only whole words. Pressed while it applies.
+   * - `find-whole-word-button`: The whole word button's inner button.
+   * - `find-whole-word-live`: The whole word button's live region, which speaks while the button is pending.
+   * - `find-whole-word-pressed`: The whole word option while it applies, beside `find-whole-word`.
+   * - `find-whole-word-spinner`: The ring the whole word button turns while it is pending.
+   * - `find-whole-word-text`: The box the whole word button's icon sits in.
+   * - `footer`: The `footer` slot, under the document.
+   * - `header`: The strip above the document that holds the toolbar, and the address bar under it while it is open.
+   * - `italic`: The Italic button. Pressed while the selection is italic.
+   * - `italic-button`: The Italic button's inner button.
+   * - `italic-live`: The Italic button's live region, which speaks while the button is pending.
+   * - `italic-pressed`: The Italic button while the selection is italic, beside `italic`.
+   * - `italic-spinner`: The ring the Italic button turns while it is pending.
+   * - `italic-text`: The box the Italic button's icon sits in.
+   * - `link`: The Link button, which opens the address bar. Pressed while the selection is in a link, and expanded while the bar is open.
+   * - `link-apply`: The button that applies the address.
+   * - `link-apply-button`: The Apply button's inner button.
+   * - `link-apply-live`: The Apply button's live region, which speaks while the button is pending.
+   * - `link-apply-spinner`: The ring the Apply button turns while it is pending.
+   * - `link-apply-text`: The box the Apply button's icon sits in.
+   * - `link-bar`: The bar under the toolbar where the reader writes a link's address.
+   * - `link-button`: The Link button's inner button.
+   * - `link-close`: The button that closes the address bar.
+   * - `link-close-button`: The close button's inner button.
+   * - `link-close-live`: The close button's live region, which speaks while the button is pending.
+   * - `link-close-spinner`: The ring the close button turns while it is pending.
+   * - `link-close-text`: The box the close button's icon sits in.
+   * - `link-controls`: The toolbar at the end of the address bar: Apply, Remove, and Close.
+   * - `link-controls-toolbar`: The box inside the address bar's toolbar that lays its buttons out.
+   * - `link-field`: The field the address is written in.
+   * - `link-live`: The Link button's live region, which speaks while the button is pending.
+   * - `link-pressed`: The Link button while the selection is in a link, beside `link`.
+   * - `link-remove`: The button that takes the link off. Disabled where the selection is in no link.
+   * - `link-remove-button`: The Remove button's inner button.
+   * - `link-remove-live`: The Remove button's live region, which speaks while the button is pending.
+   * - `link-remove-spinner`: The ring the Remove button turns while it is pending.
+   * - `link-remove-text`: The box the Remove button's icon sits in.
+   * - `link-spinner`: The ring the Link button turns while it is pending.
+   * - `link-text`: The box the Link button's icon sits in.
+   * - `ordered-list`: The Numbered list button. Pressed while the selection is in a numbered list.
+   * - `ordered-list-button`: The Numbered list button's inner button.
+   * - `ordered-list-live`: The Numbered list button's live region, which speaks while the button is pending.
+   * - `ordered-list-pressed`: The Numbered list button while the selection is in a numbered list, beside `ordered-list`.
+   * - `ordered-list-spinner`: The ring the Numbered list button turns while it is pending.
+   * - `ordered-list-text`: The box the Numbered list button's icon sits in.
+   * - `quote`: The Quote button. Pressed while the selection is in a quote.
+   * - `quote-button`: The Quote button's inner button.
+   * - `quote-live`: The Quote button's live region, which speaks while the button is pending.
+   * - `quote-pressed`: The Quote button while the selection is in a quote, beside `quote`.
+   * - `quote-spinner`: The ring the Quote button turns while it is pending.
+   * - `quote-text`: The box the Quote button's icon sits in.
+   * - `redo`: The Redo button. Disabled while there is nothing to redo.
+   * - `redo-button`: The Redo button's inner button.
+   * - `redo-live`: The Redo button's live region, which speaks while the button is pending.
+   * - `redo-spinner`: The ring the Redo button turns while it is pending.
+   * - `redo-text`: The box the Redo button's icon sits in.
+   * - `region`: The frame around the toolbar, the address bar, and the document.
+   * - `strike`: The Strikethrough button. Pressed while the selection is struck through.
+   * - `strike-button`: The Strikethrough button's inner button.
+   * - `strike-live`: The Strikethrough button's live region, which speaks while the button is pending.
+   * - `strike-pressed`: The Strikethrough button while the selection is struck through, beside `strike`.
+   * - `strike-spinner`: The ring the Strikethrough button turns while it is pending.
+   * - `strike-text`: The box the Strikethrough button's icon sits in.
+   * - `tools`: A group of several tools, which a narrow toolbar wraps as one: Undo and Redo, the marks, or the lists and the quote.
+   * - `undo`: The Undo button. Disabled while there is nothing to undo.
+   * - `undo-button`: The Undo button's inner button.
+   * - `undo-live`: The Undo button's live region, which speaks while the button is pending.
+   * - `undo-spinner`: The ring the Undo button turns while it is pending.
+   * - `undo-text`: The box the Undo button's icon sits in.
+   * - `viewport`: The box the document is drawn in.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `connected`: A renderer draws the document.
+   * - `document-focused`: Focus is in the document, where the reader types.
+   * - `find-open`: The find bar is open.
+   * - `link-open`: The address bar is open.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-headless-editor": Partial<
+    HelixHeadlessEditorProps & BaseProps<HelixHeadlessEditor, F> & BaseEvents<HelixHeadlessEditor>
+  >;
+
   /**
    * Shows what would be in a region and the one action that would fill it, so an
    * empty region does not look like one that failed to load.
@@ -84192,8 +84776,8 @@ export type CustomElementsSolidJs = {
    * A pane for working on a file: a header with its name, its language and the
    * page's own actions, the code, the problems in it, and a status line that
    * says where the caret is. On its own the code is a `<textarea>` in the code
-   * face. Connect an engine and it draws the code instead: `connectEditor` from
-   * `@fusion.dev/helix-editor` connects CodeMirror, with highlighting in your
+   * face. Connect an engine and it draws the code instead: `connectCodeEditor` from
+   * `@fusion.dev/helix-code-editor` connects CodeMirror, with highlighting in your
    * theme's syntax colors, line numbers, folding, bracket matching and history.
    * The value, the form, validation and the events stay the editor's, so a page
    * reads and writes it the same either way.
@@ -84312,7 +84896,7 @@ export type CustomElementsSolidJs = {
    * Here rather than on each control.
    * - `diagnostics`: The problems in the text, each underlined and listed under the editor. (property only)
    * - `engine`: What draws the editor, such as `codeMirrorEngine()` from
-   * `@fusion.dev/helix-editor`. Absent, the editor is a plain text field. (property only)
+   * `@fusion.dev/helix-code-editor`. Absent, the editor is a plain text field. (property only)
    * - `validity`: Whether the control meets its constraints, and why not. (property only) (readonly)
    * - `validationMessage`: The message the browser would show for the control, or an empty string. (property only) (readonly)
    * - `willValidate`: Whether the control is checked when its form is submitted. (property only) (readonly)
@@ -89809,6 +90393,347 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixHeadlessDrilldown>
   >;
 
+  /**
+   * Wraps a document drawn by ProseMirror or another rich text editor. The frame
+   * adds a toolbar, an address bar for links, and a box the document is drawn
+   * in. `connectEditor` from `@fusion.dev/helix-editor` connects ProseMirror:
+   * it gives the document Helix's typed blocks, each with a stable id, and draws
+   * them in your theme.
+   *
+   * The document is the element you write inside the frame, so it stays in the
+   * page: the browser's input methods, spellcheck, and right-to-left text work in
+   * it as they do in any field. A server can send the document's HTML there, and
+   * it reads before any script loads. Mark it `data-prose`, so the base layer
+   * draws its headings, lists, and quotes before a renderer connects.
+   *
+   * The toolbar's groups are named by `tools`, in this order: `history` (Undo
+   * and Redo), `block` (a menu of Paragraph, three headings, and Code block),
+   * `marks` (Bold, Italic, Strikethrough, and Code), `link`, `lists` (Bulleted
+   * and Numbered), and `quote`, which are drawn by default, and `find`, the Find
+   * button, which is drawn where `tools` names it. A tool the renderer cannot run
+   * is left out once it is connected, and a tool that cannot apply at the
+   * selection is disabled. A tool returns focus to the document once it has run.
+   * With `readonly`, the document cannot be edited and the toolbar is not drawn.
+   *
+   * Command+F opens a find bar under the toolbar, a Find that searches the
+   * document through the renderer, marks every match, and selects one. It
+   * replaces unless the document is `readonly`, which it searches too.
+   *
+   * **Keyboard.** In the document:
+   *
+   * - Command+B, Command+I, Command+Shift+X, and Command+E make text bold,
+   *   italic, struck through, and code. Use Control in place of Command on
+   *   Windows and Linux.
+   * - Command+Alt+0 makes a paragraph, Command+Alt+1 to 3 a heading, and
+   *   Command+Alt+8 a code block.
+   * - Command+Shift+8, Command+Shift+7, and Command+Shift+9 make a bulleted
+   *   list, a numbered list, and a quote.
+   * - Command+K opens the address bar for a link. Enter applies the address,
+   *   and Escape closes the bar.
+   * - Command+Z undoes, and Command+Shift+Z redoes.
+   * - In a list, Tab nests the item and Shift+Tab lifts it. Escape then Tab
+   *   leaves the document from anywhere, so a list never keeps focus.
+   * - Alt+F10 moves focus to the toolbar. The arrow keys move between its
+   *   tools, and Escape returns to the document.
+   * - Command+F opens the find bar. Enter and Shift+Enter move between the
+   *   matches, and Escape closes the bar and returns to the document.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `block-chosen-label`/`blockChosenLabel`: The block menu button's name. `{name}` is the block type at the selection.
+   * - `block-label`/`blockLabel`: The block menu's name, read by screen readers.
+   * - `bold-label`/`boldLabel`: The Bold button's label.
+   * - `bullet-list-label`/`bulletListLabel`: The Bulleted list button's label.
+   * - `code-block-label`/`codeBlockLabel`: The Code block row's label in the block menu.
+   * - `code-label`/`codeLabel`: The Code button's label.
+   * - `controls-label`/`controlsLabel`: The toolbar's name, read by screen readers.
+   * - `fallback-label`/`fallbackLabel`: The document's name where `label` is empty and the host has no `aria-label`.
+   * - `find-label`/`findLabel`: The Find button's label, and the find bar's name.
+   * - `heading-label`/`headingLabel`: A heading's name in the block menu. `{level}` is its level, 1 to 3.
+   * - `italic-label`/`italicLabel`: The Italic button's label.
+   * - `label`: The document's name, read by screen readers. Name what it holds, such as
+   * "Release notes", so that several editors on one page can be told apart.
+   * Required.
+   * - `link-apply-label`/`linkApplyLabel`: The Apply button's label in the address bar.
+   * - `link-close-label`/`linkCloseLabel`: The close button's label in the address bar.
+   * - `link-controls-label`/`linkControlsLabel`: The name of the address bar's toolbar, read by screen readers.
+   * - `link-field-label`/`linkFieldLabel`: The address field's name, which it also shows while it is empty.
+   * - `link-label`/`linkLabel`: The Link button's label, and the address bar's name.
+   * - `link-remove-label`/`linkRemoveLabel`: The Remove button's label in the address bar.
+   * - `ordered-list-label`/`orderedListLabel`: The Numbered list button's label.
+   * - `paragraph-label`/`paragraphLabel`: The Paragraph row's label in the block menu.
+   * - `placeholder`: The words shown in an empty document, such as "Write the release notes".
+   * - `quote-label`/`quoteLabel`: The Quote button's label.
+   * - `readonly`/`readOnly`: Shows the document and takes no edits, with no toolbar, for a document
+   * someone reads, or one an agent is writing. The attribute is `readonly`,
+   * the platform's spelling.
+   * - `redo-label`/`redoLabel`: The Redo button's label.
+   * - `strike-label`/`strikeLabel`: The Strikethrough button's label.
+   * - `tools`: Which groups of tools the toolbar draws, as a list of `history`, `block`,
+   * `marks`, `link`, `lists`, and `quote`, or `none`. They are drawn in that
+   * order, whatever order the list is in. Absent is all six.
+   * - `undo-label`/`undoLabel`: The Undo button's label.
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-found`: The find bar searched or moved among the matches, with `count` and the selected match's `index`, counting from 0, or -1 for none.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The element your renderer draws the document in.
+   * - `actions`: Controls of your own at the end of the toolbar, such as Share or Comment.
+   * - `bold-icon`: Replaces the glyph inside the Bold button.
+   * - `bullet-list-icon`: Replaces the glyph inside the Bulleted list button.
+   * - `code-icon`: Replaces the glyph inside the Code button.
+   * - `find-icon`: Replaces the glyph inside the Find button.
+   * - `footer`: Content under the document, such as a word count or whether it is saved.
+   * - `italic-icon`: Replaces the glyph inside the Italic button.
+   * - `link-icon`: Replaces the glyph inside the Link button.
+   * - `ordered-list-icon`: Replaces the glyph inside the Numbered list button.
+   * - `quote-icon`: Replaces the glyph inside the Quote button.
+   * - `redo-icon`: Replaces the glyph inside the Redo button.
+   * - `strike-icon`: Replaces the glyph inside the Strikethrough button.
+   * - `undo-icon`: Replaces the glyph inside the Undo button.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `attach(renderer: EditorRenderer) => EditorSink`: Hands the frame what draws the document. The frame sends it the settings
+   * now and as they change, asks it to run the tools the reader presses, and
+   * draws the toolbar from what it reports through the sink it gets back.
+   * Attaching another renderer detaches this one.
+   * - `run(tool: EditorTool, value?: string) => boolean`: Runs a tool at the selection, as its button does, and says whether it
+   * ran: a block type, a mark, a list, a quote, a step through history, or a
+   * link to `value`, where an empty `value` takes the link off. Nothing runs
+   * while no renderer is attached, or while `readonly`.
+   * - `focus(options?: FocusOptions) => void`: Puts focus in the document, with the selection where it was.
+   * - `openLink() => void`: Opens the address bar with the address of the link at the selection, and puts focus in its field.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `actions`: The `actions` slot, last in the toolbar.
+   * - `block`: The button that opens the block menu, which names the block type at the selection.
+   * - `block-button`: The block menu button's inner button.
+   * - `block-live`: The block menu button's live region, which speaks while the button is pending.
+   * - `block-menu`: The menu of block types.
+   * - `block-menu-back`: The control that returns from a submenu.
+   * - `block-menu-back-mark`: The glyph on the back control of a submenu.
+   * - `block-menu-empty`: The text shown when the menu has no items.
+   * - `block-menu-header`: The bar above a submenu, holding the way back and its name.
+   * - `block-menu-live`: The block menu's live region, which repeats the empty and loading text for screen readers.
+   * - `block-menu-loading`: The text shown while the items are loading.
+   * - `block-menu-search-field`: The block menu's filter field, drawn with `filterable`.
+   * - `block-menu-surface`: The floating panel the block menu is drawn on.
+   * - `block-menu-title`: The name of the submenu that is showing.
+   * - `block-name`: The name of the block type at the selection, in the block menu's button.
+   * - `block-option`: One block type in the block menu, checked while the selection is in one.
+   * - `block-option-end`: A block type's trailing column, which holds its shortcut.
+   * - `block-option-item`: A block type's row.
+   * - `block-option-mark`: The check beside the block type the selection is in.
+   * - `block-option-shortcut`: A block type's key.
+   * - `block-option-shortcut-kbd`: The key inside it.
+   * - `block-option-shortcut-key`: One key of a block type's chord.
+   * - `block-option-shortcut-separator`: The `+` between two keys of a block type's chord.
+   * - `block-option-start`: A block type's leading column.
+   * - `block-option-surface`: A block type's submenu panel, which a block type does not open.
+   * - `block-spinner`: The ring the block menu button turns while it is pending.
+   * - `block-text`: The box the block menu button's words sit in.
+   * - `bold`: The Bold button. Pressed while the selection is bold.
+   * - `bold-button`: The Bold button's inner button.
+   * - `bold-live`: The Bold button's live region, which speaks while the button is pending.
+   * - `bold-pressed`: The Bold button while the selection is bold, beside `bold`.
+   * - `bold-spinner`: The ring the Bold button turns while it is pending.
+   * - `bold-text`: The box the Bold button's icon sits in.
+   * - `bullet-list`: The Bulleted list button. Pressed while the selection is in a bulleted list.
+   * - `bullet-list-button`: The Bulleted list button's inner button.
+   * - `bullet-list-live`: The Bulleted list button's live region, which speaks while the button is pending.
+   * - `bullet-list-pressed`: The Bulleted list button while the selection is in a bulleted list, beside `bullet-list`.
+   * - `bullet-list-spinner`: The ring the Bulleted list button turns while it is pending.
+   * - `bullet-list-text`: The box the Bulleted list button's icon sits in.
+   * - `code`: The Code button. Pressed while the selection is code.
+   * - `code-button`: The Code button's inner button.
+   * - `code-live`: The Code button's live region, which speaks while the button is pending.
+   * - `code-pressed`: The Code button while the selection is code, beside `code`.
+   * - `code-spinner`: The ring the Code button turns while it is pending.
+   * - `code-text`: The box the Code button's icon sits in.
+   * - `controls`: The toolbar: the tools, then your actions, one tab stop that the arrows move along.
+   * - `controls-toolbar`: The box inside the toolbar that lays its buttons out.
+   * - `divider`: The line between two groups of tools.
+   * - `divider-content`: The content set into a divider, which the editor sets none into.
+   * - `divider-line`: The line itself.
+   * - `find`: The find bar under the toolbar, where the reader searches the document: a Find of its own.
+   * - `find-actions`: The find bar's `actions` slot, which the editor fills with nothing.
+   * - `find-bar`: The find bar's strip: the field, the count, the toolbar, and the replace row while it shows.
+   * - `find-close`: The button that closes the find bar.
+   * - `find-close-button`: The find bar's close button's inner button.
+   * - `find-close-live`: The find bar's close button's live region, which speaks while the button is pending.
+   * - `find-close-spinner`: The ring the find bar's close button turns while it is pending.
+   * - `find-close-text`: The box the find bar's close button's icon sits in.
+   * - `find-controls`: The find bar's toolbar of options and moves.
+   * - `find-controls-toolbar`: The box inside the find bar's toolbar that lays its buttons out.
+   * - `find-count`: Which match is selected, of how many.
+   * - `find-field`: The field the search is typed in.
+   * - `find-live`: The find bar's live region, which says the count as it changes.
+   * - `find-match-case`: The option that finds only the same case. Pressed while it applies.
+   * - `find-match-case-button`: The match case button's inner button.
+   * - `find-match-case-live`: The match case button's live region, which speaks while the button is pending.
+   * - `find-match-case-pressed`: The match case option while it applies, beside `find-match-case`.
+   * - `find-match-case-spinner`: The ring the match case button turns while it is pending.
+   * - `find-match-case-text`: The box the match case button's icon sits in.
+   * - `find-next`: The button that selects the next match.
+   * - `find-next-button`: The next match button's inner button.
+   * - `find-next-live`: The next match button's live region, which speaks while the button is pending.
+   * - `find-next-spinner`: The ring the next match button turns while it is pending.
+   * - `find-next-text`: The box the next match button's icon sits in.
+   * - `find-previous`: The button that selects the previous match.
+   * - `find-previous-button`: The previous match button's inner button.
+   * - `find-previous-live`: The previous match button's live region, which speaks while the button is pending.
+   * - `find-previous-spinner`: The ring the previous match button turns while it is pending.
+   * - `find-previous-text`: The box the previous match button's icon sits in.
+   * - `find-regex`: The option that reads the search as a regular expression. Pressed while it applies.
+   * - `find-regex-button`: The regular expression button's inner button.
+   * - `find-regex-live`: The regular expression button's live region, which speaks while the button is pending.
+   * - `find-regex-pressed`: The regular expression option while it applies, beside `find-regex`.
+   * - `find-regex-spinner`: The ring the regular expression button turns while it is pending.
+   * - `find-regex-text`: The box the regular expression button's icon sits in.
+   * - `find-replace`: The button that replaces the selected match.
+   * - `find-replace-all`: The button that replaces every match.
+   * - `find-replace-all-button`: The Replace all button's inner button.
+   * - `find-replace-all-live`: The Replace all button's live region, which speaks while the button is pending.
+   * - `find-replace-all-spinner`: The ring the Replace all button turns while it is pending.
+   * - `find-replace-all-text`: The box the Replace all button's words sits in.
+   * - `find-replace-button`: The Replace button's inner button.
+   * - `find-replace-field`: The field the replacement is typed in.
+   * - `find-replace-live`: The Replace button's live region, which speaks while the button is pending.
+   * - `find-replace-spinner`: The ring the Replace button turns while it is pending.
+   * - `find-replace-text`: The box the Replace button's words sits in.
+   * - `find-replace-toggle`: The button that shows the replace field under the find field. Expanded while it shows. Not drawn while `readonly`.
+   * - `find-replace-toggle-button`: The find and replace button's inner button.
+   * - `find-replace-toggle-live`: The find and replace button's live region, which speaks while the button is pending.
+   * - `find-replace-toggle-spinner`: The ring the find and replace button turns while it is pending.
+   * - `find-replace-toggle-text`: The box the find and replace button's icon sits in.
+   * - `find-toggle`: The Find button in the toolbar, drawn where `tools` names `find`, which opens and closes the find bar. Expanded while it is open.
+   * - `find-toggle-button`: The Find button's inner button.
+   * - `find-toggle-live`: The Find button's live region, which speaks while the button is pending.
+   * - `find-toggle-spinner`: The ring the Find button turns while it is pending.
+   * - `find-toggle-text`: The box the Find button's icon sits in.
+   * - `find-whole-word`: The option that finds only whole words. Pressed while it applies.
+   * - `find-whole-word-button`: The whole word button's inner button.
+   * - `find-whole-word-live`: The whole word button's live region, which speaks while the button is pending.
+   * - `find-whole-word-pressed`: The whole word option while it applies, beside `find-whole-word`.
+   * - `find-whole-word-spinner`: The ring the whole word button turns while it is pending.
+   * - `find-whole-word-text`: The box the whole word button's icon sits in.
+   * - `footer`: The `footer` slot, under the document.
+   * - `header`: The strip above the document that holds the toolbar, and the address bar under it while it is open.
+   * - `italic`: The Italic button. Pressed while the selection is italic.
+   * - `italic-button`: The Italic button's inner button.
+   * - `italic-live`: The Italic button's live region, which speaks while the button is pending.
+   * - `italic-pressed`: The Italic button while the selection is italic, beside `italic`.
+   * - `italic-spinner`: The ring the Italic button turns while it is pending.
+   * - `italic-text`: The box the Italic button's icon sits in.
+   * - `link`: The Link button, which opens the address bar. Pressed while the selection is in a link, and expanded while the bar is open.
+   * - `link-apply`: The button that applies the address.
+   * - `link-apply-button`: The Apply button's inner button.
+   * - `link-apply-live`: The Apply button's live region, which speaks while the button is pending.
+   * - `link-apply-spinner`: The ring the Apply button turns while it is pending.
+   * - `link-apply-text`: The box the Apply button's icon sits in.
+   * - `link-bar`: The bar under the toolbar where the reader writes a link's address.
+   * - `link-button`: The Link button's inner button.
+   * - `link-close`: The button that closes the address bar.
+   * - `link-close-button`: The close button's inner button.
+   * - `link-close-live`: The close button's live region, which speaks while the button is pending.
+   * - `link-close-spinner`: The ring the close button turns while it is pending.
+   * - `link-close-text`: The box the close button's icon sits in.
+   * - `link-controls`: The toolbar at the end of the address bar: Apply, Remove, and Close.
+   * - `link-controls-toolbar`: The box inside the address bar's toolbar that lays its buttons out.
+   * - `link-field`: The field the address is written in.
+   * - `link-live`: The Link button's live region, which speaks while the button is pending.
+   * - `link-pressed`: The Link button while the selection is in a link, beside `link`.
+   * - `link-remove`: The button that takes the link off. Disabled where the selection is in no link.
+   * - `link-remove-button`: The Remove button's inner button.
+   * - `link-remove-live`: The Remove button's live region, which speaks while the button is pending.
+   * - `link-remove-spinner`: The ring the Remove button turns while it is pending.
+   * - `link-remove-text`: The box the Remove button's icon sits in.
+   * - `link-spinner`: The ring the Link button turns while it is pending.
+   * - `link-text`: The box the Link button's icon sits in.
+   * - `ordered-list`: The Numbered list button. Pressed while the selection is in a numbered list.
+   * - `ordered-list-button`: The Numbered list button's inner button.
+   * - `ordered-list-live`: The Numbered list button's live region, which speaks while the button is pending.
+   * - `ordered-list-pressed`: The Numbered list button while the selection is in a numbered list, beside `ordered-list`.
+   * - `ordered-list-spinner`: The ring the Numbered list button turns while it is pending.
+   * - `ordered-list-text`: The box the Numbered list button's icon sits in.
+   * - `quote`: The Quote button. Pressed while the selection is in a quote.
+   * - `quote-button`: The Quote button's inner button.
+   * - `quote-live`: The Quote button's live region, which speaks while the button is pending.
+   * - `quote-pressed`: The Quote button while the selection is in a quote, beside `quote`.
+   * - `quote-spinner`: The ring the Quote button turns while it is pending.
+   * - `quote-text`: The box the Quote button's icon sits in.
+   * - `redo`: The Redo button. Disabled while there is nothing to redo.
+   * - `redo-button`: The Redo button's inner button.
+   * - `redo-live`: The Redo button's live region, which speaks while the button is pending.
+   * - `redo-spinner`: The ring the Redo button turns while it is pending.
+   * - `redo-text`: The box the Redo button's icon sits in.
+   * - `region`: The frame around the toolbar, the address bar, and the document.
+   * - `strike`: The Strikethrough button. Pressed while the selection is struck through.
+   * - `strike-button`: The Strikethrough button's inner button.
+   * - `strike-live`: The Strikethrough button's live region, which speaks while the button is pending.
+   * - `strike-pressed`: The Strikethrough button while the selection is struck through, beside `strike`.
+   * - `strike-spinner`: The ring the Strikethrough button turns while it is pending.
+   * - `strike-text`: The box the Strikethrough button's icon sits in.
+   * - `tools`: A group of several tools, which a narrow toolbar wraps as one: Undo and Redo, the marks, or the lists and the quote.
+   * - `undo`: The Undo button. Disabled while there is nothing to undo.
+   * - `undo-button`: The Undo button's inner button.
+   * - `undo-live`: The Undo button's live region, which speaks while the button is pending.
+   * - `undo-spinner`: The ring the Undo button turns while it is pending.
+   * - `undo-text`: The box the Undo button's icon sits in.
+   * - `viewport`: The box the document is drawn in.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `connected`: A renderer draws the document.
+   * - `document-focused`: Focus is in the document, where the reader types.
+   * - `find-open`: The find bar is open.
+   * - `link-open`: The address bar is open.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-headless-editor": Partial<
+    HelixHeadlessEditorProps &
+      HelixHeadlessEditorSolidJsProps &
+      BaseProps<HelixHeadlessEditor, "solid"> &
+      BaseEvents<HelixHeadlessEditor>
+  >;
+
   /**
    * Shows what would be in a region and the one action that would fill it, so an
    * empty region does not look like one that failed to load.