@assure-one/design-system 1.41.1 → 1.42.0

package/dist/index.js

@@ -1,15 +1,15 @@
 "use client";
-import { useFormReset, badgeVariants, DataTableBody, DataTableRow, DataTableCell, Badge, Pagination, TableBody, TableRow, TableCell, Table, TableHeader, TableHead, ToggleGroup, ToggleGroupItem } from './chunk-PTI4B2OI.js';
-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-PTI4B2OI.js';
-import { Collapsible, CollapsibleTrigger, CollapsibleContent, PlainLink, Combobox, CmdkCompatContext, Sheet, SheetContent, SheetTitle } from './chunk-XV2VSEA5.js';
-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-XV2VSEA5.js';
-import { withPortalContainer, Backdrop, alertDialogAnatomy, OverlaySurface, OverlayTitle, OverlayDescription, buttonVariants, slot, useDsMessages, Button, 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, dialogAnatomy, DismissButton, DEFAULT_OVERLAY_MESSAGES, DISMISS_GLYPH_CLASSES, OverlayBody, headingAnatomy, deprecate, floatingSurfaceClasses, FLOATING_PADDING, FLOATING_WIDTH, labelAnatomy, warnLegacyButtonProps, resolveButtonIcons, INERT_CLASSES, DISABLED_LOOK_CLASSES, inertHandlers, INERT_ATTRIBUTES, linkButtonAnatomy, useControllableState, controlChrome, mergeRefs, numberInputAnatomy, EN_MESSAGES, phoneFieldAnatomy, Input, useFieldsetContext, radioGroupAnatomy, microInteractions, searchInputAnatomy, IconButton, codeAnatomy, Slot, textAnatomy, stackAnatomy, inlineAnatomy, statusBadgeAnatomy, Tooltip, TooltipTrigger, TooltipContent, 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 as useFormReset$1, sideDrawerAnatomy, Portal, toastAnatomy, useExitPresence, TooltipProvider, TOOLTIP_DEFAULT_DELAY_MS, DesignSystemContext, PortalContainerContext, ModalRoot, ModalOverlay, ModalContent, ModalTitle, ModalDescription } from './chunk-NBI7E3VT.js';
-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-NBI7E3VT.js';
-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-KUSY7BLL.js';
-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-KUSY7BLL.js';
+import { useFormReset, badgeVariants, DataTableBody, DataTableRow, DataTableCell, Badge, Pagination, TableBody, TableRow, TableCell, Table, TableHeader, TableHead, ToggleGroup, ToggleGroupItem } from './chunk-YMRSFVW7.js';
+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-YMRSFVW7.js';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent, PlainLink, Combobox, CmdkCompatContext, Sheet, SheetContent, SheetTitle } from './chunk-H53VF62B.js';
+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-H53VF62B.js';
+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, Tooltip, TooltipTrigger, TooltipContent, 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 as useFormReset$1, sideDrawerAnatomy, Portal, toastAnatomy, useExitPresence, TooltipProvider, TOOLTIP_DEFAULT_DELAY_MS, DesignSystemContext, PortalContainerContext, ModalRoot, ModalOverlay, ModalContent, ModalTitle, ModalDescription } from './chunk-M2HMZ2RW.js';
+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-M2HMZ2RW.js';
+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-AF3QYJ24.js';
+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-AF3QYJ24.js';
 export { systemTokens } from './chunk-CPOGSNXS.js';
 import './chunk-EUHGZA6Q.js';
-export { colors, radii, reference, shadows, spacing, surfaces, typography } from './chunk-X76J4QSJ.js';
+export { colors, radii, reference, shadows, spacing, surfaces, typography } from './chunk-YRHRVOLV.js';
 import * as React28 from 'react';
 import { forwardRef, useId, useRef, useState, useEffect, createContext, useCallback, useMemo, useImperativeHandle, Children, isValidElement, cloneElement, useSyncExternalStore, useContext } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
@@ -143,49 +143,33 @@ var AlertDialogDescription = React28.forwardRef((props, ref) => /* @__PURE__ */
 AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
 var EMPHASES = /* @__PURE__ */ new Set(["solid", "soft", "outline", "ghost", "link"]);
 var isEmphasis = (word) => EMPHASES.has(word);
-var LEGACY_ACTION_CLASSES = cn(
-  "ds:rounded-btn ds:inline-flex ds:h-10 ds:items-center ds:justify-center ds:px-4 ds:text-sm ds:font-medium ds:whitespace-nowrap",
-  "ds:bg-destructive ds:text-destructive-foreground ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
-  "ds:hover:bg-destructive/90",
-  "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
-  "ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed"
-);
-var AlertDialogAction = React28.forwardRef(({ variant, intent, className, ...props }, ref) => /* @__PURE__ */ jsx(
-  AlertDialogPrimitive.Action,
-  {
-    ref,
-    ...slot(alertDialogAnatomy, "action"),
-    className: cn(
-      variant === void 0 && intent === void 0 ? LEGACY_ACTION_CLASSES : buttonVariants({
-        variant: variant ?? "solid",
-        // An emphasis alone keeps the action's meaning (`danger`); a
-        // legacy word alone carries its own intent (`primary` → brand).
-        intent: intent ?? (variant === void 0 || isEmphasis(variant) ? "danger" : void 0),
-        size: "md"
-      }),
-      className
-    ),
-    ...props
-  }
-));
+var LEGACY_ACTION_HOVER = "ds:hover:bg-destructive/90";
+var AlertDialogAction = React28.forwardRef(({ variant, intent, className, ...props }, ref) => {
+  const legacy = variant === void 0 && intent === void 0;
+  const resolvedIntent = intent ?? (variant === void 0 || isEmphasis(variant) ? "danger" : void 0);
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, { ref, asChild: true, ...slot(alertDialogAnatomy, "action"), children: /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: variant ?? "solid",
+      ...resolvedIntent !== void 0 ? { intent: resolvedIntent } : {},
+      size: "md",
+      className: cn(legacy && LEGACY_ACTION_HOVER, className),
+      ...props
+    }
+  ) });
+});
 AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-var AlertDialogCancel = React28.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  AlertDialogPrimitive.Cancel,
+var LEGACY_CANCEL_HOVER = "ds:hover:border-rule-strong ds:hover:text-fg";
+var AlertDialogCancel = React28.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, { ref, asChild: true, ...slot(alertDialogAnatomy, "cancel"), children: /* @__PURE__ */ jsx(
+  Button,
   {
-    ref,
-    ...slot(alertDialogAnatomy, "cancel"),
-    className: cn(
-      "ds:rounded-btn ds:border-rule-strong ds:bg-surface ds:inline-flex ds:h-10 ds:items-center ds:justify-center ds:border ds:px-4 ds:text-sm ds:font-medium ds:whitespace-nowrap",
-      "ds:text-fg-2 ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
-      "ds:hover:bg-surface-hover ds:hover:text-fg",
-      "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
-      "ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed",
-      className
-    ),
+    variant: "outline",
+    size: "md",
+    className: cn(LEGACY_CANCEL_HOVER, className),
     ...props,
     children: children ?? "Cancel"
   }
-));
+) }));
 AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
 var alertVariants = cva(
   cn(
@@ -358,12 +342,12 @@ var AreaChart = forwardRef(function AreaChart2({ data, height = 140, formatValue
           style: { left: `${pts[hover][0] / width * 100}%` },
           children: [
             /* @__PURE__ */ jsx("span", { className: "ds:block ds:text-xs ds:font-semibold ds:tabular-nums", children: formatValue(data[hover].value) }),
-            /* @__PURE__ */ jsx("span", { className: "ds:block ds:text-[10px] ds:opacity-70", children: data[hover].label })
+            /* @__PURE__ */ jsx("span", { className: "ds:block ds:text-(length:--text-micro) ds:opacity-70", children: data[hover].label })
           ]
         }
       )
     ] }),
-    showAxis && /* @__PURE__ */ jsx("div", { className: "ds:text-fg-4 ds:mt-1.5 ds:flex ds:justify-between ds:text-[11px] ds:tabular-nums", children: data.map((d) => /* @__PURE__ */ jsx("span", { children: d.label }, d.label)) })
+    showAxis && /* @__PURE__ */ jsx("div", { className: "ds:text-fg-4 ds:mt-1.5 ds:flex ds:justify-between ds:text-(length:--text-caption) ds:tabular-nums", children: data.map((d) => /* @__PURE__ */ jsx("span", { children: d.label }, d.label)) })
   ] });
 });
 AreaChart.displayName = "AreaChart";
@@ -387,8 +371,9 @@ var fileTypeBadgeVariants = cva(
   {
     variants: {
       size: {
+        // 9px: off-scale, no type role — left literal (VN/D1-track decision).
         sm: "ds:size-8 ds:rounded-btn ds:text-[9px]",
-        md: "ds:size-10 ds:rounded-card ds:text-[10px]"
+        md: "ds:size-10 ds:rounded-card ds:text-(length:--text-micro)"
       }
     },
     defaultVariants: {
@@ -1185,15 +1170,18 @@ function Calendar({
         root: "ds:p-3 ds:min-w-[280px]",
         months: "ds:flex ds:flex-col ds:gap-4",
         ...CALENDAR_CAPTION_CLASSNAMES,
-        month_caption: cn(CALENDAR_CAPTION_CLASSNAMES.month_caption, "ds:text-[13px]"),
+        month_caption: cn(
+          CALENDAR_CAPTION_CLASSNAMES.month_caption,
+          "ds:text-(length:--control-font-size-md)"
+        ),
         month_grid: "ds:w-full ds:border-collapse",
         weekdays: "ds:flex",
-        weekday: "ds:flex-1 ds:text-center ds:text-[11px] ds:font-medium ds:uppercase ds:tracking-wide ds:text-fg-4 ds:pb-1",
+        weekday: "ds:flex-1 ds:text-center ds:text-(length:--text-overline) ds:font-medium ds:uppercase ds:tracking-wide ds:text-fg-4 ds:pb-1",
         weeks: "",
         week: "ds:flex ds:w-full ds:mt-1",
         day: "ds:flex-1 ds:text-center ds:relative ds:p-0",
         day_button: cn(
-          "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-[13px] ds:text-fg",
+          "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",
           "ds:transition-colors ds:duration-[var(--duration-instant)] ds:motion-reduce:transition-none",
           "ds:hover:bg-surface-hover",
           "ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
@@ -1608,7 +1596,7 @@ function CommandPalette({
           {
             className: cn(
               "ds:[&_[cmdk-group-heading]]:px-4 ds:[&_[cmdk-group-heading]]:py-1.5",
-              "ds:[&_[cmdk-group-heading]]:font-mono ds:[&_[cmdk-group-heading]]:text-[11px]",
+              "ds:[&_[cmdk-group-heading]]:font-mono ds:[&_[cmdk-group-heading]]:text-(length:--text-overline)",
               "ds:[&_[cmdk-group-heading]]:tracking-[0.14em] ds:[&_[cmdk-group-heading]]:uppercase",
               "ds:[&_[cmdk-group-heading]]:text-fg-3"
             ),
@@ -2130,7 +2118,11 @@ var ContextMenuLabel = React28.forwardRef(({ className, inset, ...props }, ref)
   {
     ref,
     ...slot(contextMenuAnatomy, "label"),
-    className: cn(menuLabelClasses(PALETTE, "ds:text-[11px]"), inset && MENU_INSET, className),
+    className: cn(
+      menuLabelClasses(PALETTE, "ds:text-(length:--text-overline)"),
+      inset && MENU_INSET,
+      className
+    ),
     ...props
   }
 ));
@@ -2145,7 +2137,13 @@ var ContextMenuSeparator = React28.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
-var ContextMenuShortcut = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { className: cn(menuShortcutClasses(PALETTE, "ds:text-[11px]"), className), ...props });
+var ContextMenuShortcut = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: cn(menuShortcutClasses(PALETTE, "ds:text-(length:--text-code)"), className),
+    ...props
+  }
+);
 ContextMenuShortcut.displayName = "ContextMenuShortcut";
 var CopyButton = forwardRef(function CopyButton2({ value, feedbackDuration = 2e3, messages: messagesProp, className, children, ...props }, ref) {
   const messages = useDsMessages("copyButton", messagesProp);
@@ -2175,6 +2173,55 @@ var CopyButton = forwardRef(function CopyButton2({ value, feedbackDuration = 2e3
   );
 });
 CopyButton.displayName = "CopyButton";
+var DATE_PICKER_BOX = {
+  xs: "ds:h-(--control-height-xs) ds:text-(length:--control-font-size-xs)",
+  sm: "ds:h-(--control-height-sm) ds:text-(length:--control-font-size-sm)",
+  md: "ds:h-(--control-height-md) ds:text-(length:--control-font-size-md)",
+  lg: "ds:h-(--control-height-lg) ds:text-(length:--control-font-size-lg)",
+  xl: "ds:h-(--control-height-xl) ds:text-(length:--control-font-size-xl)"
+};
+var DATE_PICKER_OUTER_PAD_LEFT = {
+  xs: "ds:pl-2",
+  sm: "ds:pl-2.5",
+  md: "ds:pl-3",
+  lg: "ds:pl-3.5",
+  xl: "ds:pl-4"
+};
+var DATE_PICKER_OUTER_PAD_RIGHT = {
+  xs: "ds:pr-2",
+  sm: "ds:pr-2.5",
+  md: "ds:pr-3",
+  lg: "ds:pr-3.5",
+  xl: "ds:pr-4"
+};
+var DATE_PICKER_ICON_SLOT = {
+  xs: "ds:w-8",
+  sm: "ds:w-9",
+  md: "ds:w-10",
+  lg: "ds:w-11",
+  xl: "ds:w-12"
+};
+var DATE_PICKER_ICON_PAD_LEFT = {
+  xs: "ds:pl-8",
+  sm: "ds:pl-9",
+  md: "ds:pl-10",
+  lg: "ds:pl-11",
+  xl: "ds:pl-12"
+};
+var DATE_PICKER_ICON_PAD_RIGHT = {
+  xs: "ds:pr-8",
+  sm: "ds:pr-9",
+  md: "ds:pr-10",
+  lg: "ds:pr-11",
+  xl: "ds:pr-12"
+};
+var DATE_PICKER_ICON_SIZE = {
+  xs: "ds:size-(--control-icon-xs)",
+  sm: "ds:size-(--control-icon-sm)",
+  md: "ds:size-(--control-icon-md)",
+  lg: "ds:size-(--control-icon-lg)",
+  xl: "ds:size-(--control-icon-xl)"
+};
 function YearGrid({ selected, onSelect, minYear, maxYear, formatLabel, autoFocus }) {
   const messages = useDsMessages("datePicker");
   const today = (/* @__PURE__ */ new Date()).getFullYear();
@@ -2207,10 +2254,10 @@ function YearGrid({ selected, onSelect, minYear, maxYear, formatLabel, autoFocus
             "ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
             "ds:disabled:text-fg-disabled ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed"
           ),
-          children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "ds:text-fg-3 ds:size-4", "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "ds:text-fg-3 ds:size-(--control-icon-md)", "aria-hidden": "true" })
         }
       ),
-      /* @__PURE__ */ jsxs("span", { className: "ds:font-display ds:text-fg ds:text-[13px] ds:font-medium ds:tabular-nums", children: [
+      /* @__PURE__ */ jsxs("span", { className: "ds:font-display ds:text-fg ds:text-(length:--control-font-size-md) ds:font-medium ds:tabular-nums", children: [
         startYear,
         " \u2013 ",
         startYear + 11
@@ -2229,7 +2276,7 @@ function YearGrid({ selected, onSelect, minYear, maxYear, formatLabel, autoFocus
             "ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]",
             "ds:disabled:text-fg-disabled ds:disabled:pointer-events-none ds:disabled:cursor-not-allowed"
           ),
-          children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ds:text-fg-3 ds:size-4", "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ds:text-fg-3 ds:size-(--control-icon-md)", "aria-hidden": "true" })
         }
       )
     ] }),
@@ -2248,7 +2295,7 @@ function YearGrid({ selected, onSelect, minYear, maxYear, formatLabel, autoFocus
           "aria-pressed": isSelected,
           "aria-current": isToday ? "date" : void 0,
           className: cn(
-            "ds:rounded-input ds:font-mono ds:text-[13px] ds:tabular-nums",
+            "ds:rounded-input ds:font-mono ds:text-(length:--control-font-size-md) ds:tabular-nums",
             "ds:inline-flex ds:h-10 ds:items-center ds:justify-center",
             "ds:transition-colors ds:duration-[var(--duration-instant)] ds:motion-reduce:transition-none",
             "ds:hover:bg-surface-hover",
@@ -2288,7 +2335,8 @@ var DatePicker = forwardRef(function DatePicker2({
   formatLabel,
   iconPosition = "right",
   captionLayout = "dropdown",
-  inputClassName
+  inputClassName,
+  size
 }, ref) {
   const messages = useDsMessages("datePicker");
   const isYearMode = picker === "year";
@@ -2419,7 +2467,7 @@ var DatePicker = forwardRef(function DatePicker2({
   const minYear = min ? Number(isoToYear(min)) : void 0;
   const maxYear = max ? Number(isoToYear(max)) : void 0;
   return /* @__PURE__ */ jsxs("div", { className: cn("ds:w-full", className), children: [
-    label && /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "ds:text-fg ds:mb-1.5 ds:block ds:text-[13px] ds:leading-none ds:font-medium", children: [
+    label && /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "ds:text-fg ds:mb-1.5 ds:block ds:text-(length:--control-font-size-md) ds:leading-none ds:font-medium", children: [
       label,
       wiring.required && /* @__PURE__ */ jsx("span", { className: "ds:text-danger-fg ds:ml-0.5", "aria-hidden": "true", children: "*" })
     ] }),
@@ -2444,8 +2492,8 @@ var DatePicker = forwardRef(function DatePicker2({
           "aria-describedby": joinIds(wiring["aria-describedby"], error ? errorId : void 0),
           "aria-labelledby": wiring["aria-labelledby"],
           "aria-label": ariaLabel,
-          className: cn(
-            "ds:rounded-input ds:bg-surface ds:text-fg ds:flex ds:h-9 ds:w-full ds:border ds:font-mono ds:text-[13px] ds:tabular-nums",
+          className: size == null ? cn(
+            "ds:rounded-input ds:bg-surface ds:text-fg ds:flex ds:h-9 ds:w-full ds:border ds:font-mono ds:text-(length:--control-font-size-md) ds:tabular-nums",
             "ds:border-field-border ds:py-2",
             iconPosition === "left" ? "ds:pl-10 ds:pr-3" : "ds:pl-3 ds:pr-10",
             "ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
@@ -2459,6 +2507,22 @@ var DatePicker = forwardRef(function DatePicker2({
             "ds:aria-[invalid=true]:focus-visible:[box-shadow:0_0_0_2px_var(--color-danger-bg)]",
             hasCustomYearLabel && "ds:cursor-pointer",
             inputClassName
+          ) : cn(
+            "ds:rounded-input ds:bg-surface ds:text-fg ds:flex ds:w-full ds:border ds:font-mono ds:tabular-nums",
+            DATE_PICKER_BOX[size],
+            "ds:border-field-border ds:py-2",
+            iconPosition === "left" ? cn(DATE_PICKER_ICON_PAD_LEFT[size], DATE_PICKER_OUTER_PAD_RIGHT[size]) : cn(DATE_PICKER_OUTER_PAD_LEFT[size], DATE_PICKER_ICON_PAD_RIGHT[size]),
+            "ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
+            "ds:motion-reduce:transition-none",
+            "ds:placeholder:font-body ds:placeholder:text-fg-4",
+            "ds:not-disabled:hover:border-field-border-hover",
+            "ds:focus-visible:[border-color:var(--focus-ring-border)] ds:focus-visible:outline-none",
+            "ds:focus-visible:[box-shadow:var(--shadow-focus-ring-field)]",
+            "ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed",
+            "ds:aria-[invalid=true]:border-field-border-invalid ds:aria-[invalid=true]:focus-visible:border-danger-fg",
+            "ds:aria-[invalid=true]:focus-visible:[box-shadow:0_0_0_2px_var(--color-danger-bg)]",
+            hasCustomYearLabel && "ds:cursor-pointer",
+            inputClassName
           )
         }
       ),
@@ -2470,7 +2534,7 @@ var DatePicker = forwardRef(function DatePicker2({
             disabled: isDisabled,
             tabIndex: -1,
             "aria-label": messages.openCalendar,
-            className: cn(
+            className: size == null ? cn(
               "ds:text-fg-3 ds:absolute ds:inset-y-0 ds:flex ds:w-10 ds:cursor-pointer ds:items-center ds:justify-center",
               iconPosition === "left" ? "ds:left-0 ds:rounded-l-input" : "ds:right-0 ds:rounded-r-input",
               "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
@@ -2478,8 +2542,17 @@ var DatePicker = forwardRef(function DatePicker2({
               "ds:hover:bg-surface-hover ds:hover:text-fg",
               "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
               "ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent"
+            ) : cn(
+              "ds:text-fg-3 ds:absolute ds:inset-y-0 ds:flex ds:cursor-pointer ds:items-center ds:justify-center",
+              DATE_PICKER_ICON_SLOT[size],
+              iconPosition === "left" ? "ds:left-0 ds:rounded-l-input" : "ds:right-0 ds:rounded-r-input",
+              "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
+              "ds:motion-reduce:transition-none",
+              "ds:hover:bg-surface-hover ds:hover:text-fg",
+              "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
+              "ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent"
             ),
-            children: /* @__PURE__ */ jsx(CalendarIcon, { className: "ds:size-4", "aria-hidden": "true" })
+            children: /* @__PURE__ */ jsx(CalendarIcon, { className: DATE_PICKER_ICON_SIZE[size ?? "md"], "aria-hidden": "true" })
           }
         ) }),
         /* @__PURE__ */ jsx(
@@ -2552,7 +2625,8 @@ var DateRangePicker = forwardRef(
     max,
     iconPosition = "right",
     "aria-label": ariaLabel,
-    captionLayout = "dropdown"
+    captionLayout = "dropdown",
+    size
   }, ref) {
     const messages = useDsMessages("dateRangePicker");
     const placeholder = placeholderProp ?? messages.placeholder;
@@ -2647,7 +2721,7 @@ var DateRangePicker = forwardRef(
     const iconNode = /* @__PURE__ */ jsx(
       CalendarIcon,
       {
-        className: cn("ds:size-4 ds:shrink-0", isDisabled ? "ds:text-fg-disabled" : "ds:text-fg-3"),
+        className: cn("ds:size-(--control-icon-md) ds:shrink-0", isDisabled ? "ds:text-fg-disabled" : "ds:text-fg-3"),
         "aria-hidden": "true"
       }
     );
@@ -2663,7 +2737,7 @@ var DateRangePicker = forwardRef(
             {
               id: labelId,
               htmlFor: id,
-              className: "ds:text-fg ds:mb-1.5 ds:block ds:text-[13px] ds:leading-none ds:font-medium",
+              className: "ds:text-fg ds:mb-1.5 ds:block ds:text-(length:--control-font-size-md) ds:leading-none ds:font-medium",
               children: [
                 label,
                 isRequired && /* @__PURE__ */ jsx("span", { className: "ds:text-danger-fg ds:ml-0.5", "aria-hidden": "true", children: "*" })
@@ -2684,8 +2758,8 @@ var DateRangePicker = forwardRef(
                 "aria-label": ariaLabel ?? label ?? messages.name,
                 "aria-haspopup": "dialog",
                 "aria-expanded": open,
-                className: cn(
-                  "ds:rounded-input ds:bg-surface ds:flex ds:h-9 ds:w-full ds:cursor-pointer ds:items-center ds:border ds:font-mono ds:text-[13px] ds:tabular-nums",
+                className: size == null ? cn(
+                  "ds:rounded-input ds:bg-surface ds:flex ds:h-9 ds:w-full ds:cursor-pointer ds:items-center ds:border ds:font-mono ds:text-(length:--control-font-size-md) ds:tabular-nums",
                   "ds:border-field-border ds:px-3 ds:py-2 ds:gap-2",
                   "ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
                   "ds:motion-reduce:transition-none",
@@ -2695,6 +2769,18 @@ var DateRangePicker = forwardRef(
                   "ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed ds:disabled:hover:bg-bg-disabled",
                   "ds:data-[invalid=true]:border-field-border-invalid ds:data-[invalid=true]:focus-visible:border-danger-fg",
                   "ds:data-[invalid=true]:focus-visible:[box-shadow:0_0_0_2px_var(--color-danger-bg)]"
+                ) : cn(
+                  "ds:rounded-input ds:bg-surface ds:flex ds:w-full ds:cursor-pointer ds:items-center ds:border ds:font-mono ds:tabular-nums",
+                  "ds:border-field-border",
+                  CONTROL_SIZE_CLASSES[size],
+                  "ds:transition-[color,background-color,border-color,box-shadow] ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
+                  "ds:motion-reduce:transition-none",
+                  "ds:hover:bg-surface-hover ds:not-disabled:hover:border-field-border-hover",
+                  "ds:focus-visible:[border-color:var(--focus-ring-border)] ds:focus-visible:outline-none",
+                  "ds:focus-visible:[box-shadow:var(--shadow-focus-ring-field)]",
+                  "ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled ds:disabled:cursor-not-allowed ds:disabled:hover:bg-bg-disabled",
+                  "ds:data-[invalid=true]:border-field-border-invalid ds:data-[invalid=true]:focus-visible:border-danger-fg",
+                  "ds:data-[invalid=true]:focus-visible:[box-shadow:0_0_0_2px_var(--color-danger-bg)]"
                 ),
                 children: [
                   iconPosition === "left" && iconNode,
@@ -2913,7 +2999,7 @@ DialogDescription.displayName = DialogPrimitive.Description.displayName;
 var chipVariants2 = cva(
   cn(
     "ds:inline-flex ds:items-center ds:gap-1 ds:rounded-full ds:px-2.5 ds:py-1",
-    "ds:text-[12px] ds:font-medium",
+    "ds:text-(length:--text-helper) ds:font-medium",
     "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
     "ds:motion-reduce:transition-none",
     "ds:focus-visible:outline-none ds:focus-visible:[box-shadow:var(--shadow-focus-ring)]"
@@ -3598,7 +3684,7 @@ function KeyboardShortcutsDialog({
         {
           className: cn(
             "ds:mb-2.5 ds:inline-flex ds:items-center ds:gap-1.5",
-            "ds:text-fg-3 ds:font-mono ds:text-[11px] ds:tracking-[0.14em] ds:uppercase"
+            "ds:text-fg-3 ds:font-mono ds:text-(length:--text-overline) ds:tracking-[0.14em] ds:uppercase"
           ),
           children: [
             section.icon,
@@ -3613,7 +3699,7 @@ function KeyboardShortcutsDialog({
           children: [
             /* @__PURE__ */ jsx("span", { className: "ds:text-fg ds:text-sm", children: shortcut.description }),
             /* @__PURE__ */ jsx("div", { className: "ds:flex ds:shrink-0 ds:items-center ds:gap-1", children: shortcut.keys.map((key, i) => /* @__PURE__ */ jsxs(React28.Fragment, { children: [
-              i > 0 && /* @__PURE__ */ jsx("span", { className: "ds:text-fg-4 ds:mx-0.5 ds:text-[11px]", children: messages.then }),
+              i > 0 && /* @__PURE__ */ jsx("span", { className: "ds:text-fg-4 ds:mx-0.5 ds:text-(length:--text-caption)", children: messages.then }),
               /* @__PURE__ */ jsx(Kbd, { children: key })
             ] }, i)) })
           ]
@@ -3621,7 +3707,7 @@ function KeyboardShortcutsDialog({
         shortcut.description
       )) })
     ] }, section.title)) }) }),
-    /* @__PURE__ */ jsx("div", { className: "ds:border-rule ds:bg-bg-2/40 ds:border-t ds:px-5 ds:py-3", children: /* @__PURE__ */ jsxs("p", { className: "ds:text-fg-3 ds:text-[11px]", children: [
+    /* @__PURE__ */ jsx("div", { className: "ds:border-rule ds:bg-bg-2/40 ds:border-t ds:px-5 ds:py-3", children: /* @__PURE__ */ jsxs("p", { className: "ds:text-fg-3 ds:text-(length:--text-caption)", children: [
       messages.hintPrefix,
       " ",
       /* @__PURE__ */ jsx(Kbd, { children: hotkey ?? "?" }),
@@ -3631,7 +3717,7 @@ function KeyboardShortcutsDialog({
   ] }) });
 }
 var labelVariants = cva(
-  "ds:text-[13px] 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"
+  "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"
 );
 var Label2 = React28.forwardRef(
   function Label3({ children, required, className, id, htmlFor, onClick, ...props }, ref) {
@@ -3940,9 +4026,9 @@ var MasterDetailLayout = forwardRef(
 );
 MasterDetailLayout.displayName = "MasterDetailLayout";
 var TRIGGER_SIZE = {
-  sm: "ds:h-8 ds:gap-1.5 ds:px-2.5 ds:text-[13px]",
-  md: "ds:h-9 ds:gap-2 ds:px-3 ds:text-sm",
-  lg: "ds:h-10 ds:gap-2 ds:px-3.5 ds:text-base"
+  sm: "ds:h-(--multi-filter-pill-height-sm) ds:gap-1.5 ds:px-2.5 ds:text-(length:--control-font-size-md)",
+  md: "ds:h-(--multi-filter-pill-height-md) ds:gap-2 ds:px-3 ds:text-sm",
+  lg: "ds:h-(--multi-filter-pill-height-lg) ds:gap-2 ds:px-3.5 ds:text-base"
 };
 function MultiFilterPill({
   label,
@@ -4040,7 +4126,7 @@ function MultiFilterPill({
                     "aria-selected": isSelected,
                     onClick: () => onToggle(opt.key),
                     className: cn(
-                      "ds:rounded-pill ds:flex ds:w-full ds:cursor-default ds:items-center ds:gap-2 ds:px-2 ds:py-1.5 ds:text-[13px] ds:outline-none ds:select-none",
+                      "ds:rounded-pill ds:flex ds:w-full ds:cursor-default ds:items-center ds:gap-2 ds:px-2 ds:py-1.5 ds:text-(length:--control-font-size-md) ds:outline-none ds:select-none",
                       "ds:text-fg-2 ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
                       "ds:motion-reduce:transition-none",
                       "ds:hover:bg-surface-hover ds:hover:text-fg",
@@ -4080,7 +4166,7 @@ function MultiFilterPill({
                 type: "button",
                 onClick: onClear,
                 className: cn(
-                  "ds:rounded-pill ds:flex ds:w-full ds:items-center ds:justify-center ds:px-2 ds:py-1.5 ds:text-[12px] ds:outline-none",
+                  "ds:rounded-pill ds:flex ds:w-full ds:items-center ds:justify-center ds:px-2 ds:py-1.5 ds:text-(length:--text-helper) ds:outline-none",
                   "ds:text-fg-3 ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
                   "ds:motion-reduce:transition-none",
                   "ds:hover:bg-surface-hover ds:hover:text-fg",
@@ -4125,7 +4211,7 @@ function MultiSelectField({
       "div",
       {
         id: `${groupId}-label`,
-        className: "ds:text-fg ds:mb-1.5 ds:block ds:text-[13px] ds:leading-none ds:font-medium",
+        className: "ds:text-fg ds:mb-1.5 ds:block ds:text-(length:--control-font-size-md) ds:leading-none ds:font-medium",
         children: label
       }
     ),
@@ -5329,7 +5415,8 @@ PhoneInput.displayName = "PhoneInput";
 function CountryFlag2({ iso }) {
   const flags = useCountryFlags();
   const Flag = flags?.[iso];
-  if (flags !== null && !Flag) return /* @__PURE__ */ jsx("span", { className: "ds:text-[10px] ds:font-mono", children: iso });
+  if (flags !== null && !Flag)
+    return /* @__PURE__ */ jsx("span", { className: "ds:text-(length:--text-micro) ds:font-mono", children: iso });
   const Tag = Flag ?? "span";
   return /* @__PURE__ */ jsx(
     Tag,
@@ -5339,10 +5426,25 @@ function CountryFlag2({ iso }) {
     }
   );
 }
+var COUNTRY_SELECT_SIZE_ROWS = {
+  xs: "ds:h-(--control-height-xs) ds:w-[72px] ds:gap-1 ds:px-2 ds:text-xs",
+  sm: "ds:h-(--control-height-sm) ds:w-[80px] ds:gap-1 ds:px-2 ds:text-xs",
+  md: "ds:h-(--control-height-md) ds:w-[90px] ds:gap-1.5 ds:px-2.5 ds:text-sm",
+  lg: "ds:h-(--control-height-lg) ds:w-[100px] ds:gap-2 ds:px-3 ds:text-sm",
+  xl: "ds:h-(--control-height-xl) ds:w-[120px] ds:gap-2 ds:px-3.5 ds:text-base"
+};
+var COUNTRY_SELECT_ICON_SIZE = {
+  xs: "ds:size-2.5",
+  sm: "ds:size-2.5",
+  md: "ds:size-3",
+  lg: "ds:size-3.5",
+  xl: "ds:size-4"
+};
 function CountrySelect({
   value,
   onChange,
-  disabled
+  disabled,
+  size
 }) {
   const messages = useDsMessages("phoneCountryInput");
   const [open, setOpen] = useState(false);
@@ -5372,14 +5474,17 @@ function CountrySelect({
             type: "button",
             disabled,
             "aria-label": messages.selectCountry,
-            className: "ds:rounded-input ds:flex ds:h-9 ds:w-[90px] ds:shrink-0 ds:items-center ds:gap-1.5 ds:border ds:border-field-border ds:bg-surface ds:px-2.5 ds:text-sm ds:text-fg ds:transition-colors ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none ds:motion-reduce:transition-none ds:disabled:cursor-not-allowed ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled",
+            className: size == null ? "ds:rounded-input ds:flex ds:h-9 ds:w-[90px] ds:shrink-0 ds:items-center ds:gap-1.5 ds:border ds:border-field-border ds:bg-surface ds:px-2.5 ds:text-sm ds:text-fg ds:transition-colors ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none ds:motion-reduce:transition-none ds:disabled:cursor-not-allowed ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled" : cn(
+              "ds:rounded-input ds:flex ds:shrink-0 ds:items-center ds:border ds:border-field-border ds:bg-surface ds:text-fg ds:transition-colors ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none ds:motion-reduce:transition-none ds:disabled:cursor-not-allowed ds:disabled:bg-bg-disabled ds:disabled:text-fg-disabled",
+              COUNTRY_SELECT_SIZE_ROWS[size]
+            ),
             children: [
               /* @__PURE__ */ jsx(CountryFlag2, { iso: selected.iso }),
               /* @__PURE__ */ jsx("span", { className: "ds:text-xs ds:tabular-nums ds:text-fg-3", children: selected.dialCode }),
               /* @__PURE__ */ jsx(
                 ChevronDownIcon,
                 {
-                  className: "ds:ml-auto ds:size-3 ds:shrink-0 ds:text-fg-3",
+                  className: cn("ds:ml-auto ds:shrink-0 ds:text-fg-3", COUNTRY_SELECT_ICON_SIZE[size ?? "md"]),
                   "aria-hidden": "true"
                 }
               )
@@ -5403,20 +5508,34 @@ function CountrySelect({
               if (e.key !== "Escape") e.stopPropagation();
             },
             children: [
-              /* @__PURE__ */ jsx("div", { className: "ds:rounded-t-card ds:border-b ds:border-rule ds:px-3 ds:py-2.5", children: /* @__PURE__ */ jsxs("div", { className: "ds:rounded-input ds:flex ds:items-center ds:gap-2 ds:border ds:border-field-border ds:bg-surface ds:px-2.5", children: [
-                /* @__PURE__ */ jsx(SearchIcon, { className: "ds:size-3.5 ds:shrink-0 ds:text-fg-3", "aria-hidden": "true" }),
-                /* @__PURE__ */ jsx(
-                  "input",
-                  {
-                    ref: searchRef,
-                    value: search,
-                    onChange: (e) => setSearch(e.target.value),
-                    onKeyDown: (e) => e.stopPropagation(),
-                    placeholder: messages.searchCountries,
-                    className: "ds:h-8 ds:flex-1 ds:bg-transparent ds:text-xs ds:text-fg ds:placeholder:text-fg-3 ds:focus:outline-none"
-                  }
-                )
-              ] }) }),
+              /* @__PURE__ */ jsx("div", { className: "ds:rounded-t-card ds:border-b ds:border-rule ds:px-3 ds:py-2.5", children: /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  className: cn(
+                    "ds:rounded-input ds:flex ds:items-center ds:gap-2 ds:border ds:border-field-border ds:bg-surface ds:px-2.5",
+                    // The visible input here suppresses its own outline
+                    // (`ds:focus:outline-none` below); this wrapper carries the
+                    // ring instead, the same `focus-within` field-halo pattern
+                    // `CONTROL_FRAME` uses in combobox.tsx — this search field had
+                    // no focus indicator at all before (W-polish-2, control-states).
+                    "ds:focus-within:[border-color:var(--focus-ring-border)] ds:focus-within:[box-shadow:var(--shadow-focus-ring-field)]"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(SearchIcon, { className: "ds:size-3.5 ds:shrink-0 ds:text-fg-3", "aria-hidden": "true" }),
+                    /* @__PURE__ */ jsx(
+                      "input",
+                      {
+                        ref: searchRef,
+                        value: search,
+                        onChange: (e) => setSearch(e.target.value),
+                        onKeyDown: (e) => e.stopPropagation(),
+                        placeholder: messages.searchCountries,
+                        className: "ds:h-8 ds:flex-1 ds:bg-transparent ds:text-xs ds:text-fg ds:placeholder:text-fg-3 ds:focus:outline-none"
+                      }
+                    )
+                  ]
+                }
+              ) }),
               /* @__PURE__ */ jsx(
                 "div",
                 {
@@ -5656,7 +5775,10 @@ var RadioGroupItem = React28.forwardRef(function RadioGroupItem2({
     {
       htmlFor: id,
       ...slot(radioGroupAnatomy, "label"),
-      className: card ? "ds:text-fg ds:group-has-[:disabled]:text-fg-disabled ds:text-label ds:leading-4 ds:cursor-pointer ds:select-none ds:after:absolute ds:after:inset-0 ds:group-has-[:disabled]:cursor-not-allowed" : "ds:text-fg ds:peer-disabled:text-fg-disabled ds:cursor-pointer ds:text-[13px] ds:leading-none ds:select-none ds:peer-disabled:cursor-not-allowed",
+      className: card ? "ds:text-fg ds:group-has-[:disabled]:text-fg-disabled ds:text-label ds:leading-4 ds:cursor-pointer ds:select-none ds:after:absolute ds:after:inset-0 ds:group-has-[:disabled]:cursor-not-allowed" : cn(
+        "ds:text-fg ds:peer-disabled:text-fg-disabled ds:cursor-pointer ds:leading-none ds:select-none ds:peer-disabled:cursor-not-allowed",
+        CONTROL_LABEL_TEXT
+      ),
       children: label
     }
   ) : null;
@@ -5894,7 +6016,7 @@ var SEARCH_RESET = "ds:[&::-webkit-search-cancel-button]:appearance-none ds:[&::
 var SEARCH_INPUT_SIZE_ROWS = {
   sm: "ds:h-(--control-height-sm) ds:pl-8 ds:pr-8 ds:text-(length:--control-font-size-sm)",
   md: "ds:h-(--control-height-md) ds:pl-9 ds:pr-9 ds:text-(length:--control-font-size-md)",
-  lg: "ds:h-(--search-input-height-lg) ds:pl-10 ds:pr-10 ds:text-sm",
+  lg: "ds:h-(--control-height-lg) ds:pl-10 ds:pr-10 ds:text-sm",
   compact: "ds:h-(--control-height-sm) ds:pl-8 ds:pr-8 ds:text-(length:--control-font-size-sm)",
   default: "ds:h-(--control-height-lg) ds:pl-9 ds:pr-9 ds:text-sm",
   comfortable: "ds:h-(--control-height-xl) ds:pl-10 ds:pr-10 ds:text-base"
@@ -5905,18 +6027,7 @@ function searchInputVariants({
   class: classProp,
   className
 } = {}) {
-  const LEGACY_ROWS = {
-    // `sm` is the dense control tier: h-8 + 13px, so a search box lines up
-    // pixel-for-pixel (height AND text) with Button / MultiFilterPill /
-    // FilterChip at their `sm` tier in a toolbar row.
-    sm: "ds:h-8 ds:pl-8 ds:pr-8 ds:text-[13px]",
-    md: "ds:h-9 ds:pl-9 ds:pr-9 ds:text-[13px]",
-    lg: "ds:h-11 ds:pl-10 ds:pr-10 ds:text-sm",
-    compact: "ds:h-8 ds:pl-8 ds:pr-8 ds:text-[13px]",
-    default: "ds:h-10 ds:pl-9 ds:pr-9 ds:text-sm",
-    comfortable: "ds:h-12 ds:pl-10 ds:pr-10 ds:text-base"
-  };
-  const row = size ? SEARCH_INPUT_SIZE_ROWS[size] : LEGACY_ROWS[inputSize ?? "md"];
+  const row = SEARCH_INPUT_SIZE_ROWS[size ?? inputSize ?? "md"];
   return controlChrome({
     variant: "default",
     size: null,
@@ -6080,7 +6191,7 @@ function renderSearchSelectRow(row, hasLeadingDot) {
         style: { backgroundColor: source.color },
         "aria-hidden": "true"
       }
-    ) : hasLeadingDot && /* @__PURE__ */ jsx(CheckIcon, { className: "ds:size-4 ds:shrink-0 ds:text-transparent", "aria-hidden": "true" }),
+    ) : hasLeadingDot && /* @__PURE__ */ jsx(CheckIcon, { className: "ds:size-(--control-icon-md) ds:shrink-0 ds:text-transparent", "aria-hidden": "true" }),
     /* @__PURE__ */ jsx("span", { className: "ds:line-clamp-1", children: source.label })
   ] });
 }
@@ -6105,7 +6216,8 @@ function SearchSelect({
   "aria-label": ariaLabel,
   "aria-labelledby": ariaLabelledBy,
   "aria-describedby": ariaDescribedBy,
-  id
+  id,
+  size
 }) {
   deprecate(
     CONTRACT,
@@ -6220,7 +6332,7 @@ function SearchSelect({
         type: "button",
         onClick: () => setActiveChip(chip),
         className: cn(
-          "ds:rounded-pill ds:px-2.5 ds:py-0.5 ds:text-[12px] ds:font-medium",
+          "ds:rounded-pill ds:px-2.5 ds:py-0.5 ds:text-(length:--text-helper) ds:font-medium",
           "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
           active ? "ds:bg-brand ds:text-fg-on-brand" : "ds:border-rule ds:text-fg-2 ds:hover:bg-surface-hover ds:border ds:bg-transparent"
         ),
@@ -6239,14 +6351,14 @@ function SearchSelect({
         setOpen(false);
       },
       className: cn(
-        "ds:text-brand ds:flex ds:w-full ds:shrink-0 ds:items-center ds:gap-2 ds:px-3 ds:py-2.5 ds:text-[13px] ds:font-medium",
+        "ds:text-brand ds:flex ds:w-full ds:shrink-0 ds:items-center ds:gap-2 ds:px-3 ds:py-2.5 ds:text-(length:--control-font-size-md) ds:font-medium",
         "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
         "ds:motion-reduce:transition-none",
         "ds:hover:bg-brand-bg",
         "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none"
       ),
       children: [
-        /* @__PURE__ */ jsx(PlusIcon, { className: "ds:size-4 ds:shrink-0", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx(PlusIcon, { className: "ds:size-(--control-icon-md) ds:shrink-0", "aria-hidden": "true" }),
         createNewLabel
       ]
     }
@@ -6254,6 +6366,7 @@ function SearchSelect({
   const shared = {
     options: rows,
     id,
+    size,
     "aria-label": ariaLabel ?? (ariaLabelledBy ? void 0 : placeholder),
     "aria-labelledby": ariaLabelledBy,
     "aria-describedby": ariaDescribedBy,
@@ -6279,7 +6392,7 @@ function SearchSelect({
     renderOption: (row) => renderSearchSelectRow(row, hasLeadingDot)
   };
   const CHIP_CLASSES = cn(
-    "ds:rounded-pill ds:border-rule ds:inline-flex ds:items-center ds:gap-1 ds:border ds:px-2 ds:py-0.5 ds:text-[12px]",
+    "ds:rounded-pill ds:border-rule ds:inline-flex ds:items-center ds:gap-1 ds:border ds:px-2 ds:py-0.5 ds:text-(length:--text-helper)",
     "ds:bg-bg-2 ds:font-body ds:text-fg-2"
   );
   const CHIP_REMOVE_CLASSES = cn(
@@ -6536,11 +6649,11 @@ var Slider = React28.forwardRef(
           "label",
           {
             htmlFor: wiring.id,
-            className: "ds:text-fg ds:text-[13px] ds:leading-none ds:font-medium",
+            className: "ds:text-fg ds:text-(length:--text-label) ds:leading-none ds:font-medium",
             children: label
           }
         ) : /* @__PURE__ */ jsx("span", {}),
-        showValue && /* @__PURE__ */ jsx("span", { className: "ds:text-fg-3 ds:font-mono ds:text-[12px]", children: displayValue })
+        showValue && /* @__PURE__ */ jsx("span", { className: "ds:text-fg-3 ds:font-mono ds:text-(length:--text-helper)", children: displayValue })
       ] }),
       /* @__PURE__ */ jsxs(
         SliderPrimitive.Root,
@@ -6621,7 +6734,7 @@ function columnLabel(index) {
 }
 var headerCell = cn(
   "ds:border-rule-soft ds:bg-bg-2 ds:text-fg-4 ds:sticky ds:border-b ds:border-r",
-  "ds:font-mono ds:text-[11px] ds:font-medium",
+  "ds:font-mono ds:text-(length:--text-code) ds:font-medium",
   "ds:select-none"
 );
 var SpreadsheetPreview = forwardRef(
@@ -6868,7 +6981,7 @@ var StackedBarChart = forwardRef(
         showYAxis && /* @__PURE__ */ jsx(
           "div",
           {
-            className: "ds:text-fg-4 ds:relative ds:shrink-0 ds:text-[11px] ds:tabular-nums",
+            className: "ds:text-fg-4 ds:relative ds:shrink-0 ds:text-(length:--text-caption) ds:tabular-nums",
             style: { width: Y_GUTTER, height },
             "aria-hidden": true,
             children: ticks.map((t) => /* @__PURE__ */ jsx(
@@ -6962,7 +7075,7 @@ var StackedBarChart = forwardRef(
                   );
                 }) })
               ] }),
-              showXAxis && /* @__PURE__ */ jsx("div", { className: "ds:text-fg-3 ds:mt-2 ds:flex ds:gap-3 ds:text-[11px]", children: bars.map((bar, i) => /* @__PURE__ */ jsx(
+              showXAxis && /* @__PURE__ */ jsx("div", { className: "ds:text-fg-3 ds:mt-2 ds:flex ds:gap-3 ds:text-(length:--text-caption)", children: bars.map((bar, i) => /* @__PURE__ */ jsx(
                 "div",
                 {
                   className: "ds:flex ds:flex-1 ds:items-center ds:justify-center ds:gap-1.5 ds:truncate ds:text-center",
@@ -6991,7 +7104,7 @@ var StackedBarChart = forwardRef(
                 ),
                 formatValue(hover.value)
               ] }),
-              /* @__PURE__ */ jsx("span", { className: "ds:block ds:text-[10px] ds:opacity-70", children: (() => {
+              /* @__PURE__ */ jsx("span", { className: "ds:block ds:text-(length:--text-micro) ds:opacity-70", children: (() => {
                 const col = bars[hover.barIndex];
                 const colLabel = col?.tooltipLabel ?? (typeof col?.label === "string" ? col.label : "");
                 return colLabel ? `${colLabel} \xB7 ${hover.label}` : hover.label;
@@ -9753,9 +9866,9 @@ var filterChipVariants = cva(
       // Control text scale shared with Button / MultiFilterPill: sm = 13px,
       // md = 14px, lg = 16px. Defaults to the dense `sm` tier (toolbar control).
       size: {
-        sm: "ds:h-8 ds:px-3 ds:text-[13px]",
-        md: "ds:h-9 ds:px-3.5 ds:text-sm",
-        lg: "ds:h-10 ds:px-4 ds:text-base"
+        sm: "ds:h-(--filter-chip-height-sm) ds:px-3 ds:text-[13px]",
+        md: "ds:h-(--filter-chip-height-md) ds:px-3.5 ds:text-sm",
+        lg: "ds:h-(--filter-chip-height-lg) ds:px-4 ds:text-base"
       }
     },
     defaultVariants: {