@psnext/design-system 1.5.1 → 2.1.0

package/dist/primitives/NavigationMenu/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["NavigationMenuPrimitive","cn","ChevronDownIcon"],"sources":["../../../src/primitives/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a horizontal navigation bar; renders a `<nav>` and optionally an animated viewport. */\nfunction NavigationMenu({\n  className,\n  children,\n  viewport = true,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n  /** When true (default), renders a shared animated viewport that hosts the active item's content. Set false to render content inline beneath each item. */\n  viewport?: boolean;\n}) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot=\"navigation-menu\"\n      data-viewport={viewport}\n      className={cn(\n        \"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {viewport && <NavigationMenuViewport />}\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/** Horizontal list wrapper for the top-level navigation items. */\nfunction NavigationMenuList({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot=\"navigation-menu-list\"\n      className={cn(\"group flex flex-1 list-none items-center justify-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single top-level entry; holds either a link or a trigger plus its content. */\nfunction NavigationMenuItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot=\"navigation-menu-item\"\n      className={cn(\"relative\", className)}\n      {...props}\n    />\n  );\n}\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-9 w-max items-center justify-center rounded-lg bg-background px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-accent/50 data-[state=open]:text-accent-foreground data-[state=open]:hover:bg-accent data-[state=open]:focus:bg-accent\",\n);\n\n/** Button that toggles an item's content panel; renders a rotating chevron. */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot=\"navigation-menu-trigger\"\n      className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n      {...props}\n    >\n      {children}{\" \"}\n      <ChevronDownIcon\n        className=\"relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n        aria-hidden=\"true\"\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/** The panel revealed when an item's trigger is open; holds links or rich content. */\nfunction NavigationMenuContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot=\"navigation-menu-content\"\n      className={cn(\n        \"top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n        \"group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Shared animated container that the active item's content is portaled into when `viewport` is enabled. */\nfunction NavigationMenuViewport({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n  return (\n    <div className={cn(\"absolute top-full left-0 isolate z-50 flex justify-center\")}>\n      <NavigationMenuPrimitive.Viewport\n        data-slot=\"navigation-menu-viewport\"\n        className={cn(\n          \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n}\n\n/** A navigable link styled for use as a top-level item or inside content; set `active` to mark the current page. */\nfunction NavigationMenuLink({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot=\"navigation-menu-link\"\n      className={cn(\n        \"flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground data-[active=true]:hover:bg-accent data-[active=true]:focus:bg-accent [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Optional arrow that points from the active trigger to its content panel. */\nfunction NavigationMenuIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n  return (\n    <NavigationMenuPrimitive.Indicator\n      data-slot=\"navigation-menu-indicator\"\n      className={cn(\n        \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md\" />\n    </NavigationMenuPrimitive.Indicator>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  navigationMenuTriggerStyle,\n};\n"],"mappings":";;;;;;;;AAQA,SAAS,eAAe,EACtB,WACA,UACA,WAAW,MACX,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,iBAAe;EACf,WAAWC,WAAAA,GACT,oFACA,SACF;EACA,GAAI;YAPN,CASG,UACA,YAAY,iBAAA,GAAA,kBAAA,KAAC,wBAAD,CAAyB,CAAA,CACV;;AAElC;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,YAAY,SAAS;EACnC,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,8BAAA,GAAA,yBAAA,KACJ,8fACF;;AAGA,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;CAC/D,OACE,iBAAA,GAAA,kBAAA,MAACD,SAAAA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,2BAA2B,GAAG,SAAS,SAAS;EAC9D,GAAI;YAHN;GAKG;GAAU;GACX,iBAAA,GAAA,kBAAA,KAACC,aAAAA,iBAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;;AAGA,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;CAC/D,OACE,iBAAA,GAAA,kBAAA,KAACF,SAAAA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,oWACA,6hCACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAWA,WAAAA,GAAG,2DAA2D;YAC5E,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,UAAzB;GACE,aAAU;GACV,WAAWC,WAAAA,GACT,sVACA,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,ydACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;CACjE,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,WAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,gMACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,WAAU,yEAA0E,CAAA;CACxD,CAAA;AAEvC"}
+{"version":3,"file":"index.cjs","names":["NavigationMenuPrimitive","cn","ChevronDownIcon"],"sources":["../../../src/primitives/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a horizontal navigation bar; renders a `<nav>` and optionally an animated viewport. */\nfunction NavigationMenu({\n  className,\n  children,\n  viewport = true,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n  /** When true (default), renders a shared animated viewport that hosts the active item's content. Set false to render content inline beneath each item. */\n  viewport?: boolean;\n}) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot=\"navigation-menu\"\n      data-viewport={viewport}\n      className={cn(\n        \"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {viewport && <NavigationMenuViewport />}\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/** Horizontal list wrapper for the top-level navigation items. */\nfunction NavigationMenuList({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot=\"navigation-menu-list\"\n      className={cn(\"group flex flex-1 list-none items-center justify-center gap-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single top-level entry; holds either a link or a trigger plus its content. */\nfunction NavigationMenuItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot=\"navigation-menu-item\"\n      className={cn(\"relative\", className)}\n      {...props}\n    />\n  );\n}\n\n/* Figma (288:184487): triggers are the Ghost Button recipe — heading-6 type,\n   36px box, px-4, rounded-8, ghost hover/open tints. */\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-9 w-max items-center justify-center gap-2 rounded-8 bg-ghost-bg px-4 py-2 font-heading text-sm leading-6 font-medium text-primary-txt transition-[color,box-shadow] outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-toggle-active-bg\",\n);\n\n/** Button that toggles an item's content panel; renders a rotating chevron. */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot=\"navigation-menu-trigger\"\n      className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n      {...props}\n    >\n      {children}{\" \"}\n      <ChevronDownIcon\n        className=\"relative top-px ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n        aria-hidden=\"true\"\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/** The panel revealed when an item's trigger is open; holds links or rich content. */\nfunction NavigationMenuContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot=\"navigation-menu-content\"\n      className={cn(\n        \"top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n        \"group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-12 group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-primary-border group-data-[viewport=false]/navigation-menu:bg-glass-none-bg group-data-[viewport=false]/navigation-menu:text-primary-txt group-data-[viewport=false]/navigation-menu:shadow-sm group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Shared animated container that the active item's content is portaled into when `viewport` is enabled. */\nfunction NavigationMenuViewport({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n  return (\n    <div className={cn(\"absolute top-full left-0 isolate z-50 flex justify-center\")}>\n      <NavigationMenuPrimitive.Viewport\n        data-slot=\"navigation-menu-viewport\"\n        className={cn(\n          \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-12 border border-primary-border bg-glass-none-bg text-primary-txt shadow-sm data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n}\n\n/** A navigable link styled for use as a top-level item or inside content; set `active` to mark the current page. */\nfunction NavigationMenuLink({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot=\"navigation-menu-link\"\n      className={cn(\n        // Link tiles: semibold-14 title + muted description on menu-item metrics.\n        \"flex flex-col gap-1 rounded-10 px-2 py-1.5 text-sm leading-5 transition-all outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 data-[active=true]:bg-toggle-active-bg [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-txt\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Optional arrow that points from the active trigger to its content panel. */\nfunction NavigationMenuIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n  return (\n    <NavigationMenuPrimitive.Indicator\n      data-slot=\"navigation-menu-indicator\"\n      className={cn(\n        \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"relative top-[60%] size-2 rotate-45 rounded-tl-2 bg-primary-border shadow-md\" />\n    </NavigationMenuPrimitive.Indicator>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  navigationMenuTriggerStyle,\n};\n"],"mappings":";;;;;;;;AAQA,SAAS,eAAe,EACtB,WACA,UACA,WAAW,MACX,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,iBAAe;EACf,WAAWC,WAAAA,GACT,oFACA,SACF;EACA,GAAI;YAPN,CASG,UACA,YAAY,iBAAA,GAAA,kBAAA,KAAC,wBAAD,CAAyB,CAAA,CACV;;AAElC;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,YAAY,SAAS;EACnC,GAAI;CACL,CAAA;AAEL;AAIA,MAAM,8BAAA,GAAA,yBAAA,KACJ,mZACF;;AAGA,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;CAC/D,OACE,iBAAA,GAAA,kBAAA,MAACD,SAAAA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,2BAA2B,GAAG,SAAS,SAAS;EAC9D,GAAI;YAHN;GAKG;GAAU;GACX,iBAAA,GAAA,kBAAA,KAACC,aAAAA,iBAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;;AAGA,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;CAC/D,OACE,iBAAA,GAAA,kBAAA,KAACF,SAAAA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,oWACA,imCACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAWA,WAAAA,GAAG,2DAA2D;YAC5E,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,UAAzB;GACE,aAAU;GACV,WAAWC,WAAAA,GACT,8WACA,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GAET,2UACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;CACjE,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,eAAwB,WAAzB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,gMACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAK,WAAU,+EAAgF,CAAA;CAC9D,CAAA;AAEvC"}

package/dist/primitives/NavigationMenu/index.js

@@ -18,7 +18,7 @@ function NavigationMenu({ className, children, viewport = true, ...props }) {
 function NavigationMenuList({ className, ...props }) {
 	return /* @__PURE__ */ jsx(NavigationMenu$1.List, {
 		"data-slot": "navigation-menu-list",
-		className: cn("group flex flex-1 list-none items-center justify-center gap-1", className),
+		className: cn("group flex flex-1 list-none items-center justify-center gap-0", className),
 		...props
 	});
 }
@@ -30,7 +30,7 @@ function NavigationMenuItem({ className, ...props }) {
 		...props
 	});
 }
-const navigationMenuTriggerStyle = cva("group inline-flex h-9 w-max items-center justify-center rounded-lg bg-background px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-accent/50 data-[state=open]:text-accent-foreground data-[state=open]:hover:bg-accent data-[state=open]:focus:bg-accent");
+const navigationMenuTriggerStyle = cva("group inline-flex h-9 w-max items-center justify-center gap-2 rounded-8 bg-ghost-bg px-4 py-2 font-heading text-sm leading-6 font-medium text-primary-txt transition-[color,box-shadow] outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-toggle-active-bg");
 /** Button that toggles an item's content panel; renders a rotating chevron. */
 function NavigationMenuTrigger({ className, children, ...props }) {
 	return /* @__PURE__ */ jsxs(NavigationMenu$1.Trigger, {
@@ -41,7 +41,7 @@ function NavigationMenuTrigger({ className, children, ...props }) {
 			children,
 			" ",
 			/* @__PURE__ */ jsx(ChevronDownIcon, {
-				className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
+				className: "relative top-px ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
 				"aria-hidden": "true"
 			})
 		]
@@ -51,7 +51,7 @@ function NavigationMenuTrigger({ className, children, ...props }) {
 function NavigationMenuContent({ className, ...props }) {
 	return /* @__PURE__ */ jsx(NavigationMenu$1.Content, {
 		"data-slot": "navigation-menu-content",
-		className: cn("top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto", "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95", className),
+		className: cn("top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto", "group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-12 group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-primary-border group-data-[viewport=false]/navigation-menu:bg-glass-none-bg group-data-[viewport=false]/navigation-menu:text-primary-txt group-data-[viewport=false]/navigation-menu:shadow-sm group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95", className),
 		...props
 	});
 }
@@ -61,7 +61,7 @@ function NavigationMenuViewport({ className, ...props }) {
 		className: cn("absolute top-full left-0 isolate z-50 flex justify-center"),
 		children: /* @__PURE__ */ jsx(NavigationMenu$1.Viewport, {
 			"data-slot": "navigation-menu-viewport",
-			className: cn("origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]", className),
+			className: cn("origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-12 border border-primary-border bg-glass-none-bg text-primary-txt shadow-sm data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]", className),
 			...props
 		})
 	});
@@ -70,7 +70,7 @@ function NavigationMenuViewport({ className, ...props }) {
 function NavigationMenuLink({ className, ...props }) {
 	return /* @__PURE__ */ jsx(NavigationMenu$1.Link, {
 		"data-slot": "navigation-menu-link",
-		className: cn("flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground data-[active=true]:hover:bg-accent data-[active=true]:focus:bg-accent [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className),
+		className: cn("flex flex-col gap-1 rounded-10 px-2 py-1.5 text-sm leading-5 transition-all outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 data-[active=true]:bg-toggle-active-bg [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-txt", className),
 		...props
 	});
 }
@@ -80,7 +80,7 @@ function NavigationMenuIndicator({ className, ...props }) {
 		"data-slot": "navigation-menu-indicator",
 		className: cn("top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in", className),
 		...props,
-		children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+		children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] size-2 rotate-45 rounded-tl-2 bg-primary-border shadow-md" })
 	});
 }
 //#endregion

package/dist/primitives/NavigationMenu/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["NavigationMenuPrimitive"],"sources":["../../../src/primitives/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a horizontal navigation bar; renders a `<nav>` and optionally an animated viewport. */\nfunction NavigationMenu({\n  className,\n  children,\n  viewport = true,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n  /** When true (default), renders a shared animated viewport that hosts the active item's content. Set false to render content inline beneath each item. */\n  viewport?: boolean;\n}) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot=\"navigation-menu\"\n      data-viewport={viewport}\n      className={cn(\n        \"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {viewport && <NavigationMenuViewport />}\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/** Horizontal list wrapper for the top-level navigation items. */\nfunction NavigationMenuList({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot=\"navigation-menu-list\"\n      className={cn(\"group flex flex-1 list-none items-center justify-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single top-level entry; holds either a link or a trigger plus its content. */\nfunction NavigationMenuItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot=\"navigation-menu-item\"\n      className={cn(\"relative\", className)}\n      {...props}\n    />\n  );\n}\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-9 w-max items-center justify-center rounded-lg bg-background px-4 py-2 text-sm font-medium transition-[color,box-shadow] outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-accent/50 data-[state=open]:text-accent-foreground data-[state=open]:hover:bg-accent data-[state=open]:focus:bg-accent\",\n);\n\n/** Button that toggles an item's content panel; renders a rotating chevron. */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot=\"navigation-menu-trigger\"\n      className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n      {...props}\n    >\n      {children}{\" \"}\n      <ChevronDownIcon\n        className=\"relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n        aria-hidden=\"true\"\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/** The panel revealed when an item's trigger is open; holds links or rich content. */\nfunction NavigationMenuContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot=\"navigation-menu-content\"\n      className={cn(\n        \"top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n        \"group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Shared animated container that the active item's content is portaled into when `viewport` is enabled. */\nfunction NavigationMenuViewport({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n  return (\n    <div className={cn(\"absolute top-full left-0 isolate z-50 flex justify-center\")}>\n      <NavigationMenuPrimitive.Viewport\n        data-slot=\"navigation-menu-viewport\"\n        className={cn(\n          \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n}\n\n/** A navigable link styled for use as a top-level item or inside content; set `active` to mark the current page. */\nfunction NavigationMenuLink({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot=\"navigation-menu-link\"\n      className={cn(\n        \"flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground data-[active=true]:hover:bg-accent data-[active=true]:focus:bg-accent [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Optional arrow that points from the active trigger to its content panel. */\nfunction NavigationMenuIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n  return (\n    <NavigationMenuPrimitive.Indicator\n      data-slot=\"navigation-menu-indicator\"\n      className={cn(\n        \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md\" />\n    </NavigationMenuPrimitive.Indicator>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  navigationMenuTriggerStyle,\n};\n"],"mappings":";;;;;;;AAQA,SAAS,eAAe,EACtB,WACA,UACA,WAAW,MACX,GAAG,SAIF;CACD,OACE,qBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,iBAAe;EACf,WAAW,GACT,oFACA,SACF;EACA,GAAI;YAPN,CASG,UACA,YAAY,oBAAC,wBAAD,CAAyB,CAAA,CACV;;AAElC;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,YAAY,SAAS;EACnC,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,6BAA6B,IACjC,8fACF;;AAGA,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;CAC/D,OACE,qBAACA,iBAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,GAAG,SAAS,SAAS;EAC9D,GAAI;YAHN;GAKG;GAAU;GACX,oBAAC,iBAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;;AAGA,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;CAC/D,OACE,oBAACA,iBAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GACT,oWACA,6hCACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAAC,OAAD;EAAK,WAAW,GAAG,2DAA2D;YAC5E,oBAACA,iBAAwB,UAAzB;GACE,aAAU;GACV,WAAW,GACT,sVACA,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GACT,ydACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;CACjE,OACE,oBAACA,iBAAwB,WAAzB;EACE,aAAU;EACV,WAAW,GACT,gMACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAK,WAAU,yEAA0E,CAAA;CACxD,CAAA;AAEvC"}
+{"version":3,"file":"index.js","names":["NavigationMenuPrimitive"],"sources":["../../../src/primitives/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport { NavigationMenu as NavigationMenuPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a horizontal navigation bar; renders a `<nav>` and optionally an animated viewport. */\nfunction NavigationMenu({\n  className,\n  children,\n  viewport = true,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n  /** When true (default), renders a shared animated viewport that hosts the active item's content. Set false to render content inline beneath each item. */\n  viewport?: boolean;\n}) {\n  return (\n    <NavigationMenuPrimitive.Root\n      data-slot=\"navigation-menu\"\n      data-viewport={viewport}\n      className={cn(\n        \"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      {viewport && <NavigationMenuViewport />}\n    </NavigationMenuPrimitive.Root>\n  );\n}\n\n/** Horizontal list wrapper for the top-level navigation items. */\nfunction NavigationMenuList({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n  return (\n    <NavigationMenuPrimitive.List\n      data-slot=\"navigation-menu-list\"\n      className={cn(\"group flex flex-1 list-none items-center justify-center gap-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single top-level entry; holds either a link or a trigger plus its content. */\nfunction NavigationMenuItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n  return (\n    <NavigationMenuPrimitive.Item\n      data-slot=\"navigation-menu-item\"\n      className={cn(\"relative\", className)}\n      {...props}\n    />\n  );\n}\n\n/* Figma (288:184487): triggers are the Ghost Button recipe — heading-6 type,\n   36px box, px-4, rounded-8, ghost hover/open tints. */\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-9 w-max items-center justify-center gap-2 rounded-8 bg-ghost-bg px-4 py-2 font-heading text-sm leading-6 font-medium text-primary-txt transition-[color,box-shadow] outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-toggle-active-bg\",\n);\n\n/** Button that toggles an item's content panel; renders a rotating chevron. */\nfunction NavigationMenuTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n  return (\n    <NavigationMenuPrimitive.Trigger\n      data-slot=\"navigation-menu-trigger\"\n      className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n      {...props}\n    >\n      {children}{\" \"}\n      <ChevronDownIcon\n        className=\"relative top-px ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n        aria-hidden=\"true\"\n      />\n    </NavigationMenuPrimitive.Trigger>\n  );\n}\n\n/** The panel revealed when an item's trigger is open; holds links or rich content. */\nfunction NavigationMenuContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n  return (\n    <NavigationMenuPrimitive.Content\n      data-slot=\"navigation-menu-content\"\n      className={cn(\n        \"top-0 left-0 w-full p-2 pr-2.5 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n        \"group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-12 group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:border-primary-border group-data-[viewport=false]/navigation-menu:bg-glass-none-bg group-data-[viewport=false]/navigation-menu:text-primary-txt group-data-[viewport=false]/navigation-menu:shadow-sm group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Shared animated container that the active item's content is portaled into when `viewport` is enabled. */\nfunction NavigationMenuViewport({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n  return (\n    <div className={cn(\"absolute top-full left-0 isolate z-50 flex justify-center\")}>\n      <NavigationMenuPrimitive.Viewport\n        data-slot=\"navigation-menu-viewport\"\n        className={cn(\n          \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-12 border border-primary-border bg-glass-none-bg text-primary-txt shadow-sm data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n}\n\n/** A navigable link styled for use as a top-level item or inside content; set `active` to mark the current page. */\nfunction NavigationMenuLink({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n  return (\n    <NavigationMenuPrimitive.Link\n      data-slot=\"navigation-menu-link\"\n      className={cn(\n        // Link tiles: semibold-14 title + muted description on menu-item metrics.\n        \"flex flex-col gap-1 rounded-10 px-2 py-1.5 text-sm leading-5 transition-all outline-none hover:bg-ghost-hover-bg focus:bg-ghost-hover-bg focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1 data-[active=true]:bg-toggle-active-bg [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-txt\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Optional arrow that points from the active trigger to its content panel. */\nfunction NavigationMenuIndicator({\n  className,\n  ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n  return (\n    <NavigationMenuPrimitive.Indicator\n      data-slot=\"navigation-menu-indicator\"\n      className={cn(\n        \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"relative top-[60%] size-2 rotate-45 rounded-tl-2 bg-primary-border shadow-md\" />\n    </NavigationMenuPrimitive.Indicator>\n  );\n}\n\nexport {\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  navigationMenuTriggerStyle,\n};\n"],"mappings":";;;;;;;AAQA,SAAS,eAAe,EACtB,WACA,UACA,WAAW,MACX,GAAG,SAIF;CACD,OACE,qBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,iBAAe;EACf,WAAW,GACT,oFACA,SACF;EACA,GAAI;YAPN,CASG,UACA,YAAY,oBAAC,wBAAD,CAAyB,CAAA,CACV;;AAElC;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,YAAY,SAAS;EACnC,GAAI;CACL,CAAA;AAEL;AAIA,MAAM,6BAA6B,IACjC,mZACF;;AAGA,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;CAC/D,OACE,qBAACA,iBAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GAAG,2BAA2B,GAAG,SAAS,SAAS;EAC9D,GAAI;YAHN;GAKG;GAAU;GACX,oBAAC,iBAAD;IACE,WAAU;IACV,eAAY;GACb,CAAA;EAC8B;;AAErC;;AAGA,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;CAC/D,OACE,oBAACA,iBAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GACT,oWACA,imCACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAAC,OAAD;EAAK,WAAW,GAAG,2DAA2D;YAC5E,oBAACA,iBAAwB,UAAzB;GACE,aAAU;GACV,WAAW,GACT,8WACA,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;;AAGA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,iBAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAET,2UACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;CACjE,OACE,oBAACA,iBAAwB,WAAzB;EACE,aAAU;EACV,WAAW,GACT,gMACA,SACF;EACA,GAAI;YAEJ,oBAAC,OAAD,EAAK,WAAU,+EAAgF,CAAA;CAC9D,CAAA;AAEvC"}

package/dist/primitives/Pagination/index.cjs

@@ -38,34 +38,28 @@ function PaginationLink({ className, isActive, size = "icon", ...props }) {
 		className: require_cn.cn(require_primitives_Button_index.buttonVariants({
 			variant: isActive ? "outline" : "ghost",
 			size
-		}), className),
+		}), "rounded-8", className),
 		...props
 	});
 }
 /** "Previous" control: a pagination link with a leading chevron and accessible label. */
 function PaginationPrevious({ className, ...props }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(PaginationLink, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PaginationLink, {
 		"aria-label": "Go to previous page",
 		size: "default",
-		className: require_cn.cn("gap-1 px-2.5 sm:pl-2.5", className),
+		className: require_cn.cn("px-2.5", className),
 		...props,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeftIcon, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "hidden sm:block",
-			children: "Previous"
-		})]
+		children: "Previous"
 	});
 }
 /** "Next" control: a pagination link with a trailing chevron and accessible label. */
 function PaginationNext({ className, ...props }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(PaginationLink, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PaginationLink, {
 		"aria-label": "Go to next page",
 		size: "default",
-		className: require_cn.cn("gap-1 px-2.5 sm:pr-2.5", className),
+		className: require_cn.cn("px-2.5", className),
 		...props,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "hidden sm:block",
-			children: "Next"
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRightIcon, {})]
+		children: "Next"
 	});
 }
 /** Non-interactive ellipsis indicating skipped page ranges. */

package/dist/primitives/Pagination/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["cn","buttonVariants","ChevronLeftIcon","ChevronRightIcon","MoreHorizontalIcon"],"sources":["../../../src/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { type Button, buttonVariants } from \"@/primitives/Button\";\nimport { cn } from \"@/utils\";\n\n/** Accessible pagination navigation landmark that wraps the list of page links. */\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal list container holding the individual pagination items. */\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex flex-row items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Single list item wrapper for a pagination link, ellipsis, or control. */\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  /** Marks this link as the current page; renders the outline (selected) style and sets `aria-current`. */\n  isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n  React.ComponentProps<\"a\">;\n\n/** Clickable page link styled with the Button variants; pass `isActive` for the current page. */\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Previous\" control: a pagination link with a leading chevron and accessible label. */\nfunction PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to previous page\"\n      size=\"default\"\n      className={cn(\"gap-1 px-2.5 sm:pl-2.5\", className)}\n      {...props}\n    >\n      <ChevronLeftIcon />\n      <span className=\"hidden sm:block\">Previous</span>\n    </PaginationLink>\n  );\n}\n\n/** \"Next\" control: a pagination link with a trailing chevron and accessible label. */\nfunction PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to next page\"\n      size=\"default\"\n      className={cn(\"gap-1 px-2.5 sm:pr-2.5\", className)}\n      {...props}\n    >\n      <span className=\"hidden sm:block\">Next</span>\n      <ChevronRightIcon />\n    </PaginationLink>\n  );\n}\n\n/** Non-interactive ellipsis indicating skipped page ranges. */\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontalIcon className=\"size-4\" />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationLink,\n  PaginationItem,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis,\n};\n"],"mappings":";;;;;;;AAOA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAWA,WAAAA,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAqC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAqC;CAChE,OAAO,iBAAA,GAAA,kBAAA,KAAC,MAAD;EAAI,aAAU;EAAkB,GAAI;CAAQ,CAAA;AACrD;;AASA,SAAS,eAAe,EAAE,WAAW,UAAU,OAAO,QAAQ,GAAG,SAA8B;CAC7F,OACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EACE,gBAAc,WAAW,SAAS,KAAA;EAClC,aAAU;EACV,eAAa;EACb,WAAWA,WAAAA,GACTC,gCAAAA,eAAe;GACb,SAAS,WAAW,YAAY;GAChC;EACF,CAAC,GACD,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAsD;CAChG,OACE,iBAAA,GAAA,kBAAA,MAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAWD,WAAAA,GAAG,0BAA0B,SAAS;EACjD,GAAI;YAJN,CAME,iBAAA,GAAA,kBAAA,KAACE,aAAAA,iBAAD,CAAkB,CAAA,GAClB,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAkB;EAAc,CAAA,CAClC;;AAEpB;;AAGA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsD;CAC5F,OACE,iBAAA,GAAA,kBAAA,MAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAWF,WAAAA,GAAG,0BAA0B,SAAS;EACjD,GAAI;YAJN,CAME,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAkB;EAAU,CAAA,GAC5C,iBAAA,GAAA,kBAAA,KAACG,aAAAA,kBAAD,CAAmB,CAAA,CACL;;AAEpB;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAuC;CACjF,OACE,iBAAA,GAAA,kBAAA,MAAC,QAAD;EACE,eAAA;EACA,aAAU;EACV,WAAWH,WAAAA,GAAG,2CAA2C,SAAS;EAClE,GAAI;YAJN,CAME,iBAAA,GAAA,kBAAA,KAACI,aAAAA,oBAAD,EAAoB,WAAU,SAAU,CAAA,GACxC,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAU;EAAgB,CAAA,CACtC;;AAEV"}
+{"version":3,"file":"index.cjs","names":["cn","buttonVariants","MoreHorizontalIcon"],"sources":["../../../src/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import { MoreHorizontalIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { type Button, buttonVariants } from \"@/primitives/Button\";\nimport { cn } from \"@/utils\";\n\n/** Accessible pagination navigation landmark that wraps the list of page links. */\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal list container holding the individual pagination items. */\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex flex-row items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Single list item wrapper for a pagination link, ellipsis, or control. */\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  /** Marks this link as the current page; renders the outline (selected) style and sets `aria-current`. */\n  isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n  React.ComponentProps<\"a\">;\n\n/** Clickable page link styled with the Button variants; pass `isActive` for the current page. */\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        // Pagination buttons are 8px-rounded squares (Figma 294:233630), not pills.\n        \"rounded-8\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Previous\" control: a pagination link with a leading chevron and accessible label. */\nfunction PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to previous page\"\n      size=\"default\"\n      className={cn(\"px-2.5\", className)}\n      {...props}\n    >\n      Previous\n    </PaginationLink>\n  );\n}\n\n/** \"Next\" control: a pagination link with a trailing chevron and accessible label. */\nfunction PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to next page\"\n      size=\"default\"\n      className={cn(\"px-2.5\", className)}\n      {...props}\n    >\n      Next\n    </PaginationLink>\n  );\n}\n\n/** Non-interactive ellipsis indicating skipped page ranges. */\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontalIcon className=\"size-4\" />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationLink,\n  PaginationItem,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis,\n};\n"],"mappings":";;;;;;;AAOA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAWA,WAAAA,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAqC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAqC;CAChE,OAAO,iBAAA,GAAA,kBAAA,KAAC,MAAD;EAAI,aAAU;EAAkB,GAAI;CAAQ,CAAA;AACrD;;AASA,SAAS,eAAe,EAAE,WAAW,UAAU,OAAO,QAAQ,GAAG,SAA8B;CAC7F,OACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EACE,gBAAc,WAAW,SAAS,KAAA;EAClC,aAAU;EACV,eAAa;EACb,WAAWA,WAAAA,GACTC,gCAAAA,eAAe;GACb,SAAS,WAAW,YAAY;GAChC;EACF,CAAC,GAED,aACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAsD;CAChG,OACE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAWD,WAAAA,GAAG,UAAU,SAAS;EACjC,GAAI;YACL;CAEe,CAAA;AAEpB;;AAGA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsD;CAC5F,OACE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAWA,WAAAA,GAAG,UAAU,SAAS;EACjC,GAAI;YACL;CAEe,CAAA;AAEpB;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAuC;CACjF,OACE,iBAAA,GAAA,kBAAA,MAAC,QAAD;EACE,eAAA;EACA,aAAU;EACV,WAAWA,WAAAA,GAAG,2CAA2C,SAAS;EAClE,GAAI;YAJN,CAME,iBAAA,GAAA,kBAAA,KAACE,aAAAA,oBAAD,EAAoB,WAAU,SAAU,CAAA,GACxC,iBAAA,GAAA,kBAAA,KAAC,QAAD;GAAM,WAAU;aAAU;EAAgB,CAAA,CACtC;;AAEV"}

package/dist/primitives/Pagination/index.d.cts

@@ -1,2 +1,2 @@
-import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../../index44.cjs";
+import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../../index45.cjs";
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };

package/dist/primitives/Pagination/index.d.ts

@@ -1,2 +1,2 @@
-import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../../index44.js";
+import { a as PaginationLink, i as PaginationItem, n as PaginationContent, o as PaginationNext, r as PaginationEllipsis, s as PaginationPrevious, t as Pagination } from "../../index45.js";
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };

package/dist/primitives/Pagination/index.js

@@ -1,6 +1,6 @@
 import { t as cn } from "../../cn.js";
 import { buttonVariants } from "../Button/index.js";
-import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
+import { MoreHorizontalIcon } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/primitives/Pagination/Pagination.tsx
 /** Accessible pagination navigation landmark that wraps the list of page links. */
@@ -37,34 +37,28 @@ function PaginationLink({ className, isActive, size = "icon", ...props }) {
 		className: cn(buttonVariants({
 			variant: isActive ? "outline" : "ghost",
 			size
-		}), className),
+		}), "rounded-8", className),
 		...props
 	});
 }
 /** "Previous" control: a pagination link with a leading chevron and accessible label. */
 function PaginationPrevious({ className, ...props }) {
-	return /* @__PURE__ */ jsxs(PaginationLink, {
+	return /* @__PURE__ */ jsx(PaginationLink, {
 		"aria-label": "Go to previous page",
 		size: "default",
-		className: cn("gap-1 px-2.5 sm:pl-2.5", className),
+		className: cn("px-2.5", className),
 		...props,
-		children: [/* @__PURE__ */ jsx(ChevronLeftIcon, {}), /* @__PURE__ */ jsx("span", {
-			className: "hidden sm:block",
-			children: "Previous"
-		})]
+		children: "Previous"
 	});
 }
 /** "Next" control: a pagination link with a trailing chevron and accessible label. */
 function PaginationNext({ className, ...props }) {
-	return /* @__PURE__ */ jsxs(PaginationLink, {
+	return /* @__PURE__ */ jsx(PaginationLink, {
 		"aria-label": "Go to next page",
 		size: "default",
-		className: cn("gap-1 px-2.5 sm:pr-2.5", className),
+		className: cn("px-2.5", className),
 		...props,
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "hidden sm:block",
-			children: "Next"
-		}), /* @__PURE__ */ jsx(ChevronRightIcon, {})]
+		children: "Next"
 	});
 }
 /** Non-interactive ellipsis indicating skipped page ranges. */

package/dist/primitives/Pagination/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { type Button, buttonVariants } from \"@/primitives/Button\";\nimport { cn } from \"@/utils\";\n\n/** Accessible pagination navigation landmark that wraps the list of page links. */\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal list container holding the individual pagination items. */\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex flex-row items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Single list item wrapper for a pagination link, ellipsis, or control. */\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  /** Marks this link as the current page; renders the outline (selected) style and sets `aria-current`. */\n  isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n  React.ComponentProps<\"a\">;\n\n/** Clickable page link styled with the Button variants; pass `isActive` for the current page. */\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Previous\" control: a pagination link with a leading chevron and accessible label. */\nfunction PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to previous page\"\n      size=\"default\"\n      className={cn(\"gap-1 px-2.5 sm:pl-2.5\", className)}\n      {...props}\n    >\n      <ChevronLeftIcon />\n      <span className=\"hidden sm:block\">Previous</span>\n    </PaginationLink>\n  );\n}\n\n/** \"Next\" control: a pagination link with a trailing chevron and accessible label. */\nfunction PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to next page\"\n      size=\"default\"\n      className={cn(\"gap-1 px-2.5 sm:pr-2.5\", className)}\n      {...props}\n    >\n      <span className=\"hidden sm:block\">Next</span>\n      <ChevronRightIcon />\n    </PaginationLink>\n  );\n}\n\n/** Non-interactive ellipsis indicating skipped page ranges. */\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontalIcon className=\"size-4\" />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationLink,\n  PaginationItem,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis,\n};\n"],"mappings":";;;;;;AAOA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAW,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAqC;CAC9E,OACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAqC;CAChE,OAAO,oBAAC,MAAD;EAAI,aAAU;EAAkB,GAAI;CAAQ,CAAA;AACrD;;AASA,SAAS,eAAe,EAAE,WAAW,UAAU,OAAO,QAAQ,GAAG,SAA8B;CAC7F,OACE,oBAAC,KAAD;EACE,gBAAc,WAAW,SAAS,KAAA;EAClC,aAAU;EACV,eAAa;EACb,WAAW,GACT,eAAe;GACb,SAAS,WAAW,YAAY;GAChC;EACF,CAAC,GACD,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAsD;CAChG,OACE,qBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,0BAA0B,SAAS;EACjD,GAAI;YAJN,CAME,oBAAC,iBAAD,CAAkB,CAAA,GAClB,oBAAC,QAAD;GAAM,WAAU;aAAkB;EAAc,CAAA,CAClC;;AAEpB;;AAGA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsD;CAC5F,OACE,qBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,0BAA0B,SAAS;EACjD,GAAI;YAJN,CAME,oBAAC,QAAD;GAAM,WAAU;aAAkB;EAAU,CAAA,GAC5C,oBAAC,kBAAD,CAAmB,CAAA,CACL;;AAEpB;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAuC;CACjF,OACE,qBAAC,QAAD;EACE,eAAA;EACA,aAAU;EACV,WAAW,GAAG,2CAA2C,SAAS;EAClE,GAAI;YAJN,CAME,oBAAC,oBAAD,EAAoB,WAAU,SAAU,CAAA,GACxC,oBAAC,QAAD;GAAM,WAAU;aAAU;EAAgB,CAAA,CACtC;;AAEV"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Pagination/Pagination.tsx"],"sourcesContent":["import { MoreHorizontalIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { type Button, buttonVariants } from \"@/primitives/Button\";\nimport { cn } from \"@/utils\";\n\n/** Accessible pagination navigation landmark that wraps the list of page links. */\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Horizontal list container holding the individual pagination items. */\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex flex-row items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Single list item wrapper for a pagination link, ellipsis, or control. */\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  /** Marks this link as the current page; renders the outline (selected) style and sets `aria-current`. */\n  isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n  React.ComponentProps<\"a\">;\n\n/** Clickable page link styled with the Button variants; pass `isActive` for the current page. */\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        // Pagination buttons are 8px-rounded squares (Figma 294:233630), not pills.\n        \"rounded-8\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** \"Previous\" control: a pagination link with a leading chevron and accessible label. */\nfunction PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to previous page\"\n      size=\"default\"\n      className={cn(\"px-2.5\", className)}\n      {...props}\n    >\n      Previous\n    </PaginationLink>\n  );\n}\n\n/** \"Next\" control: a pagination link with a trailing chevron and accessible label. */\nfunction PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to next page\"\n      size=\"default\"\n      className={cn(\"px-2.5\", className)}\n      {...props}\n    >\n      Next\n    </PaginationLink>\n  );\n}\n\n/** Non-interactive ellipsis indicating skipped page ranges. */\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontalIcon className=\"size-4\" />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationLink,\n  PaginationItem,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis,\n};\n"],"mappings":";;;;;;AAOA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAW,GAAG,sCAAsC,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAqC;CAC9E,OACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAqC;CAChE,OAAO,oBAAC,MAAD;EAAI,aAAU;EAAkB,GAAI;CAAQ,CAAA;AACrD;;AASA,SAAS,eAAe,EAAE,WAAW,UAAU,OAAO,QAAQ,GAAG,SAA8B;CAC7F,OACE,oBAAC,KAAD;EACE,gBAAc,WAAW,SAAS,KAAA;EAClC,aAAU;EACV,eAAa;EACb,WAAW,GACT,eAAe;GACb,SAAS,WAAW,YAAY;GAChC;EACF,CAAC,GAED,aACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAsD;CAChG,OACE,oBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,UAAU,SAAS;EACjC,GAAI;YACL;CAEe,CAAA;AAEpB;;AAGA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAsD;CAC5F,OACE,oBAAC,gBAAD;EACE,cAAW;EACX,MAAK;EACL,WAAW,GAAG,UAAU,SAAS;EACjC,GAAI;YACL;CAEe,CAAA;AAEpB;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAuC;CACjF,OACE,qBAAC,QAAD;EACE,eAAA;EACA,aAAU;EACV,WAAW,GAAG,2CAA2C,SAAS;EAClE,GAAI;YAJN,CAME,oBAAC,oBAAD,EAAoB,WAAU,SAAU,CAAA,GACxC,oBAAC,QAAD;GAAM,WAAU;aAAU;EAAgB,CAAA,CACtC;;AAEV"}

package/dist/primitives/Popover/index.cjs

@@ -18,12 +18,12 @@ function PopoverTrigger({ ...props }) {
 	});
 }
 /** The floating, portaled panel rendered when the popover is open. */
-function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+function PopoverContent({ className, align = "center", sideOffset = 6, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Popover.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Popover.Content, {
 		"data-slot": "popover-content",
 		align,
 		sideOffset,
-		className: require_cn.cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-card p-4 text-card-foreground shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
+		className: require_cn.cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-8 border bg-glass-60-bg backdrop-blur-glass p-4 text-primary-txt shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-8 data-[side=left]:slide-in-from-right-8 data-[side=right]:slide-in-from-left-8 data-[side=top]:slide-in-from-bottom-8 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
 		...props
 	}) });
 }
@@ -46,7 +46,7 @@ function PopoverHeader({ className, ...props }) {
 function PopoverTitle({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		"data-slot": "popover-title",
-		className: require_cn.cn("font-medium", className),
+		className: require_cn.cn("text-base leading-6 font-semibold", className),
 		...props
 	});
 }
@@ -54,7 +54,7 @@ function PopoverTitle({ className, ...props }) {
 function PopoverDescription({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 		"data-slot": "popover-description",
-		className: require_cn.cn("text-muted-foreground", className),
+		className: require_cn.cn("text-muted-txt", className),
 		...props
 	});
 }

package/dist/primitives/Popover/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["PopoverPrimitive","cn"],"sources":["../../../src/primitives/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of the popover: holds open state and coordinates the trigger and content. */\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\n/** The control (usually a button) that toggles the popover open and closed. */\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\n/** The floating, portaled panel rendered when the popover is open. */\nfunction PopoverContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Alignment of the content relative to the trigger along the chosen side. */\n  align = \"center\",\n  /** Distance in px between the content and the trigger. */\n  sideOffset = 4,\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n  return (\n    <PopoverPrimitive.Portal>\n      <PopoverPrimitive.Content\n        data-slot=\"popover-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          \"z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-card p-4 text-card-foreground shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n          className,\n        )}\n        {...props}\n      />\n    </PopoverPrimitive.Portal>\n  );\n}\n\n/** Optional element the content positions against instead of the trigger. */\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n  return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\n/** Stacked header slot for a title and description at the top of the content. */\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"popover-header\"\n      className={cn(\"flex flex-col gap-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Emphasised title line for the popover header. */\nfunction PopoverTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return <div data-slot=\"popover-title\" className={cn(\"font-medium\", className)} {...props} />;\n}\n\n/** Muted supporting copy for the popover header. */\nfunction PopoverDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"popover-description\"\n      className={cn(\"text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverAnchor,\n  PopoverHeader,\n  PopoverTitle,\n  PopoverDescription,\n};\n"],"mappings":";;;;;;AAMA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA;AAChE;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,QAAQ,UAER,aAAa,GACb,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,SAAlB;EACE,aAAU;EACH;EACK;EACZ,WAAWC,WAAAA,GACT,4dACA,SACF;EACA,GAAI;CACL,CAAA,EACsB,CAAA;AAE7B;;AAGA,SAAS,cAAc,EAAE,GAAG,SAA+D;CACzF,OAAO,iBAAA,GAAA,kBAAA,KAACD,SAAAA,QAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;;AAGA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OAAO,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,aAAU;EAAgB,WAAWA,WAAAA,GAAG,eAAe,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAoC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,yBAAyB,SAAS;EAChD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.cjs","names":["PopoverPrimitive","cn"],"sources":["../../../src/primitives/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of the popover: holds open state and coordinates the trigger and content. */\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\n/** The control (usually a button) that toggles the popover open and closed. */\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\n/** The floating, portaled panel rendered when the popover is open. */\nfunction PopoverContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Alignment of the content relative to the trigger along the chosen side. */\n  align = \"center\",\n  /** Distance in px between the content and the trigger. */\n  sideOffset = 6,\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n  return (\n    <PopoverPrimitive.Portal>\n      <PopoverPrimitive.Content\n        data-slot=\"popover-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          // Figma: the popover panel is a Card instance — same chrome.\n          \"z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-8 border bg-glass-60-bg backdrop-blur-glass p-4 text-primary-txt shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-8 data-[side=left]:slide-in-from-right-8 data-[side=right]:slide-in-from-left-8 data-[side=top]:slide-in-from-bottom-8 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n          className,\n        )}\n        {...props}\n      />\n    </PopoverPrimitive.Portal>\n  );\n}\n\n/** Optional element the content positions against instead of the trigger. */\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n  return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\n/** Stacked header slot for a title and description at the top of the content. */\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"popover-header\"\n      className={cn(\"flex flex-col gap-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Emphasised title line for the popover header. */\nfunction PopoverTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <div\n      data-slot=\"popover-title\"\n      className={cn(\"text-base leading-6 font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Muted supporting copy for the popover header. */\nfunction PopoverDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p data-slot=\"popover-description\" className={cn(\"text-muted-txt\", className)} {...props} />\n  );\n}\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverAnchor,\n  PopoverHeader,\n  PopoverTitle,\n  PopoverDescription,\n};\n"],"mappings":";;;;;;AAMA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA;AAChE;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,QAAQ,UAER,aAAa,GACb,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,SAAlB;EACE,aAAU;EACH;EACK;EACZ,WAAWC,WAAAA,GAET,kfACA,SACF;EACA,GAAI;CACL,CAAA,EACsB,CAAA;AAE7B;;AAGA,SAAS,cAAc,EAAE,GAAG,SAA+D;CACzF,OAAO,iBAAA,GAAA,kBAAA,KAACD,SAAAA,QAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;;AAGA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAoC;CAC9E,OACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EAAG,aAAU;EAAsB,WAAWA,WAAAA,GAAG,kBAAkB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAE/F"}

package/dist/primitives/Popover/index.js

@@ -17,12 +17,12 @@ function PopoverTrigger({ ...props }) {
 	});
 }
 /** The floating, portaled panel rendered when the popover is open. */
-function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+function PopoverContent({ className, align = "center", sideOffset = 6, ...props }) {
 	return /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(Popover$1.Content, {
 		"data-slot": "popover-content",
 		align,
 		sideOffset,
-		className: cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-card p-4 text-card-foreground shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
+		className: cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-8 border bg-glass-60-bg backdrop-blur-glass p-4 text-primary-txt shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-8 data-[side=left]:slide-in-from-right-8 data-[side=right]:slide-in-from-left-8 data-[side=top]:slide-in-from-bottom-8 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className),
 		...props
 	}) });
 }
@@ -45,7 +45,7 @@ function PopoverHeader({ className, ...props }) {
 function PopoverTitle({ className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		"data-slot": "popover-title",
-		className: cn("font-medium", className),
+		className: cn("text-base leading-6 font-semibold", className),
 		...props
 	});
 }
@@ -53,7 +53,7 @@ function PopoverTitle({ className, ...props }) {
 function PopoverDescription({ className, ...props }) {
 	return /* @__PURE__ */ jsx("p", {
 		"data-slot": "popover-description",
-		className: cn("text-muted-foreground", className),
+		className: cn("text-muted-txt", className),
 		...props
 	});
 }

package/dist/primitives/Popover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["PopoverPrimitive"],"sources":["../../../src/primitives/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of the popover: holds open state and coordinates the trigger and content. */\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\n/** The control (usually a button) that toggles the popover open and closed. */\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\n/** The floating, portaled panel rendered when the popover is open. */\nfunction PopoverContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Alignment of the content relative to the trigger along the chosen side. */\n  align = \"center\",\n  /** Distance in px between the content and the trigger. */\n  sideOffset = 4,\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n  return (\n    <PopoverPrimitive.Portal>\n      <PopoverPrimitive.Content\n        data-slot=\"popover-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          \"z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-lg border bg-card p-4 text-card-foreground shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n          className,\n        )}\n        {...props}\n      />\n    </PopoverPrimitive.Portal>\n  );\n}\n\n/** Optional element the content positions against instead of the trigger. */\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n  return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\n/** Stacked header slot for a title and description at the top of the content. */\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"popover-header\"\n      className={cn(\"flex flex-col gap-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Emphasised title line for the popover header. */\nfunction PopoverTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return <div data-slot=\"popover-title\" className={cn(\"font-medium\", className)} {...props} />;\n}\n\n/** Muted supporting copy for the popover header. */\nfunction PopoverDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"popover-description\"\n      className={cn(\"text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverAnchor,\n  PopoverHeader,\n  PopoverTitle,\n  PopoverDescription,\n};\n"],"mappings":";;;;;AAMA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OAAO,oBAACA,UAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA;AAChE;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,oBAACA,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,QAAQ,UAER,aAAa,GACb,GAAG,SACqD;CACxD,OACE,oBAACA,UAAiB,QAAlB,EAAA,UACE,oBAACA,UAAiB,SAAlB;EACE,aAAU;EACH;EACK;EACZ,WAAW,GACT,4dACA,SACF;EACA,GAAI;CACL,CAAA,EACsB,CAAA;AAE7B;;AAGA,SAAS,cAAc,EAAE,GAAG,SAA+D;CACzF,OAAO,oBAACA,UAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;;AAGA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAgB,WAAW,GAAG,eAAe,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAoC;CAC9E,OACE,oBAAC,KAAD;EACE,aAAU;EACV,WAAW,GAAG,yBAAyB,SAAS;EAChD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.js","names":["PopoverPrimitive"],"sources":["../../../src/primitives/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of the popover: holds open state and coordinates the trigger and content. */\nfunction Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n  return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\n/** The control (usually a button) that toggles the popover open and closed. */\nfunction PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n  return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\n/** The floating, portaled panel rendered when the popover is open. */\nfunction PopoverContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Alignment of the content relative to the trigger along the chosen side. */\n  align = \"center\",\n  /** Distance in px between the content and the trigger. */\n  sideOffset = 6,\n  ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n  return (\n    <PopoverPrimitive.Portal>\n      <PopoverPrimitive.Content\n        data-slot=\"popover-content\"\n        align={align}\n        sideOffset={sideOffset}\n        className={cn(\n          // Figma: the popover panel is a Card instance — same chrome.\n          \"z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-8 border bg-glass-60-bg backdrop-blur-glass p-4 text-primary-txt shadow-sm outline-hidden data-[side=bottom]:slide-in-from-top-8 data-[side=left]:slide-in-from-right-8 data-[side=right]:slide-in-from-left-8 data-[side=top]:slide-in-from-bottom-8 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n          className,\n        )}\n        {...props}\n      />\n    </PopoverPrimitive.Portal>\n  );\n}\n\n/** Optional element the content positions against instead of the trigger. */\nfunction PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n  return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\n/** Stacked header slot for a title and description at the top of the content. */\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"popover-header\"\n      className={cn(\"flex flex-col gap-1 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Emphasised title line for the popover header. */\nfunction PopoverTitle({ className, ...props }: React.ComponentProps<\"h2\">) {\n  return (\n    <div\n      data-slot=\"popover-title\"\n      className={cn(\"text-base leading-6 font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Muted supporting copy for the popover header. */\nfunction PopoverDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p data-slot=\"popover-description\" className={cn(\"text-muted-txt\", className)} {...props} />\n  );\n}\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverContent,\n  PopoverAnchor,\n  PopoverHeader,\n  PopoverTitle,\n  PopoverDescription,\n};\n"],"mappings":";;;;;AAMA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OAAO,oBAACA,UAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA;AAChE;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,oBAACA,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,QAAQ,UAER,aAAa,GACb,GAAG,SACqD;CACxD,OACE,oBAACA,UAAiB,QAAlB,EAAA,UACE,oBAACA,UAAiB,SAAlB;EACE,aAAU;EACH;EACK;EACZ,WAAW,GAET,kfACA,SACF;EACA,GAAI;CACL,CAAA,EACsB,CAAA;AAE7B;;AAGA,SAAS,cAAc,EAAE,GAAG,SAA+D;CACzF,OAAO,oBAACA,UAAiB,QAAlB;EAAyB,aAAU;EAAiB,GAAI;CAAQ,CAAA;AACzE;;AAGA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;CAC3E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,+BAA+B,SAAS;EACtD,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,qCAAqC,SAAS;EAC5D,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAoC;CAC9E,OACE,oBAAC,KAAD;EAAG,aAAU;EAAsB,WAAW,GAAG,kBAAkB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAE/F"}

package/dist/primitives/Progress/index.cjs

@@ -4,24 +4,24 @@ let radix_ui = require("radix-ui");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/primitives/Progress/Progress.tsx
 const progressIndicatorVariants = {
-	default: "bg-primary",
-	brand: "bg-brand-surface",
-	success: "bg-[var(--content-success)]",
-	warning: "bg-[var(--content-warning)]",
-	info: "bg-[var(--content-info)]",
-	destructive: "bg-destructive",
-	analyzing: "bg-[var(--progress-analyzing)]",
-	ingesting: "bg-[var(--progress-ingesting)]"
+	default: "bg-primary-invert-bg",
+	brand: "bg-brand-500-primary",
+	success: "bg-success-txt",
+	warning: "bg-warning-txt",
+	info: "bg-info-txt",
+	destructive: "bg-danger-txt",
+	analyzing: "bg-info-bg",
+	ingesting: "bg-warning-bg"
 };
 const progressTrackVariants = {
-	default: "bg-input",
-	brand: "bg-brand-surface/15",
-	success: "bg-[var(--content-success)]/15",
-	warning: "bg-[var(--content-warning)]/15",
-	info: "bg-[var(--content-info)]/15",
-	destructive: "bg-destructive/15",
-	analyzing: "bg-primary/20",
-	ingesting: "bg-primary/20"
+	default: "bg-secondary-bg",
+	brand: "bg-brand-500-primary/15",
+	success: "bg-success-txt/15",
+	warning: "bg-warning-txt/15",
+	info: "bg-info-txt/15",
+	destructive: "bg-danger-txt/15",
+	analyzing: "bg-primary-invert-bg/20",
+	ingesting: "bg-primary-invert-bg/20"
 };
 /** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */
 function Progress({ className, value, variant = "default", ...props }) {

package/dist/primitives/Progress/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["ProgressPrimitive","cn"],"sources":["../../../src/primitives/Progress/Progress.tsx"],"sourcesContent":["import { Progress as ProgressPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst progressIndicatorVariants = {\n  default: \"bg-primary\",\n  // Filled in the active product's brand colour.\n  brand: \"bg-brand-surface\",\n  // Status colours (mode-aware, shared with Badge/Text).\n  success: \"bg-[var(--content-success)]\",\n  warning: \"bg-[var(--content-warning)]\",\n  info: \"bg-[var(--content-info)]\",\n  destructive: \"bg-destructive\",\n  // Activity colours (Helix data pipeline states).\n  analyzing: \"bg-[var(--progress-analyzing)]\",\n  ingesting: \"bg-[var(--progress-ingesting)]\",\n} as const;\n\nconst progressTrackVariants = {\n  // Track uses the border-3 grey (Figma) rather than the muted surface.\n  default: \"bg-input\",\n  brand: \"bg-brand-surface/15\",\n  success: \"bg-[var(--content-success)]/15\",\n  warning: \"bg-[var(--content-warning)]/15\",\n  info: \"bg-[var(--content-info)]/15\",\n  destructive: \"bg-destructive/15\",\n  analyzing: \"bg-primary/20\",\n  ingesting: \"bg-primary/20\",\n} as const;\n\n/** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */\nfunction Progress({\n  className,\n  value,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root> & {\n  /** Fill colour: `default`, `brand`, status (`success`/`warning`/`info`/`destructive`), or activity (`analyzing`/`ingesting`). */\n  variant?: keyof typeof progressIndicatorVariants;\n}) {\n  // No `value` → indeterminate: a sliding segment signalling ongoing work.\n  const indeterminate = value == null;\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      value={value}\n      className={cn(\n        \"relative h-2 w-full overflow-hidden rounded-full\",\n        progressTrackVariants[variant],\n        className,\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        className={cn(\n          \"h-full flex-1 transition-all\",\n          progressIndicatorVariants[variant],\n          indeterminate ? \"progress-indeterminate rounded-full\" : \"w-full\",\n        )}\n        style={indeterminate ? undefined : { transform: `translateX(-${100 - (value ?? 0)}%)` }}\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { Progress };\n"],"mappings":";;;;;AAKA,MAAM,4BAA4B;CAChC,SAAS;CAET,OAAO;CAEP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CAEb,WAAW;CACX,WAAW;AACb;AAEA,MAAM,wBAAwB;CAE5B,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,UAAU,WACV,GAAG,SAIF;CAED,MAAM,gBAAgB,SAAS;CAC/B,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,SAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAWC,WAAAA,GACT,oDACA,sBAAsB,UACtB,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,SAAkB,WAAnB;GACE,aAAU;GACV,WAAWC,WAAAA,GACT,gCACA,0BAA0B,UAC1B,gBAAgB,wCAAwC,QAC1D;GACA,OAAO,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,SAAS,GAAG,IAAI;EACvF,CAAA;CACqB,CAAA;AAE5B"}
+{"version":3,"file":"index.cjs","names":["ProgressPrimitive","cn"],"sources":["../../../src/primitives/Progress/Progress.tsx"],"sourcesContent":["import { Progress as ProgressPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst progressIndicatorVariants = {\n  default: \"bg-primary-invert-bg\",\n  // Filled in the active product's brand colour.\n  brand: \"bg-brand-500-primary\",\n  // Status colours (mode-aware, shared with Badge/Text).\n  success: \"bg-success-txt\",\n  warning: \"bg-warning-txt\",\n  info: \"bg-info-txt\",\n  destructive: \"bg-danger-txt\",\n  // Activity colours (Helix data pipeline states).\n  analyzing: \"bg-info-bg\",\n  ingesting: \"bg-warning-bg\",\n} as const;\n\nconst progressTrackVariants = {\n  // Track uses bg/secondary (Figma Progress page 438:64977).\n  default: \"bg-secondary-bg\",\n  brand: \"bg-brand-500-primary/15\",\n  success: \"bg-success-txt/15\",\n  warning: \"bg-warning-txt/15\",\n  info: \"bg-info-txt/15\",\n  destructive: \"bg-danger-txt/15\",\n  analyzing: \"bg-primary-invert-bg/20\",\n  ingesting: \"bg-primary-invert-bg/20\",\n} as const;\n\n/** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */\nfunction Progress({\n  className,\n  value,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root> & {\n  /** Fill colour: `default`, `brand`, status (`success`/`warning`/`info`/`destructive`), or activity (`analyzing`/`ingesting`). */\n  variant?: keyof typeof progressIndicatorVariants;\n}) {\n  // No `value` → indeterminate: a sliding segment signalling ongoing work.\n  const indeterminate = value == null;\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      value={value}\n      className={cn(\n        \"relative h-2 w-full overflow-hidden rounded-full\",\n        progressTrackVariants[variant],\n        className,\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        className={cn(\n          \"h-full flex-1 transition-all\",\n          progressIndicatorVariants[variant],\n          indeterminate ? \"progress-indeterminate rounded-full\" : \"w-full\",\n        )}\n        style={indeterminate ? undefined : { transform: `translateX(-${100 - (value ?? 0)}%)` }}\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { Progress };\n"],"mappings":";;;;;AAKA,MAAM,4BAA4B;CAChC,SAAS;CAET,OAAO;CAEP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CAEb,WAAW;CACX,WAAW;AACb;AAEA,MAAM,wBAAwB;CAE5B,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,UAAU,WACV,GAAG,SAIF;CAED,MAAM,gBAAgB,SAAS;CAC/B,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,SAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAWC,WAAAA,GACT,oDACA,sBAAsB,UACtB,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,SAAkB,WAAnB;GACE,aAAU;GACV,WAAWC,WAAAA,GACT,gCACA,0BAA0B,UAC1B,gBAAgB,wCAAwC,QAC1D;GACA,OAAO,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,SAAS,GAAG,IAAI;EACvF,CAAA;CACqB,CAAA;AAE5B"}

package/dist/primitives/Progress/index.d.cts

@@ -1,2 +1,2 @@
-import { t as Progress } from "../../index45.cjs";
+import { t as Progress } from "../../index46.cjs";
 export { Progress };

package/dist/primitives/Progress/index.d.ts

@@ -1,2 +1,2 @@
-import { t as Progress } from "../../index45.js";
+import { t as Progress } from "../../index46.js";
 export { Progress };

package/dist/primitives/Progress/index.js

@@ -3,24 +3,24 @@ import { Progress as Progress$1 } from "radix-ui";
 import { jsx } from "react/jsx-runtime";
 //#region src/primitives/Progress/Progress.tsx
 const progressIndicatorVariants = {
-	default: "bg-primary",
-	brand: "bg-brand-surface",
-	success: "bg-[var(--content-success)]",
-	warning: "bg-[var(--content-warning)]",
-	info: "bg-[var(--content-info)]",
-	destructive: "bg-destructive",
-	analyzing: "bg-[var(--progress-analyzing)]",
-	ingesting: "bg-[var(--progress-ingesting)]"
+	default: "bg-primary-invert-bg",
+	brand: "bg-brand-500-primary",
+	success: "bg-success-txt",
+	warning: "bg-warning-txt",
+	info: "bg-info-txt",
+	destructive: "bg-danger-txt",
+	analyzing: "bg-info-bg",
+	ingesting: "bg-warning-bg"
 };
 const progressTrackVariants = {
-	default: "bg-input",
-	brand: "bg-brand-surface/15",
-	success: "bg-[var(--content-success)]/15",
-	warning: "bg-[var(--content-warning)]/15",
-	info: "bg-[var(--content-info)]/15",
-	destructive: "bg-destructive/15",
-	analyzing: "bg-primary/20",
-	ingesting: "bg-primary/20"
+	default: "bg-secondary-bg",
+	brand: "bg-brand-500-primary/15",
+	success: "bg-success-txt/15",
+	warning: "bg-warning-txt/15",
+	info: "bg-info-txt/15",
+	destructive: "bg-danger-txt/15",
+	analyzing: "bg-primary-invert-bg/20",
+	ingesting: "bg-primary-invert-bg/20"
 };
 /** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */
 function Progress({ className, value, variant = "default", ...props }) {

package/dist/primitives/Progress/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ProgressPrimitive"],"sources":["../../../src/primitives/Progress/Progress.tsx"],"sourcesContent":["import { Progress as ProgressPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst progressIndicatorVariants = {\n  default: \"bg-primary\",\n  // Filled in the active product's brand colour.\n  brand: \"bg-brand-surface\",\n  // Status colours (mode-aware, shared with Badge/Text).\n  success: \"bg-[var(--content-success)]\",\n  warning: \"bg-[var(--content-warning)]\",\n  info: \"bg-[var(--content-info)]\",\n  destructive: \"bg-destructive\",\n  // Activity colours (Helix data pipeline states).\n  analyzing: \"bg-[var(--progress-analyzing)]\",\n  ingesting: \"bg-[var(--progress-ingesting)]\",\n} as const;\n\nconst progressTrackVariants = {\n  // Track uses the border-3 grey (Figma) rather than the muted surface.\n  default: \"bg-input\",\n  brand: \"bg-brand-surface/15\",\n  success: \"bg-[var(--content-success)]/15\",\n  warning: \"bg-[var(--content-warning)]/15\",\n  info: \"bg-[var(--content-info)]/15\",\n  destructive: \"bg-destructive/15\",\n  analyzing: \"bg-primary/20\",\n  ingesting: \"bg-primary/20\",\n} as const;\n\n/** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */\nfunction Progress({\n  className,\n  value,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root> & {\n  /** Fill colour: `default`, `brand`, status (`success`/`warning`/`info`/`destructive`), or activity (`analyzing`/`ingesting`). */\n  variant?: keyof typeof progressIndicatorVariants;\n}) {\n  // No `value` → indeterminate: a sliding segment signalling ongoing work.\n  const indeterminate = value == null;\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      value={value}\n      className={cn(\n        \"relative h-2 w-full overflow-hidden rounded-full\",\n        progressTrackVariants[variant],\n        className,\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        className={cn(\n          \"h-full flex-1 transition-all\",\n          progressIndicatorVariants[variant],\n          indeterminate ? \"progress-indeterminate rounded-full\" : \"w-full\",\n        )}\n        style={indeterminate ? undefined : { transform: `translateX(-${100 - (value ?? 0)}%)` }}\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { Progress };\n"],"mappings":";;;;AAKA,MAAM,4BAA4B;CAChC,SAAS;CAET,OAAO;CAEP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CAEb,WAAW;CACX,WAAW;AACb;AAEA,MAAM,wBAAwB;CAE5B,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,UAAU,WACV,GAAG,SAIF;CAED,MAAM,gBAAgB,SAAS;CAC/B,OACE,oBAACA,WAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAW,GACT,oDACA,sBAAsB,UACtB,SACF;EACA,GAAI;YAEJ,oBAACA,WAAkB,WAAnB;GACE,aAAU;GACV,WAAW,GACT,gCACA,0BAA0B,UAC1B,gBAAgB,wCAAwC,QAC1D;GACA,OAAO,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,SAAS,GAAG,IAAI;EACvF,CAAA;CACqB,CAAA;AAE5B"}
+{"version":3,"file":"index.js","names":["ProgressPrimitive"],"sources":["../../../src/primitives/Progress/Progress.tsx"],"sourcesContent":["import { Progress as ProgressPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst progressIndicatorVariants = {\n  default: \"bg-primary-invert-bg\",\n  // Filled in the active product's brand colour.\n  brand: \"bg-brand-500-primary\",\n  // Status colours (mode-aware, shared with Badge/Text).\n  success: \"bg-success-txt\",\n  warning: \"bg-warning-txt\",\n  info: \"bg-info-txt\",\n  destructive: \"bg-danger-txt\",\n  // Activity colours (Helix data pipeline states).\n  analyzing: \"bg-info-bg\",\n  ingesting: \"bg-warning-bg\",\n} as const;\n\nconst progressTrackVariants = {\n  // Track uses bg/secondary (Figma Progress page 438:64977).\n  default: \"bg-secondary-bg\",\n  brand: \"bg-brand-500-primary/15\",\n  success: \"bg-success-txt/15\",\n  warning: \"bg-warning-txt/15\",\n  info: \"bg-info-txt/15\",\n  destructive: \"bg-danger-txt/15\",\n  analyzing: \"bg-primary-invert-bg/20\",\n  ingesting: \"bg-primary-invert-bg/20\",\n} as const;\n\n/** Determinate or indeterminate progress bar built on Radix Progress, with semantic, brand, and activity colour variants. */\nfunction Progress({\n  className,\n  value,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root> & {\n  /** Fill colour: `default`, `brand`, status (`success`/`warning`/`info`/`destructive`), or activity (`analyzing`/`ingesting`). */\n  variant?: keyof typeof progressIndicatorVariants;\n}) {\n  // No `value` → indeterminate: a sliding segment signalling ongoing work.\n  const indeterminate = value == null;\n  return (\n    <ProgressPrimitive.Root\n      data-slot=\"progress\"\n      value={value}\n      className={cn(\n        \"relative h-2 w-full overflow-hidden rounded-full\",\n        progressTrackVariants[variant],\n        className,\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Indicator\n        data-slot=\"progress-indicator\"\n        className={cn(\n          \"h-full flex-1 transition-all\",\n          progressIndicatorVariants[variant],\n          indeterminate ? \"progress-indeterminate rounded-full\" : \"w-full\",\n        )}\n        style={indeterminate ? undefined : { transform: `translateX(-${100 - (value ?? 0)}%)` }}\n      />\n    </ProgressPrimitive.Root>\n  );\n}\n\nexport { Progress };\n"],"mappings":";;;;AAKA,MAAM,4BAA4B;CAChC,SAAS;CAET,OAAO;CAEP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CAEb,WAAW;CACX,WAAW;AACb;AAEA,MAAM,wBAAwB;CAE5B,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;CACN,aAAa;CACb,WAAW;CACX,WAAW;AACb;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,UAAU,WACV,GAAG,SAIF;CAED,MAAM,gBAAgB,SAAS;CAC/B,OACE,oBAACA,WAAkB,MAAnB;EACE,aAAU;EACH;EACP,WAAW,GACT,oDACA,sBAAsB,UACtB,SACF;EACA,GAAI;YAEJ,oBAACA,WAAkB,WAAnB;GACE,aAAU;GACV,WAAW,GACT,gCACA,0BAA0B,UAC1B,gBAAgB,wCAAwC,QAC1D;GACA,OAAO,gBAAgB,KAAA,IAAY,EAAE,WAAW,eAAe,OAAO,SAAS,GAAG,IAAI;EACvF,CAAA;CACqB,CAAA;AAE5B"}