@w6w/ui 0.0.0-stage → 0.1.1

package/dist/components/Modal.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from 'react';
+interface ModalProps {
+    /** Title row content. A plain string also seeds the dialog's `aria-label`. */
+    title: ReactNode;
+    /** Accessible name for the dialog; defaults to `title` when it's a string. */
+    ariaLabel?: string;
+    onClose: () => void;
+    children: ReactNode;
+    /**
+     * Dialog width. `"wide"` fits a sidebar + content layout; `"xl"` is a large
+     * work surface (e.g. the app picker); `"full"` is a near-fullscreen work
+     * surface (e.g. the expression editor) that fills most of the viewport;
+     * `"fullscreen"` is edge-to-edge 100vw x 100vh with no visible backdrop.
+     *
+     * `"fullscreen"` leaves NO backdrop to click, so outside-click dismissal is
+     * unreachable by construction — a caller using it must give the user a
+     * visible way out via {@link ModalProps.headerRight} (Esc alone is not a
+     * discoverable affordance).
+     */
+    size?: "default" | "wide" | "xl" | "full" | "fullscreen";
+    /** Optional node rendered next to the title (e.g. an app icon). */
+    titleIcon?: ReactNode;
+    /** Optional muted meta rendered after the title (e.g. an app's id + version). */
+    subtitle?: ReactNode;
+    /** Optional node rendered at the far right of the title row (e.g. a back button). */
+    headerRight?: ReactNode;
+}
+export declare function Modal({ title, ariaLabel, onClose, children, size, titleIcon, subtitle, headerRight, }: ModalProps): import("react").JSX.Element;
+export {};

package/dist/components/RepoSyncIndicator.d.ts

@@ -0,0 +1,29 @@
+export interface RepoSyncIndicatorProps {
+    /** Branch name, e.g. "main". */
+    branch: string;
+    /** Already-shortened commit sha (the consumer formats it — D-6). `null` renders no sha. */
+    shortSha: string | null;
+    /** Already-formatted last-sync text, e.g. "3/9/2026, 12:16:29 PM" or "Never synced".
+     *  `null` renders no time row. */
+    lastSyncLabel: string | null;
+    /** Fired when the flyout's "Sync now" item is activated. The consumer owns the mutation. */
+    onSyncNow: () => void;
+    /** True while the consumer's sync is in flight. */
+    syncing?: boolean;
+    className?: string;
+    "data-testid"?: string;
+}
+/**
+ * A compact header control showing a repo glyph, a branch name and a short
+ * commit sha, with an inline flyout menu carrying the sync detail and a
+ * "Sync now" action the consumer wires.
+ *
+ * `@w6w/ui` never fetches and holds no studio policy
+ * (`studio/src/ui/ExpressionScope.tsx:40-41`, extended by D-6) — this
+ * component takes already-formatted strings and a callback.
+ *
+ * The open/close + outside-click + Escape state machine mirrors
+ * `studio/src/components/Layout.tsx:222-328`'s `ProjectMenu()` (D-3: no
+ * shared Menu/Popover/Dropdown primitive — there is exactly one consumer).
+ */
+export declare function RepoSyncIndicator(props: RepoSyncIndicatorProps): import("react").JSX.Element;

package/dist/components/ResolvedParams.d.ts

@@ -0,0 +1,31 @@
+import { StepStartState } from '../provider.tsx';
+import { ActionParam } from '../types.ts';
+export interface ResolvedParamsProps {
+    /** The action's declared params — same list `ParamsForm` renders on Configure. */
+    params: ActionParam[];
+    /** What will actually be submitted: `{ ...step.with, ...override }` — `testValues`, not `step.with`. */
+    values: Record<string, unknown>;
+    /** The exact object the test invoke sends as `state` — `steps.*`/`trigger.*` resolve against this. */
+    testStartState?: StepStartState;
+    /**
+     * `"props"` (default) renders the filtered row list; `"code"` renders the
+     * COMPLETE resolved-values JSON (A4/A5/D-2) — every visible param, defaults
+     * included. Driven by the host's own toggle state; this component never
+     * mounts a toggle of its own (D-7 — `PropertyEntryForm` already owns one on
+     * the trigger arm, and two side by side is a defect, not a feature).
+     */
+    view?: "props" | "code";
+}
+/**
+ * Read-only sibling of `ParamsForm`: for every configured param, shows the
+ * value it resolves to against the current test scope instead of an editable
+ * widget. Mounts no `contentEditable`, no `ƒx` button, no input, and never
+ * calls an `onChange` — this is the Test tab's "what will actually be sent"
+ * view, not a second place to edit params.
+ *
+ * Reuses `flattenParams`/`isParamVisible` from `ParamsForm.tsx` (same order +
+ * visibility the Configure tab uses) rather than re-flattening sections, and
+ * the static chip vocabulary (`varLabel`, `.w6w-expr-chip-*`) rather than
+ * `expression-dom.ts`'s DOM-painting, which is for the editable field.
+ */
+export declare function ResolvedParams({ params, values, testStartState, view, }: ResolvedParamsProps): import("react").JSX.Element;

package/dist/components/ServerResources.d.ts

@@ -0,0 +1,47 @@
+import { ServerResourceSample } from './server-resources-format.ts';
+export interface ServerResourcesProps {
+    /**
+     * The samples to render, oldest first. The LAST entry is the current reading;
+     * the whole array is the sparkline's series. May be empty — then every value
+     * reads `—` and no line is drawn.
+     */
+    samples: readonly ServerResourceSample[];
+}
+export interface ServerResourcesCardProps extends ServerResourcesProps {
+    /** Heading text. Defaults to `Server resources`. */
+    title?: string;
+    /** The sampler's cadence, in ms. When given, the card shows `Sampled every Ns`. */
+    intervalMs?: number;
+}
+export interface ServerResourcesRailProps extends ServerResourcesProps {
+    /**
+     * When given, the rail shows one button that asks the caller to open the full
+     * view. The rail never opens anything itself — mounting is the caller's job.
+     */
+    onExpand?: () => void;
+}
+/**
+ * The large variant: three readings (CPU, memory, process RSS), each with its
+ * own sparkline, plus the load averages and — when the caller knows it — the
+ * sampling cadence. This is the Console/Modal body.
+ */
+export declare function ServerResourcesCard({ samples, title, intervalMs, }: ServerResourcesCardProps): import("react").JSX.Element;
+/**
+ * The small variant: CPU and memory only, one sparkline (CPU). For a compact
+ * surface that has room for a headline and a shape, but not for a third
+ * reading or the load breakdown.
+ */
+export declare function ServerResourcesCardSmall({ samples, title }: ServerResourcesCardProps): import("react").JSX.Element;
+/**
+ * The left-rail variant: a stacked CPU and MEM reading, each with a sparkline,
+ * sized to fit a ~200 px column. When the caller passes `onExpand` it also
+ * shows the single "show me the rest" button; without one it is read-only
+ * decoration and renders no interactive element at all.
+ */
+export declare function ServerResourcesRail({ samples, onExpand }: ServerResourcesRailProps): import("react").JSX.Element;
+/**
+ * The header badge: one line, `CPU <pct> · MEM <pct>`, no sparkline (a badge is
+ * a fixed-height strip of text, and a line there would be unreadable). The
+ * whole string is a single text node so assistive tech reads it as one phrase.
+ */
+export declare function ServerResourcesBadge({ samples }: ServerResourcesProps): import("react").JSX.Element;

package/dist/components/StepStatusPill.d.ts

@@ -0,0 +1,51 @@
+import { ReactNode } from 'react';
+/**
+ * The five states a workflow step's execution can be in — a thin LOCAL copy
+ * of the workflow spec's `StepStatus` union
+ * (`packages/w6w-workflow/packages/types/mod.ts`). `@w6w/ui` deliberately
+ * keeps a small literal type here rather than depend on `@w6w/workflow-types`,
+ * so this stays a pure-presentation leaf with no transport/spec coupling —
+ * the same precedent `HealthStatusPill`'s `HealthPillState` establishes.
+ */
+export type StepStatus = "pending" | "running" | "succeeded" | "failed" | "skipped";
+/**
+ * The five states a whole EXECUTION (an invocation, an endpoint call, a
+ * workflow run) can be in — the run-level sibling of `StepStatus`, and again a
+ * thin LOCAL literal rather than an import of any spec/wire type. The two
+ * unions differ exactly where runs and steps differ: a run can be `queued`
+ * before it starts and `canceled` after it started, while a step inside a run
+ * can be `pending` or `skipped` (a run is never either). They are deliberately
+ * NOT merged into one five/six-member union — `ExecutionList` and the step
+ * panel must each accept only their own vocabulary.
+ */
+export type ExecutionStatus = "queued" | "running" | "succeeded" | "failed" | "canceled";
+export interface StepStatusPillProps {
+    /**
+     * Which state to render — drives the colour + default label. Accepts both
+     * vocabularies: a workflow step's `StepStatus` and a whole run's
+     * `ExecutionStatus` (the pill is only a coloured label, so it does not care
+     * which of the two a host is describing).
+     */
+    state: StepStatus | ExecutionStatus;
+    /** Override the visible text (defaults to a humanised form of `state`). */
+    label?: ReactNode;
+    /** Accessible label for the pill (falls back to the visible text). */
+    ariaLabel?: string;
+}
+/**
+ * A small, theme-aware status pill for one workflow step's execution state.
+ *
+ * Mirrors `HealthStatusPill` shape for shape: a state union, a
+ * `DEFAULT_LABELS` record, a coloured dot + text label using one
+ * `--w6w-step-color` custom property per modifier class, and the
+ * `w6w-step-pill w6w-step-pill-${state}` className convention. Colour is
+ * never the only signal — the text label carries the same meaning for
+ * accessibility. Five states rather than `HealthStatusPill`'s four, so this
+ * is a mirror of that shape, not a shared implementation.
+ *
+ * Renders BOTH vocabularies through the one prop: `StepStatus` (a step inside
+ * a run) and `ExecutionStatus` (a whole run). The union is widened at the
+ * PROP only — `StepStatus` itself is unchanged, so the step panel's own type
+ * cannot silently grow run-only states.
+ */
+export declare function StepStatusPill({ state, label, ariaLabel }: StepStatusPillProps): import("react").JSX.Element;

package/dist/components/UptimeStrip.d.ts

@@ -0,0 +1,56 @@
+/**
+ * The four states a single day of the strip can be in — a thin LOCAL copy of the
+ * RFC's `HealthReport.state` union, exactly as `HealthStatusPill` keeps one. The
+ * duplication is deliberate: it keeps `@w6w/ui` a pure-presentation leaf with no
+ * transport/spec coupling, so nothing here has to move when the spec package does.
+ *
+ * There is no fifth state. A day on which the account made no calls at all is
+ * `unknown`, never `ok` — an unverified day must never be presented as a healthy
+ * one (`rfcs/healthcheck.md`: `unknown` ranks above `ok` for that reason).
+ */
+export type UptimeCellState = "ok" | "degraded" | "down" | "unknown";
+/** One cell: the day it stands for, and the state already decided for it. */
+export interface UptimeDay {
+    /** The day this cell represents, e.g. `2026-07-27`. Shown verbatim in the tooltip. */
+    day: string;
+    /** The state for that day. The strip renders it; it never decides it. */
+    state: UptimeCellState;
+    /** Tooltip override. Defaults to `<day> — <state label>`. */
+    label?: string;
+}
+export interface UptimeStripProps {
+    /**
+     * The days to render, oldest first, one cell each. The component makes no
+     * assumption about how many there are — a caller showing a 30-day window
+     * passes 30, and a younger account can pass fewer.
+     */
+    days: UptimeDay[];
+    /**
+     * Accessible label for the strip as a whole (it is exposed as one image, not
+     * as N unlabelled boxes). Defaults to `<n>-day status`.
+     */
+    ariaLabel?: string;
+}
+/**
+ * A fixed-height strip of one cell per day, for "how has this service behaved
+ * lately" at a glance.
+ *
+ * Purely presentational — it is handed an array of ALREADY-DECIDED states and
+ * renders exactly those. No rules, no roll-up and no judgement about what counts
+ * as broken live in this package; whatever decided the states owns that.
+ *
+ * Colour is never the only signal (same rule as `HealthStatusPill`, which pairs
+ * its dot with a text label). Thirty cells cannot carry thirty labels, so the
+ * strip signals twice in two other ways:
+ *   - every cell carries a `title` with its day and state, and
+ *   - the FILL HEIGHT encodes severity, so the row survives greyscale and
+ *     colour-blind viewing: `ok` is a short baseline bar, `degraded` a taller
+ *     one, `down` fills the cell, and `unknown` is a hatched outline with no
+ *     solid fill at all (nothing was measured — it is not a good day and not a
+ *     bad one).
+ *
+ * Colour itself comes from the shared `--w6w-health-*` tokens through the single
+ * `--w6w-health-color` indirection the health pill uses, so a host that
+ * overrides a token restyles the pill and the strip together.
+ */
+export declare function UptimeStrip({ days, ariaLabel }: UptimeStripProps): import("react").JSX.Element | null;

package/dist/components/execution-format.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Pure duration/time formatters for the execution-history family, kept in
+ * their own module so they carry no React and can be unit-tested on their own
+ * — the same split `server-resources-format.ts` establishes.
+ *
+ * Both are TOTAL: a duration that was never measured (a still-running or
+ * queued run) is rendered as an em dash, never as `0 ms` — "unknown" must not
+ * read as "instant".
+ */
+/**
+ * A run duration as a short human string: whole milliseconds below a second
+ * (`999 ms`), one decimal place in seconds below a minute (`1.5 s`), and
+ * `2m 5s` from a minute up. `null`/`undefined` (nothing measured), `NaN` and
+ * negatives are all `—`.
+ */
+export declare function formatDurationMs(ms: number | null | undefined): string;
+/**
+ * An ISO-8601 instant as a short, locale-formatted date+time (`Sep 22, 2026,
+ * 10:00 AM` under the default locale). The locale is the HOST's
+ * (`undefined`), so the string follows the viewer's own settings rather than
+ * baking one in. A string `Date` cannot parse is returned UNCHANGED — an
+ * unrenderable timestamp is shown as the wire value, never as "Invalid Date".
+ */
+export declare function formatExecutionTime(iso: string): string;

package/dist/components/expression-dom.d.ts

@@ -0,0 +1,154 @@
+import { ExprPart } from '../types.ts';
+/**
+ * The name a source or chip DISPLAYS. Never the ref it SAVES.
+ *
+ * A saved ref is always canonical and engine-resolvable — the run scope offers
+ * exactly `vars.* · steps.<id>.output.* · steps.<id>.meta.* · trigger.* · secrets.* · documents.* ·
+ * inputs.* · foreach.* · output.*` (`core/rfcs/workflow.md` §Expressions, built
+ * in `w6w-workflow/packages/engine/src/run.ts`). Those read long in a field, so
+ * the label drops the root the chip's sigil and colour already imply:
+ *
+ * | ref                         | label          |
+ * |-----------------------------|----------------|
+ * | `vars.from_email`           | `from_email`   |
+ * | `steps.gate_1.output`       | `gate_1`       |
+ * | `steps.gate_1.output.email` | `gate_1.email` |
+ * | `steps.gate_1.meta.version` | `gate_1 meta · version` |
+ * | anything else               | verbatim       |
+ *
+ * **`gate_1.email` is a LABEL ONLY — it is not an expression.** There is no
+ * `gate_1` key at the run-scope root, so a chip that STORED the short form would
+ * render perfectly in the editor and resolve to empty at run time, silently and
+ * untraceably. `makeChip` keeps the two apart deliberately: the chip's stored
+ * attribute carries the ref, this function only ever feeds `label.textContent`.
+ */
+export declare const varLabel: (ref: string) => string;
+/**
+ * Whether a declared output key can become a ref the engine actually resolves.
+ *
+ * A key that fails this would still produce a chip that renders perfectly and
+ * evaluates to **empty at run time, silently** — the same failure mode the
+ * label/ref split exists to avoid — so the picker must not offer it at all. The
+ * step's WHOLE output (`steps.<id>.output`) is still offered, which remains the
+ * author's route to such a field via an explicit `=` JSONLogic expression.
+ */
+export declare function isRefSafeKey(key: string): boolean;
+/**
+ * Whether a declared output PATH (`start.utc` — an app action's `OutputField`
+ * key, where `.` means nesting, not a literal character) can become a ref the
+ * engine resolves: the same `getVar` split that makes a literal `a.b` key
+ * unreachable is what walks a path, so each SEGMENT must pass
+ * {@link isRefSafeKey} on its own.
+ */
+export declare function isRefSafePath(path: string): boolean;
+/**
+ * Build the non-editable inline chip (tag) DOM node for a part.
+ *
+ * `renderToggle` is opt-in and defaults OFF: `makeChip` is shared through
+ * {@link paintParts} by every editing surface, including the inline
+ * `ExpressionInput` (`ExpressionInput.tsx`), which has no handler for the
+ * flip control at all. A painter must not decide who gets an affordance —
+ * only `ExpressionEditorModal` (the one surface with a click delegate for
+ * `[data-render-toggle]`) passes `true`. Round 2 fix for F-2: before this,
+ * every `var`/`render` chip everywhere painted the toggle unconditionally,
+ * so it leaked into every inline expression field in studio as a dead,
+ * screen-reader-announced control.
+ */
+export declare function makeChip(doc: Document, part: ExprPart, { renderToggle }?: {
+    renderToggle?: boolean;
+}): HTMLElement;
+/**
+ * Decode a chip element back into the part it represents — the one and only
+ * decode in the file. Hoisted out of {@link readParts}'s inline `var` /
+ * `secret` / `render` (`data-ref`) and `expr` (`data-expr` JSON) arms so
+ * {@link chipToText} can reuse the exact same logic rather than re-deriving
+ * it; `readParts` itself now calls this instead of carrying its own copy.
+ * `null` for any element that isn't a chip (`data-kind` absent or not one of
+ * the four kinds) — the caller falls through to its other element handling.
+ */
+export declare function chipToPart(el: HTMLElement): ExprPart | null;
+/**
+ * Reconstruct parts from an editor's DOM (the source of truth while editing).
+ *
+ * The walk is **recursive**: a native Enter wraps the caret's line in a `<div>`
+ * (or drops a `<br>`), and anything nested inside it — chips included — must
+ * survive. Reading `textContent` at that point would flatten a chip to its
+ * label and silently destroy the reference it carries, so every unrecognised
+ * element is descended into instead. `<br>` and block children map to a literal
+ * `"\n"`; `pushText` coalesces those into the surrounding text part.
+ *
+ * One `<br>` is deliberately NOT a newline: a FILLER one, closing its block —
+ * see `walk` and {@link ensureFillerBreak}.
+ */
+export declare function readParts(root: HTMLElement): ExprPart[];
+/**
+ * Give a line break at the very END of the caret's line somewhere to render.
+ *
+ * A `"\n"` that is the last thing in a `white-space: pre-wrap` block paints
+ * nothing, and the caret cannot land past it — the author presses Enter, sees no
+ * break, and their next keystroke lands on the *previous* line (observed in
+ * Chromium; see `artifacts/T3.1.2-browser-check.sh`). Browsers solve this for
+ * their own line breaks with a FILLER `<br>` as the block's last child, so ours
+ * uses the same device. `readParts` skips exactly that node — the two are one
+ * fact, kept in one file.
+ */
+export declare function ensureFillerBreak(editor: HTMLElement): void;
+/**
+ * Paint an editor's DOM from parts (text nodes + chips).
+ *
+ * `opts` passes straight through to {@link makeChip} — `renderToggle`
+ * defaults off, so a caller that never opts in (`ExpressionInput.tsx`) paints
+ * no toggle at all, and only `ExpressionEditorModal` turns it on.
+ */
+export declare function paintParts(el: HTMLElement, parts: ExprPart[], opts?: {
+    renderToggle?: boolean;
+}): void;
+/**
+ * Put the caret at the end of the editor.
+ *
+ * Deliberately NOT special-cased for a trailing filler `<br>`: a caret placed
+ * past the filler is a position Chromium normalises straight back into the
+ * content, so the next character still lands before the filler. That was
+ * measured, not assumed — a version of this function that skipped the filler
+ * explicitly could not be distinguished from this one by any probe in
+ * `T3.1.2-browser-check.sh`, including §K, which exists to try. What DOES have
+ * to respect the filler is the node insertion itself (see `insertNodeAtCaret`).
+ */
+export declare function placeCaretAtEnd(el: HTMLElement): void;
+/** Insert a node at the caret (or at the end if the caret isn't in the editor). */
+export declare function insertNodeAtCaret(editor: HTMLElement, node: Node): void;
+/**
+ * D-3 (binding): promote a just-closed `{{ … }}` marker to a chip at the
+ * keystroke that closes it — the caret-safe surgery an `onInput` handler can
+ * call directly, with NO `paintGen` bump (see the warning at the top of
+ * `ExpressionEditorModal.tsx` and `G-typing` in `expr-template-guards.test.cjs`:
+ * a repaint here resets the caret and reorders every subsequent keystroke).
+ *
+ * Returns `false`, doing nothing, unless ALL of:
+ *   - the selection is collapsed inside a text node `editor` contains;
+ *   - the two characters immediately before the caret are `}}`;
+ *   - there is a `{{` earlier in THAT SAME text node (a marker interrupted by
+ *     a chip — i.e. split across text nodes — is not a marker, deliberately);
+ *   - `parseRootAnchoredTemplate` of the text from that `{{` to the caret
+ *     parses to exactly ONE part that is not `kind: "text"` (an unrooted
+ *     marker, or one that isn't a single complete part, stays literal).
+ *
+ * On success: deletes exactly that span and inserts the chip in its place —
+ * the same `Range` surgery `insertNodeAtCaret` performs, mirrored rather than
+ * reused because the span here is a slice of an EXISTING text node, not the
+ * live selection — then collapses the caret just after the chip.
+ */
+export declare function promoteCompletedMarkerAtCaret(editor: HTMLElement, opts?: {
+    renderToggle?: boolean;
+}): boolean;
+/**
+ * D-3: the reverse of {@link promoteCompletedMarkerAtCaret} — a chip back to
+ * its editable `{{ … }}` text, in place. `chipToPart` is the SAME decode
+ * `readParts` uses, so what comes back is exactly what the chip carries, and
+ * `serializeTemplate` is the SAME serializer the round trip already goes
+ * through everywhere else in this file. `null` for an element that isn't a
+ * chip. The caller collapses the caret at the returned node's end — this
+ * function only performs the DOM swap, mirroring `chip.replaceWith` being the
+ * whole of the "remove" arm (`onClick`'s `[data-x]` handler) in both editors.
+ */
+export declare function chipToText(chip: HTMLElement): Text | null;

package/dist/components/expression-template.d.ts

@@ -0,0 +1,86 @@
+import { parseTemplate, serializeTemplate } from '@w6w/expr';
+import { ExprPart, ExprValue, SecretValue } from '../types.ts';
+/**
+ * `ui`'s view of the one `{{ }}` inline-expression grammar. The parser and the
+ * serializer live in `@w6w/expr` (`core/packages/expr/src/template.ts`) so the
+ * engine and the editor read the SAME grammar rather than two copies that must
+ * agree forever; this module re-exports them and keeps the editor-only helpers
+ * below (`renderResult` masks secrets as `•••` — a preview policy that must not
+ * enter the engine's package).
+ *
+ * Grammar, modes, and the secret fence (D-8) are documented at the definition.
+ *
+ * `parseTemplate` itself builds every `{{ }}` marker unconditionally — it has
+ * no opinion on whether a marker is a W6W expression or a vendor placeholder
+ * (Mailjet's `{{var:name}}`, Metabase's `{{tag}}`, …). {@link
+ * parseRootAnchoredTemplate} below adds that opinion (root-anchored parsing,
+ * CONDUCTOR AMENDMENT 2026-08-14) and is what `valueToParts` and the chip-ify
+ * commit paths call — never `parseTemplate` directly on untrusted text.
+ */
+export { parseTemplate, serializeTemplate };
+/**
+ * Serialize parts to the leanest faithful VALUE: prune empty text, collapse a
+ * lone text segment to a plain string (backward-compat), else an `ExprValue`.
+ * Shared by the inline field and the expression editor modal.
+ */
+export declare function partsToValue(parts: ExprPart[]): ExprValue | string;
+/** Every root name, for tests that pin the derived set without reaching into the type. */
+export declare const RUN_SCOPE_ROOT_NAMES: readonly string[];
+/**
+ * Root-anchored parse (CONDUCTOR AMENDMENT 2026-08-14): builds every marker in
+ * `s` via `parseTemplate` (never a second `{{ }}` scanner), then requires:
+ *   - a `var` marker: `hasRefusedChainToken` must be false (a `||`/`??` the
+ *     chain grammar refused — mixed operators, a `secrets.` operand, … — is
+ *     never treated as an ordinary path) AND its first path segment must be a
+ *     `RUN_SCOPE_ROOTS` member;
+ *   - an `expr` marker recognised by `coalesceOperandRefs` as a `||`/`??`
+ *     chain: EVERY operand ref's first path segment must be a
+ *     `RUN_SCOPE_ROOTS` member — a chain is a first-class citizen here, not
+ *     the opaque escape hatch below;
+ *   - any other `expr` marker (`=<jsonlogic>`, or a `{{ }}` chip inserted from
+ *     the rail) or a `secret` marker (`secrets.NAME`): unambiguous by its OWN
+ *     syntax, no separate check.
+ * One unrooted marker/operand reverts the WHOLE string to a single literal
+ * `text` part (byte-identical to the input) — all-or-nothing, because the
+ * grammar has no escape syntax and a mixed string can't half-chip. This is
+ * what keeps `{{ vars.a }}` and `{{ vars.a || "x" }}` chips while Mailjet's
+ * `{{var:name}}`, Mandrill's Handlebars, and Metabase's `{{tag}}` stay literal
+ * text forever (121 spellings surveyed across `packages/apps`, 116 of them
+ * vendor placeholders with no root of their own).
+ */
+export declare function parseRootAnchoredTemplate(s: string): ExprPart[];
+/**
+ * Parse an incoming value into editable parts (+ any sealed secret to display).
+ * The inverse of {@link partsToValue} for the editable forms; a sealed
+ * `SecretValue` has no parts (it's shown as a masked chip, never decrypted).
+ *
+ * The string arm root-anchor-parses (see {@link parseRootAnchoredTemplate}):
+ * a hand-typed, pasted, re-opened, or SDK/MCP-written `"{{ vars.x }}"` now
+ * chip-ifies identically to a rail insertion, while a vendor placeholder like
+ * `"{{name}}"` stays literal text forever — it never had a root to lose.
+ */
+export declare function valueToParts(value: ExprValue | string | SecretValue | undefined): {
+    parts: ExprPart[];
+    sealed: SecretValue | null;
+};
+/**
+ * Render parts to their preview text for the expression editor's Result pane:
+ * `text` parts concatenate literally, a `var` part resolves against `samples`
+ * (keyed by full ref) or renders `""` when unresolved — never the raw
+ * `{{ ref }}` template token — and a `secret` part always masks as `•••`.
+ *
+ * A `render` part resolves through the exact SAME flat `samples` lookup as
+ * `var` (A4c) — it does NOT additionally substitute `{{ }}` markers inside the
+ * resolved value. That substitution is the engine's `resolveRenderPart`
+ * (`packages/w6w-workflow/packages/engine/src/expr.ts`, out of scope), which
+ * runs against a real run scope; this design-time preview has no run scope to
+ * substitute against, so it shows the field's raw template text verbatim, same
+ * as `var` would. Without at least the flat-lookup half, the new
+ * insert-as-render action's very first click would leave the Result pane
+ * blank, which reads as broken.
+ *
+ * No client-side evaluator for `expr` parts (see the TODO in
+ * `ExpressionEditorModal.tsx`) — those fall back to their `{{ }}` template
+ * form.
+ */
+export declare function renderResult(parts: ExprPart[], samples: Record<string, string>): string;

package/dist/components/history-scale.d.ts

@@ -0,0 +1,33 @@
+import { HistoryWindow, VendorIncidentBar } from './HistoryTimeline.tsx';
+/**
+ * Minimum visible width for a bar, as a percentage of the window's span. A
+ * point-in-time entry (no `startedAt`) has zero duration and would otherwise
+ * be invisible; a very short span is floored to the same width so it never
+ * shrinks below it either.
+ */
+export declare const MIN_BAR_WIDTH_PCT = 1;
+export interface BarPlacement {
+    /** Left edge, as a percentage of the window's span, clamped to `[0, 100]`. */
+    leftPct: number;
+    /** Width, as a percentage of the window's span. Never below `MIN_BAR_WIDTH_PCT`. */
+    widthPct: number;
+    /** `true` if the bar's start was clamped to the window's left edge. */
+    clippedStart: boolean;
+    /** `true` if the bar's end was clamped to the window's right edge. */
+    clippedEnd: boolean;
+}
+/**
+ * Places one vendor incident bar on the window's `[from T00:00:00Z, to+1 day
+ * T00:00:00Z)` span.
+ *
+ * - A bar's start is `startedAt ?? updatedAt`; with neither present there is
+ *   nothing to place, so this returns `null` (B5).
+ * - Its end is `resolvedAt ?? (startedAt !== undefined ? nowMs : start)` — an
+ *   open incident (has `startedAt`, no `resolvedAt`) therefore runs to
+ *   `nowMs`, and a feed-only entry with no `startedAt` is a point in time,
+ *   not a span (B3).
+ * - A bar wholly outside the window (ends before it starts, or starts at or
+ *   after it ends) returns `null` (B4). One overlapping an edge is clamped
+ *   into the window, with `clippedStart`/`clippedEnd` set accordingly.
+ */
+export declare function placeIncidentBar(window: HistoryWindow, bar: VendorIncidentBar, nowMs: number): BarPlacement | null;

package/dist/components/icons.d.ts

@@ -0,0 +1,41 @@
+import { ReactNode } from 'react';
+/**
+ * Kebab-case, named for what the glyph DEPICTS or for its conventional meaning —
+ * never for the studio component that happened to draw it, so a caller asks for
+ * `icon="history"` rather than `icon="history-icon-tsx"`.
+ */
+export type IconName = "edit" | "edit-2" | "delete" | "copy" | "check" | "close" | "history" | "info" | "clock" | "json" | "code" | "sync" | "cloud-download" | "eye" | "play" | "stop" | "warning" | "file-text" | "settings" | "github" | "user" | "users" | "logout" | "id-card" | "dashboard" | "pulse" | "workflow" | "globe" | "lambda" | "sliders" | "file" | "plug" | "grid" | "folder" | "git-branch" | "coin" | "building" | "server" | "price-tag" | "lang-node" | "terminal" | "lang-python" | "lang-curl" | "sun" | "moon" | "circle-half" | "layout" | "run" | "trash" | "maximize" | "form" | "braces" | "settings-2";
+/**
+ * Which attributes the shared `<svg>` root carries — i.e. how the glyph is
+ * painted. The sources are not uniform, and forcing them into one shape would
+ * change how they render:
+ *
+ *   - `fill`   — Material-style: a single `fill="currentColor"` path, no stroke.
+ *   - `stroke` — Feather-style outline: `fill="none"`, `stroke="currentColor"`,
+ *                round caps/joins, plus the source's own `strokeWidth`.
+ *   - `mixed`  — the glyph paints each element itself (the language marks: a
+ *                stroked outline next to filled dots, and `lang-python`'s mask),
+ *                so the root carries NO paint attribute at all, exactly as its
+ *                source did. Adding a root stroke here would fatten every dot;
+ *                `layout`'s single path paints nothing either, its colour coming
+ *                from the surrounding control button — again as its source did.
+ */
+export type IconVariant = "fill" | "stroke" | "mixed";
+/** One glyph: its source `<svg>`'s viewBox, its paint variant, and its children. */
+interface IconDef {
+    viewBox: string;
+    variant: IconVariant;
+    /** `stroke` variants only — the source's own weight (2 for Feather, 1.75 for the rail glyphs). */
+    strokeWidth?: number;
+    /** The source `<svg>`'s children, verbatim. */
+    body: ReactNode;
+}
+/** The set. Entries are grouped for readability; `iconNames` is this object's own order. */
+export declare const icons: Record<IconName, IconDef>;
+/**
+ * Every name in the set, in the object's curated order — what the gallery story
+ * renders and what `Icon.test.ts` walks. Derived from `icons` rather than
+ * repeated, so it cannot drift from what `Icon` can actually draw.
+ */
+export declare const iconNames: readonly IconName[];
+export {};

package/dist/components/resolved-clip.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Clipping for ONE resolved value's display text (Test tab, read-only rows).
+ *
+ * A resolved row is a SUMMARY of what the run will be sent, not a viewer for
+ * it. A value that resolves from a document (`documents.*.body`) or a rendered
+ * template is routinely tens of kilobytes of HTML, and pasting all of it inline
+ * pushed the rest of the params — and the run's own result — off the screen
+ * (human report, 2026-09-01). So a long value is clipped here and offered
+ * behind a toggle; the complete value is always one click away in the `<>`
+ * code view above, which is COMPLETE over every visible param by construction
+ * (`resolved-json.ts`, D-2) and so must never be clipped itself.
+ *
+ * Plain `.ts`, no React — same pure-module-beside-the-component precedent
+ * `history-scale.ts` sets for `HistoryTimeline.tsx`, so the rule is testable
+ * without a JSX transpile.
+ */
+/**
+ * Characters shown before a value is clipped. Sized to a few lines at the
+ * row's font — enough to recognize WHICH value resolved (the opening of an
+ * HTML document, a subject line, a URL) without becoming the page.
+ */
+export declare const RESOLVED_VALUE_CLIP = 220;
+/** A clip decision: the text to render, and whether anything was withheld. */
+export interface ClippedValue {
+    /** What to show when collapsed — never longer than {@link RESOLVED_VALUE_CLIP}. */
+    text: string;
+    /** True when `text` is shorter than the input, i.e. a toggle is warranted. */
+    clipped: boolean;
+    /** The full value's length, for the toggle's own label. */
+    length: number;
+}
+/**
+ * Clip `text` for the collapsed row. At or under the budget the input is
+ * returned byte-identically and `clipped` is false — a short value must never
+ * grow a toggle, an ellipsis, or a trailing-whitespace trim it didn't ask for.
+ *
+ * Over the budget, the cut is a plain `slice` at the boundary with trailing
+ * whitespace trimmed (so an ellipsis never floats a space away from the text).
+ * No word-boundary search: these values are markup and JSON as often as prose,
+ * where "the last space" is not a meaningful place to stop.
+ */
+export declare function clipResolvedValue(text: string): ClippedValue;