@flytedan/flytebot-design-system 0.46.0 → 0.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -286,9 +286,28 @@ interface CardProps {
286
286
  hoverable?: boolean;
287
287
  /** Set false to let children run edge to edge (tables, images). */
288
288
  padded?: boolean;
289
+ /** MP-271: renders the dashed draft/placeholder treatment — an unsaved or
290
+ * not-yet-created item shown alongside real ones (SMS-12's local-draft audience
291
+ * card is the first consumer). The dash uses `--border-strong`, an existing
292
+ * token also used elsewhere for a "more emphatic than the hairline default"
293
+ * border, so light, dark and `[data-contrast="high"]` all resolve it correctly
294
+ * with no new colour. */
295
+ draft?: boolean;
296
+ /** Renders the card as a real `<a>` (keeps `hoverable`'s lift, adds real
297
+ * hover/focus-visible/press states, MP-271). Takes precedence over `onClick`. */
298
+ href?: string;
299
+ /** Renders the card as a real `<button type="button">` when there's no `href`
300
+ * (MP-271) — never a `<div onClick>`, so it's reachable by Tab and activates on
301
+ * both Enter and Space for free, and gets the kit's global `:focus-visible`
302
+ * ring (styles/foundations.css) without this component drawing its own. */
303
+ onClick?: (e: React.MouseEvent<HTMLElement>) => void;
304
+ /** Passed through to the root element — CardGrid (MP-271) sets this to
305
+ * "listitem" on every card it lays out, unless the caller already chose one. */
306
+ role?: string;
307
+ tabIndex?: number;
289
308
  className?: string;
290
309
  }
291
- declare function Card({ title, action, footer, children, elevation, hoverable, padded, className, ...rest }: CardProps): React.JSX.Element;
310
+ declare function Card({ title, action, footer, children, elevation, hoverable, padded, draft, href, onClick, role, tabIndex, className, ...rest }: CardProps): React.JSX.Element;
292
311
  interface CardRowProps {
293
312
  label: React.ReactNode;
294
313
  children?: React.ReactNode;
@@ -360,6 +379,51 @@ interface ScreenHeadProps {
360
379
  }
361
380
  declare function ScreenHead({ kicker, title, lede, actions }: ScreenHeadProps): React.JSX.Element;
362
381
 
382
+ /**
383
+ * MP-271 — a responsive grid for a dashboard's worth of `Card`s (SMS-12's saved-audiences
384
+ * page is the first consumer; media-planner's own dashboards are the reason this lives here
385
+ * rather than in sms-app — R-9 forbids a UI-generic layout primitive living in a single app).
386
+ *
387
+ * Column count follows the CONTAINER's own width, not the viewport: `repeat(auto-fill,
388
+ * minmax(...))` recomputes how many tracks fit as soon as the grid's own box changes width,
389
+ * which is exactly "container width" without needing a `container-type` wrapper or a
390
+ * `@container` query — the grid element already sizes itself off its parent, the same as any
391
+ * other block box. `--card-grid-min` (default 280px) is the floor a card may shrink to before
392
+ * a track drops; two 280px cards plus the gap don't fit in a 375px-wide content column, so
393
+ * that width is always exactly one column, and a typical ~1280px desktop content column fits
394
+ * four (see CardGrid.browser.test.tsx for the measured counts this rests on).
395
+ *
396
+ * Equal-height rows fall out of the grid's own default `align-items: stretch` (restated below
397
+ * for clarity, not because the default would otherwise fail): every item in a row stretches to
398
+ * that row's tallest item, so cards with different amounts of content still form a level row —
399
+ * no per-card height prop, no JS measurement.
400
+ *
401
+ * Gaps reuse the spacing scale's own existing `fd-gap-*` utility classes (styles/layoutUtilities,
402
+ * SMS-7) rather than a new one-off `gap` value: `gap` on a grid container is exactly the same
403
+ * property `fd-gap-*` already sets on a flex container, so extending that vocabulary to grids
404
+ * costs nothing new and keeps "the medium gap" meaning one token everywhere it's used.
405
+ *
406
+ * List semantics: the grid itself is `role="list"`, and each direct child is cloned with
407
+ * `role="listitem"` added — the caller just renders `<CardGrid><Card .../><Card .../></CardGrid>`
408
+ * and never has to remember the ARIA role itself. A child that already sets its own `role` is
409
+ * left alone (cloning only fills in a role when the child didn't already choose one), so a
410
+ * consumer with an unusual case (e.g. a child that should stay out of the list, such as an
411
+ * inline empty-state message spanning every column) can opt out explicitly.
412
+ */
413
+ interface CardGridProps {
414
+ children?: React.ReactNode;
415
+ /** The width, in px, a card may shrink to before a column drops. Default 280 is tuned so a
416
+ * 375px-wide content column (a phone) is always exactly one column and a ~1280px desktop
417
+ * content column fits four — see the file doc comment. */
418
+ minCardWidth?: number;
419
+ /** One of the spacing scale's named tiers (styles/tokens.css's `--s-*`), same vocabulary as
420
+ * `fd-gap-*` (SMS-7). Applies to both the row and column gap. */
421
+ gap?: "sm" | "md" | "lg" | "xl";
422
+ className?: string;
423
+ style?: React.CSSProperties;
424
+ }
425
+ declare function CardGrid({ children, minCardWidth, gap, className, style }: CardGridProps): React.JSX.Element;
426
+
363
427
  /**
364
428
  * The async contract for one region of a screen. Four states, one component:
365
429
  * loading (skeleton), refreshing (previous data stays visible, dimmed and inert),
@@ -4825,4 +4889,4 @@ declare function formatDocumentTitle(routeTitle: string | undefined | null, appN
4825
4889
  */
4826
4890
  declare function useDocumentTitle(routeTitle: string | undefined | null, appName: string): void;
4827
4891
 
4828
- export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, AnchoredPopover, type AnchoredPopoverProps, AnimNum, type AnimNumProps, ApiSpecBrowser, type ApiSpecBrowserProps, type AppEntry, AppShell, type AppShellProps, AppSwitcher, type AppSwitcherProps, AppearanceMenu, type AppearanceMenuProps, type AppearancePrefs, type AppearanceStore, type AppearanceStoreOptions, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, BarList, type BarListProps, type BarListRow, 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, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DemoSessionControls, DemoSessionProvider, type DeviceSession, DiffBlock, type DiffBlockProps, DonutChart, type DonutChartProps, type DonutSegment, 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, FILE_VIEWER_CSV_ROW_LIMIT, FILE_VIEWER_TEXT_LIMIT, FeatureGate, type FeatureGateProps, type FeatureStatus, FileBrowser, type FileBrowserFile, type FileBrowserFolder, type FileBrowserPermissions, type FileBrowserProps, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FileViewer, type FileViewerProps, FilterBar, type FilterBarProps, type FilterDateValue, type FilterField, type FilterFieldDate, type FilterFieldMultiSelect, type FilterFieldOption, type FilterFieldRange, type FilterFieldSelect, type FilterFieldText, type FilterMultiSelectValue, type FilterOperator, type FilterRangeValue, type FilterResolveMatch, type FilterResolveResult, type FilterValidation, type FilterValue, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, FunnelChart, type FunnelChartProps, type FunnelStep, Gate, GatePending, type GatePendingProps, type GateProps, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, Input, type InputProps, type Job, type JobAction, type JobCardStatus, type JobStatus, JobTray, type JobTrayProps, 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 Phase, type PhaseStatus, PhasedProgress, type PhasedProgressProps, type Placement, type PollOptions, Popover, type PopoverProps, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, type ProfileFieldDef, type ProfileFieldType, type ProfileNotificationDef, 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, ScreenHead, type ScreenHeadProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type SessionContextValue, type Flag as SessionFlag, SessionKit, SessionProvider, type SessionProviderProps, type SessionRole, type SessionStats, type SessionUser, SidebarNav, type SidebarNavItem, type SidebarNavProps, type SignInContinueAs, SignInPage, type SignInPageProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, type StackedLayer, type StackedLayerOptions, StackedLayerProvider, 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, type TextScale, Textarea, type TextareaProps, type ThemeMode, 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, TrendChart, type TrendChartProps, type TrendSeries, type UsageLimit, UseFeatureStatus, type UseResponsiveRailOptions, type UseResponsiveRailResult, 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, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, createLocalStorageAppearanceStore, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDocumentTitle, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, installFlytedeskFavicon, isImage, isSystemMessage, isWithinLayerTree, jobBucket, languageLabel, loadPrefs, markdownToText, meterFormats, modifierLabel, parseDelimited, pastedTextName, pluralizeUnit, preferenceScore, preferenceSegments, rangeFilter, resolveTheme, revokeAttachment, savePrefs, toAttachment, tokenize, useAppearancePrefs, useChatEngine, useDocumentTitle, useFeatureStatus, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, validateFilterValue, visibleMessages };
4892
+ export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, AnchoredPopover, type AnchoredPopoverProps, AnimNum, type AnimNumProps, ApiSpecBrowser, type ApiSpecBrowserProps, type AppEntry, AppShell, type AppShellProps, AppSwitcher, type AppSwitcherProps, AppearanceMenu, type AppearanceMenuProps, type AppearancePrefs, type AppearanceStore, type AppearanceStoreOptions, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, BarList, type BarListProps, type BarListRow, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, CardGrid, type CardGridProps, 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, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DemoSessionControls, DemoSessionProvider, type DeviceSession, DiffBlock, type DiffBlockProps, DonutChart, type DonutChartProps, type DonutSegment, 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, FILE_VIEWER_CSV_ROW_LIMIT, FILE_VIEWER_TEXT_LIMIT, FeatureGate, type FeatureGateProps, type FeatureStatus, FileBrowser, type FileBrowserFile, type FileBrowserFolder, type FileBrowserPermissions, type FileBrowserProps, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FileViewer, type FileViewerProps, FilterBar, type FilterBarProps, type FilterDateValue, type FilterField, type FilterFieldDate, type FilterFieldMultiSelect, type FilterFieldOption, type FilterFieldRange, type FilterFieldSelect, type FilterFieldText, type FilterMultiSelectValue, type FilterOperator, type FilterRangeValue, type FilterResolveMatch, type FilterResolveResult, type FilterValidation, type FilterValue, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, FunnelChart, type FunnelChartProps, type FunnelStep, Gate, GatePending, type GatePendingProps, type GateProps, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, Input, type InputProps, type Job, type JobAction, type JobCardStatus, type JobStatus, JobTray, type JobTrayProps, 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 Phase, type PhaseStatus, PhasedProgress, type PhasedProgressProps, type Placement, type PollOptions, Popover, type PopoverProps, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, type ProfileFieldDef, type ProfileFieldType, type ProfileNotificationDef, 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, ScreenHead, type ScreenHeadProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type SessionContextValue, type Flag as SessionFlag, SessionKit, SessionProvider, type SessionProviderProps, type SessionRole, type SessionStats, type SessionUser, SidebarNav, type SidebarNavItem, type SidebarNavProps, type SignInContinueAs, SignInPage, type SignInPageProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, type StackedLayer, type StackedLayerOptions, StackedLayerProvider, 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, type TextScale, Textarea, type TextareaProps, type ThemeMode, 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, TrendChart, type TrendChartProps, type TrendSeries, type UsageLimit, UseFeatureStatus, type UseResponsiveRailOptions, type UseResponsiveRailResult, 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, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, createLocalStorageAppearanceStore, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDocumentTitle, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, installFlytedeskFavicon, isImage, isSystemMessage, isWithinLayerTree, jobBucket, languageLabel, loadPrefs, markdownToText, meterFormats, modifierLabel, parseDelimited, pastedTextName, pluralizeUnit, preferenceScore, preferenceSegments, rangeFilter, resolveTheme, revokeAttachment, savePrefs, toAttachment, tokenize, useAppearancePrefs, useChatEngine, useDocumentTitle, useFeatureStatus, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, validateFilterValue, visibleMessages };
package/dist/index.d.ts CHANGED
@@ -286,9 +286,28 @@ interface CardProps {
286
286
  hoverable?: boolean;
287
287
  /** Set false to let children run edge to edge (tables, images). */
288
288
  padded?: boolean;
289
+ /** MP-271: renders the dashed draft/placeholder treatment — an unsaved or
290
+ * not-yet-created item shown alongside real ones (SMS-12's local-draft audience
291
+ * card is the first consumer). The dash uses `--border-strong`, an existing
292
+ * token also used elsewhere for a "more emphatic than the hairline default"
293
+ * border, so light, dark and `[data-contrast="high"]` all resolve it correctly
294
+ * with no new colour. */
295
+ draft?: boolean;
296
+ /** Renders the card as a real `<a>` (keeps `hoverable`'s lift, adds real
297
+ * hover/focus-visible/press states, MP-271). Takes precedence over `onClick`. */
298
+ href?: string;
299
+ /** Renders the card as a real `<button type="button">` when there's no `href`
300
+ * (MP-271) — never a `<div onClick>`, so it's reachable by Tab and activates on
301
+ * both Enter and Space for free, and gets the kit's global `:focus-visible`
302
+ * ring (styles/foundations.css) without this component drawing its own. */
303
+ onClick?: (e: React.MouseEvent<HTMLElement>) => void;
304
+ /** Passed through to the root element — CardGrid (MP-271) sets this to
305
+ * "listitem" on every card it lays out, unless the caller already chose one. */
306
+ role?: string;
307
+ tabIndex?: number;
289
308
  className?: string;
290
309
  }
291
- declare function Card({ title, action, footer, children, elevation, hoverable, padded, className, ...rest }: CardProps): React.JSX.Element;
310
+ declare function Card({ title, action, footer, children, elevation, hoverable, padded, draft, href, onClick, role, tabIndex, className, ...rest }: CardProps): React.JSX.Element;
292
311
  interface CardRowProps {
293
312
  label: React.ReactNode;
294
313
  children?: React.ReactNode;
@@ -360,6 +379,51 @@ interface ScreenHeadProps {
360
379
  }
361
380
  declare function ScreenHead({ kicker, title, lede, actions }: ScreenHeadProps): React.JSX.Element;
362
381
 
382
+ /**
383
+ * MP-271 — a responsive grid for a dashboard's worth of `Card`s (SMS-12's saved-audiences
384
+ * page is the first consumer; media-planner's own dashboards are the reason this lives here
385
+ * rather than in sms-app — R-9 forbids a UI-generic layout primitive living in a single app).
386
+ *
387
+ * Column count follows the CONTAINER's own width, not the viewport: `repeat(auto-fill,
388
+ * minmax(...))` recomputes how many tracks fit as soon as the grid's own box changes width,
389
+ * which is exactly "container width" without needing a `container-type` wrapper or a
390
+ * `@container` query — the grid element already sizes itself off its parent, the same as any
391
+ * other block box. `--card-grid-min` (default 280px) is the floor a card may shrink to before
392
+ * a track drops; two 280px cards plus the gap don't fit in a 375px-wide content column, so
393
+ * that width is always exactly one column, and a typical ~1280px desktop content column fits
394
+ * four (see CardGrid.browser.test.tsx for the measured counts this rests on).
395
+ *
396
+ * Equal-height rows fall out of the grid's own default `align-items: stretch` (restated below
397
+ * for clarity, not because the default would otherwise fail): every item in a row stretches to
398
+ * that row's tallest item, so cards with different amounts of content still form a level row —
399
+ * no per-card height prop, no JS measurement.
400
+ *
401
+ * Gaps reuse the spacing scale's own existing `fd-gap-*` utility classes (styles/layoutUtilities,
402
+ * SMS-7) rather than a new one-off `gap` value: `gap` on a grid container is exactly the same
403
+ * property `fd-gap-*` already sets on a flex container, so extending that vocabulary to grids
404
+ * costs nothing new and keeps "the medium gap" meaning one token everywhere it's used.
405
+ *
406
+ * List semantics: the grid itself is `role="list"`, and each direct child is cloned with
407
+ * `role="listitem"` added — the caller just renders `<CardGrid><Card .../><Card .../></CardGrid>`
408
+ * and never has to remember the ARIA role itself. A child that already sets its own `role` is
409
+ * left alone (cloning only fills in a role when the child didn't already choose one), so a
410
+ * consumer with an unusual case (e.g. a child that should stay out of the list, such as an
411
+ * inline empty-state message spanning every column) can opt out explicitly.
412
+ */
413
+ interface CardGridProps {
414
+ children?: React.ReactNode;
415
+ /** The width, in px, a card may shrink to before a column drops. Default 280 is tuned so a
416
+ * 375px-wide content column (a phone) is always exactly one column and a ~1280px desktop
417
+ * content column fits four — see the file doc comment. */
418
+ minCardWidth?: number;
419
+ /** One of the spacing scale's named tiers (styles/tokens.css's `--s-*`), same vocabulary as
420
+ * `fd-gap-*` (SMS-7). Applies to both the row and column gap. */
421
+ gap?: "sm" | "md" | "lg" | "xl";
422
+ className?: string;
423
+ style?: React.CSSProperties;
424
+ }
425
+ declare function CardGrid({ children, minCardWidth, gap, className, style }: CardGridProps): React.JSX.Element;
426
+
363
427
  /**
364
428
  * The async contract for one region of a screen. Four states, one component:
365
429
  * loading (skeleton), refreshing (previous data stays visible, dimmed and inert),
@@ -4825,4 +4889,4 @@ declare function formatDocumentTitle(routeTitle: string | undefined | null, appN
4825
4889
  */
4826
4890
  declare function useDocumentTitle(routeTitle: string | undefined | null, appName: string): void;
4827
4891
 
4828
- export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, AnchoredPopover, type AnchoredPopoverProps, AnimNum, type AnimNumProps, ApiSpecBrowser, type ApiSpecBrowserProps, type AppEntry, AppShell, type AppShellProps, AppSwitcher, type AppSwitcherProps, AppearanceMenu, type AppearanceMenuProps, type AppearancePrefs, type AppearanceStore, type AppearanceStoreOptions, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, BarList, type BarListProps, type BarListRow, 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, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DemoSessionControls, DemoSessionProvider, type DeviceSession, DiffBlock, type DiffBlockProps, DonutChart, type DonutChartProps, type DonutSegment, 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, FILE_VIEWER_CSV_ROW_LIMIT, FILE_VIEWER_TEXT_LIMIT, FeatureGate, type FeatureGateProps, type FeatureStatus, FileBrowser, type FileBrowserFile, type FileBrowserFolder, type FileBrowserPermissions, type FileBrowserProps, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FileViewer, type FileViewerProps, FilterBar, type FilterBarProps, type FilterDateValue, type FilterField, type FilterFieldDate, type FilterFieldMultiSelect, type FilterFieldOption, type FilterFieldRange, type FilterFieldSelect, type FilterFieldText, type FilterMultiSelectValue, type FilterOperator, type FilterRangeValue, type FilterResolveMatch, type FilterResolveResult, type FilterValidation, type FilterValue, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, FunnelChart, type FunnelChartProps, type FunnelStep, Gate, GatePending, type GatePendingProps, type GateProps, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, Input, type InputProps, type Job, type JobAction, type JobCardStatus, type JobStatus, JobTray, type JobTrayProps, 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 Phase, type PhaseStatus, PhasedProgress, type PhasedProgressProps, type Placement, type PollOptions, Popover, type PopoverProps, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, type ProfileFieldDef, type ProfileFieldType, type ProfileNotificationDef, 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, ScreenHead, type ScreenHeadProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type SessionContextValue, type Flag as SessionFlag, SessionKit, SessionProvider, type SessionProviderProps, type SessionRole, type SessionStats, type SessionUser, SidebarNav, type SidebarNavItem, type SidebarNavProps, type SignInContinueAs, SignInPage, type SignInPageProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, type StackedLayer, type StackedLayerOptions, StackedLayerProvider, 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, type TextScale, Textarea, type TextareaProps, type ThemeMode, 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, TrendChart, type TrendChartProps, type TrendSeries, type UsageLimit, UseFeatureStatus, type UseResponsiveRailOptions, type UseResponsiveRailResult, 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, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, createLocalStorageAppearanceStore, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDocumentTitle, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, installFlytedeskFavicon, isImage, isSystemMessage, isWithinLayerTree, jobBucket, languageLabel, loadPrefs, markdownToText, meterFormats, modifierLabel, parseDelimited, pastedTextName, pluralizeUnit, preferenceScore, preferenceSegments, rangeFilter, resolveTheme, revokeAttachment, savePrefs, toAttachment, tokenize, useAppearancePrefs, useChatEngine, useDocumentTitle, useFeatureStatus, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, validateFilterValue, visibleMessages };
4892
+ export { AccountMenu, type AccountMenuLink, type AccountMenuProps, AgentChatPanel, type AgentChatPanelProps, AnchoredPopover, type AnchoredPopoverProps, AnimNum, type AnimNumProps, ApiSpecBrowser, type ApiSpecBrowserProps, type AppEntry, AppShell, type AppShellProps, AppSwitcher, type AppSwitcherProps, AppearanceMenu, type AppearanceMenuProps, type AppearancePrefs, type AppearanceStore, type AppearanceStoreOptions, type Attachment, Avatar, type AvatarProps, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, BarList, type BarListProps, type BarListRow, BudgetReallocator, type BudgetReallocatorProps, Button, type ButtonProps, CHANNELS, CHANNEL_WEIGHTS, CHAT_UNAVAILABLE, Calendar, type CalendarProps, Card, CardGrid, type CardGridProps, 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, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, type DemoSessionControls, DemoSessionProvider, type DeviceSession, DiffBlock, type DiffBlockProps, DonutChart, type DonutChartProps, type DonutSegment, 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, FILE_VIEWER_CSV_ROW_LIMIT, FILE_VIEWER_TEXT_LIMIT, FeatureGate, type FeatureGateProps, type FeatureStatus, FileBrowser, type FileBrowserFile, type FileBrowserFolder, type FileBrowserPermissions, type FileBrowserProps, FileChip, type FileChipProps, FileGrid, type FileGridProps, FileKit, FilePickButton, type FilePickButtonProps, type FileRejection, FileStrip, type FileStripProps, FileTile, type FileTileProps, type FileUploadHandler, FileViewer, type FileViewerProps, FilterBar, type FilterBarProps, type FilterDateValue, type FilterField, type FilterFieldDate, type FilterFieldMultiSelect, type FilterFieldOption, type FilterFieldRange, type FilterFieldSelect, type FilterFieldText, type FilterMultiSelectValue, type FilterOperator, type FilterRangeValue, type FilterResolveMatch, type FilterResolveResult, type FilterValidation, type FilterValue, Flag$1 as Flag, type FlagExplanation, type FlagProps, FlytedeskBrand, type FlytedeskBrandProps, FlytedeskMark, type FlytedeskMarkProps, FormatEta, FunnelChart, type FunnelChartProps, type FunnelStep, Gate, GatePending, type GatePendingProps, type GateProps, IMPORTANCE_LEVELS, IconButton, type IconButtonProps, type ImportanceLevel, type ImportanceLevelId, ImportanceTag, type ImportanceTagProps, type ImportanceTokens, Input, type InputProps, type Job, type JobAction, type JobCardStatus, type JobStatus, JobTray, type JobTrayProps, 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 Phase, type PhaseStatus, PhasedProgress, type PhasedProgressProps, type Placement, type PollOptions, Popover, type PopoverProps, type PreferenceCriterion, PreferenceMeter, type PreferenceMeterProps, type ProfileFieldDef, type ProfileFieldType, type ProfileNotificationDef, 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, ScreenHead, type ScreenHeadProps, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlProps, SegmentedMeter, type SegmentedMeterProps, Select, type SelectOption, type SelectProps, type SendMessageResult, type ServerTable, type Session, type SessionContextValue, type Flag as SessionFlag, SessionKit, SessionProvider, type SessionProviderProps, type SessionRole, type SessionStats, type SessionUser, SidebarNav, type SidebarNavItem, type SidebarNavProps, type SignInContinueAs, SignInPage, type SignInPageProps, Skeleton, type SkeletonProps, SkeletonText, type SkeletonTextProps, type SlashCommand, Slider, type SliderProps, SortMenu, type SortMenuField, type SortMenuProps, type SpecModule, Spinner, type SpinnerProps, type StackedLayer, type StackedLayerOptions, StackedLayerProvider, 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, type TextScale, Textarea, type TextareaProps, type ThemeMode, 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, TrendChart, type TrendChartProps, type TrendSeries, type UsageLimit, UseFeatureStatus, type UseResponsiveRailOptions, type UseResponsiveRailResult, 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, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, createLocalStorageAppearanceStore, createVersionStore, eqFilter, extensionOf, extractClipboardFiles, filterFiles, formatAbsolute, formatBytes, formatClock, formatDocumentTitle, formatDuration, formatEta, formatRelative, groupMessages, hasModifier, iconForMime, importanceLevel, importanceTokens, installFlytedeskFavicon, isImage, isSystemMessage, isWithinLayerTree, jobBucket, languageLabel, loadPrefs, markdownToText, meterFormats, modifierLabel, parseDelimited, pastedTextName, pluralizeUnit, preferenceScore, preferenceSegments, rangeFilter, resolveTheme, revokeAttachment, savePrefs, toAttachment, tokenize, useAppearancePrefs, useChatEngine, useDocumentTitle, useFeatureStatus, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, validateFilterValue, visibleMessages };