@psnext/design-system 1.5.1 → 2.0.0

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"}

package/dist/primitives/RadioGroup/index.cjs

@@ -19,12 +19,12 @@ function RadioGroup({ className, orientation = "vertical", ...props }) {
 function RadioGroupItem({ className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.RadioGroup.Item, {
 		"data-slot": "radio-group-item",
-		className: require_cn.cn("aspect-square size-4 shrink-0 rounded-full border border-input bg-input-background text-primary shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-ring-error", className),
+		className: require_cn.cn("aspect-square size-4 shrink-0 rounded-full border border-secondary-border bg-input-bg text-primary-invert-bg transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus data-[state=checked]:border-selected-border disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-border aria-invalid:ring-focus-error aria-invalid:text-danger-txt", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.RadioGroup.Indicator, {
 			"data-slot": "radio-group-indicator",
 			className: "relative flex items-center justify-center",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CircleIcon, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-primary" })
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CircleIcon, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current stroke-current" })
 		})
 	});
 }
@@ -35,23 +35,23 @@ function RichRadioItem({ className, value, title, description, flipped = false,
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
 		"data-slot": "rich-radio-item",
 		htmlFor: itemId,
-		className: require_cn.cn("flex cursor-pointer items-start gap-3 rounded-lg border border-input bg-card p-4 text-card-foreground shadow-xs transition-colors has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-accent/40 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50", flipped ? "flex-row-reverse" : "flex-row", className),
+		className: require_cn.cn("flex cursor-pointer items-start gap-3 rounded-10 border border-primary-border bg-muted-bg p-3 text-primary-txt transition-colors has-[[data-state=checked]]:border-selected-border has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50", flipped ? "flex-row-reverse" : "flex-row", className),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RadioGroupItem, {
 			"data-slot": "rich-radio-item-control",
 			id: itemId,
 			value,
-			className: "mt-0.5",
+			className: "mt-0.75",
 			...props
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 			"data-slot": "rich-radio-item-content",
-			className: "flex flex-col gap-1",
+			className: "flex flex-col gap-1.5",
 			children: [title != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				"data-slot": "rich-radio-item-title",
-				className: "font-medium text-sm leading-none",
+				className: "text-sm leading-5",
 				children: title
 			}), description != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				"data-slot": "rich-radio-item-description",
-				className: "text-sm text-muted-foreground",
+				className: "text-xs leading-4 text-muted-txt",
 				children: description
 			})]
 		})]

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["RadioGroupPrimitive","cn","CircleIcon"],"sources":["../../../src/primitives/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { CircleIcon } from \"lucide-react\";\nimport { RadioGroup as RadioGroupPrimitive } from \"radix-ui\";\nimport { useId } from \"react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */\nfunction RadioGroup({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root> & {\n  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */\n  orientation?: \"vertical\" | \"horizontal\";\n}) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        orientation === \"horizontal\" ? \"flex flex-row flex-wrap gap-4 items-center\" : \"grid gap-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A single selectable radio control; pair it with a label for accessible option text. */\nfunction RadioGroupItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      className={cn(\n        \"aspect-square size-4 shrink-0 rounded-full border border-input bg-input-background text-primary shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-ring-error\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"relative flex items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-primary\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  );\n}\n\n/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */\nfunction RichRadioItem({\n  className,\n  value,\n  title,\n  description,\n  flipped = false,\n  id,\n  ...props\n}: Omit<React.ComponentProps<typeof RadioGroupPrimitive.Item>, \"children\"> & {\n  /** Value submitted when this option is selected. */\n  value: string;\n  /** Bold heading shown at the top of the card. */\n  title?: React.ReactNode;\n  /** Secondary muted text shown beneath the title. */\n  description?: React.ReactNode;\n  /** Place the radio control on the trailing edge instead of the leading edge. */\n  flipped?: boolean;\n}) {\n  const generatedId = useId();\n  const itemId = id ?? generatedId;\n  return (\n    <label\n      data-slot=\"rich-radio-item\"\n      htmlFor={itemId}\n      className={cn(\n        \"flex cursor-pointer items-start gap-3 rounded-lg border border-input bg-card p-4 text-card-foreground shadow-xs transition-colors has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-accent/40 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50\",\n        flipped ? \"flex-row-reverse\" : \"flex-row\",\n        className,\n      )}\n    >\n      <RadioGroupItem\n        data-slot=\"rich-radio-item-control\"\n        id={itemId}\n        value={value}\n        className=\"mt-0.5\"\n        {...props}\n      />\n      <span data-slot=\"rich-radio-item-content\" className=\"flex flex-col gap-1\">\n        {title != null && (\n          <span data-slot=\"rich-radio-item-title\" className=\"font-medium text-sm leading-none\">\n            {title}\n          </span>\n        )}\n        {description != null && (\n          <span data-slot=\"rich-radio-item-description\" className=\"text-sm text-muted-foreground\">\n            {description}\n          </span>\n        )}\n      </span>\n    </label>\n  );\n}\n\nexport { RadioGroup, RadioGroupItem, RichRadioItem };\n"],"mappings":";;;;;;;;AAQA,SAAS,WAAW,EAClB,WACA,cAAc,YACd,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,oBAAkB;EACL;EACb,WAAWC,WAAAA,GACT,gBAAgB,eAAe,+CAA+C,cAC9E,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EACtB,WACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,mVACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,WAArB;GACE,aAAU;GACV,WAAU;aAEV,iBAAA,GAAA,kBAAA,KAACE,aAAAA,YAAD,EAAY,WAAU,kFAAmF,CAAA;EAC5E,CAAA;CACP,CAAA;AAE9B;;AAGA,SAAS,cAAc,EACrB,WACA,OACA,OACA,aACA,UAAU,OACV,IACA,GAAG,SAUF;CACD,MAAM,eAAA,GAAA,MAAA,OAAoB;CAC1B,MAAM,SAAS,MAAM;CACrB,OACE,iBAAA,GAAA,kBAAA,MAAC,SAAD;EACE,aAAU;EACV,SAAS;EACT,WAAWD,WAAAA,GACT,qRACA,UAAU,qBAAqB,YAC/B,SACF;YAPF,CASE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;GACE,aAAU;GACV,IAAI;GACG;GACP,WAAU;GACV,GAAI;EACL,CAAA,GACD,iBAAA,GAAA,kBAAA,MAAC,QAAD;GAAM,aAAU;GAA0B,WAAU;aAApD,CACG,SAAS,QACR,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,aAAU;IAAwB,WAAU;cAC/C;GACG,CAAA,GAEP,eAAe,QACd,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,aAAU;IAA8B,WAAU;cACrD;GACG,CAAA,CAEJ;IACD;;AAEX"}
+{"version":3,"file":"index.cjs","names":["RadioGroupPrimitive","cn","CircleIcon"],"sources":["../../../src/primitives/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { CircleIcon } from \"lucide-react\";\nimport { RadioGroup as RadioGroupPrimitive } from \"radix-ui\";\nimport { useId } from \"react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */\nfunction RadioGroup({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root> & {\n  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */\n  orientation?: \"vertical\" | \"horizontal\";\n}) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        orientation === \"horizontal\" ? \"flex flex-row flex-wrap gap-4 items-center\" : \"grid gap-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A single selectable radio control; pair it with a label for accessible option text. */\nfunction RadioGroupItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      className={cn(\n        // Dot color rides on currentColor: the checked dot is the inverted fill,\n        // flipping to the danger color under aria-invalid (Figma radio spec).\n        \"aspect-square size-4 shrink-0 rounded-full border border-secondary-border bg-input-bg text-primary-invert-bg transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus data-[state=checked]:border-selected-border disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-border aria-invalid:ring-focus-error aria-invalid:text-danger-txt\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"relative flex items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current stroke-current\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  );\n}\n\n/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */\nfunction RichRadioItem({\n  className,\n  value,\n  title,\n  description,\n  flipped = false,\n  id,\n  ...props\n}: Omit<React.ComponentProps<typeof RadioGroupPrimitive.Item>, \"children\"> & {\n  /** Value submitted when this option is selected. */\n  value: string;\n  /** Bold heading shown at the top of the card. */\n  title?: React.ReactNode;\n  /** Secondary muted text shown beneath the title. */\n  description?: React.ReactNode;\n  /** Place the radio control on the trailing edge instead of the leading edge. */\n  flipped?: boolean;\n}) {\n  const generatedId = useId();\n  const itemId = id ?? generatedId;\n  return (\n    <label\n      data-slot=\"rich-radio-item\"\n      htmlFor={itemId}\n      className={cn(\n        \"flex cursor-pointer items-start gap-3 rounded-10 border border-primary-border bg-muted-bg p-3 text-primary-txt transition-colors has-[[data-state=checked]]:border-selected-border has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50\",\n        flipped ? \"flex-row-reverse\" : \"flex-row\",\n        className,\n      )}\n    >\n      <RadioGroupItem\n        data-slot=\"rich-radio-item-control\"\n        id={itemId}\n        value={value}\n        className=\"mt-0.75\"\n        {...props}\n      />\n      <span data-slot=\"rich-radio-item-content\" className=\"flex flex-col gap-1.5\">\n        {title != null && (\n          <span data-slot=\"rich-radio-item-title\" className=\"text-sm leading-5\">\n            {title}\n          </span>\n        )}\n        {description != null && (\n          <span\n            data-slot=\"rich-radio-item-description\"\n            className=\"text-xs leading-4 text-muted-txt\"\n          >\n            {description}\n          </span>\n        )}\n      </span>\n    </label>\n  );\n}\n\nexport { RadioGroup, RadioGroupItem, RichRadioItem };\n"],"mappings":";;;;;;;;AAQA,SAAS,WAAW,EAClB,WACA,cAAc,YACd,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,oBAAkB;EACL;EACb,WAAWC,WAAAA,GACT,gBAAgB,eAAe,+CAA+C,cAC9E,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EACtB,WACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,WAAWC,WAAAA,GAGT,kYACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,WAArB;GACE,aAAU;GACV,WAAU;aAEV,iBAAA,GAAA,kBAAA,KAACE,aAAAA,YAAD,EAAY,WAAU,iGAAkG,CAAA;EAC3F,CAAA;CACP,CAAA;AAE9B;;AAGA,SAAS,cAAc,EACrB,WACA,OACA,OACA,aACA,UAAU,OACV,IACA,GAAG,SAUF;CACD,MAAM,eAAA,GAAA,MAAA,OAAoB;CAC1B,MAAM,SAAS,MAAM;CACrB,OACE,iBAAA,GAAA,kBAAA,MAAC,SAAD;EACE,aAAU;EACV,SAAS;EACT,WAAWD,WAAAA,GACT,oPACA,UAAU,qBAAqB,YAC/B,SACF;YAPF,CASE,iBAAA,GAAA,kBAAA,KAAC,gBAAD;GACE,aAAU;GACV,IAAI;GACG;GACP,WAAU;GACV,GAAI;EACL,CAAA,GACD,iBAAA,GAAA,kBAAA,MAAC,QAAD;GAAM,aAAU;GAA0B,WAAU;aAApD,CACG,SAAS,QACR,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,aAAU;IAAwB,WAAU;cAC/C;GACG,CAAA,GAEP,eAAe,QACd,iBAAA,GAAA,kBAAA,KAAC,QAAD;IACE,aAAU;IACV,WAAU;cAET;GACG,CAAA,CAEJ;IACD;;AAEX"}

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

@@ -1,2 +1,2 @@
-import { n as RadioGroupItem, r as RichRadioItem, t as RadioGroup } from "../../index46.cjs";
+import { n as RadioGroupItem, r as RichRadioItem, t as RadioGroup } from "../../index47.cjs";
 export { RadioGroup, RadioGroupItem, RichRadioItem };

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

@@ -1,2 +1,2 @@
-import { n as RadioGroupItem, r as RichRadioItem, t as RadioGroup } from "../../index46.js";
+import { n as RadioGroupItem, r as RichRadioItem, t as RadioGroup } from "../../index47.js";
 export { RadioGroup, RadioGroupItem, RichRadioItem };

package/dist/primitives/RadioGroup/index.js

@@ -18,12 +18,12 @@ function RadioGroup({ className, orientation = "vertical", ...props }) {
 function RadioGroupItem({ className, ...props }) {
 	return /* @__PURE__ */ jsx(RadioGroup$1.Item, {
 		"data-slot": "radio-group-item",
-		className: cn("aspect-square size-4 shrink-0 rounded-full border border-input bg-input-background text-primary shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-ring-error", className),
+		className: cn("aspect-square size-4 shrink-0 rounded-full border border-secondary-border bg-input-bg text-primary-invert-bg transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus data-[state=checked]:border-selected-border disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-border aria-invalid:ring-focus-error aria-invalid:text-danger-txt", className),
 		...props,
 		children: /* @__PURE__ */ jsx(RadioGroup$1.Indicator, {
 			"data-slot": "radio-group-indicator",
 			className: "relative flex items-center justify-center",
-			children: /* @__PURE__ */ jsx(CircleIcon, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-primary" })
+			children: /* @__PURE__ */ jsx(CircleIcon, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current stroke-current" })
 		})
 	});
 }
@@ -34,23 +34,23 @@ function RichRadioItem({ className, value, title, description, flipped = false,
 	return /* @__PURE__ */ jsxs("label", {
 		"data-slot": "rich-radio-item",
 		htmlFor: itemId,
-		className: cn("flex cursor-pointer items-start gap-3 rounded-lg border border-input bg-card p-4 text-card-foreground shadow-xs transition-colors has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-accent/40 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50", flipped ? "flex-row-reverse" : "flex-row", className),
+		className: cn("flex cursor-pointer items-start gap-3 rounded-10 border border-primary-border bg-muted-bg p-3 text-primary-txt transition-colors has-[[data-state=checked]]:border-selected-border has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50", flipped ? "flex-row-reverse" : "flex-row", className),
 		children: [/* @__PURE__ */ jsx(RadioGroupItem, {
 			"data-slot": "rich-radio-item-control",
 			id: itemId,
 			value,
-			className: "mt-0.5",
+			className: "mt-0.75",
 			...props
 		}), /* @__PURE__ */ jsxs("span", {
 			"data-slot": "rich-radio-item-content",
-			className: "flex flex-col gap-1",
+			className: "flex flex-col gap-1.5",
 			children: [title != null && /* @__PURE__ */ jsx("span", {
 				"data-slot": "rich-radio-item-title",
-				className: "font-medium text-sm leading-none",
+				className: "text-sm leading-5",
 				children: title
 			}), description != null && /* @__PURE__ */ jsx("span", {
 				"data-slot": "rich-radio-item-description",
-				className: "text-sm text-muted-foreground",
+				className: "text-xs leading-4 text-muted-txt",
 				children: description
 			})]
 		})]

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["RadioGroupPrimitive"],"sources":["../../../src/primitives/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { CircleIcon } from \"lucide-react\";\nimport { RadioGroup as RadioGroupPrimitive } from \"radix-ui\";\nimport { useId } from \"react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */\nfunction RadioGroup({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root> & {\n  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */\n  orientation?: \"vertical\" | \"horizontal\";\n}) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        orientation === \"horizontal\" ? \"flex flex-row flex-wrap gap-4 items-center\" : \"grid gap-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A single selectable radio control; pair it with a label for accessible option text. */\nfunction RadioGroupItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      className={cn(\n        \"aspect-square size-4 shrink-0 rounded-full border border-input bg-input-background text-primary shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-ring-error\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"relative flex items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-primary\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  );\n}\n\n/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */\nfunction RichRadioItem({\n  className,\n  value,\n  title,\n  description,\n  flipped = false,\n  id,\n  ...props\n}: Omit<React.ComponentProps<typeof RadioGroupPrimitive.Item>, \"children\"> & {\n  /** Value submitted when this option is selected. */\n  value: string;\n  /** Bold heading shown at the top of the card. */\n  title?: React.ReactNode;\n  /** Secondary muted text shown beneath the title. */\n  description?: React.ReactNode;\n  /** Place the radio control on the trailing edge instead of the leading edge. */\n  flipped?: boolean;\n}) {\n  const generatedId = useId();\n  const itemId = id ?? generatedId;\n  return (\n    <label\n      data-slot=\"rich-radio-item\"\n      htmlFor={itemId}\n      className={cn(\n        \"flex cursor-pointer items-start gap-3 rounded-lg border border-input bg-card p-4 text-card-foreground shadow-xs transition-colors has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-accent/40 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50\",\n        flipped ? \"flex-row-reverse\" : \"flex-row\",\n        className,\n      )}\n    >\n      <RadioGroupItem\n        data-slot=\"rich-radio-item-control\"\n        id={itemId}\n        value={value}\n        className=\"mt-0.5\"\n        {...props}\n      />\n      <span data-slot=\"rich-radio-item-content\" className=\"flex flex-col gap-1\">\n        {title != null && (\n          <span data-slot=\"rich-radio-item-title\" className=\"font-medium text-sm leading-none\">\n            {title}\n          </span>\n        )}\n        {description != null && (\n          <span data-slot=\"rich-radio-item-description\" className=\"text-sm text-muted-foreground\">\n            {description}\n          </span>\n        )}\n      </span>\n    </label>\n  );\n}\n\nexport { RadioGroup, RadioGroupItem, RichRadioItem };\n"],"mappings":";;;;;;;AAQA,SAAS,WAAW,EAClB,WACA,cAAc,YACd,GAAG,SAIF;CACD,OACE,oBAACA,aAAoB,MAArB;EACE,aAAU;EACV,oBAAkB;EACL;EACb,WAAW,GACT,gBAAgB,eAAe,+CAA+C,cAC9E,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EACtB,WACA,GAAG,SACqD;CACxD,OACE,oBAACA,aAAoB,MAArB;EACE,aAAU;EACV,WAAW,GACT,mVACA,SACF;EACA,GAAI;YAEJ,oBAACA,aAAoB,WAArB;GACE,aAAU;GACV,WAAU;aAEV,oBAAC,YAAD,EAAY,WAAU,kFAAmF,CAAA;EAC5E,CAAA;CACP,CAAA;AAE9B;;AAGA,SAAS,cAAc,EACrB,WACA,OACA,OACA,aACA,UAAU,OACV,IACA,GAAG,SAUF;CACD,MAAM,cAAc,MAAM;CAC1B,MAAM,SAAS,MAAM;CACrB,OACE,qBAAC,SAAD;EACE,aAAU;EACV,SAAS;EACT,WAAW,GACT,qRACA,UAAU,qBAAqB,YAC/B,SACF;YAPF,CASE,oBAAC,gBAAD;GACE,aAAU;GACV,IAAI;GACG;GACP,WAAU;GACV,GAAI;EACL,CAAA,GACD,qBAAC,QAAD;GAAM,aAAU;GAA0B,WAAU;aAApD,CACG,SAAS,QACR,oBAAC,QAAD;IAAM,aAAU;IAAwB,WAAU;cAC/C;GACG,CAAA,GAEP,eAAe,QACd,oBAAC,QAAD;IAAM,aAAU;IAA8B,WAAU;cACrD;GACG,CAAA,CAEJ;IACD;;AAEX"}
+{"version":3,"file":"index.js","names":["RadioGroupPrimitive"],"sources":["../../../src/primitives/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { CircleIcon } from \"lucide-react\";\nimport { RadioGroup as RadioGroupPrimitive } from \"radix-ui\";\nimport { useId } from \"react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */\nfunction RadioGroup({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root> & {\n  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */\n  orientation?: \"vertical\" | \"horizontal\";\n}) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        orientation === \"horizontal\" ? \"flex flex-row flex-wrap gap-4 items-center\" : \"grid gap-3\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** A single selectable radio control; pair it with a label for accessible option text. */\nfunction RadioGroupItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      className={cn(\n        // Dot color rides on currentColor: the checked dot is the inverted fill,\n        // flipping to the danger color under aria-invalid (Figma radio spec).\n        \"aspect-square size-4 shrink-0 rounded-full border border-secondary-border bg-input-bg text-primary-invert-bg transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus data-[state=checked]:border-selected-border disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger-border aria-invalid:ring-focus-error aria-invalid:text-danger-txt\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"relative flex items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current stroke-current\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  );\n}\n\n/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */\nfunction RichRadioItem({\n  className,\n  value,\n  title,\n  description,\n  flipped = false,\n  id,\n  ...props\n}: Omit<React.ComponentProps<typeof RadioGroupPrimitive.Item>, \"children\"> & {\n  /** Value submitted when this option is selected. */\n  value: string;\n  /** Bold heading shown at the top of the card. */\n  title?: React.ReactNode;\n  /** Secondary muted text shown beneath the title. */\n  description?: React.ReactNode;\n  /** Place the radio control on the trailing edge instead of the leading edge. */\n  flipped?: boolean;\n}) {\n  const generatedId = useId();\n  const itemId = id ?? generatedId;\n  return (\n    <label\n      data-slot=\"rich-radio-item\"\n      htmlFor={itemId}\n      className={cn(\n        \"flex cursor-pointer items-start gap-3 rounded-10 border border-primary-border bg-muted-bg p-3 text-primary-txt transition-colors has-[[data-state=checked]]:border-selected-border has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50\",\n        flipped ? \"flex-row-reverse\" : \"flex-row\",\n        className,\n      )}\n    >\n      <RadioGroupItem\n        data-slot=\"rich-radio-item-control\"\n        id={itemId}\n        value={value}\n        className=\"mt-0.75\"\n        {...props}\n      />\n      <span data-slot=\"rich-radio-item-content\" className=\"flex flex-col gap-1.5\">\n        {title != null && (\n          <span data-slot=\"rich-radio-item-title\" className=\"text-sm leading-5\">\n            {title}\n          </span>\n        )}\n        {description != null && (\n          <span\n            data-slot=\"rich-radio-item-description\"\n            className=\"text-xs leading-4 text-muted-txt\"\n          >\n            {description}\n          </span>\n        )}\n      </span>\n    </label>\n  );\n}\n\nexport { RadioGroup, RadioGroupItem, RichRadioItem };\n"],"mappings":";;;;;;;AAQA,SAAS,WAAW,EAClB,WACA,cAAc,YACd,GAAG,SAIF;CACD,OACE,oBAACA,aAAoB,MAArB;EACE,aAAU;EACV,oBAAkB;EACL;EACb,WAAW,GACT,gBAAgB,eAAe,+CAA+C,cAC9E,SACF;EACA,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EACtB,WACA,GAAG,SACqD;CACxD,OACE,oBAACA,aAAoB,MAArB;EACE,aAAU;EACV,WAAW,GAGT,kYACA,SACF;EACA,GAAI;YAEJ,oBAACA,aAAoB,WAArB;GACE,aAAU;GACV,WAAU;aAEV,oBAAC,YAAD,EAAY,WAAU,iGAAkG,CAAA;EAC3F,CAAA;CACP,CAAA;AAE9B;;AAGA,SAAS,cAAc,EACrB,WACA,OACA,OACA,aACA,UAAU,OACV,IACA,GAAG,SAUF;CACD,MAAM,cAAc,MAAM;CAC1B,MAAM,SAAS,MAAM;CACrB,OACE,qBAAC,SAAD;EACE,aAAU;EACV,SAAS;EACT,WAAW,GACT,oPACA,UAAU,qBAAqB,YAC/B,SACF;YAPF,CASE,oBAAC,gBAAD;GACE,aAAU;GACV,IAAI;GACG;GACP,WAAU;GACV,GAAI;EACL,CAAA,GACD,qBAAC,QAAD;GAAM,aAAU;GAA0B,WAAU;aAApD,CACG,SAAS,QACR,oBAAC,QAAD;IAAM,aAAU;IAAwB,WAAU;cAC/C;GACG,CAAA,GAEP,eAAe,QACd,oBAAC,QAAD;IACE,aAAU;IACV,WAAU;cAET;GACG,CAAA,CAEJ;IACD;;AAEX"}

package/dist/primitives/Resizable/index.cjs

@@ -25,10 +25,10 @@ function ResizablePanel({ ...props }) {
 function ResizableHandle({ withHandle, className, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_resizable_panels.Separator, {
 		"data-slot": "resizable-handle",
-		className: require_cn.cn("relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90", className),
+		className: require_cn.cn("relative flex w-px items-center justify-center bg-primary-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-focus focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90", className),
 		...props,
 		children: withHandle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border",
+			className: "z-10 flex h-4 w-3 items-center justify-center rounded-2 border bg-primary-border",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.GripVerticalIcon, { className: "size-2.5" })
 		})
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["ResizablePrimitive","cn","GripVerticalIcon"],"sources":["../../../src/primitives/Resizable/Resizable.tsx"],"sourcesContent":["import { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/utils\";\n\n/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */\nfunction ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps) {\n  return (\n    <ResizablePrimitive.Group\n      data-slot=\"resizable-panel-group\"\n      className={cn(\"flex h-full w-full aria-[orientation=vertical]:flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\n/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: ResizablePrimitive.SeparatorProps & {\n  /** Renders a visible grip icon centred on the divider. */\n  withHandle?: boolean;\n}) {\n  return (\n    <ResizablePrimitive.Separator\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.Separator>\n  );\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":";;;;;;;;;AAMA,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAwC;CACnF,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAmB,OAApB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,2DAA2D,SAAS;EAClF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAwC;CACnE,OAAO,iBAAA,GAAA,kBAAA,KAACD,uBAAmB,OAApB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,gBAAgB,EACvB,YACA,WACA,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAmB,WAApB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,6kBACA,SACF;EACA,GAAI;YAEH,cACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,WAAU;aACb,iBAAA,GAAA,kBAAA,KAACC,aAAAA,kBAAD,EAAkB,WAAU,WAAY,CAAA;EACrC,CAAA;CAEqB,CAAA;AAElC"}
+{"version":3,"file":"index.cjs","names":["ResizablePrimitive","cn","GripVerticalIcon"],"sources":["../../../src/primitives/Resizable/Resizable.tsx"],"sourcesContent":["import { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/utils\";\n\n/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */\nfunction ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps) {\n  return (\n    <ResizablePrimitive.Group\n      data-slot=\"resizable-panel-group\"\n      className={cn(\"flex h-full w-full aria-[orientation=vertical]:flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\n/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: ResizablePrimitive.SeparatorProps & {\n  /** Renders a visible grip icon centred on the divider. */\n  withHandle?: boolean;\n}) {\n  return (\n    <ResizablePrimitive.Separator\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"relative flex w-px items-center justify-center bg-primary-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-focus focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-2 border bg-primary-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.Separator>\n  );\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":";;;;;;;;;AAMA,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAwC;CACnF,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAmB,OAApB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,2DAA2D,SAAS;EAClF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAwC;CACnE,OAAO,iBAAA,GAAA,kBAAA,KAACD,uBAAmB,OAApB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,gBAAgB,EACvB,YACA,WACA,GAAG,SAIF;CACD,OACE,iBAAA,GAAA,kBAAA,KAACA,uBAAmB,WAApB;EACE,aAAU;EACV,WAAWC,WAAAA,GACT,slBACA,SACF;EACA,GAAI;YAEH,cACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,WAAU;aACb,iBAAA,GAAA,kBAAA,KAACC,aAAAA,kBAAD,EAAkB,WAAU,WAAY,CAAA;EACrC,CAAA;CAEqB,CAAA;AAElC"}

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

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../../index47.cjs";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../../index48.cjs";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

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

@@ -1,2 +1,2 @@
-import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../../index47.js";
+import { n as ResizablePanel, r as ResizablePanelGroup, t as ResizableHandle } from "../../index48.js";
 export { ResizableHandle, ResizablePanel, ResizablePanelGroup };

package/dist/primitives/Resizable/index.js

@@ -22,10 +22,10 @@ function ResizablePanel({ ...props }) {
 function ResizableHandle({ withHandle, className, ...props }) {
 	return /* @__PURE__ */ jsx(ResizablePrimitive.Separator, {
 		"data-slot": "resizable-handle",
-		className: cn("relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90", className),
+		className: cn("relative flex w-px items-center justify-center bg-primary-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-focus focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90", className),
 		...props,
 		children: withHandle && /* @__PURE__ */ jsx("div", {
-			className: "z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border",
+			className: "z-10 flex h-4 w-3 items-center justify-center rounded-2 border bg-primary-border",
 			children: /* @__PURE__ */ jsx(GripVerticalIcon, { className: "size-2.5" })
 		})
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Resizable/Resizable.tsx"],"sourcesContent":["import { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/utils\";\n\n/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */\nfunction ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps) {\n  return (\n    <ResizablePrimitive.Group\n      data-slot=\"resizable-panel-group\"\n      className={cn(\"flex h-full w-full aria-[orientation=vertical]:flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\n/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: ResizablePrimitive.SeparatorProps & {\n  /** Renders a visible grip icon centred on the divider. */\n  withHandle?: boolean;\n}) {\n  return (\n    <ResizablePrimitive.Separator\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.Separator>\n  );\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":";;;;;;AAMA,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAwC;CACnF,OACE,oBAAC,mBAAmB,OAApB;EACE,aAAU;EACV,WAAW,GAAG,2DAA2D,SAAS;EAClF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAwC;CACnE,OAAO,oBAAC,mBAAmB,OAApB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,gBAAgB,EACvB,YACA,WACA,GAAG,SAIF;CACD,OACE,oBAAC,mBAAmB,WAApB;EACE,aAAU;EACV,WAAW,GACT,6kBACA,SACF;EACA,GAAI;YAEH,cACC,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,kBAAD,EAAkB,WAAU,WAAY,CAAA;EACrC,CAAA;CAEqB,CAAA;AAElC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Resizable/Resizable.tsx"],"sourcesContent":["import { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/utils\";\n\n/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */\nfunction ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps) {\n  return (\n    <ResizablePrimitive.Group\n      data-slot=\"resizable-panel-group\"\n      className={cn(\"flex h-full w-full aria-[orientation=vertical]:flex-col\", className)}\n      {...props}\n    />\n  );\n}\n\n/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */\nfunction ResizablePanel({ ...props }: ResizablePrimitive.PanelProps) {\n  return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\n/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */\nfunction ResizableHandle({\n  withHandle,\n  className,\n  ...props\n}: ResizablePrimitive.SeparatorProps & {\n  /** Renders a visible grip icon centred on the divider. */\n  withHandle?: boolean;\n}) {\n  return (\n    <ResizablePrimitive.Separator\n      data-slot=\"resizable-handle\"\n      className={cn(\n        \"relative flex w-px items-center justify-center bg-primary-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-focus focus-visible:ring-offset-1 focus-visible:outline-hidden aria-[orientation=horizontal]:h-px aria-[orientation=horizontal]:w-full aria-[orientation=horizontal]:after:left-0 aria-[orientation=horizontal]:after:h-1 aria-[orientation=horizontal]:after:w-full aria-[orientation=horizontal]:after:translate-x-0 aria-[orientation=horizontal]:after:-translate-y-1/2 [&[aria-orientation=horizontal]>div]:rotate-90\",\n        className,\n      )}\n      {...props}\n    >\n      {withHandle && (\n        <div className=\"z-10 flex h-4 w-3 items-center justify-center rounded-2 border bg-primary-border\">\n          <GripVerticalIcon className=\"size-2.5\" />\n        </div>\n      )}\n    </ResizablePrimitive.Separator>\n  );\n}\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n"],"mappings":";;;;;;AAMA,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAwC;CACnF,OACE,oBAAC,mBAAmB,OAApB;EACE,aAAU;EACV,WAAW,GAAG,2DAA2D,SAAS;EAClF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAwC;CACnE,OAAO,oBAAC,mBAAmB,OAApB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,gBAAgB,EACvB,YACA,WACA,GAAG,SAIF;CACD,OACE,oBAAC,mBAAmB,WAApB;EACE,aAAU;EACV,WAAW,GACT,slBACA,SACF;EACA,GAAI;YAEH,cACC,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,kBAAD,EAAkB,WAAU,WAAY,CAAA;EACrC,CAAA;CAEqB,CAAA;AAElC"}

package/dist/primitives/ScrollArea/index.cjs

@@ -12,7 +12,7 @@ function ScrollArea({ className, children, ...props }) {
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ScrollArea.Viewport, {
 				"data-slot": "scroll-area-viewport",
-				className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1",
+				className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1",
 				children
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollBar, {}),
@@ -29,7 +29,7 @@ function ScrollBar({ className, orientation = "vertical", ...props }) {
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.ScrollArea.ScrollAreaThumb, {
 			"data-slot": "scroll-area-thumb",
-			className: "relative flex-1 rounded-sm bg-border"
+			className: "relative flex-1 rounded-4 bg-primary-border"
 		})
 	});
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["ScrollAreaPrimitive","cn"],"sources":["../../../src/primitives/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\n/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */\nfunction ScrollBar({\n  className,\n  /** Axis the scrollbar controls; defaults to `\"vertical\"`. */\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" && \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" && \"h-2.5 flex-col border-t border-t-transparent\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-sm bg-border\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":";;;;;;AAMA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,YAAY,SAAS;EACnC,GAAI;YAHN;GAKE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,UAArB;IACE,aAAU;IACV,WAAU;IAET;GAC2B,CAAA;GAC9B,iBAAA,GAAA,kBAAA,KAAC,WAAD,CAAY,CAAA;GACZ,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,QAArB,CAA6B,CAAA;EACL;;AAE9B;;AAGA,SAAS,UAAU,EACjB,WAEA,cAAc,YACd,GAAG,SACoE;CACvE,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,qBAArB;EACE,aAAU;EACG;EACb,WAAWC,WAAAA,GACT,sDACA,gBAAgB,cAAc,8CAC9B,gBAAgB,gBAAgB,gDAChC,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,iBAArB;GACE,aAAU;GACV,WAAU;EACX,CAAA;CACsC,CAAA;AAE7C"}
+{"version":3,"file":"index.cjs","names":["ScrollAreaPrimitive","cn"],"sources":["../../../src/primitives/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\n/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */\nfunction ScrollBar({\n  className,\n  /** Axis the scrollbar controls; defaults to `\"vertical\"`. */\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" && \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" && \"h-2.5 flex-col border-t border-t-transparent\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-4 bg-primary-border\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":";;;;;;AAMA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,WAAoB,MAArB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,YAAY,SAAS;EACnC,GAAI;YAHN;GAKE,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,UAArB;IACE,aAAU;IACV,WAAU;IAET;GAC2B,CAAA;GAC9B,iBAAA,GAAA,kBAAA,KAAC,WAAD,CAAY,CAAA;GACZ,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,QAArB,CAA6B,CAAA;EACL;;AAE9B;;AAGA,SAAS,UAAU,EACjB,WAEA,cAAc,YACd,GAAG,SACoE;CACvE,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,WAAoB,qBAArB;EACE,aAAU;EACG;EACb,WAAWC,WAAAA,GACT,sDACA,gBAAgB,cAAc,8CAC9B,gBAAgB,gBAAgB,gDAChC,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAACD,SAAAA,WAAoB,iBAArB;GACE,aAAU;GACV,WAAU;EACX,CAAA;CACsC,CAAA;AAE7C"}

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

@@ -1,2 +1,2 @@
-import { n as ScrollBar, t as ScrollArea } from "../../index48.cjs";
+import { n as ScrollBar, t as ScrollArea } from "../../index49.cjs";
 export { ScrollArea, ScrollBar };

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

@@ -1,2 +1,2 @@
-import { n as ScrollBar, t as ScrollArea } from "../../index48.js";
+import { n as ScrollBar, t as ScrollArea } from "../../index49.js";
 export { ScrollArea, ScrollBar };

package/dist/primitives/ScrollArea/index.js

@@ -11,7 +11,7 @@ function ScrollArea({ className, children, ...props }) {
 		children: [
 			/* @__PURE__ */ jsx(ScrollArea$1.Viewport, {
 				"data-slot": "scroll-area-viewport",
-				className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1",
+				className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1",
 				children
 			}),
 			/* @__PURE__ */ jsx(ScrollBar, {}),
@@ -28,7 +28,7 @@ function ScrollBar({ className, orientation = "vertical", ...props }) {
 		...props,
 		children: /* @__PURE__ */ jsx(ScrollArea$1.ScrollAreaThumb, {
 			"data-slot": "scroll-area-thumb",
-			className: "relative flex-1 rounded-sm bg-border"
+			className: "relative flex-1 rounded-4 bg-primary-border"
 		})
 	});
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ScrollAreaPrimitive"],"sources":["../../../src/primitives/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\n/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */\nfunction ScrollBar({\n  className,\n  /** Axis the scrollbar controls; defaults to `\"vertical\"`. */\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" && \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" && \"h-2.5 flex-col border-t border-t-transparent\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-sm bg-border\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":";;;;;AAMA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACqD;CACxD,OACE,qBAACA,aAAoB,MAArB;EACE,aAAU;EACV,WAAW,GAAG,YAAY,SAAS;EACnC,GAAI;YAHN;GAKE,oBAACA,aAAoB,UAArB;IACE,aAAU;IACV,WAAU;IAET;GAC2B,CAAA;GAC9B,oBAAC,WAAD,CAAY,CAAA;GACZ,oBAACA,aAAoB,QAArB,CAA6B,CAAA;EACL;;AAE9B;;AAGA,SAAS,UAAU,EACjB,WAEA,cAAc,YACd,GAAG,SACoE;CACvE,OACE,oBAACA,aAAoB,qBAArB;EACE,aAAU;EACG;EACb,WAAW,GACT,sDACA,gBAAgB,cAAc,8CAC9B,gBAAgB,gBAAgB,gDAChC,SACF;EACA,GAAI;YAEJ,oBAACA,aAAoB,iBAArB;GACE,aAAU;GACV,WAAU;EACX,CAAA;CACsC,CAAA;AAE7C"}
+{"version":3,"file":"index.js","names":["ScrollAreaPrimitive"],"sources":["../../../src/primitives/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-3 focus-visible:ring-focus focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\n/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */\nfunction ScrollBar({\n  className,\n  /** Axis the scrollbar controls; defaults to `\"vertical\"`. */\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" && \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" && \"h-2.5 flex-col border-t border-t-transparent\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-4 bg-primary-border\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"mappings":";;;;;AAMA,SAAS,WAAW,EAClB,WACA,UACA,GAAG,SACqD;CACxD,OACE,qBAACA,aAAoB,MAArB;EACE,aAAU;EACV,WAAW,GAAG,YAAY,SAAS;EACnC,GAAI;YAHN;GAKE,oBAACA,aAAoB,UAArB;IACE,aAAU;IACV,WAAU;IAET;GAC2B,CAAA;GAC9B,oBAAC,WAAD,CAAY,CAAA;GACZ,oBAACA,aAAoB,QAArB,CAA6B,CAAA;EACL;;AAE9B;;AAGA,SAAS,UAAU,EACjB,WAEA,cAAc,YACd,GAAG,SACoE;CACvE,OACE,oBAACA,aAAoB,qBAArB;EACE,aAAU;EACG;EACb,WAAW,GACT,sDACA,gBAAgB,cAAc,8CAC9B,gBAAgB,gBAAgB,gDAChC,SACF;EACA,GAAI;YAEJ,oBAACA,aAAoB,iBAArB;GACE,aAAU;GACV,WAAU;EACX,CAAA;CACsC,CAAA;AAE7C"}