@flytedan/flytebot-design-system 0.6.1 → 0.7.0

package/dist/index.d.cts

@@ -970,6 +970,230 @@ interface StepListProps {
  */
 declare function StepList({ steps, label, defaultOpen, open: openProp, onToggle, showDurations, dense, className, }: StepListProps): React.JSX.Element | null;
 
+/** Number of rows kept mounted above and below the visible band. Two buffers this size
+ *  (one per edge) plus the visible band itself is what keeps the mounted node count
+ *  bounded — see the file doc comment below for why 20 is the right number here. */
+declare const VIRTUAL_LIST_BUFFER_ROWS = 20;
+interface VirtualWindow {
+    /** Index of the first row a viewport of this height would actually show. */
+    visibleStart: number;
+    /** Index of the last row a viewport of this height would actually show (inclusive). */
+    visibleEnd: number;
+    /** Index of the first row that should be mounted in the DOM (visibleStart minus the buffer, clamped to 0). */
+    startIndex: number;
+    /** Index of the last row that should be mounted in the DOM (inclusive; visibleEnd plus the buffer, clamped to itemCount - 1). */
+    endIndex: number;
+    /** Full scrollable height in px — this is what makes the scrollbar/scroll range honest
+     *  about itemCount even though only a slice of it is ever mounted. */
+    totalHeight: number;
+    /** px the mounted block must be pushed down so its rows land at their real scroll position. */
+    offsetY: number;
+}
+/**
+ * Pure windowing math: given a scroll position and the shape of the data, decide which
+ * row indices are visible and which should actually be mounted. Kept free of React and
+ * the DOM on purpose — see VirtualList's doc comment for why this is exported and tested
+ * on its own rather than only indirectly through a mounted component.
+ *
+ * Every fixed-height virtualizer boils down to integer division: row i sits at
+ * `i * itemHeight` px, so scrollTop/itemHeight lands on the first partially-visible row
+ * and (scrollTop + viewportHeight)/itemHeight lands on the last one. Everything else here
+ * is clamping that to the buffer and to the real item count.
+ */
+declare function computeVirtualWindow(opts: {
+    scrollTop: number;
+    viewportHeight: number;
+    itemHeight: number;
+    itemCount: number;
+    bufferRows?: number;
+}): VirtualWindow;
+/**
+ * Given the current window and the real item count, says whether the visible band has
+ * come within one buffer's width of either edge of what's currently loaded — the signal
+ * VirtualList uses to ask its caller for more. Threading it through the *visible* band
+ * (not the mounted one) means the caller gets asked while the buffer still has rows left
+ * to show, not only once the user has scrolled past all of them.
+ */
+declare function computeNeedMore(win: Pick<VirtualWindow, "visibleStart" | "visibleEnd">, itemCount: number, bufferRows?: number): {
+    start: boolean;
+    end: boolean;
+};
+interface VirtualListProps<T> {
+    /** Whatever the caller currently has loaded — not the full remote collection. */
+    items: T[];
+    /** Fixed row height in px. Every row is assumed to be exactly this tall. */
+    itemHeight: number;
+    renderItem: (item: T, index: number) => React.ReactNode;
+    /** Fired when the visible band comes within one buffer's width of an edge of `items`
+     *  and that edge isn't known to be exhausted. The caller owns fetching — this only asks. */
+    onNeedMore: (direction: "start" | "end") => void;
+    /** Which edges of `items` still have more behind them. Omitted/undefined reads as "yes,
+     *  there might be more" for that edge, since an unknown edge is the common starting state. */
+    hasMore?: {
+        start?: boolean;
+        end?: boolean;
+    };
+    /** Suppresses onNeedMore while a fetch the caller already started is in flight. */
+    loading?: boolean;
+    keyOf: (item: T) => string | number;
+    /** Viewport height in px. Default (400) is ten rows at the kit's --control-h-md (44px). */
+    height?: number;
+    emptyState?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * VirtualList — a fixed-height windowed viewport for a list the caller may be streaming
+ * in from a few thousand rows at a time.
+ *
+ * Why fixed row height only: variable-height virtualization needs a measurement pass
+ * (render off-screen, read the real height, then correct the scroll math) which is a
+ * meaningfully bigger and more fragile piece of engineering than this kit needs for any
+ * consumer it has today. Every current use case is a single-line-or-two row of known,
+ * consistent height, so the simplest correct approach is the right one: the caller states
+ * itemHeight, and the math is plain arithmetic (see computeVirtualWindow).
+ *
+ * Why plain onScroll + scrollTop math instead of IntersectionObserver: an observer would
+ * still need one sentinel per boundary and a ResizeObserver alongside it to keep the
+ * scroll track honest as itemCount changes — no less code, and it trades arithmetic you
+ * can unit test for browser timing you can't. scrollTop/clientHeight are synchronous and
+ * exact, so the windowing math stays a pure function (computeVirtualWindow, exported and
+ * tested on its own below) with the component itself doing nothing but reading scrollTop
+ * and rendering the slice that function names.
+ *
+ * The window keeps ~10 rows actually visible plus a VIRTUAL_LIST_BUFFER_ROWS-row buffer
+ * mounted above and below (~50 rows mounted at once at the default height), which is
+ * enough that fast wheel/trackpad scrolling never outruns the mounted band before the
+ * next onScroll fires, without ever mounting more than a small bounded slice regardless
+ * of how many thousand rows `items` holds.
+ *
+ * Fully controlled: this holds no item data and no page state, only the scroll position
+ * needed to compute the window. The caller owns fetching more rows (onNeedMore) and
+ * knowing when an edge is exhausted (hasMore).
+ */
+declare function VirtualList<T>({ items, itemHeight, renderItem, onNeedMore, hasMore, loading, keyOf, height, emptyState, className, style, }: VirtualListProps<T>): React.JSX.Element;
+
+interface EntityRowAction {
+    /** Phosphor icon name, e.g. "plus" */
+    icon: string;
+    /** Accessible name for the action button. */
+    label: string;
+    onClick: () => void;
+    /** Tints the icon — "add" reads as constructive (ok-text), "remove" as destructive
+     *  (danger-text). No effect on layout, only color, so a caller can still pass any icon. */
+    tone?: "add" | "remove";
+}
+interface EntityRowProps {
+    title: string;
+    /** A secondary line — a count, a subtitle, whatever the caller's data has that a raw
+     *  title doesn't. Optional because plenty of rows are fine with just a name. */
+    meta?: React.ReactNode;
+    action?: EntityRowAction;
+    /** Marks the row a native HTML5 drag source. Wiring onDragOver/onDrop is the drop
+     *  target's job (a list container, not each row) — see the file doc comment. */
+    draggable?: boolean;
+    onDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;
+    style?: React.CSSProperties;
+    className?: string;
+}
+/**
+ * EntityRow — a single compact row for a name plus an optional secondary line and an
+ * optional action, meant to be stamped out by the hundreds inside a VirtualList.
+ *
+ * Deliberately thin, not a card: no border, no shadow, no internal padding beyond enough
+ * to keep text off the edges, so it reads as one line in a dense list rather than a tile.
+ * Height is left to the caller (it fills 100% of its parent) because VirtualList is what
+ * actually fixes row height, and duplicating that number here would be one more place a
+ * future change has to remember to update.
+ *
+ * The drag/drop split is deliberate: a row only ever needs to say "I am the thing being
+ * dragged" (draggable + onDragStart/onDragEnd), never "something was dropped on me" —
+ * nothing in this kit drops one row onto another to reorder it, only a row onto a list to
+ * move it there. Putting onDragOver/onDrop on every row would mean wiring the same drop
+ * logic N times over instead of once on the list container that actually owns it (see
+ * TransferList), so this only exposes the source half of the native HTML5 DnD contract.
+ * The action button exists precisely so drag-and-drop is never the only way to do the
+ * same move — pointer-only and keyboard users get an equally real affordance, not a
+ * degraded fallback.
+ */
+declare function EntityRow({ title, meta, action, draggable, onDragStart, onDragEnd, style, className }: EntityRowProps): React.JSX.Element;
+
+type TransferListSide = "left" | "right";
+interface TransferListSideProps<T> {
+    /** Whatever this side currently has loaded — not its full remote collection. */
+    items: T[];
+    /** Total matching count on the server, if known — shown next to the label. */
+    total?: number;
+    loading?: boolean;
+    search: string;
+    onSearchChange: (value: string) => void;
+    sort?: {
+        key: string;
+        dir: "asc" | "desc";
+    } | null;
+    sortFields: SortMenuField[];
+    onSort: (key: string, dir: "asc" | "desc") => void;
+    onNeedMore: (direction: "start" | "end") => void;
+    hasMore?: {
+        start?: boolean;
+        end?: boolean;
+    };
+    /** Heading text for this side. Fully caller-supplied — this component has no opinion
+     *  about what the two sides represent. */
+    label?: string;
+}
+interface TransferListProps<T> {
+    left: TransferListSideProps<T>;
+    right: TransferListSideProps<T>;
+    keyOf: (item: T) => string | number;
+    renderLabel: (item: T) => string;
+    renderMeta?: (item: T) => React.ReactNode;
+    /** Fired by both a drag-drop and the equivalent +/- click. The caller owns actually
+     *  moving the item between whatever backing lists it maintains — this component never
+     *  mutates `left.items`/`right.items` itself. */
+    onMove: (item: T, from: TransferListSide, to: TransferListSide) => void;
+    /** Row height fed straight through to each side's VirtualList. Default (44) matches
+     *  the kit's --control-h-md, since that's the height EntityRow is tuned to look right at. */
+    itemHeight?: number;
+    /** Viewport height fed straight through to each side's VirtualList. */
+    listHeight?: number;
+    className?: string;
+}
+/**
+ * TransferList — a dual-list picker for moving items between two collections, by drag or
+ * by a click, over a search box and a sort control each side owns independently.
+ *
+ * Deliberately named "left"/"right" rather than e.g. "available"/"selected": the product
+ * this ships for is one particular use of it, but nothing about moving rows between two
+ * lists is specific to that use, and baking in "available"/"selected" (or worse, this
+ * kit's actual first consumer's own vocabulary) would make every *other* two-list picker
+ * this kit will ever be asked for a second component instead of a second set of props. A
+ * caller wanting domain words passes them through `label`.
+ *
+ * Native HTML5 drag-and-drop, not a library: this kit ships zero runtime dependencies on
+ * purpose, and moving one row between two lists is exactly the case the platform's own
+ * draggable/dragstart/dragover/drop already cover with no gap to fill — sortable-within-
+ * a-list (which does need pointer math and placeholder gaps) is a different, harder
+ * problem this component doesn't attempt. Each row is the drag source (via EntityRow's
+ * draggable prop); each *side* is the drop target — one onDragOver/onDrop pair per side,
+ * not per row, since dropping only ever means "move into this list," never "onto this
+ * particular other row." dataTransfer carries the dragged key mainly so a real
+ * OS-level drag has real payload (Firefox refuses a drag with no data set at all); which
+ * item is actually moved is tracked in local `dragging` state, because dataTransfer's own
+ * payload can't hold a reference to `item: T` — only the string the caller's keyOf gives it.
+ *
+ * The +/- action on every row is not a fallback bolted on for accessibility box-ticking:
+ * it is the same onMove call a drop makes, exposed as a first-class equivalent, because
+ * drag-and-drop alone would silently exclude anyone not using a mouse.
+ *
+ * Fully controlled and stateless about the actual item sets: `left`/`right` are handed in
+ * whole, this never copies or reorders them, and the only state kept locally is which row
+ * is mid-drag and which side a drag is currently over — pure interaction feedback, thrown
+ * away the moment the drag ends.
+ */
+declare function TransferList<T>({ left, right, keyOf, renderLabel, renderMeta, onMove, itemHeight, listHeight, className, }: TransferListProps<T>): React.JSX.Element;
+
 /**
  * Multi-select control with a 44px comfortable hit area.
  */
@@ -2843,4 +3067,4 @@ interface VersionStore<TState, TDiff = unknown> {
 }
 declare function createVersionStore<TState, TDiff = unknown>(initialState: TState, options?: CreateVersionStoreOptions<TState, TDiff>): VersionStore<TState, TDiff>;
 
-export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, ApiSpecBrowser, type ApiSpecBrowserProps, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, type CardProps, CardRow, type CardRowProps, ChannelContribution, type ChannelContributionChannel, type ChannelContributionProps, ChannelMeta, type ChannelMetaRecord, ChannelTag, type ChannelTagProps, ChannelWeightOf, type ChatAdapter, ChatComposer, type ChatComposerProps, type ChatEngine, type ChatEngineOptions, ChatKit, type ChatMessage, type ChatRenderContext, ChatSessionBar, type ChatSessionBarProps, ChatTranscript, type ChatTranscriptProps, ChatTurn, type ChatTurnProps, Checkbox, type CheckboxProps, type Citation, Citations, type CitationsProps, Clamp, type ClampProps, ClockFace, type ClockFaceProps, CodeBlock, type CodeBlockProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DeviceSession, DiffBlock, type DiffBlockProps, Drawer, type DrawerProps, Dropzone, DropzoneKit, type DropzoneProps, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, FeatureGate, type FeatureGateProps, type FeatureStatus, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FilterBar, type FilterBarProps, type FilterField, type FilterFieldOption, type FilterFieldSelect, type FilterFieldText, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, Gate, type GateProps, IconButton, type IconButtonProps, Input, type InputProps, type JobStatus, Json, KeyHint, type KeyHintProps, type ListEnvelope, LoadingRegion, type LoadingRegionProps, Markdown, MarkdownEditor, type MarkdownEditorHandle, type MarkdownEditorProps, MarkdownInline, type MarkdownProps, type MentionSource, Menu, MenuButton, type MenuButtonProps, type MenuItem, type MenuProps, MessageBody, type MessageBodyProps, type MessageGroup, Meter, type MeterProps, type MeterSegment, type MeterSegmentInput, MixGap, type MixGapProps, type MixGapRow, MockJobKit, type MockJobStatus, Modal, type ModalProps, ModeSwitch, type ModeSwitchProps, type Model, ModelControls, type ModelControlsProps, NumberInput, type NumberInputProps, type Packet, PacketCard, type PacketCardProps, type PacketSchema, type Pager, Pagination, type PaginationProps, PermissionDenied, type PermissionDeniedProps, type PermissionGroup, PermissionHint, type PermissionItem, type Placement, type PollOptions, Popover, type PopoverProps, ProfilePage, type ProfilePageProps, ProgressBar, type ProgressBarProps, QueryKit, type QueuedTurn, QuotaRow, type QuotaRowProps, Radio, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, type RoadmapItem, type RoadmapResult, RoadmapTimeline, type RoadmapTimelineProps, type Role, RunActions, type RunActionsProps, type RunConfig, RuntimeKit, type RuntimeSummary, SaturationDistribution, type SaturationDistributionCampus, type SaturationDistributionProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type Flag as SessionFlag, SessionKit, type SessionStats, SidebarNav, type SidebarNavItem, type SidebarNavProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, StatTile, type StatTileProps, type Step, StepList, type StepListProps, type StreamHandlers, type Suggestion, SurroundSound, type SurroundSoundProps, Switch, type SwitchProps, type TableQuery, Tabs, type TabsProps, Tag, type TagProps, TestModeBar, type TestModeBarProps, Textarea, type TextareaProps, ThinkingBlock, type ThinkingBlockProps, type ThreadSummary, TimePicker, type TimePickerProps, Toast, type ToastProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, TranscriptKit, type UsageLimit, UseFeatureStatus, UseRuntimeMode, type UseServerTableOptions, type User, type VersionRecord, type VersionStore, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
+export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, ApiSpecBrowser, type ApiSpecBrowserProps, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, type CardProps, CardRow, type CardRowProps, ChannelContribution, type ChannelContributionChannel, type ChannelContributionProps, ChannelMeta, type ChannelMetaRecord, ChannelTag, type ChannelTagProps, ChannelWeightOf, type ChatAdapter, ChatComposer, type ChatComposerProps, type ChatEngine, type ChatEngineOptions, ChatKit, type ChatMessage, type ChatRenderContext, ChatSessionBar, type ChatSessionBarProps, ChatTranscript, type ChatTranscriptProps, ChatTurn, type ChatTurnProps, Checkbox, type CheckboxProps, type Citation, Citations, type CitationsProps, Clamp, type ClampProps, ClockFace, type ClockFaceProps, CodeBlock, type CodeBlockProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DeviceSession, DiffBlock, type DiffBlockProps, Drawer, type DrawerProps, Dropzone, DropzoneKit, type DropzoneProps, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowProps, FeatureGate, type FeatureGateProps, type FeatureStatus, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FilterBar, type FilterBarProps, type FilterField, type FilterFieldOption, type FilterFieldSelect, type FilterFieldText, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, Gate, type GateProps, IconButton, type IconButtonProps, Input, type InputProps, type JobStatus, Json, KeyHint, type KeyHintProps, type ListEnvelope, LoadingRegion, type LoadingRegionProps, Markdown, MarkdownEditor, type MarkdownEditorHandle, type MarkdownEditorProps, MarkdownInline, type MarkdownProps, type MentionSource, Menu, MenuButton, type MenuButtonProps, type MenuItem, type MenuProps, MessageBody, type MessageBodyProps, type MessageGroup, Meter, type MeterProps, type MeterSegment, type MeterSegmentInput, MixGap, type MixGapProps, type MixGapRow, MockJobKit, type MockJobStatus, Modal, type ModalProps, ModeSwitch, type ModeSwitchProps, type Model, ModelControls, type ModelControlsProps, NumberInput, type NumberInputProps, type Packet, PacketCard, type PacketCardProps, type PacketSchema, type Pager, Pagination, type PaginationProps, PermissionDenied, type PermissionDeniedProps, type PermissionGroup, PermissionHint, type PermissionItem, type Placement, type PollOptions, Popover, type PopoverProps, ProfilePage, type ProfilePageProps, ProgressBar, type ProgressBarProps, QueryKit, type QueuedTurn, QuotaRow, type QuotaRowProps, Radio, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, type RoadmapItem, type RoadmapResult, RoadmapTimeline, type RoadmapTimelineProps, type Role, RunActions, type RunActionsProps, type RunConfig, RuntimeKit, type RuntimeSummary, SaturationDistribution, type SaturationDistributionCampus, type SaturationDistributionProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type Flag as SessionFlag, SessionKit, type SessionStats, SidebarNav, type SidebarNavItem, type SidebarNavProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, StatTile, type StatTileProps, type Step, StepList, type StepListProps, type StreamHandlers, type Suggestion, SurroundSound, type SurroundSoundProps, Switch, type SwitchProps, type TableQuery, Tabs, type TabsProps, Tag, type TagProps, TestModeBar, type TestModeBarProps, Textarea, type TextareaProps, ThinkingBlock, type ThinkingBlockProps, type ThreadSummary, TimePicker, type TimePickerProps, Toast, type ToastProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, TranscriptKit, TransferList, type TransferListProps, type TransferListSide, type TransferListSideProps, type UsageLimit, UseFeatureStatus, UseRuntimeMode, type UseServerTableOptions, type User, VIRTUAL_LIST_BUFFER_ROWS, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };

package/dist/index.d.ts

@@ -970,6 +970,230 @@ interface StepListProps {
  */
 declare function StepList({ steps, label, defaultOpen, open: openProp, onToggle, showDurations, dense, className, }: StepListProps): React.JSX.Element | null;
 
+/** Number of rows kept mounted above and below the visible band. Two buffers this size
+ *  (one per edge) plus the visible band itself is what keeps the mounted node count
+ *  bounded — see the file doc comment below for why 20 is the right number here. */
+declare const VIRTUAL_LIST_BUFFER_ROWS = 20;
+interface VirtualWindow {
+    /** Index of the first row a viewport of this height would actually show. */
+    visibleStart: number;
+    /** Index of the last row a viewport of this height would actually show (inclusive). */
+    visibleEnd: number;
+    /** Index of the first row that should be mounted in the DOM (visibleStart minus the buffer, clamped to 0). */
+    startIndex: number;
+    /** Index of the last row that should be mounted in the DOM (inclusive; visibleEnd plus the buffer, clamped to itemCount - 1). */
+    endIndex: number;
+    /** Full scrollable height in px — this is what makes the scrollbar/scroll range honest
+     *  about itemCount even though only a slice of it is ever mounted. */
+    totalHeight: number;
+    /** px the mounted block must be pushed down so its rows land at their real scroll position. */
+    offsetY: number;
+}
+/**
+ * Pure windowing math: given a scroll position and the shape of the data, decide which
+ * row indices are visible and which should actually be mounted. Kept free of React and
+ * the DOM on purpose — see VirtualList's doc comment for why this is exported and tested
+ * on its own rather than only indirectly through a mounted component.
+ *
+ * Every fixed-height virtualizer boils down to integer division: row i sits at
+ * `i * itemHeight` px, so scrollTop/itemHeight lands on the first partially-visible row
+ * and (scrollTop + viewportHeight)/itemHeight lands on the last one. Everything else here
+ * is clamping that to the buffer and to the real item count.
+ */
+declare function computeVirtualWindow(opts: {
+    scrollTop: number;
+    viewportHeight: number;
+    itemHeight: number;
+    itemCount: number;
+    bufferRows?: number;
+}): VirtualWindow;
+/**
+ * Given the current window and the real item count, says whether the visible band has
+ * come within one buffer's width of either edge of what's currently loaded — the signal
+ * VirtualList uses to ask its caller for more. Threading it through the *visible* band
+ * (not the mounted one) means the caller gets asked while the buffer still has rows left
+ * to show, not only once the user has scrolled past all of them.
+ */
+declare function computeNeedMore(win: Pick<VirtualWindow, "visibleStart" | "visibleEnd">, itemCount: number, bufferRows?: number): {
+    start: boolean;
+    end: boolean;
+};
+interface VirtualListProps<T> {
+    /** Whatever the caller currently has loaded — not the full remote collection. */
+    items: T[];
+    /** Fixed row height in px. Every row is assumed to be exactly this tall. */
+    itemHeight: number;
+    renderItem: (item: T, index: number) => React.ReactNode;
+    /** Fired when the visible band comes within one buffer's width of an edge of `items`
+     *  and that edge isn't known to be exhausted. The caller owns fetching — this only asks. */
+    onNeedMore: (direction: "start" | "end") => void;
+    /** Which edges of `items` still have more behind them. Omitted/undefined reads as "yes,
+     *  there might be more" for that edge, since an unknown edge is the common starting state. */
+    hasMore?: {
+        start?: boolean;
+        end?: boolean;
+    };
+    /** Suppresses onNeedMore while a fetch the caller already started is in flight. */
+    loading?: boolean;
+    keyOf: (item: T) => string | number;
+    /** Viewport height in px. Default (400) is ten rows at the kit's --control-h-md (44px). */
+    height?: number;
+    emptyState?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * VirtualList — a fixed-height windowed viewport for a list the caller may be streaming
+ * in from a few thousand rows at a time.
+ *
+ * Why fixed row height only: variable-height virtualization needs a measurement pass
+ * (render off-screen, read the real height, then correct the scroll math) which is a
+ * meaningfully bigger and more fragile piece of engineering than this kit needs for any
+ * consumer it has today. Every current use case is a single-line-or-two row of known,
+ * consistent height, so the simplest correct approach is the right one: the caller states
+ * itemHeight, and the math is plain arithmetic (see computeVirtualWindow).
+ *
+ * Why plain onScroll + scrollTop math instead of IntersectionObserver: an observer would
+ * still need one sentinel per boundary and a ResizeObserver alongside it to keep the
+ * scroll track honest as itemCount changes — no less code, and it trades arithmetic you
+ * can unit test for browser timing you can't. scrollTop/clientHeight are synchronous and
+ * exact, so the windowing math stays a pure function (computeVirtualWindow, exported and
+ * tested on its own below) with the component itself doing nothing but reading scrollTop
+ * and rendering the slice that function names.
+ *
+ * The window keeps ~10 rows actually visible plus a VIRTUAL_LIST_BUFFER_ROWS-row buffer
+ * mounted above and below (~50 rows mounted at once at the default height), which is
+ * enough that fast wheel/trackpad scrolling never outruns the mounted band before the
+ * next onScroll fires, without ever mounting more than a small bounded slice regardless
+ * of how many thousand rows `items` holds.
+ *
+ * Fully controlled: this holds no item data and no page state, only the scroll position
+ * needed to compute the window. The caller owns fetching more rows (onNeedMore) and
+ * knowing when an edge is exhausted (hasMore).
+ */
+declare function VirtualList<T>({ items, itemHeight, renderItem, onNeedMore, hasMore, loading, keyOf, height, emptyState, className, style, }: VirtualListProps<T>): React.JSX.Element;
+
+interface EntityRowAction {
+    /** Phosphor icon name, e.g. "plus" */
+    icon: string;
+    /** Accessible name for the action button. */
+    label: string;
+    onClick: () => void;
+    /** Tints the icon — "add" reads as constructive (ok-text), "remove" as destructive
+     *  (danger-text). No effect on layout, only color, so a caller can still pass any icon. */
+    tone?: "add" | "remove";
+}
+interface EntityRowProps {
+    title: string;
+    /** A secondary line — a count, a subtitle, whatever the caller's data has that a raw
+     *  title doesn't. Optional because plenty of rows are fine with just a name. */
+    meta?: React.ReactNode;
+    action?: EntityRowAction;
+    /** Marks the row a native HTML5 drag source. Wiring onDragOver/onDrop is the drop
+     *  target's job (a list container, not each row) — see the file doc comment. */
+    draggable?: boolean;
+    onDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;
+    style?: React.CSSProperties;
+    className?: string;
+}
+/**
+ * EntityRow — a single compact row for a name plus an optional secondary line and an
+ * optional action, meant to be stamped out by the hundreds inside a VirtualList.
+ *
+ * Deliberately thin, not a card: no border, no shadow, no internal padding beyond enough
+ * to keep text off the edges, so it reads as one line in a dense list rather than a tile.
+ * Height is left to the caller (it fills 100% of its parent) because VirtualList is what
+ * actually fixes row height, and duplicating that number here would be one more place a
+ * future change has to remember to update.
+ *
+ * The drag/drop split is deliberate: a row only ever needs to say "I am the thing being
+ * dragged" (draggable + onDragStart/onDragEnd), never "something was dropped on me" —
+ * nothing in this kit drops one row onto another to reorder it, only a row onto a list to
+ * move it there. Putting onDragOver/onDrop on every row would mean wiring the same drop
+ * logic N times over instead of once on the list container that actually owns it (see
+ * TransferList), so this only exposes the source half of the native HTML5 DnD contract.
+ * The action button exists precisely so drag-and-drop is never the only way to do the
+ * same move — pointer-only and keyboard users get an equally real affordance, not a
+ * degraded fallback.
+ */
+declare function EntityRow({ title, meta, action, draggable, onDragStart, onDragEnd, style, className }: EntityRowProps): React.JSX.Element;
+
+type TransferListSide = "left" | "right";
+interface TransferListSideProps<T> {
+    /** Whatever this side currently has loaded — not its full remote collection. */
+    items: T[];
+    /** Total matching count on the server, if known — shown next to the label. */
+    total?: number;
+    loading?: boolean;
+    search: string;
+    onSearchChange: (value: string) => void;
+    sort?: {
+        key: string;
+        dir: "asc" | "desc";
+    } | null;
+    sortFields: SortMenuField[];
+    onSort: (key: string, dir: "asc" | "desc") => void;
+    onNeedMore: (direction: "start" | "end") => void;
+    hasMore?: {
+        start?: boolean;
+        end?: boolean;
+    };
+    /** Heading text for this side. Fully caller-supplied — this component has no opinion
+     *  about what the two sides represent. */
+    label?: string;
+}
+interface TransferListProps<T> {
+    left: TransferListSideProps<T>;
+    right: TransferListSideProps<T>;
+    keyOf: (item: T) => string | number;
+    renderLabel: (item: T) => string;
+    renderMeta?: (item: T) => React.ReactNode;
+    /** Fired by both a drag-drop and the equivalent +/- click. The caller owns actually
+     *  moving the item between whatever backing lists it maintains — this component never
+     *  mutates `left.items`/`right.items` itself. */
+    onMove: (item: T, from: TransferListSide, to: TransferListSide) => void;
+    /** Row height fed straight through to each side's VirtualList. Default (44) matches
+     *  the kit's --control-h-md, since that's the height EntityRow is tuned to look right at. */
+    itemHeight?: number;
+    /** Viewport height fed straight through to each side's VirtualList. */
+    listHeight?: number;
+    className?: string;
+}
+/**
+ * TransferList — a dual-list picker for moving items between two collections, by drag or
+ * by a click, over a search box and a sort control each side owns independently.
+ *
+ * Deliberately named "left"/"right" rather than e.g. "available"/"selected": the product
+ * this ships for is one particular use of it, but nothing about moving rows between two
+ * lists is specific to that use, and baking in "available"/"selected" (or worse, this
+ * kit's actual first consumer's own vocabulary) would make every *other* two-list picker
+ * this kit will ever be asked for a second component instead of a second set of props. A
+ * caller wanting domain words passes them through `label`.
+ *
+ * Native HTML5 drag-and-drop, not a library: this kit ships zero runtime dependencies on
+ * purpose, and moving one row between two lists is exactly the case the platform's own
+ * draggable/dragstart/dragover/drop already cover with no gap to fill — sortable-within-
+ * a-list (which does need pointer math and placeholder gaps) is a different, harder
+ * problem this component doesn't attempt. Each row is the drag source (via EntityRow's
+ * draggable prop); each *side* is the drop target — one onDragOver/onDrop pair per side,
+ * not per row, since dropping only ever means "move into this list," never "onto this
+ * particular other row." dataTransfer carries the dragged key mainly so a real
+ * OS-level drag has real payload (Firefox refuses a drag with no data set at all); which
+ * item is actually moved is tracked in local `dragging` state, because dataTransfer's own
+ * payload can't hold a reference to `item: T` — only the string the caller's keyOf gives it.
+ *
+ * The +/- action on every row is not a fallback bolted on for accessibility box-ticking:
+ * it is the same onMove call a drop makes, exposed as a first-class equivalent, because
+ * drag-and-drop alone would silently exclude anyone not using a mouse.
+ *
+ * Fully controlled and stateless about the actual item sets: `left`/`right` are handed in
+ * whole, this never copies or reorders them, and the only state kept locally is which row
+ * is mid-drag and which side a drag is currently over — pure interaction feedback, thrown
+ * away the moment the drag ends.
+ */
+declare function TransferList<T>({ left, right, keyOf, renderLabel, renderMeta, onMove, itemHeight, listHeight, className, }: TransferListProps<T>): React.JSX.Element;
+
 /**
  * Multi-select control with a 44px comfortable hit area.
  */
@@ -2843,4 +3067,4 @@ interface VersionStore<TState, TDiff = unknown> {
 }
 declare function createVersionStore<TState, TDiff = unknown>(initialState: TState, options?: CreateVersionStoreOptions<TState, TDiff>): VersionStore<TState, TDiff>;
 
-export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, ApiSpecBrowser, type ApiSpecBrowserProps, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, type CardProps, CardRow, type CardRowProps, ChannelContribution, type ChannelContributionChannel, type ChannelContributionProps, ChannelMeta, type ChannelMetaRecord, ChannelTag, type ChannelTagProps, ChannelWeightOf, type ChatAdapter, ChatComposer, type ChatComposerProps, type ChatEngine, type ChatEngineOptions, ChatKit, type ChatMessage, type ChatRenderContext, ChatSessionBar, type ChatSessionBarProps, ChatTranscript, type ChatTranscriptProps, ChatTurn, type ChatTurnProps, Checkbox, type CheckboxProps, type Citation, Citations, type CitationsProps, Clamp, type ClampProps, ClockFace, type ClockFaceProps, CodeBlock, type CodeBlockProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DeviceSession, DiffBlock, type DiffBlockProps, Drawer, type DrawerProps, Dropzone, DropzoneKit, type DropzoneProps, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, FeatureGate, type FeatureGateProps, type FeatureStatus, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FilterBar, type FilterBarProps, type FilterField, type FilterFieldOption, type FilterFieldSelect, type FilterFieldText, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, Gate, type GateProps, IconButton, type IconButtonProps, Input, type InputProps, type JobStatus, Json, KeyHint, type KeyHintProps, type ListEnvelope, LoadingRegion, type LoadingRegionProps, Markdown, MarkdownEditor, type MarkdownEditorHandle, type MarkdownEditorProps, MarkdownInline, type MarkdownProps, type MentionSource, Menu, MenuButton, type MenuButtonProps, type MenuItem, type MenuProps, MessageBody, type MessageBodyProps, type MessageGroup, Meter, type MeterProps, type MeterSegment, type MeterSegmentInput, MixGap, type MixGapProps, type MixGapRow, MockJobKit, type MockJobStatus, Modal, type ModalProps, ModeSwitch, type ModeSwitchProps, type Model, ModelControls, type ModelControlsProps, NumberInput, type NumberInputProps, type Packet, PacketCard, type PacketCardProps, type PacketSchema, type Pager, Pagination, type PaginationProps, PermissionDenied, type PermissionDeniedProps, type PermissionGroup, PermissionHint, type PermissionItem, type Placement, type PollOptions, Popover, type PopoverProps, ProfilePage, type ProfilePageProps, ProgressBar, type ProgressBarProps, QueryKit, type QueuedTurn, QuotaRow, type QuotaRowProps, Radio, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, type RoadmapItem, type RoadmapResult, RoadmapTimeline, type RoadmapTimelineProps, type Role, RunActions, type RunActionsProps, type RunConfig, RuntimeKit, type RuntimeSummary, SaturationDistribution, type SaturationDistributionCampus, type SaturationDistributionProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type Flag as SessionFlag, SessionKit, type SessionStats, SidebarNav, type SidebarNavItem, type SidebarNavProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, StatTile, type StatTileProps, type Step, StepList, type StepListProps, type StreamHandlers, type Suggestion, SurroundSound, type SurroundSoundProps, Switch, type SwitchProps, type TableQuery, Tabs, type TabsProps, Tag, type TagProps, TestModeBar, type TestModeBarProps, Textarea, type TextareaProps, ThinkingBlock, type ThinkingBlockProps, type ThreadSummary, TimePicker, type TimePickerProps, Toast, type ToastProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, TranscriptKit, type UsageLimit, UseFeatureStatus, UseRuntimeMode, type UseServerTableOptions, type User, type VersionRecord, type VersionStore, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
+export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, ApiSpecBrowser, type ApiSpecBrowserProps, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, type CardProps, CardRow, type CardRowProps, ChannelContribution, type ChannelContributionChannel, type ChannelContributionProps, ChannelMeta, type ChannelMetaRecord, ChannelTag, type ChannelTagProps, ChannelWeightOf, type ChatAdapter, ChatComposer, type ChatComposerProps, type ChatEngine, type ChatEngineOptions, ChatKit, type ChatMessage, type ChatRenderContext, ChatSessionBar, type ChatSessionBarProps, ChatTranscript, type ChatTranscriptProps, ChatTurn, type ChatTurnProps, Checkbox, type CheckboxProps, type Citation, Citations, type CitationsProps, Clamp, type ClampProps, ClockFace, type ClockFaceProps, CodeBlock, type CodeBlockProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DeviceSession, DiffBlock, type DiffBlockProps, Drawer, type DrawerProps, Dropzone, DropzoneKit, type DropzoneProps, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowProps, FeatureGate, type FeatureGateProps, type FeatureStatus, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FilterBar, type FilterBarProps, type FilterField, type FilterFieldOption, type FilterFieldSelect, type FilterFieldText, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, Gate, type GateProps, IconButton, type IconButtonProps, Input, type InputProps, type JobStatus, Json, KeyHint, type KeyHintProps, type ListEnvelope, LoadingRegion, type LoadingRegionProps, Markdown, MarkdownEditor, type MarkdownEditorHandle, type MarkdownEditorProps, MarkdownInline, type MarkdownProps, type MentionSource, Menu, MenuButton, type MenuButtonProps, type MenuItem, type MenuProps, MessageBody, type MessageBodyProps, type MessageGroup, Meter, type MeterProps, type MeterSegment, type MeterSegmentInput, MixGap, type MixGapProps, type MixGapRow, MockJobKit, type MockJobStatus, Modal, type ModalProps, ModeSwitch, type ModeSwitchProps, type Model, ModelControls, type ModelControlsProps, NumberInput, type NumberInputProps, type Packet, PacketCard, type PacketCardProps, type PacketSchema, type Pager, Pagination, type PaginationProps, PermissionDenied, type PermissionDeniedProps, type PermissionGroup, PermissionHint, type PermissionItem, type Placement, type PollOptions, Popover, type PopoverProps, ProfilePage, type ProfilePageProps, ProgressBar, type ProgressBarProps, QueryKit, type QueuedTurn, QuotaRow, type QuotaRowProps, Radio, type RadioProps, RangeSlider, type RangeSliderProps, RelativeTime, type RelativeTimeProps, type RoadmapItem, type RoadmapResult, RoadmapTimeline, type RoadmapTimelineProps, type Role, RunActions, type RunActionsProps, type RunConfig, RuntimeKit, type RuntimeSummary, SaturationDistribution, type SaturationDistributionCampus, type SaturationDistributionProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type Flag as SessionFlag, SessionKit, type SessionStats, SidebarNav, type SidebarNavItem, type SidebarNavProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, StatTile, type StatTileProps, type Step, StepList, type StepListProps, type StreamHandlers, type Suggestion, SurroundSound, type SurroundSoundProps, Switch, type SwitchProps, type TableQuery, Tabs, type TabsProps, Tag, type TagProps, TestModeBar, type TestModeBarProps, Textarea, type TextareaProps, ThinkingBlock, type ThinkingBlockProps, type ThreadSummary, TimePicker, type TimePickerProps, Toast, type ToastProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, TranscriptKit, TransferList, type TransferListProps, type TransferListSide, type TransferListSideProps, type UsageLimit, UseFeatureStatus, UseRuntimeMode, type UseServerTableOptions, type User, VIRTUAL_LIST_BUFFER_ROWS, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };