@fusion.dev/helix-sandbox 0.225.0 → 0.226.0

package/custom-elements.json

@@ -1 +1 @@
-{"schemaVersion":"1.0.0","readme":"","modules":[{"kind":"javascript-module","path":"src/code-block/code-block-highlight.ts","declarations":[{"kind":"function","name":"codeBlockHighlighter","return":{"type":{"text":"string | undefined"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"language","type":{"text":"string"}}],"description":"Highlights a block's code by its `language`, in any case and by any name\n`languageOf` reads, such as `ts`, `TypeScript` or `bash`, or returns\n`undefined` for a language no grammar here reads, which the block then\ndraws plain.\n\n**In the editor's own style**, so a snippet in a block and the same snippet\nopen in the sandbox are colored by one source: the classes are the ones\n`syntaxHighlighter` gives each token, and `codeBlockSheet` holds the rules\nfor them, in the `--helix-color-syntax-*` tokens."},{"kind":"variable","name":"codeBlockSheet","type":{"text":"CSSResult"},"description":"The rules that color `codeBlockHighlighter`'s classes, for a block to adopt."}],"exports":[{"kind":"js","name":"codeBlockHighlighter","declaration":{"name":"codeBlockHighlighter","module":"src/code-block/code-block-highlight.ts"}},{"kind":"js","name":"codeBlockSheet","declaration":{"name":"codeBlockSheet","module":"src/code-block/code-block-highlight.ts"}}]},{"kind":"javascript-module","path":"src/code-block/index.ts","declarations":[],"exports":[{"kind":"js","name":"codeBlockHighlighter","declaration":{"name":"codeBlockHighlighter","module":"./code-block-highlight.js"}},{"kind":"js","name":"codeBlockSheet","declaration":{"name":"codeBlockSheet","module":"./code-block-highlight.js"}}]},{"kind":"javascript-module","path":"src/editor/index.ts","declarations":[],"exports":[{"kind":"js","name":"*","declaration":{"name":"*","module":"src/sandbox/editor/sandbox-editor.js"}}]},{"kind":"javascript-module","path":"src/highlight/highlight.ts","declarations":[{"kind":"function","name":"highlight","return":{"type":{"text":"string"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"language","type":{"text":"HighlightLanguage"}},{"name":"highlighter","default":"classHighlighter","type":{"text":"Highlighter"}}],"description":"Highlights a snippet, returning HTML with one span per token.\n\n**A parser, and no editor.** Lezer's grammars are parsers, and parsing is a\npure function of the text: `highlightCode` walks a tree and hands back\ntokens. Nothing is mounted, no document is created, and this runs on a server\nwith no DOM at all, which is what lets a static page ship highlighted code\nwith no client JavaScript spent on it.\n\n**`CodeBlock` holds no parser.** A `dependencies` entry is paid by every\nconsumer whether or not they import it, so the grammars are in this package,\nbeside the editor that reads them too. `CodeBlock` renders a `<slot>`, so the\noutput of this drops straight into one. A snippet on a reference page and the\nsame snippet open in the sandbox are then colored by one source.\n\n`classHighlighter` emits Lezer's own `tok-` class names. Mapping those to\ncolors is yours, because the classes are stable and a palette is not: the\nFusion site paints them from `--helix-color-syntax-*`. Pass another\n`highlighter` for other classes, such as `syntaxHighlighter`, the editor's\nown, whose rules are `syntaxRules`."}],"exports":[{"kind":"js","name":"highlight","declaration":{"name":"highlight","module":"src/highlight/highlight.ts"}}]},{"kind":"javascript-module","path":"src/highlight/index.ts","declarations":[],"exports":[{"kind":"js","name":"highlight","declaration":{"name":"highlight","module":"./highlight.js"}},{"kind":"js","name":"HighlightLanguage","declaration":{"name":"HighlightLanguage","module":"./language.js"}},{"kind":"js","name":"languageOf","declaration":{"name":"languageOf","module":"./language.js"}},{"kind":"js","name":"syntaxHighlighter","declaration":{"name":"syntaxHighlighter","module":"./syntax.js"}},{"kind":"js","name":"syntaxRules","declaration":{"name":"syntaxRules","module":"./syntax.js"}}]},{"kind":"javascript-module","path":"src/highlight/language.ts","declarations":[{"kind":"function","name":"languageOf","return":{"type":{"text":"HighlightLanguage | undefined"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"The language a name stands for, in any case: `TypeScript`, `bash` or `mjs`.\n`undefined` for a name no grammar here reads."}],"exports":[{"kind":"js","name":"languageOf","declaration":{"name":"languageOf","module":"src/highlight/language.ts"}}]},{"kind":"javascript-module","path":"src/highlight/shell.ts","declarations":[{"kind":"variable","name":"shellMode","type":{"text":"StreamParser<ShellState>"},"default":"{ ...(shell as StreamParser<ShellState>), startState(indent) { const state = (shell as StreamParser<ShellState>).startState?.(indent) ?? ({} as ShellState) state.helixHead = true return state }, token(stream, state) { if (stream.sol()) { state.helixHead = true } const head = state.helixHead const from = stream.pos const token = (shell as StreamParser<ShellState>).token(stream, state) const text = stream.string.slice(from, stream.pos) /* Whitespace decides nothing: it neither is a command nor ends the position a command could be in, so it passes through without touching the flag. */ if (text.trim() === '') { return token } if (OPENS.test(text.trim())) { state.helixHead = true return token } state.helixHead = false return token === null && head && /^[A-Za-z_][\\w.@/-]*$/.test(text) ? 'command' : token }, }","description":"The sh mode, with the command named."},{"kind":"variable","name":"shellTokens","type":{"text":"Record<string, Tag>"},"default":"{ command: tags.keyword }","description":"What `shellMode`'s own token name is drawn as, for its `tokenTable`."}],"exports":[{"kind":"js","name":"shellMode","declaration":{"name":"shellMode","module":"src/highlight/shell.ts"}},{"kind":"js","name":"shellTokens","declaration":{"name":"shellTokens","module":"src/highlight/shell.ts"}}]},{"kind":"javascript-module","path":"src/highlight/stream.ts","declarations":[{"kind":"function","name":"highlightStream","return":{"type":{"text":"void"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"mode","type":{"text":"StreamParser<State>"}},{"name":"table","type":{"text":"Record<string, Tag | readonly Tag[]>"}},{"name":"highlighter","type":{"text":"Highlighter"}},{"name":"put","type":{"text":"(text: string, classes: string) => void"}},{"name":"putBreak","type":{"text":"() => void"}}],"description":"Highlights `code` with a mode, in the shape `highlightCode` from\n`@lezer/highlight` uses: `put` for each run of text with its classes, and\n`putBreak` between lines. Neighboring tokens with the same classes are one\nrun, as they are there."}],"exports":[{"kind":"js","name":"highlightStream","declaration":{"name":"highlightStream","module":"src/highlight/stream.ts"}}]},{"kind":"javascript-module","path":"src/highlight/syntax.ts","declarations":[{"kind":"variable","name":"syntaxHighlighter","type":{"text":"Highlighter"},"description":"Gives each token the class of the rule that colors it, a `helix-syntax-`\nclass such as `helix-syntax-keyword`. Pass it to `highlight`, and put\n`syntaxRules` where the result is drawn."},{"kind":"variable","name":"syntaxRules","type":{"text":"string"},"description":"The CSS for `syntaxHighlighter`'s classes, which colors them from the `--helix-color-syntax-*` tokens."}],"exports":[{"kind":"js","name":"syntaxHighlighter","declaration":{"name":"syntaxHighlighter","module":"src/highlight/syntax.ts"}},{"kind":"js","name":"syntaxRules","declaration":{"name":"syntaxRules","module":"src/highlight/syntax.ts"}}]},{"kind":"javascript-module","path":"src/index.ts","declarations":[],"exports":[{"kind":"js","name":"CaretDetail","declaration":{"name":"CaretDetail","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixBeforeEditEvent","declaration":{"name":"HelixBeforeEditEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixCaretEvent","declaration":{"name":"HelixCaretEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixEditEvent","declaration":{"name":"HelixEditEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"*","declaration":{"name":"*","module":"src/highlight/index.js"}},{"kind":"js","name":"EditorLanguage","declaration":{"name":"EditorLanguage","module":"./sandbox/editor/sandbox-editor.js"}},{"kind":"js","name":"HelixSandboxEditor","declaration":{"name":"HelixSandboxEditor","module":"./sandbox/editor/sandbox-editor.js"}}]},{"kind":"javascript-module","path":"src/sandbox/editor/sandbox-editor.css.ts","declarations":[{"kind":"variable","name":"styles"}],"exports":[{"kind":"js","name":"styles","declaration":{"name":"styles","module":"src/sandbox/editor/sandbox-editor.css.ts"}}]},{"kind":"javascript-module","path":"src/sandbox/editor/sandbox-editor.ts","declarations":[{"kind":"class","description":"CodeMirror, not a `<textarea>`. A textarea cannot highlight what it holds,\nnumber its lines, or say where the cursor is, and a status bar reading line\nand column has to ask something.\n\n**On its own path.** This is `@fusion.dev/helix-sandbox/editor`, and the\npackage's root exports its class as a type only, because CodeMirror is most\nof what the package weighs over the wire. A sandbox with no editable pane\npays for none, and neither does a site that registers its elements once.\n\n`language` names the grammar by the name a file or a sandbox pane carries:\n`css`, `html`, `js`, `jsx`, `mjs`, `sh`, `ts` or `tsx`. A name the editor\ndoes not read draws the source plain, and the console says so once.\n\nEach edit a reader makes is `helix-before-edit` first, which you can cancel\nto refuse the edit, and `helix-edit` once the source holds it, as\n`helix-sandbox-source` sends them. A `value` set from outside is the source the editor is given, and\nsends neither. **The editor is `:state(modified)` while its source differs\nfrom the source it was given**, the first `value` or the last one set from\noutside, and `reset()` puts that source back as an edit.\n\nThe view is built once and reconfigured, not rebuilt. Replacing it on every\nchange would throw away the undo history, the scroll position, and the\nselection, which is most of what an editor is.","name":"HelixSandboxEditor","cssParts":[{"description":"The element CodeMirror is mounted into.","name":"editor"}],"members":[{"kind":"field","name":"words","type":{"text":"string"},"static":true,"default":"'helix-sandbox-editor'","description":"The key the editor's words are registered under, its tag:\n`registerWords('de', { 'helix-sandbox-editor': { fieldLabel: 'Quelltext' } })`."},{"kind":"field","name":"fieldLabel","type":{"text":"string"},"default":"'Example source'","description":"Accessible name for the editable region.","attribute":"field-label","helix":{"words":true}},{"kind":"field","name":"language","type":{"text":"'css' | 'html' | 'javascript' | 'js' | 'json' | 'jsx' | 'mjs' | 'sh' | 'ts' | 'tsx'"},"default":"'html'","description":"The language of the source, which decides how it is highlighted. A name\nthe editor does not read draws the source plain.","attribute":"language"},{"kind":"field","name":"name","type":{"text":"string"},"default":"'html'","description":"Which source this pane holds, echoed in every change.","attribute":"name"},{"kind":"field","name":"readOnly","type":{"text":"boolean"},"default":"false","description":"Whether the text can be changed.\n\n`EditorState.readOnly` rather than removing the editor's focus or its\nkeymap: a reader still needs to select the text, scroll it, and put a\ncursor in it to read a long line. What it stops is the typing.","attribute":"readonly","reflects":true,"helix":{"boolean":"present"}},{"kind":"field","name":"value","type":{"text":"string"},"default":"''","description":"The source being edited.","attribute":"value"},{"kind":"field","name":"readOnly$","privacy":"private","readonly":true,"default":"new Compartment()"},{"kind":"field","name":"view","type":{"text":"EditorView | undefined"},"privacy":"private"},{"kind":"field","name":"language$","privacy":"private","readonly":true,"default":"new Compartment()"},{"kind":"field","name":"name$","privacy":"private","readonly":true,"default":"new Compartment()","description":"The editable region's name, which follows `field-label` and the words registered for it."},{"kind":"field","name":"baseline","type":{"text":"string"},"privacy":"private","default":"''","description":"The source the editor was given: its first `value`, or the last one set from outside."},{"kind":"field","name":"edited","type":{"text":"string | undefined"},"privacy":"private","description":"The source the last edit left, while `value` still holds it."},{"kind":"field","name":"unread","type":{"text":"string | undefined"},"privacy":"private","description":"The `language` last reported as one the editor does not read."},{"kind":"field","name":"modified","type":{"text":"boolean"},"description":"Whether the source differs from the source the editor was given: its\nfirst `value`, or the last one set from outside.","readonly":true},{"kind":"method","name":"reset","return":{"type":{"text":"void"}},"description":"Puts back the source the editor was given, as an edit: `helix-before-edit`\nis sent first and can refuse it, and a sandbox passes it to its preview.","type":{"text":"reset() => void"}},{"kind":"method","name":"grammar","privacy":"private","return":{"type":{"text":"Extension"}},"description":"What `language` turns on: its grammar, or nothing for a name the editor\ndoes not read, which it reports once for each name."},{"kind":"field","name":"caret","type":{"text":"CaretDetail"},"description":"Where the cursor is, counted from one, as an editor reports it.","readonly":true},{"kind":"field","name":"mount","type":{"text":"HTMLElement | null"},"privacy":"private","readonly":true},{"kind":"method","name":"create","privacy":"private","return":{"type":{"text":"void"}},"description":"Builds the view once the mount exists.\n\n`root` is the shadow root rather than the document, or CodeMirror puts its\nstylesheet where this element cannot see it and the editor renders unstyled."},{"kind":"method","name":"focus","return":{"type":{"text":"void"}},"description":"Moves focus into the text, not onto the host.\n\nThe host is not focusable: what a reader types into is CodeMirror's\ncontenteditable, several nodes down inside this shadow root. Without this,\n`editor.focus()` from outside silently does nothing.","type":{"text":"focus() => void"}},{"kind":"field","name":"tier","type":{"text":"string"},"static":true,"default":"'helix-headless-'","description":"The prefix this tier registers its elements under.\n\n**A component that renders another renders its own tier's version of it**,\nso `helix-headless-pagination-size` composes `helix-headless-select` and\n`helix-pagination-size` composes `helix-select`. One template says\n`${this.tag('select')}` and each tier answers with its own name.\n\n**The public tag may not be the composed one, in either tier.** Using it\ncosts three things: the name means two different things depending on what a\nconsumer imported, the headless tier composes an element it does not ship,\nand the composition cannot be tested there at all, because there is no\n`helix-select` on that tier to test it against.\n\n**A prefix rather than an override per composition**, which was the first\nplan and does not compile. An override re-renders the fragment from the\nsubclass, and the fragment reads members the base keeps private:\n`PaginationSize` alone would have had to widen `options`, `current` and\n`handleChange` to `protected` so a subclass could say the same thing again.\nSixteen families of that is a lot of encapsulation spent on saying one\nword differently.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"tag","privacy":"protected","return":{"type":{"text":"StaticValue"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"One composed tag, as a static value a template can interpolate.\n\nWhat `unsafeStatic` returns, safe by construction: the name is a literal in\nour own source and the prefix is one of two strings this class defines.\nCalled per render and not cached, which costs nothing, because\n`static-html` keys its template cache on the joined string rather than on\nthe object.\n\n**Written out rather than imported, for every element that never renders\none.** `lit/static-html.js` declares no side effects, so importing\n`unsafeStatic` alone kept the module's three `withStatic` calls in every\nbundle: about 210 bytes gzipped on each of the families that compose no\ntag, Divider and Badge among them. The value is lit's cross-copy protocol,\nkeyed by `Symbol.for('')` so that two copies of lit on a page read each\nother's, and a spec holds it equal to `unsafeStatic`'s.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"partNamed","privacy":"protected","return":{"type":{"text":"T | null"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"One of this element's own parts, by name, or null where it is not rendered.\n\nNot `part`, which every element already has: `Element.part` is the\n`DOMTokenList` of the names the element itself carries, and a method under\nthat name is a type error on every subclass.\n\n**One guard for every lookup.** Lit's server shim has no `querySelector`\non the render root, so a lookup reached during a server render, from a\ngetter a template reads or from `willUpdate`, throws there and nowhere\nelse. Four spellings of the same guard had grown across the library, and\na fifth site with none. Null on the server, which is what the rest of the\ncode already treats a part that has not rendered as.\n\n**`~=` and not `=`.** A part drawn in a state carries a second name while\nthe state holds, `part=\"page page-current\"`, and an exact match stops\nfinding it for exactly as long as it is the one that matters.\n\n`helix component`'s `selectors` reads these calls the way it reads a\n`querySelector('[part=\"x\"]')`, so a name nothing renders is a finding\nrather than a null an optional chain swallows.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"toggleState","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"name","type":{"text":"string"}},{"name":"on","type":{"text":"boolean"}}],"description":"Records a boolean fact about this element as a custom state.\n\n**The host belongs to whoever rendered it, and a component's own\nbookkeeping may not be kept there.** An attribute written on the first\nupdate is markup a consumer's server never sent, so a React consumer\nhydrates a DOM that has gained attributes since and reports a mismatch it\nwill not patch up. A custom state is not in the DOM at all: it carries the\nfact to a stylesheet through `:state()` and leaves the markup alone, so the\nserver's output and the client's agree by construction.\n\n`SETTLED` carries the long version of that argument; `checked`, `open`,\n`invalid` and `has-label` are recorded the same way, each of them a state a\n`default-*` attribute resolves before React reaches the node.\n\n**Deferring the definitions is not a fix and could not be.** Importing them\nfrom an effect so the upgrades fall the other side of hydration works only\nwhile hydration is one pass: anything that splits it, a streamed segment or\na suspended boundary, puts an upgrade back inside the window. Timing cannot\nbe the guarantee when the fact is kept somewhere React reconciles.\n\nFeature-tested rather than assumed, the way `hostAria` tests element\nreferences. An engine without `CustomStateSet` records nothing and keeps\nwhatever the resting rule draws, which is the safe direction to fail.\n\n**The engines the test is for are browsers**: Safari below 17.4 and Firefox\nbelow 126, where the write is a `TypeError`, so a component bypassing this\nfails to render rather than rendering without whatever the state draws.\nLit's server shim sets `states`, so the guard passes there and records a\nstate nothing reads, which is harmless.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"whenSettled","type":{"text":"Promise<void>"},"readonly":true,"description":"Resolves a frame after the first update, when transitions are switched on.\n\n**Named `whenSettled` because `settled` is taken four times over**, by\nImage, Splitter and both color controls, none of them about transitions. A\nbase class takes the name every subclass then cannot use.\n\n**The state it reports cannot be watched, which is why this exists.** A\ncustom state is deliberately not in the DOM, so there is no\n`MutationObserver` equivalent for `ElementInternals.states`. Await this\ninstead.\n\nSeparate from `updateComplete`, which resolves in the microtask checkpoint\nthe suppression is still active in. That is the distinction `readyToMove`\nin `@fusion.dev/helix-testing` is written around.\n\nIt never resolves where `requestAnimationFrame` never fires, which is a\nserver, a hidden tab, and happy-dom. Callers that must not hang there race\nit against a timeout, as the happy-dom harness's `readyToMove` does. The\nbrowser harness's awaits it alone: a browser always runs the frame, and a\ntimer beside it was a bet on how long one takes, which a busy run lost.","default":"new Promise<void>((resolve) => { this.resolveSettled = resolve })","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"resolveSettled","type":{"text":"() => void"},"privacy":"private","description":"Resolves `whenSettled`, once, from the frame that records the state.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"fromServer","type":{"text":"boolean"},"privacy":"private","default":"false","description":"Whether the shadow root was a server's, parsed from declarative shadow DOM.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"hydrating","type":{"text":"boolean"},"privacy":"protected","description":"Whether this update is hydrating a server's markup, and so has to render\nexactly what the server rendered.\n\n**Lit hydrates by assuming the markup already shows the first render.** A\nvalue that differs is recorded and never written, so the page keeps the\nserver's, and a template that differs throws. The server has no children,\nso anything a component reads from its children waits for the update after\nhydration, which `finishHydration` asks for. Without a server's markup the\nfirst render reads them and there is one render.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"serverRendered","type":{"text":"boolean"},"privacy":"protected","description":"Whether this element hydrated a server's markup rather than rendering its own.\n\nFor what happened before hydration and cannot be heard after it: an image\nthe parser fetched fires `load` or `error` before any listener exists, so a\ncomponent asks the image instead, once, when this is true.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"finishHydration","privacy":"protected","return":{"type":{"text":"void"}},"description":"Asks for the update a hydration put off, so the reads it skipped happen.\n\nCalled from `firstUpdated`, the end of the hydrating update. The render it\nschedules can only follow that one, which is the exception Lit's\nchange-in-update warning names, and it happens only on a page a server\nrendered.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"childrenKnown","type":{"text":"boolean"},"privacy":"protected","description":"Whether this render can know the children.\n\nA server cannot: its element shim carries attributes and no tree, so\n`children` is undefined there. A render hydrating what a server sent must\nnot, because it has to be the server's render. Anywhere else it can. A\ncomponent whose render depends on its children reads them through\n`knownChildren`, and treats \"not known\" as its own answer rather than as\n\"none\": a list that renders its empty state because nobody has looked yet is\nthe one thing an empty state must never do.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"knownChildren","type":{"text":"Element[]"},"privacy":"protected","description":"The children a render may read: all of them where they are known, and none otherwise.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"assignsByName","type":{"text":"boolean"},"privacy":"protected","description":"Whether this element's slots route by name although it asked to assign them\nby hand.\n\n**A declarative shadow root is always the by-name kind.** HTML has no way to\nask for manual assignment, so a component that assigns by hand and hydrates\na server's root gets one where `slot.assign()` does nothing, and its\nchildren land wherever their `slot` attribute sends them. The way through is\nto write that attribute, which is what `route` does. Only there: on a root\nthis element made, assignment stays manual and the consumer's markup is\nnever touched, which is what a React consumer's hydration requires.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"route","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"child","type":{"text":"Element"}},{"name":"name","type":{"text":"string | undefined"}}],"description":"Sends a child to a slot by name, on a root that routes by name.\n\n`undefined` is the default slot. Written only when it differs, so routing\nthe same child again on every update writes nothing.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"stopInner","privacy":"protected","readonly":true,"description":"Stops an inner control's own announcement at this element's boundary.\n\n**A composed control is one control to a consumer, and the natives had no\nequivalent of the stop the prefixed events already get.** `<helix-select>`\nrenders a `<helix-listbox>`, and both announce: the listbox dispatches\n`input` and `change` from its own host, `input` is composed by\nspecification, and a consumer listening on the select therefore heard one\nchoice twice. Measured before this existed, on the styled tier, one choice\non the inner listbox: select `input` twice and `change` three times,\ncombobox, date input, time input and color input twice each. `Command` was\nthe only one that was right, because it happened to reach for\n`stopImmediatePropagation` for a different reason.\n\nBound on the child in the parent's template, so it runs while the event is\nstill at the child and before it can cross. The guard is for the case where\na component binds this on itself: an element must never stop its own\nannouncement, which is the one it exists to make.\n\nThis is the same job the `helix-before-*` handlers do with their own\n`stopPropagation`, and it is separate rather than folded into them because\na consumer may legitimately refuse a request without the notification ever\nhappening: the two travel at different times and one can be absent.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"relayNativeEvent","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"event","type":{"text":"Event"}},{"name":"init","optional":true,"type":{"text":"EventInit"}}],"description":"Re-emits a native event from the host, under its own name.\n\nA native event fired by an inner `<input>` or `<textarea>` is not composed,\nso it stops at the shadow boundary and a consumer listening on\n`<helix-input>` hears nothing. Re-dispatching it from the host is what\nmakes the component behave like the control it wraps.\n\nThe relayed event keeps the native name deliberately. `change` is `change`,\nwhich is what a consumer already knows to listen for, and it is what\nreaches React: its synthetic system claims `onChange` and wires it to that\nname, so a prefixed one would never arrive.\n\n`composed` is not forced. It defaults to the original event's own value, so\na relayed `change` stops at the next shadow boundary exactly as a native\none would. Pass it explicitly only where escaping is the intent, and say so\nwhere you do.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"markRules","type":{"text":"readonly string[]"},"privacy":"protected","static":true,"default":"[]","description":"The rules from `mark-rules.ts` for the marks this element writes in its\nown shadow root: `data-scroller`, `data-virtual`, `data-spoken`,\n`data-mirror` and `data-touches`.\n\nA component that writes a mark names its rule here, and a subclass\ninherits the list. One that writes none takes only the three rules every\nshadow root gets, which is what keeps the other four out of a Button.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"observedAttributes","type":{"text":"string[]"},"static":true,"description":"Each attribute Lit observes, and each camelCase property's name in lower\ncase.\n\nReact writes an attribute for a prop on an element that is not defined yet,\nand on a server, and HTML lowers its name. So `defaultPosition={16}` arrives\nas `defaultposition`, which names no property Lit knows, and the value was\ndropped with no error. `attributeChangedCallback` reads the lowered name as\nthe property's own attribute, so either spelling works in either order.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"finalizeStyles","privacy":"protected","static":true,"return":{"type":{"text":"CSSResultOrNative[]"}},"parameters":[{"name":"styles","optional":true,"type":{"text":"CSSResultOrNative | CSSResultOrNative[]"}}],"description":"Prepends the shadow-root reset to every subclass's styles, so no component\nhas to remember to include it, with the rules for the marks it writes.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"performUpdate","privacy":"protected","return":{"type":{"text":"void"}},"description":"The first update, timed where a page asked to measure what the components\ncost, and a property read where it did not: see `reportRender`.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"reactApplied","type":{"text":"boolean | undefined"},"privacy":"private","description":"Whether the first update found React's props, where it looked before the\nrender. See `willUpdate`.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}}],"events":[{"type":{"text":"HelixBeforeEditEvent"},"description":"Fired before the source is edited. Cancelable: refusing it takes the decision and nothing moves.","name":"helix-before-edit","reactProp":"onhelix-before-edit"},{"type":{"text":"HelixCaretEvent"},"description":"Fired when the cursor moves, with its line and column.","name":"helix-caret","reactProp":"onhelix-caret"},{"type":{"text":"HelixEditEvent"},"description":"Fired after the source was edited, with the new source.","name":"helix-edit","reactProp":"onhelix-edit"}],"attributes":[{"name":"field-label","type":{"text":"string"},"default":"'Example source'","description":"Accessible name for the editable region.","fieldName":"fieldLabel"},{"name":"language","type":{"text":"'css' | 'html' | 'javascript' | 'js' | 'json' | 'jsx' | 'mjs' | 'sh' | 'ts' | 'tsx'"},"default":"'html'","description":"The language of the source, which decides how it is highlighted. A name\nthe editor does not read draws the source plain.","fieldName":"language"},{"name":"name","type":{"text":"string"},"default":"'html'","description":"Which source this pane holds, echoed in every change.","fieldName":"name"},{"name":"readonly","type":{"text":"boolean"},"default":"false","description":"Whether the text can be changed.\n\n`EditorState.readOnly` rather than removing the editor's focus or its\nkeymap: a reader still needs to select the text, scroll it, and put a\ncursor in it to read a long line. What it stops is the typing.","fieldName":"readOnly"},{"name":"value","type":{"text":"string"},"default":"''","description":"The source being edited.","fieldName":"value"}],"cssStates":[{"description":"While the source differs from the source the editor was given, until `reset()` or a new `value`.","name":"modified"},{"description":"Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.","name":"settled","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}}],"superclass":{"name":"HelixElement","package":"@fusion.dev/helix-core"},"summary":"An editable pane of source, with highlighting and line numbers.","helix":{"category":"tooling","since":"0.1.0","status":"experimental","documentation":"https://fusion.dev/helix/components/sandbox","aliases":["Code editor","Source pane"],"family":"sandbox","tier":"styled","group":"Sandbox","part":"Editor"},"tagName":"helix-sandbox-editor","customElement":true,"modulePath":"src/sandbox/editor/sandbox-editor.ts","definitionPath":"src/sandbox/editor/sandbox-editor.ts"}],"exports":[{"kind":"js","name":"HelixSandboxEditor","declaration":{"name":"HelixSandboxEditor","module":"src/sandbox/editor/sandbox-editor.ts"}},{"kind":"custom-element-definition","name":"helix-sandbox-editor","declaration":{"name":"HelixSandboxEditor","module":"src/sandbox/editor/sandbox-editor.ts"}}]}],"helix":{"package":"@fusion.dev/helix-sandbox","version":"0.225.0"}}
+{"schemaVersion":"1.0.0","readme":"","modules":[{"kind":"javascript-module","path":"src/code-block/code-block-highlight.ts","declarations":[{"kind":"function","name":"codeBlockHighlighter","return":{"type":{"text":"string | undefined"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"language","type":{"text":"string"}}],"description":"Highlights a block's code by its `language`, in any case and by any name\n`languageOf` reads, such as `ts`, `TypeScript` or `bash`, or returns\n`undefined` for a language no grammar here reads, which the block then\ndraws plain.\n\n**In the editor's own style**, so a snippet in a block and the same snippet\nopen in the sandbox are colored by one source: the classes are the ones\n`syntaxHighlighter` gives each token, and `codeBlockSheet` holds the rules\nfor them, in the `--helix-color-syntax-*` tokens."},{"kind":"variable","name":"codeBlockSheet","type":{"text":"CSSResult"},"description":"The rules that color `codeBlockHighlighter`'s classes, for a block to adopt."}],"exports":[{"kind":"js","name":"codeBlockHighlighter","declaration":{"name":"codeBlockHighlighter","module":"src/code-block/code-block-highlight.ts"}},{"kind":"js","name":"codeBlockSheet","declaration":{"name":"codeBlockSheet","module":"src/code-block/code-block-highlight.ts"}}]},{"kind":"javascript-module","path":"src/code-block/index.ts","declarations":[],"exports":[{"kind":"js","name":"codeBlockHighlighter","declaration":{"name":"codeBlockHighlighter","module":"./code-block-highlight.js"}},{"kind":"js","name":"codeBlockSheet","declaration":{"name":"codeBlockSheet","module":"./code-block-highlight.js"}}]},{"kind":"javascript-module","path":"src/editor/index.ts","declarations":[],"exports":[{"kind":"js","name":"*","declaration":{"name":"*","module":"src/sandbox/editor/sandbox-editor.js"}}]},{"kind":"javascript-module","path":"src/highlight/highlight.ts","declarations":[{"kind":"function","name":"highlight","return":{"type":{"text":"string"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"language","type":{"text":"HighlightLanguage"}},{"name":"highlighter","default":"classHighlighter","type":{"text":"Highlighter"}}],"description":"Highlights a snippet, returning HTML with one span per token.\n\n**A parser, and no editor.** Lezer's grammars are parsers, and parsing is a\npure function of the text: `highlightCode` walks a tree and hands back\ntokens. Nothing is mounted, no document is created, and this runs on a server\nwith no DOM at all, which is what lets a static page ship highlighted code\nwith no client JavaScript spent on it.\n\n**`CodeBlock` holds no parser.** A `dependencies` entry is paid by every\nconsumer whether or not they import it, so the grammars are in this package,\nbeside the editor that reads them too. `CodeBlock` renders a `<slot>`, so the\noutput of this drops straight into one. A snippet on a reference page and the\nsame snippet open in the sandbox are then colored by one source.\n\n`classHighlighter` emits Lezer's own `tok-` class names. Mapping those to\ncolors is yours, because the classes are stable and a palette is not: the\nFusion site paints them from `--helix-color-syntax-*`. Pass another\n`highlighter` for other classes, such as `syntaxHighlighter`, the editor's\nown, whose rules are `syntaxRules`."}],"exports":[{"kind":"js","name":"highlight","declaration":{"name":"highlight","module":"src/highlight/highlight.ts"}}]},{"kind":"javascript-module","path":"src/highlight/index.ts","declarations":[],"exports":[{"kind":"js","name":"highlight","declaration":{"name":"highlight","module":"./highlight.js"}},{"kind":"js","name":"HighlightLanguage","declaration":{"name":"HighlightLanguage","module":"./language.js"}},{"kind":"js","name":"languageOf","declaration":{"name":"languageOf","module":"./language.js"}},{"kind":"js","name":"syntaxHighlighter","declaration":{"name":"syntaxHighlighter","module":"./syntax.js"}},{"kind":"js","name":"syntaxRules","declaration":{"name":"syntaxRules","module":"./syntax.js"}}]},{"kind":"javascript-module","path":"src/highlight/language.ts","declarations":[{"kind":"function","name":"languageOf","return":{"type":{"text":"HighlightLanguage | undefined"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"The language a name stands for, in any case: `TypeScript`, `bash` or `mjs`.\n`undefined` for a name no grammar here reads."}],"exports":[{"kind":"js","name":"languageOf","declaration":{"name":"languageOf","module":"src/highlight/language.ts"}}]},{"kind":"javascript-module","path":"src/highlight/shell.ts","declarations":[{"kind":"variable","name":"shellMode","type":{"text":"StreamParser<ShellState>"},"default":"{ ...(shell as StreamParser<ShellState>), startState(indent) { const state = (shell as StreamParser<ShellState>).startState?.(indent) ?? ({} as ShellState) state.helixHead = true return state }, token(stream, state) { if (stream.sol()) { state.helixHead = true } const head = state.helixHead const from = stream.pos const token = (shell as StreamParser<ShellState>).token(stream, state) const text = stream.string.slice(from, stream.pos) /* Whitespace decides nothing: it neither is a command nor ends the position a command could be in, so it passes through without touching the flag. */ if (text.trim() === '') { return token } if (OPENS.test(text.trim())) { state.helixHead = true return token } state.helixHead = false return token === null && head && /^[A-Za-z_][\\w.@/-]*$/.test(text) ? 'command' : token }, }","description":"The sh mode, with the command named."},{"kind":"variable","name":"shellTokens","type":{"text":"Record<string, Tag>"},"default":"{ command: tags.keyword }","description":"What `shellMode`'s own token name is drawn as, for its `tokenTable`."}],"exports":[{"kind":"js","name":"shellMode","declaration":{"name":"shellMode","module":"src/highlight/shell.ts"}},{"kind":"js","name":"shellTokens","declaration":{"name":"shellTokens","module":"src/highlight/shell.ts"}}]},{"kind":"javascript-module","path":"src/highlight/stream.ts","declarations":[{"kind":"function","name":"highlightStream","return":{"type":{"text":"void"}},"parameters":[{"name":"code","type":{"text":"string"}},{"name":"mode","type":{"text":"StreamParser<State>"}},{"name":"table","type":{"text":"Record<string, Tag | readonly Tag[]>"}},{"name":"highlighter","type":{"text":"Highlighter"}},{"name":"put","type":{"text":"(text: string, classes: string) => void"}},{"name":"putBreak","type":{"text":"() => void"}}],"description":"Highlights `code` with a mode, in the shape `highlightCode` from\n`@lezer/highlight` uses: `put` for each run of text with its classes, and\n`putBreak` between lines. Neighboring tokens with the same classes are one\nrun, as they are there."}],"exports":[{"kind":"js","name":"highlightStream","declaration":{"name":"highlightStream","module":"src/highlight/stream.ts"}}]},{"kind":"javascript-module","path":"src/highlight/syntax.ts","declarations":[{"kind":"variable","name":"syntaxHighlighter","type":{"text":"Highlighter"},"description":"Gives each token the class of the rule that colors it, a `helix-syntax-`\nclass such as `helix-syntax-keyword`. Pass it to `highlight`, and put\n`syntaxRules` where the result is drawn."},{"kind":"variable","name":"syntaxRules","type":{"text":"string"},"description":"The CSS for `syntaxHighlighter`'s classes, which colors them from the `--helix-color-syntax-*` tokens."}],"exports":[{"kind":"js","name":"syntaxHighlighter","declaration":{"name":"syntaxHighlighter","module":"src/highlight/syntax.ts"}},{"kind":"js","name":"syntaxRules","declaration":{"name":"syntaxRules","module":"src/highlight/syntax.ts"}}]},{"kind":"javascript-module","path":"src/index.ts","declarations":[],"exports":[{"kind":"js","name":"CaretDetail","declaration":{"name":"CaretDetail","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixBeforeEditEvent","declaration":{"name":"HelixBeforeEditEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixCaretEvent","declaration":{"name":"HelixCaretEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"HelixEditEvent","declaration":{"name":"HelixEditEvent","package":"@fusion.dev/helix/sandbox/events"}},{"kind":"js","name":"*","declaration":{"name":"*","module":"src/highlight/index.js"}},{"kind":"js","name":"EditorLanguage","declaration":{"name":"EditorLanguage","module":"./sandbox/editor/sandbox-editor.js"}},{"kind":"js","name":"HelixSandboxEditor","declaration":{"name":"HelixSandboxEditor","module":"./sandbox/editor/sandbox-editor.js"}}]},{"kind":"javascript-module","path":"src/sandbox/editor/sandbox-editor.css.ts","declarations":[{"kind":"variable","name":"styles"}],"exports":[{"kind":"js","name":"styles","declaration":{"name":"styles","module":"src/sandbox/editor/sandbox-editor.css.ts"}}]},{"kind":"javascript-module","path":"src/sandbox/editor/sandbox-editor.ts","declarations":[{"kind":"class","description":"CodeMirror, not a `<textarea>`. A textarea cannot highlight what it holds,\nnumber its lines, or say where the cursor is, and a status bar reading line\nand column has to ask something.\n\n**On its own path.** This is `@fusion.dev/helix-sandbox/editor`, and the\npackage's root exports its class as a type only, because CodeMirror is most\nof what the package weighs over the wire. A sandbox with no editable pane\npays for none, and neither does a site that registers its elements once.\n\n`language` names the grammar by the name a file or a sandbox pane carries:\n`css`, `html`, `js`, `jsx`, `mjs`, `sh`, `ts` or `tsx`. A name the editor\ndoes not read draws the source plain, and the console says so once.\n\nEach edit a reader makes is `helix-before-edit` first, which you can cancel\nto refuse the edit, and `helix-edit` once the source holds it, as\n`helix-sandbox-source` sends them. A `value` set from outside is the source the editor is given, and\nsends neither. **The editor is `:state(modified)` while its source differs\nfrom the source it was given**, the first `value` or the last one set from\noutside, and `reset()` puts that source back as an edit.\n\nThe view is built once and reconfigured, not rebuilt. Replacing it on every\nchange would throw away the undo history, the scroll position, and the\nselection, which is most of what an editor is.","name":"HelixSandboxEditor","cssParts":[{"description":"The element CodeMirror is mounted into.","name":"editor"}],"members":[{"kind":"field","name":"words","type":{"text":"string"},"static":true,"default":"'helix-sandbox-editor'","description":"The key the editor's words are registered under, its tag:\n`registerWords('de', { 'helix-sandbox-editor': { fieldLabel: 'Quelltext' } })`."},{"kind":"field","name":"fieldLabel","type":{"text":"string"},"default":"'Example source'","description":"Accessible name for the editable region.","attribute":"field-label","helix":{"words":true}},{"kind":"field","name":"language","type":{"text":"'css' | 'html' | 'javascript' | 'js' | 'json' | 'jsx' | 'mjs' | 'sh' | 'ts' | 'tsx'"},"default":"'html'","description":"The language of the source, which decides how it is highlighted. A name\nthe editor does not read draws the source plain.","attribute":"language"},{"kind":"field","name":"name","type":{"text":"string"},"default":"'html'","description":"Which source this pane holds, echoed in every change.","attribute":"name"},{"kind":"field","name":"readOnly","type":{"text":"boolean"},"default":"false","description":"Whether the text can be changed.\n\n`EditorState.readOnly` rather than removing the editor's focus or its\nkeymap: a reader still needs to select the text, scroll it, and put a\ncursor in it to read a long line. What it stops is the typing.","attribute":"readonly","reflects":true,"helix":{"boolean":"present"}},{"kind":"field","name":"value","type":{"text":"string"},"default":"''","description":"The source being edited.","attribute":"value"},{"kind":"field","name":"readOnly$","privacy":"private","readonly":true,"default":"new Compartment()"},{"kind":"field","name":"view","type":{"text":"EditorView | undefined"},"privacy":"private"},{"kind":"field","name":"language$","privacy":"private","readonly":true,"default":"new Compartment()"},{"kind":"field","name":"name$","privacy":"private","readonly":true,"default":"new Compartment()","description":"The editable region's name, which follows `field-label` and the words registered for it."},{"kind":"field","name":"baseline","type":{"text":"string"},"privacy":"private","default":"''","description":"The source the editor was given: its first `value`, or the last one set from outside."},{"kind":"field","name":"edited","type":{"text":"string | undefined"},"privacy":"private","description":"The source the last edit left, while `value` still holds it."},{"kind":"field","name":"unread","type":{"text":"string | undefined"},"privacy":"private","description":"The `language` last reported as one the editor does not read."},{"kind":"field","name":"modified","type":{"text":"boolean"},"description":"Whether the source differs from the source the editor was given: its\nfirst `value`, or the last one set from outside.","readonly":true},{"kind":"method","name":"reset","return":{"type":{"text":"void"}},"description":"Puts back the source the editor was given, as an edit: `helix-before-edit`\nis sent first and can refuse it, and a sandbox passes it to its preview.","type":{"text":"reset() => void"}},{"kind":"method","name":"grammar","privacy":"private","return":{"type":{"text":"Extension"}},"description":"What `language` turns on: its grammar, or nothing for a name the editor\ndoes not read, which it reports once for each name."},{"kind":"field","name":"caret","type":{"text":"CaretDetail"},"description":"Where the cursor is, counted from one, as an editor reports it.","readonly":true},{"kind":"field","name":"mount","type":{"text":"HTMLElement | null"},"privacy":"private","readonly":true},{"kind":"method","name":"create","privacy":"private","return":{"type":{"text":"void"}},"description":"Builds the view once the mount exists.\n\n`root` is the shadow root rather than the document, or CodeMirror puts its\nstylesheet where this element cannot see it and the editor renders unstyled."},{"kind":"method","name":"focus","return":{"type":{"text":"void"}},"description":"Moves focus into the text, not onto the host.\n\nThe host is not focusable: what a reader types into is CodeMirror's\ncontenteditable, several nodes down inside this shadow root. Without this,\n`editor.focus()` from outside silently does nothing.","type":{"text":"focus() => void"}},{"kind":"field","name":"tier","type":{"text":"string"},"static":true,"default":"'helix-headless-'","description":"The prefix this tier registers its elements under.\n\n**A component that renders another renders its own tier's version of it**,\nso `helix-headless-pagination-size` composes `helix-headless-select` and\n`helix-pagination-size` composes `helix-select`. One template says\n`${this.tag('select')}` and each tier answers with its own name.\n\n**The public tag may not be the composed one, in either tier.** Using it\ncosts three things: the name means two different things depending on what a\nconsumer imported, the headless tier composes an element it does not ship,\nand the composition cannot be tested there at all, because there is no\n`helix-select` on that tier to test it against.\n\n**A prefix rather than an override per composition**, which was the first\nplan and does not compile. An override re-renders the fragment from the\nsubclass, and the fragment reads members the base keeps private:\n`PaginationSize` alone would have had to widen `options`, `current` and\n`handleChange` to `protected` so a subclass could say the same thing again.\nSixteen families of that is a lot of encapsulation spent on saying one\nword differently.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"tag","privacy":"protected","return":{"type":{"text":"StaticValue"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"One composed tag, as a static value a template can interpolate.\n\nWhat `unsafeStatic` returns, safe by construction: the name is a literal in\nour own source and the prefix is one of two strings this class defines.\nCalled per render and not cached, which costs nothing, because\n`static-html` keys its template cache on the joined string rather than on\nthe object.\n\n**Written out rather than imported, for every element that never renders\none.** `lit/static-html.js` declares no side effects, so importing\n`unsafeStatic` alone kept the module's three `withStatic` calls in every\nbundle: about 210 bytes gzipped on each of the families that compose no\ntag, Divider and Badge among them. The value is lit's cross-copy protocol,\nkeyed by `Symbol.for('')` so that two copies of lit on a page read each\nother's, and a spec holds it equal to `unsafeStatic`'s.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"partNamed","privacy":"protected","return":{"type":{"text":"T | null"}},"parameters":[{"name":"name","type":{"text":"string"}}],"description":"One of this element's own parts, by name, or null where it is not rendered.\n\nNot `part`, which every element already has: `Element.part` is the\n`DOMTokenList` of the names the element itself carries, and a method under\nthat name is a type error on every subclass.\n\n**One guard for every lookup.** Lit's server shim has no `querySelector`\non the render root, so a lookup reached during a server render, from a\ngetter a template reads or from `willUpdate`, throws there and nowhere\nelse. Four spellings of the same guard had grown across the library, and\na fifth site with none. Null on the server, which is what the rest of the\ncode already treats a part that has not rendered as.\n\n**`~=` and not `=`.** A part drawn in a state carries a second name while\nthe state holds, `part=\"page page-current\"`, and an exact match stops\nfinding it for exactly as long as it is the one that matters.\n\n`helix component`'s `selectors` reads these calls the way it reads a\n`querySelector('[part=\"x\"]')`, so a name nothing renders is a finding\nrather than a null an optional chain swallows.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"toggleState","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"name","type":{"text":"string"}},{"name":"on","type":{"text":"boolean"}}],"description":"Records a boolean fact about this element as a custom state.\n\n**The host belongs to whoever rendered it, and a component's own\nbookkeeping may not be kept there.** An attribute written on the first\nupdate is markup a consumer's server never sent, so a React consumer\nhydrates a DOM that has gained attributes since and reports a mismatch it\nwill not patch up. A custom state is not in the DOM at all: it carries the\nfact to a stylesheet through `:state()` and leaves the markup alone, so the\nserver's output and the client's agree by construction.\n\n`SETTLED` carries the long version of that argument; `checked`, `open`,\n`invalid` and `has-label` are recorded the same way, each of them a state a\n`default-*` attribute resolves before React reaches the node.\n\n**Deferring the definitions is not a fix and could not be.** Importing them\nfrom an effect so the upgrades fall the other side of hydration works only\nwhile hydration is one pass: anything that splits it, a streamed segment or\na suspended boundary, puts an upgrade back inside the window. Timing cannot\nbe the guarantee when the fact is kept somewhere React reconciles.\n\nFeature-tested rather than assumed, the way `hostAria` tests element\nreferences. An engine without `CustomStateSet` records nothing and keeps\nwhatever the resting rule draws, which is the safe direction to fail.\n\n**The engines the test is for are browsers**: Safari below 17.4 and Firefox\nbelow 126, where the write is a `TypeError`, so a component bypassing this\nfails to render rather than rendering without whatever the state draws.\nLit's server shim sets `states`, so the guard passes there and records a\nstate nothing reads, which is harmless.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"whenSettled","type":{"text":"Promise<void>"},"readonly":true,"description":"Resolves a frame after the first update, when transitions are switched on.\n\n**Named `whenSettled` because `settled` is taken four times over**, by\nImage, Splitter and both color controls, none of them about transitions. A\nbase class takes the name every subclass then cannot use.\n\n**The state it reports cannot be watched, which is why this exists.** A\ncustom state is deliberately not in the DOM, so there is no\n`MutationObserver` equivalent for `ElementInternals.states`. Await this\ninstead.\n\nSeparate from `updateComplete`, which resolves in the microtask checkpoint\nthe suppression is still active in. That is the distinction `readyToMove`\nin `@fusion.dev/helix-testing` is written around.\n\nIt never resolves where `requestAnimationFrame` never fires, which is a\nserver, a hidden tab, and happy-dom. Callers that must not hang there race\nit against a timeout, as the happy-dom harness's `readyToMove` does. The\nbrowser harness's awaits it alone: a browser always runs the frame, and a\ntimer beside it was a bet on how long one takes, which a busy run lost.","default":"new Promise<void>((resolve) => { this.resolveSettled = resolve })","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"resolveSettled","type":{"text":"() => void"},"privacy":"private","description":"Resolves `whenSettled`, once, from the frame that records the state.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"fromServer","type":{"text":"boolean"},"privacy":"private","default":"false","description":"Whether the shadow root was a server's, parsed from declarative shadow DOM.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"hydrating","type":{"text":"boolean"},"privacy":"protected","description":"Whether this update is hydrating a server's markup, and so has to render\nexactly what the server rendered.\n\n**Lit hydrates by assuming the markup already shows the first render.** A\nvalue that differs is recorded and never written, so the page keeps the\nserver's, and a template that differs throws. The server has no children,\nso anything a component reads from its children waits for the update after\nhydration, which `finishHydration` asks for. Without a server's markup the\nfirst render reads them and there is one render.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"serverRendered","type":{"text":"boolean"},"privacy":"protected","description":"Whether this element hydrated a server's markup rather than rendering its own.\n\nFor what happened before hydration and cannot be heard after it: an image\nthe parser fetched fires `load` or `error` before any listener exists, so a\ncomponent asks the image instead, once, when this is true.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"finishHydration","privacy":"protected","return":{"type":{"text":"void"}},"description":"Asks for the update a hydration put off, so the reads it skipped happen.\n\nCalled from `firstUpdated`, the end of the hydrating update. The render it\nschedules can only follow that one, which is the exception Lit's\nchange-in-update warning names, and it happens only on a page a server\nrendered.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"childrenKnown","type":{"text":"boolean"},"privacy":"protected","description":"Whether this render can know the children.\n\nA server cannot: its element shim carries attributes and no tree, so\n`children` is undefined there. A render hydrating what a server sent must\nnot, because it has to be the server's render. Anywhere else it can. A\ncomponent whose render depends on its children reads them through\n`knownChildren`, and treats \"not known\" as its own answer rather than as\n\"none\": a list that renders its empty state because nobody has looked yet is\nthe one thing an empty state must never do.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"knownChildren","type":{"text":"Element[]"},"privacy":"protected","description":"The children a render may read: all of them where they are known, and none otherwise.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"assignsByName","type":{"text":"boolean"},"privacy":"protected","description":"Whether this element's slots route by name although it asked to assign them\nby hand.\n\n**A declarative shadow root is always the by-name kind.** HTML has no way to\nask for manual assignment, so a component that assigns by hand and hydrates\na server's root gets one where `slot.assign()` does nothing, and its\nchildren land wherever their `slot` attribute sends them. The way through is\nto write that attribute, which is what `route` does. Only there: on a root\nthis element made, assignment stays manual and the consumer's markup is\nnever touched, which is what a React consumer's hydration requires.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"route","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"child","type":{"text":"Element"}},{"name":"name","type":{"text":"string | undefined"}}],"description":"Sends a child to a slot by name, on a root that routes by name.\n\n`undefined` is the default slot. Written only when it differs, so routing\nthe same child again on every update writes nothing.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"stopInner","privacy":"protected","readonly":true,"description":"Stops an inner control's own announcement at this element's boundary.\n\n**A composed control is one control to a consumer, and the natives had no\nequivalent of the stop the prefixed events already get.** `<helix-select>`\nrenders a `<helix-listbox>`, and both announce: the listbox dispatches\n`input` and `change` from its own host, `input` is composed by\nspecification, and a consumer listening on the select therefore heard one\nchoice twice. Measured before this existed, on the styled tier, one choice\non the inner listbox: select `input` twice and `change` three times,\ncombobox, date input, time input and color input twice each. `Command` was\nthe only one that was right, because it happened to reach for\n`stopImmediatePropagation` for a different reason.\n\nBound on the child in the parent's template, so it runs while the event is\nstill at the child and before it can cross. The guard is for the case where\na component binds this on itself: an element must never stop its own\nannouncement, which is the one it exists to make.\n\nThis is the same job the `helix-before-*` handlers do with their own\n`stopPropagation`, and it is separate rather than folded into them because\na consumer may legitimately refuse a request without the notification ever\nhappening: the two travel at different times and one can be absent.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"relayNativeEvent","privacy":"protected","return":{"type":{"text":"void"}},"parameters":[{"name":"event","type":{"text":"Event"}},{"name":"init","optional":true,"type":{"text":"EventInit"}}],"description":"Re-emits a native event from the host, under its own name.\n\nA native event fired by an inner `<input>` or `<textarea>` is not composed,\nso it stops at the shadow boundary and a consumer listening on\n`<helix-input>` hears nothing. Re-dispatching it from the host is what\nmakes the component behave like the control it wraps.\n\nThe relayed event keeps the native name deliberately. `change` is `change`,\nwhich is what a consumer already knows to listen for, and it is what\nreaches React: its synthetic system claims `onChange` and wires it to that\nname, so a prefixed one would never arrive.\n\n`composed` is not forced. It defaults to the original event's own value, so\na relayed `change` stops at the next shadow boundary exactly as a native\none would. Pass it explicitly only where escaping is the intent, and say so\nwhere you do.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"markRules","type":{"text":"readonly string[]"},"privacy":"protected","static":true,"default":"[]","description":"The rules from `mark-rules.ts` for the marks this element writes in its\nown shadow root: `data-scroller`, `data-virtual`, `data-spoken`,\n`data-mirror` and `data-touches`.\n\nA component that writes a mark names its rule here, and a subclass\ninherits the list. One that writes none takes only the three rules every\nshadow root gets, which is what keeps the other four out of a Button.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"observedAttributes","type":{"text":"string[]"},"static":true,"description":"Each attribute Lit observes, and each camelCase property's name in lower\ncase.\n\nReact writes an attribute for a prop on an element that is not defined yet,\nand on a server, and HTML lowers its name. So `defaultPosition={16}` arrives\nas `defaultposition`, which names no property Lit knows, and the value was\ndropped with no error. `attributeChangedCallback` reads the lowered name as\nthe property's own attribute, so either spelling works in either order.","readonly":true,"inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"finalizeStyles","privacy":"protected","static":true,"return":{"type":{"text":"CSSResultOrNative[]"}},"parameters":[{"name":"styles","optional":true,"type":{"text":"CSSResultOrNative | CSSResultOrNative[]"}}],"description":"Prepends the shadow-root reset to every subclass's styles, so no component\nhas to remember to include it, with the rules for the marks it writes.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"method","name":"performUpdate","privacy":"protected","return":{"type":{"text":"void"}},"description":"The first update, timed where a page asked to measure what the components\ncost, and a property read where it did not: see `reportRender`.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}},{"kind":"field","name":"reactApplied","type":{"text":"boolean | undefined"},"privacy":"private","description":"Whether the first update found React's props, where it looked before the\nrender. See `willUpdate`.","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}}],"events":[{"type":{"text":"HelixBeforeEditEvent"},"description":"Fired before the source is edited. Cancelable: refusing it takes the decision and nothing moves.","name":"helix-before-edit","reactProp":"onhelix-before-edit"},{"type":{"text":"HelixCaretEvent"},"description":"Fired when the cursor moves, with its line and column.","name":"helix-caret","reactProp":"onhelix-caret"},{"type":{"text":"HelixEditEvent"},"description":"Fired after the source was edited, with the new source.","name":"helix-edit","reactProp":"onhelix-edit"}],"attributes":[{"name":"field-label","type":{"text":"string"},"default":"'Example source'","description":"Accessible name for the editable region.","fieldName":"fieldLabel"},{"name":"language","type":{"text":"'css' | 'html' | 'javascript' | 'js' | 'json' | 'jsx' | 'mjs' | 'sh' | 'ts' | 'tsx'"},"default":"'html'","description":"The language of the source, which decides how it is highlighted. A name\nthe editor does not read draws the source plain.","fieldName":"language"},{"name":"name","type":{"text":"string"},"default":"'html'","description":"Which source this pane holds, echoed in every change.","fieldName":"name"},{"name":"readonly","type":{"text":"boolean"},"default":"false","description":"Whether the text can be changed.\n\n`EditorState.readOnly` rather than removing the editor's focus or its\nkeymap: a reader still needs to select the text, scroll it, and put a\ncursor in it to read a long line. What it stops is the typing.","fieldName":"readOnly"},{"name":"value","type":{"text":"string"},"default":"''","description":"The source being edited.","fieldName":"value"}],"cssStates":[{"description":"While the source differs from the source the editor was given, until `reset()` or a new `value`.","name":"modified"},{"description":"Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.","name":"settled","inheritedFrom":{"name":"HelixElement","module":"src/helix-element/helix-element.ts"}}],"superclass":{"name":"HelixElement","package":"@fusion.dev/helix-core"},"summary":"An editable pane of source, with highlighting and line numbers.","helix":{"category":"tooling","since":"0.1.0","status":"experimental","documentation":"https://fusion.dev/helix/components/sandbox","aliases":["Code editor","Source pane"],"family":"sandbox","tier":"styled","group":"Sandbox","part":"Editor"},"tagName":"helix-sandbox-editor","customElement":true,"modulePath":"src/sandbox/editor/sandbox-editor.ts","definitionPath":"src/sandbox/editor/sandbox-editor.ts"}],"exports":[{"kind":"js","name":"HelixSandboxEditor","declaration":{"name":"HelixSandboxEditor","module":"src/sandbox/editor/sandbox-editor.ts"}},{"kind":"custom-element-definition","name":"helix-sandbox-editor","declaration":{"name":"HelixSandboxEditor","module":"src/sandbox/editor/sandbox-editor.ts"}}]}],"helix":{"package":"@fusion.dev/helix-sandbox","version":"0.226.0"}}

package/lint.json

@@ -1 +1 @@
-{"package":"@fusion.dev/helix-sandbox","tags":{"helix-sandbox-editor":{"attributes":{"field-label":null,"language":["css","html","javascript","js","json","jsx","mjs","sh","ts","tsx"],"name":null,"readonly":null,"value":null},"booleans":["readonly"],"family":"sandbox","hooks":[],"parts":["editor"],"reflected":["readonly"],"slots":[],"written":["readOnly$","read-only$","language$","name$","modified","caret","mount","whenSettled","when-settled","hydrating","serverRendered","server-rendered","childrenKnown","children-known","knownChildren","known-children","assignsByName","assigns-by-name","stopInner","stop-inner"]}},"version":"0.225.0"}
+{"package":"@fusion.dev/helix-sandbox","tags":{"helix-sandbox-editor":{"attributes":{"field-label":null,"language":["css","html","javascript","js","json","jsx","mjs","sh","ts","tsx"],"name":null,"readonly":null,"value":null},"booleans":["readonly"],"family":"sandbox","hooks":[],"parts":["editor"],"reflected":["readonly"],"slots":[],"written":["readOnly$","read-only$","language$","name$","modified","caret","mount","whenSettled","when-settled","hydrating","serverRendered","server-rendered","childrenKnown","children-known","knownChildren","known-children","assignsByName","assigns-by-name","stopInner","stop-inner"]}},"version":"0.226.0"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-sandbox",
   "description": "A CodeMirror source pane for the Helix sandbox, and a code highlighter for Code Block.",
-  "version": "0.225.0",
+  "version": "0.226.0",
   "license": "MIT",
   "author": "Fusion Development Group",
   "repository": {
@@ -73,9 +73,9 @@
     "@codemirror/legacy-modes": "^6.5.5",
     "@codemirror/state": "^6.7.6",
     "@codemirror/view": "^6.43.15",
-    "@fusion.dev/helix-core": "0.225.0",
-    "@fusion.dev/helix-headless": "0.225.0",
-    "@fusion.dev/helix-styles": "0.225.0",
+    "@fusion.dev/helix-core": "0.226.0",
+    "@fusion.dev/helix-headless": "0.226.0",
+    "@fusion.dev/helix-styles": "0.226.0",
     "@lezer/css": "^1.3.9",
     "@lezer/highlight": "^1.2.5",
     "@lezer/html": "^1.3.13",
@@ -83,9 +83,9 @@
     "@lezer/json": "^1.0.3"
   },
   "devDependencies": {
-    "@fusion.dev/helix": "0.225.0",
-    "@fusion.dev/helix-cem": "0.225.0",
-    "@fusion.dev/helix-testing": "0.225.0",
+    "@fusion.dev/helix": "0.226.0",
+    "@fusion.dev/helix-cem": "0.226.0",
+    "@fusion.dev/helix-testing": "0.226.0",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^21.0.4",
     "@lit-labs/ssr": "^4.1.0",
@@ -104,7 +104,7 @@
     "web-components"
   ],
   "peerDependencies": {
-    "@fusion.dev/helix": "0.225.0",
+    "@fusion.dev/helix": "0.226.0",
     "lit": "^3.2.1"
   },
   "peerDependenciesMeta": {