@assure-one/design-system 1.12.0 → 1.14.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.ts CHANGED
@@ -2313,22 +2313,45 @@ interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
2313
2313
  }
2314
2314
  declare const Textarea: React$1.ForwardRefExoticComponent<TextareaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
2315
2315
 
2316
- type ToastVariant = "default" | "success" | "destructive" | "warning";
2316
+ type ToastVariant = "default" | "success" | "destructive" | "warning" | "info" | "loading";
2317
2317
  interface ToastAction {
2318
2318
  label: string;
2319
2319
  onClick: () => void;
2320
2320
  }
2321
- interface Toast {
2322
- id: string;
2323
- title: string;
2324
- description?: string;
2321
+ /** Options accepted by `toast()` and (partially) by `update()`. */
2322
+ interface ToastOptions {
2323
+ title?: React.ReactNode;
2324
+ description?: React.ReactNode;
2325
2325
  variant?: ToastVariant;
2326
+ /** Auto-dismiss after N ms. `0` = sticky. `loading` defaults to sticky. */
2326
2327
  duration?: number;
2327
2328
  action?: ToastAction;
2329
+ /**
2330
+ * Rich-variant escape hatch. When provided, the toast renders `content`
2331
+ * inside its surface instead of the title/chip/countdown layout — the
2332
+ * content owns its own structure and dismissal. Pass a render function to
2333
+ * receive `close` (e.g. a review queue that dismisses itself once empty).
2334
+ * Rich-content toasts are sticky by default (no auto-dismiss countdown).
2335
+ */
2336
+ content?: React.ReactNode | ((close: () => void) => React.ReactNode);
2337
+ /**
2338
+ * When set, a new toast with the same key updates the existing one in place
2339
+ * instead of stacking a duplicate (e.g. repeated "Saving…" feedback).
2340
+ */
2341
+ dedupeKey?: string;
2328
2342
  }
2343
+ /** Per-state copy for `promise()` — a string title, full options, or a
2344
+ * builder that receives the resolved value / thrown error. */
2345
+ type PromiseToast<T> = string | ToastOptions | ((arg: T) => string | ToastOptions);
2329
2346
  interface ToastContextValue {
2330
- toast: (options: Omit<Toast, "id">) => string;
2347
+ toast: (options: ToastOptions) => string;
2331
2348
  dismiss: (id?: string) => void;
2349
+ update: (id: string, patch: Partial<ToastOptions>) => void;
2350
+ promise: <T>(promise: Promise<T>, copy: {
2351
+ loading: string | ToastOptions;
2352
+ success: PromiseToast<T>;
2353
+ error: PromiseToast<unknown>;
2354
+ }) => Promise<T>;
2332
2355
  }
2333
2356
  declare function useToast(): ToastContextValue;
2334
2357
  interface ToastProviderProps {
@@ -5040,4 +5063,4 @@ declare namespace SignatureEditor {
5040
5063
 
5041
5064
  declare function cn(...inputs: ClassValue[]): string;
5042
5065
 
5043
- export { AIReceiptPanel, type AIReceiptPanelProps, type AIReceiptResult, Accordion, AccordionContent, AccordionItem, AccordionTrigger, type ActivityDotVariant, ActivityEventItem, type ActivityEventItemProps, ActivityItem, type ActivityItemProps, ActivityList, type ActivityListProps, type AgreementFirm, AgreementPaneHeading, type AgreementPaneHeadingProps, type AgreementStatus, type AgreementStep, AgreementViewer, type AgreementViewerProps, AiDraftCard, type AiDraftCardProps, type AiDraftState, Alert, AlertCircleIcon, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, AlertTriangleIcon, AlertTriangleSolidIcon, AppHeader, AppHeaderActions, type AppHeaderActionsProps, AppHeaderBreadcrumb, type AppHeaderBreadcrumbProps, type AppHeaderProps, AppHeaderSearch, type AppHeaderSearchProps, AppHeaderTitle, type AppHeaderTitleProps, AreaChart, type AreaChartProps, type AreaPoint, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, AspectRatio, Assignee, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, AtSignIcon, AttachmentChip, type AttachmentChipProps, AttentionItem, type AttentionItemProps, type AttentionUrgency, Avatar, Badge, type BadgeProps, BarChartIcon, BellIcon, Blockquote, BoldIcon, BottomNav, type BottomNavProps, type BottomNavTab, type BrandIconProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, BriefcaseIcon, Building2Icon, BuildingIcon, BulkActionBar, BulkActionBarAction, type BulkActionBarActionProps, type BulkActionBarProps, BulkActionBarSeparator, type BulkActionBarVariant, Button, type ButtonProps, COUNTRY_CODES, Calendar, type CalendarHighlight, type CalendarHighlightColor, CalendarIcon, type CalendarProps, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type CardVariants, CategoryDivider, type CategoryDividerProps, CategoryTag, type CategoryTagProps, type CategoryTone, type CellValue, type ChannelTabItem, ChannelTabs, type ChannelTabsProps, type ChannelTone, ChatBubbleIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClientRailGroupHeader, type ClientRailGroupHeaderProps, ClientRailItem, type ClientRailItemProps, ClientSelect, type ClientSelectOption, ClipboardCheckIcon, ClockIcon, CloseIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, ComingSoon, type ComingSoonProps, CommandIcon, type CommandItem, CommandPalette, ConfirmActionButton, type ConfirmActionButtonProps, Content, type ContentProps, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CopyIcon, CornerDownLeftIcon, type CountryCode, CountryFlag, CountrySelect, CreditCardIcon, DATE_DISPLAY_PLACEHOLDER, DangerAction, type DangerActionProps, Dash, DashGrid, type DashGridProps, type DashWidget, DataItem, DataTable, DataTableBody, type DataTableBodyProps, DataTableCell, DataTableCellDue, type DataTableCellDueProps, DataTableCellId, DataTableCellMono, DataTableCellName, type DataTableCellProps, DataTableCheckbox, type DataTableCheckboxProps, DataTableHead, type DataTableHeadProps, DataTableHeader, type DataTableHeaderProps, DataTablePagination, type DataTablePaginationProps, type DataTableProps, DataTableResultsCount, type DataTableResultsCountProps, DataTableRow, type DataTableRowProps, DataTableSearch, type DataTableSearchProps, DataTableSpacer, type DataTableSpacerProps, DataTableToolbar, type DataTableToolbarProps, DataTableView, type DataTableViewColumn, type DataTableViewFilter, type DataTableViewProps, DatePicker, DateRangePicker, type DateRangeValue, DetailGrid, type DetailGridProps, DetailMain, type DetailMainProps, DetailSpine, DetailSpineHeader, type DetailSpineHeaderProps, type DetailSpineProps, DetailSpineSection, type DetailSpineSectionProps, DetailSpineStats, type DetailSpineStatsProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DocumentDetailActions, type DocumentDetailActionsProps, DocumentDetailBody, type DocumentDetailBodyProps, DocumentDetailHeader, type DocumentDetailHeaderProps, DocumentDetailMetaRow, type DocumentDetailMetaRowProps, DocumentDetailPanel, type DocumentDetailPanelProps, DocumentDetailRequester, type DocumentDetailRequesterProps, DocumentDetailTitle, type DocumentDetailTitleProps, DocumentFileCard, type DocumentFileCardProps, DocumentFileRow, type DocumentFileRowProps, DocumentIcon, type DocumentItemState, DocumentList, type DocumentListProps, DocumentListSection, type DocumentListSectionProps, type DocumentRequestActivityKind, type DocumentRequestAssigneeOption, DocumentRequestCard, type DocumentRequestCardProps, DocumentRequestDetail, type DocumentRequestDetailActivityEvent, type DocumentRequestDetailComment, type DocumentRequestDetailDoc, type DocumentRequestDetailProps, type DocumentRequestDetailTab, DocumentRequestField, type DocumentRequestFieldProps, type DocumentRequestItemSummary, type DocumentRequestReviewStatusOption, type DocumentRequestTone, DocumentRow, type DocumentRowProps, type DocumentSource, DocumentSourceFilter, type DocumentSourceFilterProps, type DocumentSourceFilterValue, DocumentSourceTag, type DocumentSourceTagProps, DocumentsWorkspaceLayout, type DocumentsWorkspaceLayoutProps, DollarSignIcon, DonutChart, type DonutChartProps, type DonutSegment, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmailMessageCard, type EmailMessageCardProps, EmptyState, type EmptyStateProps, EngagementCard, type EngagementCardProps, EngagementTimeline, type EngagementTimelineProps, EngagementTimelineStep, type EngagementTimelineStepProps, ExtractIcon, EyeIcon, EyeOffIcon, Eyebrow, type EyebrowProps, FileChip, type FileChipProps, FileIcon, type FileKind, FileReturnIcon, FileTextIcon, FileTypeBadge, type FileTypeBadgeProps, type FileTypeTone, FileUpload, FilterChip, type FilterChipProps, FilterIcon, FlagIcon, FolderClosedIcon, type FolderNode, FolderOpenIcon, FolderPlusIcon, FolderTree, type FolderTreeProps, FolderUpIcon, FormError, FormSection, FormSuccess, GlobeIcon, GoogleBrandIcon, HelpCircleIcon, HistoryIcon, HomeIcon, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, IconAction, type IconActionProps, IconTile, type IconTileProps, InboxIcon, InfoCircleSolidIcon, InfoIcon, Input, type InputVariants, IntentBadge, type IntentBadgeProps, type IntentTone, ItalicIcon, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, KanbanIcon, type KanbanProps, KbdHint, type KbdHintProps, KeyIcon, type KeyboardShortcut, type KeyboardShortcutSection, KeyboardShortcutsDialog, type KeyboardShortcutsDialogProps, KpiCard, type KpiCardProps, type KpiDelta, Label, LandmarkIcon, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkAction, type LinkActionProps, LinkButton, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LoadingRows, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, Logo, MailIcon, Main, type MainProps, MapPinIcon, MasterDetailLayout, type MasterDetailLayoutProps, MenuIcon, MessageBubble, MessageBubbleAction, type MessageBubbleActionProps, type MessageBubbleProps, MessageBubbleTombstone, type MessageBubbleTombstoneProps, MessageCircleIcon, MessageCircleWarningIcon, MessageComposer, type MessageComposerProps, MetadataGrid, MicrosoftBrandIcon, MinusIcon, type MissingDocumentItem, MissingDocumentsPanel, type MissingDocumentsPanelProps, MoneyCell, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoveIcon, MultiFilterPill, MultiSelectField, MutedSpec, type MutedSpecProps, NewMenu, type NewMenuAction, type NewMenuGroup, type NewMenuProps, NotificationFilter, type NotificationFilterProps, type NotificationFilterValue, NotificationItem, type NotificationItemProps, NotificationList, type NotificationListProps, NotificationPanel, NotificationPanelFooter, type NotificationPanelFooterProps, NotificationPanelHeader, type NotificationPanelHeaderProps, type NotificationPanelProps, Numeric, type NumericProps, OTPInput, PageHeader, type PageHeaderProps, PageHeaderSep, type PageHeaderSepProps, PageHeaderSpec, type PageHeaderSpecProps, Pagination, type PaginationProps, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PaperclipIcon, PauseIcon, PdfPreview, type PdfPreviewProps, PenSignIcon, PenToolIcon, PencilIcon, PhoneCountryInput, PhoneIcon, PhoneInput, type PillStatus, PlayIcon, PlusIcon, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, PrimaryAction, type PrimaryActionProps, type Priority, PriorityIcon, type PriorityIconProps, ProgressBar, type ProgressBarProps, ProgressRing, type ProgressRingProps, ProposalAddOn, type ProposalAddOnProps, type ProposalBillingMode, type ProposalBillingRow, ProposalBillingTerms, type ProposalBillingTermsProps, ProposalConsentGate, type ProposalConsentGateProps, ProposalCustomPage, type ProposalCustomPageKind, type ProposalCustomPageProps, ProposalNote, type ProposalNoteProps, ProposalPackageCard, type ProposalPackageCardProps, type ProposalPackageMode, ProposalPaymentCapture, type ProposalPaymentCaptureProps, ProposalPricingSummary, type ProposalPricingSummaryProps, ProposalServiceRow, type ProposalServiceRowProps, ProposalSignatureBlock, type ProposalSignatureBlockProps, type ProposalSigner, ProposalSignerList, type ProposalSignerListProps, type ProposalSignerStatus, type QuickReplyChip, RadioGroup, RadioGroupItem, type RankedBar, RankedBars, type RankedBarsProps, ReceiptIcon, ReplyIcon, ResponsiveDialog, type ResponsiveDialogProps, RotateCcwIcon, RouteTransition, type RouteTransitionProps, SERVICE_TONES, SaveIcon, ScrollArea, ScrollBar, SearchIcon, SearchInput, type SearchInputVariants, SearchSelect, type SearchSelectOption, SecondaryAction, type SecondaryActionProps, Section, SectionHead, SectionHeader, SegmentedProgress, type SegmentedProgressProps, type SegmentedTone, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SelectableKpiCard, type SelectableKpiCardProps, SendIcon, Separator, type ServiceTone, SettingsIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Shell, type ShellProps, ShieldIcon, SideDrawer, Sidebar, SidebarBrand, type SidebarBrandProps, SidebarBrandSwitcher, type SidebarBrandSwitcherItem, type SidebarBrandSwitcherProps, SidebarBrandSwitcherTile, SidebarBrandText, type SidebarBrandTextProps, SidebarFooter, type SidebarFooterProps, SidebarLink, SidebarLinkAction, type SidebarLinkActionProps, SidebarLinkBadge, type SidebarLinkBadgeProps, type SidebarLinkBadgeVariants, SidebarLinkGroup, type SidebarLinkGroupProps, SidebarLinkLabel, type SidebarLinkLabelProps, type SidebarLinkProps, SidebarPinButton, type SidebarPinButtonProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarSection, type SidebarSectionProps, type SidebarState, SidebarTrigger, type SidebarTriggerProps, SidebarUser, type SidebarUserProps, SignatureEditor, type SignatureEditorProps, Skeleton, SkeletonCircle, SkeletonText, SlashIcon, Slider, SmartphoneIcon, type SortDirection, SparkleIcon, SparklesIcon, Spinner, type SpinnerProps, SpreadsheetPreview, type SpreadsheetPreviewProps, StackedBarChart, type StackedBarChartProps, type StackedBarDatum, type StackedBarSeries, StagePill, StarIcon, StarRating, type StarRatingProps, Stat, StatusDot, type StatusDotProps, StatusIcon, type StatusIconProps, StatusPill, type StatusPillProps, type StatusState, type Step, Stepper, type StepperProps, StickyActionBar, type StickyActionBarProps, StopIcon, StrikethroughIcon, SubmitButton, SuggestionPills, type SuggestionPillsProps, SuiteProgress, type SuiteProgressProps, type SuiteProgressSize, type SuiteProgressTone, SunIcon, Switch, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableIcon, type TableProps, TableRow, type TableRowData, type TableRowProps, type TableTone, Tabs, TabsContent, TabsList, TabsTrigger, TagIcon, TagsCell, TeamIcon, TeamMemberSelect, Textarea, type TextareaVariants, TimeLogger, TimeLoggerActions, type TimeLoggerActionsProps, TimeLoggerBillable, type TimeLoggerBillableProps, TimeLoggerContextRow, type TimeLoggerContextRowProps, TimeLoggerEntry, TimeLoggerEntryList, type TimeLoggerEntryListProps, type TimeLoggerEntryProps, TimeLoggerField, type TimeLoggerFieldProps, TimeLoggerFooter, type TimeLoggerFooterProps, TimeLoggerHeader, type TimeLoggerHeaderProps, TimeLoggerNotes, type TimeLoggerNotesProps, type TimeLoggerPhase, type TimeLoggerProps, type TimeLoggerTier, TimeLoggerTimer, type TimeLoggerTimerProps, type TimelineState, ToastProvider, ToggleGroup, ToggleGroupItem, Toolbar, type ToolbarProps, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Trash2Icon, TrashIcon, TrendingDownIcon, TrendingUpIcon, UnderlineIcon, UploadIcon, type UseStopwatchReturn, UserCircleIcon, UserIcon, UsersIcon, VisuallyHidden, WorkflowIcon, XCircleSolidIcon, XIcon, YEAR_DISPLAY_PLACEHOLDER, ZoomInIcon, ZoomOutIcon, alertVariants, applyMask, applyYearMask, attachmentChipVariants, badgeVariants, buttonVariants, cardVariants, cn, dateToIso, displayToIso, fileTypeBadgeVariants, fileTypeFromName, filterChipVariants, formatClock, formatCurrency, formatDuration, getFlagEmoji, iconTileVariants, inputVariants, isoToDate, isoToDisplay, isoToYear, labelVariants, parseDuration, parsePhoneForEditing, progressBarVariants, progressRingVariants, searchInputVariants, serviceToneLabel, serviceToneStyle, sidebarLinkBadgeVariants, spinnerVariants, starRatingVariants, statusDotVariants, suiteProgressFillVariants, textareaVariants, useSidebarPeekLock, useSidebarState, useStopwatch, useToast, yearToIso };
5066
+ export { AIReceiptPanel, type AIReceiptPanelProps, type AIReceiptResult, Accordion, AccordionContent, AccordionItem, AccordionTrigger, type ActivityDotVariant, ActivityEventItem, type ActivityEventItemProps, ActivityItem, type ActivityItemProps, ActivityList, type ActivityListProps, type AgreementFirm, AgreementPaneHeading, type AgreementPaneHeadingProps, type AgreementStatus, type AgreementStep, AgreementViewer, type AgreementViewerProps, AiDraftCard, type AiDraftCardProps, type AiDraftState, Alert, AlertCircleIcon, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, AlertTriangleIcon, AlertTriangleSolidIcon, AppHeader, AppHeaderActions, type AppHeaderActionsProps, AppHeaderBreadcrumb, type AppHeaderBreadcrumbProps, type AppHeaderProps, AppHeaderSearch, type AppHeaderSearchProps, AppHeaderTitle, type AppHeaderTitleProps, AreaChart, type AreaChartProps, type AreaPoint, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, AspectRatio, Assignee, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, AtSignIcon, AttachmentChip, type AttachmentChipProps, AttentionItem, type AttentionItemProps, type AttentionUrgency, Avatar, Badge, type BadgeProps, BarChartIcon, BellIcon, Blockquote, BoldIcon, BottomNav, type BottomNavProps, type BottomNavTab, type BrandIconProps, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, BriefcaseIcon, Building2Icon, BuildingIcon, BulkActionBar, BulkActionBarAction, type BulkActionBarActionProps, type BulkActionBarProps, BulkActionBarSeparator, type BulkActionBarVariant, Button, type ButtonProps, COUNTRY_CODES, Calendar, type CalendarHighlight, type CalendarHighlightColor, CalendarIcon, type CalendarProps, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type CardVariants, CategoryDivider, type CategoryDividerProps, CategoryTag, type CategoryTagProps, type CategoryTone, type CellValue, type ChannelTabItem, ChannelTabs, type ChannelTabsProps, type ChannelTone, ChatBubbleIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClientRailGroupHeader, type ClientRailGroupHeaderProps, ClientRailItem, type ClientRailItemProps, ClientSelect, type ClientSelectOption, ClipboardCheckIcon, ClockIcon, CloseIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, ComingSoon, type ComingSoonProps, CommandIcon, type CommandItem, CommandPalette, ConfirmActionButton, type ConfirmActionButtonProps, Content, type ContentProps, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CopyIcon, CornerDownLeftIcon, type CountryCode, CountryFlag, CountrySelect, CreditCardIcon, DATE_DISPLAY_PLACEHOLDER, DangerAction, type DangerActionProps, Dash, DashGrid, type DashGridProps, type DashWidget, DataItem, DataTable, DataTableBody, type DataTableBodyProps, DataTableCell, DataTableCellDue, type DataTableCellDueProps, DataTableCellId, DataTableCellMono, DataTableCellName, type DataTableCellProps, DataTableCheckbox, type DataTableCheckboxProps, DataTableHead, type DataTableHeadProps, DataTableHeader, type DataTableHeaderProps, DataTablePagination, type DataTablePaginationProps, type DataTableProps, DataTableResultsCount, type DataTableResultsCountProps, DataTableRow, type DataTableRowProps, DataTableSearch, type DataTableSearchProps, DataTableSpacer, type DataTableSpacerProps, DataTableToolbar, type DataTableToolbarProps, DataTableView, type DataTableViewColumn, type DataTableViewFilter, type DataTableViewProps, DatePicker, DateRangePicker, type DateRangeValue, DetailGrid, type DetailGridProps, DetailMain, type DetailMainProps, DetailSpine, DetailSpineHeader, type DetailSpineHeaderProps, type DetailSpineProps, DetailSpineSection, type DetailSpineSectionProps, DetailSpineStats, type DetailSpineStatsProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DocumentDetailActions, type DocumentDetailActionsProps, DocumentDetailBody, type DocumentDetailBodyProps, DocumentDetailHeader, type DocumentDetailHeaderProps, DocumentDetailMetaRow, type DocumentDetailMetaRowProps, DocumentDetailPanel, type DocumentDetailPanelProps, DocumentDetailRequester, type DocumentDetailRequesterProps, DocumentDetailTitle, type DocumentDetailTitleProps, DocumentFileCard, type DocumentFileCardProps, DocumentFileRow, type DocumentFileRowProps, DocumentIcon, type DocumentItemState, DocumentList, type DocumentListProps, DocumentListSection, type DocumentListSectionProps, type DocumentRequestActivityKind, type DocumentRequestAssigneeOption, DocumentRequestCard, type DocumentRequestCardProps, DocumentRequestDetail, type DocumentRequestDetailActivityEvent, type DocumentRequestDetailComment, type DocumentRequestDetailDoc, type DocumentRequestDetailProps, type DocumentRequestDetailTab, DocumentRequestField, type DocumentRequestFieldProps, type DocumentRequestItemSummary, type DocumentRequestReviewStatusOption, type DocumentRequestTone, DocumentRow, type DocumentRowProps, type DocumentSource, DocumentSourceFilter, type DocumentSourceFilterProps, type DocumentSourceFilterValue, DocumentSourceTag, type DocumentSourceTagProps, DocumentsWorkspaceLayout, type DocumentsWorkspaceLayoutProps, DollarSignIcon, DonutChart, type DonutChartProps, type DonutSegment, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmailMessageCard, type EmailMessageCardProps, EmptyState, type EmptyStateProps, EngagementCard, type EngagementCardProps, EngagementTimeline, type EngagementTimelineProps, EngagementTimelineStep, type EngagementTimelineStepProps, ExtractIcon, EyeIcon, EyeOffIcon, Eyebrow, type EyebrowProps, FileChip, type FileChipProps, FileIcon, type FileKind, FileReturnIcon, FileTextIcon, FileTypeBadge, type FileTypeBadgeProps, type FileTypeTone, FileUpload, FilterChip, type FilterChipProps, FilterIcon, FlagIcon, FolderClosedIcon, type FolderNode, FolderOpenIcon, FolderPlusIcon, FolderTree, type FolderTreeProps, FolderUpIcon, FormError, FormSection, FormSuccess, GlobeIcon, GoogleBrandIcon, HelpCircleIcon, HistoryIcon, HomeIcon, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, IconAction, type IconActionProps, IconTile, type IconTileProps, InboxIcon, InfoCircleSolidIcon, InfoIcon, Input, type InputVariants, IntentBadge, type IntentBadgeProps, type IntentTone, ItalicIcon, Kanban, KanbanCard, type KanbanCardProps, KanbanColumn, type KanbanColumnProps, KanbanIcon, type KanbanProps, KbdHint, type KbdHintProps, KeyIcon, type KeyboardShortcut, type KeyboardShortcutSection, KeyboardShortcutsDialog, type KeyboardShortcutsDialogProps, KpiCard, type KpiCardProps, type KpiDelta, Label, LandmarkIcon, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkAction, type LinkActionProps, LinkButton, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LoadingRows, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, Logo, MailIcon, Main, type MainProps, MapPinIcon, MasterDetailLayout, type MasterDetailLayoutProps, MenuIcon, MessageBubble, MessageBubbleAction, type MessageBubbleActionProps, type MessageBubbleProps, MessageBubbleTombstone, type MessageBubbleTombstoneProps, MessageCircleIcon, MessageCircleWarningIcon, MessageComposer, type MessageComposerProps, MetadataGrid, MicrosoftBrandIcon, MinusIcon, type MissingDocumentItem, MissingDocumentsPanel, type MissingDocumentsPanelProps, MoneyCell, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoveIcon, MultiFilterPill, MultiSelectField, MutedSpec, type MutedSpecProps, NewMenu, type NewMenuAction, type NewMenuGroup, type NewMenuProps, NotificationFilter, type NotificationFilterProps, type NotificationFilterValue, NotificationItem, type NotificationItemProps, NotificationList, type NotificationListProps, NotificationPanel, NotificationPanelFooter, type NotificationPanelFooterProps, NotificationPanelHeader, type NotificationPanelHeaderProps, type NotificationPanelProps, Numeric, type NumericProps, OTPInput, PageHeader, type PageHeaderProps, PageHeaderSep, type PageHeaderSepProps, PageHeaderSpec, type PageHeaderSpecProps, Pagination, type PaginationProps, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PaperclipIcon, PauseIcon, PdfPreview, type PdfPreviewProps, PenSignIcon, PenToolIcon, PencilIcon, PhoneCountryInput, PhoneIcon, PhoneInput, type PillStatus, PlayIcon, PlusIcon, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, PrimaryAction, type PrimaryActionProps, type Priority, PriorityIcon, type PriorityIconProps, ProgressBar, type ProgressBarProps, ProgressRing, type ProgressRingProps, ProposalAddOn, type ProposalAddOnProps, type ProposalBillingMode, type ProposalBillingRow, ProposalBillingTerms, type ProposalBillingTermsProps, ProposalConsentGate, type ProposalConsentGateProps, ProposalCustomPage, type ProposalCustomPageKind, type ProposalCustomPageProps, ProposalNote, type ProposalNoteProps, ProposalPackageCard, type ProposalPackageCardProps, type ProposalPackageMode, ProposalPaymentCapture, type ProposalPaymentCaptureProps, ProposalPricingSummary, type ProposalPricingSummaryProps, ProposalServiceRow, type ProposalServiceRowProps, ProposalSignatureBlock, type ProposalSignatureBlockProps, type ProposalSigner, ProposalSignerList, type ProposalSignerListProps, type ProposalSignerStatus, type QuickReplyChip, RadioGroup, RadioGroupItem, type RankedBar, RankedBars, type RankedBarsProps, ReceiptIcon, ReplyIcon, ResponsiveDialog, type ResponsiveDialogProps, RotateCcwIcon, RouteTransition, type RouteTransitionProps, SERVICE_TONES, SaveIcon, ScrollArea, ScrollBar, SearchIcon, SearchInput, type SearchInputVariants, SearchSelect, type SearchSelectOption, SecondaryAction, type SecondaryActionProps, Section, SectionHead, SectionHeader, SegmentedProgress, type SegmentedProgressProps, type SegmentedTone, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SelectableKpiCard, type SelectableKpiCardProps, SendIcon, Separator, type ServiceTone, SettingsIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Shell, type ShellProps, ShieldIcon, SideDrawer, Sidebar, SidebarBrand, type SidebarBrandProps, SidebarBrandSwitcher, type SidebarBrandSwitcherItem, type SidebarBrandSwitcherProps, SidebarBrandSwitcherTile, SidebarBrandText, type SidebarBrandTextProps, SidebarFooter, type SidebarFooterProps, SidebarLink, SidebarLinkAction, type SidebarLinkActionProps, SidebarLinkBadge, type SidebarLinkBadgeProps, type SidebarLinkBadgeVariants, SidebarLinkGroup, type SidebarLinkGroupProps, SidebarLinkLabel, type SidebarLinkLabelProps, type SidebarLinkProps, SidebarPinButton, type SidebarPinButtonProps, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarSection, type SidebarSectionProps, type SidebarState, SidebarTrigger, type SidebarTriggerProps, SidebarUser, type SidebarUserProps, SignatureEditor, type SignatureEditorProps, Skeleton, SkeletonCircle, SkeletonText, SlashIcon, Slider, SmartphoneIcon, type SortDirection, SparkleIcon, SparklesIcon, Spinner, type SpinnerProps, SpreadsheetPreview, type SpreadsheetPreviewProps, StackedBarChart, type StackedBarChartProps, type StackedBarDatum, type StackedBarSeries, StagePill, StarIcon, StarRating, type StarRatingProps, Stat, StatusDot, type StatusDotProps, StatusIcon, type StatusIconProps, StatusPill, type StatusPillProps, type StatusState, type Step, Stepper, type StepperProps, StickyActionBar, type StickyActionBarProps, StopIcon, StrikethroughIcon, SubmitButton, SuggestionPills, type SuggestionPillsProps, SuiteProgress, type SuiteProgressProps, type SuiteProgressSize, type SuiteProgressTone, SunIcon, Switch, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableIcon, type TableProps, TableRow, type TableRowData, type TableRowProps, type TableTone, Tabs, TabsContent, TabsList, TabsTrigger, TagIcon, TagsCell, TeamIcon, TeamMemberSelect, Textarea, type TextareaVariants, TimeLogger, TimeLoggerActions, type TimeLoggerActionsProps, TimeLoggerBillable, type TimeLoggerBillableProps, TimeLoggerContextRow, type TimeLoggerContextRowProps, TimeLoggerEntry, TimeLoggerEntryList, type TimeLoggerEntryListProps, type TimeLoggerEntryProps, TimeLoggerField, type TimeLoggerFieldProps, TimeLoggerFooter, type TimeLoggerFooterProps, TimeLoggerHeader, type TimeLoggerHeaderProps, TimeLoggerNotes, type TimeLoggerNotesProps, type TimeLoggerPhase, type TimeLoggerProps, type TimeLoggerTier, TimeLoggerTimer, type TimeLoggerTimerProps, type TimelineState, type ToastAction, type ToastContextValue, type ToastOptions, ToastProvider, type ToastVariant, ToggleGroup, ToggleGroupItem, Toolbar, type ToolbarProps, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Trash2Icon, TrashIcon, TrendingDownIcon, TrendingUpIcon, UnderlineIcon, UploadIcon, type UseStopwatchReturn, UserCircleIcon, UserIcon, UsersIcon, VisuallyHidden, WorkflowIcon, XCircleSolidIcon, XIcon, YEAR_DISPLAY_PLACEHOLDER, ZoomInIcon, ZoomOutIcon, alertVariants, applyMask, applyYearMask, attachmentChipVariants, badgeVariants, buttonVariants, cardVariants, cn, dateToIso, displayToIso, fileTypeBadgeVariants, fileTypeFromName, filterChipVariants, formatClock, formatCurrency, formatDuration, getFlagEmoji, iconTileVariants, inputVariants, isoToDate, isoToDisplay, isoToYear, labelVariants, parseDuration, parsePhoneForEditing, progressBarVariants, progressRingVariants, searchInputVariants, serviceToneLabel, serviceToneStyle, sidebarLinkBadgeVariants, spinnerVariants, starRatingVariants, statusDotVariants, suiteProgressFillVariants, textareaVariants, useSidebarPeekLock, useSidebarState, useStopwatch, useToast, yearToIso };
package/dist/index.js CHANGED
@@ -9481,7 +9481,12 @@ function useToast() {
9481
9481
  if (!ctx) throw new Error("useToast must be used within <ToastProvider>");
9482
9482
  return ctx;
9483
9483
  }
9484
+ var DEFAULT_DURATION = 5e3;
9485
+ var MAX_VISIBLE = 3;
9484
9486
  var toastCount = 0;
9487
+ function toOptions(input) {
9488
+ return typeof input === "string" ? { title: input } : input;
9489
+ }
9485
9490
  function ToastProvider({ children }) {
9486
9491
  const [toasts, setToasts] = useState([]);
9487
9492
  const removeToast = useCallback((id) => {
@@ -9489,9 +9494,28 @@ function ToastProvider({ children }) {
9489
9494
  }, []);
9490
9495
  const addToast = useCallback((options) => {
9491
9496
  const id = `toast-${++toastCount}`;
9492
- setToasts((prev) => [...prev, { id, ...options }]);
9497
+ setToasts((prev) => {
9498
+ if (options.dedupeKey) {
9499
+ const existing = prev.find((t) => t.dedupeKey === options.dedupeKey);
9500
+ if (existing) {
9501
+ return prev.map(
9502
+ (t) => t.dedupeKey === options.dedupeKey ? { ...t, ...options, seq: t.seq + 1 } : t
9503
+ );
9504
+ }
9505
+ }
9506
+ return [...prev, { id, seq: 0, ...options }];
9507
+ });
9493
9508
  return id;
9494
9509
  }, []);
9510
+ const update = useCallback((id, patch) => {
9511
+ setToasts(
9512
+ (prev) => prev.map((t) => {
9513
+ if (t.id !== id) return t;
9514
+ const duration = patch.duration ?? (patch.variant && patch.variant !== "loading" ? DEFAULT_DURATION : t.duration);
9515
+ return { ...t, ...patch, duration, seq: t.seq + 1 };
9516
+ })
9517
+ );
9518
+ }, []);
9495
9519
  const dismiss = useCallback((id) => {
9496
9520
  if (id === void 0) {
9497
9521
  setToasts([]);
@@ -9499,9 +9523,20 @@ function ToastProvider({ children }) {
9499
9523
  }
9500
9524
  setToasts((prev) => prev.filter((t) => t.id !== id));
9501
9525
  }, []);
9526
+ const promise = useCallback(
9527
+ (p, copy) => {
9528
+ const id = addToast({ ...toOptions(copy.loading), variant: "loading", duration: 0 });
9529
+ p.then(
9530
+ (value2) => update(id, { ...toOptions(typeof copy.success === "function" ? copy.success(value2) : copy.success), variant: "success" }),
9531
+ (err) => update(id, { ...toOptions(typeof copy.error === "function" ? copy.error(err) : copy.error), variant: "destructive", duration: 6e3 })
9532
+ );
9533
+ return p;
9534
+ },
9535
+ [addToast, update]
9536
+ );
9502
9537
  const value = useMemo(
9503
- () => ({ toast: addToast, dismiss }),
9504
- [addToast, dismiss]
9538
+ () => ({ toast: addToast, dismiss, update, promise }),
9539
+ [addToast, dismiss, update, promise]
9505
9540
  );
9506
9541
  return /* @__PURE__ */ jsxs(ToastContext, { value, children: [
9507
9542
  children,
@@ -9512,130 +9547,259 @@ function ToastProvider({ children }) {
9512
9547
  role: "region",
9513
9548
  "aria-live": "polite",
9514
9549
  "aria-label": "Notifications",
9515
- children: toasts.map((t) => /* @__PURE__ */ jsx(ToastItem, { toast: t, onDismiss: removeToast }, t.id))
9550
+ children: toasts.slice(0, MAX_VISIBLE).map((t) => /* @__PURE__ */ jsx(ToastItem, { toast: t, onDismiss: removeToast }, t.id))
9516
9551
  }
9517
9552
  )
9518
9553
  ] });
9519
9554
  }
9520
9555
  var variantConfig = {
9521
- default: { chip: "bg-pro-bg", icon: "text-pro-fg", bar: "bg-pro-fg", Icon: InfoCircleSolidIcon },
9556
+ default: {
9557
+ chip: "bg-pro-bg",
9558
+ icon: "text-pro-fg",
9559
+ stroke: "stroke-pro-fg",
9560
+ ring: "ring-pro-fg/15",
9561
+ Icon: InfoCircleSolidIcon
9562
+ },
9522
9563
  success: {
9523
9564
  chip: "bg-success-bg",
9524
9565
  icon: "text-success-fg",
9525
- bar: "bg-success-fg",
9566
+ stroke: "stroke-success-fg",
9567
+ ring: "ring-success-fg/15",
9526
9568
  Icon: CheckCircleSolidIcon
9527
9569
  },
9528
9570
  destructive: {
9529
9571
  chip: "bg-danger-bg",
9530
9572
  icon: "text-danger-fg",
9531
- bar: "bg-danger-fg",
9573
+ stroke: "stroke-danger-fg",
9574
+ ring: "ring-danger-fg/15",
9532
9575
  Icon: XCircleSolidIcon
9533
9576
  },
9534
9577
  warning: {
9535
9578
  chip: "bg-warning-bg",
9536
9579
  icon: "text-warning-fg",
9537
- bar: "bg-warning-fg",
9580
+ stroke: "stroke-warning-fg",
9581
+ ring: "ring-warning-fg/20",
9538
9582
  Icon: AlertTriangleSolidIcon
9583
+ },
9584
+ info: {
9585
+ chip: "bg-info/12",
9586
+ icon: "text-info",
9587
+ stroke: "stroke-info",
9588
+ ring: "ring-info/15",
9589
+ Icon: InfoCircleSolidIcon
9590
+ },
9591
+ loading: {
9592
+ chip: "bg-pro-bg",
9593
+ icon: "text-pro-fg",
9594
+ stroke: "stroke-pro-fg",
9595
+ ring: "ring-pro-fg/15",
9596
+ Icon: LoaderIcon,
9597
+ spin: true
9539
9598
  }
9540
9599
  };
9600
+ var RING_RADIUS2 = 11;
9601
+ var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS2;
9602
+ var SWIPE_DISMISS_PX = 72;
9541
9603
  function ToastItem({ toast, onDismiss }) {
9542
9604
  const timerRef = useRef(void 0);
9605
+ const remainingRef = useRef(toast.duration ?? DEFAULT_DURATION);
9606
+ const startedAtRef = useRef(0);
9607
+ const cardRef = useRef(null);
9543
9608
  const [exiting, setExiting] = useState(false);
9544
- const [filled, setFilled] = useState(false);
9545
- const duration = toast.duration ?? 5e3;
9546
- const showProgress = duration > 0;
9609
+ const [paused, setPaused] = useState(false);
9610
+ const hasContent = toast.content != null;
9611
+ const duration = toast.duration ?? DEFAULT_DURATION;
9612
+ const isLoading = (toast.variant ?? "default") === "loading";
9613
+ const autoDismiss = duration > 0 && !hasContent && !isLoading;
9614
+ const isError = (toast.variant ?? "default") === "destructive";
9547
9615
  const close = useCallback(() => {
9548
9616
  setExiting(true);
9549
9617
  setTimeout(() => onDismiss(toast.id), 150);
9550
9618
  }, [toast.id, onDismiss]);
9551
9619
  useEffect(() => {
9552
- if (!showProgress) return;
9553
- timerRef.current = setTimeout(close, duration);
9554
- return () => clearTimeout(timerRef.current);
9555
- }, [showProgress, duration, close]);
9620
+ remainingRef.current = toast.duration ?? DEFAULT_DURATION;
9621
+ }, [toast.seq, toast.duration]);
9556
9622
  useEffect(() => {
9557
- if (!showProgress) return;
9558
- const raf = requestAnimationFrame(() => setFilled(true));
9559
- return () => cancelAnimationFrame(raf);
9560
- }, [showProgress]);
9561
- const { chip, icon, bar, Icon: Icon3 } = variantConfig[toast.variant ?? "default"];
9562
- return /* @__PURE__ */ jsxs(
9623
+ if (!autoDismiss || exiting || paused) return;
9624
+ startedAtRef.current = Date.now();
9625
+ timerRef.current = setTimeout(close, remainingRef.current);
9626
+ return () => {
9627
+ clearTimeout(timerRef.current);
9628
+ remainingRef.current = Math.max(
9629
+ 0,
9630
+ remainingRef.current - (Date.now() - startedAtRef.current)
9631
+ );
9632
+ };
9633
+ }, [autoDismiss, exiting, paused, close, toast.seq]);
9634
+ const dragRef = useRef(null);
9635
+ const onPointerDown = (e) => {
9636
+ if (e.target.closest("button, a, input, textarea")) return;
9637
+ dragRef.current = { startX: e.clientX, dx: 0 };
9638
+ setPaused(true);
9639
+ cardRef.current?.setPointerCapture(e.pointerId);
9640
+ };
9641
+ const onPointerMove = (e) => {
9642
+ const drag = dragRef.current;
9643
+ if (!drag || !cardRef.current) return;
9644
+ drag.dx = Math.max(0, e.clientX - drag.startX);
9645
+ cardRef.current.style.transform = `translateX(${drag.dx}px)`;
9646
+ cardRef.current.style.opacity = `${Math.max(0.3, 1 - drag.dx / 240)}`;
9647
+ };
9648
+ const endDrag = (e) => {
9649
+ const drag = dragRef.current;
9650
+ dragRef.current = null;
9651
+ cardRef.current?.releasePointerCapture?.(e.pointerId);
9652
+ if (!drag || !cardRef.current) return;
9653
+ if (drag.dx >= SWIPE_DISMISS_PX) {
9654
+ close();
9655
+ return;
9656
+ }
9657
+ cardRef.current.style.transform = "";
9658
+ cardRef.current.style.opacity = "";
9659
+ setPaused(false);
9660
+ };
9661
+ const { chip, icon, stroke, ring, Icon: Icon3, spin } = variantConfig[toast.variant ?? "default"];
9662
+ return /* @__PURE__ */ jsx(
9563
9663
  "div",
9564
9664
  {
9565
- role: "status",
9665
+ ref: cardRef,
9666
+ role: hasContent ? "group" : isError ? "alert" : "status",
9667
+ "aria-atomic": hasContent ? void 0 : true,
9566
9668
  "data-state": exiting ? "closed" : "open",
9669
+ onPointerEnter: () => setPaused(true),
9670
+ onPointerLeave: () => {
9671
+ if (!dragRef.current) setPaused(false);
9672
+ },
9673
+ onPointerDown,
9674
+ onPointerMove,
9675
+ onPointerUp: endDrag,
9676
+ onPointerCancel: endDrag,
9677
+ onFocusCapture: () => setPaused(true),
9678
+ onBlurCapture: () => {
9679
+ if (!dragRef.current) setPaused(false);
9680
+ },
9567
9681
  className: cn(
9568
- "bg-surface border-rule text-fg rounded-card shadow-card pointer-events-auto relative w-80 overflow-hidden border p-4",
9569
- "font-body",
9570
- // Unified data-state animation (spec §5.27) — same model as Dialog/Tooltip:
9571
- // open → fade+slide in over --duration-overlay (200ms), ease-out-quart
9572
- // close → fade+slide out over --duration-fast (150ms), ease-in
9573
- "data-[state=open]:animate-in data-[state=open]:slide-in-from-right-8 data-[state=open]:fade-in-0",
9574
- "data-[state=open]:duration-[var(--duration-overlay)] data-[state=open]:ease-[var(--ease-out-quart)]",
9575
- "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right-8 data-[state=closed]:fade-out-0",
9682
+ "bg-surface border-rule text-fg rounded-card shadow-card pointer-events-auto relative w-80 max-w-[calc(100vw-2rem)] touch-none overflow-hidden border",
9683
+ // Title-mode padding; rich content owns its own internal padding.
9684
+ hasContent ? "" : "p-4",
9685
+ "font-body select-none",
9686
+ // Tactile lift on hover/focus — signals the card is interactive and
9687
+ // that its countdown is held. Shadow only (not motion), so it needs no
9688
+ // reduced-motion fallback; the named property keeps us off transition-all.
9689
+ "transition-shadow duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
9690
+ "hover:shadow-lg focus-within:shadow-lg motion-reduce:transition-none",
9691
+ // Unified data-state animation (spec §5.27) — same model as Dialog/Tooltip,
9692
+ // with a subtle zoom so the toast *pops* in rather than just appearing:
9693
+ // open → fade + slide-from-right + zoom-from-95 over --duration-normal (250ms), ease-out-quart
9694
+ // close → fade + slide-to-right + zoom-to-95 over --duration-fast (150ms), ease-in
9695
+ "data-[state=open]:animate-in data-[state=open]:slide-in-from-right-8 data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
9696
+ "data-[state=open]:duration-[var(--duration-normal)] data-[state=open]:ease-[var(--ease-out-quart)]",
9697
+ "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right-8 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
9576
9698
  "data-[state=closed]:duration-[var(--duration-fast)] data-[state=closed]:ease-[var(--ease-in)]",
9577
9699
  "motion-reduce:animate-none"
9578
9700
  ),
9579
- children: [
9580
- /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
9581
- /* @__PURE__ */ jsx(
9582
- "span",
9583
- {
9584
- className: cn(
9585
- "inline-flex size-8 shrink-0 items-center justify-center rounded-[9px]",
9586
- chip,
9587
- icon
9588
- ),
9589
- "aria-hidden": "true",
9590
- children: /* @__PURE__ */ jsx(Icon3, { className: "size-5" })
9591
- }
9592
- ),
9593
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
9594
- /* @__PURE__ */ jsx("p", { className: "text-fg text-sm leading-tight font-semibold", children: toast.title }),
9595
- toast.description && /* @__PURE__ */ jsx("p", { className: "text-fg-3 mt-0.5 text-sm leading-snug", children: toast.description }),
9596
- toast.action && /* @__PURE__ */ jsx(
9597
- "button",
9598
- {
9599
- type: "button",
9600
- onClick: () => {
9601
- toast.action?.onClick();
9602
- close();
9603
- },
9604
- className: cn(
9605
- "text-pro-fg mt-2 text-sm font-semibold",
9606
- "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] hover:underline motion-reduce:transition-none",
9607
- "focus-visible:[box-shadow:var(--shadow-focus-ring)] rounded-sm focus-visible:outline-none"
9608
- ),
9609
- children: toast.action.label
9610
- }
9611
- )
9612
- ] }),
9613
- /* @__PURE__ */ jsx(
9701
+ children: hasContent ? typeof toast.content === "function" ? toast.content(close) : toast.content : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
9702
+ /* @__PURE__ */ jsx(
9703
+ "span",
9704
+ {
9705
+ className: cn(
9706
+ // Same-hue inset ring gives the tinted chip a crafted edge instead
9707
+ // of a flat fill — definition without a heavy border.
9708
+ "inline-flex size-8 shrink-0 items-center justify-center rounded-[9px] ring-1 ring-inset",
9709
+ // Staggered pop — chip scales in ~80ms after the card lands so the
9710
+ // status glyph "arrives". motion-safe only; reduced motion shows it
9711
+ // at rest with no entrance.
9712
+ "motion-safe:animate-[toast-chip-in_280ms_var(--ease-out-quart)_80ms_both]",
9713
+ chip,
9714
+ icon,
9715
+ ring
9716
+ ),
9717
+ "aria-hidden": "true",
9718
+ children: /* @__PURE__ */ jsx(Icon3, { className: cn("size-5", spin && "animate-spin motion-reduce:animate-none") })
9719
+ }
9720
+ ),
9721
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
9722
+ toast.title && /* @__PURE__ */ jsx("p", { className: "text-fg text-sm leading-tight font-semibold", children: toast.title }),
9723
+ toast.description && /* @__PURE__ */ jsx("p", { className: "text-fg-3 mt-0.5 text-sm leading-snug", children: toast.description }),
9724
+ toast.action && /* @__PURE__ */ jsx(
9614
9725
  "button",
9615
9726
  {
9616
9727
  type: "button",
9617
- onClick: close,
9728
+ onClick: () => {
9729
+ toast.action?.onClick();
9730
+ close();
9731
+ },
9618
9732
  className: cn(
9619
- "text-fg-4 hover:text-fg-2 rounded-icon -mr-1 inline-flex size-5 shrink-0 items-center justify-center",
9620
- "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
9621
- "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none"
9733
+ "text-pro-fg mt-2 text-sm font-semibold",
9734
+ "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] hover:underline motion-reduce:transition-none",
9735
+ "focus-visible:[box-shadow:var(--shadow-focus-ring)] rounded-sm focus-visible:outline-none"
9622
9736
  ),
9623
- "aria-label": "Dismiss",
9624
- children: /* @__PURE__ */ jsx(XIcon, { className: "size-3.5", "aria-hidden": "true" })
9737
+ children: toast.action.label
9625
9738
  }
9626
9739
  )
9627
9740
  ] }),
9628
- showProgress && /* @__PURE__ */ jsx("div", { className: "bg-rule absolute inset-x-0 bottom-0 h-1", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
9629
- "div",
9741
+ /* @__PURE__ */ jsxs(
9742
+ "button",
9630
9743
  {
9744
+ type: "button",
9745
+ onClick: close,
9631
9746
  className: cn(
9632
- "h-full transition-[width] ease-linear motion-reduce:transition-none",
9633
- bar
9747
+ // size-7 click target with a -m-1 offset so the glyph keeps its
9748
+ // top-right optical position while the hit area (and ring) grow.
9749
+ "text-fg-4 hover:text-fg-2 hover:bg-overlay-hover relative -mt-1 -mr-1 inline-flex size-7 shrink-0 items-center justify-center rounded-full",
9750
+ "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
9751
+ "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none"
9634
9752
  ),
9635
- style: { width: filled ? "100%" : "0%", transitionDuration: `${duration}ms` }
9753
+ "aria-label": "Dismiss",
9754
+ children: [
9755
+ autoDismiss && // Countdown drains as a ring hugging the dismiss button — the timer
9756
+ // and the close affordance share one spot. Pauses in lockstep with
9757
+ // the JS timer (animation-play-state). Hidden under reduced motion;
9758
+ // the timer still governs dismissal.
9759
+ /* @__PURE__ */ jsxs(
9760
+ "svg",
9761
+ {
9762
+ viewBox: "0 0 28 28",
9763
+ className: "pointer-events-none absolute inset-0 size-7 -rotate-90 motion-reduce:hidden",
9764
+ "aria-hidden": "true",
9765
+ children: [
9766
+ /* @__PURE__ */ jsx(
9767
+ "circle",
9768
+ {
9769
+ cx: "14",
9770
+ cy: "14",
9771
+ r: RING_RADIUS2,
9772
+ fill: "none",
9773
+ strokeWidth: "2",
9774
+ className: "stroke-rule"
9775
+ }
9776
+ ),
9777
+ /* @__PURE__ */ jsx(
9778
+ "circle",
9779
+ {
9780
+ cx: "14",
9781
+ cy: "14",
9782
+ r: RING_RADIUS2,
9783
+ fill: "none",
9784
+ strokeWidth: "2",
9785
+ strokeLinecap: "round",
9786
+ className: cn("opacity-90", stroke),
9787
+ style: {
9788
+ strokeDasharray: RING_CIRCUMFERENCE,
9789
+ "--toast-ring-circ": RING_CIRCUMFERENCE,
9790
+ animation: `toast-ring-drain ${duration}ms linear forwards`,
9791
+ animationPlayState: paused ? "paused" : "running"
9792
+ }
9793
+ }
9794
+ )
9795
+ ]
9796
+ }
9797
+ ),
9798
+ /* @__PURE__ */ jsx(XIcon, { className: "relative size-3.5", "aria-hidden": "true" })
9799
+ ]
9636
9800
  }
9637
- ) })
9638
- ]
9801
+ )
9802
+ ] }) })
9639
9803
  }
9640
9804
  );
9641
9805
  }