@assure-one/design-system 1.43.0 → 1.43.1

package/dist/{chunk-TYXT5C2B.js → chunk-L5IQK3GV.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-XJKCKBHI.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, ChevronDownIcon } from './chunk-TBDTXAFH.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-VK6SW34V.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-TBDTXAFH.js';
 import { parseHexColor, contrastRatio, WHITE, formatHexColor, darkenUntilContrast } from './chunk-EUHGZA6Q.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import * as React6 from 'react';
@@ -3382,7 +3382,10 @@ var Sidebar = React6.forwardRef(function Sidebar2({
   };
   const overlay = state === "rail" && (peek || peekLockCount > 0);
   const labelsHidden = state === "rail" && !peek && peekLockCount === 0;
-  const effectiveWidth = labelsHidden ? "var(--shell-sidebar-w-rail, var(--ds-layout-shell-sidebar-rail-width))" : "var(--shell-sidebar-w, var(--ds-layout-shell-sidebar-width))";
+  const railWidth = "var(--shell-sidebar-w-rail, var(--ds-layout-shell-sidebar-rail-width))";
+  const fullWidth = "var(--shell-sidebar-w, var(--ds-layout-shell-sidebar-width))";
+  const effectiveWidth = labelsHidden ? railWidth : fullWidth;
+  const overlayMarginRight = isFloating ? `calc(0.625rem + ${railWidth} - ${fullWidth})` : `calc(${railWidth} - ${fullWidth})`;
   return (
     // Hover-peek is *enhancement only*: the canonical way to toggle the
     // sidebar is <SidebarTrigger> (button) or the Mod+\ shortcut, both
@@ -3403,7 +3406,11 @@ var Sidebar = React6.forwardRef(function Sidebar2({
         ...slot(sidebarAnatomy, "root"),
         onMouseEnter: handleEnter,
         onMouseLeave: handleLeave,
-        style: { width: effectiveWidth, ...style },
+        style: {
+          width: effectiveWidth,
+          ...overlay ? { marginRight: overlayMarginRight } : null,
+          ...style
+        },
         className: cn(
           "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
@@ -3418,12 +3425,13 @@ var Sidebar = React6.forwardRef(function Sidebar2({
           // movement) but well short of `--duration-slow` (which feels
           // sluggish). `will-change` hints the compositor so the column
           // doesn't repaint every frame mid-transition.
-          "ds:transition-[width,box-shadow] ds:duration-[var(--motion-duration-spatial)] ds:ease-[var(--motion-ease-move)] ds:motion-reduce:transition-none",
+          "ds:transition-[width,margin-right,box-shadow] ds:duration-[var(--motion-duration-spatial)] ds:ease-[var(--motion-ease-move)] ds:motion-reduce:transition-none",
           "ds:[will-change:width]",
           // Overlay (hover-peek OR programmatic peek-lock): float above the
-          // canvas without reflowing layout. Driven by `data-overlay` so a
-          // single rule handles both transient sources.
-          "ds:data-[overlay=true]:fixed ds:data-[overlay=true]:top-0 ds:data-[overlay=true]:left-0",
+          // canvas without reflowing layout (the negative margin above keeps
+          // the rail's footprint). Driven by `data-overlay` so a single rule
+          // handles both transient sources.
+          "ds:data-[overlay=true]:relative",
           "ds:data-[overlay=true]:z-[var(--z-overlay)] ds:data-[overlay=true]:shadow-pop",
           // Padding is held constant across states so icons keep their
           // horizontal anchor when the column widens — peek expands the
@@ -3514,7 +3522,7 @@ var SidebarPinButton = React6.forwardRef(
       {
         ref,
         type: "button",
-        "aria-label": isPinned ? unpinLabel ?? messages.unpin : pinLabel ?? messages.pin,
+        "aria-label": isPinned ? unpinLabel ?? messages.collapse : pinLabel ?? messages.expand,
         "aria-pressed": isPinned,
         onClick: (e) => {
           onClick?.(e);
@@ -3534,44 +3542,12 @@ var SidebarPinButton = React6.forwardRef(
           className
         ),
         ...props,
-        children: /* @__PURE__ */ jsx(PinGlyph, { size: 14, filled: isPinned, className: "ds:rotate-45" })
+        children: isPinned ? /* @__PURE__ */ jsx(ChevronsLeftIcon, { size: 16 }) : /* @__PURE__ */ jsx(ChevronsRightIcon, { size: 16 })
       }
     );
   }
 );
 SidebarPinButton.displayName = "SidebarPinButton";
-function PinGlyph({
-  size = 16,
-  filled = false,
-  className
-}) {
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: size,
-      height: size,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      className,
-      children: [
-        /* @__PURE__ */ jsx("path", { d: "M12 17v5" }),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z",
-            fill: filled ? "currentColor" : "none"
-          }
-        )
-      ]
-    }
-  );
-}
 var SidebarBrand = React6.forwardRef(
   function SidebarBrand2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
@@ -4421,5 +4397,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-TYXT5C2B.js.map
-//# sourceMappingURL=chunk-TYXT5C2B.js.map
+//# sourceMappingURL=chunk-L5IQK3GV.js.map
+//# sourceMappingURL=chunk-L5IQK3GV.js.map