@assure-one/design-system 1.44.1 → 1.46.0

package/dist/{chunk-4TXBY6P7.js → chunk-JJ5JFA56.js}

@@ -1,5 +1,5 @@
-import { stateAttributes, slot, chipAnatomy, Pressable, CONTROL_GAP_CLASSES, EN_MESSAGES, microInteractions, listItemClasses, groupHeadingClasses, useDsMessages, withPortalContainer, Backdrop, sheetAnatomy, deprecate, OverlaySurface, DismissButton, DEFAULT_OVERLAY_MESSAGES, DISMISS_GLYPH_CLASSES, OverlayBody, OverlayTitle, OverlayDescription, Input, Textarea, Select, FileUpload, FileChip, Button, Checkbox, Tooltip, TooltipTrigger, TooltipContent, useMergedRefs, TooltipProvider, sidebarAnatomy, Slot, Avatar, DropdownMenu, DropdownMenuTrigger, sidebarBrandSwitcherAnatomy, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuItem, buttonBase, CONTROL_SIZE_CLASSES, useFieldControl, useId as useId$1, useControllableState, Popover, PopoverAnchor, comboboxAnatomy, Spinner, IconButton, PopoverContent, LIST_SEPARATOR, listItemAttributes, optionElementId, FormBridge, useLinkComponent, useImageComponent, OverlayHeader, OverlayFooter, LIST_ITEM_INDICATOR_WELL } from './chunk-Z7QPHPNV.js';
-import { cn, XIcon, CheckIcon, EyeIcon, DownloadIcon, PhoneIcon, MailIcon, GlobeIcon, HomeIcon, ChevronLeftIcon, ChevronRightIcon, ReceiptIcon, RotateCcwIcon, CreditCardIcon, LockIcon, FileTextIcon, PlayIcon, InfoIcon, ClockIcon, PenSignIcon, TrashIcon, PlusIcon, CheckCircleSolidIcon, HelpCircleIcon, MinusIcon, PanelLeftCloseIcon, PanelLeftIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronDownIcon } from './chunk-E2URQD5A.js';
+import { stateAttributes, slot, chipAnatomy, Pressable, CONTROL_GAP_CLASSES, EN_MESSAGES, microInteractions, listItemClasses, groupHeadingClasses, useDsMessages, withPortalContainer, Backdrop, sheetAnatomy, deprecate, OverlaySurface, DismissButton, DEFAULT_OVERLAY_MESSAGES, DISMISS_GLYPH_CLASSES, OverlayBody, OverlayTitle, OverlayDescription, Input, Textarea, Select, FileUpload, FileChip, Button, Checkbox, Tooltip, TooltipTrigger, TooltipContent, useMergedRefs, TooltipProvider, sidebarAnatomy, Slot, Avatar, DropdownMenu, DropdownMenuTrigger, sidebarBrandSwitcherAnatomy, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuItem, buttonBase, CONTROL_SIZE_CLASSES, useFieldControl, useId as useId$1, useControllableState, Popover, PopoverAnchor, comboboxAnatomy, Spinner, IconButton, PopoverContent, LIST_SEPARATOR, listItemAttributes, optionElementId, FormBridge, useLinkComponent, useImageComponent, OverlayHeader, OverlayFooter, LIST_ITEM_INDICATOR_WELL } from './chunk-IIBDSTOG.js';
+import { cn, XIcon, CheckIcon, EyeIcon, DownloadIcon, PhoneIcon, MailIcon, GlobeIcon, HomeIcon, ChevronLeftIcon, ChevronRightIcon, ReceiptIcon, RotateCcwIcon, CreditCardIcon, LockIcon, FileTextIcon, PlayIcon, InfoIcon, ClockIcon, PenSignIcon, TrashIcon, PlusIcon, CheckCircleSolidIcon, HelpCircleIcon, MinusIcon, PanelLeftCloseIcon, PanelLeftIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronDownIcon } from './chunk-ARCWF2S3.js';
 import { parseHexColor, contrastRatio, WHITE, formatHexColor, darkenUntilContrast } from './chunk-EUHGZA6Q.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import * as React6 from 'react';
@@ -9,7 +9,7 @@ import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
 import * as SheetPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
 
-var BRAND_BASE_FILL = "#070707";
+var BRAND_BASE_FILL = "var(--ds-color-content, var(--color-fg, #070707))";
 var BRAND_BASE_PATH = "M43.8298 23.829C46.9635 23.7428 50.7456 23.9675 54.0114 23.9437L91.3493 23.8048C97.6806 23.7927 101.727 24.9883 106.302 29.5107C107.671 30.864 108.443 32.0751 109.418 33.7063C112.332 38.5806 112.037 42.6442 112.003 48.0679L112.02 56.4922C108.427 57.4911 101.053 57.2229 96.9953 57.2944C87.0232 57.47 76.9072 57.2055 66.9345 57.4014C66.7192 66.474 66.9079 75.8103 66.8438 84.9327C66.7469 92.0668 67.2878 101.738 66.6431 108.599C60.7359 108.871 54.5467 108.479 48.6135 108.641C40.5834 108.86 34.2651 108.559 28.1575 102.692C20.618 95.4486 21.8015 86.9701 21.8025 77.474L21.8166 59.8481L21.8312 49.597C21.8372 47.075 21.7515 43.5009 22.2502 41.142C22.9069 38.0359 25.4258 33.4304 27.6724 31.1548C32.4002 26.3658 37.1772 24.0905 43.8298 23.829Z";
 var BRAND_ACCENT_PATH = "M83.7555 72.8376C85.3789 72.6548 90.5991 72.7708 92.4304 72.7692L100.779 72.7802C102.529 72.7903 104.546 72.7296 106.26 73.0259C108.43 73.422 111.61 75.5699 111.737 77.9539C112.107 84.8649 111.986 91.8555 111.974 98.7715C111.969 101.35 111.928 103.109 110.232 105.149C108.61 107.101 107.07 108.323 104.518 108.621C99.7602 108.503 95.0005 108.467 90.2413 108.513C87.5612 108.531 84.6034 108.799 81.9937 108.434C78.4024 107.933 76.1145 105.214 76.0317 101.618C75.9281 97.1186 75.8903 92.669 75.9646 88.174C76.0209 84.7695 75.8279 81.2851 76.3134 77.921C76.3993 77.3266 77.1785 76.1903 77.6286 75.7193C79.6145 73.6412 80.9496 73.0158 83.7555 72.8376Z";
 function BrandIcon({
@@ -1094,8 +1094,9 @@ var CollapsibleTrigger = React6.forwardRef(function CollapsibleTrigger2({ classN
     {
       ref,
       className: cn(
-        "ds:flex ds:w-full ds:items-center",
+        "ds:flex ds:w-full ds:cursor-pointer ds:items-center",
         "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
+        "ds:disabled:cursor-not-allowed",
         className
       ),
       ...props
@@ -1572,7 +1573,7 @@ var AgreementViewer = forwardRef(
                 {
                   className: "ds:hidden ds:w-[340px] ds:shrink-0 ds:flex-col ds:overflow-y-auto ds:p-8 ds:text-white ds:@5xl/agreement:group-data-[view=cover]/agreement:flex",
                   style: {
-                    backgroundImage: "linear-gradient(166deg, var(--av-accent-light) 0%, var(--av-accent) 50%, var(--av-accent-deep) 100%)"
+                    backgroundImage: "linear-gradient(166deg, var(--av-rail-from) 0%, var(--av-rail-via) 50%, var(--av-rail-to) 100%)"
                   },
                   children: [
                     /* @__PURE__ */ jsx(
@@ -1584,7 +1585,7 @@ var AgreementViewer = forwardRef(
                       }
                     ),
                     /* @__PURE__ */ jsx("div", { className: "ds:mt-4 ds:text-[21px] ds:leading-tight ds:font-semibold", children: firm.name }),
-                    firm.tagline && /* @__PURE__ */ jsx("div", { className: "ds:mt-1.5 ds:text-[13px] ds:leading-snug ds:text-white/80", children: firm.tagline }),
+                    firm.tagline && /* @__PURE__ */ jsx("div", { className: "ds:mt-1.5 ds:text-[13px] ds:leading-snug ds:text-white/90", children: firm.tagline }),
                     firm.contact && /* @__PURE__ */ jsxs("div", { className: "ds:mt-auto ds:pt-7", children: [
                       /* @__PURE__ */ jsx("div", { className: "ds:mb-4 ds:h-px ds:bg-white/20" }),
                       /* @__PURE__ */ jsxs("div", { className: "ds:flex ds:flex-col ds:gap-3 ds:text-[12.5px] ds:text-white/90", children: [
@@ -3415,7 +3416,19 @@ var Sidebar = React6.forwardRef(function Sidebar2({
           "ds:group/sidebar group/sidebar ds:scrollbar-thin ds:flex ds:shrink-0 ds:flex-col ds:overflow-y-auto ds:px-3 ds:pt-4 ds:pb-4",
           // Classic: full-height column flush to the left edge with a right
           // rule. The legacy look.
-          !isFloating && "ds:h-dvh ds:border-rule ds:bg-bg-2 ds:border-r",
+          !isFloating && "ds:h-dvh ds:border-rule ds:border-r",
+          !isFloating && (isFlush ? "ds:bg-surface" : "ds:bg-bg-2"),
+          // Flush against a `bg-bg` canvas (Shell's own background) `bg-bg-2`
+          // (--color-bg-2, #f1f3f8 light / #141416 dark) sits only ~1.06:1 off
+          // the page (#f7f8fa / #0a0a0b) — the two regions read as one grey
+          // field with a hairline in the middle, not two surfaces. `surface`
+          // (white / #16161a) against the same canvas is the ~2–3x bigger
+          // luminance step the classic Notion/Linear sidebar convention reads
+          // on, and it is the token every card in the product already sits
+          // on, so the column now looks like the same kind of "raised" surface
+          // as the content it fronts, not a third, unrelated grey. `classic`
+          // and `floating` are unchanged (visual change note: the sidebar
+          // background change below is for `variant="flush"` only).
           // Floating: a detached, rounded card inset from the viewport with a
           // soft shadow — the modern SaaS pattern. The clear figure/ground gap
           // (Aesthetic-Usability) reads as its own surface above the canvas.
@@ -3482,7 +3495,7 @@ var SidebarTrigger = React6.forwardRef(
         },
         ...slot(sidebarAnatomy, "trigger"),
         className: cn(
-          "ds:inline-flex ds:size-7 ds:shrink-0 ds:items-center ds:justify-center ds:rounded-md",
+          "ds:inline-flex ds:size-7 ds:shrink-0 ds:cursor-pointer ds:items-center ds:justify-center ds:rounded-md",
           "ds:text-fg-3 ds:hover:bg-bg-3 ds:hover:text-fg",
           "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
           "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
@@ -3531,7 +3544,7 @@ var SidebarPinButton = React6.forwardRef(
         ...slot(sidebarAnatomy, "pin"),
         ...stateAttributes({ selected: isPinned }),
         className: cn(
-          "ds:inline-flex ds:size-7 ds:shrink-0 ds:items-center ds:justify-center ds:rounded-md",
+          "ds:inline-flex ds:size-7 ds:shrink-0 ds:cursor-pointer ds:items-center ds:justify-center ds:rounded-md",
           "ds:text-fg-4 ds:hover:bg-bg-3 ds:hover:text-fg ds:aria-pressed:text-fg",
           "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)]",
@@ -3561,7 +3574,10 @@ var SidebarBrand = React6.forwardRef(
           // pass behind it instead of over it. `data-scrolled` is only ever
           // set while flush (see <Sidebar>), so the hairline needs no variant
           // check of its own — one derived attribute, one rule.
-          "ds:group-data-[variant=flush]/sidebar:bg-bg-2 ds:group-data-[variant=flush]/sidebar:sticky ds:group-data-[variant=flush]/sidebar:top-0 ds:group-data-[variant=flush]/sidebar:z-[var(--z-sticky)]",
+          // Sticky row's fill matches the aside's own flush background
+          // (`bg-surface`, W-cursor-sidebar-tooltips) so scrolled nav rows
+          // disappear behind it rather than showing through.
+          "ds:group-data-[variant=flush]/sidebar:bg-surface ds:group-data-[variant=flush]/sidebar:sticky ds:group-data-[variant=flush]/sidebar:top-0 ds:group-data-[variant=flush]/sidebar:z-[var(--z-sticky)]",
           "ds:group-data-[variant=flush]/sidebar:border-b ds:group-data-[variant=flush]/sidebar:border-transparent ds:group-data-[variant=flush]/sidebar:transition-colors ds:group-data-[variant=flush]/sidebar:duration-[var(--duration-normal)] ds:group-data-[variant=flush]/sidebar:ease-[var(--ease-out-quart)] ds:group-data-[variant=flush]/sidebar:motion-reduce:transition-none",
           "ds:group-data-[scrolled=true]/sidebar:border-rule",
           className
@@ -3698,7 +3714,7 @@ var SidebarLink = React6.forwardRef(
         "aria-label": accessibleLabel,
         ...slot(sidebarAnatomy, "link"),
         className: cn(
-          "ds:group/link ds:relative ds:mb-px ds:flex ds:items-center ds:gap-2.5 ds:rounded-md ds:px-2.5 ds:py-1.5",
+          "ds:group/link ds:relative ds:mb-px ds:flex ds:cursor-pointer ds:items-center ds:gap-2.5 ds:rounded-md ds:px-2.5 ds:py-1.5",
           "ds:text-fg-2 ds:text-[13px] ds:font-normal ds:no-underline",
           "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
           "ds:motion-reduce:transition-none",
@@ -3902,7 +3918,7 @@ var SidebarLinkGroup = React6.forwardRef(
     };
     const contentId = `${id}-content`;
     const bodyClassName = cn(
-      "ds:group/link ds:relative ds:flex ds:flex-1 ds:items-center ds:gap-2.5 ds:rounded-md ds:px-2.5 ds:py-1.5",
+      "ds:group/link ds:relative ds:flex ds:flex-1 ds:cursor-pointer ds:items-center ds:gap-2.5 ds:rounded-md ds:px-2.5 ds:py-1.5",
       "ds:text-fg-2 ds:text-[13px] ds:font-normal ds:no-underline",
       "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)]",
       "ds:motion-reduce:transition-none",
@@ -3980,7 +3996,7 @@ var SidebarLinkGroup = React6.forwardRef(
                 onClick: handleChevronClick,
                 ...slot(sidebarAnatomy, "group-trigger"),
                 className: cn(
-                  "ds:ml-px ds:inline-flex ds:size-7 ds:shrink-0 ds:items-center ds:justify-center ds:rounded-md",
+                  "ds:ml-px ds:inline-flex ds:size-7 ds:shrink-0 ds:cursor-pointer ds:items-center ds:justify-center ds:rounded-md",
                   "ds:text-fg-4 ds:hover:bg-bg-3 ds:hover:text-fg-2",
                   "ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
                   "ds:focus-visible:[box-shadow:var(--shadow-focus-ring)] ds:focus-visible:outline-none",
@@ -4155,8 +4171,9 @@ var SidebarBrandSwitcher = React6.forwardRef(
             // Flush — mirrors <SidebarBrand>: pinned to the top of the
             // scrolling column, with a hairline that appears once the list
             // has scrolled. `data-scrolled` is only ever set while flush, so
-            // the hairline rule needs no variant check of its own.
-            "ds:group-data-[variant=flush]/sidebar:bg-bg-2 ds:group-data-[variant=flush]/sidebar:sticky ds:group-data-[variant=flush]/sidebar:top-0 ds:group-data-[variant=flush]/sidebar:z-[var(--z-sticky)]",
+            // the hairline rule needs no variant check of its own. Fill
+            // matches the aside's own flush background (`bg-surface`).
+            "ds:group-data-[variant=flush]/sidebar:bg-surface ds:group-data-[variant=flush]/sidebar:sticky ds:group-data-[variant=flush]/sidebar:top-0 ds:group-data-[variant=flush]/sidebar:z-[var(--z-sticky)]",
             "ds:group-data-[variant=flush]/sidebar:border-b ds:group-data-[variant=flush]/sidebar:border-transparent ds:group-data-[variant=flush]/sidebar:transition-colors ds:group-data-[variant=flush]/sidebar:duration-[var(--duration-normal)] ds:group-data-[variant=flush]/sidebar:ease-[var(--ease-out-quart)] ds:group-data-[variant=flush]/sidebar:motion-reduce:transition-none",
             "ds:group-data-[scrolled=true]/sidebar:border-rule",
             className
@@ -4173,7 +4190,7 @@ var SidebarBrandSwitcher = React6.forwardRef(
                     // the column edge while the inner padding holds the brand
                     // glyph at the same x-position as direct <SidebarBrand>
                     // children — same hover affordance, no glyph drift.
-                    "ds:group/brand-trigger ds:-ml-2 ds:flex ds:min-w-0 ds:flex-1 ds:items-center ds:gap-2 ds:rounded-md ds:py-1.5 ds:pr-1.5 ds:pl-2",
+                    "ds:group/brand-trigger ds:-ml-2 ds:flex ds:min-w-0 ds:flex-1 ds:cursor-pointer ds:items-center ds:gap-2 ds:rounded-md ds:py-1.5 ds:pr-1.5 ds:pl-2",
                     "ds:text-fg ds:transition-colors ds:duration-[var(--duration-fast)] ds:ease-[var(--ease-out-quart)] ds:motion-reduce:transition-none",
                     // `aria-expanded` twin: a TooltipTrigger asChild ancestor can
                     // clobber this trigger's own `data-state` with the tooltip's
@@ -4397,5 +4414,5 @@ var BrandScope = forwardRef(function BrandScope2({ product, children, ...props }
 BrandScope.displayName = "BrandScope";
 
 export { AgreementPaneHeading, AgreementViewer, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, BRAND_PRODUCTS, BrandScope, BrandScopeProvider, Chip, ClientSelect, CmdkCompatContext, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComingSoon, DEFAULT_COMBOBOX_MESSAGES, Grid, Logo, PlainLink, ProposalAddOn, ProposalBillingTerms, ProposalConsentGate, ProposalCustomPage, ProposalNote, ProposalPackageCard, ProposalPaymentCapture, ProposalPricingSummary, ProposalServiceRow, ProposalSignatureBlock, ProposalSignerList, QUESTION_TYPES, QUESTION_TYPE_CONTRACT_VERSION, Questions, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarBrand, SidebarBrandSwitcher, SidebarBrandSwitcherTile, SidebarBrandText, SidebarDrawer, SidebarFooter, SidebarLink, SidebarLinkAction, SidebarLinkBadge, SidebarLinkGroup, SidebarLinkLabel, SidebarPinButton, SidebarProvider, SidebarSection, SidebarTrigger, SidebarUser, assetPath, brandLabel, brandScope, chipVariants, getAssetBasePath, resolveChipStyle, setAssetBasePath, sidebarLinkBadgeVariants, useBrandScope, useSidebarPeekLock, useSidebarState };
-//# sourceMappingURL=chunk-4TXBY6P7.js.map
-//# sourceMappingURL=chunk-4TXBY6P7.js.map
+//# sourceMappingURL=chunk-JJ5JFA56.js.map
+//# sourceMappingURL=chunk-JJ5JFA56.js.map