@ethlete/components 1.0.0-next.34 → 1.0.0-next.35

package/types/ethlete-components.d.ts

@@ -8,7 +8,8 @@ import * as _angular_platform_browser from '@angular/platform-browser';
 import { Locale } from 'date-fns';
 import * as _angular_forms_signals from '@angular/forms/signals';
 import { FieldTree, ValidationError, FormValueControl, FormCheckboxControl, PathKind, SchemaPath, SchemaPathRules, validate } from '@angular/forms/signals';
-import { QueryFormFields, QueryFormSignals, QueryFormModel, AnyQueryCreator, RequestArgs, QueryArgsOf, ResponseType, QueryErrorResponse, RequestError, QueryArgs, QueryCreator, AnyV2QueryCreator, AnyLegacyQueryCreator, QueryDataOf, ReadonlyQuery, QueryRepositoryEvent, QueryDevtoolsEntry, Query, QueryRepository, QueryRepositoryCacheEntry, QueryKeyLockState, QueryClient, AnyQueryStack, AnyPagedQueryStack, QuerySequence, AnyBearerAuthProvider, WebSocketDevtoolsHandle, QuerySequenceStatus, AnyQuerySnapshot, AnyV2Query, AnyLegacyQuery, AnyQueryCollection } from '@ethlete/query';
+import * as _ethlete_query from '@ethlete/query';
+import { QueryFormFields, QueryFormSignals, QueryFormModel, AnyQueryCreator, RequestArgs, QueryArgsOf, ResponseType, QueryErrorResponse, RequestError, QueryArgs, QueryCreator, AnyV2QueryCreator, AnyLegacyQueryCreator, QueryDataOf, ReadonlyQuery, QueryRepositoryEvent, QueryRefreshCause, QueryDevtoolsEntry, Query, QueryDevtoolsRun, QueryRepository, QueryRepositoryCacheEntry, QueryKeyLockState, QueryClient, HttpRequestRetryState, HttpRequestLoadingProgressState, QueryDevtoolsStats, QueryDevtoolsStatsHandle, AnyQueryStack, AnyPagedQueryStack, QuerySequence, AnyBearerAuthProvider, WebSocketDevtoolsHandle, QueryDevtoolsFormHandle, QuerySequenceStatus, AnyQuerySnapshot, QueryDevtoolsFeature, AnyV2Query, AnyLegacyQuery, AnyQueryCollection } from '@ethlete/query';
 import * as rxjs from 'rxjs';
 import { Observable } from 'rxjs';
 import { Placement, OffsetOptions, Padding } from '@floating-ui/dom';
@@ -16038,10 +16039,21 @@ declare class PaginationSeoDirective {
 }
 
 type JsonKind = 'string' | 'number' | 'boolean' | 'null' | 'undefined' | 'array' | 'object';
+type JsonEntry = {
+    k: string;
+    v: unknown;
+};
+/** A folded slice of a container's entries, rendered as its own collapsible row. */
+type JsonChunk = {
+    start: number;
+    end: number;
+    label: string;
+};
 /**
  * A recursive, collapsible, searchable JSON tree used by the query devtools value explorer. Renders
  * the *transformed* value the app actually sees (post `transformResponse`). Self-recurses via its
- * own selector.
+ * own selector - both for child entries and for the folded slices of an oversized container, which
+ * re-enter as the same component with a `chunk` window over the same value.
  */
 declare class QueryDevtoolsJsonComponent {
     value: _angular_core.InputSignal<unknown>;
@@ -16049,6 +16061,11 @@ declare class QueryDevtoolsJsonComponent {
     depth: _angular_core.InputSignalWithTransform<number, unknown>;
     /** Lowercased search term; when set, the tree auto-expands and matches are highlighted. */
     search: _angular_core.InputSignal<string>;
+    /**
+     * When set, this node is not the value itself but a folded window over its entries. It shares the
+     * container's `path` so a child's persisted expansion does not depend on where the slice borders land.
+     */
+    chunk: _angular_core.InputSignal<JsonChunk | null>;
     /** Full path of this node from the explorer root, used as the key for persisted expansion. */
     path: _angular_core.InputSignal<string>;
     /** Persisted paths explicitly expanded (overrides the depth default). */
@@ -16059,12 +16076,18 @@ declare class QueryDevtoolsJsonComponent {
     toggleFn: _angular_core.InputSignal<((path: string, expand: boolean) => void) | null>;
     protected kind: _angular_core.Signal<JsonKind>;
     protected isContainer: _angular_core.Signal<boolean>;
-    protected entries: _angular_core.Signal<{
-        k: string;
-        v: unknown;
-    }[]>;
+    /** The entries this node covers: the container's own, or just the window a chunk stands for. */
+    ownEntries: _angular_core.Signal<JsonEntry[]>;
+    protected childChunks: _angular_core.Signal<JsonChunk[]>;
+    /** Entries rendered as rows - empty while they are folded into slices instead. */
+    protected visibleEntries: _angular_core.Signal<JsonEntry[]>;
+    /** Slices carry their window in the key so siblings persist independently of the container. */
+    private togglePath;
+    private defaultExpanded;
     private localExpanded;
     protected expanded: _angular_core.Signal<boolean>;
+    /** Only slices that actually contain a match unfold while searching, so a filter stays cheap. */
+    private chunkHasHit;
     protected effectiveExpanded: _angular_core.Signal<boolean>;
     protected copied: _angular_core.WritableSignal<boolean>;
     private copiedReset$;
@@ -16077,13 +16100,15 @@ declare class QueryDevtoolsJsonComponent {
     protected childPath(key: string): string;
     protected toggle(): void;
     /**
-     * Containers copy their whole subtree as JSON; leaves copy something pasteable - a raw string
-     * without the display quotes, so an id or url can go straight into a search box.
+     * Containers copy their whole subtree as JSON, slices only the entries they cover; leaves copy
+     * something pasteable - a raw string without the display quotes, so an id or url can go straight
+     * into a search box.
      */
     protected copyValue(): void;
+    private chunkValue;
     private flagCopied;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<QueryDevtoolsJsonComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<QueryDevtoolsJsonComponent, "et-query-devtools-json", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "nodeKey": { "alias": "nodeKey"; "required": false; "isSignal": true; }; "depth": { "alias": "depth"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "path": { "alias": "path"; "required": false; "isSignal": true; }; "expandedPaths": { "alias": "expandedPaths"; "required": false; "isSignal": true; }; "collapsedPaths": { "alias": "collapsedPaths"; "required": false; "isSignal": true; }; "toggleFn": { "alias": "toggleFn"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<QueryDevtoolsJsonComponent, "et-query-devtools-json", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "nodeKey": { "alias": "nodeKey"; "required": false; "isSignal": true; }; "depth": { "alias": "depth"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "chunk": { "alias": "chunk"; "required": false; "isSignal": true; }; "path": { "alias": "path"; "required": false; "isSignal": true; }; "expandedPaths": { "alias": "expandedPaths"; "required": false; "isSignal": true; }; "collapsedPaths": { "alias": "collapsedPaths"; "required": false; "isSignal": true; }; "toggleFn": { "alias": "toggleFn"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -16099,9 +16124,121 @@ declare class QueryDevtoolsToggleComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<QueryDevtoolsToggleComponent, "et-query-devtools-toggle", never, {}, { "openChange": "openChange"; }, never, never, true, never>;
 }
 
+/** Whether a path exists only in the newer value, only in the older one, or in both with a new value. */
+type QueryDevtoolsDiffKind = 'added' | 'removed' | 'changed';
+/** One difference between two values, located by the path it sits at. */
+type QueryDevtoolsDiffEntry = {
+    /** Where the difference sits, e.g. `$.items[2].score` or `$.items[id=7].score`. */
+    path: string;
+    kind: QueryDevtoolsDiffKind;
+    /** The older value, or `null` for an added path. */
+    before: unknown;
+    /** The newer value, or `null` for a removed path. */
+    after: unknown;
+};
+type QueryDevtoolsDiff = {
+    entries: QueryDevtoolsDiffEntry[];
+    /** Whether the walk hit its cap, so {@link entries} is only part of the difference. */
+    truncated: boolean;
+};
+
 type AnyQuery = Query<any>;
-type DevtoolsTab = 'queries' | 'stacks' | 'sequences' | 'auth' | 'ws' | 'cache' | 'events';
+type DevtoolsTab = 'queries' | 'stacks' | 'sequences' | 'forms' | 'auth' | 'ws' | 'cache' | 'timeline' | 'events' | 'faults';
+/**
+ * The sections of the query detail drawer. The head and its actions stay pinned above them - the detail
+ * holds more than fits a column, and everything below the actions is reading material.
+ */
+type DetailTab = 'overview' | 'history' | 'data';
 type QueryStatus = 'idle' | 'loading' | 'success' | 'error';
+/** A live-state facet the Queries list can be narrowed to. */
+type QueryListFacet = 'error' | 'loading' | 'stale' | 'idle';
+/**
+ * What a tab holds, as its badge reports it: how many entries, and how many of them are failing.
+ * `errorNoun` renames what the red badge counts for a tab where it is not a failure.
+ */
+type TabBadge = {
+    count: number;
+    errors: number;
+    errorNoun?: string;
+};
+/** The fault fields the panel arms from a number input, as opposed to the status it picks from a list. */
+type NumericFaultField = 'latencyMs' | 'failNext' | 'failRate';
+/**
+ * A chunk of a route as rendered: literal path text, a path param (`name` is the param it fills in) or
+ * the query string of the request that ran. The kind becomes the segment's class.
+ */
+type RouteSegment = {
+    text: string;
+    kind: 'static' | 'param' | 'query';
+    name?: string;
+};
+/** A query reachable from a stack or sequence card, rendered as a row that opens the detail drawer. */
+type QueryLink = {
+    id: string;
+    query: AnyQuery;
+    method: string;
+    segments: RouteSegment[];
+    clientBaseUrl: string;
+    stats?: QueryDevtoolsStatsHandle;
+};
+/**
+ * Query stats plus the numbers the panel derives from them rather than storing: an execution that never
+ * reached the network was answered from the cache, and the averages come from the running totals.
+ */
+type QueryActivity = {
+    stats: QueryDevtoolsStats;
+    cacheServed: number;
+    avgDurationMs: number | null;
+    avgResponseBytes: number | null;
+    hasActivity: boolean;
+};
+/**
+ * What a query's request is doing beyond `loading`: which attempt it is on, the backoff it is waiting
+ * out, and how much of the payload has moved. Without it a request retried three times behind a 4s
+ * backoff and a plain slow one are the same yellow dot.
+ */
+type RequestProgress = {
+    /** @see HttpRequestSubtle.attempts */
+    attempts: number;
+    retry: HttpRequestRetryState | null;
+    /** How much of the pending backoff is left, or `null` when none is pending. */
+    retryInMs: number | null;
+    progress: HttpRequestLoadingProgressState | null;
+};
+/**
+ * One run of one query, placed on the timeline's shared axis. `leftPct` / `widthPct` are percentages of
+ * the window every row is laid out against, which is what makes overlapping runs visible as overlap.
+ */
+type TimelineRow = {
+    key: string;
+    entryId: string;
+    method: string;
+    path: string;
+    run: QueryDevtoolsRun;
+    leftPct: number;
+    widthPct: number;
+    /** How long the run took, or `null` while it is still in flight. */
+    durationMs: number | null;
+};
+type Timeline = {
+    rows: TimelineRow[];
+    /** The start of the window the rows are laid out against. */
+    startedAt: number;
+    /** How long that window is - the axis every bar is a fraction of. */
+    windowMs: number;
+    /** How many older runs the view left out, so a capped timeline does not read as a complete one. */
+    hidden: number;
+};
+/**
+ * One request a refresh re-executed, as an event row lists it. A cache key is shared by every query
+ * bound to it, so the row carries all of their ids - one to open, and the rest so each of those queries
+ * can still find the refresh under "Refetched by". Empty for a request no registered query holds.
+ */
+type RefreshedRequest = {
+    queryIds: string[];
+    method: string;
+    path: string;
+};
 type EventLogItem = {
     id: number;
     timestamp: number;
@@ -16112,6 +16249,31 @@ type EventLogItem = {
     url: string | null;
     isSecure: boolean;
     status: number | null;
+    /**
+     * The registered query the request belonged to when the event fired, so the row can open it. Resolved
+     * here rather than at click time so the log holds an id instead of a reference to the request itself.
+     */
+    queryId: string | null;
+    /** What asked for a refresh, for a `queries-refreshed` row. `null` for every other type. */
+    cause: QueryRefreshCause | null;
+    /** The requests that refresh re-executed - the fan-out the panel could not show before. */
+    refreshed: RefreshedRequest[] | null;
+};
+type PersistedState = {
+    open?: boolean;
+    height?: number;
+    activeTab?: DevtoolsTab;
+    detailTab?: DetailTab;
+    selectedClientName?: string | null;
+    selectedQueryId?: string | null;
+    selectedFormId?: string | null;
+    inspectFilterIds?: string[] | null;
+    queryFilter?: string;
+    queryFacets?: QueryListFacet[];
+    jsonSearch?: string;
+    expandedSteps?: string[];
+    jsonExpanded?: string[];
+    jsonCollapsed?: string[];
 };
 /**
  * A floating, dockable panel that inspects the live state of the signals-first `@ethlete/query`
@@ -16123,10 +16285,11 @@ type EventLogItem = {
  */
 declare class QueryDevtoolsComponent {
     private hostEl;
+    private renderer;
     protected document: Document;
     private eventIdCounter;
     private lastSelectionKey;
-    private readonly persisted;
+    readonly persisted: PersistedState;
     protected readonly tabs: ({
         id: "queries";
         label: string;
@@ -16136,6 +16299,9 @@ declare class QueryDevtoolsComponent {
     } | {
         id: "sequences";
         label: string;
+    } | {
+        id: "forms";
+        label: string;
     } | {
         id: "auth";
         label: string;
@@ -16145,60 +16311,168 @@ declare class QueryDevtoolsComponent {
     } | {
         id: "cache";
         label: string;
+    } | {
+        id: "timeline";
+        label: string;
     } | {
         id: "events";
         label: string;
+    } | {
+        id: "faults";
+        label: string;
+    })[];
+    protected readonly detailTabs: ({
+        id: "overview";
+        label: string;
+    } | {
+        id: "history";
+        label: string;
+    } | {
+        id: "data";
+        label: string;
+    })[];
+    /** The status chips above the Queries list, in the order a problem is usually looked for. */
+    protected readonly facets: ({
+        id: "error";
+        label: string;
+    } | {
+        id: "loading";
+        label: string;
+    } | {
+        id: "stale";
+        label: string;
+    } | {
+        id: "idle";
+        label: string;
     })[];
     protected readonly shortcut: string;
-    protected open: _angular_core.WritableSignal<boolean>;
-    protected panelHeight: _angular_core.WritableSignal<number>;
-    protected resizing: _angular_core.WritableSignal<boolean>;
-    protected activeTab: _angular_core.WritableSignal<DevtoolsTab>;
-    protected selectedClientName: _angular_core.WritableSignal<string | null>;
-    protected selectedQueryId: _angular_core.WritableSignal<string | null>;
-    protected stackSelectedQueryId: _angular_core.WritableSignal<string | null>;
-    protected sequenceSelectedQueryId: _angular_core.WritableSignal<string | null>;
-    protected eventLog: _angular_core.WritableSignal<EventLogItem[]>;
+    protected open: WritableSignal<boolean>;
+    protected panelHeight: WritableSignal<number>;
+    protected resizing: WritableSignal<boolean>;
+    protected activeTab: WritableSignal<DevtoolsTab>;
+    /** Which section of the query detail is showing. Shared by the Queries tab and both drawers. */
+    protected detailTab: WritableSignal<DetailTab>;
+    protected selectedClientName: WritableSignal<string | null>;
+    protected selectedQueryId: WritableSignal<string | null>;
+    /** The form whose detail the Forms tab has expanded. */
+    protected selectedFormId: WritableSignal<string | null>;
+    protected stackSelectedQueryId: WritableSignal<string | null>;
+    protected sequenceSelectedQueryId: WritableSignal<string | null>;
+    protected formSelectedQueryId: WritableSignal<string | null>;
+    protected timelineSelectedQueryId: WritableSignal<string | null>;
+    /** Free-text narrowing of the Queries list. Every whitespace-separated term has to match. */
+    protected queryFilter: WritableSignal<string>;
+    /** The status facets the Queries list is narrowed to. Empty means no status narrowing. */
+    queryFacets: WritableSignal<ReadonlySet<QueryListFacet>>;
+    protected eventLog: WritableSignal<EventLogItem[]>;
     /** Keys (`<entryId>:<stepIndex>`) of the sequence steps whose in/out detail is expanded. */
     private expandedSteps;
     /** Shared value-explorer search term. */
-    protected jsonSearch: _angular_core.WritableSignal<string>;
+    protected jsonSearch: WritableSignal<string>;
     protected jsonSearchTerm: _angular_core.Signal<string>;
     /** Path-keyed value-explorer expansion overrides (persisted so open trees survive a reload). */
-    protected jsonExpandedPaths: _angular_core.WritableSignal<ReadonlySet<string>>;
-    protected jsonCollapsedPaths: _angular_core.WritableSignal<ReadonlySet<string>>;
+    protected jsonExpandedPaths: WritableSignal<ReadonlySet<string>>;
+    protected jsonCollapsedPaths: WritableSignal<ReadonlySet<string>>;
     /** Bound callback passed into the value explorer to persist per-path expansion. Assigned in the constructor. */
     protected toggleJsonPath: (path: string, expand: boolean) => void;
+    /** The run whose response the diff is comparing, by run index, or `null` while no diff is open. */
+    protected diffRunIndex: WritableSignal<number | null>;
     /** JIT editor state (response / args editing on the selected query). */
-    protected editorMode: _angular_core.WritableSignal<"none" | "response" | "args">;
-    protected responseDraft: _angular_core.WritableSignal<string>;
-    protected argsDraft: _angular_core.WritableSignal<string>;
-    protected editError: _angular_core.WritableSignal<string | null>;
-    /** Transient "Copied!" feedback for the copy-report action. */
-    protected copiedReport: _angular_core.WritableSignal<boolean>;
+    protected editorMode: WritableSignal<"none" | "response" | "args">;
+    protected responseDraft: WritableSignal<string>;
+    protected argsDraft: WritableSignal<string>;
+    /**
+     * The text the currently open editor was seeded with. The textareas bind `value` to this and not to
+     * the live draft: a `value` binding fed by the draft is written back on every keystroke, and writing
+     * a textarea's `value` puts the caret at the end.
+     */
+    protected editorSeed: string;
+    protected editError: WritableSignal<string | null>;
+    /** Transient "Copied!" feedback for the copy-report, copy-as-Insomnia and copy-document actions. */
+    protected copiedReport: WritableSignal<boolean>;
+    protected copiedInsomnia: WritableSignal<boolean>;
+    protected copiedGql: WritableSignal<boolean>;
+    private copiedReset$;
     /** 1-second tick driving the cache freshness countdowns. */
     private clock;
     /** "Inspect" mode: hover the live UI to find the query that a component created. */
-    protected inspectActive: _angular_core.WritableSignal<boolean>;
-    protected inspectHover: _angular_core.WritableSignal<{
+    protected inspectActive: WritableSignal<boolean>;
+    protected inspectHover: WritableSignal<{
         rect: DOMRect;
         entries: QueryDevtoolsEntry[];
     } | null>;
     /** When set (via inspect), the Queries list is filtered to exactly these entry ids. */
-    protected inspectFilterIds: _angular_core.WritableSignal<string[] | null>;
+    protected inspectFilterIds: WritableSignal<string[] | null>;
     private queryEntries;
     protected stackEntries: _angular_core.Signal<QueryDevtoolsEntry[]>;
     protected sequenceEntries: _angular_core.Signal<QueryDevtoolsEntry[]>;
+    protected formEntries: _angular_core.Signal<QueryDevtoolsEntry[]>;
     protected authEntries: _angular_core.Signal<QueryDevtoolsEntry[]>;
     protected wsEntries: _angular_core.Signal<QueryDevtoolsEntry[]>;
     /** Unique client names present across queries and auth providers, for the Queries-tab picker. */
     protected clientNames: _angular_core.Signal<string[]>;
     /** Unique repositories (with their client name + base URL) used by the Cache and Events tabs. */
     private repositories;
+    /**
+     * Every client the Faults tab can arm, with the fault it currently carries. Clients with nothing armed
+     * read as {@link EMPTY_QUERY_DEVTOOLS_FAULT} so the inputs always have a value to show.
+     */
+    protected faultClients: _angular_core.Signal<{
+        name: string;
+        baseUrl: string;
+        fault: _ethlete_query.QueryDevtoolsFault;
+        armed: boolean;
+    }[]>;
+    /**
+     * The names of the clients currently carrying a fault, or `null` when none do - so a template can `@if`
+     * on it. Armed faults are the one state where the panel is lying to the app on purpose, and a badge on a
+     * tab that isn't open cannot say that: whichever tab you are reading, a red response has to be
+     * attributable to the injection rather than to the API.
+     */
+    protected armedFaultClients: _angular_core.Signal<string[] | null>;
+    /**
+     * The queries the list is scoped to before the search box and the status chips narrow them further:
+     * either the picked client's, or exactly the inspected element's.
+     */
+    private scopedQueries;
+    private searchedQueries;
+    /**
+     * How many queries each status chip would leave. Counted before the active chips are applied, so a
+     * chip always states what picking it yields rather than what the current selection happens to show.
+     */
+    protected facetCounts: _angular_core.Signal<Record<QueryListFacet, number>>;
     protected filteredQueries: _angular_core.Signal<{
         entry: QueryDevtoolsEntry;
         query: AnyQuery;
     }[]>;
+    /** How many queries are in scope, which is what the list would show unfiltered. */
+    protected scopedQueryCount: _angular_core.Signal<number>;
+    /** Whether the search box or a status chip is narrowing the list beyond its scope. */
+    protected isQueryListNarrowed: _angular_core.Signal<boolean>;
+    /**
+     * Every run the scoped queries have recorded, oldest first. The client picker and the inspection
+     * filter narrow the timeline the same way they narrow the Queries list.
+     */
+    private scopedRuns;
+    /**
+     * Every scoped run laid out on one axis, so a stampede reads as overlapping bars and a chain as a
+     * staircase - which is what the Events tab's flat list of wall-clock times cannot show.
+     */
+    protected timeline: _angular_core.Signal<Timeline>;
+    /** Axis labels for the timeline, as offsets from the window's start. */
+    protected timelineTicks: _angular_core.Signal<{
+        pct: number;
+        label: string;
+    }[]>;
+    /** How many runs every query has recorded, for the Timeline tab's badge. */
+    private runTotals;
+    /** Cache entries across every client, for the Cache tab's badge. */
+    private cacheEntryCount;
+    /**
+     * What each tab holds, so a failing query in a tab that is not open is still visible. Reading it
+     * subscribes the tab bar to every entry's live state - which is the point of the badges.
+     */
+    protected tabBadges: _angular_core.Signal<Record<DevtoolsTab, TabBadge>>;
     protected selectedQuery: _angular_core.Signal<{
         entry: QueryDevtoolsEntry;
         query: AnyQuery;
@@ -16211,6 +16485,14 @@ declare class QueryDevtoolsComponent {
         entry: QueryDevtoolsEntry;
         query: AnyQuery;
     } | null>;
+    protected formSelectedQuery: _angular_core.Signal<{
+        entry: QueryDevtoolsEntry;
+        query: AnyQuery;
+    } | null>;
+    protected timelineSelectedQuery: _angular_core.Signal<{
+        entry: QueryDevtoolsEntry;
+        query: AnyQuery;
+    } | null>;
     protected cacheView: _angular_core.Signal<{
         name: string;
         baseUrl: string;
@@ -16221,16 +16503,98 @@ declare class QueryDevtoolsComponent {
     }[]>;
     /** Map of a component's host element to the query entries it created (for the inspect tool). */
     private elementQueryMap;
+    protected readonly FAULT_STATUSES: {
+        status: number;
+        label: string;
+        retryable: boolean;
+    }[];
+    protected readonly CLEAR_FAULTS: (clientName?: string) => void;
+    /** The ceiling each numeric fault field is clamped to. */
+    private readonly FAULT_LIMITS;
     constructor();
     protected toggleOpen(): void;
     protected clearEvents(): void;
     protected selectClient(name: string | null): void;
     protected clearInspectFilter(): void;
+    protected toggleFacet(facet: QueryListFacet): void;
+    /** Drops the search term and the status chips, keeping the client / inspection scope. */
+    protected clearQueryFilters(): void;
     protected toggleInspect(): void;
     protected startResize(event: PointerEvent): void;
     protected inspectLabel(entries: QueryDevtoolsEntry[]): string;
+    /**
+     * A query's route, split so the template can tell its static path from its path params (each carrying
+     * the value the query used, or `:<name>` while it has none yet) and from the query string of the
+     * request that ran - which is what tells two requests to the same endpoint apart.
+     */
+    protected routeSegments(entry: QueryDevtoolsEntry | undefined, query: AnyQuery): RouteSegment[];
+    /** The full URL of the request a query last made, or `null` while it has not executed. */
+    protected requestUrl(query: AnyQuery): string | null;
+    /**
+     * The args of a query. A query executed imperatively (`execute({ args })`, a sequence step, an auth
+     * query) never writes them to its own `args` signal - only the `withArgs` feature does - so the args
+     * its current request was built from stand in.
+     */
+    protected queryArgs(query: AnyQuery): Omit<any, "response"> | null;
     protected queryStatus(query: AnyQuery): QueryStatus;
+    /**
+     * A request in flight is already refreshing, so reporting it as stale on top of `loading` is noise -
+     * the same precedence the cache tab's freshness column applies.
+     */
     protected isStale(query: AnyQuery): boolean;
+    /**
+     * What a query's current request is doing beyond being loading, or `null` when there is nothing beyond
+     * the status dot to say - so the readout only takes up room while it carries something.
+     */
+    protected requestProgress(query: AnyQuery): RequestProgress | null;
+    /** Why a retry was scheduled, as the panel spells it out. A status of 0 never reached the server. */
+    protected retryCause(status: number): string;
+    protected formatPercent(percentage: number): string;
+    /** A countdown in whole seconds, spelled out the way the cache freshness column does. */
+    protected formatCountdown(ms: number | null): string;
+    protected queryActivity(entry: QueryDevtoolsEntry): QueryActivity;
+    protected linkActivity(link: QueryLink): QueryActivity;
+    protected stackActivity(stack: AnyQueryStack | AnyPagedQueryStack): QueryActivity;
+    protected sequenceActivity(sequence: QuerySequence<unknown[]>): QueryActivity;
+    /** Clears an entry's counters and run history, so the next interaction can be measured on its own. */
+    protected resetStats(entry: QueryDevtoolsEntry): void;
+    /** The same, for every query the timeline covers. */
+    protected resetTimeline(): void;
+    /** A query's runs, newest first - the order a history is read in. */
+    protected queryRuns(entry: QueryDevtoolsEntry): QueryDevtoolsRun[];
+    /**
+     * What a run's status dot and timeline bar colour by. `pending` reuses the panel's loading colour;
+     * `aborted` matches no rule and so falls back to the neutral one.
+     */
+    protected runStatus(run: QueryDevtoolsRun): "loading" | "error" | "success" | "aborted";
+    /** Whether a run can be diffed: it still holds its body, and so does an older run of the same query. */
+    protected canDiffRun(entry: QueryDevtoolsEntry, run: QueryDevtoolsRun): boolean;
+    protected toggleRunDiff(run: QueryDevtoolsRun): void;
+    /**
+     * The response diff of the picked run against the newest older run that still holds a body - which is
+     * not necessarily the run right before it, since a failed run has none to compare.
+     *
+     * `null` unless a run is picked, so a closed diff costs nothing to walk.
+     */
+    protected responseDiff(entry: QueryDevtoolsEntry): {
+        before: QueryDevtoolsRun;
+        after: QueryDevtoolsRun;
+        diff: QueryDevtoolsDiff;
+    } | null;
+    /** Opens a query in the Queries tab - the Events tab is a way in, not a dead end. */
+    protected selectQuery(id: string): void;
+    protected selectTimelineRow(row: TimelineRow): void;
+    protected selectEventRow(item: EventLogItem): void;
+    /** A value on one line, for a diff row or a form field. The full tree would bury the row it sits in. */
+    protected inlineValue(value: unknown): string;
+    /** A byte count the way a network panel spells one out. */
+    protected formatBytes(bytes: number): string;
+    /**
+     * A transferred size, marked `≈` when any part of it was measured from a decoded body instead of read
+     * from a `content-length` header - such a size ignores transport compression.
+     */
+    protected formatTransferred(bytes: number, isEstimated: boolean): string;
+    protected formatDuration(ms: number | null): string;
     protected executeQuery(query: AnyQuery, allowCache: boolean): void;
     protected resetQuery(query: AnyQuery): void;
     /**
@@ -16239,6 +16603,15 @@ declare class QueryDevtoolsComponent {
      * a plain-text fallback.
      */
     protected copyReport(entry: QueryDevtoolsEntry, query: AnyQuery): void;
+    /** Copies one query as an Insomnia collection, for `Import > From Clipboard`. */
+    protected copyInsomniaRequest(entry: QueryDevtoolsEntry, query: AnyQuery): void;
+    /** Copies the GraphQL document as displayed — dedented, so it pastes straight into a playground. */
+    protected copyGqlDocument(doc: string): void;
+    /**
+     * Downloads every query currently listed (so the client filter and the inspection filter both apply)
+     * as one Insomnia collection, filed into a folder per query client.
+     */
+    protected downloadInsomniaCollection(): void;
     protected openResponseEditor(query: AnyQuery): void;
     protected openArgsEditor(query: AnyQuery): void;
     protected applyResponse(query: AnyQuery): void;
@@ -16248,6 +16621,21 @@ declare class QueryDevtoolsComponent {
     protected forceError(query: AnyQuery): void;
     protected forceEmpty(query: AnyQuery): void;
     protected clearForced(query: AnyQuery): void;
+    /**
+     * Arms one numeric field of a client's fault from an input's raw value. Clamped here rather than left
+     * to the input's `min`/`max`, which a typed-in (or pasted) value ignores.
+     */
+    protected armFaultValue(options: {
+        clientName: string;
+        field: NumericFaultField;
+        value: string;
+    }): void;
+    protected armFaultStatus(options: {
+        clientName: string;
+        value: string;
+    }): void;
+    /** Whether the default retry policy retries the status a client is armed to fail with. */
+    protected isFaultStatusRetryable(status: number): boolean;
     protected refetchCacheEntry(entry: QueryRepositoryCacheEntry): void;
     protected evictCacheEntry(repository: QueryRepository, key: string): void;
     protected cacheFreshness(entry: QueryRepositoryCacheEntry): string;
@@ -16271,33 +16659,40 @@ declare class QueryDevtoolsComponent {
     protected asSequence(entry: QueryDevtoolsEntry): QuerySequence<unknown[]>;
     protected asAuth(entry: QueryDevtoolsEntry): AnyBearerAuthProvider;
     protected asWs(entry: QueryDevtoolsEntry): WebSocketDevtoolsHandle;
+    protected asForm(entry: QueryDevtoolsEntry): QueryDevtoolsFormHandle;
+    /**
+     * The queries a form feeds, discovered from the reads its `value()` recorded while their args were
+     * built - so a form that nothing consumes yet reads as exactly that.
+     */
+    protected queriesDrivenByForm(entry: QueryDevtoolsEntry): QueryLink[];
+    /** The reverse: the forms whose value a query's args read. */
+    protected formsDrivingQuery(entry: QueryDevtoolsEntry): QueryDevtoolsEntry[];
+    protected selectForm(id: string): void;
+    /**
+     * The refreshes that re-executed a query, newest first - the answer to "why did this refetch?". Read
+     * off the event log, so it goes back exactly as far as the log does.
+     */
+    protected refreshesFor(entryId: string): {
+        id: number;
+        timestamp: number;
+        label: string;
+    }[];
+    /** What asked for a refresh, on one line. */
+    protected causeLabel(cause: QueryRefreshCause): string;
     /** Derives the per-step status of a sequence step from its live progress signals. */
     protected sequenceStepStatus(sequence: QuerySequence<unknown[]>, index: number): QuerySequenceStatus;
     protected authTokenPayload(auth: AnyBearerAuthProvider): Record<string, unknown> | null;
-    protected queriesForStack(stack: AnyQueryStack | AnyPagedQueryStack): {
-        id: string;
-        query: AnyQuery;
-        method: string;
-        route: string;
-        clientName: string;
-        clientBaseUrl: string;
-    }[];
+    protected queriesForStack(stack: AnyQueryStack | AnyPagedQueryStack): QueryLink[];
     /** Identifying info for a stack, derived from its (uniform) inner queries. */
     protected stackIdentity(stack: AnyQueryStack | AnyPagedQueryStack): {
         method: string;
-        route: string;
+        segments: RouteSegment[];
         baseUrl: string;
     };
-    protected authFeatures(auth: AnyBearerAuthProvider): string[];
     protected authQueryKeys(auth: AnyBearerAuthProvider): string[];
     /** Countdown to the access-token's `exp` (the point a refresh becomes due), or `null` if unknown. */
     protected authTokenExpiry(auth: AnyBearerAuthProvider): string | null;
-    protected queriesForSequence(sequence: QuerySequence<unknown[]>): {
-        id: string;
-        query: AnyQuery;
-        method: string;
-        route: string;
-    }[];
+    protected queriesForSequence(sequence: QuerySequence<unknown[]>): QueryLink[];
     /** The snapshot of a sequence step, once it has run (holds the args in and the response/error out). */
     protected stepSnapshot(sequence: QuerySequence<unknown[]>, index: number): AnyQuerySnapshot | null;
     protected isStepExpanded(entryId: string, index: number): boolean;
@@ -16305,17 +16700,72 @@ declare class QueryDevtoolsComponent {
     /** Dedents a GraphQL document (template-literal indentation) for readable display. */
     protected gqlDocument(doc: string): string;
     protected featureLabel(type: string): string;
+    /** A feature and its options on one line, for a report or a chip's tooltip. */
+    featureSummary(feature: QueryDevtoolsFeature): string;
+    /** The features of the client behind a cache tab card, or `null` for a client without any. */
+    protected clientFeatures(client: QueryClient | null | undefined): QueryDevtoolsFeature[] | null;
     protected formatTime(timestamp: number | null): string;
     protected eventTypeLabel(event: EventLogItem): string;
+    /** A registered query as a row that opens the detail drawer. */
+    private queryLinkFor;
+    /** The activity of one entry, or the total of a group of them (a stack's queries, a whole tab). */
+    private activityOf;
+    /** An activity summary on one line, for a report. `null` for a query that has not run. */
+    private activitySummary;
+    /** A query matches the chips if it is in any of the picked states - chips widen, they don't intersect. */
+    private matchesFacets;
+    /**
+     * What the search box matches against: what the row shows, plus the path of the request that ran for a
+     * query whose template differs from it.
+     *
+     * Deliberately not the origin or the client name - both repeat across most entries, so a short term
+     * ("p") would match nearly everything through the host name. Scoping to a client is the picker's job.
+     */
+    private queryHaystack;
+    /** {@link routeSegments} as a plain string, for the places that cannot render markup. */
+    private queryRoute;
+    /**
+     * Describes a query the way a replay outside the app needs it: the URL, headers and body of the
+     * request it last made, or - for a query that has not run - what its current args would send.
+     */
+    private insomniaRequest;
+    /**
+     * The token refreshes the given requests authenticate with - one per auth provider they name, and
+     * only for a provider that is logged in, since a refresh request without a refresh token has
+     * nothing to send.
+     */
+    private insomniaTokenRefreshes;
+    private insomniaTokenRefresh;
+    /**
+     * Where the access token sits in the refresh response. A provider's `extractTokens` can pull it out
+     * of any shape, so the path is recovered by finding the live token in the last auth response - with
+     * the default extractor's `$.accessToken` as the fallback.
+     */
+    private accessTokenPath;
+    /**
+     * How long Insomnia may reuse a stored refresh response: the access token's own lifetime with a
+     * margin, so the chain refreshes shortly before the token it hands out would expire. Capped at an
+     * hour - a long-lived (or bogus) `exp` should still hand out a token minted this session.
+     */
+    private accessTokenMaxAge;
+    /**
+     * The headers a replay needs, including the ones the query client adds. Header providers can throw
+     * (a secure query's needs an access token), in which case the request is exported without them.
+     */
+    private insomniaHeaders;
+    private downloadFile;
     private stepKey;
     private applyResize;
     private updateInspectHover;
     private selectInspectedQuery;
     private selectionKey;
+    /** Writes to the clipboard and ticks `copied` on success. `html` is omitted for plain-text payloads. */
     private writeToClipboard;
     private responseStatus;
     private findQuery;
     private pushEvent;
+    private refreshedRequestOf;
+    private pushEventItem;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<QueryDevtoolsComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<QueryDevtoolsComponent, "et-query-devtools", never, {}, {}, never, never, true, never>;
 }