@workerdeck/ui 0.15.0 → 0.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/README.md +60 -0
  2. package/build/{SessionPanel-J2U8v88q.d.mts → SessionPanel-CnNYEX80.d.mts} +170 -21
  3. package/build/{SessionPanel-DI1NO4l8.mjs → SessionPanel-DMPhsNlW.mjs} +4759 -1483
  4. package/build/SessionPanel-DMPhsNlW.mjs.map +1 -0
  5. package/build/{format-ljc3lKpA.d.mts → format-DfI_je9S.d.mts} +1 -1
  6. package/build/format.d.mts +39 -4
  7. package/build/format.mjs +2 -118
  8. package/build/index.d.mts +493 -45
  9. package/build/index.mjs +343 -17
  10. package/build/index.mjs.map +1 -1
  11. package/build/status-Ydzi7n6j.mjs +143 -0
  12. package/build/status-Ydzi7n6j.mjs.map +1 -0
  13. package/build/workspace.d.mts +9 -1
  14. package/build/workspace.mjs +108 -5
  15. package/build/workspace.mjs.map +1 -1
  16. package/package.json +16 -7
  17. package/src/components/agent/Composer.tsx +189 -89
  18. package/src/components/agent/Conversation.tsx +12 -12
  19. package/src/components/agent/FileCard.tsx +0 -26
  20. package/src/components/agent/FileTree.tsx +9 -8
  21. package/src/components/agent/Loader.tsx +22 -72
  22. package/src/components/agent/Message.tsx +11 -46
  23. package/src/components/agent/PermissionPrompt.tsx +0 -92
  24. package/src/components/agent/ProjectIcon.tsx +119 -0
  25. package/src/components/agent/QuestionPrompt.tsx +0 -122
  26. package/src/components/agent/Reasoning.tsx +5 -19
  27. package/src/components/agent/Response.tsx +1 -132
  28. package/src/components/agent/SessionBrowser.tsx +84 -3
  29. package/src/components/agent/SessionPanel.tsx +249 -28
  30. package/src/components/agent/SessionWorkspace.tsx +29 -0
  31. package/src/components/agent/StatusBar.tsx +20 -4
  32. package/src/components/agent/ToolCallCard.tsx +85 -112
  33. package/src/components/agent/Transcript.tsx +780 -203
  34. package/src/components/agent/UsageDialog.tsx +20 -106
  35. package/src/components/agent/UsageMeters.tsx +133 -0
  36. package/src/components/agent/pulse.tsx +3 -2
  37. package/src/components/agent/tool-result-fetch.tsx +36 -0
  38. package/src/components/agent/tool-result-image.tsx +209 -0
  39. package/src/components/agent/transcript-rows.ts +173 -0
  40. package/src/components/agent/transcript-variant.tsx +29 -51
  41. package/src/components/agent/use-height-epoch.ts +60 -0
  42. package/src/components/agent/use-path-links.ts +147 -0
  43. package/src/components/agent/use-transcript-jumps.ts +190 -0
  44. package/src/components/prompt-area/cursor-helpers.ts +65 -0
  45. package/src/components/prompt-area/use-prompt-area.ts +16 -10
  46. package/src/components/terminal/PermissionPrompt.tsx +119 -0
  47. package/src/components/terminal/QuestionPrompt.tsx +322 -0
  48. package/src/components/terminal/StatusLine.tsx +159 -0
  49. package/src/components/terminal/TerminalTranscript.tsx +225 -0
  50. package/src/components/terminal/affordances.tsx +118 -0
  51. package/src/components/terminal/blocks.ts +232 -0
  52. package/src/components/terminal/diff.tsx +130 -0
  53. package/src/components/terminal/height.ts +770 -0
  54. package/src/components/terminal/image-box.ts +53 -0
  55. package/src/components/terminal/items.tsx +486 -0
  56. package/src/components/terminal/markdown.tsx +191 -0
  57. package/src/components/terminal/press.tsx +120 -0
  58. package/src/components/terminal/prompt.tsx +343 -0
  59. package/src/components/terminal/result-preview.ts +86 -0
  60. package/src/components/terminal/row.tsx +132 -0
  61. package/src/components/terminal/scrubber.tsx +784 -0
  62. package/src/components/terminal/surface.tsx +80 -0
  63. package/src/components/terminal/tool-run.ts +224 -0
  64. package/src/index.ts +36 -1
  65. package/src/lib/status.ts +59 -3
  66. package/src/lib/tool-icon.ts +14 -0
  67. package/src/styles/terminal.css +1081 -0
  68. package/src/styles/theme.css +41 -0
  69. package/build/SessionPanel-DI1NO4l8.mjs.map +0 -1
  70. package/build/format.mjs.map +0 -1
  71. package/src/components/agent/line-prompt.tsx +0 -249
package/build/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
- import { a as formatDuration, c as formatRelativeTime, d as rateLimitWindowSeconds, f as toolInputPreview, i as formatCountdown, l as formatTokens, n as formatBytes, o as formatRateLimitWindow, r as formatCost, s as formatRateLimitWindowLong, t as formatAgoPrecise, u as friendlyModel } from "./format-ljc3lKpA.mjs";
2
- import { _ as PermissionModeSelectProps, a as SessionVitals, c as TranscriptFont, d as useTranscriptDensity, f as useTranscriptVariant, g as PermissionModeSelect, h as PermissionModeMeta, i as SessionSurfacePanel, l as TranscriptVariant, m as PermissionModeChoice, n as SessionPanel, o as TranscriptDensity, p as PERMISSION_MODES, r as SessionPanelProps, s as TranscriptDensityProvider, t as SessionControls, u as TranscriptVariantProvider, v as permissionModeChoices, y as permissionModeMeta } from "./SessionPanel-J2U8v88q.mjs";
1
+ import { a as formatDuration, c as formatRelativeTime, d as rateLimitWindowSeconds, f as toolInputPreview, i as formatCountdown, l as formatTokens, n as formatBytes, o as formatRateLimitWindow, r as formatCost, s as formatRateLimitWindowLong, t as formatAgoPrecise, u as friendlyModel } from "./format-DfI_je9S.mjs";
2
+ import { C as permissionModeChoices, S as PermissionModeSelectProps, _ as useAffordances, a as SessionVitals, b as PermissionModeMeta, c as TranscriptDensityProvider, d as TranscriptVariantProvider, f as useTranscriptDensity, g as WithActions, h as TerminalAffordances, i as SessionSurfacePanel, l as TranscriptFont, m as CopyAction, n as SessionPanel, o as TerminalMetrics, p as useTranscriptVariant, r as SessionPanelProps, s as TranscriptDensity, t as SessionControls, u as TranscriptVariant, v as PERMISSION_MODES, w as permissionModeMeta, x as PermissionModeSelect, y as PermissionModeChoice } from "./SessionPanel-CnNYEX80.mjs";
3
3
  import * as _$react from "react";
4
4
  import { ButtonHTMLAttributes, FunctionComponent, HTMLAttributes, InputHTMLAttributes, ReactElement, ReactNode, Ref, RefObject, TextareaHTMLAttributes } from "react";
5
5
  import { VariantProps } from "class-variance-authority";
@@ -15,7 +15,7 @@ import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
15
15
  import * as _$_base_ui_react_tooltip0 from "@base-ui/react/tooltip";
16
16
  import { Tooltip } from "@base-ui/react/tooltip";
17
17
  import { toast } from "sonner";
18
- import { ContextUsage, ModelOption, PermissionRequest, ProfileEngine, QuestionBehavior, RateLimitInfo, SessionInfo, SessionRow, SessionStatus, SkillInfo, SlashCommandInfo, UserQuestion, ViewConfig, WorkspaceScope } from "@workerdeck/protocol";
18
+ import { ContextUsage, FilePatch, ModelOption, PermissionRequest, ProfileEngine, ProjectIcon as ProjectIcon$1, QuestionBehavior, RateLimitInfo, SessionInfo, SessionRow, SessionStatus, SkillInfo, SlashCommandInfo, UsageWindowRow, UserQuestion, ViewConfig, WorkspaceScope } from "@workerdeck/protocol";
19
19
  import { ConnectionState, TranscriptItem, TranscriptState, UseAttachmentsResult } from "@workerdeck/react";
20
20
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
21
21
  import { WorkerDeckClient } from "@workerdeck/client";
@@ -758,6 +758,91 @@ declare function isSegmentsEmpty(segments: Segment[]): boolean;
758
758
  /** Extracts chips matching a specific trigger character. */
759
759
  declare function getChipsByTrigger(segments: Segment[], trigger: string): ChipSegment[];
760
760
  //#endregion
761
+ //#region src/components/terminal/row.d.ts
762
+ /**
763
+ * The primitives every terminal row is built from.
764
+ *
765
+ * There are three, and that is the whole vocabulary: a {@link Row} (a gutter
766
+ * cell and a body cell), a {@link Blank} (one empty line), and a {@link Band} (a
767
+ * run of rows carrying a full-bleed background). Anything the theme draws — a
768
+ * message, a tool call, a diff hunk, an approval prompt — is some arrangement of
769
+ * those, which is what keeps the grid a property of the renderer rather than a
770
+ * thing each component re-derives.
771
+ *
772
+ * Geometry is in `styles/terminal.css`. These components choose a class, a
773
+ * marker and a tone; they never carry a measurement.
774
+ */
775
+ /** The palette, as a name. See the `[data-tone]` rules in `terminal.css`. */
776
+ type Tone = 'fg' | 'bright' | 'dim' | 'faint' | 'mark' | 'blue' | 'green' | 'red' | 'yellow' | 'magenta';
777
+ interface RowProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
778
+ /**
779
+ * What sits in the gutter — `●`, `⎿`, `>`, a list bullet, or nothing. Kept to
780
+ * the width of the gutter (`--term-cell`, two columns by default): a wider
781
+ * marker would push its own body off the column every other row starts on.
782
+ * Omitted, the gutter is still drawn as empty space, so an unmarked row's
783
+ * text lines up with a marked one's.
784
+ */
785
+ glyph?: ReactNode;
786
+ /** The marker's colour. Defaults to dim — the marker is structure, not content. */
787
+ glyphTone?: Tone;
788
+ /** The body's colour. */
789
+ tone?: Tone;
790
+ bold?: boolean;
791
+ /** Indent levels, one character cell each. A child row's marker then sits
792
+ * exactly under its parent row's first letter. */
793
+ indent?: 0 | 1 | 2 | 3;
794
+ /**
795
+ * Gutter width in columns, when the marker needs other than two — an ordered
796
+ * list's `10.` is four, a prompt's `❯ 1.` is five, and a framed payload wants
797
+ * `0`. Changes only this row's split, so the body still starts on a whole
798
+ * column.
799
+ */
800
+ columns?: number;
801
+ children?: ReactNode;
802
+ }
803
+ declare function Row({
804
+ glyph,
805
+ glyphTone,
806
+ tone,
807
+ bold,
808
+ indent,
809
+ columns,
810
+ className,
811
+ children,
812
+ style,
813
+ ...props
814
+ }: RowProps): _$react.JSX.Element;
815
+ /**
816
+ * One empty line — the theme's only vertical spacing.
817
+ *
818
+ * A terminal separates blocks with a blank line, not with padding, and saying it
819
+ * that way has a practical payoff: spacing is part of the row list, so it can be
820
+ * decided by whoever knows whether two blocks belong together (a tool call and
821
+ * its output do not get one; two assistant turns do), instead of by a margin
822
+ * rule that cannot tell them apart.
823
+ */
824
+ declare function Blank(): _$react.JSX.Element;
825
+ /**
826
+ * A run of rows under a background: a code block, a command's output, a diff
827
+ * hunk. Full-bleed — the wash reaches the scroller's edges, because in a
828
+ * terminal the line is the full width of the screen. See `--term-bleed` on
829
+ * {@link TerminalSurface}.
830
+ */
831
+ declare function Band({
832
+ className,
833
+ ...props
834
+ }: HTMLAttributes<HTMLDivElement>): _$react.JSX.Element;
835
+ /** Inline colour/weight inside a row's body. */
836
+ declare function Ink({
837
+ tone,
838
+ bold,
839
+ className,
840
+ ...props
841
+ }: HTMLAttributes<HTMLSpanElement> & {
842
+ tone?: Tone;
843
+ bold?: boolean;
844
+ }): _$react.JSX.Element;
845
+ //#endregion
761
846
  //#region src/components/agent/Transcript.d.ts
762
847
  interface TranscriptProps {
763
848
  state: TranscriptState;
@@ -775,9 +860,9 @@ interface TranscriptProps {
775
860
  * on the host (codex's `image_gen`). Omit and those cards name the path. */
776
861
  hostImage?: (path: string) => Promise<string | undefined>;
777
862
  /**
778
- * How a turn is drawn: `cards` (default, the chat convention) or `lines` —
779
- * full-width transparent line items with a gutter glyph, for hosts where
780
- * vertical space is scarce. See {@link TranscriptVariant}.
863
+ * How a turn is drawn: `cards` (default, the chat convention) or `terminal`,
864
+ * which is not a set of branches in these components but its own renderer.
865
+ * See {@link TranscriptVariant}.
781
866
  */
782
867
  variant?: TranscriptVariant;
783
868
  /**
@@ -786,6 +871,42 @@ interface TranscriptProps {
786
871
  * {@link TranscriptVariant}. See {@link TranscriptDensity}.
787
872
  */
788
873
  density?: TranscriptDensity;
874
+ /** Terminal theme only: the character cell, in whole pixels. See
875
+ * {@link TerminalSurface}. */
876
+ fontSize?: number;
877
+ lineHeight?: number;
878
+ /** Terminal theme only: the pointer affordances a real terminal cannot offer.
879
+ * `false` for none. See {@link TerminalAffordances}. */
880
+ affordances?: TerminalAffordances | boolean;
881
+ /** Terminal theme only: hold the prompt of the turn being read at the top of
882
+ * the scroller. The *real* row is pinned, not a copy — see `TranscriptRows`. */
883
+ stickyPrompt?: boolean;
884
+ /**
885
+ * Terminal theme only: mount the overview-ruler scrubber — a 2ch rail of
886
+ * marks (your prompts, each turn's response and result as one mark, errors,
887
+ * the pending approval, the catch-up boundary) that replaces the native
888
+ * scrollbar. Ignored under `cards`: the rail's positions ride the height
889
+ * calculator, which has no claim there. With `affordances={false}` the rail
890
+ * degrades to passive paint — no drag, peek or click — and the native
891
+ * scrollbar stays. See {@link TerminalScrubber}.
892
+ */
893
+ scrubber?: boolean;
894
+ /**
895
+ * Bookmarked item indices, painted as full-width marks on the rail. Paint
896
+ * only, deliberately: the store — and the affordance that writes it — is
897
+ * the client's, the way the unread watermarks are, not the panel's.
898
+ */
899
+ scrubberMarks?: readonly number[];
900
+ /**
901
+ * The attach replay is still landing (`useClaudeSession().replaying`): rows
902
+ * render, measure and pin exactly as normal but nothing paints, and a loading
903
+ * line shows in their place; when it flips false the settled tail appears in
904
+ * one frame. Hiding is by *visibility*, never by not mounting — see the
905
+ * comment at the render site. Optional: an embedder that never passes it
906
+ * gets today's behaviour, and a short or empty session holds for no visible
907
+ * time at all (the frame between attach and replay-complete).
908
+ */
909
+ replaying?: boolean;
789
910
  /**
790
911
  * Catch-up: `from` is how many items had been seen last time, `since` when
791
912
  * that was. A recap row is drawn at that boundary and everything above it is
@@ -804,6 +925,30 @@ interface TranscriptProps {
804
925
  * catch-up strip never touch it. `null` while no transcript is mounted.
805
926
  */
806
927
  jumpToRecapRef?: RefObject<(() => void) | null>;
928
+ /**
929
+ * Filled with a closure that re-pins the transcript to the bottom, so a host
930
+ * can resume following after the reader has scrolled away. The panel presses
931
+ * it on send: choosing to say something is choosing to watch what happens
932
+ * next, and a transcript left parked where you were reading makes a sent
933
+ * message look like it did nothing at all.
934
+ */
935
+ repinRef?: RefObject<(() => void) | null>;
936
+ /**
937
+ * Scroll a tool call into view — bump `nonce` to ask again for the same one.
938
+ *
939
+ * The seam a *list* needs: sub-agent work is nested inside the `Task` call
940
+ * that spawned it, so "open that sub-agent" can only ever mean "take me to its
941
+ * row". A `parentToolUseId` works here as well as the Task's own id, since the
942
+ * lookup resolves an absorbed child to the row that folded it.
943
+ *
944
+ * A prop rather than a ref (the shape `jumpToRecapRef` uses) because the asker
945
+ * is outside this webview entirely and the request travels as data; a ref
946
+ * would need a live closure at the other end of a postMessage bridge.
947
+ */
948
+ reveal?: {
949
+ toolUseId: string;
950
+ nonce: number;
951
+ };
807
952
  className?: string;
808
953
  }
809
954
  declare function Transcript({
@@ -814,29 +959,235 @@ declare function Transcript({
814
959
  hostImage,
815
960
  variant,
816
961
  density,
962
+ fontSize,
963
+ lineHeight,
964
+ affordances,
965
+ stickyPrompt,
966
+ scrubber,
967
+ scrubberMarks,
968
+ replaying,
817
969
  catchUp,
818
970
  jumpToRecapRef,
971
+ repinRef,
972
+ reveal,
819
973
  className
820
974
  }: TranscriptProps): _$react.JSX.Element;
821
975
  //#endregion
976
+ //#region src/components/terminal/surface.d.ts
977
+ /**
978
+ * The root of the terminal theme: the element that establishes the character
979
+ * cell every row inside it lands on.
980
+ *
981
+ * It exists as a component rather than a class because the cell has to be *set*
982
+ * somewhere — the font, the size and the line height together are what make
983
+ * `1ch` mean one column and `--term-line` mean one row — and because that is the
984
+ * one place a host is allowed to change the metrics. Everything below this
985
+ * element measures itself in those two units and never in pixels.
986
+ *
987
+ * The geometry and the palette live in `styles/terminal.css`; this only names
988
+ * the element and hands down the two numbers.
989
+ */
990
+ interface TerminalSurfaceProps extends HTMLAttributes<HTMLDivElement> {
991
+ /**
992
+ * Cell size in **whole pixels**. Fractional values put every other row on a
993
+ * half-pixel: text softens and the diff bands show a seam, which is exactly
994
+ * what a grid renderer must not do. Defaults (13/18) are the CLI's own.
995
+ */
996
+ fontSize?: number;
997
+ lineHeight?: number;
998
+ /**
999
+ * How far a full-bleed band reaches past the content edge — normally the
1000
+ * scroller's own horizontal padding. A band cancels it with matched negative
1001
+ * margin and padding, so a diff hunk's wash runs to the viewport edge the way
1002
+ * a terminal's line does, instead of stopping at a gutter.
1003
+ */
1004
+ bleed?: string;
1005
+ /**
1006
+ * The things a real terminal cannot do — the pointer hover fill, the
1007
+ * hover-revealed copy actions. `false` turns them all off, an object picks.
1008
+ * Default: all on. See {@link TerminalAffordances}; none of them costs layout,
1009
+ * so switching them off changes no glyph's position.
1010
+ */
1011
+ affordances?: TerminalAffordances | boolean;
1012
+ }
1013
+ declare function TerminalSurface({
1014
+ fontSize,
1015
+ lineHeight,
1016
+ bleed,
1017
+ affordances,
1018
+ className,
1019
+ style,
1020
+ children,
1021
+ ...props
1022
+ }: TerminalSurfaceProps): _$react.JSX.Element;
1023
+ //#endregion
1024
+ //#region src/components/terminal/TerminalTranscript.d.ts
1025
+ /**
1026
+ * The transcript, drawn as a terminal.
1027
+ *
1028
+ * The whole of the layout is here and it is four lines long, which is the point:
1029
+ * items become row blocks, a blank line goes between blocks that do not belong
1030
+ * together, and the working line is one more row at the end. There is no gap
1031
+ * scale, no density knob and no variant branch — a terminal has one line height
1032
+ * and one type size, and everything the theme can express is expressed in which
1033
+ * rows exist and what marker each carries.
1034
+ *
1035
+ * Not virtualized yet: the row blocks are the part that has to be right first,
1036
+ * and the existing `Transcript` already owns a hard-won virtualizer plus the
1037
+ * scroll-regime rules it needs. This renders into that shell when the rows are
1038
+ * settled, rather than growing a second copy of that logic.
1039
+ */
1040
+ interface TerminalTranscriptProps {
1041
+ state: TranscriptState;
1042
+ /** Builds the download URL for a delivered file. */
1043
+ fileUrl?: (path: string) => string;
1044
+ /** Cell metrics, in whole pixels. See {@link TerminalSurface}. */
1045
+ fontSize?: number;
1046
+ lineHeight?: number;
1047
+ /** The pointer affordances a real terminal has no way to offer — hover fill,
1048
+ * hover-revealed copy. `false` for none. See {@link TerminalAffordances}. */
1049
+ affordances?: TerminalAffordances | boolean;
1050
+ className?: string;
1051
+ }
1052
+ /**
1053
+ * One transcript item as terminal rows. Exported because the virtualized shell
1054
+ * in `agent/Transcript.tsx` renders rows through it: the theme owns how a row
1055
+ * looks, that component owns which rows are mounted, and neither needs a copy
1056
+ * of the other.
1057
+ */
1058
+ declare function TerminalItemView({
1059
+ item,
1060
+ fileUrl
1061
+ }: {
1062
+ item: TranscriptItem;
1063
+ fileUrl?: (path: string) => string;
1064
+ }): _$react.JSX.Element | null;
1065
+ declare function TerminalTranscript({
1066
+ state,
1067
+ fileUrl,
1068
+ fontSize,
1069
+ lineHeight,
1070
+ affordances,
1071
+ className
1072
+ }: TerminalTranscriptProps): _$react.JSX.Element;
1073
+ //#endregion
1074
+ //#region src/components/terminal/StatusLine.d.ts
1075
+ interface TerminalStatusLineProps {
1076
+ state: TranscriptState;
1077
+ /** Plan windows to read from, when they should not be the session's own — the
1078
+ * gateway's per-profile state merged over this transcript's. See
1079
+ * {@link StatusBarProps.rateLimits}. Absent = `state.rateLimits`. */
1080
+ rateLimits?: Record<string, RateLimitInfo>;
1081
+ /** How the client is doing at reaching the gateway. Wins the status slot when
1082
+ * the socket is down — see above. */
1083
+ connection?: ConnectionState;
1084
+ /** Opens the panel that answers each reading's own question. Omit and the
1085
+ * reading is text rather than something to press. */
1086
+ onOpenStatus?: () => void;
1087
+ onOpenContext?: () => void;
1088
+ onOpenUsage?: () => void;
1089
+ }
1090
+ declare function TerminalStatusLine({
1091
+ state,
1092
+ rateLimits,
1093
+ connection,
1094
+ onOpenStatus,
1095
+ onOpenContext,
1096
+ onOpenUsage
1097
+ }: TerminalStatusLineProps): _$react.JSX.Element;
1098
+ //#endregion
1099
+ //#region src/components/terminal/PermissionPrompt.d.ts
1100
+ /**
1101
+ * The approval, as the CLI draws it: a rule, what is being asked and about what,
1102
+ * the change itself, a dashed rule, the question, numbered answers, and the keys.
1103
+ *
1104
+ * Two things it does that the card version does not, both taken from the CLI:
1105
+ *
1106
+ * - **It shows the change, not the payload.** For a file edit, `old_string` and
1107
+ * `new_string` are a diff — so it renders one, rather than the JSON input a
1108
+ * reader would have to diff in their head. Without line numbers, necessarily:
1109
+ * the edit has not happened and this client has never read the file (see
1110
+ * {@link previewPatch}). Everything else falls back to the input.
1111
+ * - **The heading is the engine's own sentence.** `displayName` ("Edit file")
1112
+ * over `title`, never "wants to use {tool}" composed here — for codex an
1113
+ * approval is an *escalation after a sandbox refusal*, and the runner has
1114
+ * already written the sentence that says so.
1115
+ */
1116
+ interface TerminalPermissionPromptProps {
1117
+ request: PermissionRequest;
1118
+ onApprove: (requestId: string) => void;
1119
+ /** `message` is fed back to the agent, which can then try something else;
1120
+ * `interrupt` also stops the turn. */
1121
+ onDeny: (requestId: string, message?: string, interrupt?: boolean) => void;
1122
+ }
1123
+ declare function TerminalPermissionPrompt({
1124
+ request,
1125
+ onApprove,
1126
+ onDeny
1127
+ }: TerminalPermissionPromptProps): _$react.JSX.Element;
1128
+ //#endregion
1129
+ //#region src/components/terminal/QuestionPrompt.d.ts
1130
+ interface TerminalQuestionPromptProps {
1131
+ /** A pending permission whose toolName is 'AskUserQuestion'. */
1132
+ request: PermissionRequest;
1133
+ /** Allow the tool with `updatedInput` (the original input plus `answers`). */
1134
+ onAnswer: (requestId: string, updatedInput: Record<string, unknown>) => void;
1135
+ /** Deny the tool — the model proceeds without an answer. */
1136
+ onDismiss: (requestId: string, message?: string) => void;
1137
+ }
1138
+ declare function TerminalQuestionPrompt({
1139
+ request,
1140
+ onAnswer,
1141
+ onDismiss
1142
+ }: TerminalQuestionPromptProps): _$react.JSX.Element;
1143
+ //#endregion
1144
+ //#region src/components/terminal/diff.d.ts
1145
+ /**
1146
+ * A patch for a change that has **not happened yet** — an approval prompt's
1147
+ * `Edit`, where the input names the old and new text but no line numbers exist
1148
+ * because the edit has not been applied and this client has never read the file.
1149
+ *
1150
+ * `newStart: 0` is how it says so, and {@link TerminalDiff} reads that back: a
1151
+ * diff whose hunks all start at zero renders without a number column rather than
1152
+ * printing a column of zeroes or inventing an offset.
1153
+ */
1154
+ declare function previewPatch(input: unknown): FilePatch | undefined;
1155
+ declare function TerminalDiff({
1156
+ patch
1157
+ }: {
1158
+ patch: FilePatch;
1159
+ }): _$react.JSX.Element;
1160
+ //#endregion
1161
+ //#region src/components/terminal/markdown.d.ts
1162
+ interface TerminalMarkdownProps {
1163
+ children: string;
1164
+ /** Streaming text: tolerate half-written markdown (unclosed fences, half links). */
1165
+ streaming?: boolean;
1166
+ className?: string;
1167
+ }
1168
+ declare const TerminalMarkdown: _$react.MemoExoticComponent<({
1169
+ children,
1170
+ streaming,
1171
+ className
1172
+ }: TerminalMarkdownProps) => _$react.JSX.Element>;
1173
+ //#endregion
822
1174
  //#region src/components/agent/Conversation.d.ts
823
1175
  interface ConversationProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
824
1176
  children: ReactNode;
825
- /**
826
- * How the view follows content that grows. `'smooth'` is right for a live
827
- * turn — the text scrolls as it is written. `'instant'` is right while a
828
- * transcript is *filling* (an attach replaying a whole session), where
829
- * animating each arrival makes opening a session a several-second journey
830
- * from its first row to its last.
831
- */
832
- resize?: 'smooth' | 'instant';
833
1177
  }
834
1178
  /** Scroll container that stays pinned to the bottom while streaming, unless the user
835
- * scrolls up — plus a floating scroll-to-bottom button. */
1179
+ * scrolls up — plus a floating scroll-to-bottom button.
1180
+ *
1181
+ * **Nothing here animates its scroll position.** `initial` and `resize` are both
1182
+ * `'instant'` and are no longer configurable: the follow spring's job is to
1183
+ * *stay* at the bottom, not to travel there, and every travel a reader has ever
1184
+ * complained about on this surface was an animation we asked for. The `resize`
1185
+ * prop used to exist so a caller could pick, which required the caller to know
1186
+ * whether the transcript was streaming or replaying — a latch's worth of
1187
+ * machinery to decide something that has one right answer. */
836
1188
  declare function Conversation({
837
1189
  className,
838
1190
  children,
839
- resize,
840
1191
  ...props
841
1192
  }: ConversationProps): _$react.JSX.Element;
842
1193
  declare function ConversationContent({
@@ -866,10 +1217,8 @@ interface MessageProps extends HTMLAttributes<HTMLDivElement> {
866
1217
  * column separates a prompt from the reply it produced. The bubble alone is
867
1218
  * enough to say who spoke.
868
1219
  *
869
- * `lines`: both are left-aligned full-width line items behind a gutter glyph
870
- * `❯` for what was typed, `●` for what the model said. No bubble: a prompt is
871
- * already distinguishable by its marker, and the bubble's padding is vertical
872
- * space the terminal treatment refuses to spend.
1220
+ * The terminal theme draws none of this: it is its own renderer
1221
+ * (`components/terminal/`) and mounts instead of these rows.
873
1222
  */
874
1223
  declare function Message({
875
1224
  from,
@@ -919,24 +1268,25 @@ interface LoaderProps {
919
1268
  /** Overrides the cycling verb — for a state that has one true name
920
1269
  * ("Starting session…"). */
921
1270
  label?: string;
922
- /** When the current run began, for the elapsed clock. Absent = no clock. */
1271
+ /** When the current run began, for the elapsed clock. Absent = no clock.
1272
+ * Unused by the card treatment; kept so the `cards` and `terminal` loaders
1273
+ * take the same call site in `Transcript`. */
923
1274
  startedAt?: number;
924
- /** Context tokens in play, shown beside the clock. */
1275
+ /** Context tokens in play. Same story as `startedAt`. */
925
1276
  tokens?: number;
926
1277
  className?: string;
927
1278
  }
928
1279
  /**
929
1280
  * "The agent is working and hasn't produced output yet."
930
1281
  *
931
- * `lines`: a terminal working line — the mark's own pulse in the gutter (see
932
- * `pulse.tsx`), a verb, and the readings that answer "should I still be
933
- * waiting?" in one parenthesis. `cards`: the three-dot pulse, unchanged the
934
- * dashboard's loader is not a gutter glyph and has no column to pulse in.
1282
+ * Three dots pulsing in CSS — the chat convention, for the `cards` variant. The
1283
+ * terminal theme has its own working line (`terminal/items.tsx`'s `WorkingRow`,
1284
+ * with the mark's pulse in the gutter and the run's readings beside the verb),
1285
+ * because there it is a *row of the transcript* rather than a spinner floating
1286
+ * over one.
935
1287
  */
936
1288
  declare function Loader({
937
1289
  label,
938
- startedAt,
939
- tokens,
940
1290
  className
941
1291
  }: LoaderProps): _$react.JSX.Element;
942
1292
  //#endregion
@@ -1091,6 +1441,19 @@ interface ComposerProps {
1091
1441
  * empty composer would otherwise spend two rows saying nothing.
1092
1442
  */
1093
1443
  layout?: 'stacked' | 'inline';
1444
+ /**
1445
+ * Terminal theme only: the cell the composer draws on. Passed straight
1446
+ * through to its own {@link TerminalSurface}, and it has to be passed — the
1447
+ * composer sits outside the transcript's scroller, so it establishes a second
1448
+ * surface, and a surface handed no metrics falls back to the 13/18 default. A
1449
+ * host running the transcript at its editor's size and the composer at the
1450
+ * default would have the caret land on a different column from the text above
1451
+ * it, which is the one thing this theme exists to prevent.
1452
+ */
1453
+ fontSize?: number;
1454
+ lineHeight?: number;
1455
+ /** Terminal theme only; see {@link TerminalAffordances}. */
1456
+ affordances?: TerminalAffordances | boolean;
1094
1457
  className?: string;
1095
1458
  ref?: Ref<ComposerHandle>;
1096
1459
  }
@@ -1141,6 +1504,9 @@ declare function Composer({
1141
1504
  attachments,
1142
1505
  toolbar,
1143
1506
  layout,
1507
+ fontSize,
1508
+ lineHeight,
1509
+ affordances,
1144
1510
  className,
1145
1511
  ref
1146
1512
  }: ComposerProps): _$react.JSX.Element;
@@ -1175,6 +1541,15 @@ declare function ModelSelect({
1175
1541
  //#region src/components/agent/StatusBar.d.ts
1176
1542
  interface StatusBarProps {
1177
1543
  state: TranscriptState;
1544
+ /**
1545
+ * Plan windows to draw, when they should not be the session's own. The panel
1546
+ * hands over the gateway's per-profile state merged over this transcript's
1547
+ * reading (`mergeUsage`): a session's own `rate_limit` readings arrive only at
1548
+ * a turn's edges, so one idle since yesterday would otherwise render
1549
+ * yesterday's number as current. Absent = `state.rateLimits`, which is what a
1550
+ * bar composed by hand outside the panel gets.
1551
+ */
1552
+ rateLimits?: Record<string, RateLimitInfo>;
1178
1553
  /** @deprecated Pass {@link StatusBarProps.connection}; kept so an embedder
1179
1554
  * still handing over a boolean keeps working. */
1180
1555
  connected?: boolean;
@@ -1207,6 +1582,7 @@ interface StatusBarProps {
1207
1582
  }
1208
1583
  declare function StatusBar({
1209
1584
  state,
1585
+ rateLimits,
1210
1586
  connected,
1211
1587
  connection,
1212
1588
  onOpenStatus,
@@ -1239,31 +1615,31 @@ declare function ContextDialog({
1239
1615
  //#endregion
1240
1616
  //#region src/components/agent/UsageDialog.d.ts
1241
1617
  interface UsageDialogProps {
1242
- /** Windows in reading order — session, weekly, then per-model weeklies. */
1243
- rateLimits: Array<{
1244
- key: string;
1245
- info: RateLimitInfo;
1246
- }>;
1618
+ /**
1619
+ * Windows in reading order — session, weekly, then per-model weeklies.
1620
+ *
1621
+ * `updatedAt`/`inferredReset` ride each window because the readings no longer
1622
+ * share one clock: the panel merges the gateway's per-profile state over this
1623
+ * session's, so a `five_hour` learned from a sibling session two minutes ago
1624
+ * can sit beside a `seven_day` this session last heard about yesterday.
1625
+ * `inferredReset` marks the ones the *gateway* zeroed because their own reset
1626
+ * time passed with nothing newer — a floor, not a report.
1627
+ */
1628
+ rateLimits: UsageWindowRow[];
1247
1629
  /** claude.ai plan behind the windows ('max', 'pro', …), when there is one. */
1248
1630
  subscriptionType?: string;
1249
1631
  engine: ProfileEngine;
1250
1632
  totalCostUsd: number;
1251
- /** Local receipt time of the last window update. `rate_limit` events are one
1252
- * per turn at best, so a stale reading is normal and worth saying out loud. */
1633
+ /** When the *freshest* of the windows was read, for the footer line. Readings
1634
+ * arrive one per turn at best (and for an idle session, not at all), so a
1635
+ * stale one is normal and worth saying out loud. */
1253
1636
  updatedAt?: number;
1254
1637
  open: boolean;
1255
1638
  onOpenChange: (open: boolean) => void;
1256
1639
  }
1257
1640
  /**
1258
- * The plan's rate-limit windows, spelled out: how much of each is used, how that
1259
- * compares to the pace that would spend the window exactly, and when it resets.
1260
- *
1261
- * The pace marker is the point. A bar alone says "17% used", which is only
1262
- * alarming or reassuring once you know how far into the week you are — so every
1263
- * window draws a tick at the elapsed share of its duration. Left of the tick is
1264
- * under budget, right of it is ahead of it. The duration comes from the window
1265
- * key (5h, 7d) because the CLI reports a reset time and a percentage and never a
1266
- * duration; a window whose key doesn't say gets no marker rather than a guessed one.
1641
+ * The session's view of the plan: every window as a meter (see
1642
+ * {@link UsageMeters}), the plan tier, and what this session itself has cost.
1267
1643
  */
1268
1644
  declare function UsageDialog({
1269
1645
  rateLimits,
@@ -1275,6 +1651,44 @@ declare function UsageDialog({
1275
1651
  onOpenChange
1276
1652
  }: UsageDialogProps): _$react.JSX.Element;
1277
1653
  //#endregion
1654
+ //#region src/components/agent/UsageMeters.d.ts
1655
+ /**
1656
+ * Ticking clock — the countdowns and the pace markers both move with it, and a
1657
+ * minute is the finest resolution either of them prints.
1658
+ *
1659
+ * `active` is what a dialog passes its `open`: a closed panel's clock is a timer
1660
+ * re-rendering something nobody can see.
1661
+ */
1662
+ declare function useMinuteClock(active?: boolean): number;
1663
+ /**
1664
+ * The plan's rate-limit windows, spelled out: how much of each is used, how that
1665
+ * compares to the pace that would spend the window exactly, and when it resets.
1666
+ *
1667
+ * The pace marker is the point. A bar alone says "17% used", which is only
1668
+ * alarming or reassuring once you know how far into the week you are — so every
1669
+ * window draws a tick at the elapsed share of its duration. Left of the tick is
1670
+ * under budget, right of it is ahead of it. The duration comes from the window
1671
+ * key (5h, 7d) because the engine reports a reset time and a percentage and
1672
+ * never a duration; a window whose key doesn't say gets no marker rather than a
1673
+ * guessed one.
1674
+ *
1675
+ * Its own component rather than the Usage dialog's private helper because two
1676
+ * surfaces draw these now — the session panel's Usage panel, from the session's
1677
+ * readings merged with the gateway's, and the dashboard's profile page, straight
1678
+ * off `ProfileInfo.usage` with no session in sight. Same account, same bars.
1679
+ */
1680
+ declare function UsageMeters({
1681
+ windows,
1682
+ now,
1683
+ className
1684
+ }: {
1685
+ /** In reading order — protocol's `orderUsageWindows`. */windows: UsageWindowRow[];
1686
+ /** A shared clock, when the caller already ticks one. Omitted, this ticks its
1687
+ * own for as long as it is mounted. */
1688
+ now?: number;
1689
+ className?: string;
1690
+ }): _$react.JSX.Element;
1691
+ //#endregion
1278
1692
  //#region src/components/agent/SessionInfoDialog.d.ts
1279
1693
  interface SessionInfoDialogProps {
1280
1694
  state: TranscriptState;
@@ -1465,6 +1879,15 @@ interface SessionBrowserProps {
1465
1879
  * filtered by a control you can't currently see still says so.
1466
1880
  */
1467
1881
  showControls?: boolean;
1882
+ /**
1883
+ * Resolved project-icon bytes by content hash — `useProjectIcons`' output.
1884
+ *
1885
+ * Passed in rather than fetched here for the reason `ProjectIcon` states: the
1886
+ * wire carries an *address*, and who can fetch it differs per client. Absent,
1887
+ * or a hash not in it yet, simply draws no picture; the project's name is
1888
+ * already there.
1889
+ */
1890
+ projectIcons?: Record<string, string>;
1468
1891
  className?: string;
1469
1892
  }
1470
1893
  /**
@@ -1495,6 +1918,7 @@ declare function SessionBrowser({
1495
1918
  onRename,
1496
1919
  emptyState,
1497
1920
  showControls,
1921
+ projectIcons,
1498
1922
  className
1499
1923
  }: SessionBrowserProps): _$react.JSX.Element;
1500
1924
  /**
@@ -1510,6 +1934,15 @@ declare function SessionStatusIcon({
1510
1934
  }): _$react.JSX.Element;
1511
1935
  //#endregion
1512
1936
  //#region src/components/agent/EngineIcon.d.ts
1937
+ /**
1938
+ * Which mark a session wears.
1939
+ *
1940
+ * The two first-party engines are named directly. A `provider` session is
1941
+ * whatever the host wired up, so its *model* is the only thing that says whose
1942
+ * it is — sniffed loosely on purpose (`gemini-2.5-pro`, `deepseek-chat`,
1943
+ * `kimi-k2`), and falling through to no mark rather than guessing wrong.
1944
+ */
1945
+ declare function engineMark(engine: string, model?: string): string | undefined;
1513
1946
  declare function EngineIcon({
1514
1947
  engine,
1515
1948
  model,
@@ -1520,6 +1953,21 @@ declare function EngineIcon({
1520
1953
  className?: string;
1521
1954
  }): _$react.JSX.Element;
1522
1955
  //#endregion
1956
+ //#region src/components/agent/ProjectIcon.d.ts
1957
+ declare function ProjectIcon({
1958
+ icon,
1959
+ src,
1960
+ name,
1961
+ className
1962
+ }: {
1963
+ icon: ProjectIcon$1 | undefined;
1964
+ /** Resolved bytes for the `image` arm — an object URL or a data URL. The
1965
+ * caller fetches (see the note above); absent draws nothing. */
1966
+ src?: string; /** The project's name, for the alt text. */
1967
+ name?: string;
1968
+ className?: string;
1969
+ }): _$react.JSX.Element | null;
1970
+ //#endregion
1523
1971
  //#region src/components/agent/SessionEmptyState.d.ts
1524
1972
  interface SessionEmptyStateProps {
1525
1973
  cwd?: string;
@@ -1622,5 +2070,5 @@ declare function toolIcon(toolName: string): LucideIcon;
1622
2070
  */
1623
2071
  declare function isMutatingTool(toolName: string): boolean;
1624
2072
  //#endregion
1625
- export { AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogTitle, AlertDialogTrigger, Badge, type BadgeProps, Button, type ButtonProps, Card, CardContent, CardHeader, CardTitle, type ChipSegment, CodeBlock, type CodeBlockProps, Composer, type ComposerFileMatch, type ComposerHandle, type ComposerProps, ContextDialog, type ContextDialogProps, Conversation, ConversationContent, type ConversationProps, ConversationScrollButton, CopyButton, type CopyButtonProps, Dialog, DialogBody, DialogClose, DialogContent, DialogHeader, DialogRow, DialogTrigger, Empty, EmptyKey, EngineIcon, FileCard, type FileCardProps, type FileDeliveredItem, HostFilesDialog, type HostFilesDialogProps, Input, Loader, McpDialog, type McpDialogProps, Menu, MenuContent, MenuItem, MenuSeparator, MenuTrigger, Message, MessageContent, type MessageProps, ModelSelect, type ModelSelectProps, PERMISSION_MODES, type PermissionModeChoice, type PermissionModeMeta, PermissionModeSelect, type PermissionModeSelectProps, PermissionPrompt, type PermissionPromptProps, ProgressRing, type ProgressRingProps, PromptArea, type PromptAreaHandle, type PromptAreaProps, PromptTokenText, QUESTION_BEHAVIORS, type QuestionBehaviorMeta, QuestionPrompt, type QuestionPromptProps, Reasoning, type ReasoningProps, Response, type ResponseProps, STATUS_META, type Segment, Select, SelectContent, SelectItem, SelectItemText, SelectTrigger, SelectValue, SessionBrowser, type SessionBrowserProps, type SessionControls, SessionEmptyState, type SessionEmptyStateProps, SessionInfoDialog, type SessionInfoDialogProps, SessionList, SessionListItem, type SessionListItemProps, type SessionListProps, SessionPanel, type SessionPanelProps, SessionStatusIcon, type SessionSurfacePanel, type SessionVitals, SkillsDialog, type SkillsDialogProps, Spinner, Splitter, type SplitterProps, StatusBar, type StatusBarProps, type TextSegment, Textarea, Tip, Toaster, ToolCallCard, type ToolCallCardProps, type ToolCallItem, TooltipContent, TooltipProvider, Transcript, type TranscriptDensity, TranscriptDensityProvider, type TranscriptFont, type TranscriptProps, type TranscriptVariant, TranscriptVariantProvider, type TriggerConfig, type TriggerSuggestion, UsageDialog, type UsageDialogProps, badgeVariants, buttonVariants, cn, commandTrigger, copyText, formatAgoPrecise, formatBytes, formatCost, formatCountdown, formatDuration, formatRateLimitWindow, formatRateLimitWindowLong, formatRelativeTime, formatTokens, friendlyModel, getChipsByTrigger, hashtagTrigger, isMutatingTool, isSegmentsEmpty, mentionTrigger, parseUserQuestions, permissionModeChoices, permissionModeMeta, plainTextToSegments, rateLimitWindowSeconds, rowShapeClass, segmentsToPlainText, skillPrompt, toast, toolIcon, toolInputPreview, usePromptAreaState, useTranscriptDensity, useTranscriptVariant };
2073
+ export { AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogTitle, AlertDialogTrigger, Badge, type BadgeProps, Band, Blank, Button, type ButtonProps, Card, CardContent, CardHeader, CardTitle, type ChipSegment, CodeBlock, type CodeBlockProps, Composer, type ComposerFileMatch, type ComposerHandle, type ComposerProps, ContextDialog, type ContextDialogProps, Conversation, ConversationContent, type ConversationProps, ConversationScrollButton, CopyAction, CopyButton, type CopyButtonProps, Dialog, DialogBody, DialogClose, DialogContent, DialogHeader, DialogRow, DialogTrigger, Empty, EmptyKey, EngineIcon, FileCard, type FileCardProps, type FileDeliveredItem, HostFilesDialog, type HostFilesDialogProps, Ink, Input, Loader, McpDialog, type McpDialogProps, Menu, MenuContent, MenuItem, MenuSeparator, MenuTrigger, Message, MessageContent, type MessageProps, ModelSelect, type ModelSelectProps, PERMISSION_MODES, type PermissionModeChoice, type PermissionModeMeta, PermissionModeSelect, type PermissionModeSelectProps, PermissionPrompt, type PermissionPromptProps, ProgressRing, type ProgressRingProps, ProjectIcon, PromptArea, type PromptAreaHandle, type PromptAreaProps, PromptTokenText, QUESTION_BEHAVIORS, type QuestionBehaviorMeta, QuestionPrompt, type QuestionPromptProps, Reasoning, type ReasoningProps, Response, type ResponseProps, Row, type RowProps, STATUS_META, type Segment, Select, SelectContent, SelectItem, SelectItemText, SelectTrigger, SelectValue, SessionBrowser, type SessionBrowserProps, type SessionControls, SessionEmptyState, type SessionEmptyStateProps, SessionInfoDialog, type SessionInfoDialogProps, SessionList, SessionListItem, type SessionListItemProps, type SessionListProps, SessionPanel, type SessionPanelProps, SessionStatusIcon, type SessionSurfacePanel, type SessionVitals, SkillsDialog, type SkillsDialogProps, Spinner, Splitter, type SplitterProps, StatusBar, type StatusBarProps, type TerminalAffordances, TerminalDiff, TerminalItemView, TerminalMarkdown, type TerminalMarkdownProps, type TerminalMetrics, TerminalPermissionPrompt, type TerminalPermissionPromptProps, TerminalQuestionPrompt, type TerminalQuestionPromptProps, TerminalStatusLine, type TerminalStatusLineProps, TerminalSurface, type TerminalSurfaceProps, TerminalTranscript, type TerminalTranscriptProps, type TextSegment, Textarea, Tip, Toaster, type Tone, ToolCallCard, type ToolCallCardProps, type ToolCallItem, TooltipContent, TooltipProvider, Transcript, type TranscriptDensity, TranscriptDensityProvider, type TranscriptFont, type TranscriptProps, type TranscriptVariant, TranscriptVariantProvider, type TriggerConfig, type TriggerSuggestion, UsageDialog, type UsageDialogProps, UsageMeters, WithActions, badgeVariants, buttonVariants, cn, commandTrigger, copyText, engineMark, formatAgoPrecise, formatBytes, formatCost, formatCountdown, formatDuration, formatRateLimitWindow, formatRateLimitWindowLong, formatRelativeTime, formatTokens, friendlyModel, getChipsByTrigger, hashtagTrigger, isMutatingTool, isSegmentsEmpty, mentionTrigger, parseUserQuestions, permissionModeChoices, permissionModeMeta, plainTextToSegments, previewPatch, rateLimitWindowSeconds, rowShapeClass, segmentsToPlainText, skillPrompt, toast, toolIcon, toolInputPreview, useAffordances, useMinuteClock, usePromptAreaState, useTranscriptDensity, useTranscriptVariant };
1626
2074
  //# sourceMappingURL=index.d.mts.map