@assure-one/design-system 1.42.0 → 1.43.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{brand-scope-B7w3-y9E.d.ts → brand-scope-BOKu4iOc.d.ts} +1 -1
- package/dist/{chunk-YMRSFVW7.js → chunk-5AL4W32Z.js} +335 -225
- package/dist/chunk-5AL4W32Z.js.map +1 -0
- package/dist/{chunk-H53VF62B.js → chunk-L5IQK3GV.js} +108 -50
- package/dist/chunk-L5IQK3GV.js.map +1 -0
- package/dist/{chunk-AF3QYJ24.js → chunk-TBDTXAFH.js} +6 -4
- package/dist/chunk-TBDTXAFH.js.map +1 -0
- package/dist/{chunk-M2HMZ2RW.js → chunk-VK6SW34V.js} +36 -14
- package/dist/chunk-VK6SW34V.js.map +1 -0
- package/dist/css/components.css +1 -1
- package/dist/{data-table-view-BN3GgNdp.d.ts → data-table-view-BWhKeUiw.d.ts} +2 -2
- package/dist/{design-system-provider-CrBRFQjR.d.ts → design-system-provider-Coe2S3Lh.d.ts} +1 -1
- package/dist/icons/index.d.ts +5 -1
- package/dist/icons/index.js +1 -1
- package/dist/index.d.ts +246 -53
- package/dist/index.js +530 -236
- package/dist/index.js.map +1 -1
- package/dist/legacy/index.d.ts +3 -3
- package/dist/legacy/index.js +3 -3
- package/dist/next/index.d.ts +2 -2
- package/dist/styles.css +1 -1
- package/dist/suite/index.d.ts +3 -3
- package/dist/suite/index.js +3 -3
- package/dist/{types-aBQCboFH.d.ts → types-DlqmlVyZ.d.ts} +11 -1
- package/docs/components.md +6 -3
- package/docs/components.registry.json +84 -17
- package/package.json +1 -1
- package/dist/chunk-AF3QYJ24.js.map +0 -1
- package/dist/chunk-H53VF62B.js.map +0 -1
- package/dist/chunk-M2HMZ2RW.js.map +0 -1
- package/dist/chunk-YMRSFVW7.js.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {
|
|
3
|
-
export { Badge, DataTable, DataTableBody, DataTableCell, DataTableCellDue, DataTableCellId, DataTableCellMono, DataTableCellName, DataTableCheckbox, DataTableHead, DataTableHeader, DataTablePagination, DataTableResultsCount, DataTableRow, DataTableSearch, DataTableSpacer, DataTableToolbar, DataTableView, EmptyValue, PROGRESS_LEGACY_TO_INTENT, Pagination, ProgressBar, ProgressRing, SERVICE_TONES, STATUS_DOT_TONE_TO_INTENT, SegmentedProgress, StatusDot, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, ToggleGroup, ToggleGroupItem, badgeVariants, compareSortValues, nextSortDirection, progressBarVariants, progressRingVariants, resolveBadgeAppearance, serviceToneLabel, serviceToneStyle, statusDotVariants, useDataTable } from './chunk-
|
|
4
|
-
import { Collapsible, CollapsibleTrigger, CollapsibleContent, PlainLink, Combobox, CmdkCompatContext, Sheet, SheetContent, SheetTitle } from './chunk-
|
|
5
|
-
export { BrandScope, BrandScopeProvider, Chip, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, DEFAULT_COMBOBOX_MESSAGES, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarBrand, SidebarBrandText, SidebarDrawer, SidebarFooter, SidebarLink, SidebarLinkAction, SidebarLinkBadge, SidebarLinkGroup, SidebarLinkLabel, SidebarPinButton, SidebarProvider, SidebarSection, SidebarTrigger, SidebarUser, assetPath, brandScope, chipVariants, getAssetBasePath, resolveChipStyle, setAssetBasePath, sidebarLinkBadgeVariants, useBrandScope, useSidebarPeekLock, useSidebarState } from './chunk-
|
|
6
|
-
import { withPortalContainer, Backdrop, alertDialogAnatomy, OverlaySurface, OverlayTitle, OverlayDescription, Button, slot, useDsMessages, useLinkComponent, surfaceAnatomy, stateAttributes, cardAnatomy, ModalPortal, kbdAnatomy, FieldContext, fieldAnatomy, useFieldContext, MENU_SUB_TRIGGER_CHEVRON, menuSubTriggerClasses, MENU_INSET, contextMenuAnatomy, presence, menuItemClasses, MENU_ITEM_DANGER, MENU_INDICATOR_WELL, MENU_CHECK_GLYPH, menuIndicatorItemClasses, MENU_RADIO_GLYPH, menuLabelClasses, menuSeparatorClasses, useFieldControl, useMergedRefs, joinIds, Popover, PopoverTrigger, PopoverContent, FormBridge, CONTROL_SIZE_CLASSES, dialogAnatomy, DismissButton, DEFAULT_OVERLAY_MESSAGES, DISMISS_GLYPH_CLASSES, OverlayBody, headingAnatomy, deprecate, floatingSurfaceClasses, FLOATING_PADDING, FLOATING_WIDTH, labelAnatomy, warnLegacyButtonProps, resolveButtonIcons, buttonVariants, INERT_CLASSES, DISABLED_LOOK_CLASSES, inertHandlers, INERT_ATTRIBUTES, linkButtonAnatomy, useControllableState, controlChrome, mergeRefs, numberInputAnatomy, EN_MESSAGES, phoneFieldAnatomy, Input, useFieldsetContext, radioGroupAnatomy, microInteractions, CONTROL_LABEL_TEXT, searchInputAnatomy, IconButton, codeAnatomy, Slot, textAnatomy, stackAnatomy, inlineAnatomy, statusBadgeAnatomy,
|
|
7
|
-
export { Avatar, Button, Checkbox, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FileChip, FileUpload, IconButton, Input, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, Pressable, SPINNER_TONE_TO_INTENT, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Spinner, Textarea, ThemeScope, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, buttonVariants, iconButtonVariants, inputVariants, resolveButtonStyle, spinnerVariants, textareaVariants, useDsMessages, useFieldControl } from './chunk-
|
|
8
|
-
import { cn, ChevronDownIcon, EyeIcon, DownloadIcon, ChevronRightIcon, CheckIcon, CircleIcon, CopyIcon, CalendarIcon, XIcon, AlertTriangleIcon, ArrowRightIcon, ArrowLeftIcon, FileTextIcon, ZoomOutIcon, ZoomInIcon, TrendingUpIcon, TrendingDownIcon, SearchIcon, TableIcon, StarIcon, ListChecksIcon, CheckCircleSolidIcon, HelpCircleIcon, UserIcon, SendIcon, SettingsIcon, ChevronLeftIcon, FolderOpenIcon, FolderClosedIcon, MinusIcon, AlertCircleIcon, CheckCircle2Icon, PlusIcon, LoaderIcon, InfoCircleSolidIcon, AlertTriangleSolidIcon, XCircleSolidIcon, RotateCcwIcon, InfoIcon, CommandIcon } from './chunk-
|
|
9
|
-
export { AlertCircleIcon, AlertTriangleIcon, AlertTriangleSolidIcon, ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, ArrowUpRightIcon, AtSignIcon, BanIcon, BarChartIcon, BellIcon, BoldIcon, BrainIcon, BriefcaseIcon, Building2Icon, BuildingIcon, CalculatorIcon, CalendarIcon, CameraIcon, ChatBubbleIcon, CheckCheckIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClipboardCheckIcon, ClockIcon, CloseIcon, CommandIcon, CopyIcon, CornerDownLeftIcon, CreditCardIcon, DocumentIcon, DollarSignIcon, DownloadIcon, ExternalLinkIcon, ExtractIcon, EyeIcon, EyeOffIcon, FileChartColumnIcon, FileIcon, FileReturnIcon, FileTextIcon, FilterIcon, FlagIcon, FolderClosedIcon, FolderDownIcon, FolderOpenIcon, FolderPlusIcon, FolderUpIcon, GlobeIcon, GoogleBrandIcon, GraduationCapIcon, GripHorizontalIcon, GripVerticalIcon, HelpCircleIcon, HistoryIcon, HomeIcon, InboxIcon, InfoCircleSolidIcon, InfoIcon, ItalicIcon, KanbanIcon, KeyIcon, LandmarkIcon, LayersIcon, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, MailIcon, MapPinIcon, MaximizeIcon, MenuIcon, MessageCircleIcon, MessageCircleMoreIcon, MessageCircleWarningIcon, MicIcon, MicrosoftBrandIcon, MinimizeIcon, MinusIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointer2Icon, MoveIcon, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PanelRightCloseIcon, PanelRightIcon, PaperclipIcon, PauseIcon, PenSignIcon, PenToolIcon, PencilIcon, PhoneIcon, PlayIcon, PlusIcon, ReceiptIcon, RefreshCwIcon, ReplyIcon, RotateCcwIcon, SaveIcon, SearchIcon, SendIcon, SettingsIcon, ShieldIcon, SigmaIcon, SlashIcon, SmartphoneIcon, SparkleIcon, SparklesIcon, SquarePlayIcon, StarIcon, StopIcon, StrikethroughIcon, SunIcon, TableIcon, TagIcon, TeamIcon, ThumbsDownIcon, ThumbsUpIcon, TimerIcon, Trash2Icon, TrashIcon, TrashSolidIcon, TrendingDownIcon, TrendingUpIcon, TypeIcon, UnderlineIcon, UploadIcon, UserCircleIcon, UserIcon, UsersIcon, VideoIcon, Volume2Icon, VolumeXIcon, WorkflowIcon, XCircleSolidIcon, XIcon, ZoomInIcon, ZoomOutIcon, cn, createIcon } from './chunk-
|
|
2
|
+
import { Skeleton, ToggleGroup, ToggleGroupItem, badgeVariants, DataTableBody, DataTableRow, DataTableCell, Badge, Pagination, TableBody, TableRow, TableCell, Table, TableHeader, TableHead } from './chunk-5AL4W32Z.js';
|
|
3
|
+
export { Badge, DataTable, DataTableBody, DataTableCell, DataTableCellDue, DataTableCellId, DataTableCellMono, DataTableCellName, DataTableCheckbox, DataTableHead, DataTableHeader, DataTablePagination, DataTableResultsCount, DataTableRow, DataTableSearch, DataTableSpacer, DataTableToolbar, DataTableView, EmptyValue, PROGRESS_LEGACY_TO_INTENT, Pagination, ProgressBar, ProgressRing, SERVICE_TONES, STATUS_DOT_TONE_TO_INTENT, SegmentedProgress, Skeleton, SkeletonCircle, SkeletonText, StatusDot, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, ToggleGroup, ToggleGroupItem, badgeVariants, compareSortValues, nextSortDirection, progressBarVariants, progressRingVariants, resolveBadgeAppearance, serviceToneLabel, serviceToneStyle, statusDotVariants, useDataTable } from './chunk-5AL4W32Z.js';
|
|
4
|
+
import { Collapsible, CollapsibleTrigger, CollapsibleContent, PlainLink, Combobox, Sidebar, SidebarFooter, SidebarUser, useSidebarState, SidebarSection, SidebarLinkGroup, SidebarLink, SidebarLinkLabel, SidebarLinkBadge, CmdkCompatContext, Sheet, SheetContent, SheetTitle } from './chunk-L5IQK3GV.js';
|
|
5
|
+
export { BrandScope, BrandScopeProvider, Chip, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, DEFAULT_COMBOBOX_MESSAGES, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarBrand, SidebarBrandText, SidebarDrawer, SidebarFooter, SidebarLink, SidebarLinkAction, SidebarLinkBadge, SidebarLinkGroup, SidebarLinkLabel, SidebarPinButton, SidebarProvider, SidebarSection, SidebarTrigger, SidebarUser, assetPath, brandScope, chipVariants, getAssetBasePath, resolveChipStyle, setAssetBasePath, sidebarLinkBadgeVariants, useBrandScope, useSidebarPeekLock, useSidebarState } from './chunk-L5IQK3GV.js';
|
|
6
|
+
import { withPortalContainer, Backdrop, alertDialogAnatomy, OverlaySurface, OverlayTitle, OverlayDescription, Button, slot, useDsMessages, useLinkComponent, surfaceAnatomy, stateAttributes, cardAnatomy, ModalPortal, kbdAnatomy, FieldContext, fieldAnatomy, useFieldContext, MENU_SUB_TRIGGER_CHEVRON, menuSubTriggerClasses, MENU_INSET, contextMenuAnatomy, presence, menuItemClasses, MENU_ITEM_DANGER, MENU_INDICATOR_WELL, MENU_CHECK_GLYPH, menuIndicatorItemClasses, MENU_RADIO_GLYPH, menuLabelClasses, menuSeparatorClasses, useFieldControl, useMergedRefs, joinIds, Popover, PopoverTrigger, PopoverContent, FormBridge, CONTROL_SIZE_CLASSES, dialogAnatomy, DismissButton, DEFAULT_OVERLAY_MESSAGES, DISMISS_GLYPH_CLASSES, OverlayBody, headingAnatomy, deprecate, floatingSurfaceClasses, FLOATING_PADDING, FLOATING_WIDTH, labelAnatomy, warnLegacyButtonProps, resolveButtonIcons, buttonVariants, INERT_CLASSES, DISABLED_LOOK_CLASSES, inertHandlers, INERT_ATTRIBUTES, linkButtonAnatomy, useControllableState, controlChrome, mergeRefs, numberInputAnatomy, EN_MESSAGES, phoneFieldAnatomy, Input, useFieldsetContext, useFormReset2, radioGroupAnatomy, microInteractions, CONTROL_LABEL_TEXT, searchInputAnatomy, IconButton, Tooltip, TooltipTrigger, TooltipContent, codeAnatomy, Slot, textAnatomy, stackAnatomy, inlineAnatomy, statusBadgeAnatomy, useFieldsetState, FieldsetContext, fieldsetAnatomy, useFieldsetLegend, shellAnatomy, Avatar, dataTableAnatomy, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuCheckboxItem, useId as useId$1, partId, errorOnce, isLabelable, Spinner, Select, Checkbox, FIELD_PARTS, SelectRoot, SelectTrigger, SelectValue, SelectContent, SelectItem, OverlayHeader, OverlayFooter, commandAnatomy, menuShortcutClasses, useFormReset, sideDrawerAnatomy, Portal, toastAnatomy, useExitPresence, TooltipProvider, TOOLTIP_DEFAULT_DELAY_MS, DesignSystemContext, PortalContainerContext, ModalRoot, ModalOverlay, ModalContent, ModalTitle, ModalDescription } from './chunk-VK6SW34V.js';
|
|
7
|
+
export { Avatar, Button, Checkbox, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FileChip, FileUpload, IconButton, Input, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, Pressable, SPINNER_TONE_TO_INTENT, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Spinner, Textarea, ThemeScope, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, buttonVariants, iconButtonVariants, inputVariants, resolveButtonStyle, spinnerVariants, textareaVariants, useDsMessages, useFieldControl } from './chunk-VK6SW34V.js';
|
|
8
|
+
import { cn, ChevronDownIcon, EyeIcon, DownloadIcon, ChevronRightIcon, CheckIcon, CircleIcon, CopyIcon, CalendarIcon, XIcon, AlertTriangleIcon, ArrowRightIcon, ArrowLeftIcon, FileTextIcon, ZoomOutIcon, ZoomInIcon, TrendingUpIcon, TrendingDownIcon, SearchIcon, TableIcon, StarIcon, RowsIcon, Rows4Icon, ListChecksIcon, CheckCircleSolidIcon, HelpCircleIcon, UserIcon, SendIcon, SettingsIcon, ChevronLeftIcon, FolderOpenIcon, FolderClosedIcon, MinusIcon, AlertCircleIcon, CheckCircle2Icon, PlusIcon, LoaderIcon, InfoCircleSolidIcon, AlertTriangleSolidIcon, XCircleSolidIcon, RotateCcwIcon, InfoIcon, CommandIcon } from './chunk-TBDTXAFH.js';
|
|
9
|
+
export { AlertCircleIcon, AlertTriangleIcon, AlertTriangleSolidIcon, ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, ArrowUpRightIcon, AtSignIcon, BanIcon, BarChartIcon, BellIcon, BoldIcon, BrainIcon, BriefcaseIcon, Building2Icon, BuildingIcon, CalculatorIcon, CalendarIcon, CameraIcon, ChatBubbleIcon, CheckCheckIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClipboardCheckIcon, ClockIcon, CloseIcon, CommandIcon, CopyIcon, CornerDownLeftIcon, CreditCardIcon, DocumentIcon, DollarSignIcon, DownloadIcon, ExternalLinkIcon, ExtractIcon, EyeIcon, EyeOffIcon, FileChartColumnIcon, FileIcon, FileReturnIcon, FileTextIcon, FilterIcon, FlagIcon, FolderClosedIcon, FolderDownIcon, FolderOpenIcon, FolderPlusIcon, FolderUpIcon, GlobeIcon, GoogleBrandIcon, GraduationCapIcon, GripHorizontalIcon, GripVerticalIcon, HelpCircleIcon, HistoryIcon, HomeIcon, InboxIcon, InfoCircleSolidIcon, InfoIcon, ItalicIcon, KanbanIcon, KeyIcon, LandmarkIcon, LayersIcon, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, MailIcon, MapPinIcon, MaximizeIcon, MenuIcon, MessageCircleIcon, MessageCircleMoreIcon, MessageCircleWarningIcon, MicIcon, MicrosoftBrandIcon, MinimizeIcon, MinusIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointer2Icon, MoveIcon, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PanelRightCloseIcon, PanelRightIcon, PaperclipIcon, PauseIcon, PenSignIcon, PenToolIcon, PencilIcon, PhoneIcon, PlayIcon, PlusIcon, ReceiptIcon, RefreshCwIcon, ReplyIcon, RotateCcwIcon, Rows4Icon, RowsIcon, SaveIcon, SearchIcon, SendIcon, SettingsIcon, ShieldIcon, SigmaIcon, SlashIcon, SmartphoneIcon, SparkleIcon, SparklesIcon, SquarePlayIcon, StarIcon, StopIcon, StrikethroughIcon, SunIcon, TableIcon, TagIcon, TeamIcon, ThumbsDownIcon, ThumbsUpIcon, TimerIcon, Trash2Icon, TrashIcon, TrashSolidIcon, TrendingDownIcon, TrendingUpIcon, TypeIcon, UnderlineIcon, UploadIcon, UserCircleIcon, UserIcon, UsersIcon, VideoIcon, Volume2Icon, VolumeXIcon, WorkflowIcon, XCircleSolidIcon, XIcon, ZoomInIcon, ZoomOutIcon, cn, createIcon } from './chunk-TBDTXAFH.js';
|
|
10
10
|
export { systemTokens } from './chunk-CPOGSNXS.js';
|
|
11
11
|
import './chunk-EUHGZA6Q.js';
|
|
12
12
|
export { colors, radii, reference, shadows, spacing, surfaces, typography } from './chunk-YRHRVOLV.js';
|
|
13
|
-
import * as
|
|
14
|
-
import { forwardRef, useId, useRef, useState,
|
|
13
|
+
import * as React30 from 'react';
|
|
14
|
+
import { forwardRef, useId, useRef, useState, useLayoutEffect, createContext, useEffect, useCallback, useMemo, useImperativeHandle, Children, isValidElement, cloneElement, useSyncExternalStore, useContext } from 'react';
|
|
15
15
|
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
16
16
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
17
17
|
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
|
|
@@ -33,7 +33,7 @@ import { useFormStatus } from 'react-dom';
|
|
|
33
33
|
import { Branch } from '@radix-ui/react-dismissable-layer';
|
|
34
34
|
import * as VisuallyHiddenPrimitive from '@radix-ui/react-visually-hidden';
|
|
35
35
|
|
|
36
|
-
var Accordion =
|
|
36
|
+
var Accordion = React30.forwardRef(function Accordion2({ className, ...props }, ref) {
|
|
37
37
|
return /* @__PURE__ */ jsx(
|
|
38
38
|
AccordionPrimitive.Root,
|
|
39
39
|
{
|
|
@@ -44,22 +44,28 @@ var Accordion = React28.forwardRef(function Accordion2({ className, ...props },
|
|
|
44
44
|
);
|
|
45
45
|
});
|
|
46
46
|
Accordion.displayName = AccordionPrimitive.Root.displayName;
|
|
47
|
-
var AccordionItem =
|
|
47
|
+
var AccordionItem = React30.forwardRef(function AccordionItem2({ className, ...props }, ref) {
|
|
48
48
|
return /* @__PURE__ */ jsx(AccordionPrimitive.Item, { ref, className: cn(className), ...props });
|
|
49
49
|
});
|
|
50
50
|
AccordionItem.displayName = AccordionPrimitive.Item.displayName;
|
|
51
|
-
var AccordionTrigger =
|
|
51
|
+
var AccordionTrigger = React30.forwardRef(function AccordionTrigger2({ children, className, ...props }, ref) {
|
|
52
52
|
return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "ds:flex", children: /* @__PURE__ */ jsxs(
|
|
53
53
|
AccordionPrimitive.Trigger,
|
|
54
54
|
{
|
|
55
55
|
ref,
|
|
56
56
|
className: cn(
|
|
57
|
-
"ds:group group ds:text-fg ds:flex ds:flex-1 ds:items-center ds:justify-between ds:gap-4 ds:py-4 ds:text-left ds:text-sm ds:font-medium",
|
|
57
|
+
"ds:group group ds:text-fg ds:flex ds:flex-1 ds:items-center ds:justify-between ds:gap-4 ds:rounded-control ds:py-4 ds:text-left ds:text-sm ds:font-medium",
|
|
58
58
|
"ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
59
59
|
"ds:hover:text-fg-2",
|
|
60
60
|
"ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
|
|
61
61
|
"ds:data-[disabled]:cursor-not-allowed ds:data-[disabled]:opacity-50 ds:data-[disabled]:hover:text-fg",
|
|
62
|
+
// `aria-expanded` twin: a TooltipTrigger asChild ancestor can
|
|
63
|
+
// clobber this trigger's own `data-state` with the tooltip's (see
|
|
64
|
+
// toggle-group.tsx's note on the same bug), but never sets
|
|
65
|
+
// `aria-expanded` — which Radix's Collapsible-backed Accordion
|
|
66
|
+
// trigger always carries alongside `data-state`.
|
|
62
67
|
"ds:[&[data-state=open]>svg]:rotate-180",
|
|
68
|
+
"ds:[&[aria-expanded=true]>svg]:rotate-180",
|
|
63
69
|
className
|
|
64
70
|
),
|
|
65
71
|
...props,
|
|
@@ -77,7 +83,7 @@ var AccordionTrigger = React28.forwardRef(function AccordionTrigger2({ children,
|
|
|
77
83
|
) });
|
|
78
84
|
});
|
|
79
85
|
AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
|
|
80
|
-
var AccordionContent =
|
|
86
|
+
var AccordionContent = React30.forwardRef(function AccordionContent2({ children, className, ...props }, ref) {
|
|
81
87
|
return /* @__PURE__ */ jsx(
|
|
82
88
|
AccordionPrimitive.Content,
|
|
83
89
|
{
|
|
@@ -97,7 +103,7 @@ AccordionContent.displayName = AccordionPrimitive.Content.displayName;
|
|
|
97
103
|
var AlertDialog = AlertDialogPrimitive.Root;
|
|
98
104
|
var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
|
|
99
105
|
var AlertDialogPortal = withPortalContainer(AlertDialogPrimitive.Portal);
|
|
100
|
-
var AlertDialogOverlay =
|
|
106
|
+
var AlertDialogOverlay = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(
|
|
101
107
|
Backdrop,
|
|
102
108
|
{
|
|
103
109
|
as: AlertDialogPrimitive.Overlay,
|
|
@@ -108,7 +114,7 @@ var AlertDialogOverlay = React28.forwardRef((props, ref) => /* @__PURE__ */ jsx(
|
|
|
108
114
|
}
|
|
109
115
|
));
|
|
110
116
|
AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
|
|
111
|
-
var AlertDialogContent =
|
|
117
|
+
var AlertDialogContent = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
|
|
112
118
|
/* @__PURE__ */ jsx(AlertDialogOverlay, {}),
|
|
113
119
|
/* @__PURE__ */ jsx(
|
|
114
120
|
OverlaySurface,
|
|
@@ -129,9 +135,9 @@ var AlertDialogHeader = (props) => /* @__PURE__ */ jsx(OverlayHeader, { anatomy:
|
|
|
129
135
|
AlertDialogHeader.displayName = "AlertDialogHeader";
|
|
130
136
|
var AlertDialogFooter = (props) => /* @__PURE__ */ jsx(OverlayFooter, { anatomy: alertDialogAnatomy, layout: "inset", ...props });
|
|
131
137
|
AlertDialogFooter.displayName = "AlertDialogFooter";
|
|
132
|
-
var AlertDialogTitle =
|
|
138
|
+
var AlertDialogTitle = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(OverlayTitle, { as: AlertDialogPrimitive.Title, anatomy: alertDialogAnatomy, ref, ...props }));
|
|
133
139
|
AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
|
|
134
|
-
var AlertDialogDescription =
|
|
140
|
+
var AlertDialogDescription = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(
|
|
135
141
|
OverlayDescription,
|
|
136
142
|
{
|
|
137
143
|
as: AlertDialogPrimitive.Description,
|
|
@@ -144,7 +150,7 @@ AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayNam
|
|
|
144
150
|
var EMPHASES = /* @__PURE__ */ new Set(["solid", "soft", "outline", "ghost", "link"]);
|
|
145
151
|
var isEmphasis = (word) => EMPHASES.has(word);
|
|
146
152
|
var LEGACY_ACTION_HOVER = "ds:hover:bg-destructive/90";
|
|
147
|
-
var AlertDialogAction =
|
|
153
|
+
var AlertDialogAction = React30.forwardRef(({ variant, intent, className, ...props }, ref) => {
|
|
148
154
|
const legacy = variant === void 0 && intent === void 0;
|
|
149
155
|
const resolvedIntent = intent ?? (variant === void 0 || isEmphasis(variant) ? "danger" : void 0);
|
|
150
156
|
return /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, { ref, asChild: true, ...slot(alertDialogAnatomy, "action"), children: /* @__PURE__ */ jsx(
|
|
@@ -160,7 +166,7 @@ var AlertDialogAction = React28.forwardRef(({ variant, intent, className, ...pro
|
|
|
160
166
|
});
|
|
161
167
|
AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
|
|
162
168
|
var LEGACY_CANCEL_HOVER = "ds:hover:border-rule-strong ds:hover:text-fg";
|
|
163
|
-
var AlertDialogCancel =
|
|
169
|
+
var AlertDialogCancel = React30.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, { ref, asChild: true, ...slot(alertDialogAnatomy, "cancel"), children: /* @__PURE__ */ jsx(
|
|
164
170
|
Button,
|
|
165
171
|
{
|
|
166
172
|
variant: "outline",
|
|
@@ -258,9 +264,11 @@ var AreaChart = forwardRef(function AreaChart2({ data, height = 140, formatValue
|
|
|
258
264
|
const wrapRef = useRef(null);
|
|
259
265
|
const [width, setWidth] = useState(620);
|
|
260
266
|
const [hover, setHover] = useState(null);
|
|
261
|
-
|
|
267
|
+
useLayoutEffect(() => {
|
|
262
268
|
const el = wrapRef.current;
|
|
263
269
|
if (!el) return;
|
|
270
|
+
const measured = el.getBoundingClientRect().width;
|
|
271
|
+
if (measured > 0) setWidth(measured);
|
|
264
272
|
const ro = new ResizeObserver((entries) => {
|
|
265
273
|
for (const entry of entries) setWidth(entry.contentRect.width);
|
|
266
274
|
});
|
|
@@ -287,6 +295,7 @@ var AreaChart = forwardRef(function AreaChart2({ data, height = 140, formatValue
|
|
|
287
295
|
width,
|
|
288
296
|
height,
|
|
289
297
|
viewBox: `0 0 ${width} ${height}`,
|
|
298
|
+
className: "ds:block ds:h-auto ds:max-w-full",
|
|
290
299
|
role: "img",
|
|
291
300
|
"aria-label": "Area trend chart",
|
|
292
301
|
onMouseLeave: () => setHover(null),
|
|
@@ -351,7 +360,7 @@ var AreaChart = forwardRef(function AreaChart2({ data, height = 140, formatValue
|
|
|
351
360
|
] });
|
|
352
361
|
});
|
|
353
362
|
AreaChart.displayName = "AreaChart";
|
|
354
|
-
var AspectRatio =
|
|
363
|
+
var AspectRatio = React30.forwardRef(function AspectRatio2({ className, ratio = 16 / 9, ...props }, ref) {
|
|
355
364
|
return /* @__PURE__ */ jsx(
|
|
356
365
|
AspectRatioPrimitive.Root,
|
|
357
366
|
{
|
|
@@ -1086,15 +1095,15 @@ function Calendar({
|
|
|
1086
1095
|
const range = isRange ? selected : void 0;
|
|
1087
1096
|
const locale = useLocale(typeof localeProp === "string" ? localeProp : void 0);
|
|
1088
1097
|
const localeObject = typeof localeProp === "object" ? localeProp : void 0;
|
|
1089
|
-
const localeProps =
|
|
1098
|
+
const localeProps = React30.useMemo(
|
|
1090
1099
|
() => localeObject ? {} : calendarLocaleProps(locale),
|
|
1091
1100
|
[locale, localeObject]
|
|
1092
1101
|
);
|
|
1093
1102
|
const hydrated = useHydrated();
|
|
1094
|
-
const clockToday =
|
|
1103
|
+
const clockToday = React30.useMemo(() => hydrated ? startOfDay(/* @__PURE__ */ new Date()) : void 0, [hydrated]);
|
|
1095
1104
|
const today = todayProp ?? clockToday;
|
|
1096
1105
|
const anchor = props.month ?? props.defaultMonth ?? todayProp;
|
|
1097
|
-
const { modifiers, modifiersClassNames } =
|
|
1106
|
+
const { modifiers, modifiersClassNames } = React30.useMemo(() => {
|
|
1098
1107
|
const buckets = {};
|
|
1099
1108
|
for (const h of highlights) {
|
|
1100
1109
|
const key = h.color ?? "primary";
|
|
@@ -1109,7 +1118,7 @@ function Calendar({
|
|
|
1109
1118
|
}
|
|
1110
1119
|
return { modifiers: mods, modifiersClassNames: modClasses };
|
|
1111
1120
|
}, [highlights]);
|
|
1112
|
-
const disabledMatcher =
|
|
1121
|
+
const disabledMatcher = React30.useMemo(() => {
|
|
1113
1122
|
if (!minDate && !maxDate) return void 0;
|
|
1114
1123
|
if (minDate && maxDate) return [{ before: minDate }, { after: maxDate }];
|
|
1115
1124
|
if (minDate) return { before: minDate };
|
|
@@ -1117,7 +1126,7 @@ function Calendar({
|
|
|
1117
1126
|
}, [minDate, maxDate]);
|
|
1118
1127
|
const rangeFrom = range?.from;
|
|
1119
1128
|
const rangeTo = range?.to;
|
|
1120
|
-
const navRange =
|
|
1129
|
+
const navRange = React30.useMemo(
|
|
1121
1130
|
() => captionLayout === "label" ? void 0 : resolveCalendarNavRange({
|
|
1122
1131
|
minDate,
|
|
1123
1132
|
maxDate,
|
|
@@ -1182,7 +1191,7 @@ function Calendar({
|
|
|
1182
1191
|
day: "ds:flex-1 ds:text-center ds:relative ds:p-0",
|
|
1183
1192
|
day_button: cn(
|
|
1184
1193
|
"ds:inline-flex ds:size-8 ds:w-full ds:items-center ds:justify-center ds:rounded-input ds:font-mono ds:tabular-nums ds:text-(length:--control-font-size-md) ds:text-fg",
|
|
1185
|
-
"ds:transition-colors ds:duration-[var(--duration-instant)] ds:motion-reduce:transition-none",
|
|
1194
|
+
"ds:transition-colors ds:duration-[var(--duration-instant)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
1186
1195
|
"ds:hover:bg-surface-hover",
|
|
1187
1196
|
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
1188
1197
|
"ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed ds:disabled:text-fg-disabled"
|
|
@@ -1279,7 +1288,10 @@ var CardHeader = forwardRef(
|
|
|
1279
1288
|
ref,
|
|
1280
1289
|
...slot(cardAnatomy, "header"),
|
|
1281
1290
|
className: cn(
|
|
1282
|
-
|
|
1291
|
+
// `border-rule` colours the documented `className="border-b"` divider
|
|
1292
|
+
// the way CardFooter's border is coloured (Tailwind 4 would otherwise
|
|
1293
|
+
// paint it `currentColor`); it draws nothing without a border width.
|
|
1294
|
+
"ds:grid ds:auto-cols-fr ds:grid-cols-[1fr_auto] ds:items-start ds:gap-1.5 ds:border-rule ds:p-6 ds:[.border-b]:pb-4",
|
|
1283
1295
|
className
|
|
1284
1296
|
),
|
|
1285
1297
|
...props
|
|
@@ -1295,7 +1307,12 @@ var CardTitle = forwardRef(function CardTitle2({ className, children, headingLev
|
|
|
1295
1307
|
{
|
|
1296
1308
|
ref,
|
|
1297
1309
|
...slot(cardAnatomy, "title"),
|
|
1298
|
-
className: cn(
|
|
1310
|
+
className: cn(
|
|
1311
|
+
// Column 1 of CardHeader's `1fr auto` grid, so a description stacks
|
|
1312
|
+
// under the title instead of flowing into the action column.
|
|
1313
|
+
"ds:col-start-1 ds:text-fg ds:text-base ds:leading-tight ds:font-medium",
|
|
1314
|
+
className
|
|
1315
|
+
),
|
|
1299
1316
|
...props,
|
|
1300
1317
|
children
|
|
1301
1318
|
}
|
|
@@ -1308,7 +1325,7 @@ var CardDescription = forwardRef(function CardDescription2({ className, ...props
|
|
|
1308
1325
|
{
|
|
1309
1326
|
ref,
|
|
1310
1327
|
...slot(cardAnatomy, "description"),
|
|
1311
|
-
className: cn("ds:text-fg-3 ds:text-sm", className),
|
|
1328
|
+
className: cn("ds:col-start-1 ds:text-fg-3 ds:text-sm", className),
|
|
1312
1329
|
...props
|
|
1313
1330
|
}
|
|
1314
1331
|
);
|
|
@@ -1552,17 +1569,17 @@ function CommandPalette({
|
|
|
1552
1569
|
}) {
|
|
1553
1570
|
const messages = useDsMessages("commandPalette", messagesProp);
|
|
1554
1571
|
const placeholder = placeholderProp ?? messages.search;
|
|
1555
|
-
const [internalOpen, setInternalOpen] =
|
|
1572
|
+
const [internalOpen, setInternalOpen] = React30.useState(defaultOpen);
|
|
1556
1573
|
const isControlled = controlledOpen !== void 0;
|
|
1557
1574
|
const open = isControlled ? controlledOpen : internalOpen;
|
|
1558
|
-
const setOpen =
|
|
1575
|
+
const setOpen = React30.useCallback(
|
|
1559
1576
|
(value) => {
|
|
1560
1577
|
if (!isControlled) setInternalOpen(value);
|
|
1561
1578
|
onOpenChange?.(value);
|
|
1562
1579
|
},
|
|
1563
1580
|
[isControlled, onOpenChange]
|
|
1564
1581
|
);
|
|
1565
|
-
|
|
1582
|
+
React30.useEffect(() => {
|
|
1566
1583
|
function handleKeyDown(e) {
|
|
1567
1584
|
if ((e.metaKey || e.ctrlKey) && e.key === "k") {
|
|
1568
1585
|
e.preventDefault();
|
|
@@ -1881,19 +1898,19 @@ function ConfirmDialog({
|
|
|
1881
1898
|
}) {
|
|
1882
1899
|
const messages = useDsMessages("confirm", messagesOverride);
|
|
1883
1900
|
const isControlled = open !== void 0;
|
|
1884
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
1901
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React30.useState(defaultOpen);
|
|
1885
1902
|
const resolvedOpen = isControlled ? open : uncontrolledOpen;
|
|
1886
|
-
const [pending, setPending] =
|
|
1887
|
-
const [error, setError] =
|
|
1888
|
-
const actionRef =
|
|
1889
|
-
const mounted =
|
|
1890
|
-
|
|
1903
|
+
const [pending, setPending] = React30.useState(false);
|
|
1904
|
+
const [error, setError] = React30.useState(void 0);
|
|
1905
|
+
const actionRef = React30.useRef(null);
|
|
1906
|
+
const mounted = React30.useRef(true);
|
|
1907
|
+
React30.useEffect(() => {
|
|
1891
1908
|
mounted.current = true;
|
|
1892
1909
|
return () => {
|
|
1893
1910
|
mounted.current = false;
|
|
1894
1911
|
};
|
|
1895
1912
|
}, []);
|
|
1896
|
-
const setDialogOpen =
|
|
1913
|
+
const setDialogOpen = React30.useCallback(
|
|
1897
1914
|
(nextOpen) => {
|
|
1898
1915
|
onOpenChange?.(nextOpen);
|
|
1899
1916
|
if (!isControlled) setUncontrolledOpen(nextOpen);
|
|
@@ -2022,7 +2039,7 @@ var ContextMenuGroup = ContextMenuPrimitive.Group;
|
|
|
2022
2039
|
var ContextMenuPortal = withPortalContainer(ContextMenuPrimitive.Portal);
|
|
2023
2040
|
var ContextMenuSub = ContextMenuPrimitive.Sub;
|
|
2024
2041
|
var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
|
|
2025
|
-
var ContextMenuSubTrigger =
|
|
2042
|
+
var ContextMenuSubTrigger = React30.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
2026
2043
|
ContextMenuPrimitive.SubTrigger,
|
|
2027
2044
|
{
|
|
2028
2045
|
ref,
|
|
@@ -2036,7 +2053,7 @@ var ContextMenuSubTrigger = React28.forwardRef(({ className, inset, children, ..
|
|
|
2036
2053
|
}
|
|
2037
2054
|
));
|
|
2038
2055
|
ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
|
|
2039
|
-
var ContextMenuSubContent =
|
|
2056
|
+
var ContextMenuSubContent = React30.forwardRef(({ className, ...props }, ref) => (
|
|
2040
2057
|
// Portal the sub-content to the body. The parent Content is transformed
|
|
2041
2058
|
// while its presence keyframes run, which makes it the containing block for
|
|
2042
2059
|
// `position: fixed` descendants — and its `overflow-hidden` would then clip
|
|
@@ -2056,7 +2073,7 @@ var ContextMenuSubContent = React28.forwardRef(({ className, ...props }, ref) =>
|
|
|
2056
2073
|
) })
|
|
2057
2074
|
));
|
|
2058
2075
|
ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
|
|
2059
|
-
var ContextMenuContent =
|
|
2076
|
+
var ContextMenuContent = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPortal, { children: /* @__PURE__ */ jsx(
|
|
2060
2077
|
ContextMenuPrimitive.Content,
|
|
2061
2078
|
{
|
|
2062
2079
|
ref,
|
|
@@ -2070,7 +2087,7 @@ var ContextMenuContent = React28.forwardRef(({ className, ...props }, ref) => /*
|
|
|
2070
2087
|
}
|
|
2071
2088
|
) }));
|
|
2072
2089
|
ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
|
|
2073
|
-
var ContextMenuItem =
|
|
2090
|
+
var ContextMenuItem = React30.forwardRef(({ className, destructive, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
2074
2091
|
ContextMenuPrimitive.Item,
|
|
2075
2092
|
{
|
|
2076
2093
|
ref,
|
|
@@ -2085,7 +2102,7 @@ var ContextMenuItem = React28.forwardRef(({ className, destructive, inset, ...pr
|
|
|
2085
2102
|
}
|
|
2086
2103
|
));
|
|
2087
2104
|
ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
|
|
2088
|
-
var ContextMenuCheckboxItem =
|
|
2105
|
+
var ContextMenuCheckboxItem = React30.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
2089
2106
|
ContextMenuPrimitive.CheckboxItem,
|
|
2090
2107
|
{
|
|
2091
2108
|
ref,
|
|
@@ -2099,7 +2116,7 @@ var ContextMenuCheckboxItem = React28.forwardRef(({ className, children, ...prop
|
|
|
2099
2116
|
}
|
|
2100
2117
|
));
|
|
2101
2118
|
ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
|
|
2102
|
-
var ContextMenuRadioItem =
|
|
2119
|
+
var ContextMenuRadioItem = React30.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
2103
2120
|
ContextMenuPrimitive.RadioItem,
|
|
2104
2121
|
{
|
|
2105
2122
|
ref,
|
|
@@ -2113,7 +2130,7 @@ var ContextMenuRadioItem = React28.forwardRef(({ className, children, ...props }
|
|
|
2113
2130
|
}
|
|
2114
2131
|
));
|
|
2115
2132
|
ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
|
|
2116
|
-
var ContextMenuLabel =
|
|
2133
|
+
var ContextMenuLabel = React30.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
2117
2134
|
ContextMenuPrimitive.Label,
|
|
2118
2135
|
{
|
|
2119
2136
|
ref,
|
|
@@ -2127,7 +2144,7 @@ var ContextMenuLabel = React28.forwardRef(({ className, inset, ...props }, ref)
|
|
|
2127
2144
|
}
|
|
2128
2145
|
));
|
|
2129
2146
|
ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
|
|
2130
|
-
var ContextMenuSeparator =
|
|
2147
|
+
var ContextMenuSeparator = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
2131
2148
|
ContextMenuPrimitive.Separator,
|
|
2132
2149
|
{
|
|
2133
2150
|
ref,
|
|
@@ -2148,10 +2165,13 @@ ContextMenuShortcut.displayName = "ContextMenuShortcut";
|
|
|
2148
2165
|
var CopyButton = forwardRef(function CopyButton2({ value, feedbackDuration = 2e3, messages: messagesProp, className, children, ...props }, ref) {
|
|
2149
2166
|
const messages = useDsMessages("copyButton", messagesProp);
|
|
2150
2167
|
const [copied, setCopied] = useState(false);
|
|
2168
|
+
const resetTimer = useRef(void 0);
|
|
2169
|
+
useEffect(() => () => clearTimeout(resetTimer.current), []);
|
|
2151
2170
|
const handleCopy = useCallback(async () => {
|
|
2152
2171
|
await navigator.clipboard.writeText(value);
|
|
2153
2172
|
setCopied(true);
|
|
2154
|
-
|
|
2173
|
+
clearTimeout(resetTimer.current);
|
|
2174
|
+
resetTimer.current = setTimeout(() => setCopied(false), feedbackDuration);
|
|
2155
2175
|
}, [value, feedbackDuration]);
|
|
2156
2176
|
return /* @__PURE__ */ jsx(
|
|
2157
2177
|
"button",
|
|
@@ -2168,7 +2188,14 @@ var CopyButton = forwardRef(function CopyButton2({ value, feedbackDuration = 2e3
|
|
|
2168
2188
|
),
|
|
2169
2189
|
"aria-label": copied ? messages.copied : messages.copy,
|
|
2170
2190
|
...props,
|
|
2171
|
-
children: copied ? /* @__PURE__ */ jsx(
|
|
2191
|
+
children: copied ? /* @__PURE__ */ jsx(
|
|
2192
|
+
CheckIcon,
|
|
2193
|
+
{
|
|
2194
|
+
size: 16,
|
|
2195
|
+
"aria-hidden": "true",
|
|
2196
|
+
className: "ds:text-success-fg ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:zoom-in-50 ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)]"
|
|
2197
|
+
}
|
|
2198
|
+
) : children ?? /* @__PURE__ */ jsx(CopyIcon, { size: 16, "aria-hidden": "true" })
|
|
2172
2199
|
}
|
|
2173
2200
|
);
|
|
2174
2201
|
});
|
|
@@ -2297,7 +2324,7 @@ function YearGrid({ selected, onSelect, minYear, maxYear, formatLabel, autoFocus
|
|
|
2297
2324
|
className: cn(
|
|
2298
2325
|
"ds:rounded-input ds:font-mono ds:text-(length:--control-font-size-md) ds:tabular-nums",
|
|
2299
2326
|
"ds:inline-flex ds:h-10 ds:items-center ds:justify-center",
|
|
2300
|
-
"ds:transition-colors ds:duration-[var(--duration-instant)] ds:motion-reduce:transition-none",
|
|
2327
|
+
"ds:transition-colors ds:duration-[var(--duration-instant)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
2301
2328
|
"ds:hover:bg-surface-hover",
|
|
2302
2329
|
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
2303
2330
|
"ds:disabled:text-fg-disabled ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed",
|
|
@@ -2865,7 +2892,7 @@ DateRangePicker.displayName = "DateRangePicker";
|
|
|
2865
2892
|
var Dialog = DialogPrimitive.Root;
|
|
2866
2893
|
var DialogTrigger = DialogPrimitive.Trigger;
|
|
2867
2894
|
var DialogPortal = withPortalContainer(DialogPrimitive.Portal);
|
|
2868
|
-
var DialogOverlay =
|
|
2895
|
+
var DialogOverlay = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(
|
|
2869
2896
|
Backdrop,
|
|
2870
2897
|
{
|
|
2871
2898
|
as: DialogPrimitive.Overlay,
|
|
@@ -2899,7 +2926,7 @@ var DIALOG_HEIGHTS = {
|
|
|
2899
2926
|
full: "ds:h-[calc(100vh-6rem)]"
|
|
2900
2927
|
};
|
|
2901
2928
|
function useTitleRequired(element) {
|
|
2902
|
-
|
|
2929
|
+
React30.useEffect(() => {
|
|
2903
2930
|
if (process.env.NODE_ENV === "production" || process.env.NODE_ENV === "test") return;
|
|
2904
2931
|
const timer = setTimeout(() => {
|
|
2905
2932
|
const node = element.current;
|
|
@@ -2916,7 +2943,7 @@ function useTitleRequired(element) {
|
|
|
2916
2943
|
return () => clearTimeout(timer);
|
|
2917
2944
|
}, [element]);
|
|
2918
2945
|
}
|
|
2919
|
-
var DialogContent =
|
|
2946
|
+
var DialogContent = React30.forwardRef(
|
|
2920
2947
|
({
|
|
2921
2948
|
size = "md",
|
|
2922
2949
|
height = "auto",
|
|
@@ -2928,7 +2955,7 @@ var DialogContent = React28.forwardRef(
|
|
|
2928
2955
|
children,
|
|
2929
2956
|
...props
|
|
2930
2957
|
}, ref) => {
|
|
2931
|
-
const element =
|
|
2958
|
+
const element = React30.useRef(null);
|
|
2932
2959
|
const mergedRef = useMergedRefs(ref, element);
|
|
2933
2960
|
useTitleRequired(element);
|
|
2934
2961
|
const heightRow = DIALOG_HEIGHTS[height];
|
|
@@ -2966,7 +2993,7 @@ var DialogContent = React28.forwardRef(
|
|
|
2966
2993
|
}
|
|
2967
2994
|
);
|
|
2968
2995
|
DialogContent.displayName = DialogPrimitive.Content.displayName;
|
|
2969
|
-
var DialogClose =
|
|
2996
|
+
var DialogClose = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
2970
2997
|
DialogPrimitive.Close,
|
|
2971
2998
|
{
|
|
2972
2999
|
ref,
|
|
@@ -2978,15 +3005,15 @@ var DialogClose = React28.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
2978
3005
|
DialogClose.displayName = "DialogClose";
|
|
2979
3006
|
var DialogHeader = (props) => /* @__PURE__ */ jsx(OverlayHeader, { anatomy: dialogAnatomy, layout: "inset", dismissGutter: true, ...props });
|
|
2980
3007
|
DialogHeader.displayName = "DialogHeader";
|
|
2981
|
-
var DialogBody =
|
|
3008
|
+
var DialogBody = React30.forwardRef(
|
|
2982
3009
|
({ padding = "none", ...props }, ref) => /* @__PURE__ */ jsx(OverlayBody, { anatomy: dialogAnatomy, layout: "inset", padding, ref, ...props })
|
|
2983
3010
|
);
|
|
2984
3011
|
DialogBody.displayName = "DialogBody";
|
|
2985
3012
|
var DialogFooter = (props) => /* @__PURE__ */ jsx(OverlayFooter, { anatomy: dialogAnatomy, layout: "inset", ...props });
|
|
2986
3013
|
DialogFooter.displayName = "DialogFooter";
|
|
2987
|
-
var DialogTitle =
|
|
3014
|
+
var DialogTitle = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(OverlayTitle, { as: DialogPrimitive.Title, anatomy: dialogAnatomy, ref, ...props }));
|
|
2988
3015
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
2989
|
-
var DialogDescription =
|
|
3016
|
+
var DialogDescription = React30.forwardRef((props, ref) => /* @__PURE__ */ jsx(
|
|
2990
3017
|
OverlayDescription,
|
|
2991
3018
|
{
|
|
2992
3019
|
as: DialogPrimitive.Description,
|
|
@@ -3016,7 +3043,7 @@ var chipVariants2 = cva(
|
|
|
3016
3043
|
}
|
|
3017
3044
|
}
|
|
3018
3045
|
);
|
|
3019
|
-
var DismissibleChip =
|
|
3046
|
+
var DismissibleChip = React30.forwardRef(function DismissibleChip2({ label, onDismiss, variant, className, ...props }, ref) {
|
|
3020
3047
|
const messages = useDsMessages("dismissibleChip");
|
|
3021
3048
|
return /* @__PURE__ */ jsxs(
|
|
3022
3049
|
"button",
|
|
@@ -3130,7 +3157,7 @@ var DonutChart = forwardRef(function DonutChart2({
|
|
|
3130
3157
|
onBlur: () => setHover(null),
|
|
3131
3158
|
className: cn(
|
|
3132
3159
|
"ds:flex ds:w-full ds:items-center ds:gap-2 ds:rounded-[var(--radius-icon)] ds:px-1.5 ds:py-1 ds:text-left ds:text-sm ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
3133
|
-
hover === i ? "ds:bg-
|
|
3160
|
+
hover === i ? "ds:bg-surface-hover" : "ds:hover:bg-surface-hover"
|
|
3134
3161
|
),
|
|
3135
3162
|
children: [
|
|
3136
3163
|
/* @__PURE__ */ jsx(
|
|
@@ -3350,7 +3377,7 @@ var ErrorState = forwardRef(function ErrorState2({
|
|
|
3350
3377
|
{
|
|
3351
3378
|
className: cn(
|
|
3352
3379
|
"ds:text-fg-3 ds:hover:text-fg ds:mx-auto ds:w-auto ds:gap-1 ds:rounded-md",
|
|
3353
|
-
"ds:px-1.5 ds:py-0.5 ds:text-xs ds:font-medium ds:transition-colors",
|
|
3380
|
+
"ds:px-1.5 ds:py-0.5 ds:text-xs ds:font-medium ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)]",
|
|
3354
3381
|
"ds:motion-reduce:transition-none"
|
|
3355
3382
|
),
|
|
3356
3383
|
children: [
|
|
@@ -3361,7 +3388,7 @@ var ErrorState = forwardRef(function ErrorState2({
|
|
|
3361
3388
|
size: 12,
|
|
3362
3389
|
"aria-hidden": "true",
|
|
3363
3390
|
className: cn(
|
|
3364
|
-
"ds:transition-transform ds:motion-reduce:transition-none",
|
|
3391
|
+
"ds:transition-transform ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
3365
3392
|
detailsOpen && "ds:rotate-180"
|
|
3366
3393
|
)
|
|
3367
3394
|
}
|
|
@@ -3512,9 +3539,10 @@ var FormSection = forwardRef(function FormSection2({ title, description, action,
|
|
|
3512
3539
|
"<FormSection> is deprecated. Render <Fieldset> with a <FieldsetLegend>. Removed in 3.0."
|
|
3513
3540
|
);
|
|
3514
3541
|
return /* @__PURE__ */ jsxs("fieldset", { ref, className: cn("ds:min-w-0", className), ...props, children: [
|
|
3542
|
+
/* @__PURE__ */ jsx("legend", { className: "ds:sr-only", children: title }),
|
|
3515
3543
|
/* @__PURE__ */ jsxs("div", { className: "ds:flex ds:items-start ds:justify-between ds:gap-3", children: [
|
|
3516
3544
|
/* @__PURE__ */ jsxs("div", { className: "ds:min-w-0", children: [
|
|
3517
|
-
/* @__PURE__ */ jsx("
|
|
3545
|
+
/* @__PURE__ */ jsx("p", { "aria-hidden": "true", className: "ds:text-fg ds:text-sm ds:font-semibold", children: title }),
|
|
3518
3546
|
description && /* @__PURE__ */ jsx("p", { className: "ds:text-fg-3 ds:mt-0.5 ds:text-xs ds:leading-relaxed", children: description })
|
|
3519
3547
|
] }),
|
|
3520
3548
|
action && /* @__PURE__ */ jsx("div", { className: "ds:shrink-0", children: action })
|
|
@@ -3526,7 +3554,7 @@ FormSection.displayName = "FormSection";
|
|
|
3526
3554
|
var HoverCard = HoverCardPrimitive.Root;
|
|
3527
3555
|
var HoverCardTrigger = HoverCardPrimitive.Trigger;
|
|
3528
3556
|
var HoverCardPortal = withPortalContainer(HoverCardPrimitive.Portal);
|
|
3529
|
-
var HoverCardContent =
|
|
3557
|
+
var HoverCardContent = React30.forwardRef(
|
|
3530
3558
|
({
|
|
3531
3559
|
className,
|
|
3532
3560
|
align = "center",
|
|
@@ -3647,19 +3675,19 @@ function KeyboardShortcutsDialog({
|
|
|
3647
3675
|
messages: messagesProp
|
|
3648
3676
|
} = {}) {
|
|
3649
3677
|
const messages = useDsMessages("keyboardShortcuts", messagesProp);
|
|
3650
|
-
const [internalOpen, setInternalOpen] =
|
|
3678
|
+
const [internalOpen, setInternalOpen] = React30.useState(defaultOpen);
|
|
3651
3679
|
const isControlled = controlledOpen !== void 0;
|
|
3652
3680
|
const open = isControlled ? controlledOpen : internalOpen;
|
|
3653
|
-
const openRef =
|
|
3681
|
+
const openRef = React30.useRef(open);
|
|
3654
3682
|
openRef.current = open;
|
|
3655
|
-
const setOpen =
|
|
3683
|
+
const setOpen = React30.useCallback(
|
|
3656
3684
|
(value) => {
|
|
3657
3685
|
if (!isControlled) setInternalOpen(value);
|
|
3658
3686
|
onOpenChange?.(value);
|
|
3659
3687
|
},
|
|
3660
3688
|
[isControlled, onOpenChange]
|
|
3661
3689
|
);
|
|
3662
|
-
|
|
3690
|
+
React30.useEffect(() => {
|
|
3663
3691
|
if (hotkey === null) return;
|
|
3664
3692
|
function handleKeyDown(e) {
|
|
3665
3693
|
const target = e.target;
|
|
@@ -3698,7 +3726,7 @@ function KeyboardShortcutsDialog({
|
|
|
3698
3726
|
className: "ds:flex ds:items-center ds:justify-between ds:gap-3 ds:py-1",
|
|
3699
3727
|
children: [
|
|
3700
3728
|
/* @__PURE__ */ jsx("span", { className: "ds:text-fg ds:text-sm", children: shortcut.description }),
|
|
3701
|
-
/* @__PURE__ */ jsx("div", { className: "ds:flex ds:shrink-0 ds:items-center ds:gap-1", children: shortcut.keys.map((key, i) => /* @__PURE__ */ jsxs(
|
|
3729
|
+
/* @__PURE__ */ jsx("div", { className: "ds:flex ds:shrink-0 ds:items-center ds:gap-1", children: shortcut.keys.map((key, i) => /* @__PURE__ */ jsxs(React30.Fragment, { children: [
|
|
3702
3730
|
i > 0 && /* @__PURE__ */ jsx("span", { className: "ds:text-fg-4 ds:mx-0.5 ds:text-(length:--text-caption)", children: messages.then }),
|
|
3703
3731
|
/* @__PURE__ */ jsx(Kbd, { children: key })
|
|
3704
3732
|
] }, i)) })
|
|
@@ -3719,7 +3747,7 @@ function KeyboardShortcutsDialog({
|
|
|
3719
3747
|
var labelVariants = cva(
|
|
3720
3748
|
"ds:text-(length:--text-label) ds:font-medium ds:leading-none ds:text-fg ds:select-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:text-fg-disabled ds:has-[+input:disabled]:text-fg-disabled"
|
|
3721
3749
|
);
|
|
3722
|
-
var Label2 =
|
|
3750
|
+
var Label2 = React30.forwardRef(
|
|
3723
3751
|
function Label3({ children, required, className, id, htmlFor, onClick, ...props }, ref) {
|
|
3724
3752
|
const field = useFieldContext();
|
|
3725
3753
|
const fieldLabelId = useFieldPart("label", id, field !== null);
|
|
@@ -3868,49 +3896,6 @@ var LinkAction = forwardRef(function LinkAction2({ arrow, iconRight, children, c
|
|
|
3868
3896
|
);
|
|
3869
3897
|
});
|
|
3870
3898
|
LinkAction.displayName = "LinkAction";
|
|
3871
|
-
var SKELETON_SURFACE = cn(
|
|
3872
|
-
"skeleton ds:bg-skeleton ds:relative ds:overflow-hidden",
|
|
3873
|
-
"ds:after:absolute ds:after:inset-0 ds:after:-translate-x-full",
|
|
3874
|
-
"ds:after:bg-[linear-gradient(90deg,transparent,var(--color-skeleton-sheen),transparent)]",
|
|
3875
|
-
"ds:motion-safe:after:animate-skeleton-shimmer"
|
|
3876
|
-
);
|
|
3877
|
-
var Skeleton = forwardRef(function Skeleton2({ className, ...props }, ref) {
|
|
3878
|
-
return /* @__PURE__ */ jsx(
|
|
3879
|
-
"div",
|
|
3880
|
-
{
|
|
3881
|
-
ref,
|
|
3882
|
-
className: cn(SKELETON_SURFACE, "ds:rounded-icon", className),
|
|
3883
|
-
"aria-hidden": "true",
|
|
3884
|
-
...props
|
|
3885
|
-
}
|
|
3886
|
-
);
|
|
3887
|
-
});
|
|
3888
|
-
Skeleton.displayName = "Skeleton";
|
|
3889
|
-
var SkeletonText = forwardRef(function SkeletonText2({ lines = 3, className, ...props }, ref) {
|
|
3890
|
-
return /* @__PURE__ */ jsx("div", { ref, className: cn("ds:space-y-2", className), "aria-hidden": "true", ...props, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx(
|
|
3891
|
-
"div",
|
|
3892
|
-
{
|
|
3893
|
-
className: cn(SKELETON_SURFACE, "ds:rounded-icon ds:h-4", i === lines - 1 && "ds:w-3/4")
|
|
3894
|
-
},
|
|
3895
|
-
i
|
|
3896
|
-
)) });
|
|
3897
|
-
});
|
|
3898
|
-
SkeletonText.displayName = "SkeletonText";
|
|
3899
|
-
var SkeletonCircle = forwardRef(
|
|
3900
|
-
function SkeletonCircle2({ size = 40, className, ...props }, ref) {
|
|
3901
|
-
return /* @__PURE__ */ jsx(
|
|
3902
|
-
"div",
|
|
3903
|
-
{
|
|
3904
|
-
ref,
|
|
3905
|
-
className: cn(SKELETON_SURFACE, "ds:rounded-full", className),
|
|
3906
|
-
style: { width: size, height: size },
|
|
3907
|
-
"aria-hidden": "true",
|
|
3908
|
-
...props
|
|
3909
|
-
}
|
|
3910
|
-
);
|
|
3911
|
-
}
|
|
3912
|
-
);
|
|
3913
|
-
SkeletonCircle.displayName = "SkeletonCircle";
|
|
3914
3899
|
var LoadingRows = forwardRef(function LoadingRows2({
|
|
3915
3900
|
count = 3,
|
|
3916
3901
|
rowHeight = "ds:h-14",
|
|
@@ -4137,7 +4122,7 @@ function MultiFilterPill({
|
|
|
4137
4122
|
"span",
|
|
4138
4123
|
{
|
|
4139
4124
|
className: cn(
|
|
4140
|
-
"ds:flex ds:size-4 ds:shrink-0 ds:items-center ds:justify-center ds:rounded-[3px] ds:border ds:transition-colors ds:duration-[var(--duration-fast)] ds:motion-reduce:transition-none",
|
|
4125
|
+
"ds:flex ds:size-4 ds:shrink-0 ds:items-center ds:justify-center ds:rounded-[3px] ds:border ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
4141
4126
|
isSelected ? "ds:border-brand ds:bg-brand ds:text-fg-on-brand" : "ds:border-rule-strong ds:bg-surface"
|
|
4142
4127
|
),
|
|
4143
4128
|
"aria-hidden": "true",
|
|
@@ -4191,7 +4176,7 @@ function MultiSelectField({
|
|
|
4191
4176
|
size = "md",
|
|
4192
4177
|
id
|
|
4193
4178
|
}) {
|
|
4194
|
-
const selected =
|
|
4179
|
+
const selected = React30.useMemo(
|
|
4195
4180
|
() => new Set(value ? value.split(",").filter(Boolean) : []),
|
|
4196
4181
|
[value]
|
|
4197
4182
|
);
|
|
@@ -4204,7 +4189,7 @@ function MultiSelectField({
|
|
|
4204
4189
|
}
|
|
4205
4190
|
onChange(Array.from(next).join(","));
|
|
4206
4191
|
};
|
|
4207
|
-
const generatedId =
|
|
4192
|
+
const generatedId = React30.useId();
|
|
4208
4193
|
const groupId = id ?? generatedId;
|
|
4209
4194
|
return /* @__PURE__ */ jsxs("div", { className: cn("ds:w-full", className), children: [
|
|
4210
4195
|
/* @__PURE__ */ jsx(
|
|
@@ -4587,8 +4572,8 @@ function OTPInput({
|
|
|
4587
4572
|
"aria-labelledby": ariaLabelledBy,
|
|
4588
4573
|
"aria-describedby": ariaDescribedBy
|
|
4589
4574
|
});
|
|
4590
|
-
const inputRef =
|
|
4591
|
-
useFormReset
|
|
4575
|
+
const inputRef = React30.useRef(null);
|
|
4576
|
+
useFormReset(inputRef, () => setValue(defaultValue ?? ""), wiring.name, form);
|
|
4592
4577
|
const errorId = `${wiring.id}-error`;
|
|
4593
4578
|
const hasError = wiring["aria-invalid"] === true;
|
|
4594
4579
|
const messages = useDsMessages("otpInput");
|
|
@@ -4648,7 +4633,7 @@ function OTPSlot({ isActive, char, hasFakeCaret, hasError }) {
|
|
|
4648
4633
|
className: cn(
|
|
4649
4634
|
"ds:relative ds:flex ds:h-12 ds:w-10 ds:items-center ds:justify-center",
|
|
4650
4635
|
"ds:rounded-input ds:bg-surface ds:text-fg ds:border ds:font-mono ds:text-lg ds:tabular-nums",
|
|
4651
|
-
"ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--duration-
|
|
4636
|
+
"ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
4652
4637
|
"ds:sm:h-14 ds:sm:w-12 ds:sm:text-xl",
|
|
4653
4638
|
"ds:border-field-border",
|
|
4654
4639
|
isActive && "ds:[border-color:var(--focus-ring-border)] ds:z-[calc(var(--z-base)+10)] ds:[box-shadow:var(--shadow-focus-ring-field)]",
|
|
@@ -5652,18 +5637,18 @@ function PriorityIcon({ priority, size = 16, className, ...props }) {
|
|
|
5652
5637
|
)),
|
|
5653
5638
|
priority === "urgent" && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
5654
5639
|
/* @__PURE__ */ jsx("rect", { x: "2", y: "2", width: "12", height: "12", rx: "3", fill: "var(--ds-color-priority-urgent, var(--color-priority-urgent))" }),
|
|
5655
|
-
/* @__PURE__ */ jsx("rect", { x: "7.25", y: "3.75", width: "1.5", height: "5", rx: "0.75", fill: "
|
|
5656
|
-
/* @__PURE__ */ jsx("circle", { cx: "8", cy: "11.25", r: "1", fill: "
|
|
5640
|
+
/* @__PURE__ */ jsx("rect", { x: "7.25", y: "3.75", width: "1.5", height: "5", rx: "0.75", fill: "var(--ds-color-feedback-danger-solid-fg, var(--color-fg-on-danger))" }),
|
|
5641
|
+
/* @__PURE__ */ jsx("circle", { cx: "8", cy: "11.25", r: "1", fill: "var(--ds-color-feedback-danger-solid-fg, var(--color-fg-on-danger))" })
|
|
5657
5642
|
] })
|
|
5658
5643
|
]
|
|
5659
5644
|
}
|
|
5660
5645
|
);
|
|
5661
5646
|
}
|
|
5662
|
-
var RadioGroupContext =
|
|
5647
|
+
var RadioGroupContext = React30.createContext({
|
|
5663
5648
|
appearance: "plain",
|
|
5664
5649
|
invalid: false
|
|
5665
5650
|
});
|
|
5666
|
-
var RadioGroup2 =
|
|
5651
|
+
var RadioGroup2 = React30.forwardRef(function RadioGroup3({
|
|
5667
5652
|
className,
|
|
5668
5653
|
appearance = "plain",
|
|
5669
5654
|
invalid,
|
|
@@ -5695,12 +5680,12 @@ var RadioGroup2 = React28.forwardRef(function RadioGroup3({
|
|
|
5695
5680
|
defaultProp: defaultValue ?? null,
|
|
5696
5681
|
onChange: onValueChange
|
|
5697
5682
|
});
|
|
5698
|
-
const initialValue =
|
|
5699
|
-
const rootRef =
|
|
5700
|
-
|
|
5683
|
+
const initialValue = React30.useRef(valueProp ?? defaultValue ?? null);
|
|
5684
|
+
const rootRef = React30.useRef(null);
|
|
5685
|
+
useFormReset2(rootRef, () => setValue(initialValue.current));
|
|
5701
5686
|
const mergedRef = useMergedRefs(ref, rootRef);
|
|
5702
5687
|
const isInvalid = wiring["aria-invalid"] === true;
|
|
5703
|
-
const context =
|
|
5688
|
+
const context = React30.useMemo(
|
|
5704
5689
|
() => ({ appearance, invalid: isInvalid }),
|
|
5705
5690
|
[appearance, isInvalid]
|
|
5706
5691
|
);
|
|
@@ -5733,10 +5718,11 @@ var ITEM_CLASSES = cn(
|
|
|
5733
5718
|
"ds:hover:border-fg-4",
|
|
5734
5719
|
"ds:focus-visible:[border-color:var(--focus-ring-border)] ds:focus-visible:[box-shadow:var(--shadow-focus-ring-field)] ds:focus-visible:outline-none",
|
|
5735
5720
|
"ds:data-[state=checked]:border-brand",
|
|
5736
|
-
"ds:disabled:bg-bg-disabled ds:disabled:border-rule ds:disabled:cursor-not-allowed",
|
|
5721
|
+
"ds:disabled:bg-bg-disabled ds:disabled:border-rule ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed",
|
|
5722
|
+
"ds:disabled:data-[state=checked]:border-rule",
|
|
5737
5723
|
"ds:aria-[invalid=true]:border-danger-line"
|
|
5738
5724
|
);
|
|
5739
|
-
var RadioGroupItem =
|
|
5725
|
+
var RadioGroupItem = React30.forwardRef(function RadioGroupItem2({
|
|
5740
5726
|
className,
|
|
5741
5727
|
label,
|
|
5742
5728
|
description,
|
|
@@ -5745,9 +5731,9 @@ var RadioGroupItem = React28.forwardRef(function RadioGroupItem2({
|
|
|
5745
5731
|
"aria-invalid": ariaInvalid,
|
|
5746
5732
|
...props
|
|
5747
5733
|
}, ref) {
|
|
5748
|
-
const generatedId =
|
|
5734
|
+
const generatedId = React30.useId();
|
|
5749
5735
|
const id = providedId ?? generatedId;
|
|
5750
|
-
const { appearance, invalid } =
|
|
5736
|
+
const { appearance, invalid } = React30.useContext(RadioGroupContext);
|
|
5751
5737
|
const card = appearance === "card";
|
|
5752
5738
|
const descriptionId = card && description ? `${id}-description` : void 0;
|
|
5753
5739
|
const root = /* @__PURE__ */ jsx(
|
|
@@ -5764,8 +5750,8 @@ var RadioGroupItem = React28.forwardRef(function RadioGroupItem2({
|
|
|
5764
5750
|
RadioGroupPrimitive.Indicator,
|
|
5765
5751
|
{
|
|
5766
5752
|
...slot(radioGroupAnatomy, "indicator"),
|
|
5767
|
-
className: "ds:flex ds:items-center ds:justify-center",
|
|
5768
|
-
children: /* @__PURE__ */ jsx(CircleIcon, { className: "ds:fill-
|
|
5753
|
+
className: "ds:flex ds:items-center ds:justify-center ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:zoom-in-50 ds:duration-[var(--motion-duration-press)] ds:ease-[var(--motion-ease-enter)]",
|
|
5754
|
+
children: /* @__PURE__ */ jsx(CircleIcon, { className: "ds:fill-current ds:size-2", "aria-hidden": "true" })
|
|
5769
5755
|
}
|
|
5770
5756
|
)
|
|
5771
5757
|
}
|
|
@@ -5883,19 +5869,19 @@ function ResponsiveDialog({
|
|
|
5883
5869
|
side,
|
|
5884
5870
|
size = "md"
|
|
5885
5871
|
}) {
|
|
5886
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
5872
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React30.useState(defaultOpen);
|
|
5887
5873
|
const controlled = open !== void 0;
|
|
5888
5874
|
const isOpen = controlled ? open : uncontrolledOpen;
|
|
5889
|
-
const handleOpenChange =
|
|
5875
|
+
const handleOpenChange = React30.useCallback(
|
|
5890
5876
|
(next) => {
|
|
5891
5877
|
if (!controlled) setUncontrolledOpen(next);
|
|
5892
5878
|
onOpenChange?.(next);
|
|
5893
5879
|
},
|
|
5894
5880
|
[controlled, onOpenChange]
|
|
5895
5881
|
);
|
|
5896
|
-
const close =
|
|
5882
|
+
const close = React30.useCallback(() => handleOpenChange(false), [handleOpenChange]);
|
|
5897
5883
|
const hasTitle = title !== void 0 && title !== null && title !== "";
|
|
5898
|
-
|
|
5884
|
+
React30.useEffect(() => {
|
|
5899
5885
|
if (process.env.NODE_ENV === "production" || process.env.NODE_ENV === "test") return;
|
|
5900
5886
|
if (!hasTitle) {
|
|
5901
5887
|
errorOnce(
|
|
@@ -5953,7 +5939,7 @@ var RouteTransition = forwardRef(
|
|
|
5953
5939
|
}
|
|
5954
5940
|
);
|
|
5955
5941
|
RouteTransition.displayName = "RouteTransition";
|
|
5956
|
-
var ScrollArea =
|
|
5942
|
+
var ScrollArea = React30.forwardRef(function ScrollArea2({ className, children, ...props }, ref) {
|
|
5957
5943
|
return /* @__PURE__ */ jsxs(
|
|
5958
5944
|
ScrollAreaPrimitive.Root,
|
|
5959
5945
|
{
|
|
@@ -5976,7 +5962,7 @@ var ScrollArea = React28.forwardRef(function ScrollArea2({ className, children,
|
|
|
5976
5962
|
);
|
|
5977
5963
|
});
|
|
5978
5964
|
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
|
|
5979
|
-
var ScrollBar =
|
|
5965
|
+
var ScrollBar = React30.forwardRef(function ScrollBar2({ className, orientation = "vertical", ...props }, ref) {
|
|
5980
5966
|
return /* @__PURE__ */ jsx(
|
|
5981
5967
|
ScrollAreaPrimitive.ScrollAreaScrollbar,
|
|
5982
5968
|
{
|
|
@@ -6034,7 +6020,7 @@ function searchInputVariants({
|
|
|
6034
6020
|
class: cn(SEARCH_RESET, row, classProp, className) || void 0
|
|
6035
6021
|
});
|
|
6036
6022
|
}
|
|
6037
|
-
var SearchInput =
|
|
6023
|
+
var SearchInput = React30.forwardRef(
|
|
6038
6024
|
function SearchInput2({
|
|
6039
6025
|
value,
|
|
6040
6026
|
onValueChange,
|
|
@@ -6073,20 +6059,20 @@ var SearchInput = React28.forwardRef(
|
|
|
6073
6059
|
"aria-labelledby": ariaLabelledBy,
|
|
6074
6060
|
"aria-describedby": ariaDescribedBy
|
|
6075
6061
|
});
|
|
6076
|
-
const inputRef =
|
|
6062
|
+
const inputRef = React30.useRef(null);
|
|
6077
6063
|
const setRefs = useMergedRefs(ref, wiringRef, inputRef);
|
|
6078
6064
|
const debouncedValue = useDebounce(value, debounceMs);
|
|
6079
|
-
const isFirstRender =
|
|
6080
|
-
|
|
6065
|
+
const isFirstRender = React30.useRef(true);
|
|
6066
|
+
React30.useEffect(() => {
|
|
6081
6067
|
if (isFirstRender.current) {
|
|
6082
6068
|
isFirstRender.current = false;
|
|
6083
6069
|
return;
|
|
6084
6070
|
}
|
|
6085
6071
|
onSearch?.(debouncedValue);
|
|
6086
6072
|
}, [debouncedValue, onSearch]);
|
|
6087
|
-
const latestChange =
|
|
6073
|
+
const latestChange = React30.useRef(onValueChange);
|
|
6088
6074
|
latestChange.current = onValueChange;
|
|
6089
|
-
|
|
6075
|
+
React30.useEffect(() => {
|
|
6090
6076
|
const owner = inputRef.current?.form;
|
|
6091
6077
|
if (!owner) return;
|
|
6092
6078
|
const handle = () => latestChange.current("");
|
|
@@ -6229,20 +6215,20 @@ function SearchSelect({
|
|
|
6229
6215
|
const createNewLabel = createNewLabelProp ?? copy.createNew;
|
|
6230
6216
|
const isSingleMode = value !== void 0 || onValueChange !== void 0;
|
|
6231
6217
|
const closeOnSelect = isSingleMode || closeOnSelectProp;
|
|
6232
|
-
const byId =
|
|
6218
|
+
const byId = React30.useMemo(() => new Map(options.map((o) => [o.id, o])), [options]);
|
|
6233
6219
|
const singleSelectedOption = isSingleMode && value ? byId.get(value) ?? null : null;
|
|
6234
|
-
const selected =
|
|
6220
|
+
const selected = React30.useMemo(
|
|
6235
6221
|
() => isSingleMode ? singleSelectedOption ? [singleSelectedOption] : [] : selectedProp ?? [],
|
|
6236
6222
|
[isSingleMode, singleSelectedOption, selectedProp]
|
|
6237
6223
|
);
|
|
6238
|
-
const selectedIds =
|
|
6239
|
-
const [open, setOpen] =
|
|
6240
|
-
const [search, setSearch] =
|
|
6241
|
-
const [activeChip, setActiveChip] =
|
|
6242
|
-
const hasGroups =
|
|
6243
|
-
const hasLeadingDot =
|
|
6244
|
-
const pinnedSet =
|
|
6245
|
-
const chips =
|
|
6224
|
+
const selectedIds = React30.useMemo(() => selected.map((s) => s.id), [selected]);
|
|
6225
|
+
const [open, setOpen] = React30.useState(false);
|
|
6226
|
+
const [search, setSearch] = React30.useState("");
|
|
6227
|
+
const [activeChip, setActiveChip] = React30.useState(null);
|
|
6228
|
+
const hasGroups = React30.useMemo(() => options.some((o) => o.group != null), [options]);
|
|
6229
|
+
const hasLeadingDot = React30.useMemo(() => options.some((o) => !!o.color), [options]);
|
|
6230
|
+
const pinnedSet = React30.useMemo(() => new Set(pinnedGroups ?? []), [pinnedGroups]);
|
|
6231
|
+
const chips = React30.useMemo(() => {
|
|
6246
6232
|
if (!groupFilter || !hasGroups) return [];
|
|
6247
6233
|
const seen = [];
|
|
6248
6234
|
for (const option of options) {
|
|
@@ -6254,7 +6240,7 @@ function SearchSelect({
|
|
|
6254
6240
|
}, [groupFilter, hasGroups, options, pinnedSet]);
|
|
6255
6241
|
const chipActive = chips.length > 0 && activeChip !== null;
|
|
6256
6242
|
const trimmed = search.trim();
|
|
6257
|
-
const groupCounts =
|
|
6243
|
+
const groupCounts = React30.useMemo(() => {
|
|
6258
6244
|
const counts = /* @__PURE__ */ new Map();
|
|
6259
6245
|
if (!showGroupCounts || trimmed) return counts;
|
|
6260
6246
|
for (const option of options) {
|
|
@@ -6264,7 +6250,7 @@ function SearchSelect({
|
|
|
6264
6250
|
}
|
|
6265
6251
|
return counts;
|
|
6266
6252
|
}, [showGroupCounts, trimmed, options, selectedIds]);
|
|
6267
|
-
const rows =
|
|
6253
|
+
const rows = React30.useMemo(
|
|
6268
6254
|
() => options.filter((option) => !chipActive || option.group === activeChip).map((option) => {
|
|
6269
6255
|
const heading = chipActive ? void 0 : option.group ?? void 0;
|
|
6270
6256
|
const count = heading ? groupCounts.get(heading) : void 0;
|
|
@@ -6287,7 +6273,7 @@ function SearchSelect({
|
|
|
6287
6273
|
};
|
|
6288
6274
|
const singleValue = closeOnSelect ? selected[0] ?? null : null;
|
|
6289
6275
|
const showValue = singleValue !== null && !open;
|
|
6290
|
-
const renderValue =
|
|
6276
|
+
const renderValue = React30.useCallback(
|
|
6291
6277
|
(row) => {
|
|
6292
6278
|
const source = sourceOf(row);
|
|
6293
6279
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -6316,7 +6302,7 @@ function SearchSelect({
|
|
|
6316
6302
|
},
|
|
6317
6303
|
[descriptionVariant]
|
|
6318
6304
|
);
|
|
6319
|
-
const messages =
|
|
6305
|
+
const messages = React30.useMemo(
|
|
6320
6306
|
() => ({
|
|
6321
6307
|
empty: search ? copy.empty : copy.noOptions,
|
|
6322
6308
|
clear: singleValue ? copy.clearNamed(singleValue.label) : copy.clear,
|
|
@@ -6456,7 +6442,7 @@ function SearchSelect({
|
|
|
6456
6442
|
] });
|
|
6457
6443
|
}
|
|
6458
6444
|
SearchSelect.displayName = "SearchSelect";
|
|
6459
|
-
var Separator2 =
|
|
6445
|
+
var Separator2 = React30.forwardRef(function Separator3({ className, orientation = "horizontal", decorative = true, ...props }, ref) {
|
|
6460
6446
|
return /* @__PURE__ */ jsx(
|
|
6461
6447
|
SeparatorPrimitive.Root,
|
|
6462
6448
|
{
|
|
@@ -6593,13 +6579,14 @@ var THUMB_SIZE = {
|
|
|
6593
6579
|
md: "ds:size-4",
|
|
6594
6580
|
lg: "ds:size-(--control-icon-xl)"
|
|
6595
6581
|
};
|
|
6596
|
-
var Slider =
|
|
6582
|
+
var Slider = React30.forwardRef(
|
|
6597
6583
|
function Slider2({
|
|
6598
6584
|
className,
|
|
6599
6585
|
label,
|
|
6600
6586
|
showValue,
|
|
6601
6587
|
size,
|
|
6602
6588
|
invalid,
|
|
6589
|
+
thumbLabels,
|
|
6603
6590
|
id,
|
|
6604
6591
|
name,
|
|
6605
6592
|
disabled,
|
|
@@ -6630,9 +6617,9 @@ var Slider = React28.forwardRef(
|
|
|
6630
6617
|
defaultProp: defaultValue,
|
|
6631
6618
|
onChange: onValueChange
|
|
6632
6619
|
});
|
|
6633
|
-
const initialValue =
|
|
6634
|
-
const rootRef =
|
|
6635
|
-
|
|
6620
|
+
const initialValue = React30.useRef(valueProp ?? defaultValue);
|
|
6621
|
+
const rootRef = React30.useRef(null);
|
|
6622
|
+
useFormReset2(rootRef, () => setValue(initialValue.current), form);
|
|
6636
6623
|
const mergedRef = useMergedRefs(ref, rootRef);
|
|
6637
6624
|
const displayValue = (() => {
|
|
6638
6625
|
const v = value;
|
|
@@ -6643,6 +6630,7 @@ var Slider = React28.forwardRef(
|
|
|
6643
6630
|
const labelledBy = wiring["aria-labelledby"];
|
|
6644
6631
|
const accessibleName = labelledBy ? void 0 : ariaLabel ?? label ?? "Slider value";
|
|
6645
6632
|
const resolvedSize = size ?? "md";
|
|
6633
|
+
const thumbCount = Array.isArray(value) && value.length > 1 ? value.length : 1;
|
|
6646
6634
|
return /* @__PURE__ */ jsxs("div", { className: "ds:w-full", children: [
|
|
6647
6635
|
(label || showValue) && /* @__PURE__ */ jsxs("div", { className: "ds:mb-2 ds:flex ds:items-center ds:justify-between ds:gap-2", children: [
|
|
6648
6636
|
label ? /* @__PURE__ */ jsx(
|
|
@@ -6687,7 +6675,7 @@ var Slider = React28.forwardRef(
|
|
|
6687
6675
|
children: /* @__PURE__ */ jsx(SliderPrimitive.Range, { className: "ds:bg-brand ds:data-[disabled]:bg-fg-disabled ds:absolute ds:h-full" })
|
|
6688
6676
|
}
|
|
6689
6677
|
),
|
|
6690
|
-
/* @__PURE__ */ jsx(
|
|
6678
|
+
Array.from({ length: thumbCount }, (_, index) => /* @__PURE__ */ jsx(
|
|
6691
6679
|
SliderPrimitive.Thumb,
|
|
6692
6680
|
{
|
|
6693
6681
|
className: cn(
|
|
@@ -6701,12 +6689,13 @@ var Slider = React28.forwardRef(
|
|
|
6701
6689
|
"ds:data-[disabled]:pointer-events-none ds:data-[disabled]:cursor-not-allowed",
|
|
6702
6690
|
"ds:data-[disabled]:border-fg-disabled ds:data-[disabled]:bg-bg-disabled"
|
|
6703
6691
|
),
|
|
6704
|
-
"aria-label": accessibleName,
|
|
6705
|
-
"aria-labelledby": labelledBy,
|
|
6692
|
+
"aria-label": thumbLabels?.[index] ?? accessibleName,
|
|
6693
|
+
"aria-labelledby": thumbLabels?.[index] ? void 0 : labelledBy,
|
|
6706
6694
|
"aria-describedby": wiring["aria-describedby"],
|
|
6707
6695
|
"aria-invalid": ariaInvalid ?? wiring["aria-invalid"]
|
|
6708
|
-
}
|
|
6709
|
-
|
|
6696
|
+
},
|
|
6697
|
+
index
|
|
6698
|
+
))
|
|
6710
6699
|
]
|
|
6711
6700
|
}
|
|
6712
6701
|
)
|
|
@@ -6987,7 +6976,7 @@ var StackedBarChart = forwardRef(
|
|
|
6987
6976
|
children: ticks.map((t) => /* @__PURE__ */ jsx(
|
|
6988
6977
|
"span",
|
|
6989
6978
|
{
|
|
6990
|
-
className: "ds:absolute ds:right-0 ds
|
|
6979
|
+
className: "ds:absolute ds:right-0 ds:translate-y-1/2 ds:leading-none",
|
|
6991
6980
|
style: { bottom: `${t / niceMax * 100}%` },
|
|
6992
6981
|
children: formatValue(t)
|
|
6993
6982
|
},
|
|
@@ -7410,7 +7399,9 @@ var StickyActionBar = forwardRef(
|
|
|
7410
7399
|
className: cn(
|
|
7411
7400
|
mode === "fixed" ? "ds:fixed" : "ds:sticky",
|
|
7412
7401
|
"ds:inset-x-0 ds:z-[calc(var(--z-base)+20)] ds:flex ds:flex-wrap ds:items-center ds:gap-3",
|
|
7413
|
-
|
|
7402
|
+
// Translucent only where the blur behind it exists; an opaque bar
|
|
7403
|
+
// otherwise, so page content never shows through un-blurred.
|
|
7404
|
+
"ds:border-t ds:border-rule ds:bg-surface ds:px-4 ds:py-3 ds:backdrop-blur-md ds:sm:px-6",
|
|
7414
7405
|
"ds:supports-[backdrop-filter]:bg-surface/80",
|
|
7415
7406
|
offsetForMobileNav ? "ds:bottom-[calc(3.5rem_+_env(safe-area-inset-bottom))] ds:sm:bottom-0" : "ds:bottom-0",
|
|
7416
7407
|
className
|
|
@@ -7539,6 +7530,55 @@ var SuiteProgress = forwardRef(function SuiteProgress2({
|
|
|
7539
7530
|
);
|
|
7540
7531
|
});
|
|
7541
7532
|
SuiteProgress.displayName = "SuiteProgress";
|
|
7533
|
+
var TableDensityToggle = React30.forwardRef(
|
|
7534
|
+
function TableDensityToggle2({
|
|
7535
|
+
value,
|
|
7536
|
+
onValueChange,
|
|
7537
|
+
size = "sm",
|
|
7538
|
+
messages: messagesOverride,
|
|
7539
|
+
"aria-label": ariaLabel,
|
|
7540
|
+
"aria-labelledby": ariaLabelledBy,
|
|
7541
|
+
className
|
|
7542
|
+
}, ref) {
|
|
7543
|
+
const messages = useDsMessages("tableDensity", messagesOverride);
|
|
7544
|
+
const itemClassName = "ds:aspect-square ds:px-0 ds:[&_svg]:size-4";
|
|
7545
|
+
return /* @__PURE__ */ jsxs(
|
|
7546
|
+
ToggleGroup,
|
|
7547
|
+
{
|
|
7548
|
+
ref,
|
|
7549
|
+
type: "single",
|
|
7550
|
+
variant: "segmented",
|
|
7551
|
+
size,
|
|
7552
|
+
value,
|
|
7553
|
+
onValueChange: (next) => {
|
|
7554
|
+
if (next) onValueChange(next);
|
|
7555
|
+
},
|
|
7556
|
+
"aria-label": ariaLabelledBy ? void 0 : ariaLabel ?? messages.label,
|
|
7557
|
+
"aria-labelledby": ariaLabelledBy,
|
|
7558
|
+
className,
|
|
7559
|
+
children: [
|
|
7560
|
+
/* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
7561
|
+
/* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
7562
|
+
ToggleGroupItem,
|
|
7563
|
+
{
|
|
7564
|
+
value: "comfortable",
|
|
7565
|
+
"aria-label": messages.comfortable,
|
|
7566
|
+
className: itemClassName,
|
|
7567
|
+
children: /* @__PURE__ */ jsx(RowsIcon, {})
|
|
7568
|
+
}
|
|
7569
|
+
) }),
|
|
7570
|
+
/* @__PURE__ */ jsx(TooltipContent, { children: messages.comfortable })
|
|
7571
|
+
] }),
|
|
7572
|
+
/* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
7573
|
+
/* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(ToggleGroupItem, { value: "compact", "aria-label": messages.compact, className: itemClassName, children: /* @__PURE__ */ jsx(Rows4Icon, {}) }) }),
|
|
7574
|
+
/* @__PURE__ */ jsx(TooltipContent, { children: messages.compact })
|
|
7575
|
+
] })
|
|
7576
|
+
]
|
|
7577
|
+
}
|
|
7578
|
+
);
|
|
7579
|
+
}
|
|
7580
|
+
);
|
|
7581
|
+
TableDensityToggle.displayName = "TableDensityToggle";
|
|
7542
7582
|
var ToastContext = createContext(null);
|
|
7543
7583
|
function useToast() {
|
|
7544
7584
|
const ctx = useContext(ToastContext);
|
|
@@ -8194,7 +8234,7 @@ var StatusBadge = forwardRef(function StatusBadge2({
|
|
|
8194
8234
|
className: cn(
|
|
8195
8235
|
"ds:inline-flex ds:shrink-0 ds:items-center ds:justify-center",
|
|
8196
8236
|
// The dot is its own 6px box, as on Badge; glyphs and the spinner sit in the 14px icon box.
|
|
8197
|
-
!showDot && "ds:size-3.5"
|
|
8237
|
+
!showDot && "ds:size-3.5 ds:[&>svg]:max-h-full ds:[&>svg]:max-w-full"
|
|
8198
8238
|
),
|
|
8199
8239
|
"aria-hidden": "true",
|
|
8200
8240
|
children: indicator
|
|
@@ -8285,6 +8325,9 @@ function MultiSelect(props) {
|
|
|
8285
8325
|
return /* @__PURE__ */ jsx(Combobox, { ...props, multiple: true });
|
|
8286
8326
|
}
|
|
8287
8327
|
MultiSelect.displayName = "MultiSelect";
|
|
8328
|
+
|
|
8329
|
+
// src/foundation/use-reduced-motion.ts
|
|
8330
|
+
var REDUCED_MOTION_QUERY = "(prefers-reduced-motion: reduce)";
|
|
8288
8331
|
var statusLabel = {
|
|
8289
8332
|
"not-started": "Not started",
|
|
8290
8333
|
"in-progress": "In progress",
|
|
@@ -8333,8 +8376,9 @@ var QuestionnairePanel = forwardRef(
|
|
|
8333
8376
|
const selectedCardRef = useRef(null);
|
|
8334
8377
|
const titleId = useId();
|
|
8335
8378
|
useEffect(() => {
|
|
8379
|
+
const reduce = typeof window !== "undefined" && window.matchMedia?.(REDUCED_MOTION_QUERY).matches;
|
|
8336
8380
|
selectedCardRef.current?.scrollIntoView({
|
|
8337
|
-
behavior: "smooth",
|
|
8381
|
+
behavior: reduce ? "auto" : "smooth",
|
|
8338
8382
|
block: "center",
|
|
8339
8383
|
inline: "center"
|
|
8340
8384
|
});
|
|
@@ -8369,7 +8413,7 @@ var QuestionnairePanel = forwardRef(
|
|
|
8369
8413
|
"aria-expanded": isOpen,
|
|
8370
8414
|
className: cn(
|
|
8371
8415
|
"ds:text-brand ds:flex ds:h-8 ds:w-full ds:items-center ds:gap-2 ds:px-4 ds:text-left ds:text-[11px] ds:font-bold ds:tracking-[0.08em] ds:uppercase",
|
|
8372
|
-
"ds:hover:bg-brand-bg/50 ds:transition-colors ds:duration-[var(--duration-
|
|
8416
|
+
"ds:hover:bg-brand-bg/50 ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
8373
8417
|
"ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none"
|
|
8374
8418
|
),
|
|
8375
8419
|
children: [
|
|
@@ -8381,7 +8425,7 @@ var QuestionnairePanel = forwardRef(
|
|
|
8381
8425
|
size: 13,
|
|
8382
8426
|
"aria-hidden": "true",
|
|
8383
8427
|
className: cn(
|
|
8384
|
-
"ds:text-brand ds:transition-transform ds:duration-[var(--duration-
|
|
8428
|
+
"ds:text-brand ds:transition-transform ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
8385
8429
|
!isOpen && "ds:-rotate-90"
|
|
8386
8430
|
)
|
|
8387
8431
|
}
|
|
@@ -8400,7 +8444,7 @@ var QuestionnairePanel = forwardRef(
|
|
|
8400
8444
|
"data-active": selected ? "true" : void 0,
|
|
8401
8445
|
className: cn(
|
|
8402
8446
|
"ds:group ds:flex ds:h-8 ds:w-full ds:items-center ds:gap-3 ds:px-5 ds:text-left",
|
|
8403
|
-
"ds:text-fg-2 ds:transition-colors ds:duration-[var(--duration-
|
|
8447
|
+
"ds:text-fg-2 ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
8404
8448
|
"ds:hover:bg-surface-hover ds:hover:text-fg",
|
|
8405
8449
|
"ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
|
|
8406
8450
|
selected && "ds:bg-brand-bg ds:text-brand ds:font-semibold"
|
|
@@ -8639,7 +8683,9 @@ var FolderTree = forwardRef(function FolderTree2({ nodes, activeId, onSelect, de
|
|
|
8639
8683
|
toggle(node.id);
|
|
8640
8684
|
},
|
|
8641
8685
|
className: cn(
|
|
8642
|
-
"ds:shrink-0 ds:text-fg-4 ds:
|
|
8686
|
+
"ds:shrink-0 ds:rounded-icon ds:text-fg-4 ds:hover:text-fg-2",
|
|
8687
|
+
"ds:transition-[color,transform] ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
8688
|
+
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
8643
8689
|
isOpen && "ds:rotate-90"
|
|
8644
8690
|
),
|
|
8645
8691
|
children: /* @__PURE__ */ jsx(ChevronRightIcon, { size: 13, "aria-hidden": "true" })
|
|
@@ -8714,7 +8760,13 @@ function SegmentedControl({
|
|
|
8714
8760
|
...disabled !== void 0 && { disabled },
|
|
8715
8761
|
"aria-label": aria["aria-label"],
|
|
8716
8762
|
"aria-labelledby": aria["aria-labelledby"],
|
|
8717
|
-
className: cn(
|
|
8763
|
+
className: cn(
|
|
8764
|
+
// `segmented` gets its track chrome from `ToggleGroup` itself
|
|
8765
|
+
// (quiet surface-sunken well, control radius, hairline border) —
|
|
8766
|
+
// this preset's own bare pill track is the `default`/`outline` look.
|
|
8767
|
+
variant === "segmented" ? void 0 : "ds:bg-bg-2 ds:rounded-pill ds:p-0.5",
|
|
8768
|
+
className
|
|
8769
|
+
),
|
|
8718
8770
|
children: options.map((option) => /* @__PURE__ */ jsxs(
|
|
8719
8771
|
ToggleGroupItem,
|
|
8720
8772
|
{
|
|
@@ -8783,6 +8835,195 @@ var Content6 = forwardRef(function Content7({ padding = "default", padTop, padBo
|
|
|
8783
8835
|
);
|
|
8784
8836
|
});
|
|
8785
8837
|
Content6.displayName = "Content";
|
|
8838
|
+
function matchesPath(href, currentPath, mode = "prefix") {
|
|
8839
|
+
if (currentPath === href) return true;
|
|
8840
|
+
if (mode === "exact") return false;
|
|
8841
|
+
return currentPath.startsWith(href.endsWith("/") ? href : `${href}/`);
|
|
8842
|
+
}
|
|
8843
|
+
function findActiveId(sections, currentPath) {
|
|
8844
|
+
let activeId = null;
|
|
8845
|
+
let longest = -1;
|
|
8846
|
+
const visit = (items) => {
|
|
8847
|
+
for (const item of items) {
|
|
8848
|
+
if (matchesPath(item.href, currentPath, item.match) && item.href.length > longest) {
|
|
8849
|
+
longest = item.href.length;
|
|
8850
|
+
activeId = item.id;
|
|
8851
|
+
}
|
|
8852
|
+
if (item.children) visit(item.children);
|
|
8853
|
+
}
|
|
8854
|
+
};
|
|
8855
|
+
for (const section of sections) visit(section.items);
|
|
8856
|
+
return activeId;
|
|
8857
|
+
}
|
|
8858
|
+
function hasActiveDescendant(item, activeId) {
|
|
8859
|
+
if (!item.children || activeId == null) return false;
|
|
8860
|
+
return item.children.some((child) => child.id === activeId || hasActiveDescendant(child, activeId));
|
|
8861
|
+
}
|
|
8862
|
+
var TRUNCATED_LABEL_CLASSNAME = "ds:line-clamp-none ds:truncate";
|
|
8863
|
+
function getNodeText(node) {
|
|
8864
|
+
if (node == null || typeof node === "boolean") return "";
|
|
8865
|
+
if (typeof node === "string" || typeof node === "number") return String(node);
|
|
8866
|
+
if (Array.isArray(node)) return node.map(getNodeText).filter(Boolean).join(" ");
|
|
8867
|
+
if (React30.isValidElement(node)) {
|
|
8868
|
+
return getNodeText(node.props.children);
|
|
8869
|
+
}
|
|
8870
|
+
return "";
|
|
8871
|
+
}
|
|
8872
|
+
function getAccessibleLabel(item) {
|
|
8873
|
+
const parts = [getNodeText(item.label), item.badge != null ? getNodeText(item.badge) : ""];
|
|
8874
|
+
return parts.filter(Boolean).join(", ") || void 0;
|
|
8875
|
+
}
|
|
8876
|
+
function AppSidebarItemContent({ item, showTitle }) {
|
|
8877
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
8878
|
+
item.icon,
|
|
8879
|
+
/* @__PURE__ */ jsx(
|
|
8880
|
+
SidebarLinkLabel,
|
|
8881
|
+
{
|
|
8882
|
+
className: TRUNCATED_LABEL_CLASSNAME,
|
|
8883
|
+
title: showTitle && typeof item.label === "string" ? item.label : void 0,
|
|
8884
|
+
children: item.label
|
|
8885
|
+
}
|
|
8886
|
+
),
|
|
8887
|
+
item.badge != null && /* @__PURE__ */ jsx(SidebarLinkBadge, { tone: item.badgeTone, children: item.badge })
|
|
8888
|
+
] });
|
|
8889
|
+
}
|
|
8890
|
+
function AppSidebarLeafLink({
|
|
8891
|
+
item,
|
|
8892
|
+
active,
|
|
8893
|
+
showTitle,
|
|
8894
|
+
RouterLink
|
|
8895
|
+
}) {
|
|
8896
|
+
return /* @__PURE__ */ jsx(SidebarLink, { asChild: true, active, "aria-label": getAccessibleLabel(item), children: /* @__PURE__ */ jsx(RouterLink, { href: item.href, ...item.linkProps, children: /* @__PURE__ */ jsx(AppSidebarItemContent, { item, showTitle }) }) });
|
|
8897
|
+
}
|
|
8898
|
+
function AppSidebarRow({
|
|
8899
|
+
item,
|
|
8900
|
+
activeId,
|
|
8901
|
+
showTitle,
|
|
8902
|
+
RouterLink
|
|
8903
|
+
}) {
|
|
8904
|
+
const active = item.id === activeId;
|
|
8905
|
+
if (!item.children || item.children.length === 0) {
|
|
8906
|
+
return /* @__PURE__ */ jsx(AppSidebarLeafLink, { item, active, showTitle, RouterLink });
|
|
8907
|
+
}
|
|
8908
|
+
return /* @__PURE__ */ jsx(
|
|
8909
|
+
SidebarLinkGroup,
|
|
8910
|
+
{
|
|
8911
|
+
id: item.id,
|
|
8912
|
+
icon: item.icon,
|
|
8913
|
+
label: (
|
|
8914
|
+
// `SidebarLinkGroup` wraps `label` in its own frozen `line-clamp-1`
|
|
8915
|
+
// span (not ours to override via className), so truncation has to
|
|
8916
|
+
// come from this inner block instead: a definite width (`w-full`)
|
|
8917
|
+
// plus the standard ellipsis trio truncates regardless of the
|
|
8918
|
+
// ancestor's `-webkit-box` display.
|
|
8919
|
+
/* @__PURE__ */ jsx(
|
|
8920
|
+
"span",
|
|
8921
|
+
{
|
|
8922
|
+
className: "ds:block ds:w-full ds:truncate",
|
|
8923
|
+
title: showTitle && typeof item.label === "string" ? item.label : void 0,
|
|
8924
|
+
children: item.label
|
|
8925
|
+
}
|
|
8926
|
+
)
|
|
8927
|
+
),
|
|
8928
|
+
href: item.href,
|
|
8929
|
+
active,
|
|
8930
|
+
defaultOpen: active || hasActiveDescendant(item, activeId),
|
|
8931
|
+
children: item.children.map((child) => /* @__PURE__ */ jsx(AppSidebarRow, { item: child, activeId, showTitle, RouterLink }, child.id))
|
|
8932
|
+
}
|
|
8933
|
+
);
|
|
8934
|
+
}
|
|
8935
|
+
function AppSidebarNav({
|
|
8936
|
+
sections,
|
|
8937
|
+
currentPath,
|
|
8938
|
+
sectionClassName,
|
|
8939
|
+
collapsible = false
|
|
8940
|
+
}) {
|
|
8941
|
+
const RouterLink = useLinkComponent() ?? PlainLink;
|
|
8942
|
+
const activeId = React30.useMemo(() => findActiveId(sections, currentPath), [sections, currentPath]);
|
|
8943
|
+
const { state } = useSidebarState();
|
|
8944
|
+
const showTitle = !(collapsible && state === "rail");
|
|
8945
|
+
return /* @__PURE__ */ jsx(Fragment, { children: sections.map((section) => /* @__PURE__ */ jsx(
|
|
8946
|
+
SidebarSection,
|
|
8947
|
+
{
|
|
8948
|
+
label: section.label,
|
|
8949
|
+
headerActions: section.headerActions,
|
|
8950
|
+
className: sectionClassName,
|
|
8951
|
+
children: section.items.map((item) => /* @__PURE__ */ jsx(
|
|
8952
|
+
AppSidebarRow,
|
|
8953
|
+
{
|
|
8954
|
+
item,
|
|
8955
|
+
activeId,
|
|
8956
|
+
showTitle,
|
|
8957
|
+
RouterLink
|
|
8958
|
+
},
|
|
8959
|
+
item.id
|
|
8960
|
+
))
|
|
8961
|
+
},
|
|
8962
|
+
section.id
|
|
8963
|
+
)) });
|
|
8964
|
+
}
|
|
8965
|
+
AppSidebarNav.displayName = "AppSidebarNav";
|
|
8966
|
+
var AppSidebar = React30.forwardRef(function AppSidebar2({
|
|
8967
|
+
sections,
|
|
8968
|
+
currentPath,
|
|
8969
|
+
sectionClassName,
|
|
8970
|
+
brand,
|
|
8971
|
+
footer,
|
|
8972
|
+
user,
|
|
8973
|
+
variant = "flush",
|
|
8974
|
+
collapsible,
|
|
8975
|
+
className,
|
|
8976
|
+
classNames,
|
|
8977
|
+
...props
|
|
8978
|
+
}, ref) {
|
|
8979
|
+
return /* @__PURE__ */ jsxs(
|
|
8980
|
+
Sidebar,
|
|
8981
|
+
{
|
|
8982
|
+
ref,
|
|
8983
|
+
variant,
|
|
8984
|
+
...collapsible !== void 0 && { collapsible },
|
|
8985
|
+
className: cn(classNames?.root, className),
|
|
8986
|
+
...props,
|
|
8987
|
+
children: [
|
|
8988
|
+
brand,
|
|
8989
|
+
/* @__PURE__ */ jsx(
|
|
8990
|
+
AppSidebarNav,
|
|
8991
|
+
{
|
|
8992
|
+
sections,
|
|
8993
|
+
currentPath,
|
|
8994
|
+
sectionClassName: cn(classNames?.section, sectionClassName),
|
|
8995
|
+
collapsible
|
|
8996
|
+
}
|
|
8997
|
+
),
|
|
8998
|
+
(footer != null || user != null) && /* @__PURE__ */ jsxs(SidebarFooter, { className: "ds:mt-auto ds:border-t-0 ds:px-0 ds:pt-2 ds:pb-0", children: [
|
|
8999
|
+
footer,
|
|
9000
|
+
user != null && /* @__PURE__ */ jsx(
|
|
9001
|
+
"div",
|
|
9002
|
+
{
|
|
9003
|
+
className: cn(
|
|
9004
|
+
"ds:flex ds:w-full ds:min-w-0 ds:items-center ds:gap-2.5 ds:border-rule ds:border-t ds:px-2 ds:pt-2.5",
|
|
9005
|
+
// <SidebarUser> already renders a 28px avatar (`size="sm"`)
|
|
9006
|
+
// and a 13px/medium name — both already the body-sm role's
|
|
9007
|
+
// computed size. Only the subtitle moves off its default
|
|
9008
|
+
// fg-4/mono treatment, reached through the part's own
|
|
9009
|
+
// `data-slot` (ADR-008) instead of a second copy of
|
|
9010
|
+
// SidebarUser's markup.
|
|
9011
|
+
"ds:[&_[data-slot=sidebar-user-subtitle]]:font-sans ds:[&_[data-slot=sidebar-user-subtitle]]:text-caption ds:[&_[data-slot=sidebar-user-subtitle]]:text-fg-3",
|
|
9012
|
+
// Rail: the card's border/padding has nothing left to frame
|
|
9013
|
+
// once the name/subtitle collapse to a lone avatar —
|
|
9014
|
+
// <SidebarUser> already carries `data-collapsed` for it.
|
|
9015
|
+
"ds:has-[[data-collapsed]]:border-0 ds:has-[[data-collapsed]]:px-0 ds:has-[[data-collapsed]]:pt-0",
|
|
9016
|
+
classNames?.footer
|
|
9017
|
+
),
|
|
9018
|
+
children: /* @__PURE__ */ jsx(SidebarUser, { ...user })
|
|
9019
|
+
}
|
|
9020
|
+
)
|
|
9021
|
+
] })
|
|
9022
|
+
]
|
|
9023
|
+
}
|
|
9024
|
+
);
|
|
9025
|
+
});
|
|
9026
|
+
AppSidebar.displayName = "AppSidebar";
|
|
8786
9027
|
var AppHeader = forwardRef(function AppHeader2({ className, ...props }, ref) {
|
|
8787
9028
|
return /* @__PURE__ */ jsx(
|
|
8788
9029
|
"header",
|
|
@@ -9402,7 +9643,12 @@ var KanbanColumn = forwardRef(function KanbanColumn2({ title, count, className,
|
|
|
9402
9643
|
KanbanColumn.displayName = "KanbanColumn";
|
|
9403
9644
|
var kanbanCardBase = cn(
|
|
9404
9645
|
"ds:bg-surface ds:border ds:border-rule ds:rounded-card ds:shadow-quiet ds:p-3 ds:space-y-2 ds:cursor-grab",
|
|
9405
|
-
|
|
9646
|
+
// Card `interactive`'s lift (F14): a shadow step, no geometry, so a column
|
|
9647
|
+
// never jitters under the pointer.
|
|
9648
|
+
"ds:transition-[border-color,box-shadow] ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:hover:border-rule-strong ds:hover:shadow-raised ds:motion-reduce:transition-none",
|
|
9649
|
+
"ds:active:cursor-grabbing",
|
|
9650
|
+
// Drag libraries (dnd-kit, @hello-pangea/dnd) make the card focusable.
|
|
9651
|
+
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]"
|
|
9406
9652
|
);
|
|
9407
9653
|
var priorityConfig = {
|
|
9408
9654
|
high: { label: "High", variant: "destructive" },
|
|
@@ -9458,7 +9704,7 @@ var MessageBubble = forwardRef(function MessageBubble2({ avatar, name, timestamp
|
|
|
9458
9704
|
"span",
|
|
9459
9705
|
{
|
|
9460
9706
|
className: cn(
|
|
9461
|
-
"ds:ml-auto ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none",
|
|
9707
|
+
"ds:ml-auto ds:opacity-0 ds:transition-opacity ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
9462
9708
|
"ds:group-hover/bubble:opacity-100 ds:group-focus-within/bubble:opacity-100"
|
|
9463
9709
|
),
|
|
9464
9710
|
children: actions
|
|
@@ -9504,7 +9750,9 @@ var MessageBubbleAction = forwardRef(
|
|
|
9504
9750
|
ref,
|
|
9505
9751
|
type,
|
|
9506
9752
|
className: cn(
|
|
9507
|
-
"ds:text-fg-4 ds:text-[10px] ds:
|
|
9753
|
+
"ds:text-fg-4 ds:text-[10px] ds:rounded-badge",
|
|
9754
|
+
"ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
9755
|
+
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
9508
9756
|
destructive ? "ds:hover:text-danger-fg" : "ds:hover:text-fg",
|
|
9509
9757
|
className
|
|
9510
9758
|
),
|
|
@@ -9568,7 +9816,9 @@ var MessageComposer = forwardRef(
|
|
|
9568
9816
|
className: cn(
|
|
9569
9817
|
"ds:relative ds:flex ds:flex-col",
|
|
9570
9818
|
"ds:border-rule ds:bg-input-background ds:rounded-xl ds:border",
|
|
9571
|
-
|
|
9819
|
+
// Border, fill and shadow move together on focus-within; transitioning the
|
|
9820
|
+
// shadow alone let the border and fill snap.
|
|
9821
|
+
"ds:transition-[border-color,background-color,box-shadow] ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
9572
9822
|
"ds:focus-within:border-accent-ring ds:focus-within:bg-surface ds:focus-within:shadow-flat",
|
|
9573
9823
|
isDisabled && "ds:pointer-events-none ds:opacity-60",
|
|
9574
9824
|
className
|
|
@@ -9584,16 +9834,17 @@ var MessageComposer = forwardRef(
|
|
|
9584
9834
|
className: "ds:flex ds:w-full ds:gap-1.5 ds:overflow-x-auto",
|
|
9585
9835
|
style: { maskImage, WebkitMaskImage: maskImage },
|
|
9586
9836
|
children: chipsLoading ? Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx(
|
|
9587
|
-
|
|
9837
|
+
Skeleton,
|
|
9588
9838
|
{
|
|
9589
9839
|
"aria-hidden": "true",
|
|
9590
|
-
className: "ds:
|
|
9840
|
+
className: "ds:h-6 ds:w-20 ds:shrink-0 ds:rounded-full"
|
|
9591
9841
|
},
|
|
9592
9842
|
i
|
|
9593
9843
|
)) : chips.map((chip) => /* @__PURE__ */ jsx(
|
|
9594
9844
|
"button",
|
|
9595
9845
|
{
|
|
9596
9846
|
type: "button",
|
|
9847
|
+
disabled: isDisabled,
|
|
9597
9848
|
onClick: () => onChipPick?.(chip),
|
|
9598
9849
|
title: chip.label,
|
|
9599
9850
|
className: cn(
|
|
@@ -9663,7 +9914,7 @@ var NotificationPanelHeader = forwardRef(
|
|
|
9663
9914
|
{
|
|
9664
9915
|
type: "button",
|
|
9665
9916
|
onClick: onMarkAllRead,
|
|
9666
|
-
className: "ds:text-brand ds:rounded-md ds:px-1.5 ds:py-1 ds:text-sm ds:font-medium ds:hover:bg-[
|
|
9917
|
+
className: "ds:text-brand ds:rounded-md ds:px-1.5 ds:py-1 ds:text-sm ds:font-medium ds:hover:bg-brand-bg ds:active:bg-brand-bg-hover ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none ds:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
9667
9918
|
children: "Mark all read"
|
|
9668
9919
|
}
|
|
9669
9920
|
),
|
|
@@ -9673,7 +9924,7 @@ var NotificationPanelHeader = forwardRef(
|
|
|
9673
9924
|
type: "button",
|
|
9674
9925
|
onClick: onSettings,
|
|
9675
9926
|
"aria-label": "Notification settings",
|
|
9676
|
-
className: "ds:text-fg-3 ds:hover:text-fg ds:hover:bg-surface-hover ds:rounded-md ds:p-1 ds:[&_svg]:size-[15px]",
|
|
9927
|
+
className: "ds:text-fg-3 ds:hover:text-fg ds:hover:bg-surface-hover ds:active:bg-control-active-bg ds:rounded-md ds:p-1 ds:[&_svg]:size-[15px] ds:transition-colors ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
9677
9928
|
children: /* @__PURE__ */ jsx(SettingsIcon, {})
|
|
9678
9929
|
}
|
|
9679
9930
|
)
|
|
@@ -9707,8 +9958,9 @@ var NotificationFilter = forwardRef(
|
|
|
9707
9958
|
onClick: () => onValueChange(option),
|
|
9708
9959
|
"aria-pressed": selected,
|
|
9709
9960
|
className: cn(
|
|
9710
|
-
"ds:inline-flex ds:items-center ds:gap-1.5 ds:rounded-lg ds:px-2.5 ds:py-1 ds:capitalize
|
|
9711
|
-
"ds:
|
|
9961
|
+
"ds:inline-flex ds:items-center ds:gap-1.5 ds:rounded-lg ds:px-2.5 ds:py-1 ds:capitalize",
|
|
9962
|
+
"ds:transition-[color,background-color,box-shadow] ds:duration-[var(--motion-duration-feedback)] ds:ease-[var(--motion-ease-enter)] ds:motion-reduce:transition-none",
|
|
9963
|
+
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
9712
9964
|
selected ? "ds:bg-surface ds:text-brand ds:ring-1 ds:ring-[color:var(--color-brand-line)]" : "ds:text-fg-3 ds:hover:text-fg"
|
|
9713
9965
|
),
|
|
9714
9966
|
children: [
|
|
@@ -9781,7 +10033,9 @@ var NotificationItem = forwardRef(
|
|
|
9781
10033
|
className: cn(
|
|
9782
10034
|
"ds:flex ds:w-full ds:gap-3 ds:px-4 ds:py-3 ds:text-left ds:outline-none",
|
|
9783
10035
|
"ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
9784
|
-
unread ? "ds:bg-brand-bg ds:hover:bg-brand-bg-hover ds:focus-visible:bg-brand-bg-hover" : "ds:hover:bg-surface-hover/60 ds:focus-visible:bg-
|
|
10036
|
+
unread ? "ds:bg-brand-bg ds:hover:bg-brand-bg-hover ds:focus-visible:bg-brand-bg-hover" : "ds:hover:bg-surface-hover/60 ds:focus-visible:bg-surface-hover/60",
|
|
10037
|
+
// Rows stack edge to edge, so focus is an inset outline (TableRow's).
|
|
10038
|
+
"ds:focus-visible:outline-2 ds:focus-visible:-outline-offset-2 ds:focus-visible:outline-[var(--focus-ring-border)]",
|
|
9785
10039
|
className
|
|
9786
10040
|
),
|
|
9787
10041
|
...props,
|
|
@@ -9835,7 +10089,7 @@ var NotificationPanelFooter = forwardRef(
|
|
|
9835
10089
|
className: cn(
|
|
9836
10090
|
"ds:border-rule ds:text-fg ds:hover:bg-surface-hover ds:w-full ds:border-t ds:px-4 ds:py-3 ds:text-center ds:text-sm ds:font-medium",
|
|
9837
10091
|
"ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
|
|
9838
|
-
"ds:focus-visible:
|
|
10092
|
+
"ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
|
|
9839
10093
|
className
|
|
9840
10094
|
),
|
|
9841
10095
|
...props,
|
|
@@ -9894,7 +10148,7 @@ var FilterChip = forwardRef(function FilterChip2({ active = false, size, count,
|
|
|
9894
10148
|
);
|
|
9895
10149
|
});
|
|
9896
10150
|
FilterChip.displayName = "FilterChip";
|
|
9897
|
-
var BulkActionBarContext =
|
|
10151
|
+
var BulkActionBarContext = React30.createContext({ tone: "surface" });
|
|
9898
10152
|
function actionClasses(tone, destructive) {
|
|
9899
10153
|
const base = cn(
|
|
9900
10154
|
"ds:inline-flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-btn ds:px-3 ds:text-[13px] ds:font-medium",
|
|
@@ -9907,18 +10161,18 @@ function actionClasses(tone, destructive) {
|
|
|
9907
10161
|
if (tone === "inverse") {
|
|
9908
10162
|
return cn(
|
|
9909
10163
|
base,
|
|
9910
|
-
"ds:data-[state=open]:bg-selection-floating-active-bg",
|
|
10164
|
+
"ds:data-[state=open]:bg-selection-floating-active-bg ds:aria-expanded:bg-selection-floating-active-bg",
|
|
9911
10165
|
destructive ? "ds:bg-danger-fg ds:text-fg-on-danger ds:hover:bg-danger-fg-hover ds:active:bg-danger-fg-active" : "ds:text-selection-floating-muted-fg ds:hover:bg-selection-floating-hover-bg ds:hover:text-selection-floating-fg"
|
|
9912
10166
|
);
|
|
9913
10167
|
}
|
|
9914
10168
|
return cn(
|
|
9915
10169
|
base,
|
|
9916
|
-
"ds:data-[state=open]:bg-control-active-bg",
|
|
10170
|
+
"ds:data-[state=open]:bg-control-active-bg ds:aria-expanded:bg-control-active-bg",
|
|
9917
10171
|
destructive ? "ds:text-control-destructive-fg ds:hover:bg-control-destructive-hover-bg" : "ds:text-control-fg ds:hover:bg-control-hover-bg ds:hover:text-control-hover-fg"
|
|
9918
10172
|
);
|
|
9919
10173
|
}
|
|
9920
|
-
var BulkActionBarAction =
|
|
9921
|
-
const { tone } =
|
|
10174
|
+
var BulkActionBarAction = React30.forwardRef(function BulkActionBarAction2({ asChild = false, destructive, className, type, ...props }, ref) {
|
|
10175
|
+
const { tone } = React30.use(BulkActionBarContext);
|
|
9922
10176
|
const Comp = asChild ? Slot : "button";
|
|
9923
10177
|
return /* @__PURE__ */ jsx(
|
|
9924
10178
|
Comp,
|
|
@@ -9932,7 +10186,7 @@ var BulkActionBarAction = React28.forwardRef(function BulkActionBarAction2({ asC
|
|
|
9932
10186
|
});
|
|
9933
10187
|
BulkActionBarAction.displayName = "BulkActionBarAction";
|
|
9934
10188
|
function BulkActionBarSeparator({ className }) {
|
|
9935
|
-
const { tone } =
|
|
10189
|
+
const { tone } = React30.use(BulkActionBarContext);
|
|
9936
10190
|
return /* @__PURE__ */ jsx(
|
|
9937
10191
|
"span",
|
|
9938
10192
|
{
|
|
@@ -9945,6 +10199,7 @@ function BulkActionBarSeparator({ className }) {
|
|
|
9945
10199
|
}
|
|
9946
10200
|
);
|
|
9947
10201
|
}
|
|
10202
|
+
var BAR_ENTER = "ds:motion-safe:animate-in ds:motion-safe:fade-in-0 ds:motion-safe:slide-in-from-bottom-2 ds:duration-[var(--motion-duration-overlay)] ds:ease-[var(--motion-ease-enter)]";
|
|
9948
10203
|
function BulkActionBarClear({
|
|
9949
10204
|
variant,
|
|
9950
10205
|
clearLabel,
|
|
@@ -9990,7 +10245,7 @@ function BulkActionBar({
|
|
|
9990
10245
|
const labelText = label ?? `${selectedCount} selected`;
|
|
9991
10246
|
const tone = variant === "page-floating" ? "inverse" : "surface";
|
|
9992
10247
|
const content = /* @__PURE__ */ jsxs(BulkActionBarContext, { value: { tone }, children: [
|
|
9993
|
-
/* @__PURE__ */ jsx("span", { className: "ds:text-sm ds:font-medium ds:tabular-nums", children: labelText }),
|
|
10248
|
+
/* @__PURE__ */ jsx("span", { className: "ds:text-sm ds:font-medium ds:tabular-nums ds:whitespace-nowrap", children: labelText }),
|
|
9994
10249
|
/* @__PURE__ */ jsx(BulkActionBarSeparator, {}),
|
|
9995
10250
|
/* @__PURE__ */ jsx("div", { className: "ds:flex ds:flex-wrap ds:items-center ds:gap-1", children }),
|
|
9996
10251
|
/* @__PURE__ */ jsx("div", { className: "ds:min-w-2 ds:flex-1" }),
|
|
@@ -10014,7 +10269,7 @@ function BulkActionBar({
|
|
|
10014
10269
|
),
|
|
10015
10270
|
...props,
|
|
10016
10271
|
children: [
|
|
10017
|
-
/* @__PURE__ */ jsx("div", { className: "ds:border-rule ds:bg-surface ds:text-fg ds:flex ds:items-center ds:gap-3 ds:rounded-card ds:border ds:px-6 ds:py-3 ds:shadow-card", children: content }),
|
|
10272
|
+
/* @__PURE__ */ jsx("div", { className: cn("ds:border-rule ds:bg-surface ds:text-fg ds:flex ds:items-center ds:gap-3 ds:rounded-card ds:border ds:px-6 ds:py-3 ds:shadow-card", BAR_ENTER), children: content }),
|
|
10018
10273
|
footer
|
|
10019
10274
|
]
|
|
10020
10275
|
}
|
|
@@ -10030,7 +10285,7 @@ function BulkActionBar({
|
|
|
10030
10285
|
),
|
|
10031
10286
|
...props,
|
|
10032
10287
|
children: [
|
|
10033
|
-
/* @__PURE__ */ jsx("div", { className: "ds:bg-selection-floating-bg ds:text-selection-floating-fg ds:flex ds:items-center ds:gap-2 ds:rounded-card ds:px-3.5 ds:py-1.5 ds:shadow-pop", children: content }),
|
|
10288
|
+
/* @__PURE__ */ jsx("div", { className: cn("ds:bg-selection-floating-bg ds:text-selection-floating-fg ds:flex ds:items-center ds:gap-2 ds:rounded-card ds:px-3.5 ds:py-1.5 ds:shadow-pop", BAR_ENTER), children: content }),
|
|
10034
10289
|
footer
|
|
10035
10290
|
]
|
|
10036
10291
|
}
|
|
@@ -10042,7 +10297,7 @@ function BulkActionBar({
|
|
|
10042
10297
|
className: cn("ds:sticky ds:bottom-4 ds:z-[var(--z-sticky)] ds:mt-3 ds:flex ds:justify-center", className),
|
|
10043
10298
|
...props,
|
|
10044
10299
|
children: [
|
|
10045
|
-
/* @__PURE__ */ jsx("div", { className: "ds:border-rule ds:bg-surface ds:flex ds:w-fit ds:max-w-full ds:items-center ds:gap-3 ds:overflow-x-auto ds:rounded-card ds:border ds:px-4 ds:py-2 ds:shadow-card", children: content }),
|
|
10300
|
+
/* @__PURE__ */ jsx("div", { className: cn("ds:border-rule ds:bg-surface ds:flex ds:w-fit ds:max-w-full ds:items-center ds:gap-3 ds:overflow-x-auto ds:rounded-card ds:border ds:px-4 ds:py-2 ds:shadow-card", BAR_ENTER), children: content }),
|
|
10046
10301
|
footer
|
|
10047
10302
|
]
|
|
10048
10303
|
}
|
|
@@ -10394,7 +10649,14 @@ function DisplayMenu({
|
|
|
10394
10649
|
{
|
|
10395
10650
|
ref: flyoutRef,
|
|
10396
10651
|
tabIndex: -1,
|
|
10397
|
-
|
|
10652
|
+
"data-ds-presence": "floating",
|
|
10653
|
+
"data-state": "open",
|
|
10654
|
+
style: {
|
|
10655
|
+
top: flyout.top,
|
|
10656
|
+
width: FLYOUT_WIDTH,
|
|
10657
|
+
maxHeight: flyout.maxHeight,
|
|
10658
|
+
transformOrigin: flyout.side === "left" ? "right top" : "left top"
|
|
10659
|
+
},
|
|
10398
10660
|
className: cn(
|
|
10399
10661
|
// Column + overflow-hidden so the option list (the only flexible
|
|
10400
10662
|
// part) absorbs the height cap, while the search box and Clear
|
|
@@ -10507,35 +10769,35 @@ function DisplayMenu({
|
|
|
10507
10769
|
function EmptyRow({ label = "No matches" }) {
|
|
10508
10770
|
return /* @__PURE__ */ jsx("p", { className: "ds:px-2 ds:py-3 ds:text-center ds:text-[11px] ds:text-fg-3", children: label });
|
|
10509
10771
|
}
|
|
10510
|
-
var StickyStackContext =
|
|
10772
|
+
var StickyStackContext = React30.createContext(null);
|
|
10511
10773
|
function StickyStack({
|
|
10512
10774
|
layers,
|
|
10513
10775
|
top = 0,
|
|
10514
10776
|
layerMode = "fixed",
|
|
10515
10777
|
children
|
|
10516
10778
|
}) {
|
|
10517
|
-
const [layerHeights, setLayerHeights] =
|
|
10518
|
-
const normalizedLayers =
|
|
10779
|
+
const [layerHeights, setLayerHeights] = React30.useState({});
|
|
10780
|
+
const normalizedLayers = React30.useMemo(() => {
|
|
10519
10781
|
const names = [...layers];
|
|
10520
10782
|
if (new Set(names).size !== names.length) {
|
|
10521
10783
|
throw new Error("StickyStack layer names must be unique.");
|
|
10522
10784
|
}
|
|
10523
10785
|
return names;
|
|
10524
10786
|
}, [layers]);
|
|
10525
|
-
const setLayerHeight =
|
|
10787
|
+
const setLayerHeight = React30.useCallback((name, height) => {
|
|
10526
10788
|
setLayerHeights((current) => {
|
|
10527
10789
|
if (current[name] === height) return current;
|
|
10528
10790
|
return { ...current, [name]: height };
|
|
10529
10791
|
});
|
|
10530
10792
|
}, []);
|
|
10531
|
-
const value =
|
|
10793
|
+
const value = React30.useMemo(
|
|
10532
10794
|
() => ({ layers: normalizedLayers, layerHeights, setLayerHeight, top, layerMode }),
|
|
10533
10795
|
[layerHeights, layerMode, normalizedLayers, setLayerHeight, top]
|
|
10534
10796
|
);
|
|
10535
10797
|
return /* @__PURE__ */ jsx(StickyStackContext, { value, children });
|
|
10536
10798
|
}
|
|
10537
10799
|
function useStickyStack(componentName) {
|
|
10538
|
-
const context =
|
|
10800
|
+
const context = React30.use(StickyStackContext);
|
|
10539
10801
|
if (!context) {
|
|
10540
10802
|
throw new Error(`${componentName} must be rendered inside StickyStack.`);
|
|
10541
10803
|
}
|
|
@@ -10558,21 +10820,21 @@ function stackOffset(context, layerName, includeNamedLayer) {
|
|
|
10558
10820
|
const base = cssLength(top);
|
|
10559
10821
|
return measuredOffset === 0 ? base : `calc(${base} + ${measuredOffset}px)`;
|
|
10560
10822
|
}
|
|
10561
|
-
var StickyStackLayer =
|
|
10823
|
+
var StickyStackLayer = React30.forwardRef(
|
|
10562
10824
|
function StickyStackLayer2({ name, hostClassName, layerMode, className, children, style, ...props }, forwardedRef) {
|
|
10563
10825
|
const context = useStickyStack("StickyStackLayer");
|
|
10564
10826
|
const { setLayerHeight } = context;
|
|
10565
10827
|
const mode = layerMode ?? context.layerMode;
|
|
10566
10828
|
const top = stackOffset(context, name, false);
|
|
10567
|
-
const hostRef =
|
|
10568
|
-
const layerRef =
|
|
10569
|
-
const [bounds, setBounds] =
|
|
10829
|
+
const hostRef = React30.useRef(null);
|
|
10830
|
+
const layerRef = React30.useRef(null);
|
|
10831
|
+
const [bounds, setBounds] = React30.useState({
|
|
10570
10832
|
height: 0,
|
|
10571
10833
|
left: 0,
|
|
10572
10834
|
ready: false,
|
|
10573
10835
|
width: 0
|
|
10574
10836
|
});
|
|
10575
|
-
const setLayerRef =
|
|
10837
|
+
const setLayerRef = React30.useCallback(
|
|
10576
10838
|
(node) => {
|
|
10577
10839
|
layerRef.current = node;
|
|
10578
10840
|
if (typeof forwardedRef === "function") forwardedRef(node);
|
|
@@ -10580,7 +10842,7 @@ var StickyStackLayer = React28.forwardRef(
|
|
|
10580
10842
|
},
|
|
10581
10843
|
[forwardedRef]
|
|
10582
10844
|
);
|
|
10583
|
-
const measure =
|
|
10845
|
+
const measure = React30.useCallback(() => {
|
|
10584
10846
|
const host = hostRef.current;
|
|
10585
10847
|
const layer = layerRef.current;
|
|
10586
10848
|
if (!host || !layer) return;
|
|
@@ -10597,7 +10859,7 @@ var StickyStackLayer = React28.forwardRef(
|
|
|
10597
10859
|
);
|
|
10598
10860
|
setLayerHeight(name, next.height);
|
|
10599
10861
|
}, [name, setLayerHeight]);
|
|
10600
|
-
|
|
10862
|
+
React30.useLayoutEffect(() => {
|
|
10601
10863
|
measure();
|
|
10602
10864
|
let frame = 0;
|
|
10603
10865
|
const scheduleMeasure = () => {
|
|
@@ -10650,7 +10912,7 @@ var StickyStackLayer = React28.forwardRef(
|
|
|
10650
10912
|
}
|
|
10651
10913
|
);
|
|
10652
10914
|
StickyStackLayer.displayName = "StickyStackLayer";
|
|
10653
|
-
var StickyStackSticky =
|
|
10915
|
+
var StickyStackSticky = React30.forwardRef(
|
|
10654
10916
|
function StickyStackSticky2({ after, className, style, ...props }, ref) {
|
|
10655
10917
|
const context = useStickyStack("StickyStackSticky");
|
|
10656
10918
|
const top = stackOffset(context, after, true);
|
|
@@ -10671,7 +10933,7 @@ var StickyStackSticky = React28.forwardRef(
|
|
|
10671
10933
|
}
|
|
10672
10934
|
);
|
|
10673
10935
|
StickyStackSticky.displayName = "StickyStackSticky";
|
|
10674
|
-
var StickyStackSectionHeader =
|
|
10936
|
+
var StickyStackSectionHeader = React30.forwardRef(function StickyStackSectionHeader2(props, ref) {
|
|
10675
10937
|
return /* @__PURE__ */ jsx(StickyStackSticky, { ref, "data-sticky-stack-section-header": "", ...props });
|
|
10676
10938
|
});
|
|
10677
10939
|
StickyStackSectionHeader.displayName = "StickyStackSectionHeader";
|
|
@@ -10681,7 +10943,7 @@ function defineStatusMap(map) {
|
|
|
10681
10943
|
if (map === void 0) return (entries) => entries;
|
|
10682
10944
|
return map;
|
|
10683
10945
|
}
|
|
10684
|
-
var ConfirmHostContext =
|
|
10946
|
+
var ConfirmHostContext = React30.createContext(null);
|
|
10685
10947
|
var isServer = typeof window === "undefined";
|
|
10686
10948
|
function missingHost(hook) {
|
|
10687
10949
|
if (process.env.NODE_ENV === "production" || process.env.NODE_ENV === "test") return;
|
|
@@ -10692,8 +10954,8 @@ function missingHost(hook) {
|
|
|
10692
10954
|
);
|
|
10693
10955
|
}
|
|
10694
10956
|
function useConfirm() {
|
|
10695
|
-
const host =
|
|
10696
|
-
return
|
|
10957
|
+
const host = React30.useContext(ConfirmHostContext);
|
|
10958
|
+
return React30.useMemo(() => {
|
|
10697
10959
|
if (host) return host.confirm;
|
|
10698
10960
|
return () => {
|
|
10699
10961
|
missingHost("useConfirm");
|
|
@@ -10702,8 +10964,8 @@ function useConfirm() {
|
|
|
10702
10964
|
}, [host]);
|
|
10703
10965
|
}
|
|
10704
10966
|
function usePrompt() {
|
|
10705
|
-
const host =
|
|
10706
|
-
return
|
|
10967
|
+
const host = React30.useContext(ConfirmHostContext);
|
|
10968
|
+
return React30.useMemo(() => {
|
|
10707
10969
|
if (host) return host.prompt;
|
|
10708
10970
|
return () => {
|
|
10709
10971
|
missingHost("usePrompt");
|
|
@@ -10712,12 +10974,12 @@ function usePrompt() {
|
|
|
10712
10974
|
}, [host]);
|
|
10713
10975
|
}
|
|
10714
10976
|
function ConfirmHost({ children }) {
|
|
10715
|
-
const [queue, setQueue] =
|
|
10716
|
-
const nextId =
|
|
10717
|
-
const enqueue =
|
|
10977
|
+
const [queue, setQueue] = React30.useState([]);
|
|
10978
|
+
const nextId = React30.useRef(0);
|
|
10979
|
+
const enqueue = React30.useCallback((request) => {
|
|
10718
10980
|
setQueue((previous) => [...previous, request]);
|
|
10719
10981
|
}, []);
|
|
10720
|
-
const value =
|
|
10982
|
+
const value = React30.useMemo(
|
|
10721
10983
|
() => ({
|
|
10722
10984
|
confirm: (options) => {
|
|
10723
10985
|
if (isServer) return Promise.resolve(false);
|
|
@@ -10735,7 +10997,7 @@ function ConfirmHost({ children }) {
|
|
|
10735
10997
|
[enqueue]
|
|
10736
10998
|
);
|
|
10737
10999
|
const current = queue[0];
|
|
10738
|
-
const settle =
|
|
11000
|
+
const settle = React30.useCallback(() => {
|
|
10739
11001
|
setQueue((previous) => previous.slice(1));
|
|
10740
11002
|
}, []);
|
|
10741
11003
|
return /* @__PURE__ */ jsxs(ConfirmHostContext, { value, children: [
|
|
@@ -10746,8 +11008,8 @@ function ConfirmHost({ children }) {
|
|
|
10746
11008
|
}
|
|
10747
11009
|
ConfirmHost.displayName = "ConfirmHost";
|
|
10748
11010
|
function useSettleOnce(resolve) {
|
|
10749
|
-
const done =
|
|
10750
|
-
return
|
|
11011
|
+
const done = React30.useRef(false);
|
|
11012
|
+
return React30.useCallback(
|
|
10751
11013
|
(value) => {
|
|
10752
11014
|
if (done.current) return;
|
|
10753
11015
|
done.current = true;
|
|
@@ -10770,7 +11032,7 @@ function HostedConfirm({
|
|
|
10770
11032
|
request,
|
|
10771
11033
|
onSettled
|
|
10772
11034
|
}) {
|
|
10773
|
-
const [open, setOpen] =
|
|
11035
|
+
const [open, setOpen] = React30.useState(true);
|
|
10774
11036
|
const settle = useSettleOnce(request.resolve);
|
|
10775
11037
|
return /* @__PURE__ */ jsx(
|
|
10776
11038
|
ConfirmDialog,
|
|
@@ -10795,8 +11057,8 @@ function HostedPrompt({
|
|
|
10795
11057
|
onSettled
|
|
10796
11058
|
}) {
|
|
10797
11059
|
const { options } = request;
|
|
10798
|
-
const [open, setOpen] =
|
|
10799
|
-
const [value, setValue] =
|
|
11060
|
+
const [open, setOpen] = React30.useState(true);
|
|
11061
|
+
const [value, setValue] = React30.useState(options.defaultValue ?? "");
|
|
10800
11062
|
const settle = useSettleOnce(request.resolve);
|
|
10801
11063
|
const empty = value.trim() === "";
|
|
10802
11064
|
const accessibleName = options.label === void 0 && typeof options.title === "string" ? options.title : void 0;
|
|
@@ -11298,7 +11560,7 @@ function PeoplePicker(props) {
|
|
|
11298
11560
|
...rest
|
|
11299
11561
|
} = props;
|
|
11300
11562
|
const messages = useDsMessages("peoplePicker");
|
|
11301
|
-
const byId =
|
|
11563
|
+
const byId = React30.useMemo(
|
|
11302
11564
|
() => new Map(people.map((person) => [person.id, person])),
|
|
11303
11565
|
[people]
|
|
11304
11566
|
);
|
|
@@ -11375,7 +11637,39 @@ function PeoplePicker(props) {
|
|
|
11375
11637
|
}
|
|
11376
11638
|
);
|
|
11377
11639
|
}
|
|
11640
|
+
function readStorage(key) {
|
|
11641
|
+
if (!key || typeof window === "undefined") return null;
|
|
11642
|
+
try {
|
|
11643
|
+
const stored = window.localStorage.getItem(key);
|
|
11644
|
+
return stored === "comfortable" || stored === "compact" ? stored : null;
|
|
11645
|
+
} catch {
|
|
11646
|
+
return null;
|
|
11647
|
+
}
|
|
11648
|
+
}
|
|
11649
|
+
function writeStorage(key, next) {
|
|
11650
|
+
if (!key || typeof window === "undefined") return;
|
|
11651
|
+
try {
|
|
11652
|
+
window.localStorage.setItem(key, next);
|
|
11653
|
+
} catch {
|
|
11654
|
+
}
|
|
11655
|
+
}
|
|
11656
|
+
function useTableDensity(options) {
|
|
11657
|
+
const { storageKey, defaultDensity = "comfortable" } = options ?? {};
|
|
11658
|
+
const [density, setDensityState] = useState(defaultDensity);
|
|
11659
|
+
useEffect(() => {
|
|
11660
|
+
const stored = readStorage(storageKey);
|
|
11661
|
+
if (stored && stored !== defaultDensity) setDensityState(stored);
|
|
11662
|
+
}, []);
|
|
11663
|
+
const setDensity = useCallback(
|
|
11664
|
+
(next) => {
|
|
11665
|
+
setDensityState(next);
|
|
11666
|
+
writeStorage(storageKey, next);
|
|
11667
|
+
},
|
|
11668
|
+
[storageKey]
|
|
11669
|
+
);
|
|
11670
|
+
return { density, setDensity };
|
|
11671
|
+
}
|
|
11378
11672
|
|
|
11379
|
-
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityEventItem, ActivityItem, ActivityList, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppHeader, AppHeaderActions, AppHeaderBreadcrumb, AppHeaderSearch, AppHeaderTitle, AreaChart, AspectRatio, AttachmentChip, AvatarGroup, Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BulkActionBar, BulkActionBarAction, BulkActionBarSeparator, COUNTRY_CODES, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Code, CommandPalette, ConfirmActionButton, ConfirmDialog, ConfirmHost, Content6 as Content, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CountryFlag2 as CountryFlag, CountrySelect, DATE_DISPLAY_PLACEHOLDER, DEFAULT_PHONE_FIELD_MESSAGES, DangerAction, DataItem, DataTablePattern, DatePicker, DateRangePicker, DesignSystemProvider, DetailGrid, DetailMain, DetailSpine, DetailSpineHeader, DetailSpineSection, DetailSpineStats, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DisplayMenu, DonutChart, EmptyState, ErrorState, Eyebrow, Field, FieldControl, FieldDescription, FieldError, Fieldset, FieldsetLegend, FileTypeBadge, FilterChip, FolderTree, FormError, FormSection, FormSuccess, Heading, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, ICON_TILE_TONE_TO_INTENT, IconAction, IconTile, InfoHint, Inline, Kanban, KanbanCard, KanbanColumn, Kbd, KbdHint, KeyboardShortcutsDialog, KpiCard, Label2 as Label, LinkAction, LinkButton, LoadingRows, Main, MasterDetailLayout, MessageBubble, MessageBubbleAction, MessageBubbleTombstone, MessageComposer, MetadataGrid, MultiFilterPill, MultiSelect, MultiSelectField, MutedSpec, NotificationFilter, NotificationItem, NotificationList, NotificationPanel, NotificationPanelFooter, NotificationPanelHeader, NumberInput, Numeric, OTPInput, PageHeader, PageHeaderSep, PageHeaderSpec, PdfPreview, PeoplePicker, PhoneCountryInput, PhoneField, PhoneInput, PrimaryAction, PriorityIcon, QuestionnairePanel, RadioGroup2 as RadioGroup, RadioGroupItem, RankedBars, ResponsiveDialog, RouteTransition, ScrollArea, ScrollBar, SearchInput, SearchSelect, SecondaryAction, SectionCard, SegmentedControl, SelectableKpiCard, Separator2 as Separator, Shell, SideDrawer,
|
|
11673
|
+
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityEventItem, ActivityItem, ActivityList, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppHeader, AppHeaderActions, AppHeaderBreadcrumb, AppHeaderSearch, AppHeaderTitle, AppSidebar, AppSidebarNav, AreaChart, AspectRatio, AttachmentChip, AvatarGroup, Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BulkActionBar, BulkActionBarAction, BulkActionBarSeparator, COUNTRY_CODES, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Code, CommandPalette, ConfirmActionButton, ConfirmDialog, ConfirmHost, Content6 as Content, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CountryFlag2 as CountryFlag, CountrySelect, DATE_DISPLAY_PLACEHOLDER, DEFAULT_PHONE_FIELD_MESSAGES, DangerAction, DataItem, DataTablePattern, DatePicker, DateRangePicker, DesignSystemProvider, DetailGrid, DetailMain, DetailSpine, DetailSpineHeader, DetailSpineSection, DetailSpineStats, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DisplayMenu, DonutChart, EmptyState, ErrorState, Eyebrow, Field, FieldControl, FieldDescription, FieldError, Fieldset, FieldsetLegend, FileTypeBadge, FilterChip, FolderTree, FormError, FormSection, FormSuccess, Heading, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, ICON_TILE_TONE_TO_INTENT, IconAction, IconTile, InfoHint, Inline, Kanban, KanbanCard, KanbanColumn, Kbd, KbdHint, KeyboardShortcutsDialog, KpiCard, Label2 as Label, LinkAction, LinkButton, LoadingRows, Main, MasterDetailLayout, MessageBubble, MessageBubbleAction, MessageBubbleTombstone, MessageComposer, MetadataGrid, MultiFilterPill, MultiSelect, MultiSelectField, MutedSpec, NotificationFilter, NotificationItem, NotificationList, NotificationPanel, NotificationPanelFooter, NotificationPanelHeader, NumberInput, Numeric, OTPInput, PageHeader, PageHeaderSep, PageHeaderSpec, PdfPreview, PeoplePicker, PhoneCountryInput, PhoneField, PhoneInput, PrimaryAction, PriorityIcon, QuestionnairePanel, RadioGroup2 as RadioGroup, RadioGroupItem, RankedBars, ResponsiveDialog, RouteTransition, ScrollArea, ScrollBar, SearchInput, SearchSelect, SecondaryAction, SectionCard, SegmentedControl, SelectableKpiCard, Separator2 as Separator, Shell, SideDrawer, Slider, SpreadsheetPreview, Stack, StackedBarChart, StarRating, StatusBadge, StatusIcon, Stepper, StickyActionBar, StickyStack, StickyStackLayer, StickyStackSectionHeader, StickyStackSticky, SubmitButton, SuiteProgress, Surface, TableDensityToggle, TableEmpty, TableError, TableLoading, Text, ToastProvider, Toolbar, VisuallyHidden, YEAR_DISPLAY_PLACEHOLDER, alertVariants, applyMask, applyYearMask, attachmentChipVariants, cardVariants, dateToIso, defineStatusMap, displayToIso, fileTypeBadgeVariants, fileTypeFromName, filterChipVariants, getFlagEmoji, resolveIconTileVariants as iconTileVariants, isoToDate, isoToDisplay, isoToYear, labelVariants, parsePhoneForEditing, searchInputVariants, starRatingVariants, suiteProgressFillVariants, useConfirm, usePrompt, useTableDensity, useToast, yearToIso };
|
|
11380
11674
|
//# sourceMappingURL=index.js.map
|
|
11381
11675
|
//# sourceMappingURL=index.js.map
|