@flytedan/flytebot-design-system 0.51.6 → 0.53.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/README.md +2 -2
- package/dist/index.cjs +55 -205
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +34 -54
- package/dist/index.d.ts +34 -54
- package/dist/index.js +54 -204
- package/dist/index.js.map +1 -1
- package/package.json +4 -4
- package/styles/components.css +145 -0
package/dist/index.d.cts
CHANGED
|
@@ -1109,7 +1109,7 @@ interface FunnelChartProps {
|
|
|
1109
1109
|
* FunnelChart — ordered steps drawn as a tapering stack (Sent -> Delivered -> Clicked ->
|
|
1110
1110
|
* Opted-out, the reference front end's own shape, PLN-2 SMS-20), each reporting its
|
|
1111
1111
|
* value, its step rate (conversion from the step before it) and its percent of the
|
|
1112
|
-
* first step. Colour comes only from `--chart-1..8` (MP-210), one per step in order.
|
|
1112
|
+
* first step. Each step's label (name, value, rates) sits above its own bar. Colour comes only from `--chart-1..8` (MP-210), one per step in order.
|
|
1113
1113
|
*
|
|
1114
1114
|
* Every step is a real `<button>` wrapped in the kit's `Tooltip`, keyboard-reachable
|
|
1115
1115
|
* exactly like `BarList`'s rows — a funnel is a ranked, ordered list before it is a
|
|
@@ -3227,65 +3227,45 @@ interface ProfilePageProps {
|
|
|
3227
3227
|
declare function ProfilePage({ user: userProp, fields, notifications, extra, onChangePhoto, onSave, onNavigate, sessions, onSignOutEverywhere, className, }: ProfilePageProps): React.JSX.Element;
|
|
3228
3228
|
|
|
3229
3229
|
/**
|
|
3230
|
-
* MP-
|
|
3231
|
-
*
|
|
3232
|
-
*
|
|
3233
|
-
*
|
|
3230
|
+
* MP-288: the one full-viewport screen every flytedesk ID app shows while its session is
|
|
3231
|
+
* not usable. flytedesk ID apps never show a sign-in button page (PLN-2 R-14): app-kit's
|
|
3232
|
+
* headless `SessionBoundary` signs the visitor in automatically, and renders the app only
|
|
3233
|
+
* while the session is usable. For every other moment it calls `screen(state)`, and this
|
|
3234
|
+
* component is what the app renders there —
|
|
3234
3235
|
*
|
|
3235
|
-
*
|
|
3236
|
-
* library. The app supplies `productName` for the heading and `onSignIn()`,
|
|
3237
|
-
* called on click — the app then does its own full-page navigation to its
|
|
3238
|
-
* API's `/auth/login` (a real browser navigation, not a fetch, since the
|
|
3239
|
-
* subsequent hop through flytedesk-id and back is a redirect chain the
|
|
3240
|
-
* browser has to actually follow). This component only drives the button's
|
|
3241
|
-
* own loading state from that click until the page unloads; it never
|
|
3242
|
-
* initiates the navigation itself.
|
|
3236
|
+
* <SessionBoundary screen={(state) => <SessionScreen {...state} productName="SMS" />}>
|
|
3243
3237
|
*
|
|
3244
|
-
*
|
|
3245
|
-
*
|
|
3246
|
-
*
|
|
3247
|
-
*
|
|
3248
|
-
* mechanism (prompt=none) is out of scope here — it lives in app-kit (AK-14)
|
|
3249
|
-
* and the app supplies it as `onContinue`.
|
|
3238
|
+
* Purely presentational, and the dependency rule is one-way in both directions: this
|
|
3239
|
+
* package never imports app-kit, and app-kit never imports this one. `kind`, `error` and
|
|
3240
|
+
* `onRetry` are exactly the plain shape app-kit's `SessionScreenState` has, so the fit is
|
|
3241
|
+
* checked structurally at the app's call site.
|
|
3250
3242
|
*
|
|
3251
|
-
*
|
|
3252
|
-
*
|
|
3253
|
-
*
|
|
3254
|
-
* package's existing brand asset) rather than a second inline SVG — its
|
|
3255
|
-
* artwork is fixed dark-navy ink with dark-theme handled by a CSS filter (see
|
|
3256
|
-
* FlytedeskBrand.tsx), so it is wrapped in its own `data-theme="dark"` scope
|
|
3257
|
-
* here to force the white variant against this page's permanently-dark
|
|
3258
|
-
* background, without affecting the (light) Card beneath it.
|
|
3243
|
+
* Busy kinds show a spinner and a message in a polite live region. Failure kinds show
|
|
3244
|
+
* `error` in a danger Banner (which announces itself as an alert) and a "Try again" button
|
|
3245
|
+
* that calls `onRetry`.
|
|
3259
3246
|
*
|
|
3260
|
-
*
|
|
3261
|
-
*
|
|
3262
|
-
*
|
|
3263
|
-
*
|
|
3247
|
+
* Focus: the screen replaces the whole app, so whatever held focus is gone. Focus moves to
|
|
3248
|
+
* the heading when the screen appears, and whenever it switches between a busy and a failure
|
|
3249
|
+
* state (a retried failure's "Try again" button, which held focus, unmounts). From a failure,
|
|
3250
|
+
* the next Tab reaches "Try again".
|
|
3251
|
+
*
|
|
3252
|
+
* Announcements: a live region only announces changes made after it is in the page, and
|
|
3253
|
+
* this screen usually mounts with its message already known. So the message is written
|
|
3254
|
+
* into the (already mounted) region one effect later; every later change of kind updates
|
|
3255
|
+
* the same region, so "Signing you in…" becoming "Your session expired — …" is announced.
|
|
3264
3256
|
*/
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
/**
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
onDecline: () => void;
|
|
3275
|
-
}
|
|
3276
|
-
interface SignInPageProps {
|
|
3277
|
-
/** The heading, e.g. "Media Planner" or "SMS". */
|
|
3257
|
+
type SessionScreenKind = "signing-in" | "session-expired" | "signing-out" | "reconnecting" | "sign-in-failed" | "load-failed";
|
|
3258
|
+
interface SessionScreenProps {
|
|
3259
|
+
kind: SessionScreenKind;
|
|
3260
|
+
/** A plain-language message. Set for `sign-in-failed` and `load-failed`, null otherwise. */
|
|
3261
|
+
error: string | null;
|
|
3262
|
+
/** The failure kinds' "Try again". Set for `sign-in-failed` and `load-failed`, null
|
|
3263
|
+
* otherwise; a failure kind without it shows no button. */
|
|
3264
|
+
onRetry: (() => void) | null;
|
|
3265
|
+
/** The heading, e.g. "SMS" or "Media Planner". */
|
|
3278
3266
|
productName: string;
|
|
3279
|
-
/** Starts the app's own full-page navigation to its API's /auth/login.
|
|
3280
|
-
* This component shows the button's loading state from the click until
|
|
3281
|
-
* the page unloads. */
|
|
3282
|
-
onSignIn: () => void;
|
|
3283
|
-
continueAs?: SignInContinueAs;
|
|
3284
|
-
/** A plain-language message shown as a danger banner above the sign-in
|
|
3285
|
-
* button, e.g. after a failed silent resume. Omit for no banner. */
|
|
3286
|
-
error?: string;
|
|
3287
3267
|
}
|
|
3288
|
-
declare function
|
|
3268
|
+
declare function SessionScreen({ kind, error, onRetry, productName }: SessionScreenProps): React.JSX.Element;
|
|
3289
3269
|
|
|
3290
3270
|
interface RoadmapTimelineProps {
|
|
3291
3271
|
/** Called with a flag key when the reader clicks one — route it to your flag admin. */
|
|
@@ -5070,4 +5050,4 @@ declare function CornerStackPortal({ slot, children }: {
|
|
|
5070
5050
|
children?: React.ReactNode;
|
|
5071
5051
|
}): React.ReactPortal | null;
|
|
5072
5052
|
|
|
5073
|
-
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, COPIED_FEEDBACK_MS, 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, CodeEditor, type CodeEditorDiagnostic, type CodeEditorProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, CornerStackPortal, type CornerStackSlot, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DEFAULT_TOAST_DURATION_MS, 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, LAYER_STEP, 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, OVERLAY_CEILING, 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, ROOT_STEP, 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,
|
|
5053
|
+
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, COPIED_FEEDBACK_MS, 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, CodeEditor, type CodeEditorDiagnostic, type CodeEditorProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, CornerStackPortal, type CornerStackSlot, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DEFAULT_TOAST_DURATION_MS, 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, LAYER_STEP, 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, OVERLAY_CEILING, 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, ROOT_STEP, 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, SessionScreen, type SessionScreenKind, type SessionScreenProps, type SessionStats, type SessionUser, 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, 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 ToastApi, type ToastOptions, type ToastProps, ToastProvider, 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, __resetLayerStackForTests, acceptMatches, anyOfFilter, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, copyToClipboard, 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, useCopyToClipboard, useCornerStackSlot, useDocumentTitle, useFeatureStatus, useLayerZIndex, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, useToast, validateFilterValue, visibleMessages };
|
package/dist/index.d.ts
CHANGED
|
@@ -1109,7 +1109,7 @@ interface FunnelChartProps {
|
|
|
1109
1109
|
* FunnelChart — ordered steps drawn as a tapering stack (Sent -> Delivered -> Clicked ->
|
|
1110
1110
|
* Opted-out, the reference front end's own shape, PLN-2 SMS-20), each reporting its
|
|
1111
1111
|
* value, its step rate (conversion from the step before it) and its percent of the
|
|
1112
|
-
* first step. Colour comes only from `--chart-1..8` (MP-210), one per step in order.
|
|
1112
|
+
* first step. Each step's label (name, value, rates) sits above its own bar. Colour comes only from `--chart-1..8` (MP-210), one per step in order.
|
|
1113
1113
|
*
|
|
1114
1114
|
* Every step is a real `<button>` wrapped in the kit's `Tooltip`, keyboard-reachable
|
|
1115
1115
|
* exactly like `BarList`'s rows — a funnel is a ranked, ordered list before it is a
|
|
@@ -3227,65 +3227,45 @@ interface ProfilePageProps {
|
|
|
3227
3227
|
declare function ProfilePage({ user: userProp, fields, notifications, extra, onChangePhoto, onSave, onNavigate, sessions, onSignOutEverywhere, className, }: ProfilePageProps): React.JSX.Element;
|
|
3228
3228
|
|
|
3229
3229
|
/**
|
|
3230
|
-
* MP-
|
|
3231
|
-
*
|
|
3232
|
-
*
|
|
3233
|
-
*
|
|
3230
|
+
* MP-288: the one full-viewport screen every flytedesk ID app shows while its session is
|
|
3231
|
+
* not usable. flytedesk ID apps never show a sign-in button page (PLN-2 R-14): app-kit's
|
|
3232
|
+
* headless `SessionBoundary` signs the visitor in automatically, and renders the app only
|
|
3233
|
+
* while the session is usable. For every other moment it calls `screen(state)`, and this
|
|
3234
|
+
* component is what the app renders there —
|
|
3234
3235
|
*
|
|
3235
|
-
*
|
|
3236
|
-
* library. The app supplies `productName` for the heading and `onSignIn()`,
|
|
3237
|
-
* called on click — the app then does its own full-page navigation to its
|
|
3238
|
-
* API's `/auth/login` (a real browser navigation, not a fetch, since the
|
|
3239
|
-
* subsequent hop through flytedesk-id and back is a redirect chain the
|
|
3240
|
-
* browser has to actually follow). This component only drives the button's
|
|
3241
|
-
* own loading state from that click until the page unloads; it never
|
|
3242
|
-
* initiates the navigation itself.
|
|
3236
|
+
* <SessionBoundary screen={(state) => <SessionScreen {...state} productName="SMS" />}>
|
|
3243
3237
|
*
|
|
3244
|
-
*
|
|
3245
|
-
*
|
|
3246
|
-
*
|
|
3247
|
-
*
|
|
3248
|
-
* mechanism (prompt=none) is out of scope here — it lives in app-kit (AK-14)
|
|
3249
|
-
* and the app supplies it as `onContinue`.
|
|
3238
|
+
* Purely presentational, and the dependency rule is one-way in both directions: this
|
|
3239
|
+
* package never imports app-kit, and app-kit never imports this one. `kind`, `error` and
|
|
3240
|
+
* `onRetry` are exactly the plain shape app-kit's `SessionScreenState` has, so the fit is
|
|
3241
|
+
* checked structurally at the app's call site.
|
|
3250
3242
|
*
|
|
3251
|
-
*
|
|
3252
|
-
*
|
|
3253
|
-
*
|
|
3254
|
-
* package's existing brand asset) rather than a second inline SVG — its
|
|
3255
|
-
* artwork is fixed dark-navy ink with dark-theme handled by a CSS filter (see
|
|
3256
|
-
* FlytedeskBrand.tsx), so it is wrapped in its own `data-theme="dark"` scope
|
|
3257
|
-
* here to force the white variant against this page's permanently-dark
|
|
3258
|
-
* background, without affecting the (light) Card beneath it.
|
|
3243
|
+
* Busy kinds show a spinner and a message in a polite live region. Failure kinds show
|
|
3244
|
+
* `error` in a danger Banner (which announces itself as an alert) and a "Try again" button
|
|
3245
|
+
* that calls `onRetry`.
|
|
3259
3246
|
*
|
|
3260
|
-
*
|
|
3261
|
-
*
|
|
3262
|
-
*
|
|
3263
|
-
*
|
|
3247
|
+
* Focus: the screen replaces the whole app, so whatever held focus is gone. Focus moves to
|
|
3248
|
+
* the heading when the screen appears, and whenever it switches between a busy and a failure
|
|
3249
|
+
* state (a retried failure's "Try again" button, which held focus, unmounts). From a failure,
|
|
3250
|
+
* the next Tab reaches "Try again".
|
|
3251
|
+
*
|
|
3252
|
+
* Announcements: a live region only announces changes made after it is in the page, and
|
|
3253
|
+
* this screen usually mounts with its message already known. So the message is written
|
|
3254
|
+
* into the (already mounted) region one effect later; every later change of kind updates
|
|
3255
|
+
* the same region, so "Signing you in…" becoming "Your session expired — …" is announced.
|
|
3264
3256
|
*/
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
/**
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
onDecline: () => void;
|
|
3275
|
-
}
|
|
3276
|
-
interface SignInPageProps {
|
|
3277
|
-
/** The heading, e.g. "Media Planner" or "SMS". */
|
|
3257
|
+
type SessionScreenKind = "signing-in" | "session-expired" | "signing-out" | "reconnecting" | "sign-in-failed" | "load-failed";
|
|
3258
|
+
interface SessionScreenProps {
|
|
3259
|
+
kind: SessionScreenKind;
|
|
3260
|
+
/** A plain-language message. Set for `sign-in-failed` and `load-failed`, null otherwise. */
|
|
3261
|
+
error: string | null;
|
|
3262
|
+
/** The failure kinds' "Try again". Set for `sign-in-failed` and `load-failed`, null
|
|
3263
|
+
* otherwise; a failure kind without it shows no button. */
|
|
3264
|
+
onRetry: (() => void) | null;
|
|
3265
|
+
/** The heading, e.g. "SMS" or "Media Planner". */
|
|
3278
3266
|
productName: string;
|
|
3279
|
-
/** Starts the app's own full-page navigation to its API's /auth/login.
|
|
3280
|
-
* This component shows the button's loading state from the click until
|
|
3281
|
-
* the page unloads. */
|
|
3282
|
-
onSignIn: () => void;
|
|
3283
|
-
continueAs?: SignInContinueAs;
|
|
3284
|
-
/** A plain-language message shown as a danger banner above the sign-in
|
|
3285
|
-
* button, e.g. after a failed silent resume. Omit for no banner. */
|
|
3286
|
-
error?: string;
|
|
3287
3267
|
}
|
|
3288
|
-
declare function
|
|
3268
|
+
declare function SessionScreen({ kind, error, onRetry, productName }: SessionScreenProps): React.JSX.Element;
|
|
3289
3269
|
|
|
3290
3270
|
interface RoadmapTimelineProps {
|
|
3291
3271
|
/** Called with a flag key when the reader clicks one — route it to your flag admin. */
|
|
@@ -5070,4 +5050,4 @@ declare function CornerStackPortal({ slot, children }: {
|
|
|
5070
5050
|
children?: React.ReactNode;
|
|
5071
5051
|
}): React.ReactPortal | null;
|
|
5072
5052
|
|
|
5073
|
-
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, COPIED_FEEDBACK_MS, 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, CodeEditor, type CodeEditorDiagnostic, type CodeEditorProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, CornerStackPortal, type CornerStackSlot, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DEFAULT_TOAST_DURATION_MS, 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, LAYER_STEP, 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, OVERLAY_CEILING, 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, ROOT_STEP, 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,
|
|
5053
|
+
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, COPIED_FEEDBACK_MS, 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, CodeEditor, type CodeEditorDiagnostic, type CodeEditorProps, Collapsible, type CollapsibleProps, ComingSoon, type ComingSoonProps, type ContextUsage, CornerStackPortal, type CornerStackSlot, type CreateVersionStoreOptions, CsiBadge, type CsiBadgeProps, CsiHero, type CsiHeroProps, CsiMeter, type CsiMeterProps, DEFAULT_PREFS, DEFAULT_STORAGE_KEY, DEFAULT_TOAST_DURATION_MS, 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, LAYER_STEP, 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, OVERLAY_CEILING, 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, ROOT_STEP, 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, SessionScreen, type SessionScreenKind, type SessionScreenProps, type SessionStats, type SessionUser, 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, 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 ToastApi, type ToastOptions, type ToastProps, ToastProvider, 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, __resetLayerStackForTests, acceptMatches, anyOfFilter, applyPrefs, channelWeightOf, computeNeedMore, computeVirtualWindow, copyToClipboard, 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, useCopyToClipboard, useCornerStackSlot, useDocumentTitle, useFeatureStatus, useLayerZIndex, usePopoverPosition, useResponsiveRail, useRuntimeMode, useServerTable, useSessionContext, useStackedLayer, useStagedFiles, useToast, validateFilterValue, visibleMessages };
|
package/dist/index.js
CHANGED
|
@@ -2779,19 +2779,6 @@ function FunnelChart({
|
|
|
2779
2779
|
const color = chartColor(i);
|
|
2780
2780
|
const detail = `${s.label} \u2014 ${valueFormat(value)} \xB7 ${formatPercent(Math.round(pctFirst))} of ${steps[0]?.label || "first step"}` + (stepRate != null ? ` \xB7 ${formatPercent(Math.round(stepRate))} of ${steps[i - 1].label}` : "");
|
|
2781
2781
|
return /* @__PURE__ */ jsx40("li", { className: "fd-funnel-row", children: /* @__PURE__ */ jsx40(Tooltip, { label: detail, children: /* @__PURE__ */ jsxs32("button", { type: "button", className: "fd-funnel-btn", children: [
|
|
2782
|
-
/* @__PURE__ */ jsx40("span", { className: "fd-funnel-shape-wrap", style: { height: barHeight }, children: /* @__PURE__ */ jsx40(
|
|
2783
|
-
"span",
|
|
2784
|
-
{
|
|
2785
|
-
className: "fd-funnel-shape",
|
|
2786
|
-
role: "img",
|
|
2787
|
-
"aria-label": detail,
|
|
2788
|
-
style: {
|
|
2789
|
-
width: widthPct + "%",
|
|
2790
|
-
background: color,
|
|
2791
|
-
clipPath: `polygon(${insetTop}% 0, ${100 - insetTop}% 0, ${100 - insetBottom}% 100%, ${insetBottom}% 100%)`
|
|
2792
|
-
}
|
|
2793
|
-
}
|
|
2794
|
-
) }),
|
|
2795
2782
|
/* @__PURE__ */ jsxs32("span", { className: "fd-funnel-meta", children: [
|
|
2796
2783
|
/* @__PURE__ */ jsx40("span", { className: "fd-funnel-label", title: truncationTitle(s.label), children: s.label }),
|
|
2797
2784
|
/* @__PURE__ */ jsx40("span", { className: "fd-funnel-value fd-tabular", children: valueFormat(value) }),
|
|
@@ -2805,7 +2792,20 @@ function FunnelChart({
|
|
|
2805
2792
|
" of first"
|
|
2806
2793
|
] })
|
|
2807
2794
|
] })
|
|
2808
|
-
] })
|
|
2795
|
+
] }),
|
|
2796
|
+
/* @__PURE__ */ jsx40("span", { className: "fd-funnel-shape-wrap", style: { height: barHeight }, children: /* @__PURE__ */ jsx40(
|
|
2797
|
+
"span",
|
|
2798
|
+
{
|
|
2799
|
+
className: "fd-funnel-shape",
|
|
2800
|
+
role: "img",
|
|
2801
|
+
"aria-label": detail,
|
|
2802
|
+
style: {
|
|
2803
|
+
width: widthPct + "%",
|
|
2804
|
+
background: color,
|
|
2805
|
+
clipPath: `polygon(${insetTop}% 0, ${100 - insetTop}% 0, ${100 - insetBottom}% 100%, ${insetBottom}% 100%)`
|
|
2806
|
+
}
|
|
2807
|
+
}
|
|
2808
|
+
) })
|
|
2809
2809
|
] }) }) }, s.id);
|
|
2810
2810
|
}) }),
|
|
2811
2811
|
/* @__PURE__ */ jsx40(
|
|
@@ -8548,197 +8548,47 @@ function ProfilePage({
|
|
|
8548
8548
|
] });
|
|
8549
8549
|
}
|
|
8550
8550
|
|
|
8551
|
-
// src/components/platform/
|
|
8551
|
+
// src/components/platform/SessionScreen.tsx
|
|
8552
8552
|
import * as React55 from "react";
|
|
8553
8553
|
import { Fragment as Fragment19, jsx as jsx80, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
8554
|
-
|
|
8555
|
-
|
|
8556
|
-
|
|
8557
|
-
|
|
8558
|
-
|
|
8559
|
-
|
|
8560
|
-
}
|
|
8561
|
-
|
|
8562
|
-
|
|
8563
|
-
|
|
8564
|
-
|
|
8565
|
-
|
|
8566
|
-
|
|
8567
|
-
|
|
8568
|
-
|
|
8569
|
-
|
|
8570
|
-
|
|
8571
|
-
|
|
8572
|
-
|
|
8573
|
-
|
|
8574
|
-
|
|
8575
|
-
|
|
8576
|
-
|
|
8577
|
-
|
|
8578
|
-
|
|
8579
|
-
|
|
8580
|
-
|
|
8581
|
-
|
|
8582
|
-
|
|
8583
|
-
|
|
8584
|
-
|
|
8585
|
-
|
|
8586
|
-
|
|
8587
|
-
|
|
8588
|
-
|
|
8589
|
-
|
|
8590
|
-
|
|
8591
|
-
|
|
8592
|
-
/* @__PURE__ */ jsxs71(
|
|
8593
|
-
"div",
|
|
8594
|
-
{
|
|
8595
|
-
style: {
|
|
8596
|
-
position: "relative",
|
|
8597
|
-
width: "100%",
|
|
8598
|
-
maxWidth: 408,
|
|
8599
|
-
display: "flex",
|
|
8600
|
-
flexDirection: "column",
|
|
8601
|
-
alignItems: "center"
|
|
8602
|
-
},
|
|
8603
|
-
children: [
|
|
8604
|
-
/* @__PURE__ */ jsx80("div", { style: { marginBottom: "var(--s-32)" }, "data-theme": "dark", children: /* @__PURE__ */ jsx80(FlytedeskMark, { size: "lg" }) }),
|
|
8605
|
-
/* @__PURE__ */ jsxs71(
|
|
8606
|
-
"div",
|
|
8607
|
-
{
|
|
8608
|
-
style: {
|
|
8609
|
-
width: "100%",
|
|
8610
|
-
borderRadius: "var(--r-2xl)",
|
|
8611
|
-
overflow: "hidden",
|
|
8612
|
-
boxShadow: "0 24px 64px -12px rgba(2, 8, 20, 0.55), 0 2px 8px rgba(2, 8, 20, 0.3)"
|
|
8613
|
-
},
|
|
8614
|
-
children: [
|
|
8615
|
-
/* @__PURE__ */ jsx80(
|
|
8616
|
-
"div",
|
|
8617
|
-
{
|
|
8618
|
-
style: {
|
|
8619
|
-
height: 4,
|
|
8620
|
-
background: "linear-gradient(90deg, var(--blue-400), var(--blue-600), var(--navy))"
|
|
8621
|
-
}
|
|
8622
|
-
}
|
|
8623
|
-
),
|
|
8624
|
-
/* @__PURE__ */ jsx80(Card, { children: /* @__PURE__ */ jsxs71(
|
|
8625
|
-
"div",
|
|
8626
|
-
{
|
|
8627
|
-
style: {
|
|
8628
|
-
display: "flex",
|
|
8629
|
-
flexDirection: "column",
|
|
8630
|
-
gap: "var(--s-20)",
|
|
8631
|
-
alignItems: "center",
|
|
8632
|
-
textAlign: "center",
|
|
8633
|
-
padding: "var(--s-8) 0"
|
|
8634
|
-
},
|
|
8635
|
-
children: [
|
|
8636
|
-
/* @__PURE__ */ jsxs71("div", { children: [
|
|
8637
|
-
/* @__PURE__ */ jsx80("h1", { className: "fd-h3", style: { color: "var(--navy)" }, children: productName }),
|
|
8638
|
-
/* @__PURE__ */ jsx80("p", { className: "fd-body-sm fd-muted", style: { marginTop: "var(--s-4)" }, children: continueAs ? "Your session timed out, but you're likely still signed in" : "Sign in with your flytedesk workspace account" })
|
|
8639
|
-
] }),
|
|
8640
|
-
error ? /* @__PURE__ */ jsx80("div", { role: "alert", style: { width: "100%" }, children: /* @__PURE__ */ jsx80(Banner, { tone: "danger", title: error }) }) : null,
|
|
8641
|
-
continueAs ? /* @__PURE__ */ jsxs71(Fragment19, { children: [
|
|
8642
|
-
/* @__PURE__ */ jsx80(
|
|
8643
|
-
Button,
|
|
8644
|
-
{
|
|
8645
|
-
variant: "primary",
|
|
8646
|
-
style: { width: "100%" },
|
|
8647
|
-
loading: resuming,
|
|
8648
|
-
disabled: resuming,
|
|
8649
|
-
onClick: handleContinue,
|
|
8650
|
-
children: resuming ? "Resuming\u2026" : `Continue as ${continueAs.name}`
|
|
8651
|
-
}
|
|
8652
|
-
),
|
|
8653
|
-
/* @__PURE__ */ jsx80(
|
|
8654
|
-
"button",
|
|
8655
|
-
{
|
|
8656
|
-
type: "button",
|
|
8657
|
-
className: "fd-body-sm fd-muted",
|
|
8658
|
-
style: {
|
|
8659
|
-
background: "none",
|
|
8660
|
-
border: "none",
|
|
8661
|
-
cursor: "pointer",
|
|
8662
|
-
textDecoration: "underline",
|
|
8663
|
-
padding: 0
|
|
8664
|
-
},
|
|
8665
|
-
disabled: resuming,
|
|
8666
|
-
onClick: continueAs.onDecline,
|
|
8667
|
-
children: "Not you? Sign in with flytedesk ID"
|
|
8668
|
-
}
|
|
8669
|
-
)
|
|
8670
|
-
] }) : /* @__PURE__ */ jsx80(
|
|
8671
|
-
Button,
|
|
8672
|
-
{
|
|
8673
|
-
variant: "primary",
|
|
8674
|
-
style: { width: "100%" },
|
|
8675
|
-
loading: signingIn,
|
|
8676
|
-
disabled: signingIn,
|
|
8677
|
-
onClick: handleSignIn,
|
|
8678
|
-
children: /* @__PURE__ */ jsxs71(
|
|
8679
|
-
"span",
|
|
8680
|
-
{
|
|
8681
|
-
style: {
|
|
8682
|
-
display: "flex",
|
|
8683
|
-
flexDirection: "row",
|
|
8684
|
-
alignItems: "center",
|
|
8685
|
-
justifyContent: "center",
|
|
8686
|
-
gap: "var(--s-8)",
|
|
8687
|
-
flexWrap: "nowrap"
|
|
8688
|
-
},
|
|
8689
|
-
children: [
|
|
8690
|
-
/* @__PURE__ */ jsx80(GoogleGlyph, {}),
|
|
8691
|
-
/* @__PURE__ */ jsx80("span", { children: signingIn ? "Signing in\u2026" : "Sign in with flytedesk ID" })
|
|
8692
|
-
]
|
|
8693
|
-
}
|
|
8694
|
-
)
|
|
8695
|
-
}
|
|
8696
|
-
),
|
|
8697
|
-
/* @__PURE__ */ jsx80("p", { className: "fd-body-sm fd-muted", style: { fontSize: "12px" }, children: "One account, every flytedesk app." })
|
|
8698
|
-
]
|
|
8699
|
-
}
|
|
8700
|
-
) })
|
|
8701
|
-
]
|
|
8702
|
-
}
|
|
8703
|
-
)
|
|
8704
|
-
]
|
|
8705
|
-
}
|
|
8706
|
-
)
|
|
8707
|
-
]
|
|
8708
|
-
}
|
|
8709
|
-
);
|
|
8710
|
-
}
|
|
8711
|
-
function GoogleGlyph() {
|
|
8712
|
-
return /* @__PURE__ */ jsxs71("svg", { width: "18", height: "18", viewBox: "0 0 18 18", "aria-hidden": true, children: [
|
|
8713
|
-
/* @__PURE__ */ jsx80(
|
|
8714
|
-
"path",
|
|
8715
|
-
{
|
|
8716
|
-
fill: "#4285F4",
|
|
8717
|
-
d: "M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.87 2.68-6.62Z"
|
|
8718
|
-
}
|
|
8719
|
-
),
|
|
8720
|
-
/* @__PURE__ */ jsx80(
|
|
8721
|
-
"path",
|
|
8722
|
-
{
|
|
8723
|
-
fill: "#34A853",
|
|
8724
|
-
d: "M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.81.54-1.84.87-3.04.87-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18Z"
|
|
8725
|
-
}
|
|
8726
|
-
),
|
|
8727
|
-
/* @__PURE__ */ jsx80(
|
|
8728
|
-
"path",
|
|
8729
|
-
{
|
|
8730
|
-
fill: "#FBBC05",
|
|
8731
|
-
d: "M3.97 10.73A5.4 5.4 0 0 1 3.68 9c0-.6.1-1.19.29-1.73V4.94H.96A9 9 0 0 0 0 9c0 1.45.35 2.83.96 4.06l3.01-2.33Z"
|
|
8732
|
-
}
|
|
8733
|
-
),
|
|
8734
|
-
/* @__PURE__ */ jsx80(
|
|
8735
|
-
"path",
|
|
8736
|
-
{
|
|
8737
|
-
fill: "#EA4335",
|
|
8738
|
-
d: "M9 3.58c1.32 0 2.51.45 3.44 1.35l2.59-2.59C13.46.89 11.43 0 9 0A9 9 0 0 0 .96 4.94l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58Z"
|
|
8739
|
-
}
|
|
8740
|
-
)
|
|
8741
|
-
] });
|
|
8554
|
+
var COPY = {
|
|
8555
|
+
"signing-in": { busy: "Signing you in\u2026" },
|
|
8556
|
+
"session-expired": { busy: "Your session expired \u2014 signing you back in\u2026" },
|
|
8557
|
+
"signing-out": { busy: "Signing you out\u2026" },
|
|
8558
|
+
reconnecting: { busy: "Reconnecting\u2026" },
|
|
8559
|
+
"sign-in-failed": { failure: "We couldn't sign you in" },
|
|
8560
|
+
"load-failed": { failure: "We couldn't load your session" }
|
|
8561
|
+
};
|
|
8562
|
+
function SessionScreen({ kind, error, onRetry, productName }) {
|
|
8563
|
+
const copy = COPY[kind];
|
|
8564
|
+
const busyMessage = "busy" in copy ? copy.busy : null;
|
|
8565
|
+
const failureTitle = "failure" in copy ? copy.failure : null;
|
|
8566
|
+
const [announced, setAnnounced] = React55.useState("");
|
|
8567
|
+
React55.useEffect(() => {
|
|
8568
|
+
setAnnounced(busyMessage ?? "");
|
|
8569
|
+
}, [busyMessage]);
|
|
8570
|
+
const titleRef = React55.useRef(null);
|
|
8571
|
+
const failed = failureTitle !== null;
|
|
8572
|
+
React55.useEffect(() => {
|
|
8573
|
+
titleRef.current?.focus({ preventScroll: true });
|
|
8574
|
+
}, [failed]);
|
|
8575
|
+
return /* @__PURE__ */ jsx80("main", { className: "fd-session-screen", children: /* @__PURE__ */ jsxs71("div", { className: "fd-session-screen-inner", children: [
|
|
8576
|
+
/* @__PURE__ */ jsx80("div", { className: "fd-session-screen-mark", "data-theme": "dark", children: /* @__PURE__ */ jsx80(FlytedeskMark, { size: "lg" }) }),
|
|
8577
|
+
/* @__PURE__ */ jsxs71("div", { className: "fd-session-screen-frame", children: [
|
|
8578
|
+
/* @__PURE__ */ jsx80("div", { className: "fd-session-screen-stripe" }),
|
|
8579
|
+
/* @__PURE__ */ jsx80(Card, { children: /* @__PURE__ */ jsxs71("div", { className: "fd-session-screen-body", children: [
|
|
8580
|
+
/* @__PURE__ */ jsx80("h1", { ref: titleRef, tabIndex: -1, className: "fd-h3 fd-session-screen-title", children: productName }),
|
|
8581
|
+
/* @__PURE__ */ jsx80("div", { role: "status", "aria-live": "polite", className: "fd-session-screen-status", children: busyMessage !== null ? /* @__PURE__ */ jsxs71(Fragment19, { children: [
|
|
8582
|
+
/* @__PURE__ */ jsx80("span", { className: "fd-spinner fd-spinner-lg fd-session-screen-spinner", "aria-hidden": "true" }),
|
|
8583
|
+
/* @__PURE__ */ jsx80("p", { className: "fd-body fd-session-screen-message", children: announced })
|
|
8584
|
+
] }) : null }),
|
|
8585
|
+
failureTitle !== null ? /* @__PURE__ */ jsxs71("div", { className: "fd-session-screen-failure", children: [
|
|
8586
|
+
/* @__PURE__ */ jsx80(Banner, { tone: "danger", title: failureTitle, detail: error ?? void 0 }),
|
|
8587
|
+
onRetry !== null ? /* @__PURE__ */ jsx80(Button, { variant: "primary", block: true, onClick: onRetry, children: "Try again" }) : null
|
|
8588
|
+
] }) : null
|
|
8589
|
+
] }) })
|
|
8590
|
+
] })
|
|
8591
|
+
] }) });
|
|
8742
8592
|
}
|
|
8743
8593
|
|
|
8744
8594
|
// src/components/platform/RoadmapTimeline.tsx
|
|
@@ -14607,8 +14457,8 @@ export {
|
|
|
14607
14457
|
Select,
|
|
14608
14458
|
SessionKit,
|
|
14609
14459
|
SessionProvider,
|
|
14460
|
+
SessionScreen,
|
|
14610
14461
|
SidebarNav,
|
|
14611
|
-
SignInPage,
|
|
14612
14462
|
Skeleton,
|
|
14613
14463
|
SkeletonText,
|
|
14614
14464
|
Slider,
|