@fusion.dev/helix-headless 0.183.0 → 0.184.0

package/custom-elements.json

@@ -31992,9 +31992,34 @@
       "kind": "javascript-module",
       "path": "src/code-block/root/code-block-root.ts",
       "declarations": [
+        {
+          "kind": "function",
+          "name": "registerHighlighter",
+          "return": {
+            "type": {
+              "text": "void"
+            }
+          },
+          "parameters": [
+            {
+              "name": "highlighter",
+              "type": {
+                "text": "CodeBlockHighlighter | undefined"
+              }
+            },
+            {
+              "name": "sheet",
+              "optional": true,
+              "type": {
+                "text": "CSSResult"
+              }
+            }
+          ],
+          "description": "Gives every Code Block of both tiers a highlighter, for the blocks that set\nno `highlight` of their own, and the sheet that colors what it returns.\n\n**Opt-in, so a page that shows plain code carries no grammar.** Code Block\nships none: a grammar is the larger part of any highlighter, and a block\nthat registers one for every page makes every page pay for it. A page that\nwants color imports one entry that calls this, such as\n`@fusion.dev/helix-sandbox/code-block`, which reads `css`, `html`, `js`,\n`jsx`, `sh`, `ts` and `tsx` with the sandbox's Lezer grammars and colors\nthem from the `--helix-color-syntax-*` tokens.\n\nA block's own `highlight` wins over this. Blocks already on the page draw\nagain with it, and every block built after has it. `undefined` takes it\naway again."
+        },
         {
           "kind": "class",
-          "description": "Renders a `<pre><code>` pair: `pre` keeps the whitespace, and `code` marks it\nas code. Long lines scroll inside the block and do not wrap, because a line\nbreak can be significant in code.\n\nA copy button is on by default. Set `no-copy` to remove it. The button copies\nthe slotted text, so there is no second copy of the code to keep in sync.\n\nFor a fragment of code inside a sentence, use `Code`.\n\nSet `line-numbers` to number the lines in a gutter beside the code, hidden\nfrom the accessibility tree and left out of a copy. Set `mark-lines` to\nmark lines a reader should look at, such as `2, 4-6`: the block draws a\nband behind each run, placed where the lines are laid out, so it follows a\nhighlighter's markup and lines that wrap. `added-lines` and\n`removed-lines` mark lines the same way as inserted and deleted, as\nExpressive Code's `ins` and `del` do, in code that is not a diff. The bands\nare drawn and hidden from screen readers, so say in the text around the\nblock what a marked line means. Set `wrap` to wrap long lines\nrather than scroll them; a gutter then numbers each line where it starts.\nSet `wrappable` for a button in the header that turns `wrap` on and off,\npressed while the lines wrap.\n\nThe header holds the name, the `actions` slot, and the copy button. Slot a\ncontrol into `actions`, such as a button that sets `wrap` or one that opens\nthe code in an editor, and the block draws a header for it even with no\nname. `copy-icon` and `copied-icon` replace the copy button's two icons. Set `highlight` to a\nfunction that turns the code into highlighted markup, such as one wrapping\nShiki or Prism, and the block draws what it returns; it is handed the\nblock's `language`, so one function serves every block. The code stays in\nthe slot, so the copy button and the page's own text are the code as\nwritten.\n\nSet `expandable` on a block whose height is capped, such as by\n`--code-block-max-block-size`, and a button under it shows every line and\nthen fewer again, as a docs site's long example does. The button is drawn\nonly while the cap hides something, says whether the block is expanded with\n`aria-expanded`, names the block it opens with `aria-controls`, and the block\ncarries `:state(expanded)` while it is.\n\nSet `diff` to show a change. Put a unified diff, the output of `git diff` or\n`diff -u`, in the same slot, and the block draws the lines it added and\nremoved. The block never computes a diff itself. Line numbers come from the\nhunk headers and are hidden from the accessibility tree. Changed lines are\n`<ins>` and `<del>` with the `+` and `-` kept as text, so the change does not\ndepend on color. Where a removed line is paired with the added line that\nreplaced it, the words each does not share with the other are the `changed`\npart, so the eye goes to what changed within the line. Each file in the patch is its own block under its own name,\nand its copy button copies the new version of the file. `variant=\"split\"`\nshows the old version beside the new, each removal opposite its replacement.\n`context-lines` folds each long run of unchanged lines, keeping that many\nbeside each change, behind a button that shows them and hides them again,\nas a code host draws a diff written with more context than a reader needs.\n\n**A block that scrolls is a tab stop.** While its lines run past its width or\nits cap, the scroller is a region named for the block, such as \"Code,\napp.ts\", that Tab reaches, so a keyboard scrolls it with the arrow keys in\nevery browser. Chromium and Firefox make a scrolling box focusable on their\nown, and Safari does not. A block that fits is no stop at all.\n\n**The code the block draws is marked untranslated**, `translate=\"no\"` on\nits `<pre>`, so a page translator leaves highlighted lines and a diff as\nwritten. Code in the slot takes its translation mode from the element, which\nwrites nothing onto itself, so set `translate=\"no\"` on the element to keep a\ntranslator off plain code too.\n\nOn the server, the slot renders as ordinary code, so a diff first appears as\nthe patch text in a `<pre>`. The client makes the same first render, which\nkeeps hydration clean, and draws the diff once it can read the content. Diff\nmode is experimental. The rest of the family is stable.\n\n**Several blocks are files**, one shown at a time under a row of tabs, as\nSandbox shows its source panes. Put Code Blocks in the default slot of a\nCode Block, and each is a file named on its tab by its `label` or, without\none, its `language`. `file` holds the name of the file shown. The tabs are a\ntab list: the arrow keys move to a tab and show its file, the two swapping\non a right-to-left page, and Home and End go to the first and the last.\nChoosing one sends `helix-before-change` with the file's name, which you can\ncancel, and `change` once `file` holds it. The files not shown carry\n`hidden`, and the one shown draws no name of its own, its tab naming it. One\nblock draws no tabs. A server cannot see the blocks inside, so the client\ndraws the tabs once it upgrades.",
+          "description": "Renders a `<pre><code>` pair: `pre` keeps the whitespace, and `code` marks it\nas code. Long lines scroll inside the block and do not wrap, because a line\nbreak can be significant in code.\n\nA copy button is on by default. Set `no-copy` to remove it. The button copies\nthe slotted text, so there is no second copy of the code to keep in sync.\n\nFor a fragment of code inside a sentence, use `Code`.\n\nSet `line-numbers` to number the lines in a gutter beside the code, hidden\nfrom the accessibility tree and left out of a copy. Set `mark-lines` to\nmark lines a reader should look at, such as `2, 4-6`: the block draws a\nband behind each run, placed where the lines are laid out, so it follows a\nhighlighter's markup and lines that wrap. `added-lines` and\n`removed-lines` mark lines the same way as inserted and deleted, as\nExpressive Code's `ins` and `del` do, in code that is not a diff. The bands\nare drawn and hidden from screen readers, so say in the text around the\nblock what a marked line means. Set `wrap` to wrap long lines\nrather than scroll them; a gutter then numbers each line where it starts.\nSet `wrappable` for a button in the header that turns `wrap` on and off,\npressed while the lines wrap.\n\nThe header holds the name, the `actions` slot, and the copy button. Slot a\ncontrol into `actions`, such as a button that sets `wrap` or one that opens\nthe code in an editor, and the block draws a header for it even with no\nname. `copy-icon` and `copied-icon` replace the copy button's two icons. Set `highlight` to a\nfunction that turns the code into highlighted markup, such as one wrapping\nShiki or Prism, and the block draws what it returns; it is handed the\nblock's `language`, so one function serves every block. The code stays in\nthe slot, so the copy button and the page's own text are the code as\nwritten.\n\n**Code Block ships no grammar**, so plain code costs you no parser. To color\ncode without a highlighter of your own, import one more entry beside the\nblock's. It colors every block by its `language` (`css`, `html`, `js`,\n`jsx`, `sh`, `ts`, or `tsx`) with the Lezer grammars of the sandbox's\neditor, in the editor's colors:\n\n```js\nimport '@fusion.dev/helix/code-block'\nimport '@fusion.dev/helix-sandbox/code-block'\n```\n\nThat entry calls `registerHighlighter`, which you can also call yourself to\ngive every block one highlighter of your own.\n\nSet `expandable` on a block whose height is capped, such as by\n`--code-block-max-block-size`, and a button under it shows every line and\nthen fewer again, as a docs site's long example does. The button is drawn\nonly while the cap hides something, says whether the block is expanded with\n`aria-expanded`, names the block it opens with `aria-controls`, and the block\ncarries `:state(expanded)` while it is.\n\nSet `diff` to show a change. Put a unified diff, the output of `git diff` or\n`diff -u`, in the same slot, and the block draws the lines it added and\nremoved. The block never computes a diff itself. Line numbers come from the\nhunk headers and are hidden from the accessibility tree. Changed lines are\n`<ins>` and `<del>` with the `+` and `-` kept as text, so the change does not\ndepend on color. Where a removed line is paired with the added line that\nreplaced it, the words each does not share with the other are the `changed`\npart, so the eye goes to what changed within the line. Each file in the patch is its own block under its own name,\nand its copy button copies the new version of the file. `variant=\"split\"`\nshows the old version beside the new, each removal opposite its replacement.\n`context-lines` folds each long run of unchanged lines, keeping that many\nbeside each change, behind a button that shows them and hides them again,\nas a code host draws a diff written with more context than a reader needs.\n\n**A block that scrolls is a tab stop.** While its lines run past its width or\nits cap, the scroller is a region named for the block, such as \"Code,\napp.ts\", that Tab reaches, so a keyboard scrolls it with the arrow keys in\nevery browser. Chromium and Firefox make a scrolling box focusable on their\nown, and Safari does not. A block that fits is no stop at all.\n\n**The code the block draws is marked untranslated**, `translate=\"no\"` on\nits `<pre>`, so a page translator leaves highlighted lines and a diff as\nwritten. Code in the slot takes its translation mode from the element, which\nwrites nothing onto itself, so set `translate=\"no\"` on the element to keep a\ntranslator off plain code too.\n\nOn the server, the slot renders as ordinary code, so a diff first appears as\nthe patch text in a `<pre>`. The client makes the same first render, which\nkeeps hydration clean, and draws the diff once it can read the content. Diff\nmode is experimental. The rest of the family is stable.\n\n**Several blocks are files**, one shown at a time under a row of tabs, as\nSandbox shows its source panes. Put Code Blocks in the default slot of a\nCode Block, and each is a file named on its tab by its `label` or, without\none, its `language`. `file` holds the name of the file shown. The tabs are a\ntab list: the arrow keys move to a tab and show its file, the two swapping\non a right-to-left page, and Home and End go to the first and the last.\nChoosing one sends `helix-before-change` with the file's name, which you can\ncancel, and `change` once `file` holds it. The files not shown carry\n`hidden`, and the one shown draws no name of its own, its tab naming it. One\nblock draws no tabs. A server cannot see the blocks inside, so the client\ndraws the tabs once it upgrades.",
           "name": "HelixHeadlessCodeBlock",
           "cssProperties": [
             {
@@ -32401,7 +32426,7 @@
               "type": {
                 "text": "(code: string, language: string) => string | undefined"
               },
-              "description": "Turns the code into highlighted markup, which the block draws in place of\nthe plain text.\n\nCalled with the code as written and the block's `language`, and returning\nHTML, such as the output of Shiki's `codeToHtml` or Prism's `highlight`.\nOne function serves every block on a page, each block saying its own\nlanguage:\n\n```js\nfor (const block of document.querySelectorAll('helix-code-block')) {\n  block.highlight = (code, lang) => codeToHtml(code, { lang, theme: 'github-light' })\n}\n```\n\n**The markup is drawn as given**, so it has to escape the code it was\nhanded, which those highlighters do. A `<pre>` and `<code>` around the\nwhole of it, which Shiki writes, are taken off, so the lines sit level\nwith the gutter's numbers and the block keeps one tab stop. The code stays\nin the slot, so the copy button copies it as written and a reader without\nthe script still has it. Not called on a server, which has no code to\nread, nor for a diff."
+              "description": "Turns the code into highlighted markup, which the block draws in place of\nthe plain text.\n\nCalled with the code as written and the block's `language`, and returning\nHTML, such as the output of Shiki's `codeToHtml` or Prism's `highlight`.\nOne function serves every block on a page, each block saying its own\nlanguage:\n\n```js\nfor (const block of document.querySelectorAll('helix-code-block')) {\n  block.highlight = (code, lang) => codeToHtml(code, { lang, theme: 'github-light' })\n}\n```\n\n**The markup is drawn as given**, so it has to escape the code it was\nhanded, which those highlighters do. A `<pre>` and `<code>` around the\nwhole of it, which Shiki writes, are taken off, so the lines sit level\nwith the gutter's numbers and the block keeps one tab stop. The code stays\nin the slot, so the copy button copies it as written and a reader without\nthe script still has it. Not called on a server, which has no code to\nread, nor for a diff.\n\nAbsent, the block draws with the highlighter `registerHighlighter` gave\nevery block, where an entry such as `@fusion.dev/helix-sandbox/code-block`\nregistered one, and plain otherwise."
             },
             {
               "kind": "field",
@@ -33792,6 +33817,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "registerHighlighter",
+          "declaration": {
+            "name": "registerHighlighter",
+            "module": "src/code-block/root/code-block-root.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "HelixHeadlessCodeBlock",
@@ -85795,6 +85828,14 @@
             "module": "src/megamenu/index.js"
           }
         },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "src/menu/filter/index.js"
+          }
+        },
         {
           "kind": "js",
           "name": "*",
@@ -111680,6 +111721,392 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/menu/filter/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "filterMenu",
+          "declaration": {
+            "name": "filterMenu",
+            "module": "./menu-filter.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "MenuFilterController",
+          "declaration": {
+            "name": "MenuFilterController",
+            "module": "./menu-filter.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/menu/filter/menu-filter.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "drawFilter",
+          "return": {
+            "type": {
+              "text": "TemplateResult"
+            }
+          },
+          "parameters": [
+            {
+              "name": "host",
+              "type": {
+                "text": "HelixHeadlessMenu"
+              }
+            },
+            {
+              "name": "rows",
+              "type": {
+                "text": "TemplateResult"
+              }
+            },
+            {
+              "name": "busy",
+              "type": {
+                "text": "string | typeof nothing"
+              }
+            },
+            {
+              "name": "onInput",
+              "type": {
+                "text": "(event: Event) => void"
+              }
+            }
+          ],
+          "description": "The field and then the `menu`: a menu holds menu items and nothing else, so\nthe field stands beside it, as React Aria's `Autocomplete` puts its search\nfield beside its menu. The menu calls it through its filter, so the parts it\nwrites are the menu's."
+        },
+        {
+          "kind": "class",
+          "description": "Narrows a `filterable` menu's rows as the reader types in a field above\nthem, with focus staying in the field and the highlight moving through the\nrows that are left.\n\n**Its own entry**, `@fusion.dev/helix-headless/menu/filter`, so a menu that\nnever filters carries none of this. Importing the entry gives every menu of\nthe tier one, and `filterable` turns it on. Menu's description says what a\nreader gets; this is the part of it the menu does not hold:\n\n- the field and the `menu` after it, which the menu draws in its surface\n- which rows the filter keeps, and the words each matched, marked\n- the keys the field answers: Up and Down move the highlight, Enter presses\n  the highlighted row, and Escape clears the filter before it closes\n- `helix-filter`, sent as the text changes, which a listener cancels to\n  keep every row showing\n- how many rows are kept, or `no-results-text`, said in the live region\n\nThe styled tier's entry hands in the sheet that draws the field, which the\nmenu adopts while it filters.",
+          "name": "MenuFilterController",
+          "members": [
+            {
+              "kind": "field",
+              "name": "host",
+              "type": {
+                "text": "HelixHeadlessMenu"
+              },
+              "privacy": "private",
+              "readonly": true,
+              "default": "host"
+            },
+            {
+              "kind": "field",
+              "name": "inside",
+              "type": {
+                "text": "Inside"
+              },
+              "privacy": "private",
+              "readonly": true,
+              "description": "The same menu, read through what it keeps to itself."
+            },
+            {
+              "kind": "field",
+              "name": "sheet",
+              "type": {
+                "text": "CSSResult | undefined"
+              },
+              "description": "The sheet the menu adopts while it filters, from the styled tier.",
+              "default": "sheet"
+            },
+            {
+              "kind": "field",
+              "name": "highlighted",
+              "type": {
+                "text": "Row | undefined"
+              },
+              "description": "The row the keys reached while focus stays in the field."
+            },
+            {
+              "kind": "field",
+              "name": "page",
+              "type": {
+                "text": "Row | null"
+              },
+              "privacy": "private",
+              "default": "null",
+              "description": "The submenu the filter narrows, or null for the top page."
+            },
+            {
+              "kind": "field",
+              "name": "refused",
+              "type": {
+                "text": "string | undefined"
+              },
+              "privacy": "private",
+              "description": "The filter a listener refused, which narrows nothing."
+            },
+            {
+              "kind": "field",
+              "name": "seen",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private",
+              "default": "''",
+              "description": "The filter the last update saw, so a change moves a highlight it hid."
+            },
+            {
+              "kind": "method",
+              "name": "hostConnected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "hostDisconnected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "field",
+              "type": {
+                "text": "HTMLInputElement | null"
+              },
+              "description": "The field, while it is drawn.",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "filtering",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the filter is narrowing the rows.",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "kept",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "row",
+                  "type": {
+                    "text": "Row"
+                  }
+                }
+              ],
+              "description": "Whether the filter keeps a row: one of another page, or one whose words it matches."
+            },
+            {
+              "kind": "field",
+              "name": "keptRows",
+              "type": {
+                "text": "Row[]"
+              },
+              "privacy": "private",
+              "description": "The rows of the page the filter narrows that it keeps.",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "request",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Asks to filter by new text, which the field and `filter` then hold. A\nrefusal keeps every row showing, for a page that narrows them itself."
+            },
+            {
+              "kind": "method",
+              "name": "by",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "value",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Filters by what the reader typed, and highlights the first row kept."
+            },
+            {
+              "kind": "method",
+              "name": "highlight",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "row",
+                  "type": {
+                    "text": "Row | undefined"
+                  }
+                }
+              ],
+              "description": "Puts the highlight on a row, which the field names with\n`aria-activedescendant`. An element reference, because the field is in\nthe menu's shadow root and the row in the tree around it, the one\ndirection a reference crosses."
+            },
+            {
+              "kind": "method",
+              "name": "keydown",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                },
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "Row[]"
+                  }
+                },
+                {
+                  "name": "at",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ],
+              "description": "Answers a key the field takes, and returns whether it did: Up and Down\nmove the highlight through the rows kept, Enter presses the highlighted\nrow, and Escape over text empties the filter, the next one going back or\nclosing."
+            },
+            {
+              "kind": "field",
+              "name": "handleMouseDown",
+              "privacy": "private",
+              "readonly": true,
+              "description": "Keeps focus in the field through a press on a row or the way back, as\nReact Aria's virtual focus does: the press still chooses."
+            },
+            {
+              "kind": "field",
+              "name": "handleInput",
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "status",
+              "return": {
+                "type": {
+                  "text": "TemplateResult | undefined"
+                }
+              },
+              "description": "What a filter that keeps no rows shows, or nothing where it keeps some.\n\nIt sets what the live region says as well: `no-results-text` where the\nfilter keeps no rows, and how many it keeps where it keeps some, as React\nAria and Web Awesome say the count. Only \"No matches\" was said before\nthat, so a filter that kept forty rows and one that kept one sounded the\nsame."
+            },
+            {
+              "kind": "method",
+              "name": "drawFilter",
+              "return": {
+                "type": {
+                  "text": "TemplateResult"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "rows",
+                  "type": {
+                    "text": "TemplateResult"
+                  }
+                },
+                {
+                  "name": "busy",
+                  "type": {
+                    "text": "string | typeof nothing"
+                  }
+                }
+              ],
+              "description": "The field and then the `menu`, for the menu to draw in its surface. See `drawFilter`."
+            }
+          ],
+          "helix": {}
+        },
+        {
+          "kind": "function",
+          "name": "filterMenu",
+          "return": {
+            "type": {
+              "text": "void"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "typeof HelixHeadlessMenu"
+              }
+            },
+            {
+              "name": "sheet",
+              "optional": true,
+              "type": {
+                "text": "CSSResult"
+              }
+            }
+          ],
+          "description": "Gives every menu of a class a `MenuFilterController`, which `filterable`\nturns on.\n\nThe entries call it for their own tier's class: the headless entry for\n`HelixHeadlessMenu`, and the styled one for `HelixMenu`, with the sheet that\ndraws the field. **Menus already on the page are given one too**, and drawn\nagain, so a page that imports the menu and then this entry gets the field."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "drawFilter",
+          "declaration": {
+            "name": "drawFilter",
+            "module": "src/menu/filter/menu-filter.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "MenuFilterController",
+          "declaration": {
+            "name": "MenuFilterController",
+            "module": "src/menu/filter/menu-filter.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "filterMenu",
+          "declaration": {
+            "name": "filterMenu",
+            "module": "src/menu/filter/menu-filter.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/menu/index.ts",
@@ -112736,7 +113163,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "The trigger is slotted and stays your own element, as with the tooltip. The\nmenu renders its surface in the top layer with the popover API, so an\nancestor with `overflow: hidden` does not clip it and it needs no `z-index`.\n\nSlot a `helix-button` or `helix-icon-button` as the trigger, and the menu\ntells it that it opens a menu and whether the menu is open, inside its own\nshadow root. On a plain element, such as a `<button>`, the menu writes\n`aria-haspopup=\"menu\"` and `aria-expanded`, from a frame after its own first\nrender, so a server's markup is never changed while a framework hydrates it.\nIt never writes `aria-expanded` where you wrote it yourself.\n\nSubmenus drill down by default. A submenu replaces the panel's content, and a\nback row returns to the previous page. One panel stays inside a narrow\nwindow, and works on touch screens, which have no hover. Focus follows a\nmouse resting on a row in either mode, and a drilled page is a `menu` named\nby the row that opened it.\n\n**`submenus=\"flyout\"` opens each submenu in a panel of its own beside its\nrow**, as React Aria's `SubmenuTrigger` and Radix's `Sub` do. Resting the\npointer on the row opens it, and a pointer crossing toward the open panel\nover the rows between keeps it open, as Radix's grace area does. Right Arrow\nopens a row's submenu on its first row, and Left Arrow or Escape closes it\nand returns focus to the row, the two arrows swapping on a right-to-left\npage. The row says `aria-expanded`, and the panel is a `menu` named by the\nrow.\n\nThe root holds which page is open, because only one page shows at a time. It\nsets this on items as a property, never as an attribute. An attribute written\nonto your element after it upgrades causes a hydration mismatch.\n\nGroup rows under a heading with `Menu.Section`, which is a `group` named by\nits heading. Between runs of rows, a `<helix-divider>` is a separator a\nscreen reader announces.\n\nKeys: Enter, Space or Down Arrow on the trigger opens the menu on its first\nrow, and Up Arrow on its last. In the menu, Up and Down Arrow move between\nrows, Home and End go to the first and the last, a typed letter moves to\nthe next row whose name starts with it, Enter and Space choose (Space on a\nchoice row changes it and leaves the menu open), Right Arrow\nopens a row's submenu and Left Arrow goes back, the two swapping on a\nright-to-left page. Left Arrow on the top page does nothing. Escape closes\nthe menu and returns focus to the trigger. Tab closes it and moves on.\n\nWhile it is open, the surface carries the trigger's width as\n`--floating-anchor-inline-size` and the room left below it as\n`--floating-available-block-size`, as Radix's dropdown menu publishes its\ntrigger's width, for a menu as wide as its trigger:\n`helix-menu::part(surface) { min-inline-size: var(--floating-anchor-inline-size) }`.\n\n**The choices in one place.** `checkedValues` holds the values of the rows\nthat are checked, anywhere in the menu, and setting it checks exactly\nthose rows, as React Aria's `selectedKeys` does. `change` is sent on the\nmenu when a reader's choice changes it.\n\nWith `context`, the trigger is an area and the menu is its context menu: a\nright-click, a long press, Shift+F10 or the menu key over the area opens it\nat the pointer, or at the area's corner from the keyboard, as Radix's context\nmenu does. A press on the area does not open it, and closing it returns focus\nto where it was. A touch or a pen held still on the area opens it too, on\nevery browser, since iOS sends no `contextmenu` for one.\n\n**A trigger with its own action.** With `open-on=\"long-press\"`, a press on\nthe trigger is the trigger's own, and a press held for half a second opens\nthe menu, as React Aria's `trigger=\"longPress\"` does. Alt+Down or Alt+Up\nopens it from the keyboard, and the trigger is described by\n`long-press-label`, which says so.\n\n**A filter field.** With `filterable`, the menu opens with focus in a field\nabove its rows, and typing narrows the rows of the page the keys move in,\nas React Aria's `Autocomplete` around a `Menu` does. A row is kept where its\nwords hold the filter, in any case, or where `filterMatch` says so. Each\npage starts unfiltered, and the filter is cleared as the menu closes. Where\ntyping keeps no row, the menu shows `no-results-text`. Focus stays in the\nfield: Up and Down Arrow move the highlight through the rows that are left,\nEnter chooses the highlighted row, Right Arrow opens its submenu, Left Arrow\non a submenu goes back, and Escape clears the filter and then closes the\nmenu. A screen reader hears how many rows the filter keeps\n(`results-label`). Home, End and the other keys move the caret and type. The field names\nthe highlighted row with `aria-activedescendant`, and the rows are a `menu`\nafter the field. Cancel `helix-filter` to keep every row\nshowing and narrow the rows yourself, such as by replacing them with rows\nfrom a server.",
+          "description": "The trigger is slotted and stays your own element, as with the tooltip. The\nmenu renders its surface in the top layer with the popover API, so an\nancestor with `overflow: hidden` does not clip it and it needs no `z-index`.\n\nSlot a `helix-button` or `helix-icon-button` as the trigger, and the menu\ntells it that it opens a menu and whether the menu is open, inside its own\nshadow root. On a plain element, such as a `<button>`, the menu writes\n`aria-haspopup=\"menu\"` and `aria-expanded`, from a frame after its own first\nrender, so a server's markup is never changed while a framework hydrates it.\nIt never writes `aria-expanded` where you wrote it yourself.\n\nSubmenus drill down by default. A submenu replaces the panel's content, and a\nback row returns to the previous page. One panel stays inside a narrow\nwindow, and works on touch screens, which have no hover. Focus follows a\nmouse resting on a row in either mode, and a drilled page is a `menu` named\nby the row that opened it.\n\n**`submenus=\"flyout\"` opens each submenu in a panel of its own beside its\nrow**, as React Aria's `SubmenuTrigger` and Radix's `Sub` do. Resting the\npointer on the row opens it, and a pointer crossing toward the open panel\nover the rows between keeps it open, as Radix's grace area does. Right Arrow\nopens a row's submenu on its first row, and Left Arrow or Escape closes it\nand returns focus to the row, the two arrows swapping on a right-to-left\npage. The row says `aria-expanded`, and the panel is a `menu` named by the\nrow.\n\nThe root holds which page is open, because only one page shows at a time. It\nsets this on items as a property, never as an attribute. An attribute written\nonto your element after it upgrades causes a hydration mismatch.\n\nGroup rows under a heading with `Menu.Section`, which is a `group` named by\nits heading. Between runs of rows, a `<helix-divider>` is a separator a\nscreen reader announces.\n\nKeys: Enter, Space or Down Arrow on the trigger opens the menu on its first\nrow, and Up Arrow on its last. In the menu, Up and Down Arrow move between\nrows, Home and End go to the first and the last, a typed letter moves to\nthe next row whose name starts with it, Enter and Space choose (Space on a\nchoice row changes it and leaves the menu open), Right Arrow\nopens a row's submenu and Left Arrow goes back, the two swapping on a\nright-to-left page. Left Arrow on the top page does nothing. Escape closes\nthe menu and returns focus to the trigger. Tab closes it and moves on.\n\nWhile it is open, the surface carries the trigger's width as\n`--floating-anchor-inline-size` and the room left below it as\n`--floating-available-block-size`, as Radix's dropdown menu publishes its\ntrigger's width, for a menu as wide as its trigger:\n`helix-menu::part(surface) { min-inline-size: var(--floating-anchor-inline-size) }`.\n\n**The choices in one place.** `checkedValues` holds the values of the rows\nthat are checked, anywhere in the menu, and setting it checks exactly\nthose rows, as React Aria's `selectedKeys` does. `change` is sent on the\nmenu when a reader's choice changes it.\n\nWith `context`, the trigger is an area and the menu is its context menu: a\nright-click, a long press, Shift+F10 or the menu key over the area opens it\nat the pointer, or at the area's corner from the keyboard, as Radix's context\nmenu does. A press on the area does not open it, and closing it returns focus\nto where it was. A touch or a pen held still on the area opens it too, on\nevery browser, since iOS sends no `contextmenu` for one.\n\n**A trigger with its own action.** With `open-on=\"long-press\"`, a press on\nthe trigger is the trigger's own, and a press held for half a second opens\nthe menu, as React Aria's `trigger=\"longPress\"` does. Alt+Down or Alt+Up\nopens it from the keyboard, and the trigger is described by\n`long-press-label`, which says so.\n\n**A filter field** is a separate import, `@fusion.dev/helix/menu/filter`, so\na menu that never filters carries none of its code:\n\n```js\nimport '@fusion.dev/helix/menu'\nimport '@fusion.dev/helix/menu/filter'\n```\n\nWith it imported and `filterable` set, the menu opens with focus in a field\nabove its rows, and typing narrows the rows of the page the keys move in,\nas React Aria's `Autocomplete` around a `Menu` does. A row is kept where its\nwords hold the filter, in any case, or where `filterMatch` says so. Each\npage starts unfiltered, and the filter is cleared as the menu closes. Where\ntyping keeps no row, the menu shows `no-results-text`. Focus stays in the\nfield: Up and Down Arrow move the highlight through the rows that are left,\nEnter chooses the highlighted row, Right Arrow opens its submenu, Left Arrow\non a submenu goes back, and Escape clears the filter and then closes the\nmenu. A screen reader hears how many rows the filter keeps\n(`results-label`). Home, End and the other keys move the caret and type. The field names\nthe highlighted row with `aria-activedescendant`, and the rows are a `menu`\nafter the field. Cancel `helix-filter` to keep every row\nshowing and narrow the rows yourself, such as by replacing them with rows\nfrom a server.",
           "name": "HelixHeadlessMenu",
           "cssProperties": [
             {
@@ -112903,7 +113330,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Whether the menu shows a field above its rows that narrows them as the\nreader types, with focus staying in the field.",
+              "description": "Whether the menu shows a field above its rows that narrows them as the\nreader types, with focus staying in the field, once\n`@fusion.dev/helix/menu/filter` (or `@fusion.dev/helix-headless/menu/filter`)\nis imported. Without that import it does nothing, so a menu that never\nfilters carries none of the filter's code, and a development build says\nwhich import is missing.",
               "attribute": "filterable"
             },
             {
@@ -113258,41 +113685,21 @@
             },
             {
               "kind": "field",
-              "name": "field",
+              "name": "filterer",
               "type": {
-                "text": "HTMLInputElement | null"
+                "text": "MenuFilterController | undefined"
               },
               "privacy": "private",
-              "description": "The filter field, with `filterable`.",
-              "readonly": true
+              "description": "The filter `menu/filter` gives this menu, which `filterable` turns on.\n\nDeclared and never initialized, because the entry sets it from the\nconstructor Lit runs initializers in, which is before this class's own\nfields: an initializer here would set it back to `undefined`."
             },
             {
               "kind": "field",
-              "name": "filterPage",
+              "name": "filters",
               "type": {
-                "text": "HelixHeadlessMenuItem | null"
+                "text": "MenuFilterController | undefined"
               },
               "privacy": "private",
-              "default": "null",
-              "description": "The submenu the filter narrows, or null for the top page."
-            },
-            {
-              "kind": "field",
-              "name": "refused",
-              "type": {
-                "text": "string | undefined"
-              },
-              "privacy": "private",
-              "description": "The filter a listener refused, which narrows nothing."
-            },
-            {
-              "kind": "field",
-              "name": "filtering",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "private",
-              "description": "Whether the filter is narrowing the rows.",
+              "description": "The filter, while `filterable` is set and `menu/filter` is imported.",
               "readonly": true
             },
             {
@@ -113312,7 +113719,7 @@
                   }
                 }
               ],
-              "description": "Whether the filter keeps a row: one of another page, or one whose words it matches."
+              "description": "Whether the filter keeps a row, which every row is without one."
             },
             {
               "kind": "method",
@@ -113331,41 +113738,7 @@
                   }
                 }
               ],
-              "description": "Asks to filter by new text, which the field and `filter` then hold. A\nrefusal keeps every row showing, for a page that narrows them itself."
-            },
-            {
-              "kind": "field",
-              "name": "handleFilterInput",
-              "privacy": "private",
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "filterBy",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "value",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ],
-              "description": "Filters by what the reader typed, and highlights the first row kept."
-            },
-            {
-              "kind": "field",
-              "name": "highlighted",
-              "type": {
-                "text": "HelixHeadlessMenuItem | undefined"
-              },
-              "privacy": "private",
-              "description": "The row the keys reached while focus stays in the filter field."
+              "description": "Asks to filter by new text. See `MenuFilterController.request`."
             },
             {
               "kind": "method",
@@ -113384,7 +113757,7 @@
                   }
                 }
               ],
-              "description": "Moves the reader to a row: focus, or with `filterable` the highlight,\nwhich the field names with `aria-activedescendant`. An element reference,\nbecause the field is in this shadow root and the row in the tree around\nit, the one direction a reference crosses."
+              "description": "Moves the reader to a row: focus, or with a filter the highlight, focus\nstaying in the filter field."
             },
             {
               "kind": "field",
@@ -113630,13 +114003,6 @@
               "readonly": true,
               "description": "A press on the trigger starting: the start of a held one under\n`open-on=\"long-press\"`, or a touch or a pen held on a context menu's area."
             },
-            {
-              "kind": "field",
-              "name": "handleMouseDown",
-              "privacy": "private",
-              "readonly": true,
-              "description": "Keeps focus in the filter field through a press on a row or the way\nback, as React Aria's virtual focus does: the press still chooses."
-            },
             {
               "kind": "field",
               "name": "handlePointerMove",
@@ -114573,7 +114939,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Whether the menu shows a field above its rows that narrows them as the\nreader types, with focus staying in the field.",
+              "description": "Whether the menu shows a field above its rows that narrows them as the\nreader types, with focus staying in the field, once\n`@fusion.dev/helix/menu/filter` (or `@fusion.dev/helix-headless/menu/filter`)\nis imported. Without that import it does nothing, so a menu that never\nfilters carries none of the filter's code, and a development build says\nwhich import is missing.",
               "fieldName": "filterable"
             },
             {
@@ -172618,6 +172984,19 @@
               "attribute": "mode",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "nowLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Now'",
+              "description": "The words on the list's button that chooses the current time, drawn with\n`show-now`.",
+              "attribute": "now-label",
+              "helix": {
+                "words": true
+              }
+            },
             {
               "kind": "field",
               "name": "placeholder",
@@ -172693,6 +173072,16 @@
               "description": "Whether times carry their seconds: the value is `HH:mm:ss`, a typed time\nmay give them, the field writes them, and the list's `step` counts seconds.\nSee Time Picker's `seconds`.",
               "attribute": "seconds"
             },
+            {
+              "kind": "field",
+              "name": "showNow",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a button under the times in the list that chooses the current time,\nmoved to the nearest time on offer. See Time Picker's `show-now`. Its words\nare `now-label`.",
+              "attribute": "show-now"
+            },
             {
               "kind": "field",
               "name": "step",
@@ -175910,6 +176299,15 @@
               "description": "How many times the field holds at once.\n\nAbsent is one. `range` holds a start and an end, `multiple` holds any\nnumber, and both are carried as one comma-separated value, which is what a\nform submits. `TimePicker` carries the longer note on the interaction and\non why a wheel cannot do either.",
               "fieldName": "mode"
             },
+            {
+              "name": "now-label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Now'",
+              "description": "The words on the list's button that chooses the current time, drawn with\n`show-now`.",
+              "fieldName": "nowLabel"
+            },
             {
               "name": "placeholder",
               "type": {
@@ -175964,6 +176362,15 @@
               "description": "Whether times carry their seconds: the value is `HH:mm:ss`, a typed time\nmay give them, the field writes them, and the list's `step` counts seconds.\nSee Time Picker's `seconds`.",
               "fieldName": "seconds"
             },
+            {
+              "name": "show-now",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws a button under the times in the list that chooses the current time,\nmoved to the nearest time on offer. See Time Picker's `show-now`. Its words\nare `now-label`.",
+              "fieldName": "showNow"
+            },
             {
               "name": "step",
               "type": {
@@ -202148,6 +202555,6 @@
   ],
   "helix": {
     "package": "@fusion.dev/helix-headless",
-    "version": "0.183.0"
+    "version": "0.184.0"
   }
 }