@flytedan/flytebot-design-system 0.10.0 → 0.11.1
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/dist/index.cjs +665 -658
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +120 -13
- package/dist/index.d.ts +120 -13
- package/dist/index.js +674 -668
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/styles/components.css +165 -16
- package/styles/tokens.css +20 -0
package/dist/index.d.cts
CHANGED
|
@@ -29,24 +29,41 @@ interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>
|
|
|
29
29
|
/** Accessible name, also the title tooltip. Required. */
|
|
30
30
|
label: string;
|
|
31
31
|
size?: "sm" | "md" | "lg";
|
|
32
|
-
|
|
32
|
+
/** "ghost" and "outline" are quiet: no fill, the glyph carries the tone. "solid" is a
|
|
33
|
+
* filled button in the tone's colour — for the one action on a surface that has to be
|
|
34
|
+
* found at a glance, like the add/remove button on every row of a transfer list. */
|
|
35
|
+
variant?: "ghost" | "outline" | "solid";
|
|
36
|
+
/** What the action does. On "solid" it picks the fill; on "ghost"/"outline" it tints the
|
|
37
|
+
* glyph. "neutral" is the default look of each variant, which for "solid" is the brand
|
|
38
|
+
* fill. Every tone has hover, pressed and focus states and is legible in both themes —
|
|
39
|
+
* the fills are the --btn-solid-* tokens, measured against light and dark grounds. */
|
|
40
|
+
tone?: "neutral" | "ok" | "danger";
|
|
33
41
|
round?: boolean;
|
|
34
42
|
disabled?: boolean;
|
|
35
43
|
className?: string;
|
|
36
44
|
}
|
|
37
|
-
declare function IconButton({ icon, label, size, variant, round, disabled, className, ...rest }: IconButtonProps): React.JSX.Element;
|
|
45
|
+
declare function IconButton({ icon, label, size, variant, tone, round, disabled, className, ...rest }: IconButtonProps): React.JSX.Element;
|
|
38
46
|
|
|
39
47
|
type Placement = "bottom-start" | "bottom-end" | "bottom-center" | "top-start" | "top-end" | "top-center";
|
|
40
48
|
interface PopoverProps {
|
|
41
49
|
open?: boolean;
|
|
42
50
|
anchorRef: React.RefObject<HTMLElement>;
|
|
51
|
+
/** The element whose own clicks open and close this popover, when that is more than
|
|
52
|
+
* the anchor — a form field's label toggles it too, but the surface is positioned
|
|
53
|
+
* against the input box alone. A pointerdown inside it is not an "outside" press, so
|
|
54
|
+
* the toggle it is about to run is not undone by a dismissal a moment earlier.
|
|
55
|
+
* Defaults to `anchorRef`. */
|
|
56
|
+
triggerRef?: React.RefObject<HTMLElement>;
|
|
43
57
|
onClose?: () => void;
|
|
44
58
|
placement?: Placement;
|
|
45
59
|
offset?: number;
|
|
46
|
-
|
|
60
|
+
/** `true`: exactly the anchor's width. `"min"`: at least the anchor's width, growing
|
|
61
|
+
* with content past it (a select whose options are wider than its box). */
|
|
62
|
+
matchWidth?: boolean | "min";
|
|
47
63
|
width?: number;
|
|
48
64
|
minWidth?: number;
|
|
49
65
|
maxHeight?: number;
|
|
66
|
+
/** Standard content padding on the body. The header and footer own their own. */
|
|
50
67
|
padded?: boolean;
|
|
51
68
|
role?: string;
|
|
52
69
|
label?: string;
|
|
@@ -55,6 +72,13 @@ interface PopoverProps {
|
|
|
55
72
|
returnFocus?: boolean;
|
|
56
73
|
className?: string;
|
|
57
74
|
style?: React.CSSProperties;
|
|
75
|
+
/** Pinned above the body and never scrolled away: a back link, a title, a segmented
|
|
76
|
+
* toggle, a search field. */
|
|
77
|
+
header?: React.ReactNode;
|
|
78
|
+
/** Pinned below the body and never scrolled away: the Add / Apply / Confirm action and
|
|
79
|
+
* any summary beside it. */
|
|
80
|
+
footer?: React.ReactNode;
|
|
81
|
+
/** The body — the one region of the surface that scrolls. */
|
|
58
82
|
children?: React.ReactNode;
|
|
59
83
|
}
|
|
60
84
|
interface PopoverPosition {
|
|
@@ -67,6 +91,12 @@ interface PopoverPosition {
|
|
|
67
91
|
side: "top" | "bottom";
|
|
68
92
|
anchorWidth: number;
|
|
69
93
|
}
|
|
94
|
+
/** The least height the body is left with. Below this a list shows a sliver — or nothing
|
|
95
|
+
* — between a tall header and footer, which reads as an empty picker. When the room
|
|
96
|
+
* beside the anchor cannot hold the pinned regions plus this much body, the layer moves
|
|
97
|
+
* (see usePopoverPosition) rather than squeezing the body further. A body whose whole
|
|
98
|
+
* content is shorter than this only needs its content. */
|
|
99
|
+
declare const POPOVER_BODY_MIN = 96;
|
|
70
100
|
/**
|
|
71
101
|
* Fixed-position layer geometry for an anchored surface. Flips side when the
|
|
72
102
|
* preferred one doesn't fit, clamps to the viewport, and re-measures continuously
|
|
@@ -82,6 +112,23 @@ interface PopoverPosition {
|
|
|
82
112
|
* only set when the geometry actually changed (see samePosition), so a stationary anchor
|
|
83
113
|
* causes no re-renders at all.
|
|
84
114
|
*
|
|
115
|
+
* The side is chosen from the layer's real size once `layerRef` has rendered (see
|
|
116
|
+
* measureLayer): it flips when what it needs does not fit on the preferred side and the
|
|
117
|
+
* other side has more room. Until then — the first frame, before there is anything to
|
|
118
|
+
* measure — `estHeight` stands in, and only a nearly-exhausted side (under 180px) flips,
|
|
119
|
+
* so a small layer of unknown size is not thrown to the far side on a guess. The real
|
|
120
|
+
* width replaces `estWidth` the same way, which is what keeps an end- or center-aligned
|
|
121
|
+
* layer of content width lined up with its anchor.
|
|
122
|
+
*
|
|
123
|
+
* The same per-frame measurement is what re-fits the layer when its CONTENT changes size
|
|
124
|
+
* while open — a picker stepping from a short search header to a tall header plus a
|
|
125
|
+
* footer. No event announces that either, and the next frame sees the new header and
|
|
126
|
+
* footer heights: the side is re-chosen from the new need, and when even the pinned
|
|
127
|
+
* regions plus POPOVER_BODY_MIN of body fit on neither side, the layer slides over its
|
|
128
|
+
* anchor to the far viewport edge instead of collapsing the body (see measureLayer and
|
|
129
|
+
* the `beside` branch). The height is never capped past the real room, so the surface
|
|
130
|
+
* itself never overflows the viewport.
|
|
131
|
+
*
|
|
85
132
|
* The same loop is what notices the anchor being REMOVED — a virtualized row scrolled
|
|
86
133
|
* out of the mounted band, a menu item deleted — and reports it through `onDetach`, so
|
|
87
134
|
* an anchored layer can never end up pinned to an element that no longer exists.
|
|
@@ -90,12 +137,29 @@ declare function usePopoverPosition(open: boolean, anchorRef: React.RefObject<HT
|
|
|
90
137
|
estHeight?: number;
|
|
91
138
|
estWidth?: number;
|
|
92
139
|
onDetach?: () => void;
|
|
140
|
+
/** The rendered layer, so its real size replaces the estimates once it exists. */
|
|
141
|
+
layerRef?: React.RefObject<HTMLElement>;
|
|
93
142
|
}): PopoverPosition | null;
|
|
94
143
|
/**
|
|
95
144
|
* An anchored floating surface: menus, pickers, disclosure panels, meters.
|
|
96
|
-
* Owns
|
|
97
|
-
|
|
98
|
-
|
|
145
|
+
* Owns placement, dismissal, focus return — and its own layout, which is the one rule
|
|
146
|
+
* every popover shares: THE SURFACE NEVER SCROLLS.
|
|
147
|
+
*
|
|
148
|
+
* It is always three stacked regions: an optional `header`, the body (`children`), and
|
|
149
|
+
* an optional `footer`. Header and footer are pinned; the body is the only thing that
|
|
150
|
+
* scrolls, and it shrinks to whatever height is left once they are laid out. The surface
|
|
151
|
+
* is capped by the real room between the anchor and the viewport edge (or `maxHeight`, if
|
|
152
|
+
* that is smaller) and flips to the other side when it doesn't fit, so the footer is
|
|
153
|
+
* never the thing that gets cut off.
|
|
154
|
+
*
|
|
155
|
+
* This is structural rather than advice because the failure it prevents is structural:
|
|
156
|
+
* a surface that scrolls as a whole takes its Apply button below the fold with it, and a
|
|
157
|
+
* scrolling list inside a scrolling surface is two nested scrollbars. Anything inside
|
|
158
|
+
* the body that owns a scroll region of its own (a Menu, a Select's options) is laid out
|
|
159
|
+
* to shrink into the body rather than overflow it — see `.fd-pop-body` in
|
|
160
|
+
* components.css — so there is only ever one scrollbar.
|
|
161
|
+
*/
|
|
162
|
+
declare function Popover({ open, anchorRef, triggerRef, onClose, placement, offset, matchWidth, width, minWidth, maxHeight, padded, role, label, closeOnOutside, closeOnEscape, returnFocus, className, style, header, footer, children, }: PopoverProps): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
99
163
|
interface MenuItem {
|
|
100
164
|
id?: string;
|
|
101
165
|
label?: React.ReactNode;
|
|
@@ -134,6 +198,10 @@ interface MenuProps {
|
|
|
134
198
|
* {id,label,icon,description,meta,shortcut,checked,disabled,submenu,onSelect}
|
|
135
199
|
* {kind:"separator"} · {kind:"section",label} · {kind:"custom",render}
|
|
136
200
|
* `shortcut` is a HINT — it renders a cap and binds nothing.
|
|
201
|
+
*
|
|
202
|
+
* `header` and `footer` are pinned and only the items scroll: the whole menu is one
|
|
203
|
+
* shrinkable frame, so inside a Popover body a search header stays put while a long list
|
|
204
|
+
* scrolls beneath it, instead of the header scrolling away with the items.
|
|
137
205
|
*/
|
|
138
206
|
declare function Menu({ items, onSelect, onClose, autoFocus, className, footer, header }: MenuProps): React.JSX.Element;
|
|
139
207
|
interface MenuButtonProps extends Omit<MenuProps, "onClose" | "autoFocus"> {
|
|
@@ -495,13 +563,33 @@ interface ToastProps {
|
|
|
495
563
|
}
|
|
496
564
|
declare function Toast({ title, children, tone, onUndo, onDismiss, className, ...rest }: ToastProps): React.JSX.Element;
|
|
497
565
|
|
|
498
|
-
/** A short clarification on hover or
|
|
566
|
+
/** A short clarification on hover, focus or tap. Never the only place information lives. */
|
|
499
567
|
interface TooltipProps {
|
|
500
568
|
label: React.ReactNode;
|
|
501
569
|
placement?: "top" | "bottom";
|
|
502
570
|
children?: React.ReactNode;
|
|
503
571
|
className?: string;
|
|
504
572
|
}
|
|
573
|
+
/**
|
|
574
|
+
* Tooltip — the kit's one tooltip, for any trigger.
|
|
575
|
+
*
|
|
576
|
+
* Three ways in, because a tooltip reachable only by a mouse hides its text from
|
|
577
|
+
* everyone else: hover (mouse only), keyboard focus (`:focus-visible`, so a mouse click
|
|
578
|
+
* that happens to focus a button does not pin a tip open) and tap (touch or pen — there is
|
|
579
|
+
* no hover on a touchscreen, so a tap toggles it). Escape and a press anywhere else
|
|
580
|
+
* dismiss it; the pointer can move from the trigger onto the tip without it closing.
|
|
581
|
+
*
|
|
582
|
+
* The text is the trigger's accessible DESCRIPTION, not just a visual: a visually hidden
|
|
583
|
+
* copy is always in the document and the trigger points at it with aria-describedby, so a
|
|
584
|
+
* screen reader announces it on focus whether or not the bubble is showing at that
|
|
585
|
+
* instant. The trigger is the single child element when there is one (it receives the
|
|
586
|
+
* attribute); otherwise the wrapper does.
|
|
587
|
+
*
|
|
588
|
+
* The bubble is portaled to document.body and positioned with the same anchored-layer
|
|
589
|
+
* geometry as Popover (flip, clamp, follow a moving anchor), because a tooltip drawn
|
|
590
|
+
* inside its trigger's box is clipped by the first `overflow: hidden` ancestor — which in
|
|
591
|
+
* a fixed-width table cell or a list row is all of them.
|
|
592
|
+
*/
|
|
505
593
|
declare function Tooltip({ label, placement, children, className }: TooltipProps): React.JSX.Element;
|
|
506
594
|
|
|
507
595
|
interface ClampProps {
|
|
@@ -1230,8 +1318,11 @@ interface EntityRowAction {
|
|
|
1230
1318
|
/** Accessible name for the action button. */
|
|
1231
1319
|
label: string;
|
|
1232
1320
|
onClick: () => void;
|
|
1233
|
-
/**
|
|
1234
|
-
* (danger
|
|
1321
|
+
/** Picks the fill — "add" is the constructive (ok) fill, "remove" the destructive
|
|
1322
|
+
* (danger) fill, and no tone the brand fill. The button is always a filled
|
|
1323
|
+
* IconButton (variant "solid"): it is the one action on the row, repeated down a long
|
|
1324
|
+
* list, and has to be findable at a glance on a default card and on a danger-toned one
|
|
1325
|
+
* alike. No effect on layout, so a caller can still pass any icon. */
|
|
1235
1326
|
tone?: "add" | "remove";
|
|
1236
1327
|
}
|
|
1237
1328
|
/** Width in px a metric cell takes when it doesn't ask for its own. Wide enough for a
|
|
@@ -1243,9 +1334,17 @@ interface EntityRowMetric {
|
|
|
1243
1334
|
* columns legitimately share a label. */
|
|
1244
1335
|
id?: string;
|
|
1245
1336
|
/** What the number means — "students", "ad units". Never rendered as running text:
|
|
1246
|
-
* it is the metric's accessible name
|
|
1247
|
-
*
|
|
1337
|
+
* it is the metric's accessible name, so the row stays scannable as numbers while a
|
|
1338
|
+
* screen reader still hears "1,240 students". Without a `tooltip` it is also the
|
|
1339
|
+
* cell's native hover title. */
|
|
1248
1340
|
label: string;
|
|
1341
|
+
/** The long-form explanation of this figure — what it counts, why it is zero, what an
|
|
1342
|
+
* "unknown" means. Shown in the kit's Tooltip on hover, keyboard focus and tap, and
|
|
1343
|
+
* exposed as the cell's accessible description (`label` stays its short name). A cell
|
|
1344
|
+
* with a tooltip becomes a focusable button so the explanation is reachable without a
|
|
1345
|
+
* mouse, and drops the native `title` so two tooltips never show at once. A button is
|
|
1346
|
+
* also what keeps a tap on it from arming TransferList's row drag. */
|
|
1347
|
+
tooltip?: React.ReactNode;
|
|
1249
1348
|
value: React.ReactNode;
|
|
1250
1349
|
/** Phosphor icon name shown before the value, e.g. "student". */
|
|
1251
1350
|
icon?: string;
|
|
@@ -1516,6 +1615,11 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "
|
|
|
1516
1615
|
loading?: boolean;
|
|
1517
1616
|
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1518
1617
|
style?: React.CSSProperties;
|
|
1618
|
+
/** Applied to the outer .fd-field element, like `style` and for the same reason: that
|
|
1619
|
+
* element is the field's box in whatever layout it sits in (a flex toolbar, a grid
|
|
1620
|
+
* cell). The input box inside it is a child of a vertical flex column, so a sizing
|
|
1621
|
+
* class landing THERE turns a row's `flex-basis` into a height. */
|
|
1622
|
+
className?: string;
|
|
1519
1623
|
/** Applied to the inner input element. Rarely needed. */
|
|
1520
1624
|
inputStyle?: React.CSSProperties;
|
|
1521
1625
|
}
|
|
@@ -1532,6 +1636,7 @@ interface SearchFieldProps {
|
|
|
1532
1636
|
onClear?: () => void;
|
|
1533
1637
|
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1534
1638
|
style?: React.CSSProperties;
|
|
1639
|
+
/** Applied to the outer .fd-field element, like `style`. */
|
|
1535
1640
|
className?: string;
|
|
1536
1641
|
/** Visible field label, same as Input. Most search fields skip this and rely on placeholder. */
|
|
1537
1642
|
label?: string;
|
|
@@ -1563,8 +1668,10 @@ interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement
|
|
|
1563
1668
|
error?: string;
|
|
1564
1669
|
required?: boolean;
|
|
1565
1670
|
rows?: number;
|
|
1566
|
-
/** Applied to the field
|
|
1671
|
+
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1567
1672
|
style?: React.CSSProperties;
|
|
1673
|
+
/** Applied to the outer .fd-field element, like `style` — the same rule as Input. */
|
|
1674
|
+
className?: string;
|
|
1568
1675
|
}
|
|
1569
1676
|
declare function Textarea({ label, help, error, required, rows, disabled, id, className, style, ...rest }: TextareaProps): React.JSX.Element;
|
|
1570
1677
|
|
|
@@ -3475,4 +3582,4 @@ interface VersionStore<TState, TDiff = unknown> {
|
|
|
3475
3582
|
}
|
|
3476
3583
|
declare function createVersionStore<TState, TDiff = unknown>(initialState: TState, options?: CreateVersionStoreOptions<TState, TDiff>): VersionStore<TState, TDiff>;
|
|
3477
3584
|
|
|
3478
|
-
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, ENTITY_ROW_METRIC_WIDTH, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowContent, type EntityRowMetric, EntityRowMetrics, type EntityRowMetricsProps, 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, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, 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, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, 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, ScoreMeter, type ScoreMeterProps, 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, VIRTUAL_LIST_ROW_GAP, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualLoadedBand, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, preferenceScore, preferenceSegments, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
|
|
3585
|
+
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, ENTITY_ROW_METRIC_WIDTH, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowContent, type EntityRowMetric, EntityRowMetrics, type EntityRowMetricsProps, 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, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, 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, POPOVER_BODY_MIN, 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, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, 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, ScoreMeter, type ScoreMeterProps, 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, VIRTUAL_LIST_ROW_GAP, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualLoadedBand, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, preferenceScore, preferenceSegments, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
|
package/dist/index.d.ts
CHANGED
|
@@ -29,24 +29,41 @@ interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>
|
|
|
29
29
|
/** Accessible name, also the title tooltip. Required. */
|
|
30
30
|
label: string;
|
|
31
31
|
size?: "sm" | "md" | "lg";
|
|
32
|
-
|
|
32
|
+
/** "ghost" and "outline" are quiet: no fill, the glyph carries the tone. "solid" is a
|
|
33
|
+
* filled button in the tone's colour — for the one action on a surface that has to be
|
|
34
|
+
* found at a glance, like the add/remove button on every row of a transfer list. */
|
|
35
|
+
variant?: "ghost" | "outline" | "solid";
|
|
36
|
+
/** What the action does. On "solid" it picks the fill; on "ghost"/"outline" it tints the
|
|
37
|
+
* glyph. "neutral" is the default look of each variant, which for "solid" is the brand
|
|
38
|
+
* fill. Every tone has hover, pressed and focus states and is legible in both themes —
|
|
39
|
+
* the fills are the --btn-solid-* tokens, measured against light and dark grounds. */
|
|
40
|
+
tone?: "neutral" | "ok" | "danger";
|
|
33
41
|
round?: boolean;
|
|
34
42
|
disabled?: boolean;
|
|
35
43
|
className?: string;
|
|
36
44
|
}
|
|
37
|
-
declare function IconButton({ icon, label, size, variant, round, disabled, className, ...rest }: IconButtonProps): React.JSX.Element;
|
|
45
|
+
declare function IconButton({ icon, label, size, variant, tone, round, disabled, className, ...rest }: IconButtonProps): React.JSX.Element;
|
|
38
46
|
|
|
39
47
|
type Placement = "bottom-start" | "bottom-end" | "bottom-center" | "top-start" | "top-end" | "top-center";
|
|
40
48
|
interface PopoverProps {
|
|
41
49
|
open?: boolean;
|
|
42
50
|
anchorRef: React.RefObject<HTMLElement>;
|
|
51
|
+
/** The element whose own clicks open and close this popover, when that is more than
|
|
52
|
+
* the anchor — a form field's label toggles it too, but the surface is positioned
|
|
53
|
+
* against the input box alone. A pointerdown inside it is not an "outside" press, so
|
|
54
|
+
* the toggle it is about to run is not undone by a dismissal a moment earlier.
|
|
55
|
+
* Defaults to `anchorRef`. */
|
|
56
|
+
triggerRef?: React.RefObject<HTMLElement>;
|
|
43
57
|
onClose?: () => void;
|
|
44
58
|
placement?: Placement;
|
|
45
59
|
offset?: number;
|
|
46
|
-
|
|
60
|
+
/** `true`: exactly the anchor's width. `"min"`: at least the anchor's width, growing
|
|
61
|
+
* with content past it (a select whose options are wider than its box). */
|
|
62
|
+
matchWidth?: boolean | "min";
|
|
47
63
|
width?: number;
|
|
48
64
|
minWidth?: number;
|
|
49
65
|
maxHeight?: number;
|
|
66
|
+
/** Standard content padding on the body. The header and footer own their own. */
|
|
50
67
|
padded?: boolean;
|
|
51
68
|
role?: string;
|
|
52
69
|
label?: string;
|
|
@@ -55,6 +72,13 @@ interface PopoverProps {
|
|
|
55
72
|
returnFocus?: boolean;
|
|
56
73
|
className?: string;
|
|
57
74
|
style?: React.CSSProperties;
|
|
75
|
+
/** Pinned above the body and never scrolled away: a back link, a title, a segmented
|
|
76
|
+
* toggle, a search field. */
|
|
77
|
+
header?: React.ReactNode;
|
|
78
|
+
/** Pinned below the body and never scrolled away: the Add / Apply / Confirm action and
|
|
79
|
+
* any summary beside it. */
|
|
80
|
+
footer?: React.ReactNode;
|
|
81
|
+
/** The body — the one region of the surface that scrolls. */
|
|
58
82
|
children?: React.ReactNode;
|
|
59
83
|
}
|
|
60
84
|
interface PopoverPosition {
|
|
@@ -67,6 +91,12 @@ interface PopoverPosition {
|
|
|
67
91
|
side: "top" | "bottom";
|
|
68
92
|
anchorWidth: number;
|
|
69
93
|
}
|
|
94
|
+
/** The least height the body is left with. Below this a list shows a sliver — or nothing
|
|
95
|
+
* — between a tall header and footer, which reads as an empty picker. When the room
|
|
96
|
+
* beside the anchor cannot hold the pinned regions plus this much body, the layer moves
|
|
97
|
+
* (see usePopoverPosition) rather than squeezing the body further. A body whose whole
|
|
98
|
+
* content is shorter than this only needs its content. */
|
|
99
|
+
declare const POPOVER_BODY_MIN = 96;
|
|
70
100
|
/**
|
|
71
101
|
* Fixed-position layer geometry for an anchored surface. Flips side when the
|
|
72
102
|
* preferred one doesn't fit, clamps to the viewport, and re-measures continuously
|
|
@@ -82,6 +112,23 @@ interface PopoverPosition {
|
|
|
82
112
|
* only set when the geometry actually changed (see samePosition), so a stationary anchor
|
|
83
113
|
* causes no re-renders at all.
|
|
84
114
|
*
|
|
115
|
+
* The side is chosen from the layer's real size once `layerRef` has rendered (see
|
|
116
|
+
* measureLayer): it flips when what it needs does not fit on the preferred side and the
|
|
117
|
+
* other side has more room. Until then — the first frame, before there is anything to
|
|
118
|
+
* measure — `estHeight` stands in, and only a nearly-exhausted side (under 180px) flips,
|
|
119
|
+
* so a small layer of unknown size is not thrown to the far side on a guess. The real
|
|
120
|
+
* width replaces `estWidth` the same way, which is what keeps an end- or center-aligned
|
|
121
|
+
* layer of content width lined up with its anchor.
|
|
122
|
+
*
|
|
123
|
+
* The same per-frame measurement is what re-fits the layer when its CONTENT changes size
|
|
124
|
+
* while open — a picker stepping from a short search header to a tall header plus a
|
|
125
|
+
* footer. No event announces that either, and the next frame sees the new header and
|
|
126
|
+
* footer heights: the side is re-chosen from the new need, and when even the pinned
|
|
127
|
+
* regions plus POPOVER_BODY_MIN of body fit on neither side, the layer slides over its
|
|
128
|
+
* anchor to the far viewport edge instead of collapsing the body (see measureLayer and
|
|
129
|
+
* the `beside` branch). The height is never capped past the real room, so the surface
|
|
130
|
+
* itself never overflows the viewport.
|
|
131
|
+
*
|
|
85
132
|
* The same loop is what notices the anchor being REMOVED — a virtualized row scrolled
|
|
86
133
|
* out of the mounted band, a menu item deleted — and reports it through `onDetach`, so
|
|
87
134
|
* an anchored layer can never end up pinned to an element that no longer exists.
|
|
@@ -90,12 +137,29 @@ declare function usePopoverPosition(open: boolean, anchorRef: React.RefObject<HT
|
|
|
90
137
|
estHeight?: number;
|
|
91
138
|
estWidth?: number;
|
|
92
139
|
onDetach?: () => void;
|
|
140
|
+
/** The rendered layer, so its real size replaces the estimates once it exists. */
|
|
141
|
+
layerRef?: React.RefObject<HTMLElement>;
|
|
93
142
|
}): PopoverPosition | null;
|
|
94
143
|
/**
|
|
95
144
|
* An anchored floating surface: menus, pickers, disclosure panels, meters.
|
|
96
|
-
* Owns
|
|
97
|
-
|
|
98
|
-
|
|
145
|
+
* Owns placement, dismissal, focus return — and its own layout, which is the one rule
|
|
146
|
+
* every popover shares: THE SURFACE NEVER SCROLLS.
|
|
147
|
+
*
|
|
148
|
+
* It is always three stacked regions: an optional `header`, the body (`children`), and
|
|
149
|
+
* an optional `footer`. Header and footer are pinned; the body is the only thing that
|
|
150
|
+
* scrolls, and it shrinks to whatever height is left once they are laid out. The surface
|
|
151
|
+
* is capped by the real room between the anchor and the viewport edge (or `maxHeight`, if
|
|
152
|
+
* that is smaller) and flips to the other side when it doesn't fit, so the footer is
|
|
153
|
+
* never the thing that gets cut off.
|
|
154
|
+
*
|
|
155
|
+
* This is structural rather than advice because the failure it prevents is structural:
|
|
156
|
+
* a surface that scrolls as a whole takes its Apply button below the fold with it, and a
|
|
157
|
+
* scrolling list inside a scrolling surface is two nested scrollbars. Anything inside
|
|
158
|
+
* the body that owns a scroll region of its own (a Menu, a Select's options) is laid out
|
|
159
|
+
* to shrink into the body rather than overflow it — see `.fd-pop-body` in
|
|
160
|
+
* components.css — so there is only ever one scrollbar.
|
|
161
|
+
*/
|
|
162
|
+
declare function Popover({ open, anchorRef, triggerRef, onClose, placement, offset, matchWidth, width, minWidth, maxHeight, padded, role, label, closeOnOutside, closeOnEscape, returnFocus, className, style, header, footer, children, }: PopoverProps): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
99
163
|
interface MenuItem {
|
|
100
164
|
id?: string;
|
|
101
165
|
label?: React.ReactNode;
|
|
@@ -134,6 +198,10 @@ interface MenuProps {
|
|
|
134
198
|
* {id,label,icon,description,meta,shortcut,checked,disabled,submenu,onSelect}
|
|
135
199
|
* {kind:"separator"} · {kind:"section",label} · {kind:"custom",render}
|
|
136
200
|
* `shortcut` is a HINT — it renders a cap and binds nothing.
|
|
201
|
+
*
|
|
202
|
+
* `header` and `footer` are pinned and only the items scroll: the whole menu is one
|
|
203
|
+
* shrinkable frame, so inside a Popover body a search header stays put while a long list
|
|
204
|
+
* scrolls beneath it, instead of the header scrolling away with the items.
|
|
137
205
|
*/
|
|
138
206
|
declare function Menu({ items, onSelect, onClose, autoFocus, className, footer, header }: MenuProps): React.JSX.Element;
|
|
139
207
|
interface MenuButtonProps extends Omit<MenuProps, "onClose" | "autoFocus"> {
|
|
@@ -495,13 +563,33 @@ interface ToastProps {
|
|
|
495
563
|
}
|
|
496
564
|
declare function Toast({ title, children, tone, onUndo, onDismiss, className, ...rest }: ToastProps): React.JSX.Element;
|
|
497
565
|
|
|
498
|
-
/** A short clarification on hover or
|
|
566
|
+
/** A short clarification on hover, focus or tap. Never the only place information lives. */
|
|
499
567
|
interface TooltipProps {
|
|
500
568
|
label: React.ReactNode;
|
|
501
569
|
placement?: "top" | "bottom";
|
|
502
570
|
children?: React.ReactNode;
|
|
503
571
|
className?: string;
|
|
504
572
|
}
|
|
573
|
+
/**
|
|
574
|
+
* Tooltip — the kit's one tooltip, for any trigger.
|
|
575
|
+
*
|
|
576
|
+
* Three ways in, because a tooltip reachable only by a mouse hides its text from
|
|
577
|
+
* everyone else: hover (mouse only), keyboard focus (`:focus-visible`, so a mouse click
|
|
578
|
+
* that happens to focus a button does not pin a tip open) and tap (touch or pen — there is
|
|
579
|
+
* no hover on a touchscreen, so a tap toggles it). Escape and a press anywhere else
|
|
580
|
+
* dismiss it; the pointer can move from the trigger onto the tip without it closing.
|
|
581
|
+
*
|
|
582
|
+
* The text is the trigger's accessible DESCRIPTION, not just a visual: a visually hidden
|
|
583
|
+
* copy is always in the document and the trigger points at it with aria-describedby, so a
|
|
584
|
+
* screen reader announces it on focus whether or not the bubble is showing at that
|
|
585
|
+
* instant. The trigger is the single child element when there is one (it receives the
|
|
586
|
+
* attribute); otherwise the wrapper does.
|
|
587
|
+
*
|
|
588
|
+
* The bubble is portaled to document.body and positioned with the same anchored-layer
|
|
589
|
+
* geometry as Popover (flip, clamp, follow a moving anchor), because a tooltip drawn
|
|
590
|
+
* inside its trigger's box is clipped by the first `overflow: hidden` ancestor — which in
|
|
591
|
+
* a fixed-width table cell or a list row is all of them.
|
|
592
|
+
*/
|
|
505
593
|
declare function Tooltip({ label, placement, children, className }: TooltipProps): React.JSX.Element;
|
|
506
594
|
|
|
507
595
|
interface ClampProps {
|
|
@@ -1230,8 +1318,11 @@ interface EntityRowAction {
|
|
|
1230
1318
|
/** Accessible name for the action button. */
|
|
1231
1319
|
label: string;
|
|
1232
1320
|
onClick: () => void;
|
|
1233
|
-
/**
|
|
1234
|
-
* (danger
|
|
1321
|
+
/** Picks the fill — "add" is the constructive (ok) fill, "remove" the destructive
|
|
1322
|
+
* (danger) fill, and no tone the brand fill. The button is always a filled
|
|
1323
|
+
* IconButton (variant "solid"): it is the one action on the row, repeated down a long
|
|
1324
|
+
* list, and has to be findable at a glance on a default card and on a danger-toned one
|
|
1325
|
+
* alike. No effect on layout, so a caller can still pass any icon. */
|
|
1235
1326
|
tone?: "add" | "remove";
|
|
1236
1327
|
}
|
|
1237
1328
|
/** Width in px a metric cell takes when it doesn't ask for its own. Wide enough for a
|
|
@@ -1243,9 +1334,17 @@ interface EntityRowMetric {
|
|
|
1243
1334
|
* columns legitimately share a label. */
|
|
1244
1335
|
id?: string;
|
|
1245
1336
|
/** What the number means — "students", "ad units". Never rendered as running text:
|
|
1246
|
-
* it is the metric's accessible name
|
|
1247
|
-
*
|
|
1337
|
+
* it is the metric's accessible name, so the row stays scannable as numbers while a
|
|
1338
|
+
* screen reader still hears "1,240 students". Without a `tooltip` it is also the
|
|
1339
|
+
* cell's native hover title. */
|
|
1248
1340
|
label: string;
|
|
1341
|
+
/** The long-form explanation of this figure — what it counts, why it is zero, what an
|
|
1342
|
+
* "unknown" means. Shown in the kit's Tooltip on hover, keyboard focus and tap, and
|
|
1343
|
+
* exposed as the cell's accessible description (`label` stays its short name). A cell
|
|
1344
|
+
* with a tooltip becomes a focusable button so the explanation is reachable without a
|
|
1345
|
+
* mouse, and drops the native `title` so two tooltips never show at once. A button is
|
|
1346
|
+
* also what keeps a tap on it from arming TransferList's row drag. */
|
|
1347
|
+
tooltip?: React.ReactNode;
|
|
1249
1348
|
value: React.ReactNode;
|
|
1250
1349
|
/** Phosphor icon name shown before the value, e.g. "student". */
|
|
1251
1350
|
icon?: string;
|
|
@@ -1516,6 +1615,11 @@ interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "
|
|
|
1516
1615
|
loading?: boolean;
|
|
1517
1616
|
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1518
1617
|
style?: React.CSSProperties;
|
|
1618
|
+
/** Applied to the outer .fd-field element, like `style` and for the same reason: that
|
|
1619
|
+
* element is the field's box in whatever layout it sits in (a flex toolbar, a grid
|
|
1620
|
+
* cell). The input box inside it is a child of a vertical flex column, so a sizing
|
|
1621
|
+
* class landing THERE turns a row's `flex-basis` into a height. */
|
|
1622
|
+
className?: string;
|
|
1519
1623
|
/** Applied to the inner input element. Rarely needed. */
|
|
1520
1624
|
inputStyle?: React.CSSProperties;
|
|
1521
1625
|
}
|
|
@@ -1532,6 +1636,7 @@ interface SearchFieldProps {
|
|
|
1532
1636
|
onClear?: () => void;
|
|
1533
1637
|
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1534
1638
|
style?: React.CSSProperties;
|
|
1639
|
+
/** Applied to the outer .fd-field element, like `style`. */
|
|
1535
1640
|
className?: string;
|
|
1536
1641
|
/** Visible field label, same as Input. Most search fields skip this and rely on placeholder. */
|
|
1537
1642
|
label?: string;
|
|
@@ -1563,8 +1668,10 @@ interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement
|
|
|
1563
1668
|
error?: string;
|
|
1564
1669
|
required?: boolean;
|
|
1565
1670
|
rows?: number;
|
|
1566
|
-
/** Applied to the field
|
|
1671
|
+
/** Applied to the outer .fd-field element — this is where width belongs. */
|
|
1567
1672
|
style?: React.CSSProperties;
|
|
1673
|
+
/** Applied to the outer .fd-field element, like `style` — the same rule as Input. */
|
|
1674
|
+
className?: string;
|
|
1568
1675
|
}
|
|
1569
1676
|
declare function Textarea({ label, help, error, required, rows, disabled, id, className, style, ...rest }: TextareaProps): React.JSX.Element;
|
|
1570
1677
|
|
|
@@ -3475,4 +3582,4 @@ interface VersionStore<TState, TDiff = unknown> {
|
|
|
3475
3582
|
}
|
|
3476
3583
|
declare function createVersionStore<TState, TDiff = unknown>(initialState: TState, options?: CreateVersionStoreOptions<TState, TDiff>): VersionStore<TState, TDiff>;
|
|
3477
3584
|
|
|
3478
|
-
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, ENTITY_ROW_METRIC_WIDTH, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowContent, type EntityRowMetric, EntityRowMetrics, type EntityRowMetricsProps, 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, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, 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, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, 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, ScoreMeter, type ScoreMeterProps, 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, VIRTUAL_LIST_ROW_GAP, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualLoadedBand, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, preferenceScore, preferenceSegments, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
|
|
3585
|
+
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, ENTITY_ROW_METRIC_WIDTH, type EditorTrigger, EmptyState, type EmptyStateProps, type EndpointSpec, EntityRow, type EntityRowAction, type EntityRowContent, type EntityRowMetric, EntityRowMetrics, type EntityRowMetricsProps, 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, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, 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, POPOVER_BODY_MIN, 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, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, 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, ScoreMeter, type ScoreMeterProps, 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, VIRTUAL_LIST_ROW_GAP, type VersionRecord, type VersionStore, VirtualList, type VirtualListProps, type VirtualLoadedBand, type VirtualWindow, type VoiceHandler, acceptMatches, anyOfFilter, channelWeightOf, computeNeedMore, computeVirtualWindow, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, isImage, isSystemMessage, jobBucket, languageLabel, markdownToText, meterFormats, modifierLabel, pastedTextName, preferenceScore, preferenceSegments, rangeFilter, revokeAttachment, toAttachment, tokenize, useChatEngine, useFeatureStatus, usePopoverPosition, useRuntimeMode, useServerTable, useStagedFiles, visibleMessages };
|