@cueplusplus/ui 0.20.1 → 0.21.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.
- package/CHANGELOG.md +115 -0
- package/dist/chat/agent-pile.js +2 -2
- package/dist/chrome/_status-bar.js +1 -1
- package/dist/chrome/app-shell.js +1 -1
- package/dist/chrome/navigation-menu.js +3 -3
- package/dist/chrome/row.js +1 -1
- package/dist/chrome/scroll-area.js +1 -1
- package/dist/chrome/section-header.js +1 -1
- package/dist/chrome/segmented-control.js +1 -1
- package/dist/chrome/tabs.js +1 -1
- package/dist/chrome/toolbar.js +1 -1
- package/dist/chrome/tree.js +3 -3
- package/dist/date/calendar.js +3 -3
- package/dist/dmx/channel-matrix.js +1 -1
- package/dist/dmx/universe-grid.js +1 -1
- package/dist/elements/agent-handoff.js +3 -3
- package/dist/elements/agent-plan.js +1 -1
- package/dist/elements/agent-status.js +1 -1
- package/dist/elements/agent-surface.d.ts +9 -6
- package/dist/elements/agent-surface.js +3 -2
- package/dist/elements/approval-card.d.ts +29 -3
- package/dist/elements/approval-card.js +18 -8
- package/dist/elements/artifact-card.js +2 -2
- package/dist/elements/canvas-split.js +3 -3
- package/dist/elements/chart.js +1 -1
- package/dist/elements/chat-panel.js +2 -2
- package/dist/elements/checkpoint-history.js +1 -1
- package/dist/elements/code-diff.js +1 -1
- package/dist/elements/code-runner.js +1 -1
- package/dist/elements/composer.d.ts +8 -2
- package/dist/elements/composer.js +20 -12
- package/dist/elements/computer-use.js +2 -2
- package/dist/elements/confidence-marker.js +1 -1
- package/dist/elements/connection-state.js +2 -2
- package/dist/elements/context-breakdown.js +1 -1
- package/dist/elements/context-usage.js +1 -1
- package/dist/elements/conversation-search.js +2 -2
- package/dist/elements/cost-meter.js +1 -1
- package/dist/elements/data-table.js +1 -1
- package/dist/elements/diagram.js +1 -1
- package/dist/elements/draft-restore.js +2 -2
- package/dist/elements/edit-message.js +1 -1
- package/dist/elements/elements.css +134 -0
- package/dist/elements/elicitation-form.d.ts +8 -1
- package/dist/elements/elicitation-form.js +24 -16
- package/dist/elements/empty-state.js +3 -3
- package/dist/elements/error-state.js +2 -2
- package/dist/elements/event-feed.d.ts +88 -0
- package/dist/elements/event-feed.js +190 -0
- package/dist/elements/feedback-dialog.js +2 -2
- package/dist/elements/file-tree.js +1 -1
- package/dist/elements/flow-graph.js +2 -2
- package/dist/elements/generative.css +13 -0
- package/dist/elements/generative.d.ts +8 -6
- package/dist/elements/generative.js +4 -3
- package/dist/elements/image-generation.js +2 -2
- package/dist/elements/index.d.ts +7 -3
- package/dist/elements/index.js +5 -2
- package/dist/elements/inline-citation.js +1 -1
- package/dist/elements/job-progress.js +1 -1
- package/dist/elements/launcher-bubble.js +3 -3
- package/dist/elements/loading-state.js +1 -1
- package/dist/elements/map-answer.js +1 -1
- package/dist/elements/math-block.js +1 -1
- package/dist/elements/mcp-server-panel.js +3 -3
- package/dist/elements/memory-chips.js +1 -1
- package/dist/elements/message-attachment.js +3 -3
- package/dist/elements/message-branches.js +1 -1
- package/dist/elements/message-pair.js +2 -2
- package/dist/elements/message-queue.js +1 -1
- package/dist/elements/message-timing.js +1 -1
- package/dist/elements/mobile-composer.js +1 -1
- package/dist/elements/model-picker.js +1 -1
- package/dist/elements/number-ticker.js +1 -1
- package/dist/elements/onboarding.js +3 -3
- package/dist/elements/permission-grant.js +3 -3
- package/dist/elements/prompt-library.js +1 -1
- package/dist/elements/question-card.d.ts +50 -0
- package/dist/elements/question-card.js +117 -0
- package/dist/elements/queue-dock.js +1 -1
- package/dist/elements/quota-banner.js +1 -1
- package/dist/elements/quote-reply.js +3 -3
- package/dist/elements/read-aloud.js +2 -2
- package/dist/elements/reasoning-effort.js +2 -2
- package/dist/elements/reasoning-panel.js +3 -3
- package/dist/elements/recommendation-card.js +2 -2
- package/dist/elements/regenerate-menu.js +1 -1
- package/dist/elements/request-delivery.js +31 -0
- package/dist/elements/research-report.js +1 -1
- package/dist/elements/retrieval-chunks.js +3 -3
- package/dist/elements/revert-dock.js +1 -1
- package/dist/elements/reviewable-diff.js +4 -4
- package/dist/elements/schedule-card.js +2 -2
- package/dist/elements/score-breakdown.js +2 -2
- package/dist/elements/scroll-anchor.js +2 -2
- package/dist/elements/settings-panel.js +3 -3
- package/dist/elements/sources.js +1 -1
- package/dist/elements/spec-sheet.js +1 -1
- package/dist/elements/stopped-run.js +2 -2
- package/dist/elements/streaming-text.js +2 -2
- package/dist/elements/subagent-list.js +4 -4
- package/dist/elements/suggestions.js +1 -1
- package/dist/elements/surfaces.d.ts +6 -6
- package/dist/elements/surfaces.js +7 -7
- package/dist/elements/tail-status.js +1 -1
- package/dist/elements/terminal-block.js +1 -1
- package/dist/elements/thinking-indicator.js +1 -1
- package/dist/elements/timeline.js +1 -1
- package/dist/elements/todo-list.js +1 -1
- package/dist/elements/tool-call.d.ts +18 -2
- package/dist/elements/tool-call.js +20 -11
- package/dist/elements/tool-error.js +2 -2
- package/dist/elements/tool-group.d.ts +11 -3
- package/dist/elements/tool-group.js +62 -38
- package/dist/elements/tool-state.d.ts +13 -0
- package/dist/elements/tool-state.js +44 -0
- package/dist/elements/tool-timeline.js +2 -2
- package/dist/elements/trace-waterfall.js +2 -2
- package/dist/elements/unsupported-request-card.d.ts +31 -0
- package/dist/elements/unsupported-request-card.js +80 -0
- package/dist/elements/vocabulary.d.ts +50 -1
- package/dist/elements/vocabulary.js +50 -1
- package/dist/elements/voice-conversation.js +5 -5
- package/dist/elements/web-preview.js +1 -1
- package/dist/elements/web-search.js +2 -2
- package/dist/elements/work-collapse.js +1 -1
- package/dist/forms/file-upload.js +1 -1
- package/dist/forms/rating.js +1 -1
- package/dist/forms/select.js +1 -1
- package/dist/forms/switch.js +2 -2
- package/dist/forms/toggle.js +1 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +3 -1
- package/dist/instruments/_ledger-disclosure.js +1 -1
- package/dist/instruments/data-tree.js +1 -1
- package/dist/instruments/meter.js +1 -1
- package/dist/instruments/seam-grid.js +1 -1
- package/dist/layout/_collapse.js +3 -3
- package/dist/layout/bento.js +1 -1
- package/dist/layout/breadcrumb.js +1 -1
- package/dist/layout/carousel.js +1 -1
- package/dist/layout/collapsible.js +1 -1
- package/dist/layout/index.d.ts +3 -1
- package/dist/layout/index.js +3 -1
- package/dist/layout/item.js +1 -1
- package/dist/layout/link.js +1 -1
- package/dist/layout/pagination.js +1 -1
- package/dist/layout/pane-seam.d.ts +75 -0
- package/dist/layout/pane-seam.js +127 -0
- package/dist/layout/resizable.d.ts +2 -1
- package/dist/layout/resizable.js +3 -2
- package/dist/layout/sidebar.js +3 -3
- package/dist/layout/split-pane.d.ts +74 -0
- package/dist/layout/split-pane.js +135 -0
- package/dist/layout/stepper.js +1 -1
- package/dist/lib/auto-grow.js +42 -0
- package/dist/overlays/_surface.d.ts +4 -4
- package/dist/overlays/_surface.js +4 -4
- package/dist/overlays/drawer.js +1 -1
- package/dist/overlays/menubar.js +1 -1
- package/dist/overlays/sheet.js +1 -1
- package/dist/overlays/toast.js +1 -1
- package/dist/primitives/button.js +1 -1
- package/dist/primitives/chip.d.ts +1 -1
- package/dist/system/agent-skin.d.ts +11 -5
- package/manifest/components/agent-surface.json +5 -4
- package/manifest/components/approval-card.json +45 -7
- package/manifest/components/composer-input.json +16 -2
- package/manifest/components/elicitation-form.json +16 -1
- package/manifest/components/event-feed.json +171 -0
- package/manifest/components/event-row.json +116 -0
- package/manifest/components/generative-ui.json +4 -3
- package/manifest/components/pane-seam.json +171 -0
- package/manifest/components/question-card.json +157 -0
- package/manifest/components/resizable.json +1 -1
- package/manifest/components/split-pane.json +224 -0
- package/manifest/components/tool-call.json +46 -2
- package/manifest/components/tool-group.json +15 -3
- package/manifest/components/unsupported-request-card.json +117 -0
- package/manifest/fixtures.json +16 -0
- package/manifest/manifest.json +88 -10
- package/manifest/tokens.json +9 -2
- package/package.json +2 -2
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { EventFeedLabels } from "./vocabulary.js";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
//#region src/elements/event-feed.d.ts
|
|
4
|
+
/** The tone a row's dot is drawn in. `neutral` is the default. */
|
|
5
|
+
type FeedEventTone = "neutral" | "ok" | "warn" | "danger" | "busy";
|
|
6
|
+
/** One record in an activity feed. */
|
|
7
|
+
interface FeedEvent {
|
|
8
|
+
/** Stable across renders; what `onSelect` reports and `selectedId` names. */
|
|
9
|
+
id: string;
|
|
10
|
+
/** What kind of record it is: `tool`, `permission`, `error`. The filter chips are built from these. */
|
|
11
|
+
kind: string;
|
|
12
|
+
/** The one line that says what happened. */
|
|
13
|
+
title: string;
|
|
14
|
+
/** A second line of context, truncated to one line. */
|
|
15
|
+
preview?: string;
|
|
16
|
+
/** When it happened. A `Date` or epoch milliseconds is formatted as a time of day; a string is drawn as given. */
|
|
17
|
+
timestamp: Date | number | string;
|
|
18
|
+
/** The dot's tone: `neutral` (the default), `ok`, `warn`, `danger` or `busy`. */
|
|
19
|
+
tone?: FeedEventTone;
|
|
20
|
+
}
|
|
21
|
+
interface EventRowProps extends Omit<React.ComponentPropsWithoutRef<"div">, "children" | "onSelect"> {
|
|
22
|
+
/** The record this row draws. */
|
|
23
|
+
event: FeedEvent;
|
|
24
|
+
/** Whether this row is the selected one. */
|
|
25
|
+
selected?: boolean;
|
|
26
|
+
/** Called with the event's `id` when the row is clicked. */
|
|
27
|
+
onSelect?: (id: string) => void;
|
|
28
|
+
/** Formats the time column. Defaults to a time of day for a `Date` or a number. */
|
|
29
|
+
formatTime?: (timestamp: FeedEvent["timestamp"]) => string;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* One event, as a feed row: time, a toned dot, kind, title, and a one-line
|
|
33
|
+
* preview under the title. Exported for a list of the caller's own.
|
|
34
|
+
*
|
|
35
|
+
* Inside an {@link EventFeed} it is an `option` of the feed's listbox. Drawn
|
|
36
|
+
* alone it claims no role, and in a listbox of the caller's it takes
|
|
37
|
+
* `role="option"` from its props; either way `aria-selected` follows `selected`
|
|
38
|
+
* only when the row is an option.
|
|
39
|
+
*
|
|
40
|
+
* @example
|
|
41
|
+
* <div role="listbox" aria-label="Recent">
|
|
42
|
+
* <EventRow role="option" event={event} selected={event.id === id} onSelect={setId} />
|
|
43
|
+
* </div>
|
|
44
|
+
*/
|
|
45
|
+
declare const EventRow: React.ForwardRefExoticComponent<EventRowProps & React.RefAttributes<HTMLDivElement>>;
|
|
46
|
+
interface EventFeedProps extends Omit<React.ComponentPropsWithoutRef<"div">, "children" | "onSelect"> {
|
|
47
|
+
/** The feed's accessible name: `Run events`. */
|
|
48
|
+
label: string;
|
|
49
|
+
/** The records, oldest first or newest first: the feed keeps the order given. */
|
|
50
|
+
events: readonly FeedEvent[];
|
|
51
|
+
/** The kind the feed keeps, or `all`, when the caller holds it. */
|
|
52
|
+
filter?: string;
|
|
53
|
+
/** The kind to start on when nothing controls it. Defaults to `all`. */
|
|
54
|
+
defaultFilter?: string;
|
|
55
|
+
/** Called with the kind, or `all`, when a chip is pressed. */
|
|
56
|
+
onFilterChange?: (filter: string) => void;
|
|
57
|
+
/** The selected event's `id`, or `null` for none. */
|
|
58
|
+
selectedId?: string | null;
|
|
59
|
+
/** Called with an event's `id` when a row is clicked or the keyboard moves to it. */
|
|
60
|
+
onSelect?: (id: string) => void;
|
|
61
|
+
/** Formats the time column. Defaults to a time of day for a `Date` or a number. */
|
|
62
|
+
formatTime?: (timestamp: FeedEvent["timestamp"]) => string;
|
|
63
|
+
/** Replace any of the feed's own copy. */
|
|
64
|
+
labels?: Partial<EventFeedLabels>;
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* A filterable activity feed: timestamped, typed records with a one-line
|
|
68
|
+
* preview, and a selection the detail pane follows (#103).
|
|
69
|
+
*
|
|
70
|
+
* The chips are built from the kinds present, in the order each first
|
|
71
|
+
* appears, each with its count, so a feed never offers a filter that keeps
|
|
72
|
+
* nothing. The rows are a listbox: j and k, or the arrows, move the selection
|
|
73
|
+
* through the rows the filter keeps, and Home and End jump to the ends. The
|
|
74
|
+
* selection follows the keyboard, so the detail beside it follows too.
|
|
75
|
+
*
|
|
76
|
+
* @example
|
|
77
|
+
* const [selected, setSelected] = React.useState<string | null>(null);
|
|
78
|
+
*
|
|
79
|
+
* <EventFeed
|
|
80
|
+
* label="Run events"
|
|
81
|
+
* events={events}
|
|
82
|
+
* selectedId={selected}
|
|
83
|
+
* onSelect={setSelected}
|
|
84
|
+
* />
|
|
85
|
+
*/
|
|
86
|
+
declare const EventFeed: React.ForwardRefExoticComponent<EventFeedProps & React.RefAttributes<HTMLDivElement>>;
|
|
87
|
+
//#endregion
|
|
88
|
+
export { EventFeed, EventFeedProps, EventRow, EventRowProps, FeedEvent, FeedEventTone };
|
|
@@ -0,0 +1,190 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "../lib/cn.js";
|
|
3
|
+
import { FOCUS_RING_INSET_2 } from "../system/_focus-ring.js";
|
|
4
|
+
import { mono } from "./surfaces.js";
|
|
5
|
+
import { EVENT_FEED_LABELS } from "./vocabulary.js";
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
//#region src/elements/event-feed.tsx
|
|
9
|
+
/** The dot's paint per tone. Each tone also stamps `data-tone` on its row. */
|
|
10
|
+
const TONE_DOT = {
|
|
11
|
+
neutral: "bg-fg-subtle",
|
|
12
|
+
ok: "bg-ok",
|
|
13
|
+
warn: "bg-warn",
|
|
14
|
+
danger: "bg-danger",
|
|
15
|
+
busy: "bg-stream"
|
|
16
|
+
};
|
|
17
|
+
/** A time of day in the reader's locale, at second precision, or the caller's own string. */
|
|
18
|
+
function formatTimestamp(timestamp) {
|
|
19
|
+
if (typeof timestamp === "string") return timestamp;
|
|
20
|
+
return new Date(timestamp).toLocaleTimeString([], {
|
|
21
|
+
hour: "2-digit",
|
|
22
|
+
minute: "2-digit",
|
|
23
|
+
second: "2-digit"
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Whether a row sits in an {@link EventFeed}'s listbox. Inside one, a row is an
|
|
28
|
+
* `option`; drawn alone it claims no role, because an option with no listbox
|
|
29
|
+
* around it is a broken tree for a screen reader.
|
|
30
|
+
*/
|
|
31
|
+
const InFeedContext = React.createContext(false);
|
|
32
|
+
/**
|
|
33
|
+
* One event, as a feed row: time, a toned dot, kind, title, and a one-line
|
|
34
|
+
* preview under the title. Exported for a list of the caller's own.
|
|
35
|
+
*
|
|
36
|
+
* Inside an {@link EventFeed} it is an `option` of the feed's listbox. Drawn
|
|
37
|
+
* alone it claims no role, and in a listbox of the caller's it takes
|
|
38
|
+
* `role="option"` from its props; either way `aria-selected` follows `selected`
|
|
39
|
+
* only when the row is an option.
|
|
40
|
+
*
|
|
41
|
+
* @example
|
|
42
|
+
* <div role="listbox" aria-label="Recent">
|
|
43
|
+
* <EventRow role="option" event={event} selected={event.id === id} onSelect={setId} />
|
|
44
|
+
* </div>
|
|
45
|
+
*/
|
|
46
|
+
const EventRow = React.forwardRef(function EventRow({ event, selected = false, onSelect, formatTime = formatTimestamp, role, className, ...elementProps }, ref) {
|
|
47
|
+
const tone = event.tone ?? "neutral";
|
|
48
|
+
const inFeed = React.useContext(InFeedContext);
|
|
49
|
+
const resolved = role ?? (inFeed ? "option" : void 0);
|
|
50
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
51
|
+
ref,
|
|
52
|
+
role: resolved,
|
|
53
|
+
"aria-selected": resolved === "option" ? selected : void 0,
|
|
54
|
+
"data-slot": "event-row",
|
|
55
|
+
"data-kind": event.kind,
|
|
56
|
+
"data-tone": tone,
|
|
57
|
+
"data-selected": selected || void 0,
|
|
58
|
+
onClick: () => onSelect?.(event.id),
|
|
59
|
+
className: cn("grid cursor-default grid-cols-[auto_auto_1fr] items-baseline gap-x-(--cue-space-2) rounded-control px-(--cue-space-2) py-(--cue-space-1) text-(length:--cue-text-ui) hover:bg-surface-2 data-selected:bg-accent/10", className),
|
|
60
|
+
...elementProps,
|
|
61
|
+
children: [
|
|
62
|
+
/* @__PURE__ */ jsx("time", {
|
|
63
|
+
className: cn(mono, "text-fg-subtle tabular-nums"),
|
|
64
|
+
children: formatTime(event.timestamp)
|
|
65
|
+
}),
|
|
66
|
+
/* @__PURE__ */ jsxs("span", {
|
|
67
|
+
className: "flex items-center gap-(--cue-space-1)",
|
|
68
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
69
|
+
"aria-hidden": true,
|
|
70
|
+
className: cn("size-1.5 shrink-0 self-center rounded-full", TONE_DOT[tone])
|
|
71
|
+
}), /* @__PURE__ */ jsx("span", {
|
|
72
|
+
className: cn(mono, "text-fg-muted"),
|
|
73
|
+
children: event.kind
|
|
74
|
+
})]
|
|
75
|
+
}),
|
|
76
|
+
/* @__PURE__ */ jsx("span", {
|
|
77
|
+
"data-slot": "event-row-title",
|
|
78
|
+
className: "min-w-0 truncate text-fg",
|
|
79
|
+
children: event.title
|
|
80
|
+
}),
|
|
81
|
+
event.preview === void 0 ? null : /* @__PURE__ */ jsx("span", {
|
|
82
|
+
"data-slot": "event-row-preview",
|
|
83
|
+
className: "col-start-3 min-w-0 truncate text-fg-muted",
|
|
84
|
+
children: event.preview
|
|
85
|
+
})
|
|
86
|
+
]
|
|
87
|
+
});
|
|
88
|
+
});
|
|
89
|
+
/**
|
|
90
|
+
* A filterable activity feed: timestamped, typed records with a one-line
|
|
91
|
+
* preview, and a selection the detail pane follows (#103).
|
|
92
|
+
*
|
|
93
|
+
* The chips are built from the kinds present, in the order each first
|
|
94
|
+
* appears, each with its count, so a feed never offers a filter that keeps
|
|
95
|
+
* nothing. The rows are a listbox: j and k, or the arrows, move the selection
|
|
96
|
+
* through the rows the filter keeps, and Home and End jump to the ends. The
|
|
97
|
+
* selection follows the keyboard, so the detail beside it follows too.
|
|
98
|
+
*
|
|
99
|
+
* @example
|
|
100
|
+
* const [selected, setSelected] = React.useState<string | null>(null);
|
|
101
|
+
*
|
|
102
|
+
* <EventFeed
|
|
103
|
+
* label="Run events"
|
|
104
|
+
* events={events}
|
|
105
|
+
* selectedId={selected}
|
|
106
|
+
* onSelect={setSelected}
|
|
107
|
+
* />
|
|
108
|
+
*/
|
|
109
|
+
const EventFeed = React.forwardRef(function EventFeed({ label, events, filter, defaultFilter = "all", onFilterChange, selectedId = null, onSelect, formatTime, labels, className, ...elementProps }, ref) {
|
|
110
|
+
const copy = {
|
|
111
|
+
...EVENT_FEED_LABELS,
|
|
112
|
+
...labels
|
|
113
|
+
};
|
|
114
|
+
const base = React.useId();
|
|
115
|
+
const [ownFilter, setOwnFilter] = React.useState(defaultFilter);
|
|
116
|
+
const kept = filter ?? ownFilter;
|
|
117
|
+
const kinds = React.useMemo(() => {
|
|
118
|
+
const counts = /* @__PURE__ */ new Map();
|
|
119
|
+
for (const event of events) counts.set(event.kind, (counts.get(event.kind) ?? 0) + 1);
|
|
120
|
+
return [...counts];
|
|
121
|
+
}, [events]);
|
|
122
|
+
const visible = kept === "all" ? events : events.filter((event) => event.kind === kept);
|
|
123
|
+
const rowId = (id) => `${base}-${id}`;
|
|
124
|
+
const active = visible.some((event) => event.id === selectedId) ? selectedId : null;
|
|
125
|
+
const choose = (next) => {
|
|
126
|
+
if (filter === void 0) setOwnFilter(next);
|
|
127
|
+
onFilterChange?.(next);
|
|
128
|
+
};
|
|
129
|
+
const chip = (value, text, count) => /* @__PURE__ */ jsxs("button", {
|
|
130
|
+
type: "button",
|
|
131
|
+
"aria-pressed": kept === value,
|
|
132
|
+
"aria-label": `${text}, ${count}`,
|
|
133
|
+
onClick: () => choose(value),
|
|
134
|
+
className: `flex items-center gap-(--cue-space-1) rounded-full border border-border px-(--cue-space-2) py-px text-(length:--cue-text-label) text-fg-muted transition-colors duration-fast outline-none hover:text-fg aria-pressed:border-accent/40 aria-pressed:bg-accent/10 aria-pressed:text-fg ${FOCUS_RING_INSET_2} motion-reduce:transition-none`,
|
|
135
|
+
children: [text, /* @__PURE__ */ jsx("span", {
|
|
136
|
+
className: "tabular-nums text-fg-subtle",
|
|
137
|
+
children: count
|
|
138
|
+
})]
|
|
139
|
+
}, value);
|
|
140
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
141
|
+
ref,
|
|
142
|
+
"data-slot": "event-feed",
|
|
143
|
+
className: cn("flex min-h-0 flex-col gap-(--cue-space-2)", className),
|
|
144
|
+
...elementProps,
|
|
145
|
+
children: [
|
|
146
|
+
/* @__PURE__ */ jsxs("div", {
|
|
147
|
+
role: "group",
|
|
148
|
+
"aria-label": copy.filter,
|
|
149
|
+
className: "flex flex-wrap gap-(--cue-space-1)",
|
|
150
|
+
children: [chip("all", copy.all, events.length), kinds.map(([kind, count]) => chip(kind, kind, count))]
|
|
151
|
+
}),
|
|
152
|
+
visible.length === 0 ? /* @__PURE__ */ jsx("p", {
|
|
153
|
+
className: "px-(--cue-space-2) py-(--cue-space-3) text-(length:--cue-text-ui) text-fg-subtle",
|
|
154
|
+
children: copy.empty
|
|
155
|
+
}) : null,
|
|
156
|
+
/* @__PURE__ */ jsx("div", {
|
|
157
|
+
role: "listbox",
|
|
158
|
+
"aria-label": label,
|
|
159
|
+
tabIndex: 0,
|
|
160
|
+
"aria-activedescendant": active === null ? void 0 : rowId(active),
|
|
161
|
+
onKeyDown: (event) => {
|
|
162
|
+
if (visible.length === 0) return;
|
|
163
|
+
const at = visible.findIndex((row) => row.id === active);
|
|
164
|
+
let next;
|
|
165
|
+
if (event.key === "j" || event.key === "ArrowDown") next = at === -1 ? 0 : Math.min(visible.length - 1, at + 1);
|
|
166
|
+
else if (event.key === "k" || event.key === "ArrowUp") next = at === -1 ? 0 : Math.max(0, at - 1);
|
|
167
|
+
else if (event.key === "Home") next = 0;
|
|
168
|
+
else if (event.key === "End") next = visible.length - 1;
|
|
169
|
+
if (next === void 0) return;
|
|
170
|
+
event.preventDefault();
|
|
171
|
+
const target = visible[next];
|
|
172
|
+
if (target !== void 0 && target.id !== active) onSelect?.(target.id);
|
|
173
|
+
},
|
|
174
|
+
className: `flex min-h-0 flex-col overflow-y-auto rounded-control outline-none ${FOCUS_RING_INSET_2}`,
|
|
175
|
+
children: /* @__PURE__ */ jsx(InFeedContext.Provider, {
|
|
176
|
+
value: true,
|
|
177
|
+
children: visible.map((event) => /* @__PURE__ */ jsx(EventRow, {
|
|
178
|
+
id: rowId(event.id),
|
|
179
|
+
event,
|
|
180
|
+
selected: event.id === active,
|
|
181
|
+
onSelect,
|
|
182
|
+
formatTime
|
|
183
|
+
}, event.id))
|
|
184
|
+
})
|
|
185
|
+
})
|
|
186
|
+
]
|
|
187
|
+
});
|
|
188
|
+
});
|
|
189
|
+
//#endregion
|
|
190
|
+
export { EventFeed, EventRow };
|
|
@@ -28,7 +28,7 @@ function FeedbackDialog({ reasons, selected, note, sent, onToggleReason, onNoteC
|
|
|
28
28
|
...props,
|
|
29
29
|
children: [/* @__PURE__ */ jsx("div", {
|
|
30
30
|
role: "status",
|
|
31
|
-
className: sent ? "cue-elements-fade-in cue-elements-animate-in flex items-center gap-2.5 duration-
|
|
31
|
+
className: sent ? "cue-elements-fade-in cue-elements-animate-in flex items-center gap-2.5 duration-base" : "sr-only",
|
|
32
32
|
children: sent && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CheckIcon, { className: "size-4 shrink-0 text-ok" }), "Thanks. That helps us tune the model."] })
|
|
33
33
|
}), sent ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
34
34
|
/* @__PURE__ */ jsxs("div", {
|
|
@@ -56,7 +56,7 @@ function FeedbackDialog({ reasons, selected, note, sent, onToggleReason, onNoteC
|
|
|
56
56
|
type: "button",
|
|
57
57
|
"aria-pressed": active,
|
|
58
58
|
onClick: () => onToggleReason?.(reason),
|
|
59
|
-
className: cn("rounded-full px-2.5 py-1 text-(length:--cue-text-ui) transition-[background-color,color,scale] duration-
|
|
59
|
+
className: cn("rounded-full px-2.5 py-1 text-(length:--cue-text-ui) transition-[background-color,color,scale] duration-fast active:scale-[0.96]", active ? "bg-accent text-accent-fg" : cn(field, "text-fg-muted hover:text-fg")),
|
|
60
60
|
children: reason
|
|
61
61
|
}, reason);
|
|
62
62
|
})
|
|
@@ -46,7 +46,7 @@ function FileTree({ nodes, visibleCount, totalAdditions, totalDeletions, classNa
|
|
|
46
46
|
}), /* @__PURE__ */ jsx("div", {
|
|
47
47
|
className: "flex flex-col",
|
|
48
48
|
children: take(nodes, visibleCount).map((node) => /* @__PURE__ */ jsx("div", {
|
|
49
|
-
className: "cue-elements-fade-in cue-elements-slide-in-from-left-1 cue-elements-animate-in cue-elements-fill-mode-both hover:bg-surface-1 flex items-center gap-2 rounded-surface px-1 py-1 text-(length:--cue-text-body) transition-colors duration-
|
|
49
|
+
className: "cue-elements-fade-in cue-elements-slide-in-from-left-1 cue-elements-animate-in cue-elements-fill-mode-both hover:bg-surface-1 flex items-center gap-2 rounded-surface px-1 py-1 text-(length:--cue-text-body) transition-colors duration-base",
|
|
50
50
|
style: { paddingInlineStart: `${.25 + node.depth * .85}rem` },
|
|
51
51
|
children: node.kind === "folder" ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
52
52
|
/* @__PURE__ */ jsx(ChevronDownIcon, { className: "text-fg-subtle size-3 shrink-0" }),
|
|
@@ -55,11 +55,11 @@ function FlowGraph({ nodes, edges, visibleCount, className, ...props }) {
|
|
|
55
55
|
d: `M ${a.x + NODE_W / 2} ${a.y} C ${midX} ${a.y}, ${midX} ${b.y}, ${b.x - NODE_W / 2} ${b.y}`,
|
|
56
56
|
fill: "none",
|
|
57
57
|
strokeWidth: "1.5",
|
|
58
|
-
className: cn("transition-opacity duration-
|
|
58
|
+
className: cn("transition-opacity duration-slow motion-reduce:transition-none", "stroke-fg-subtle", live ? "opacity-100" : "opacity-30")
|
|
59
59
|
}, `${edge.from}-${edge.to}`);
|
|
60
60
|
})
|
|
61
61
|
}), shown.map((node) => /* @__PURE__ */ jsx("div", {
|
|
62
|
-
className: cn("cue-elements-fade-in cue-elements-zoom-in-95 cue-elements-animate-in cue-elements-fill-mode-both absolute flex items-center justify-center rounded-surface border text-center text-(length:--cue-text-ui) leading-tight duration-
|
|
62
|
+
className: cn("cue-elements-fade-in cue-elements-zoom-in-95 cue-elements-animate-in cue-elements-fill-mode-both absolute flex items-center justify-center rounded-surface border text-center text-(length:--cue-text-ui) leading-tight duration-base", node.state === "done" && "border-border bg-surface-1 text-fg-muted", node.state === "active" && "text-fg border-stream/30 bg-stream/10", node.state === "pending" && "border-border text-fg-subtle border-dashed"),
|
|
63
63
|
style: {
|
|
64
64
|
left: node.column * COL_W,
|
|
65
65
|
top: node.row * ROW_H,
|
|
@@ -1101,6 +1101,19 @@
|
|
|
1101
1101
|
text-transform: none;
|
|
1102
1102
|
}
|
|
1103
1103
|
|
|
1104
|
+
/* Cursor's corners, from the gallery study's recorded ladder (cue-ui-56): the
|
|
1105
|
+
* surface rung on the card, the control rung on the field and the button.
|
|
1106
|
+
* Nothing else. Cursor draws its cards with a hairline rather than a shadow,
|
|
1107
|
+
* which is the vocabulary's own default, and no image radius is recorded, so
|
|
1108
|
+
* the image keeps the console's. Colour arrives through `elements.css`, as it
|
|
1109
|
+
* does for assistant-ui. */
|
|
1110
|
+
[data-cue-skin="cursor"] [data-aui="root"],
|
|
1111
|
+
[data-aui="root"][data-cue-skin="cursor"] {
|
|
1112
|
+
--aui-card-radius: 0.5rem;
|
|
1113
|
+
--aui-field-radius: 0.375rem;
|
|
1114
|
+
--aui-button-radius: 0.375rem;
|
|
1115
|
+
}
|
|
1116
|
+
|
|
1104
1117
|
/* ── The two fidelities ───────────────────────────────────────────── */
|
|
1105
1118
|
|
|
1106
1119
|
/* `upstream` pins the five density knobs to the numbers assistant-ui's registry
|
|
@@ -68,9 +68,10 @@ interface GenerativeUIProps extends Omit<React.ComponentPropsWithoutRef<"div">,
|
|
|
68
68
|
*/
|
|
69
69
|
maxDepth?: number;
|
|
70
70
|
/**
|
|
71
|
-
* Which value-set paints this tree: `cue` (the default)
|
|
72
|
-
* installs assistant-ui's own surface language
|
|
73
|
-
* {@link AgentSurface}, which has
|
|
71
|
+
* Which value-set paints this tree: `cue` (the default), `aui`, which
|
|
72
|
+
* installs assistant-ui's own surface language, or `cursor`, Cursor's
|
|
73
|
+
* agent-pane values. Leave it off inside an {@link AgentSurface}, which has
|
|
74
|
+
* stamped the subtree already.
|
|
74
75
|
*/
|
|
75
76
|
skin?: AgentSkin;
|
|
76
77
|
/**
|
|
@@ -122,11 +123,12 @@ interface GenerativeUIProps extends Omit<React.ComponentPropsWithoutRef<"div">,
|
|
|
122
123
|
* import "@cueplusplus/ui/elements/generative.css";
|
|
123
124
|
* ```
|
|
124
125
|
*
|
|
125
|
-
* ##
|
|
126
|
+
* ## Skins
|
|
126
127
|
*
|
|
127
128
|
* `skin` and `fidelity` are the same two axes {@link AgentSurface} publishes,
|
|
128
|
-
* and for the same reason: the vocabulary has cue's values by default
|
|
129
|
-
* assistant-ui's under `skin="aui"`, which
|
|
129
|
+
* and for the same reason: the vocabulary has cue's values by default,
|
|
130
|
+
* Cursor's under `skin="cursor"`, and assistant-ui's under `skin="aui"`, which
|
|
131
|
+
* is upstream's own
|
|
130
132
|
* `data-aui-theme="elements"` layer — a 20px card, a borderless 12px field, a
|
|
131
133
|
* pill button. Pass them here when the tree is its own island; leave them off
|
|
132
134
|
* inside an `AgentSurface`, which has already stamped the subtree and whose
|
|
@@ -87,11 +87,12 @@ function GenerativeTree({ spec, onAction, onFault, renderMarkdown, maxDepth }) {
|
|
|
87
87
|
* import "@cueplusplus/ui/elements/generative.css";
|
|
88
88
|
* ```
|
|
89
89
|
*
|
|
90
|
-
* ##
|
|
90
|
+
* ## Skins
|
|
91
91
|
*
|
|
92
92
|
* `skin` and `fidelity` are the same two axes {@link AgentSurface} publishes,
|
|
93
|
-
* and for the same reason: the vocabulary has cue's values by default
|
|
94
|
-
* assistant-ui's under `skin="aui"`, which
|
|
93
|
+
* and for the same reason: the vocabulary has cue's values by default,
|
|
94
|
+
* Cursor's under `skin="cursor"`, and assistant-ui's under `skin="aui"`, which
|
|
95
|
+
* is upstream's own
|
|
95
96
|
* `data-aui-theme="elements"` layer — a 20px card, a borderless 12px field, a
|
|
96
97
|
* pill button. Pass them here when the tree is its own island; leave them off
|
|
97
98
|
* inside an `AgentSurface`, which has already stamped the subtree and whose
|
|
@@ -28,14 +28,14 @@ function ImageGeneration({ prompt, generating, className, ...props }) {
|
|
|
28
28
|
const row = Math.floor(dot / 8);
|
|
29
29
|
const col = dot % 8;
|
|
30
30
|
return /* @__PURE__ */ jsx("span", {
|
|
31
|
-
className: cn("bg-surface-3 size-1 rounded-full transition-opacity duration-
|
|
31
|
+
className: cn("bg-surface-3 size-1 rounded-full transition-opacity duration-slow", generating ? "animate-pulse motion-reduce:animate-none" : "opacity-0"),
|
|
32
32
|
style: { animationDelay: `${(row + col) * 90}ms` }
|
|
33
33
|
}, dot);
|
|
34
34
|
})
|
|
35
35
|
}),
|
|
36
36
|
/* @__PURE__ */ jsx("div", {
|
|
37
37
|
"aria-hidden": true,
|
|
38
|
-
className: cn("absolute inset-0 transition-[opacity,filter] duration-
|
|
38
|
+
className: cn("absolute inset-0 transition-[opacity,filter] duration-slowest ease-out motion-reduce:transition-none", generating ? "opacity-0 blur-xl" : "blur-none opacity-100"),
|
|
39
39
|
style: { background: "radial-gradient(120% 90% at 20% 100%, oklch(0.45 0.09 265) 0%, transparent 55%), radial-gradient(110% 80% at 85% 90%, oklch(0.62 0.1 300 / 0.8) 0%, transparent 60%), radial-gradient(130% 100% at 60% 0%, oklch(0.88 0.06 60) 0%, oklch(0.74 0.09 25 / 0.9) 45%, transparent 75%), linear-gradient(to top, oklch(0.35 0.06 275), oklch(0.82 0.07 50))" }
|
|
40
40
|
}),
|
|
41
41
|
/* @__PURE__ */ jsx("span", {
|
package/dist/elements/index.d.ts
CHANGED
|
@@ -2,13 +2,13 @@ import { AgentFidelity, AgentSkin } from "../system/agent-skin.js";
|
|
|
2
2
|
import { ActivityGraph } from "./activity-graph.js";
|
|
3
3
|
import { AgentCard, AgentSkill } from "./agent-card.js";
|
|
4
4
|
import { AgentHandoff } from "./agent-handoff.js";
|
|
5
|
-
import { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, AgentMode, Announcements, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, ClampLabels, CompactionState, ContextLabels, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, PermissionLabels, QUEUE_LABELS, QueueLabels, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, RevertLabels, RevertScope, SECURITY_RISKS, SecurityRisk, TAIL_ACTIONS, TURN_ACTION_LABELS, TailAction, TurnActionLabels, VERB_TRIADS, VERDICT_LABELS, VerbKind, VerbTense, VerbTriad, VerdictLabels, verbFor } from "./vocabulary.js";
|
|
5
|
+
import { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, AgentMode, Announcements, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, ClampLabels, CompactionState, ContextLabels, DELIVERY_LABELS, EVENT_FEED_LABELS, EventFeedLabels, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, PermissionLabels, QUESTION_LABELS, QUEUE_LABELS, QuestionLabels, QueueLabels, REQUEST_DELIVERIES, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, RequestDelivery, RevertLabels, RevertScope, SECURITY_RISKS, SecurityRisk, TAIL_ACTIONS, TURN_ACTION_LABELS, TailAction, TurnActionLabels, UNSUPPORTED_REQUEST_LABELS, UnsupportedRequestLabels, VERB_TRIADS, VERDICT_LABELS, VerbKind, VerbTense, VerbTriad, VerdictLabels, verbFor } from "./vocabulary.js";
|
|
6
6
|
import { AgentModeBadge, AgentModeBadgeProps } from "./agent-mode-badge.js";
|
|
7
7
|
import { AgentPlan } from "./agent-plan.js";
|
|
8
8
|
import { AgentState, AgentStatus, StatusStep } from "./agent-status.js";
|
|
9
9
|
import { AgentSurface, AgentSurfaceProps } from "./agent-surface.js";
|
|
10
10
|
import { AnimatedNumber, AnimatedNumberProps, formatCompactNumber } from "./animated-number.js";
|
|
11
|
-
import { ApprovalCard, ApprovalState } from "./approval-card.js";
|
|
11
|
+
import { ApprovalCard, ApprovalOption, ApprovalState } from "./approval-card.js";
|
|
12
12
|
import { ArtifactCard } from "./artifact-card.js";
|
|
13
13
|
import { BackgroundInbox, BackgroundRun, BackgroundState } from "./background-inbox.js";
|
|
14
14
|
import { CanvasSplit, CanvasSplitBody, CanvasSplitDocument, CanvasSplitHeader, CanvasSplitLine, CanvasSplitMessage, CanvasSplitThread } from "./canvas-split.js";
|
|
@@ -36,6 +36,7 @@ import { DocumentAnchor, DocumentReference } from "./document-reference.js";
|
|
|
36
36
|
import { DraftRestore } from "./draft-restore.js";
|
|
37
37
|
import { EditMessage } from "./edit-message.js";
|
|
38
38
|
import { ElicitationField, ElicitationForm, ElicitationState } from "./elicitation-form.js";
|
|
39
|
+
import { EventFeed, EventFeedProps, EventRow, EventRowProps, FeedEvent, FeedEventTone } from "./event-feed.js";
|
|
39
40
|
import { ChatEmptyState, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions } from "./empty-state.js";
|
|
40
41
|
import { ChangeSummary, EndOfTurnSummary, EndOfTurnSummaryProps, formatChangeSummary } from "./end-of-turn-summary.js";
|
|
41
42
|
import { ErrorState, ErrorStateProps } from "./error-state.js";
|
|
@@ -66,6 +67,7 @@ import { Onboarding, OnboardingStep } from "./onboarding.js";
|
|
|
66
67
|
import { GrantScope, PermissionGrant } from "./permission-grant.js";
|
|
67
68
|
import { AlwaysAllowInput, AlwaysAllowLabel, PermissionScope, PermissionScopes, PermissionScopesProps, formatAlwaysAllow } from "./permission-scopes.js";
|
|
68
69
|
import { PromptLibrary, SavedPrompt } from "./prompt-library.js";
|
|
70
|
+
import { QuestionCard, QuestionCardProps } from "./question-card.js";
|
|
69
71
|
import { QueueDock, QueueDockProps, QueuedFollowUp, formatQueueSummary } from "./queue-dock.js";
|
|
70
72
|
import { QuotaBanner } from "./quota-banner.js";
|
|
71
73
|
import { QuoteAction, QuoteReply } from "./quote-reply.js";
|
|
@@ -100,6 +102,7 @@ import { ThreadItem, ThreadList } from "./thread-list.js";
|
|
|
100
102
|
import { SearchableThread, ThreadSearch } from "./thread-search.js";
|
|
101
103
|
import { ElementsTimeline, TimelineEvent, TimelineWhen } from "./timeline.js";
|
|
102
104
|
import { TodoItem, TodoList, TodoStatus } from "./todo-list.js";
|
|
105
|
+
import { ToolAbsence, ToolState } from "./tool-state.js";
|
|
103
106
|
import { ToolCall, ToolCallProps } from "./tool-call.js";
|
|
104
107
|
import { ToolError } from "./tool-error.js";
|
|
105
108
|
import { GroupedTool, GroupedToolState, ToolGroup } from "./tool-group.js";
|
|
@@ -107,10 +110,11 @@ import { TimelineStat, TimelineStep, ToolTimeline, ToolTimelineProps } from "./t
|
|
|
107
110
|
import { SpanStatus, TraceSpan, TraceWaterfall } from "./trace-waterfall.js";
|
|
108
111
|
import { TimeBoundary, TimeBoundaryProps, UnreadDivider, UnreadDividerProps } from "./transcript-rules.js";
|
|
109
112
|
import { TurnFooter, TurnFooterProps, TurnTimestamp } from "./turn-footer.js";
|
|
113
|
+
import { UnsupportedRequestCard, UnsupportedRequestCardProps } from "./unsupported-request-card.js";
|
|
110
114
|
import { TypingIndicator } from "./typing-indicator.js";
|
|
111
115
|
import { VerdictIssue, VerdictRow, VerdictRowProps, VerdictTone, verdictStars } from "./verdict-row.js";
|
|
112
116
|
import { VoiceConversation, VoiceMode, VoiceTurn } from "./voice-conversation.js";
|
|
113
117
|
import { WebPreview } from "./web-preview.js";
|
|
114
118
|
import { WebSearch, WebSearchResult } from "./web-search.js";
|
|
115
119
|
import { WorkCollapse, WorkCollapseProps, WorkSummary, formatWorkDuration, formatWorkLabel } from "./work-collapse.js";
|
|
116
|
-
export { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, ActivityGraph, AgentCard, type AgentFidelity, AgentHandoff, type AgentMode, AgentModeBadge, type AgentModeBadgeProps, AgentPlan, type AgentSkill, type AgentSkin, type AgentState, AgentStatus, AgentSurface, type AgentSurfaceProps, type AlwaysAllowInput, type AlwaysAllowLabel, AnimatedNumber, type AnimatedNumberProps, type Announcements, ApprovalCard, type ApprovalState, ArtifactCard, BackgroundInbox, type BackgroundRun, type BackgroundState, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, CanvasSplit, CanvasSplitBody, CanvasSplitDocument, CanvasSplitHeader, CanvasSplitLine, CanvasSplitMessage, CanvasSplitThread, type ChangeSummary, Chart, type ChartVariant, ChatEmptyState, ChatPanel, ChatPanelAssistantMessage, ChatPanelComposer, ChatPanelMessages, ChatPanelTyping, ChatPanelUserMessage, type Checkpoint, CheckpointHistory, type CitationSource, Clamp, type ClampLabels, type ClampProps, CodeDiff, CodeRunner, CompactionRow, type CompactionRowProps, type CompactionState, ComparisonCard, type ComparisonOption, ComposerActions, ComposerAttachButton, type ComposerAttachment, ComposerAttachmentChip, ComposerAttachments, ComposerBar, type ComposerCommand, ComposerCommandItem, ComposerContext, ComposerInput, ComposerMenu, ComposerMenuItem, type ComposerModel, ComposerModelItem, ComposerModelTrigger, type ComposerPerson, ComposerPersonItem, ComposerSend, ComposerToolbar, type ComposerUsage, ComposerVoice, ComposerVoiceButton, type ComputerStep, ComputerUse, type Confidence, type ConfidenceClaim, ConfidenceMarker, type ConnectionPhase, ConnectionState, ContextBreakdown, type ContextCategory, type ContextLabels, type ContextSegment, type ContextStat, type ContextTone, ContextUsage, type ContextUsageProps, ConversationSearch, type CostLine, CostMeter, type DataTableProps, type DatedMessage, DaySeparator, Diagram, type DiffHunk, type DiffKind, type DiffLine, type DocumentAnchor, DocumentReference, DraftRestore, EditMessage, type EffortLevel, ElementsCommandPalette, ElementsComposer, ElementsDataTable, ElementsTimeline, type ElicitationField, ElicitationForm, type ElicitationState, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions, EndOfTurnSummary, type EndOfTurnSummaryProps, ErrorState, type ErrorStateProps, FeedbackDialog, FileTree, type FileTreeNode, type FlowEdge, FlowGraph, type FlowNode, type FlowNodeState, Frac, GenerationLoader, type GenerationLoaderProps, type GenerationLoaderVariant, type GrantScope, type GroupedTool, type GroupedToolState, GuardrailNotice, type HunkDecision, ImageGeneration, InlineCitation, type InlineCitationProps, JobProgress, type JobStage, LauncherBubble, LiveRegionAnnouncer, type LiveRegionAnnouncerProps, MapAnswer, type MapPin, MathBlock, type MathStep, type McpServer, McpServerPanel, type McpServerStatus, type MemoryChange, type MemoryChip, MemoryChips, MessageActions, type MessageActionsProps, type MessageAttachmentItem, MessageAttachments, MessageBranches, type MessageBranchesProps, MessagePair, type MessagePairProps, MessageQueue, MessageTiming, MobileComposer, ModelPicker, type ModelUsage, NumberTicker, Onboarding, type OnboardingStep, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, type PaletteCommand, PermissionGrant, type PermissionLabels, type PermissionScope, PermissionScopes, type PermissionScopesProps, type PickableModel, PromptLibrary, QUEUE_LABELS, QueueDock, type QueueDockProps, type QueueLabels, type QueuedFollowUp, type QueuedMessage, QuotaBanner, type QuoteAction, QuoteReply, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, type Reaction, ReadAloud, ReasoningEffort, ReasoningPanel, type ReasoningPanelProps, type ReasoningStep, RecommendationCard, type RecommendationState, RegenerateMenu, type RegenerateOption, type ReportSection, ResearchReport, type RetrievalChunk, RetrievalChunks, RevertDock, type RevertDockProps, type RevertLabels, type RevertReach, type RevertScope, ReviewableDiff, RiskBadge, type RiskBadgeProps, type RunState, SECURITY_RISKS, type SavedPrompt, ScheduleCard, type ScheduleRun, ScoreBreakdown, type ScoreCriterion, ScrollAnchor, type ScrollAnchorMessage, type SearchHit, type SearchableThread, type SectionState, type SecurityRisk, type Segment, type SettingToggle, SettingsPanel, SharedConversation, type SharedTurn, ShimmerLabel, type Source, Sources, type SourcesProps, type SpanStatus, SpeakerIdentity, type SpeakerKind, type SpeakerTurn, type SpecRow, SpecSheet, type StatusStep, StoppedRun, StreamingText, Sub, type SubagentItem, SubagentList, Suggestions, type SuggestionsProps, Sup, SwapLabel, TAIL_ACTIONS, TURN_ACTION_LABELS, type TailAction, type TailPriority, TailStatus, type TailStatusProps, TerminalBlock, ThinkingIndicator, type ThreadItem, ThreadList, ThreadSearch, TimeBoundary, type TimeBoundaryProps, type TimelineEvent, type TimelineStat, type TimelineStep, type TimelineWhen, type TimingStat, type TodoItem, TodoList, type TodoStatus, ToolCall, type ToolCallProps, ToolError, ToolGroup, ToolTimeline, type ToolTimelineProps, type TraceSpan, TraceWaterfall, type TurnActionLabels, TurnFooter, type TurnFooterProps, type TurnTimestamp, TypingIndicator, UnreadDivider, type UnreadDividerProps, VERB_TRIADS, VERDICT_LABELS, type VerbKind, type VerbTense, type VerbTriad, type VerdictIssue, type VerdictLabels, VerdictRow, type VerdictRowProps, type VerdictTone, VoiceConversation, type VoiceMode, type VoiceTurn, WebPreview, WebSearch, type WebSearchResult, WorkCollapse, type WorkCollapseProps, type WorkSummary, applyMention, at, clamp, codeScroll, codeSurface, collapsePanel, field, fieldInteractive, floating, formatAlwaysAllow, formatChangeSummary, formatCompactNumber, formatQueueSummary, formatRevertSummary, formatWorkDuration, formatWorkLabel, ghostButton, iconSwap, iconSwapIn, iconSwapOut, indexIn, inkButton, labelSwap, labelSwapIn, labelSwapOut, live, mono, paper, pct, pressable, progressOf, take, useAnnouncerPresent, useMentionMatches, useSlashMatches, verbFor, verdictStars };
|
|
120
|
+
export { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, ActivityGraph, AgentCard, type AgentFidelity, AgentHandoff, type AgentMode, AgentModeBadge, type AgentModeBadgeProps, AgentPlan, type AgentSkill, type AgentSkin, type AgentState, AgentStatus, AgentSurface, type AgentSurfaceProps, type AlwaysAllowInput, type AlwaysAllowLabel, AnimatedNumber, type AnimatedNumberProps, type Announcements, ApprovalCard, type ApprovalOption, type ApprovalState, ArtifactCard, BackgroundInbox, type BackgroundRun, type BackgroundState, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, CanvasSplit, CanvasSplitBody, CanvasSplitDocument, CanvasSplitHeader, CanvasSplitLine, CanvasSplitMessage, CanvasSplitThread, type ChangeSummary, Chart, type ChartVariant, ChatEmptyState, ChatPanel, ChatPanelAssistantMessage, ChatPanelComposer, ChatPanelMessages, ChatPanelTyping, ChatPanelUserMessage, type Checkpoint, CheckpointHistory, type CitationSource, Clamp, type ClampLabels, type ClampProps, CodeDiff, CodeRunner, CompactionRow, type CompactionRowProps, type CompactionState, ComparisonCard, type ComparisonOption, ComposerActions, ComposerAttachButton, type ComposerAttachment, ComposerAttachmentChip, ComposerAttachments, ComposerBar, type ComposerCommand, ComposerCommandItem, ComposerContext, ComposerInput, ComposerMenu, ComposerMenuItem, type ComposerModel, ComposerModelItem, ComposerModelTrigger, type ComposerPerson, ComposerPersonItem, ComposerSend, ComposerToolbar, type ComposerUsage, ComposerVoice, ComposerVoiceButton, type ComputerStep, ComputerUse, type Confidence, type ConfidenceClaim, ConfidenceMarker, type ConnectionPhase, ConnectionState, ContextBreakdown, type ContextCategory, type ContextLabels, type ContextSegment, type ContextStat, type ContextTone, ContextUsage, type ContextUsageProps, ConversationSearch, type CostLine, CostMeter, DELIVERY_LABELS, type DataTableProps, type DatedMessage, DaySeparator, Diagram, type DiffHunk, type DiffKind, type DiffLine, type DocumentAnchor, DocumentReference, DraftRestore, EVENT_FEED_LABELS, EditMessage, type EffortLevel, ElementsCommandPalette, ElementsComposer, ElementsDataTable, ElementsTimeline, type ElicitationField, ElicitationForm, type ElicitationState, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions, EndOfTurnSummary, type EndOfTurnSummaryProps, ErrorState, type ErrorStateProps, EventFeed, type EventFeedLabels, type EventFeedProps, EventRow, type EventRowProps, type FeedEvent, type FeedEventTone, FeedbackDialog, FileTree, type FileTreeNode, type FlowEdge, FlowGraph, type FlowNode, type FlowNodeState, Frac, GenerationLoader, type GenerationLoaderProps, type GenerationLoaderVariant, type GrantScope, type GroupedTool, type GroupedToolState, GuardrailNotice, type HunkDecision, ImageGeneration, InlineCitation, type InlineCitationProps, JobProgress, type JobStage, LauncherBubble, LiveRegionAnnouncer, type LiveRegionAnnouncerProps, MapAnswer, type MapPin, MathBlock, type MathStep, type McpServer, McpServerPanel, type McpServerStatus, type MemoryChange, type MemoryChip, MemoryChips, MessageActions, type MessageActionsProps, type MessageAttachmentItem, MessageAttachments, MessageBranches, type MessageBranchesProps, MessagePair, type MessagePairProps, MessageQueue, MessageTiming, MobileComposer, ModelPicker, type ModelUsage, NumberTicker, Onboarding, type OnboardingStep, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, type PaletteCommand, PermissionGrant, type PermissionLabels, type PermissionScope, PermissionScopes, type PermissionScopesProps, type PickableModel, PromptLibrary, QUESTION_LABELS, QUEUE_LABELS, QuestionCard, type QuestionCardProps, type QuestionLabels, QueueDock, type QueueDockProps, type QueueLabels, type QueuedFollowUp, type QueuedMessage, QuotaBanner, type QuoteAction, QuoteReply, REQUEST_DELIVERIES, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, type Reaction, ReadAloud, ReasoningEffort, ReasoningPanel, type ReasoningPanelProps, type ReasoningStep, RecommendationCard, type RecommendationState, RegenerateMenu, type RegenerateOption, type ReportSection, type RequestDelivery, ResearchReport, type RetrievalChunk, RetrievalChunks, RevertDock, type RevertDockProps, type RevertLabels, type RevertReach, type RevertScope, ReviewableDiff, RiskBadge, type RiskBadgeProps, type RunState, SECURITY_RISKS, type SavedPrompt, ScheduleCard, type ScheduleRun, ScoreBreakdown, type ScoreCriterion, ScrollAnchor, type ScrollAnchorMessage, type SearchHit, type SearchableThread, type SectionState, type SecurityRisk, type Segment, type SettingToggle, SettingsPanel, SharedConversation, type SharedTurn, ShimmerLabel, type Source, Sources, type SourcesProps, type SpanStatus, SpeakerIdentity, type SpeakerKind, type SpeakerTurn, type SpecRow, SpecSheet, type StatusStep, StoppedRun, StreamingText, Sub, type SubagentItem, SubagentList, Suggestions, type SuggestionsProps, Sup, SwapLabel, TAIL_ACTIONS, TURN_ACTION_LABELS, type TailAction, type TailPriority, TailStatus, type TailStatusProps, TerminalBlock, ThinkingIndicator, type ThreadItem, ThreadList, ThreadSearch, TimeBoundary, type TimeBoundaryProps, type TimelineEvent, type TimelineStat, type TimelineStep, type TimelineWhen, type TimingStat, type TodoItem, TodoList, type TodoStatus, type ToolAbsence, ToolCall, type ToolCallProps, ToolError, ToolGroup, type ToolState, ToolTimeline, type ToolTimelineProps, type TraceSpan, TraceWaterfall, type TurnActionLabels, TurnFooter, type TurnFooterProps, type TurnTimestamp, TypingIndicator, UNSUPPORTED_REQUEST_LABELS, UnreadDivider, type UnreadDividerProps, UnsupportedRequestCard, type UnsupportedRequestCardProps, type UnsupportedRequestLabels, VERB_TRIADS, VERDICT_LABELS, type VerbKind, type VerbTense, type VerbTriad, type VerdictIssue, type VerdictLabels, VerdictRow, type VerdictRowProps, type VerdictTone, VoiceConversation, type VoiceMode, type VoiceTurn, WebPreview, WebSearch, type WebSearchResult, WorkCollapse, type WorkCollapseProps, type WorkSummary, applyMention, at, clamp, codeScroll, codeSurface, collapsePanel, field, fieldInteractive, floating, formatAlwaysAllow, formatChangeSummary, formatCompactNumber, formatQueueSummary, formatRevertSummary, formatWorkDuration, formatWorkLabel, ghostButton, iconSwap, iconSwapIn, iconSwapOut, indexIn, inkButton, labelSwap, labelSwapIn, labelSwapOut, live, mono, paper, pct, pressable, progressOf, take, useAnnouncerPresent, useMentionMatches, useSlashMatches, verbFor, verdictStars };
|
package/dist/elements/index.js
CHANGED
|
@@ -2,7 +2,7 @@ import { ShimmerLabel, SwapLabel, codeScroll, codeSurface, collapsePanel, field,
|
|
|
2
2
|
import { ActivityGraph } from "./activity-graph.js";
|
|
3
3
|
import { AgentCard } from "./agent-card.js";
|
|
4
4
|
import { AgentHandoff } from "./agent-handoff.js";
|
|
5
|
-
import { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, QUEUE_LABELS, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, SECURITY_RISKS, TAIL_ACTIONS, TURN_ACTION_LABELS, VERB_TRIADS, VERDICT_LABELS, verbFor } from "./vocabulary.js";
|
|
5
|
+
import { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, DELIVERY_LABELS, EVENT_FEED_LABELS, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, QUESTION_LABELS, QUEUE_LABELS, REQUEST_DELIVERIES, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, SECURITY_RISKS, TAIL_ACTIONS, TURN_ACTION_LABELS, UNSUPPORTED_REQUEST_LABELS, VERB_TRIADS, VERDICT_LABELS, verbFor } from "./vocabulary.js";
|
|
6
6
|
import { AgentModeBadge } from "./agent-mode-badge.js";
|
|
7
7
|
import { at, clamp, indexIn, pct, progressOf, take } from "./range.js";
|
|
8
8
|
import { AgentPlan } from "./agent-plan.js";
|
|
@@ -37,6 +37,7 @@ import { DocumentReference } from "./document-reference.js";
|
|
|
37
37
|
import { DraftRestore } from "./draft-restore.js";
|
|
38
38
|
import { EditMessage } from "./edit-message.js";
|
|
39
39
|
import { ElicitationForm } from "./elicitation-form.js";
|
|
40
|
+
import { EventFeed, EventRow } from "./event-feed.js";
|
|
40
41
|
import { ChatEmptyState, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions } from "./empty-state.js";
|
|
41
42
|
import { EndOfTurnSummary, formatChangeSummary } from "./end-of-turn-summary.js";
|
|
42
43
|
import { ErrorState } from "./error-state.js";
|
|
@@ -67,6 +68,7 @@ import { Onboarding } from "./onboarding.js";
|
|
|
67
68
|
import { PermissionGrant } from "./permission-grant.js";
|
|
68
69
|
import { PermissionScopes, formatAlwaysAllow } from "./permission-scopes.js";
|
|
69
70
|
import { PromptLibrary } from "./prompt-library.js";
|
|
71
|
+
import { QuestionCard } from "./question-card.js";
|
|
70
72
|
import { QueueDock, formatQueueSummary } from "./queue-dock.js";
|
|
71
73
|
import { QuotaBanner } from "./quota-banner.js";
|
|
72
74
|
import { QuoteReply } from "./quote-reply.js";
|
|
@@ -106,10 +108,11 @@ import { ToolTimeline } from "./tool-timeline.js";
|
|
|
106
108
|
import { TraceWaterfall } from "./trace-waterfall.js";
|
|
107
109
|
import { TimeBoundary, UnreadDivider } from "./transcript-rules.js";
|
|
108
110
|
import { TurnFooter } from "./turn-footer.js";
|
|
111
|
+
import { UnsupportedRequestCard } from "./unsupported-request-card.js";
|
|
109
112
|
import { TypingIndicator } from "./typing-indicator.js";
|
|
110
113
|
import { VerdictRow, verdictStars } from "./verdict-row.js";
|
|
111
114
|
import { VoiceConversation } from "./voice-conversation.js";
|
|
112
115
|
import { WebPreview } from "./web-preview.js";
|
|
113
116
|
import { WebSearch } from "./web-search.js";
|
|
114
117
|
import { WorkCollapse, formatWorkDuration, formatWorkLabel } from "./work-collapse.js";
|
|
115
|
-
export { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, ActivityGraph, AgentCard, AgentHandoff, AgentModeBadge, AgentPlan, AgentStatus, AgentSurface, AnimatedNumber, ApprovalCard, ArtifactCard, BackgroundInbox, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, CanvasSplit, CanvasSplitBody, CanvasSplitDocument, CanvasSplitHeader, CanvasSplitLine, CanvasSplitMessage, CanvasSplitThread, Chart, ChatEmptyState, ChatPanel, ChatPanelAssistantMessage, ChatPanelComposer, ChatPanelMessages, ChatPanelTyping, ChatPanelUserMessage, CheckpointHistory, Clamp, CodeDiff, CodeRunner, CompactionRow, ComparisonCard, ComposerActions, ComposerAttachButton, ComposerAttachmentChip, ComposerAttachments, ComposerBar, ComposerCommandItem, ComposerContext, ComposerInput, ComposerMenu, ComposerMenuItem, ComposerModelItem, ComposerModelTrigger, ComposerPersonItem, ComposerSend, ComposerToolbar, ComposerVoice, ComposerVoiceButton, ComputerUse, ConfidenceMarker, ConnectionState, ContextBreakdown, ContextUsage, ConversationSearch, CostMeter, DaySeparator, Diagram, DocumentReference, DraftRestore, EditMessage, ElementsCommandPalette, ElementsComposer, ElementsDataTable, ElementsTimeline, ElicitationForm, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions, EndOfTurnSummary, ErrorState, FeedbackDialog, FileTree, FlowGraph, Frac, GenerationLoader, GuardrailNotice, ImageGeneration, InlineCitation, JobProgress, LauncherBubble, LiveRegionAnnouncer, MapAnswer, MathBlock, McpServerPanel, MemoryChips, MessageActions, MessageAttachments, MessageBranches, MessagePair, MessageQueue, MessageTiming, MobileComposer, ModelPicker, NumberTicker, Onboarding, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, PermissionGrant, PermissionScopes, PromptLibrary, QUEUE_LABELS, QueueDock, QuotaBanner, QuoteReply, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, ReadAloud, ReasoningEffort, ReasoningPanel, RecommendationCard, RegenerateMenu, ResearchReport, RetrievalChunks, RevertDock, ReviewableDiff, RiskBadge, SECURITY_RISKS, ScheduleCard, ScoreBreakdown, ScrollAnchor, SettingsPanel, SharedConversation, ShimmerLabel, Sources, SpeakerIdentity, SpecSheet, StoppedRun, StreamingText, Sub, SubagentList, Suggestions, Sup, SwapLabel, TAIL_ACTIONS, TURN_ACTION_LABELS, TailStatus, TerminalBlock, ThinkingIndicator, ThreadList, ThreadSearch, TimeBoundary, TodoList, ToolCall, ToolError, ToolGroup, ToolTimeline, TraceWaterfall, TurnFooter, TypingIndicator, UnreadDivider, VERB_TRIADS, VERDICT_LABELS, VerdictRow, VoiceConversation, WebPreview, WebSearch, WorkCollapse, applyMention, at, clamp, codeScroll, codeSurface, collapsePanel, field, fieldInteractive, floating, formatAlwaysAllow, formatChangeSummary, formatCompactNumber, formatQueueSummary, formatRevertSummary, formatWorkDuration, formatWorkLabel, ghostButton, iconSwap, iconSwapIn, iconSwapOut, indexIn, inkButton, labelSwap, labelSwapIn, labelSwapOut, live, mono, paper, pct, pressable, progressOf, take, useAnnouncerPresent, useMentionMatches, useSlashMatches, verbFor, verdictStars };
|
|
118
|
+
export { AGENT_MODES, AGENT_MODE_DESCRIPTIONS, AGENT_MODE_LABELS, ANNOUNCEMENTS, ActivityGraph, AgentCard, AgentHandoff, AgentModeBadge, AgentPlan, AgentStatus, AgentSurface, AnimatedNumber, ApprovalCard, ArtifactCard, BackgroundInbox, CLAMP_LABELS, COMPACTION_LABELS, COMPACTION_STATES, CONTEXT_CATEGORY_LABELS, CONTEXT_LABELS, CONTEXT_STAT_LABELS, CanvasSplit, CanvasSplitBody, CanvasSplitDocument, CanvasSplitHeader, CanvasSplitLine, CanvasSplitMessage, CanvasSplitThread, Chart, ChatEmptyState, ChatPanel, ChatPanelAssistantMessage, ChatPanelComposer, ChatPanelMessages, ChatPanelTyping, ChatPanelUserMessage, CheckpointHistory, Clamp, CodeDiff, CodeRunner, CompactionRow, ComparisonCard, ComposerActions, ComposerAttachButton, ComposerAttachmentChip, ComposerAttachments, ComposerBar, ComposerCommandItem, ComposerContext, ComposerInput, ComposerMenu, ComposerMenuItem, ComposerModelItem, ComposerModelTrigger, ComposerPersonItem, ComposerSend, ComposerToolbar, ComposerVoice, ComposerVoiceButton, ComputerUse, ConfidenceMarker, ConnectionState, ContextBreakdown, ContextUsage, ConversationSearch, CostMeter, DELIVERY_LABELS, DaySeparator, Diagram, DocumentReference, DraftRestore, EVENT_FEED_LABELS, EditMessage, ElementsCommandPalette, ElementsComposer, ElementsDataTable, ElementsTimeline, ElicitationForm, EmptyStateComposer, EmptyStateGreeting, EmptyStateSuggestion, EmptyStateSuggestions, EndOfTurnSummary, ErrorState, EventFeed, EventRow, FeedbackDialog, FileTree, FlowGraph, Frac, GenerationLoader, GuardrailNotice, ImageGeneration, InlineCitation, JobProgress, LauncherBubble, LiveRegionAnnouncer, MapAnswer, MathBlock, McpServerPanel, MemoryChips, MessageActions, MessageAttachments, MessageBranches, MessagePair, MessageQueue, MessageTiming, MobileComposer, ModelPicker, NumberTicker, Onboarding, PERMISSION_LABELS, PERMISSION_SCOPE_LABELS, PermissionGrant, PermissionScopes, PromptLibrary, QUESTION_LABELS, QUEUE_LABELS, QuestionCard, QueueDock, QuotaBanner, QuoteReply, REQUEST_DELIVERIES, REVERT_LABELS, REVERT_SCOPES, REVERT_SCOPE_DESCRIPTIONS, REVERT_SCOPE_LABELS, RISK_LABELS, ReadAloud, ReasoningEffort, ReasoningPanel, RecommendationCard, RegenerateMenu, ResearchReport, RetrievalChunks, RevertDock, ReviewableDiff, RiskBadge, SECURITY_RISKS, ScheduleCard, ScoreBreakdown, ScrollAnchor, SettingsPanel, SharedConversation, ShimmerLabel, Sources, SpeakerIdentity, SpecSheet, StoppedRun, StreamingText, Sub, SubagentList, Suggestions, Sup, SwapLabel, TAIL_ACTIONS, TURN_ACTION_LABELS, TailStatus, TerminalBlock, ThinkingIndicator, ThreadList, ThreadSearch, TimeBoundary, TodoList, ToolCall, ToolError, ToolGroup, ToolTimeline, TraceWaterfall, TurnFooter, TypingIndicator, UNSUPPORTED_REQUEST_LABELS, UnreadDivider, UnsupportedRequestCard, VERB_TRIADS, VERDICT_LABELS, VerdictRow, VoiceConversation, WebPreview, WebSearch, WorkCollapse, applyMention, at, clamp, codeScroll, codeSurface, collapsePanel, field, fieldInteractive, floating, formatAlwaysAllow, formatChangeSummary, formatCompactNumber, formatQueueSummary, formatRevertSummary, formatWorkDuration, formatWorkLabel, ghostButton, iconSwap, iconSwapIn, iconSwapOut, indexIn, inkButton, labelSwap, labelSwapIn, labelSwapOut, live, mono, paper, pct, pressable, progressOf, take, useAnnouncerPresent, useMentionMatches, useSlashMatches, verbFor, verdictStars };
|
|
@@ -21,7 +21,7 @@ function Citation({ index, source, open, onOpenChange }) {
|
|
|
21
21
|
side: "top",
|
|
22
22
|
sideOffset: 8,
|
|
23
23
|
children: /* @__PURE__ */ jsxs(PreviewCard.Popup, {
|
|
24
|
-
className: cn(floating, "z-50 w-64 origin-(--transform-origin) rounded-overlay p-3.5 outline-none", "transition-[opacity,scale] duration-
|
|
24
|
+
className: cn(floating, "z-50 w-64 origin-(--transform-origin) rounded-overlay p-3.5 outline-none", "transition-[opacity,scale] duration-brisk ease-[cubic-bezier(0.23,1,0.32,1)] motion-reduce:transition-none", "data-[starting-style]:scale-[0.97] data-[starting-style]:opacity-0", "data-[ending-style]:scale-[0.97] data-[ending-style]:opacity-0"),
|
|
25
25
|
children: [
|
|
26
26
|
/* @__PURE__ */ jsxs("div", {
|
|
27
27
|
className: "flex items-center gap-1.5",
|
|
@@ -56,7 +56,7 @@ function JobProgress({ title, stages, stageIndex, stageProgress, eta, onCancel,
|
|
|
56
56
|
/* @__PURE__ */ jsx("span", {
|
|
57
57
|
className: "bg-surface-2 h-1 w-full overflow-hidden rounded-full",
|
|
58
58
|
children: /* @__PURE__ */ jsx("span", {
|
|
59
|
-
className: cn("block h-full rounded-full transition-[width] duration-
|
|
59
|
+
className: cn("block h-full rounded-full transition-[width] duration-slow ease-out motion-reduce:transition-none", finished ? "bg-ok" : "bg-stream"),
|
|
60
60
|
style: { width: `${overall}%` }
|
|
61
61
|
})
|
|
62
62
|
}),
|
|
@@ -24,7 +24,7 @@ function LauncherBubble({ open, unread, greeting, prompts, onToggle, onPick, onS
|
|
|
24
24
|
className: cn("flex w-full max-w-[19rem] flex-col items-end gap-2.5", className),
|
|
25
25
|
...props,
|
|
26
26
|
children: [open && /* @__PURE__ */ jsxs("div", {
|
|
27
|
-
className: cn("bg-surface-2 border border-border-overlay", "cue-elements-fade-in cue-elements-zoom-in-95 cue-elements-slide-in-from-bottom-2 cue-elements-animate-in flex w-full flex-col gap-3 rounded-overlay p-4 duration-
|
|
27
|
+
className: cn("bg-surface-2 border border-border-overlay", "cue-elements-fade-in cue-elements-zoom-in-95 cue-elements-slide-in-from-bottom-2 cue-elements-animate-in flex w-full flex-col gap-3 rounded-overlay p-4 duration-brisk"),
|
|
28
28
|
children: [
|
|
29
29
|
/* @__PURE__ */ jsxs("div", {
|
|
30
30
|
className: "flex flex-col gap-1",
|
|
@@ -48,7 +48,7 @@ function LauncherBubble({ open, unread, greeting, prompts, onToggle, onPick, onS
|
|
|
48
48
|
/* @__PURE__ */ jsx("button", {
|
|
49
49
|
type: "button",
|
|
50
50
|
onClick: onStart,
|
|
51
|
-
className: cn("bg-accent text-accent-fg transition-[background-color,scale] duration-
|
|
51
|
+
className: cn("bg-accent text-accent-fg transition-[background-color,scale] duration-fast ease-[cubic-bezier(0.23,1,0.32,1)] hover:bg-accent-hover active:scale-[0.96] motion-reduce:transition-none", "flex h-8 items-center justify-center rounded-full text-(length:--cue-text-ui) font-medium"),
|
|
52
52
|
children: "Start a conversation"
|
|
53
53
|
})
|
|
54
54
|
]
|
|
@@ -60,7 +60,7 @@ function LauncherBubble({ open, unread, greeting, prompts, onToggle, onPick, onS
|
|
|
60
60
|
className: cn(inkButton, "relative flex size-12 shrink-0 items-center justify-center rounded-full"),
|
|
61
61
|
children: [/* @__PURE__ */ jsxs("span", {
|
|
62
62
|
className: "grid",
|
|
63
|
-
children: [/* @__PURE__ */ jsx(MessageCircleIcon, { className: cn("size-5 transition-[opacity,rotate] duration-
|
|
63
|
+
children: [/* @__PURE__ */ jsx(MessageCircleIcon, { className: cn("size-5 transition-[opacity,rotate] duration-brisk [grid-area:1/1]", open && "rotate-90 opacity-0") }), /* @__PURE__ */ jsx(XIcon, { className: cn("size-5 transition-[opacity,rotate] duration-brisk [grid-area:1/1]", !open && "-rotate-90 opacity-0") })]
|
|
64
64
|
}), unread > 0 && !open && /* @__PURE__ */ jsx("span", {
|
|
65
65
|
className: cn("font-mono text-(length:--cue-text-label) tracking-tight", "bg-bg text-fg absolute -top-0.5 -right-0.5 flex size-4 items-center justify-center rounded-full tabular-nums"),
|
|
66
66
|
children: unread
|
|
@@ -24,7 +24,7 @@ function GenerationLoader({ label, tick, variant = "dots", className, ...props }
|
|
|
24
24
|
className: "grid grid-cols-3 gap-1",
|
|
25
25
|
children: Array.from({ length: 9 }, (_, index) => {
|
|
26
26
|
const active = (index * 2 + pixelOffset) % 9 < 3;
|
|
27
|
-
return /* @__PURE__ */ jsx("span", { className: cn("bg-accent size-2 transition-opacity duration-
|
|
27
|
+
return /* @__PURE__ */ jsx("span", { className: cn("bg-accent size-2 transition-opacity duration-base motion-reduce:transition-none", CELL_SHAPES[variant], active ? "opacity-90" : "opacity-15") }, index);
|
|
28
28
|
})
|
|
29
29
|
}), /* @__PURE__ */ jsx(ShimmerLabel, {
|
|
30
30
|
className: "text-fg-muted relative inline-block text-(length:--cue-text-body)",
|
|
@@ -70,7 +70,7 @@ function MapAnswer({ pins, activeId, route, onSelect, className, ...props }) {
|
|
|
70
70
|
left: `${pin.x}%`,
|
|
71
71
|
top: `${pin.y}%`
|
|
72
72
|
},
|
|
73
|
-
children: /* @__PURE__ */ jsx("span", { className: cn("block rounded-full border-2 transition-all duration-
|
|
73
|
+
children: /* @__PURE__ */ jsx("span", { className: cn("block rounded-full border-2 transition-all duration-brisk motion-reduce:transition-none", pin.id === activeId ? "border-bg size-3.5 bg-stream" : "border-bg bg-surface-3 size-2.5") })
|
|
74
74
|
}, pin.id))]
|
|
75
75
|
}), /* @__PURE__ */ jsx("div", {
|
|
76
76
|
className: "flex flex-col",
|
|
@@ -21,7 +21,7 @@ function MathBlock({ label, steps, visibleSteps, className, ...props }) {
|
|
|
21
21
|
className: cn("font-mono text-(length:--cue-text-label) tracking-tight", "text-fg-subtle"),
|
|
22
22
|
children: label
|
|
23
23
|
}), take(steps, visibleSteps).map((step, i) => /* @__PURE__ */ jsxs("div", {
|
|
24
|
-
className: "cue-elements-fade-in cue-elements-slide-in-from-bottom-1 cue-elements-animate-in cue-elements-fill-mode-both flex flex-col gap-1 duration-
|
|
24
|
+
className: "cue-elements-fade-in cue-elements-slide-in-from-bottom-1 cue-elements-animate-in cue-elements-fill-mode-both flex flex-col gap-1 duration-base",
|
|
25
25
|
children: [/* @__PURE__ */ jsx("span", {
|
|
26
26
|
className: "text-fg overflow-x-auto py-1 text-center font-serif text-(length:--cue-text-emphasis) leading-(--cue-leading-ui) italic",
|
|
27
27
|
children: step.expression
|