@opetope/devtools 0.1.0

package/dist/react/inspector-view.d.ts

@@ -0,0 +1,29 @@
+/**
+ * The inspector of `docs/devtools.md` §4: axis tags, key/value grid, "why this state", blockers, owned
+ * nodes and the last causal chain, over a scrolling body with a pinned action footer.
+ *
+ * Every sentence here is composed from the typed facts of `InspectorProjection`. The panel decides wording; it never
+ * receives prose, parses an error, or infers a state from a colour (§2).
+ */
+import type { ReactElement, ReactNode } from 'react';
+import type { InspectorProjection } from '../inspector.js';
+import type { DiagnosticConditionId, DiagnosticNodeId } from '../protocol.js';
+type InspectorViewProps = Readonly<{
+    /** The last outcome of an action, shown next to the buttons so an export or a copy is visibly not a no-op. */
+    actionStatus?: string;
+    /** Resolves the atom a cause names to the declaration id the author wrote (D200). */
+    conditionLabelOf: ConditionLabel;
+    /** The control slot of §5, when a host passed a write port. Nothing at all otherwise. */
+    control: ReactNode;
+    /** Resolves a causal step's node ref to its label. Labels live on nodes, not repeated on every step. */
+    labelOf: (id: DiagnosticNodeId) => string;
+    onCopyId: (id: DiagnosticNodeId) => void;
+    onExport: () => void;
+    onSelect: (id: DiagnosticNodeId) => void;
+    onShowInTimeline: () => void;
+    projection: InspectorProjection;
+}>;
+/** How a view turns the atom a condition is addressed by into the name a reader recognises. */
+type ConditionLabel = (id: DiagnosticConditionId) => string;
+declare function InspectorView({ actionStatus, conditionLabelOf, control, labelOf, onCopyId, onExport, onSelect, onShowInTimeline, projection, }: InspectorViewProps): ReactElement;
+export { InspectorView };

package/dist/react/label.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Fitting a node's name into a card of fixed width without losing the part that tells it apart (§4.3).
+ *
+ * A graph id is a path, and the tail is what distinguishes siblings: `sample.dev-mode` and `sample.dev-mode.settings`
+ * differ only after the last dot, which is exactly what a CSS ellipsis on the right throws away first. So the panel
+ * shortens on purpose instead of letting the box do it — relative to the selection where that is possible, and from
+ * the middle where it is not — and hands the full id to `title`, so hovering always answers what the card is.
+ *
+ * The budgets are estimates, not measurements: a card is 188 px wide with 12 px of padding either side and a glyph
+ * ahead of the text, which leaves roughly 148 px, and the panel's font runs about 6.3 px per character at 12 px and
+ * 7.3 px at 14 px. CSS truncation stays as the backstop for the cases arithmetic gets wrong.
+ */
+/**
+ * A neighbour written relative to the selected node: `sample.dev-mode.settings` beside `sample.dev-mode` becomes
+ * `…settings`. Only a true prefix counts, and only at a dot, so `sample.dev-modes` is left alone.
+ */
+declare function relativeTo(label: string, selected: string | undefined): string;
+/**
+ * Middle truncation that keeps the last segment whole: `features.sessions.confirmAction` becomes
+ * `features….confirmAction` rather than `features.sessions.conf…`. When the last segment alone does not fit, the
+ * cut moves into it from the left, because its end is still the most distinguishing thing left.
+ */
+declare function fitLabel(text: string, budget: number): string;
+/** What a neighbour card draws: relative to the selection first, and cut from the middle only if it still overflows. */
+declare function neighbourLabel(label: string, selected: string | undefined): string;
+/** The selected card carries its own name in a larger type, so it has fewer characters to spend and no relative form. */
+declare function selectedLabel(label: string): string;
+export { fitLabel, neighbourLabel, relativeTo, selectedLabel };

package/dist/react/lazy-module.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Loads a surface only when the panel actually needs it (`docs/devtools.md` §6).
+ *
+ * Four surfaces earn a chunk of their own: the control plane, which a host without a write port must not carry at
+ * all; the legend, collapsed until a developer asks what a shape means; the exporter, behind the click that uses it;
+ * and the timeline, which arrives with its tab. They are the same shape — a module the panel wants at a moment it
+ * can name — so they share one hook rather than one loader each.
+ *
+ * The loader is compared by identity, so it has to be a module-level constant; a loader built during render would
+ * refetch on every commit. The cache is per page, because a second panel in the same document should not fetch a
+ * module the first one already has.
+ */
+import type * as ControlUi from './control-ui.js';
+import type * as ExportRun from './export-run.js';
+import type * as LegendUi from './legend.js';
+import type * as TimelineUi from './timeline-view.js';
+type Loader<Module> = () => Promise<Module>;
+/**
+ * What the panel knows about a surface right now. A fetch can fail — a chunk can be missing, a deploy can be half
+ * replaced, a network can refuse — and a failure that only rejects a promise leaves the panel showing nothing while
+ * telling nobody. So the state is explicit, and a failed surface offers the one action that can help: try again.
+ */
+type LazyModule<Module> = Readonly<{
+    error: unknown;
+    module: Module | undefined;
+    retry: () => void;
+}>;
+declare function useLazyModule<Module>(load: Loader<Module> | undefined): LazyModule<Module>;
+/** The write port's surface (§5): fetched when a host passes a control session, and never otherwise. */
+declare const loadControlUi: () => Promise<typeof ControlUi>;
+/** The legend (§4.6): fetched the first time it is opened, which for most sessions is never. */
+declare const loadLegend: () => Promise<typeof LegendUi>;
+/** The exporter (§2.6): fetched by the click, because a session that never exports never needs it. */
+declare const loadExportRun: () => Promise<typeof ExportRun>;
+/** The timeline (§4.1): a whole tab, and a session that watches the graph never opens it. */
+declare const loadTimeline: () => Promise<typeof TimelineUi>;
+export { loadControlUi, loadExportRun, loadLegend, loadTimeline, useLazyModule };
+export type { LazyModule };

package/dist/react/legend-locale.d.ts

@@ -0,0 +1,23 @@
+/**
+ * The legend's own dictionary, kept out of the panel's (§4.6).
+ *
+ * The legend is collapsed until a developer asks what a shape means, so its words travel with its code rather than
+ * with every panel that never opens it. The discipline is the panel's: English is the source, the Russian record is
+ * typed against it, and the protocol vocabulary the legend explains is not translated in either.
+ */
+import type { DevtoolsLocale } from './locale.js';
+declare const en: {
+    legendBadgeDesired: string;
+    legendBadgeHealth: string;
+    legendBadgeLifecycle: string;
+    legendBadges: string;
+    legendEdgeContribution: string;
+    legendEdgeDependency: string;
+    legendEdgeOwnership: string;
+    legendEdges: string;
+    legendEdgeWeak: string;
+    legendLifecycle: string;
+    legendWeakCovers: string;
+};
+declare function legendStringsFor(locale: DevtoolsLocale): typeof en;
+export { legendStringsFor };

package/dist/react/legend.d.ts

@@ -0,0 +1,10 @@
+/**
+ * One legend for the whole panel, per the owner's request: the state glyphs, the three kinds of edge and the badges,
+ * in one collapsible place instead of two partial legends pinned to a tree and a canvas.
+ *
+ * It is collapsed by default. A legend that is always open spends the space a graph needs; a legend that cannot be
+ * found is worse than none — so the header carries a button, and the button says whether it is open.
+ */
+import type { ReactElement } from 'react';
+declare function Legend(): ReactElement;
+export { Legend };

package/dist/react/locale-context.d.ts

@@ -0,0 +1,17 @@
+/**
+ * The current dictionary, passed down by context rather than threaded through every component.
+ *
+ * There is no provider-less fallback to English: a component that reads strings outside the panel is a bug, and a
+ * silent default would hide it until a Russian panel showed one English button.
+ */
+import type { ReactElement, ReactNode } from 'react';
+import type { DevtoolsLocale, Strings } from './locale.js';
+type LocaleProviderProps = Readonly<{
+    children: ReactNode;
+    locale: DevtoolsLocale;
+}>;
+declare function LocaleProvider({ children, locale }: LocaleProviderProps): ReactElement;
+declare function useStrings(): Strings;
+/** For the lazily loaded surfaces, which carry their own dictionary rather than adding words to the panel's. */
+declare function useLocale(): DevtoolsLocale;
+export { LocaleProvider, useLocale, useStrings };

package/dist/react/locale.d.ts

@@ -0,0 +1,115 @@
+/**
+ * Two languages for the panel chrome, per the owner's request: English and Russian, defaulting to the browser and
+ * switchable in the header.
+ *
+ * What is translated is the prose the panel writes: buttons, headings, empty states, explanations. What is never
+ * translated is the vocabulary of the protocol — `Feature`, `FeatureInstance`, `Condition`, `declared`,
+ * `hard-import`, `quarantined`, `drain` — because those are identifiers a developer greps for, matches against
+ * `spec.md` §3 and reads back out of a snapshot. A translated `hard-import` would be a different word for the same
+ * edge, which is exactly what a diagnostic tool must not invent.
+ *
+ * The English dictionary is the source of truth: `Strings` is derived from it, so a missing or extra Russian key is a
+ * type error rather than a silent English word in a Russian panel.
+ */
+type DevtoolsLocale = 'en' | 'ru';
+declare const en: {
+    activity: string;
+    activityCall: (state: string) => string;
+    activityCoverage: string;
+    activityEmpty: string;
+    activityOwner: string;
+    activityTruncated: string;
+    axisDesired: string;
+    axisHealth: string;
+    axisLifecycle: string;
+    canvasHidden: (count: number) => string;
+    causeGatedBy: string;
+    causeOpenUnder: string;
+    close: string;
+    controlPlaneOff: string;
+    controlPlaneRequiresAuthority: string;
+    copyId: string;
+    copyIdDone: string;
+    copyIdFailed: string;
+    dependenciesSatisfied: (total: number) => string;
+    dependenciesUnsatisfied: (unmet: number, total: number) => string;
+    dependsOn: string;
+    dependsOnCount: (unmet: number, total: number) => string;
+    dependsOnNothing: string;
+    edgeFilters: string;
+    emptySelection: string;
+    exportSnapshot: string;
+    failureSentence: (subject: string, phase: string, code: string) => string;
+    fit: string;
+    instanceCurrent: (generation: number) => string;
+    instanceWithPrevious: (generation: number, previous: number) => string;
+    keyInstance: string;
+    keyKind: string;
+    keyLifetime: string;
+    keyOverride: string;
+    keyProvenance: string;
+    keyState: string;
+    language: string;
+    lastCausalChain: string;
+    legend: string;
+    live: string;
+    matchedFailureCode: string;
+    matchedFailureSubject: string;
+    matchedId: string;
+    matchedKind: string;
+    matchedProvenance: string;
+    neighbourhood: string;
+    noChain: string;
+    noSearchHit: string;
+    noSelection: string;
+    noStateCause: string;
+    ownedCount: (count: number, kind: string) => string;
+    owns: string;
+    ownsNothing: string;
+    panelDetails: string;
+    panelTitle: string;
+    planBadge: (session: string, fingerprint: string) => string;
+    presetConditions: string;
+    presetExtensionPoints: string;
+    presetImportsAndPorts: string;
+    presetOwnership: string;
+    presets: string;
+    reducerPaint: (reducer: string, paint: string) => string;
+    searchLabel: string;
+    searchResults: string;
+    selectedInstanceTag: (generation: number) => string;
+    selectionPath: string;
+    showInTimeline: string;
+    stateDeclared: string;
+    stateFailed: string;
+    stateOpening: string;
+    stateQuarantined: string;
+    stateReady: string;
+    stateRetiring: string;
+    stateWaiting: string;
+    statusDropped: (dropped: number) => string;
+    statusFrame: (sequence: number, revision: number) => string;
+    surfaceFailed: string;
+    surfaceRetry: string;
+    tabGraph: string;
+    tabTimeline: string;
+    themeDefaults: string;
+    themeHost: (count: number) => string;
+    /**
+     * The word stays `when`, in both languages: it is the name of the `defineFeature` option a developer greps for,
+     * not prose about it. The key exists so the row has one place to read it from, not so it can be translated.
+     */
+    treeGroupPrefix: string;
+    treeLabel: string;
+    treeSummary: (features: number, groups: number) => string;
+    whyThisState: string;
+    zoomIn: string;
+    zoomOut: string;
+};
+type Strings = typeof en;
+declare const locales: readonly DevtoolsLocale[];
+/** The browser's preference, narrowed to what the panel speaks. Anything else falls back to English. */
+declare function detectLocale(languages?: readonly string[]): DevtoolsLocale;
+declare function stringsFor(locale: DevtoolsLocale): Strings;
+export { detectLocale, locales, stringsFor };
+export type { DevtoolsLocale, Strings };

package/dist/react/main-column.d.ts

@@ -0,0 +1,22 @@
+/**
+ * The middle column: breadcrumbs over the canvas, with zoom pinned to its corner.
+ *
+ * There is no `Graph`/`List` switch (§4.4). The list is what a viewport narrower than 1100 px gets instead of a
+ * canvas it cannot draw legibly, not a second way to read a wide one: a manual switch would have been a second
+ * layout, a second set of tests and a second set of dictionary strings for a view nobody asked for.
+ */
+import type { ReactElement, ReactNode } from 'react';
+import type { ExtensionPointsProjection } from '../extension-points.js';
+import type { InspectorProjection } from '../inspector.js';
+import type { DiagnosticEdgeKind, DiagnosticNodeId } from '../protocol.js';
+type MainColumnProps = Readonly<{
+    /** The control slot of §5, when a host passed a write port. Empty markup otherwise, and absent from the bundle. */
+    control: ReactNode;
+    edgeKinds: ReadonlySet<DiagnosticEdgeKind>;
+    /** Present only under the `Extension points` preset, and then it is what the canvas draws instead (§4.2). */
+    extensionPoints: ExtensionPointsProjection | undefined;
+    onSelect: (id: DiagnosticNodeId) => void;
+    projection: InspectorProjection | undefined;
+}>;
+declare function MainColumn({ control, edgeKinds, extensionPoints, onSelect, projection }: MainColumnProps): ReactElement;
+export { MainColumn };

package/dist/react/panel-header.d.ts

@@ -0,0 +1,20 @@
+/** Header of `docs/devtools.md` §4.1: identity badges, the two tabs, search and window actions. */
+import type { ReactElement, RefObject } from 'react';
+import type { DevtoolsStoreStatus } from '../graph-store.js';
+import type { DevtoolsTab } from './edge-filter.js';
+import type { DevtoolsLocale } from './locale.js';
+type PanelHeaderProps = Readonly<{
+    legendOpen: boolean;
+    locale: DevtoolsLocale;
+    onClose: (() => void) | undefined;
+    onLegend: () => void;
+    onLocale: (locale: DevtoolsLocale) => void;
+    onQuery: (query: string) => void;
+    onTab: (tab: DevtoolsTab) => void;
+    query: string;
+    searchRef: RefObject<HTMLInputElement | null>;
+    status: DevtoolsStoreStatus;
+    tab: DevtoolsTab;
+}>;
+declare function PanelHeader({ legendOpen, locale, onClose, onLegend, onLocale, onQuery, onTab, query, searchRef, status, tab, }: PanelHeaderProps): ReactElement;
+export { PanelHeader };

package/dist/react/panel-mode.d.ts

@@ -0,0 +1,3 @@
+/** §8: what this build actually contains. `off` never reaches the panel — it has no chunk to load. */
+type DevtoolsMode = 'control' | 'inspect';
+export type { DevtoolsMode };

package/dist/react/panel-status.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Status bar of `docs/devtools.md` §4.5: the panel's own health, not the application's. It answers "can I trust what
+ * I am looking at" — the cursor it has reached, the frames it never saw, and that it is live.
+ *
+ * The rest describes the panel rather than the application, so it lives behind `⋯`: its own cost against the §6
+ * budgets, where the theme came from, the schema revision, and whether this build can control anything at all. A
+ * developer who wants those numbers asks for them; a developer watching the graph should not have to read past them.
+ */
+import type { ReactElement } from 'react';
+import type { DevtoolsStoreStatus } from '../graph-store.js';
+import type { DevtoolsMode } from './panel-mode.js';
+type PanelStatusProps = Readonly<{
+    mappedTokens: number;
+    mode: DevtoolsMode;
+    renderCost: number;
+    status: DevtoolsStoreStatus;
+}>;
+declare function PanelStatus({ mappedTokens, mode, renderCost, status }: PanelStatusProps): ReactElement;
+export { PanelStatus };

package/dist/react/panel.d.ts

@@ -0,0 +1,41 @@
+/**
+ * The bottom-drawer shell of `docs/devtools.md` §4.1: header with the two tabs and search, the edge filter row, a
+ * tree / graph / inspector body, and a status bar carrying the panel's own health.
+ *
+ * The selection and the filter are independent state on purpose (§4.3): switching a preset never moves the
+ * selection, and selecting never resets the preset. That is what makes the filter a question about one node rather
+ * than a mode the developer has to leave.
+ *
+ * The panel reads, and writes only where a host handed it a write port and the selection holds something that port
+ * can address (§5). Without both it never fetches the surface that would write, so it is read-only by construction
+ * rather than by a disabled button; the status bar says which of the two it is.
+ */
+import type { ReactElement } from 'react';
+import type { RuntimeControlSession } from '../control.js';
+import type { DevtoolsExport } from '../export-snapshot.js';
+import type { DevtoolsGraphStore } from '../graph-store.js';
+import type { ExportHost } from './export-delivery.js';
+import type { DevtoolsLocale } from './locale.js';
+import type { DevtoolsMode } from './panel-mode.js';
+import type { DevtoolsTheme } from './theme.js';
+type DevtoolsPanelProps = Readonly<{
+    /**
+     * The write port, when the host has one to give. Without it the panel is read-only and never even fetches the
+     * chunk that would write: the control surface is loaded by its presence, not by a flag (§5).
+     */
+    control?: RuntimeControlSession;
+    /** Overrides feature detection for the export destinations. Tests and non-browser hosts pass their own. */
+    exportHost?: ExportHost;
+    /** Initial language. Defaults to the browser's preference; the header switch overrides it either way. */
+    locale?: DevtoolsLocale;
+    mode?: DevtoolsMode;
+    onClose?: () => void;
+    onExport?: (payload: DevtoolsExport) => void;
+    store: DevtoolsGraphStore;
+    theme?: DevtoolsTheme;
+}>;
+/** Owns the language so the provider can sit above everything that reads a string. */
+declare function DevtoolsPanel(props: DevtoolsPanelProps): ReactElement;
+export { DevtoolsPanel };
+export type { DevtoolsMode } from './panel-mode.js';
+export type { DevtoolsPanelProps };

package/dist/react/search-results.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Search replaces the tree while a query is active. §2 fixes what is searchable, and the second column explains a
+ * surprising match rather than restating the obvious one.
+ *
+ * It used to print the matched field verbatim, which meant every ordinary hit read `label` — a protocol word the
+ * developer never asked about, sitting where a useful fact belonged. A hit matched on the node's own name now shows
+ * what kind of node it is; only a match found somewhere else says where.
+ */
+import type { ReactElement } from 'react';
+import type { DiagnosticNodeId } from '../protocol.js';
+import type { SearchHit } from '../search.js';
+type SearchResultsProps = Readonly<{
+    hits: readonly SearchHit[];
+    onSelect: (id: DiagnosticNodeId) => void;
+    selectedId: DiagnosticNodeId | undefined;
+}>;
+declare function SearchResults({ hits, onSelect, selectedId }: SearchResultsProps): ReactElement;
+export { SearchResults };

package/dist/react/selection.d.ts

@@ -0,0 +1,15 @@
+/**
+ * What the panel opens on.
+ *
+ * A developer opens a runtime inspector because something is not ready, so the initial selection is the first feature
+ * that is not, and every lifetime owner holding a troubled feature starts expanded. On a healthy application it falls
+ * back to the first feature of the first owner.
+ */
+import type { DevtoolsGraphStore } from '../graph-store.js';
+import type { DiagnosticNodeId } from '../protocol.js';
+type InitialSelection = Readonly<{
+    expanded: ReadonlySet<DiagnosticNodeId>;
+    selectedId: DiagnosticNodeId | undefined;
+}>;
+declare function initialSelection(store: DevtoolsGraphStore): InitialSelection;
+export { initialSelection };

package/dist/react/styles.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The panel's stylesheet, injected once per document. Values follow the anatomy of `docs/devtools.md` §4 and the
+ * type ramp it fixes; every colour is a variable so a host mapping in config is the only theming mechanism.
+ *
+ * Layout is flex and grid with `gap` throughout — margin-based spacing is not used — and the inspector scrolls with
+ * its action footer pinned.
+ */
+declare const stylesheet = "\n.odt {\n  --odt-canvas: #0e0f14;\n  --odt-surface: #17191f;\n  --odt-surface-2: #292c34;\n  --odt-text: rgba(246, 247, 255, 1);\n  --odt-text-muted: rgba(246, 247, 255, 0.5);\n  --odt-line: rgba(246, 247, 255, 0.06);\n  --odt-line-strong: rgba(246, 247, 255, 0.25);\n  --odt-control: rgba(246, 247, 255, 0.08);\n  --odt-accent: #4763f0;\n  --odt-accent-text: #5364ff;\n  --odt-accent-surface: rgba(71, 99, 240, 0.15);\n  --odt-ok: rgba(0, 185, 122, 1);\n  --odt-ok-surface: rgba(0, 159, 112, 0.15);\n  --odt-warn: rgba(231, 200, 42, 1);\n  --odt-warn-surface: rgba(255, 204, 74, 0.15);\n  --odt-bad: rgba(254, 85, 100, 1);\n  --odt-bad-surface: rgba(241, 79, 93, 0.15);\n  --odt-radius: 8px;\n  --odt-font: system-ui, -apple-system, sans-serif;\n\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  height: 100%;\n  min-height: 0;\n  background: var(--odt-surface);\n  border-top: 1px solid var(--odt-line);\n  color: var(--odt-text);\n  font-family: var(--odt-font);\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 1.142;\n  -webkit-font-smoothing: antialiased;\n}\n.odt *, .odt *::before, .odt *::after { box-sizing: border-box; }\n.odt button { appearance: none; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }\n.odt input { appearance: none; border: 0; background: none; color: inherit; font: inherit; }\n.odt :focus-visible { outline: 2px solid var(--odt-accent-text); outline-offset: 1px; }\n.odt-mono { font-variant-numeric: lining-nums tabular-nums; }\n.odt-sec { font-size: 10px; line-height: 1.6; text-transform: uppercase; color: var(--odt-text-muted); }\n.odt-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n\n.odt-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  height: 48px;\n  flex-shrink: 0;\n  padding: 0 12px 0 16px;\n  border-bottom: 1px solid var(--odt-line);\n}\n.odt-header-group { display: flex; align-items: center; gap: 12px; min-width: 0; }\n.odt-tabs { display: flex; align-items: stretch; gap: 4px; height: 48px; }\n.odt-tab {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 40px;\n  padding: 0 12px;\n  color: var(--odt-text-muted);\n  white-space: nowrap;\n}\n.odt-tab[aria-selected='true'] { color: var(--odt-text); box-shadow: inset 0 -1px 0 var(--odt-text); }\n\n.odt-filters {\n  display: flex;\n  align-items: center;\n  gap: 8px 16px;\n  flex-wrap: wrap;\n  flex-shrink: 0;\n  padding: 6px 16px;\n  border-bottom: 1px solid var(--odt-line);\n}\n.odt-presets { display: flex; align-items: center; gap: 2px; padding: 2px; border-radius: 1000px; background: var(--odt-control); }\n.odt-preset {\n  padding: 3px 12px;\n  border-radius: 50px;\n  font-size: 12px;\n  line-height: 1.333;\n  color: var(--odt-text-muted);\n  white-space: nowrap;\n}\n.odt-preset[aria-pressed='true'] { background: var(--odt-surface); color: var(--odt-text); }\n.odt-chips { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; min-width: 0; }\n.odt-chip {\n  padding: 2px 8px;\n  border: 1px solid var(--odt-line);\n  border-radius: 1000px;\n  font-size: 11px;\n  line-height: 1.45;\n  color: var(--odt-text-muted);\n  white-space: nowrap;\n}\n.odt-chip[aria-checked='true'] {\n  border-color: var(--odt-accent-text);\n  background: var(--odt-accent-surface);\n  color: var(--odt-accent-text);\n}\n\n.odt-tag {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  min-height: 16px;\n  padding: 2px 4px;\n  border-radius: 4px;\n  font-size: 10px;\n  line-height: 1.6;\n  text-transform: uppercase;\n  white-space: nowrap;\n}\n.odt-tag-ok { background: var(--odt-ok-surface); color: var(--odt-ok); }\n.odt-tag-warn { background: var(--odt-warn-surface); color: var(--odt-warn); }\n.odt-tag-bad { background: var(--odt-bad-surface); color: var(--odt-bad); }\n.odt-tag-mute { background: var(--odt-line); color: var(--odt-text-muted); }\n/* A tag that must give way rather than push its row label out: it clips itself and keeps the rest in the title. */\n.odt-tag-clip { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }\n.odt-tag-accent { background: var(--odt-accent-surface); color: var(--odt-accent-text); }\n\n.odt-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  height: 32px;\n  padding: 0 12px;\n  border-radius: var(--odt-radius);\n  background: var(--odt-control);\n  white-space: nowrap;\n}\n.odt-btn-small { height: 28px; font-size: 12px; }\n.odt-btn-icon { width: 32px; padding: 0; }\n.odt-btn-quiet { background: none; color: var(--odt-text-muted); }\n.odt-btn:disabled { background: rgba(246, 247, 255, 0.04); color: rgba(246, 247, 255, 0.25); cursor: default; }\n\n.odt-search {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 300px;\n  max-width: 40vw;\n  height: 32px;\n  padding: 0 12px;\n  border: 1px solid var(--odt-line);\n  border-radius: var(--odt-radius);\n  background: rgba(246, 247, 255, 0.04);\n  color: var(--odt-text-muted);\n}\n.odt-search input { width: 100%; min-width: 0; color: var(--odt-text); }\n.odt-search input::placeholder { color: var(--odt-text-muted); }\n\n.odt-body { display: grid; grid-template-columns: 320px minmax(0, 1fr) 400px; flex-grow: 1; min-height: 0; }\n\n.odt-tree {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  padding: 8px;\n  border-right: 1px solid var(--odt-line);\n  overflow-y: auto;\n}\n.odt-row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  height: 32px;\n  flex-shrink: 0;\n  padding: 0 12px 0 44px;\n  border-radius: var(--odt-radius);\n  text-align: left;\n  width: 100%;\n}\n.odt-row-group { padding: 0 12px 0 20px; font-size: 12px; line-height: 1.333; text-transform: uppercase; color: var(--odt-text-muted); }\n.odt-row-root { padding-left: 12px; }\n.odt-row[aria-selected='true'] { background: var(--odt-control); box-shadow: inset 2px 0 0 var(--odt-accent); }\n.odt-row-label { flex-grow: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n\n.odt-glyph { display: inline-flex; width: 16px; height: 16px; align-items: center; justify-content: center; flex-shrink: 0; }\n.odt-glyph-ok { color: var(--odt-ok); }\n.odt-glyph-warn { color: var(--odt-warn); }\n.odt-glyph-bad { color: var(--odt-bad); }\n.odt-glyph-mute { color: var(--odt-text-muted); }\n\n.odt-main { position: relative; display: flex; flex-direction: column; border-right: 1px solid var(--odt-line); min-width: 0; }\n.odt-main-bar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  height: 40px;\n  flex-shrink: 0;\n  padding: 0 16px;\n  border-bottom: 1px solid var(--odt-line);\n}\n.odt-crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 12px; line-height: 1.333; color: var(--odt-text-muted); }\n.odt-crumb { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }\n.odt-crumb-link { color: inherit; text-decoration: underline; text-decoration-color: var(--odt-line-strong); }\n.odt-crumb-link:hover, .odt-crumb-link:focus-visible { color: var(--odt-text); }\n.odt-crumb-current { color: var(--odt-text); }\n.odt-locale {\n  padding: 2px 6px;\n  border: 1px solid var(--odt-line);\n  border-radius: var(--odt-radius);\n  background: var(--odt-control);\n  font: inherit;\n  font-size: 12px;\n  line-height: 1.333;\n  color: var(--odt-text-muted);\n}\n\n.odt-canvas {\n  position: relative;\n  flex-grow: 1;\n  min-height: 0;\n  /* A lens draws inside itself: the camera is what reaches a node the fit did not cover. */\n  overflow: hidden;\n  touch-action: none;\n  /* A drag moves the camera; it must not also select the labels it crosses. */\n  user-select: none;\n  cursor: grab;\n  background-image: radial-gradient(var(--odt-line) 1px, transparent 1px);\n  background-size: 16px 16px;\n}\n.odt-canvas-panning { cursor: grabbing; }\n.odt-canvas-layer { position: absolute; top: 0; left: 0; transform-origin: 0 0; }\n/* Edges sit under the cards, and the cards are opaque, so a line can never cross a badge. */\n.odt-edges { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }\n.odt-node {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  width: 188px;\n  padding: 8px 12px;\n  z-index: 1;\n  border: 1px solid var(--odt-line);\n  border-radius: var(--odt-radius);\n  background: var(--odt-surface-2);\n  font-size: 12px;\n  line-height: 1.333;\n  text-align: left;\n  color: var(--odt-text);\n}\n.odt-node-contribution { border-style: dashed; }\n.odt-node[aria-current='true'] { gap: 6px; border-color: var(--odt-accent); background: var(--odt-accent-surface); }\n.odt-node-head { display: flex; align-items: center; gap: 6px; min-width: 0; }\n.odt-node-title { font-size: 14px; line-height: 1.142; }\n.odt-node-sub { font-size: 10px; line-height: 1.6; text-transform: uppercase; color: var(--odt-text-muted); }\n.odt-node-detail { font-size: 10px; line-height: 1.6; color: var(--odt-text-muted); }\n.odt-node-tags { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }\n.odt-node-tags > * { flex-shrink: 0; }\n.odt-canvas-hint {\n  position: absolute;\n  right: 16px;\n  top: 12px;\n  max-width: 60%;\n  margin: 0;\n  padding: 4px 8px;\n  border-radius: var(--odt-radius);\n  background: var(--odt-surface-2);\n  font-size: 10px;\n  line-height: 1.6;\n  text-transform: uppercase;\n  color: var(--odt-text-muted);\n}\n.odt-legend-panel {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n  gap: 12px 24px;\n  flex-shrink: 0;\n  max-height: 40%;\n  overflow: auto;\n  padding: 12px 16px;\n  border-bottom: 1px solid var(--odt-line);\n  background: var(--odt-surface);\n}\n.odt-legend-group { display: flex; flex-direction: column; gap: 6px; min-width: 0; }\n.odt-legend-row { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 12px; line-height: 1.333; }\n.odt-legend-name { flex-shrink: 0; color: var(--odt-text); }\n.odt-legend-detail { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--odt-text-muted); }\n.odt-canvas-zoom { position: absolute; right: 16px; bottom: 12px; display: flex; gap: 4px; }\n.odt-edge { fill: none; stroke-width: 1.5; }\n.odt-edge-wait { stroke: var(--odt-line-strong); }\n.odt-edge-own { stroke: var(--odt-accent-text); }\n.odt-edge-contribute { stroke: var(--odt-line-strong); stroke-dasharray: 4 4; }\n.odt-edge-sample { display: inline-block; width: 16px; height: 0; border-top: 1.5px solid var(--odt-line-strong); }\n.odt-edge-sample-accent { border-color: var(--odt-accent-text); }\n.odt-edge-sample-dashed { border-top-style: dashed; }\n\n.odt-list { display: flex; flex-direction: column; gap: 2px; padding: 8px; overflow-y: auto; flex-grow: 1; min-height: 0; }\n.odt-list-row { display: flex; align-items: center; gap: 8px; height: 32px; flex-shrink: 0; padding: 0 12px; border-radius: var(--odt-radius); text-align: left; }\n.odt-list-row[aria-selected='true'] { background: var(--odt-control); }\n.odt-list-meta { font-size: 12px; line-height: 1.333; color: var(--odt-text-muted); white-space: nowrap; }\n\n.odt-inspector-host { display: flex; min-width: 0; min-height: 0; }\n.odt-inspector { display: flex; flex-direction: column; flex-grow: 1; min-width: 0; min-height: 0; }\n.odt-inspector-scroll { display: flex; flex-direction: column; gap: 10px; padding: 12px 16px; overflow-y: auto; flex-grow: 1; min-height: 0; }\n.odt-inspector-head { display: flex; flex-direction: column; gap: 6px; }\n.odt-inspector-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 16px; line-height: 1.25; }\n.odt-axes { display: flex; flex-wrap: wrap; gap: 4px; }\n.odt-kv { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 4px 12px; font-size: 12px; line-height: 1.333; }\n.odt-k { color: var(--odt-text-muted); }\n.odt-v { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.odt-why { display: flex; flex-direction: column; gap: 6px; padding: 8px 12px; border-radius: var(--odt-radius); background: rgba(246, 247, 255, 0.05); }\n.odt-why-text { font-size: 12px; line-height: 1.333; }\n.odt-why-ref { color: var(--odt-accent-text); }\n.odt-section { display: flex; flex-direction: column; gap: 6px; }\n.odt-section-rows { display: flex; flex-direction: column; gap: 4px; font-size: 12px; line-height: 1.333; }\n.odt-section-row { display: flex; align-items: center; gap: 8px; text-align: left; width: 100%; }\n.odt-section-row-nested { padding-left: 16px; }\n.odt-section-row-label { flex-grow: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.odt-chain { display: flex; gap: 10px; align-items: flex-start; font-size: 12px; line-height: 1.333; }\n.odt-chain-time { width: 78px; flex-shrink: 0; color: var(--odt-text-muted); font-variant-numeric: tabular-nums; }\n.odt-footer { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--odt-line); flex-shrink: 0; }\n.odt-footer-end { margin-left: auto; }\n.odt-footer-status { min-width: 0; font-size: 10px; line-height: 1.6; text-align: right; color: var(--odt-text-muted); }\n.odt-empty { padding: 12px 16px; font-size: 12px; line-height: 1.333; color: var(--odt-text-muted); }\n\n.odt-timeline { display: flex; flex-direction: column; gap: 2px; padding: 8px 16px; overflow-y: auto; flex-grow: 1; min-height: 0; }\n.odt-timeline-row { display: flex; align-items: center; gap: 12px; height: 28px; flex-shrink: 0; font-size: 12px; line-height: 1.333; text-align: left; }\n.odt-timeline-gap { color: var(--odt-warn); }\n.odt-timeline-seq { width: 96px; flex-shrink: 0; color: var(--odt-text-muted); font-variant-numeric: tabular-nums; }\n.odt-timeline-time { width: 96px; flex-shrink: 0; color: var(--odt-text-muted); font-variant-numeric: tabular-nums; }\n\n.odt-status {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  flex-wrap: wrap;\n  min-height: 28px;\n  flex-shrink: 0;\n  padding: 4px 16px;\n  border-top: 1px solid var(--odt-line);\n  font-size: 10px;\n  line-height: 1.6;\n  text-transform: uppercase;\n  color: var(--odt-text-muted);\n}\n.odt-status-group { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 16px; min-width: 0; }\n.odt-status-more { padding: 0 4px; font-size: 12px; line-height: 1; color: var(--odt-text-muted); }\n.odt-status-more[aria-expanded='true'] { color: var(--odt-text); }\n\n/**\n * Below 1100 px the three columns stop being readable, so the neighbourhood \u2014 drawn as a list at this width \u2014 and\n * the inspector share the second column instead of one of them disappearing. Losing the neighbourhood would leave\n * the panel unable to answer what a node is waiting for, which is the question it exists for.\n */\n@media (max-width: 1100px) {\n  .odt-body { grid-template-columns: 320px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); }\n  .odt-tree { grid-row: 1 / span 2; }\n  .odt-main { border-right: 0; border-bottom: 1px solid var(--odt-line); }\n}\n@media (max-width: 720px) {\n  .odt-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }\n  .odt-tree { grid-row: auto; border-right: 0; }\n  .odt-step-hidden { display: none; }\n  .odt-search { width: auto; max-width: none; flex-grow: 1; }\n}\n@media (prefers-reduced-motion: no-preference) {\n  .odt-canvas-layer { transition: transform 120ms ease-out; }\n}\n";
+/** Injects one stylesheet once per document. Safe to call on every mount and outside a browser. */
+declare function injectStylesheet(name: string, css: string, target?: Document | undefined): void;
+declare function ensureStylesheet(target?: Document): void;
+export { stylesheet as devtoolsStylesheet };
+export { ensureStylesheet, injectStylesheet };

package/dist/react/theme.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Theming per `docs/devtools.md` §4.6: the panel ships its own CSS variables with neutral dark defaults
+ * and never imports a host design system. A host maps its own tokens once, in config.
+ *
+ * Overrides are applied as inline custom properties on the panel root, so nothing leaks into the host's cascade and
+ * the panel still renders correctly in an application that has no design system at all.
+ */
+import type { CSSProperties } from 'react';
+type DevtoolsTheme = Readonly<{
+    accent?: string;
+    accentSurface?: string;
+    accentText?: string;
+    bad?: string;
+    badSurface?: string;
+    canvas?: string;
+    control?: string;
+    font?: string;
+    line?: string;
+    lineStrong?: string;
+    ok?: string;
+    okSurface?: string;
+    radius?: string;
+    surface?: string;
+    surfaceRaised?: string;
+    text?: string;
+    textMuted?: string;
+    warn?: string;
+    warnSurface?: string;
+}>;
+type ThemeMapping = Readonly<{
+    /** How many variables the host actually mapped. The status bar reports it behind its disclosure (§4.5). */
+    mapped: number;
+    style: CSSProperties;
+}>;
+declare function themeMapping(theme: DevtoolsTheme | undefined): ThemeMapping;
+/** A neutral explicit theme; applications may provide any subset through DevtoolsTheme. */
+declare const defaultTheme: DevtoolsTheme;
+export { defaultTheme, themeMapping };
+export type { DevtoolsTheme, ThemeMapping };

package/dist/react/timeline-locale.d.ts

@@ -0,0 +1,20 @@
+/**
+ * The timeline's own dictionary, kept out of the panel's (§4.1).
+ *
+ * The view renders on its own tab and nowhere else, so its words travel with its code: a session that stays on the
+ * graph never carries them. The discipline is the panel's — English is the source, the Russian record is typed
+ * against it — and the protocol's vocabulary is not translated in either.
+ */
+import type { DevtoolsLocale } from './locale.js';
+declare const en: {
+    frameRevision: (sequence: number, revision: number) => string;
+    gapDropped: (dropped: number) => string;
+    gapRestarted: string;
+    gapTitle: string;
+    noCommits: string;
+    timelineChanged: (changed: number) => string;
+    timelineCommit: string;
+    timelineLog: string;
+};
+declare function timelineStringsFor(locale: DevtoolsLocale): typeof en;
+export { timelineStringsFor };

package/dist/react/timeline-view.d.ts

@@ -0,0 +1,14 @@
+/**
+ * The timeline tab: one row per committed transaction, newest first, with dropped-gap marks inline so a hole in the
+ * history is impossible to mistake for a quiet period (§6, §7).
+ *
+ * The time column is empty for a commit with no cause, and always empty for a gap. That is not a missing feature:
+ * the protocol's only clock stamps the trigger of a commit, and a gap has none.
+ */
+import type { ReactElement } from 'react';
+import type { TimelineEntry } from '../timeline.js';
+type TimelineViewProps = Readonly<{
+    entries: readonly TimelineEntry[];
+}>;
+declare function TimelineView({ entries }: TimelineViewProps): ReactElement;
+export { TimelineView };

package/dist/react/tree.d.ts

@@ -0,0 +1,26 @@
+/**
+ * The feature tree of `docs/devtools.md` §4, retold in the runtime's words: lifetime owners as uppercase
+ * groups — the application itself and one row per condition group — with features as 32 px rows carrying glyph plus
+ * text tag, and the glyph legend pinned at the bottom.
+ *
+ * Rows are flattened to a single list before rendering, both for keyboard navigation and so that swapping in a
+ * virtualizer later is a change of one `map` (§6).
+ */
+import type { ReactElement } from 'react';
+import type { TreeGroupRow } from '../graph-index.js';
+import type { DiagnosticLabel, DiagnosticNodeId } from '../protocol.js';
+import type { NodeDisplayState } from '../visual-axes.js';
+type TreeProps = Readonly<{
+    /** Resolved per rendered row, so a collapsed owner costs nothing when a commit changes its members (§6). */
+    displayOf: (id: DiagnosticNodeId) => NodeDisplayState;
+    expanded: ReadonlySet<DiagnosticNodeId>;
+    groups: readonly TreeGroupRow[];
+    onConfirm: () => void;
+    onSelect: (id: DiagnosticNodeId) => void;
+    onToggle: (id: DiagnosticNodeId) => void;
+    selectedId: DiagnosticNodeId | undefined;
+    summary: DiagnosticLabel;
+    version: number;
+}>;
+declare function Tree({ displayOf, expanded, groups, onConfirm, onSelect, onToggle, selectedId, summary, version, }: TreeProps): ReactElement;
+export { Tree };

package/dist/react/use-store.d.ts

@@ -0,0 +1,11 @@
+import type { DevtoolsGraphStore } from '../graph-store.js';
+/** Subscribes a component to the store's version counter, which changes exactly once per applied frame or reset. */
+declare function useStoreVersion(store: DevtoolsGraphStore): number;
+/**
+ * Rolling cost of the panel's own render-to-commit work, for the status bar budget of §6.
+ *
+ * It writes to refs during render and reads the previous measurement, so measuring never schedules a render of its
+ * own — a diagnostics readout that re-rendered the panel to display its own cost would be measuring itself.
+ */
+declare function useRenderCost(version: number): number;
+export { useRenderCost, useStoreVersion };

package/dist/react.d.ts

@@ -0,0 +1,16 @@
+/**
+ * The React panel. A peer dependency on React lives only in this entry point, so the headless session and reducer
+ * in `@opetope/devtools` stay usable without a renderer (§3.1).
+ */
+export { edgeKinds, edgePresets, presetKinds } from './react/edge-filter.js';
+export type { DevtoolsTab, EdgePreset, EdgePresetId } from './react/edge-filter.js';
+export { formatClock, formatInstance, formatOptionalTime, formatTime } from './react/format.js';
+export { stateDescription, StateGlyph, StateTag } from './react/glyph.js';
+export { layoutNeighbourhood } from './react/graph-layout.js';
+export type { GraphLayout, LaidOutEdge, LaidOutNode } from './react/graph-layout.js';
+export { DevtoolsPanel } from './react/panel.js';
+export type { DevtoolsMode, DevtoolsPanelProps } from './react/panel.js';
+export { devtoolsStylesheet, ensureStylesheet } from './react/styles.js';
+export { defaultTheme, themeMapping } from './react/theme.js';
+export type { DevtoolsTheme, ThemeMapping } from './react/theme.js';
+export { useRenderCost, useStoreVersion } from './react/use-store.js';

package/dist/react.js

@@ -0,0 +1,2 @@
+import{D as a,S as t,a as o,d as r,s as i,e as l,b as n,c as d,f as m,g as h,h as p,i as f,l as u,p as g,j as S,t as c,u as y,k as T}from"./panel-5jvisQBr.js";export{a as DevtoolsPanel,t as StateGlyph,o as StateTag,r as defaultTheme,i as devtoolsStylesheet,l as edgeKinds,n as edgePresets,d as ensureStylesheet,m as formatClock,h as formatInstance,p as formatOptionalTime,f as formatTime,u as layoutNeighbourhood,g as presetKinds,S as stateDescription,c as themeMapping,y as useRenderCost,T as useStoreVersion};
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/search-CC7avy6I.js

@@ -0,0 +1,2 @@
+import{k as u,n as d,l as m}from"./protocol-joKTjlMj.js";function s(n,e){var t;return((t=n.node(e))==null?void 0:t.label)??e}function w(n,e){const t=n.runtimeNode(e);return(t==null?void 0:t.kind)==="contribution"?t.state.kind:"declared"}function O(n,e){var i;const t=[];for(const o of n.outgoing(e))o.kind==="owns"&&((i=n.node(o.to))==null?void 0:i.kind)==="contribution"&&t.push(o.to);return t}function l(n,e){const t=[];for(const i of n.incoming(e))i.kind==="contributes-to"&&t.push(i.from);return t}function v(n,e){var t;return(t=n.outgoing(e).find(i=>i.kind==="contributes-to"))==null?void 0:t.to}function p(n,e){var t;return(t=n.incoming(e).find(i=>i.kind==="owns"))==null?void 0:t.from}function b(n,e,t,i){const o=p(n,e);return{contribution:e,contributionDisplay:n.displayOf(e),contributionLabel:s(n,e),contributorLabel:o===void 0?s(n,e):s(n,o),endpoint:t,endpointDisplay:n.displayOf(t),endpointLabel:s(n,t),own:i,state:w(n,e)}}function g(n,e){const t=new Set(O(n,e)),i=[],o=new Set;for(const r of t){const a=v(n,r);if(!(a===void 0||o.has(a))){o.add(a);for(const f of l(n,a))i.push(b(n,f,a,t.has(f)))}}return i}function F(n,e){const t=[];for(const i of l(n,e)){const o=p(n,i);o!==void 0&&t.push(b(n,i,o,!0))}return t}function L(n,e){const t=n.graph,i=t.node(e);if(i===void 0)return;const o=i.kind==="contribution-target";return{display:t.displayOf(e),id:e,inverted:o,kind:i.kind,label:i.label,rows:o?F(t,e):g(t,e)}}function c(n){return"failure"in n.state?n.state.failure:void 0}function k(n){return n.kind==="feature-instance"?n.generation:void 0}function h(n){const{state:e}=n;if(e.kind==="opening"&&"total"in e)return`${e.kind} \xB7 ${e.opened}/${e.total}`;if(e.kind==="retiring"&&"remaining"in e)return`${e.kind} \xB7 ${e.remaining}`}function N(n){const{kind:e}=n.state;return e==="ready"||e==="active"||e==="available"||e==="bound"||e==="true"}function y(n){const e={};for(const[t,i]of Object.entries(n))i!==void 0&&(e[t]=i);return e}function j(n,e){if(d(e))return e.lookup==="found";if(!m(e))return!0;const t=n.runtimeNode(e.from);return!e.pending&&(t===void 0||N(t))}function S(n,e){var i;const t=d(e);return{display:n.displayOf(e.from),kind:e.kind,label:((i=n.node(e.from))==null?void 0:i.label)??e.from,...t?{lookup:e.lookup}:{},node:e.from,ready:j(n,e),weak:t}}function $(n,e){const t=[];for(const i of n.incoming(e))u(i)&&t.push(S(n,i));return t}function D(n,e,t){for(const i of n.outgoing(e.id)){if(u(i))continue;const o=n.runtimeNode(i.to);o!==void 0&&t.push({depth:1,display:n.displayOf(o.id),edge:i,node:o})}}function E(n,e){const t=[];for(const i of n.outgoing(e)){if(u(i))continue;const o=n.runtimeNode(i.to);o!==void 0&&(t.push({depth:0,display:n.displayOf(o.id),edge:i,node:o}),o.kind==="feature-instance"&&D(n,o,t))}return t}function R(n,e){const t=n===void 0?void 0:c(n),i=n===void 0?void 0:h(n);return{readyBlockers:e.reduce((o,r)=>o+(r.ready?1:0),0),totalBlockers:e.length,...y({cause:n==null?void 0:n.cause,failure:t,progress:i})}}function C(n,e){var t;if("provenance"in e&&e.provenance!==void 0)return e.provenance;if(!(!("declaration"in e)||e.declaration===void 0))return(t=n.planNode(e.declaration))==null?void 0:t.provenance}function A(n){return{desired:n,health:"healthy",lifecycle:"declared"}}function B(n,e,t,i){const o={id:n.plan.application.id,label:n.plan.application.label},r=[o];return t!==void 0&&i!==e.id&&r.push({...i===void 0?{}:{id:i},label:t}),e.id!==o.id&&r.push({id:e.id,label:e.label}),r}function T(n){return{id:n==null?void 0:n.id,label:n==null?void 0:n.label,override:(n==null?void 0:n.desired.override)??"none"}}function G(n,e,t,i){return y({generation:t===void 0?void 0:k(t),groupLabel:i==null?void 0:i.label,node:t,provenance:C(n,e)})}function H(n,e){const t=n.graph,i=t.node(e);if(i===void 0)return;const o=t.runtimeNode(e),r=t.groupOf(e),a=T(r),f=$(t,e);return{applicationActivity:n.activity,axes:t.axesOf(e)??A(t.desiredOf(e)),blockers:f,breadcrumbs:B(t,i,a.label,a.id),chain:n.chainFor(e),display:t.displayOf(e),id:e,kind:i.kind,label:i.label,override:a.override,owned:E(t,e),why:R(o,f),...G(t,i,o,r)}}const P=40,W=[["label",n=>n.label],["id",n=>n.id],["kind",n=>n.kind],["provenance",n=>"provenance"in n?n.provenance:void 0],["failure-code",n=>{var e;return"state"in n?(e=c(n))==null?void 0:e.code:void 0}],["failure-subject",n=>{var e;return"state"in n?(e=c(n))==null?void 0:e.subject:void 0}]];function q(n,e){var t;for(const[i,o]of W)if(((t=o(n))==null?void 0:t.toLowerCase().includes(e))===!0)return i}function z(n,e,t=P){const i=e.trim().toLowerCase();if(i.length===0)return[];const o=[];for(const r of n.nodes()){if(o.length>=t)break;const a=q(r,i);a!==void 0&&o.push({display:n.displayOf(r.id),field:a,id:r.id,kind:r.kind,label:r.label})}return o}export{L as a,H as b,c as f,k as g,h as p,z as s};
+//# sourceMappingURL=search-CC7avy6I.js.map