@psnext/design-system 1.5.1 → 2.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Text/Text.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n// Text — the typography primitive. Renders any element via `as` and drives\n// size/line-height from the design-system BODY type scale (Inter): the Figma\n// \"paragraph large/regular/small/mini\" + caption steps (tokens in\n// styles/tokens/typography.css). Inline links compose as children.\nconst textVariants = cva(\"\", {\n  variants: {\n    // Body scale — font-size + line-height come straight from the type tokens.\n    size: {\n      large:\n        \"text-[length:var(--paragraph-large-font-size)] leading-[var(--paragraph-large-line-height)]\",\n      regular:\n        \"text-[length:var(--paragraph-regular-font-size)] leading-[var(--paragraph-regular-line-height)]\",\n      small:\n        \"text-[length:var(--paragraph-small-font-size)] leading-[var(--paragraph-small-line-height)]\",\n      mini: \"text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]\",\n      caption:\n        \"text-[length:var(--caption-font-size)] leading-[var(--caption-line-height)] tracking-[var(--caption-letter-spacing)] uppercase\",\n    },\n    weight: {\n      normal: \"font-normal\",\n      medium: \"font-medium\",\n      semibold: \"font-semibold\",\n    },\n    variant: {\n      default: \"text-foreground\",\n      muted: \"text-muted-foreground\",\n      primary: \"text-primary\",\n      destructive: \"text-destructive\",\n      success: \"text-[var(--content-success)]\",\n    },\n    font: {\n      body: \"font-sans\",\n      heading: \"font-heading\",\n      mono: \"font-mono\",\n    },\n    align: {\n      left: \"text-left\",\n      center: \"text-center\",\n      right: \"text-right\",\n    },\n    truncate: {\n      true: \"truncate\",\n    },\n  },\n  defaultVariants: {\n    size: \"regular\",\n    weight: \"normal\",\n    variant: \"default\",\n    font: \"body\",\n  },\n});\n\ntype TextProps = Omit<React.ComponentProps<\"p\">, \"color\"> &\n  VariantProps<typeof textVariants> & {\n    /** Element/component to render. Defaults to `p`. */\n    as?: React.ElementType;\n    /** Body type-scale step (font-size + line-height). Defaults to `regular`. */\n    size?: VariantProps<typeof textVariants>[\"size\"];\n    /** Font weight. Defaults to `normal`. */\n    weight?: VariantProps<typeof textVariants>[\"weight\"];\n    /** Foreground colour token. Defaults to `default` (text-foreground). */\n    variant?: VariantProps<typeof textVariants>[\"variant\"];\n    /** Font family. Defaults to `body` (sans). */\n    font?: VariantProps<typeof textVariants>[\"font\"];\n    /** Horizontal text alignment. */\n    align?: VariantProps<typeof textVariants>[\"align\"];\n    /** Truncate to a single line with an ellipsis. */\n    truncate?: VariantProps<typeof textVariants>[\"truncate\"];\n  };\n\n/** The typography primitive: renders any element via `as` and drives size/weight/colour from the body type scale. */\nfunction Text({\n  as,\n  className,\n  size,\n  weight,\n  variant,\n  font,\n  align,\n  truncate,\n  ...props\n}: TextProps) {\n  const Comp = as ?? \"p\";\n  return (\n    <Comp\n      data-slot=\"text\"\n      className={cn(textVariants({ size, weight, variant, font, align, truncate }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Text, textVariants, type TextProps };\n"],"mappings":";;;;AASA,MAAM,eAAe,IAAI,IAAI;CAC3B,UAAU;EAER,MAAM;GACJ,OACE;GACF,SACE;GACF,OACE;GACF,MAAM;GACN,SACE;EACJ;EACA,QAAQ;GACN,QAAQ;GACR,QAAQ;GACR,UAAU;EACZ;EACA,SAAS;GACP,SAAS;GACT,OAAO;GACP,SAAS;GACT,aAAa;GACb,SAAS;EACX;EACA,MAAM;GACJ,MAAM;GACN,SAAS;GACT,MAAM;EACR;EACA,OAAO;GACL,MAAM;GACN,QAAQ;GACR,OAAO;EACT;EACA,UAAU,EACR,MAAM,WACR;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;EACR,SAAS;EACT,MAAM;CACR;AACF,CAAC;;AAqBD,SAAS,KAAK,EACZ,IACA,WACA,MACA,QACA,SACA,MACA,OACA,UACA,GAAG,SACS;CAEZ,OACE,oBAFW,MAAM,KAEjB;EACE,aAAU;EACV,WAAW,GAAG,aAAa;GAAE;GAAM;GAAQ;GAAS;GAAM;GAAO;EAAS,CAAC,GAAG,SAAS;EACvF,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Text/Text.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n// Text — the typography primitive. Renders any element via `as` and drives\n// size/line-height from the design-system BODY type scale (Inter): the Figma\n// \"paragraph large/regular/small/mini\" + caption steps (tokens in\n// styles/tokens/typography.css). Inline links compose as children.\nconst textVariants = cva(\"\", {\n  variants: {\n    // Body scale — font-size + line-height come straight from the type tokens.\n    size: {\n      large:\n        \"text-[length:var(--paragraph-large-font-size)] leading-[var(--paragraph-large-line-height)]\",\n      regular:\n        \"text-[length:var(--paragraph-regular-font-size)] leading-[var(--paragraph-regular-line-height)]\",\n      small:\n        \"text-[length:var(--paragraph-small-font-size)] leading-[var(--paragraph-small-line-height)]\",\n      mini: \"text-[length:var(--paragraph-mini-font-size)] leading-[var(--paragraph-mini-line-height)]\",\n      caption:\n        \"text-[length:var(--caption-font-size)] leading-[var(--caption-line-height)] tracking-[var(--caption-letter-spacing)] uppercase\",\n    },\n    weight: {\n      normal: \"font-normal\",\n      medium: \"font-medium\",\n      semibold: \"font-semibold\",\n    },\n    variant: {\n      default: \"text-primary-txt\",\n      muted: \"text-muted-txt\",\n      primary: \"text-primary-txt\",\n      destructive: \"text-danger-txt\",\n      success: \"text-success-txt\",\n    },\n    font: {\n      body: \"font-sans\",\n      heading: \"font-heading\",\n      mono: \"font-mono\",\n    },\n    align: {\n      left: \"text-left\",\n      center: \"text-center\",\n      right: \"text-right\",\n    },\n    truncate: {\n      true: \"truncate\",\n    },\n  },\n  defaultVariants: {\n    size: \"regular\",\n    weight: \"normal\",\n    variant: \"default\",\n    font: \"body\",\n  },\n});\n\ntype TextProps = Omit<React.ComponentProps<\"p\">, \"color\"> &\n  VariantProps<typeof textVariants> & {\n    /** Element/component to render. Defaults to `p`. */\n    as?: React.ElementType;\n    /** Body type-scale step (font-size + line-height). Defaults to `regular`. */\n    size?: VariantProps<typeof textVariants>[\"size\"];\n    /** Font weight. Defaults to `normal`. */\n    weight?: VariantProps<typeof textVariants>[\"weight\"];\n    /** Foreground colour token. Defaults to `default` (text-primary-txt). */\n    variant?: VariantProps<typeof textVariants>[\"variant\"];\n    /** Font family. Defaults to `body` (sans). */\n    font?: VariantProps<typeof textVariants>[\"font\"];\n    /** Horizontal text alignment. */\n    align?: VariantProps<typeof textVariants>[\"align\"];\n    /** Truncate to a single line with an ellipsis. */\n    truncate?: VariantProps<typeof textVariants>[\"truncate\"];\n  };\n\n/** The typography primitive: renders any element via `as` and drives size/weight/colour from the body type scale. */\nfunction Text({\n  as,\n  className,\n  size,\n  weight,\n  variant,\n  font,\n  align,\n  truncate,\n  ...props\n}: TextProps) {\n  const Comp = as ?? \"p\";\n  return (\n    <Comp\n      data-slot=\"text\"\n      className={cn(textVariants({ size, weight, variant, font, align, truncate }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Text, textVariants, type TextProps };\n"],"mappings":";;;;AASA,MAAM,eAAe,IAAI,IAAI;CAC3B,UAAU;EAER,MAAM;GACJ,OACE;GACF,SACE;GACF,OACE;GACF,MAAM;GACN,SACE;EACJ;EACA,QAAQ;GACN,QAAQ;GACR,QAAQ;GACR,UAAU;EACZ;EACA,SAAS;GACP,SAAS;GACT,OAAO;GACP,SAAS;GACT,aAAa;GACb,SAAS;EACX;EACA,MAAM;GACJ,MAAM;GACN,SAAS;GACT,MAAM;EACR;EACA,OAAO;GACL,MAAM;GACN,QAAQ;GACR,OAAO;EACT;EACA,UAAU,EACR,MAAM,WACR;CACF;CACA,iBAAiB;EACf,MAAM;EACN,QAAQ;EACR,SAAS;EACT,MAAM;CACR;AACF,CAAC;;AAqBD,SAAS,KAAK,EACZ,IACA,WACA,MACA,QACA,SACA,MACA,OACA,UACA,GAAG,SACS;CAEZ,OACE,oBAFW,MAAM,KAEjB;EACE,aAAU;EACV,WAAW,GAAG,aAAa;GAAE;GAAM;GAAQ;GAAS;GAAM;GAAO;EAAS,CAAC,GAAG,SAAS;EACvF,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/Textarea/index.cjs

@@ -2,18 +2,30 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_cn = require("../../cn.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/primitives/Textarea/Textarea.tsx
-const textareaVariants = (0, require("class-variance-authority").cva)("border-border placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-ring-error aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full border bg-input-background px-3 py-2 text-sm transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", {
-	variants: { shape: {
-		default: "rounded-xl",
-		round: "rounded-2xl"
-	} },
-	defaultVariants: { shape: "default" }
+const textareaVariants = (0, require("class-variance-authority").cva)("text-primary-txt placeholder:text-muted-txt focus-visible:ring-focus aria-invalid:ring-focus-error flex field-sizing-content min-h-19 w-full px-3 py-2 text-sm leading-5 transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50", {
+	variants: {
+		variant: {
+			default: "border border-primary-border bg-input-bg focus-visible:border-primary-invert-border aria-invalid:border-danger-border",
+			ai: "ai-border [--ai-surface:var(--input-bg)]"
+		},
+		shape: {
+			default: "rounded-12",
+			round: "rounded-16"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		shape: "default"
+	}
 });
 /** Multi-line text input that auto-grows with its content and supports validation + disabled states. */
-function Textarea({ className, shape, ...props }) {
+function Textarea({ className, variant, shape, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
 		"data-slot": "textarea",
-		className: require_cn.cn(textareaVariants({ shape }), className),
+		className: require_cn.cn(textareaVariants({
+			variant,
+			shape
+		}), className),
 		...props
 	});
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["cn"],"sources":["../../../src/primitives/Textarea/Textarea.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst textareaVariants = cva(\n  \"border-border placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-ring-error aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full border bg-input-background px-3 py-2 text-sm transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50\",\n  {\n    variants: {\n      shape: {\n        default: \"rounded-xl\",\n        round: \"rounded-2xl\",\n      },\n    },\n    defaultVariants: {\n      shape: \"default\",\n    },\n  },\n);\n\n/** Multi-line text input that auto-grows with its content and supports validation + disabled states. */\nfunction Textarea({\n  className,\n  shape,\n  ...props\n}: React.ComponentProps<\"textarea\"> &\n  VariantProps<typeof textareaVariants> & {\n    /** Corner radius: `default` (rounded-md) or `round` (rounded-2xl). */\n    shape?: VariantProps<typeof textareaVariants>[\"shape\"];\n  }) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(textareaVariants({ shape }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea, textareaVariants };\n"],"mappings":";;;;AAKA,MAAM,oBAAA,qCAAA,EAAA,KACJ,gXACA;CACE,UAAU,EACR,OAAO;EACL,SAAS;EACT,OAAO;CACT,EACF;CACA,iBAAiB,EACf,OAAO,UACT;AACF,CACF;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,GAAG,SAKA;CACH,OACE,iBAAA,GAAA,kBAAA,KAAC,YAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,iBAAiB,EAAE,MAAM,CAAC,GAAG,SAAS;EACpD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.cjs","names":["cn"],"sources":["../../../src/primitives/Textarea/Textarea.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/* Figma: PS AI Helix – Core → Textarea (node 16:1745). Chrome matches Input. */\nconst textareaVariants = cva(\n  \"text-primary-txt placeholder:text-muted-txt focus-visible:ring-focus aria-invalid:ring-focus-error flex field-sizing-content min-h-19 w-full px-3 py-2 text-sm leading-5 transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50\",\n  {\n    variants: {\n      // `ai` swaps the border for the AI gradient; text/placeholder are unchanged.\n      variant: {\n        default:\n          \"border border-primary-border bg-input-bg focus-visible:border-primary-invert-border aria-invalid:border-danger-border\",\n        ai: \"ai-border [--ai-surface:var(--input-bg)]\",\n      },\n      shape: {\n        default: \"rounded-12\",\n        // Figma drew 18px here (off the radius scale, flagged to design); code rounds\n        // to the nearest token step, rounded-16.\n        round: \"rounded-16\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** Multi-line text input that auto-grows with its content and supports validation + disabled states. */\nfunction Textarea({\n  className,\n  /** Chrome style — `default` bordered field or `ai` (AI gradient border). */\n  variant,\n  shape,\n  ...props\n}: React.ComponentProps<\"textarea\"> &\n  VariantProps<typeof textareaVariants> & {\n    /** Corner radius: `default` (12px) or `round` (16px). */\n    shape?: VariantProps<typeof textareaVariants>[\"shape\"];\n  }) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(textareaVariants({ variant, shape }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea, textareaVariants };\n"],"mappings":";;;;AAMA,MAAM,oBAAA,qCAAA,EAAA,KACJ,4RACA;CACE,UAAU;EAER,SAAS;GACP,SACE;GACF,IAAI;EACN;EACA,OAAO;GACL,SAAS;GAGT,OAAO;EACT;CACF;CACA,iBAAiB;EACf,SAAS;EACT,OAAO;CACT;AACF,CACF;;AAGA,SAAS,SAAS,EAChB,WAEA,SACA,OACA,GAAG,SAKA;CACH,OACE,iBAAA,GAAA,kBAAA,KAAC,YAAD;EACE,aAAU;EACV,WAAWA,WAAAA,GAAG,iBAAiB;GAAE;GAAS;EAAM,CAAC,GAAG,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL"}

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

@@ -1,2 +1,2 @@
-import { n as textareaVariants, t as Textarea } from "../../index61.cjs";
+import { n as textareaVariants, t as Textarea } from "../../index62.cjs";
 export { Textarea, textareaVariants };

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

@@ -1,2 +1,2 @@
-import { n as textareaVariants, t as Textarea } from "../../index61.js";
+import { n as textareaVariants, t as Textarea } from "../../index62.js";
 export { Textarea, textareaVariants };

package/dist/primitives/Textarea/index.js

@@ -2,18 +2,30 @@ import { t as cn } from "../../cn.js";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/primitives/Textarea/Textarea.tsx
-const textareaVariants = cva("border-border placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-ring-error aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full border bg-input-background px-3 py-2 text-sm transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", {
-	variants: { shape: {
-		default: "rounded-xl",
-		round: "rounded-2xl"
-	} },
-	defaultVariants: { shape: "default" }
+const textareaVariants = cva("text-primary-txt placeholder:text-muted-txt focus-visible:ring-focus aria-invalid:ring-focus-error flex field-sizing-content min-h-19 w-full px-3 py-2 text-sm leading-5 transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50", {
+	variants: {
+		variant: {
+			default: "border border-primary-border bg-input-bg focus-visible:border-primary-invert-border aria-invalid:border-danger-border",
+			ai: "ai-border [--ai-surface:var(--input-bg)]"
+		},
+		shape: {
+			default: "rounded-12",
+			round: "rounded-16"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		shape: "default"
+	}
 });
 /** Multi-line text input that auto-grows with its content and supports validation + disabled states. */
-function Textarea({ className, shape, ...props }) {
+function Textarea({ className, variant, shape, ...props }) {
 	return /* @__PURE__ */ jsx("textarea", {
 		"data-slot": "textarea",
-		className: cn(textareaVariants({ shape }), className),
+		className: cn(textareaVariants({
+			variant,
+			shape
+		}), className),
 		...props
 	});
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Textarea/Textarea.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst textareaVariants = cva(\n  \"border-border placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-ring-error aria-invalid:border-destructive flex field-sizing-content min-h-16 w-full border bg-input-background px-3 py-2 text-sm transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50\",\n  {\n    variants: {\n      shape: {\n        default: \"rounded-xl\",\n        round: \"rounded-2xl\",\n      },\n    },\n    defaultVariants: {\n      shape: \"default\",\n    },\n  },\n);\n\n/** Multi-line text input that auto-grows with its content and supports validation + disabled states. */\nfunction Textarea({\n  className,\n  shape,\n  ...props\n}: React.ComponentProps<\"textarea\"> &\n  VariantProps<typeof textareaVariants> & {\n    /** Corner radius: `default` (rounded-md) or `round` (rounded-2xl). */\n    shape?: VariantProps<typeof textareaVariants>[\"shape\"];\n  }) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(textareaVariants({ shape }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea, textareaVariants };\n"],"mappings":";;;;AAKA,MAAM,mBAAmB,IACvB,gXACA;CACE,UAAU,EACR,OAAO;EACL,SAAS;EACT,OAAO;CACT,EACF;CACA,iBAAiB,EACf,OAAO,UACT;AACF,CACF;;AAGA,SAAS,SAAS,EAChB,WACA,OACA,GAAG,SAKA;CACH,OACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GAAG,iBAAiB,EAAE,MAAM,CAAC,GAAG,SAAS;EACpD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/primitives/Textarea/Textarea.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/* Figma: PS AI Helix – Core → Textarea (node 16:1745). Chrome matches Input. */\nconst textareaVariants = cva(\n  \"text-primary-txt placeholder:text-muted-txt focus-visible:ring-focus aria-invalid:ring-focus-error flex field-sizing-content min-h-19 w-full px-3 py-2 text-sm leading-5 transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50\",\n  {\n    variants: {\n      // `ai` swaps the border for the AI gradient; text/placeholder are unchanged.\n      variant: {\n        default:\n          \"border border-primary-border bg-input-bg focus-visible:border-primary-invert-border aria-invalid:border-danger-border\",\n        ai: \"ai-border [--ai-surface:var(--input-bg)]\",\n      },\n      shape: {\n        default: \"rounded-12\",\n        // Figma drew 18px here (off the radius scale, flagged to design); code rounds\n        // to the nearest token step, rounded-16.\n        round: \"rounded-16\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** Multi-line text input that auto-grows with its content and supports validation + disabled states. */\nfunction Textarea({\n  className,\n  /** Chrome style — `default` bordered field or `ai` (AI gradient border). */\n  variant,\n  shape,\n  ...props\n}: React.ComponentProps<\"textarea\"> &\n  VariantProps<typeof textareaVariants> & {\n    /** Corner radius: `default` (12px) or `round` (16px). */\n    shape?: VariantProps<typeof textareaVariants>[\"shape\"];\n  }) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(textareaVariants({ variant, shape }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea, textareaVariants };\n"],"mappings":";;;;AAMA,MAAM,mBAAmB,IACvB,4RACA;CACE,UAAU;EAER,SAAS;GACP,SACE;GACF,IAAI;EACN;EACA,OAAO;GACL,SAAS;GAGT,OAAO;EACT;CACF;CACA,iBAAiB;EACf,SAAS;EACT,OAAO;CACT;AACF,CACF;;AAGA,SAAS,SAAS,EAChB,WAEA,SACA,OACA,GAAG,SAKA;CACH,OACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GAAG,iBAAiB;GAAE;GAAS;EAAM,CAAC,GAAG,SAAS;EAC7D,GAAI;CACL,CAAA;AAEL"}

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

@@ -1,2 +1,2 @@
-import { a as useTheme, i as ThemeProvider, n as ThemeMode, r as ThemeProduct, t as ThemeContext } from "../../index62.cjs";
+import { a as useTheme, i as ThemeProvider, n as ThemeMode, r as ThemeProduct, t as ThemeContext } from "../../index63.cjs";
 export { ThemeContext, ThemeMode, ThemeProduct, ThemeProvider, useTheme };

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

@@ -1,2 +1,2 @@
-import { a as useTheme, i as ThemeProvider, n as ThemeMode, r as ThemeProduct, t as ThemeContext } from "../../index62.js";
+import { a as useTheme, i as ThemeProvider, n as ThemeMode, r as ThemeProduct, t as ThemeContext } from "../../index63.js";
 export { ThemeContext, ThemeMode, ThemeProduct, ThemeProvider, useTheme };

package/dist/primitives/Toggle/index.cjs

@@ -3,25 +3,26 @@ const require_cn = require("../../cn.cjs");
 let radix_ui = require("radix-ui");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/primitives/Toggle/Toggle.tsx
-const toggleVariants = (0, require("class-variance-authority").cva)("inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-ring-error aria-invalid:border-destructive whitespace-nowrap", {
+const toggleVariants = (0, require("class-variance-authority").cva)("inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer text-primary-txt hover:bg-ghost-hover-bg disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-toggle-active-bg [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:ring-focus focus-visible:ring-3 outline-none transition-[color,box-shadow] aria-invalid:ring-focus-error aria-invalid:border-danger-border whitespace-nowrap", {
 	variants: {
-		/** Visual style: `default` (transparent) or `outline` (bordered). */
+		/** Visual style: `default` (transparent/ghost) or `outline` (bordered). */
 		variant: {
-			default: "bg-transparent",
-			outline: "border border-border bg-transparent hover:bg-accent hover:text-accent-foreground"
+			default: "bg-ghost-bg",
+			outline: "border border-primary-border bg-ghost-bg"
 		},
-		/** Control size: `sm`, `default`, or `lg`. */
+		/** Control size: `xs` (Mini 24), `sm` (32), `default` (36), or `lg` (40). */
 		size: {
+			xs: "h-6 px-1 min-w-6",
+			sm: "h-8 px-2 min-w-8",
 			default: "h-9 px-2 min-w-9",
-			sm: "h-8 px-1.5 min-w-8",
-			lg: "h-10 px-2.5 min-w-10"
+			lg: "h-10 px-2 min-w-10"
 		},
 		shape: {
-			default: "rounded-md",
+			default: "rounded-8",
 			round: "rounded-full",
-			left: "rounded-l-md rounded-r-none",
+			left: "rounded-l-8 rounded-r-none",
 			middle: "rounded-none",
-			right: "rounded-r-md rounded-l-none"
+			right: "rounded-r-8 rounded-l-none"
 		}
 	},
 	compoundVariants: [{

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["TogglePrimitive","cn"],"sources":["../../../src/primitives/Toggle/Toggle.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { Toggle as TogglePrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst toggleVariants = cva(\n  \"inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-ring-error aria-invalid:border-destructive whitespace-nowrap\",\n  {\n    variants: {\n      /** Visual style: `default` (transparent) or `outline` (bordered). */\n      variant: {\n        default: \"bg-transparent\",\n        outline: \"border border-border bg-transparent hover:bg-accent hover:text-accent-foreground\",\n      },\n      /** Control size: `sm`, `default`, or `lg`. */\n      size: {\n        default: \"h-9 px-2 min-w-9\",\n        sm: \"h-8 px-1.5 min-w-8\",\n        lg: \"h-10 px-2.5 min-w-10\",\n      },\n      // Shape (Figma): `default` (rounded-md) and `round` (pill) are standalone\n      // shapes; `left`/`middle`/`right` join into a segmented group, rounding\n      // only the outer edge.\n      shape: {\n        default: \"rounded-md\",\n        round: \"rounded-full\",\n        left: \"rounded-l-md rounded-r-none\",\n        middle: \"rounded-none\",\n        right: \"rounded-r-md rounded-l-none\",\n      },\n    },\n    compoundVariants: [\n      // Outlined segments collapse the shared border between adjacent items.\n      { variant: \"outline\", shape: \"middle\", class: \"border-l-0\" },\n      { variant: \"outline\", shape: \"right\", class: \"border-l-0\" },\n    ],\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** A two-state button that can be toggled on or off, built on Radix Toggle. */\nfunction Toggle({\n  className,\n  variant,\n  size,\n  shape,\n  ...props\n}: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive.Root\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, shape, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n"],"mappings":";;;;;AAMA,MAAM,kBAAA,qCAAA,EAAA,KACJ,uiBACA;CACE,UAAU;;EAER,SAAS;GACP,SAAS;GACT,SAAS;EACX;;EAEA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;EACN;EAIA,OAAO;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN,QAAQ;GACR,OAAO;EACT;CACF;CACA,kBAAkB,CAEhB;EAAE,SAAS;EAAW,OAAO;EAAU,OAAO;CAAa,GAC3D;EAAE,SAAS;EAAW,OAAO;EAAS,OAAO;CAAa,CAC5D;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;CACT;AACF,CACF;;AAGA,SAAS,OAAO,EACd,WACA,SACA,MACA,OACA,GAAG,SACuF;CAC1F,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,OAAgB,MAAjB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,eAAe;GAAE;GAAS;GAAM;GAAO;EAAU,CAAC,CAAC;EACjE,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.cjs","names":["TogglePrimitive","cn"],"sources":["../../../src/primitives/Toggle/Toggle.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { Toggle as TogglePrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/* Figma: PS AI Helix – Core → Toggle & Toggle Group (274:53016). Active state\n   is bg/interaction/toggle-active; Figma defines no hover state, so hover keeps\n   the subtle ghost tint. */\nconst toggleVariants = cva(\n  \"inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer text-primary-txt hover:bg-ghost-hover-bg disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-toggle-active-bg [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:ring-focus focus-visible:ring-3 outline-none transition-[color,box-shadow] aria-invalid:ring-focus-error aria-invalid:border-danger-border whitespace-nowrap\",\n  {\n    variants: {\n      /** Visual style: `default` (transparent/ghost) or `outline` (bordered). */\n      variant: {\n        default: \"bg-ghost-bg\",\n        outline: \"border border-primary-border bg-ghost-bg\",\n      },\n      /** Control size: `xs` (Mini 24), `sm` (32), `default` (36), or `lg` (40). */\n      size: {\n        xs: \"h-6 px-1 min-w-6\",\n        sm: \"h-8 px-2 min-w-8\",\n        default: \"h-9 px-2 min-w-9\",\n        lg: \"h-10 px-2 min-w-10\",\n      },\n      // Shape (Figma): `default` (8px) and `round` (pill) are standalone\n      // shapes; `left`/`middle`/`right` join into a segmented group, rounding\n      // only the outer edge.\n      shape: {\n        default: \"rounded-8\",\n        round: \"rounded-full\",\n        left: \"rounded-l-8 rounded-r-none\",\n        middle: \"rounded-none\",\n        right: \"rounded-r-8 rounded-l-none\",\n      },\n    },\n    compoundVariants: [\n      // Outlined segments collapse the shared border between adjacent items.\n      { variant: \"outline\", shape: \"middle\", class: \"border-l-0\" },\n      { variant: \"outline\", shape: \"right\", class: \"border-l-0\" },\n    ],\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** A two-state button that can be toggled on or off, built on Radix Toggle. */\nfunction Toggle({\n  className,\n  variant,\n  size,\n  shape,\n  ...props\n}: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive.Root\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, shape, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n"],"mappings":";;;;;AASA,MAAM,kBAAA,qCAAA,EAAA,KACJ,2eACA;CACE,UAAU;;EAER,SAAS;GACP,SAAS;GACT,SAAS;EACX;;EAEA,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;EACN;EAIA,OAAO;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN,QAAQ;GACR,OAAO;EACT;CACF;CACA,kBAAkB,CAEhB;EAAE,SAAS;EAAW,OAAO;EAAU,OAAO;CAAa,GAC3D;EAAE,SAAS;EAAW,OAAO;EAAS,OAAO;CAAa,CAC5D;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;CACT;AACF,CACF;;AAGA,SAAS,OAAO,EACd,WACA,SACA,MACA,OACA,GAAG,SACuF;CAC1F,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,OAAgB,MAAjB;EACE,aAAU;EACV,WAAWC,WAAAA,GAAG,eAAe;GAAE;GAAS;GAAM;GAAO;EAAU,CAAC,CAAC;EACjE,GAAI;CACL,CAAA;AAEL"}

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

@@ -1,2 +1,2 @@
-import { n as toggleVariants, t as Toggle } from "../../index63.cjs";
+import { n as toggleVariants, t as Toggle } from "../../index64.cjs";
 export { Toggle, toggleVariants };

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

@@ -1,2 +1,2 @@
-import { n as toggleVariants, t as Toggle } from "../../index63.js";
+import { n as toggleVariants, t as Toggle } from "../../index64.js";
 export { Toggle, toggleVariants };

package/dist/primitives/Toggle/index.js

@@ -3,25 +3,26 @@ import { Toggle as Toggle$1 } from "radix-ui";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/primitives/Toggle/Toggle.tsx
-const toggleVariants = cva("inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-ring-error aria-invalid:border-destructive whitespace-nowrap", {
+const toggleVariants = cva("inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer text-primary-txt hover:bg-ghost-hover-bg disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-toggle-active-bg [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:ring-focus focus-visible:ring-3 outline-none transition-[color,box-shadow] aria-invalid:ring-focus-error aria-invalid:border-danger-border whitespace-nowrap", {
 	variants: {
-		/** Visual style: `default` (transparent) or `outline` (bordered). */
+		/** Visual style: `default` (transparent/ghost) or `outline` (bordered). */
 		variant: {
-			default: "bg-transparent",
-			outline: "border border-border bg-transparent hover:bg-accent hover:text-accent-foreground"
+			default: "bg-ghost-bg",
+			outline: "border border-primary-border bg-ghost-bg"
 		},
-		/** Control size: `sm`, `default`, or `lg`. */
+		/** Control size: `xs` (Mini 24), `sm` (32), `default` (36), or `lg` (40). */
 		size: {
+			xs: "h-6 px-1 min-w-6",
+			sm: "h-8 px-2 min-w-8",
 			default: "h-9 px-2 min-w-9",
-			sm: "h-8 px-1.5 min-w-8",
-			lg: "h-10 px-2.5 min-w-10"
+			lg: "h-10 px-2 min-w-10"
 		},
 		shape: {
-			default: "rounded-md",
+			default: "rounded-8",
 			round: "rounded-full",
-			left: "rounded-l-md rounded-r-none",
+			left: "rounded-l-8 rounded-r-none",
 			middle: "rounded-none",
-			right: "rounded-r-md rounded-l-none"
+			right: "rounded-r-8 rounded-l-none"
 		}
 	},
 	compoundVariants: [{

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["TogglePrimitive"],"sources":["../../../src/primitives/Toggle/Toggle.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { Toggle as TogglePrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\nconst toggleVariants = cva(\n  \"inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-ring-error aria-invalid:border-destructive whitespace-nowrap\",\n  {\n    variants: {\n      /** Visual style: `default` (transparent) or `outline` (bordered). */\n      variant: {\n        default: \"bg-transparent\",\n        outline: \"border border-border bg-transparent hover:bg-accent hover:text-accent-foreground\",\n      },\n      /** Control size: `sm`, `default`, or `lg`. */\n      size: {\n        default: \"h-9 px-2 min-w-9\",\n        sm: \"h-8 px-1.5 min-w-8\",\n        lg: \"h-10 px-2.5 min-w-10\",\n      },\n      // Shape (Figma): `default` (rounded-md) and `round` (pill) are standalone\n      // shapes; `left`/`middle`/`right` join into a segmented group, rounding\n      // only the outer edge.\n      shape: {\n        default: \"rounded-md\",\n        round: \"rounded-full\",\n        left: \"rounded-l-md rounded-r-none\",\n        middle: \"rounded-none\",\n        right: \"rounded-r-md rounded-l-none\",\n      },\n    },\n    compoundVariants: [\n      // Outlined segments collapse the shared border between adjacent items.\n      { variant: \"outline\", shape: \"middle\", class: \"border-l-0\" },\n      { variant: \"outline\", shape: \"right\", class: \"border-l-0\" },\n    ],\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** A two-state button that can be toggled on or off, built on Radix Toggle. */\nfunction Toggle({\n  className,\n  variant,\n  size,\n  shape,\n  ...props\n}: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive.Root\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, shape, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n"],"mappings":";;;;;AAMA,MAAM,iBAAiB,IACrB,uiBACA;CACE,UAAU;;EAER,SAAS;GACP,SAAS;GACT,SAAS;EACX;;EAEA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;EACN;EAIA,OAAO;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN,QAAQ;GACR,OAAO;EACT;CACF;CACA,kBAAkB,CAEhB;EAAE,SAAS;EAAW,OAAO;EAAU,OAAO;CAAa,GAC3D;EAAE,SAAS;EAAW,OAAO;EAAS,OAAO;CAAa,CAC5D;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;CACT;AACF,CACF;;AAGA,SAAS,OAAO,EACd,WACA,SACA,MACA,OACA,GAAG,SACuF;CAC1F,OACE,oBAACA,SAAgB,MAAjB;EACE,aAAU;EACV,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAO;EAAU,CAAC,CAAC;EACjE,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"index.js","names":["TogglePrimitive"],"sources":["../../../src/primitives/Toggle/Toggle.tsx"],"sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { Toggle as TogglePrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/* Figma: PS AI Helix – Core → Toggle & Toggle Group (274:53016). Active state\n   is bg/interaction/toggle-active; Figma defines no hover state, so hover keeps\n   the subtle ghost tint. */\nconst toggleVariants = cva(\n  \"inline-flex items-center justify-center gap-2 text-sm font-medium cursor-pointer text-primary-txt hover:bg-ghost-hover-bg disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=on]:bg-toggle-active-bg [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:ring-focus focus-visible:ring-3 outline-none transition-[color,box-shadow] aria-invalid:ring-focus-error aria-invalid:border-danger-border whitespace-nowrap\",\n  {\n    variants: {\n      /** Visual style: `default` (transparent/ghost) or `outline` (bordered). */\n      variant: {\n        default: \"bg-ghost-bg\",\n        outline: \"border border-primary-border bg-ghost-bg\",\n      },\n      /** Control size: `xs` (Mini 24), `sm` (32), `default` (36), or `lg` (40). */\n      size: {\n        xs: \"h-6 px-1 min-w-6\",\n        sm: \"h-8 px-2 min-w-8\",\n        default: \"h-9 px-2 min-w-9\",\n        lg: \"h-10 px-2 min-w-10\",\n      },\n      // Shape (Figma): `default` (8px) and `round` (pill) are standalone\n      // shapes; `left`/`middle`/`right` join into a segmented group, rounding\n      // only the outer edge.\n      shape: {\n        default: \"rounded-8\",\n        round: \"rounded-full\",\n        left: \"rounded-l-8 rounded-r-none\",\n        middle: \"rounded-none\",\n        right: \"rounded-r-8 rounded-l-none\",\n      },\n    },\n    compoundVariants: [\n      // Outlined segments collapse the shared border between adjacent items.\n      { variant: \"outline\", shape: \"middle\", class: \"border-l-0\" },\n      { variant: \"outline\", shape: \"right\", class: \"border-l-0\" },\n    ],\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n      shape: \"default\",\n    },\n  },\n);\n\n/** A two-state button that can be toggled on or off, built on Radix Toggle. */\nfunction Toggle({\n  className,\n  variant,\n  size,\n  shape,\n  ...props\n}: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive.Root\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size, shape, className }))}\n      {...props}\n    />\n  );\n}\n\nexport { Toggle, toggleVariants };\n"],"mappings":";;;;;AASA,MAAM,iBAAiB,IACrB,2eACA;CACE,UAAU;;EAER,SAAS;GACP,SAAS;GACT,SAAS;EACX;;EAEA,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,IAAI;EACN;EAIA,OAAO;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN,QAAQ;GACR,OAAO;EACT;CACF;CACA,kBAAkB,CAEhB;EAAE,SAAS;EAAW,OAAO;EAAU,OAAO;CAAa,GAC3D;EAAE,SAAS;EAAW,OAAO;EAAS,OAAO;CAAa,CAC5D;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;EACN,OAAO;CACT;AACF,CACF;;AAGA,SAAS,OAAO,EACd,WACA,SACA,MACA,OACA,GAAG,SACuF;CAC1F,OACE,oBAACA,SAAgB,MAAjB;EACE,aAAU;EACV,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;GAAO;EAAU,CAAC,CAAC;EACjE,GAAI;CACL,CAAA;AAEL"}

package/dist/primitives/ToggleGroup/index.cjs

@@ -26,7 +26,7 @@ function ToggleGroup({ className, variant, size, radius = "default", spacing = 0
 		"data-radius": radius,
 		"data-spacing": spacing,
 		style: { "--gap": spacing },
-		className: require_cn.cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs", className),
+		className: require_cn.cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-8", className),
 		...props,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleGroupContext.Provider, {
 			value: {
@@ -53,7 +53,7 @@ function ToggleGroupItem({ className, children, variant, size, radius, ...props
 			variant: context.variant || variant,
 			size: context.size || size,
 			shape: itemRadius === "round" ? "round" : "default"
-		}), "w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none", "data-[spacing=0]:data-[radius=default]:first:rounded-l-md data-[spacing=0]:data-[radius=default]:last:rounded-r-md", "data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full", "data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l", className),
+		}), "w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none", "data-[spacing=0]:data-[radius=default]:first:rounded-l-8 data-[spacing=0]:data-[radius=default]:last:rounded-r-8", "data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full", "data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l", className),
 		...props,
 		children
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["React","ToggleGroupPrimitive","cn","toggleVariants"],"sources":["../../../src/primitives/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport type { VariantProps } from \"class-variance-authority\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\";\nimport * as React from \"react\";\n\nimport { toggleVariants } from \"@/primitives/Toggle\";\nimport { cn } from \"@/utils\";\n\n// The group owns a `radius` (default/round) for its outer corners and segmented\n// borders; individual items derive their `shape` from it (see ToggleGroupItem).\ntype ToggleGroupRadius = \"default\" | \"round\";\n\nconst ToggleGroupContext = React.createContext<\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  radius: \"default\",\n  spacing: 0,\n});\n\n/**\n * A set of two-state buttons where one (`type=\"single\"`) or many\n * (`type=\"multiple\"`) can be pressed. Built on Radix ToggleGroup; items inherit\n * `variant`/`size`/`radius` via context.\n */\nfunction ToggleGroup({\n  className,\n  /** Visual style applied to every item: `default` (transparent) or `outline` (bordered). */\n  variant,\n  /** Control size applied to every item: `sm`, `default`, or `lg`. */\n  size,\n  // Must default here (not just in createContext): the Provider below always\n  // supplies a value, so an undefined radius would reach the items and drop the\n  // `data-radius` attribute the first/last rounding selectors depend on.\n  /** Outer corner shape of the group: `default` (rounded-md) or `round` (pill). */\n  radius = \"default\",\n  /** Gap (in spacing units) between items; `0` collapses them into one segmented control. */\n  spacing = 0,\n  /** The `ToggleGroupItem` elements that make up the group. */\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-radius={radius}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, radius, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single toggle button inside a `ToggleGroup`. Identified by its required `value`. */\nfunction ToggleGroupItem({\n  className,\n  /** The item's label/content (text, icon, etc.). */\n  children,\n  /** Fallback visual style when not provided by the group context. */\n  variant,\n  /** Fallback control size when not provided by the group context. */\n  size,\n  /** Fallback corner shape when not provided by the group context. */\n  radius,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n  }) {\n  const context = React.useContext(ToggleGroupContext);\n  const itemRadius = context.radius || radius;\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-radius={itemRadius}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n          // The item's full-rounding amount; collapsed groups (spacing 0) override\n          // corners via the data-attribute classes below.\n          shape: itemRadius === \"round\" ? \"round\" : \"default\",\n        }),\n        \"w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10\",\n        // Collapsed (spacing 0): square inner corners, rounded outer edges per radius.\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none\",\n        \"data-[spacing=0]:data-[radius=default]:first:rounded-l-md data-[spacing=0]:data-[radius=default]:last:rounded-r-md\",\n        \"data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full\",\n        \"data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":";;;;;;;;;AAaA,MAAM,qBAAqBA,MAAM,cAK/B;CACA,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;AACX,CAAC;;;;;;AAOD,SAAS,YAAY,EACnB,WAEA,SAEA,MAKA,SAAS,WAET,UAAU,GAEV,UACA,GAAG,SAKA;CACH,OACE,iBAAA,GAAA,kBAAA,KAACC,SAAAA,YAAqB,MAAtB;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,eAAa;EACb,gBAAc;EACd,OAAO,EAAE,SAAS,QAAQ;EAC1B,WAAWC,WAAAA,GACT,6IACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;GAAQ;GAClE;EAC0B,CAAA;CACJ,CAAA;AAE/B;;AAGA,SAAS,gBAAgB,EACvB,WAEA,UAEA,SAEA,MAEA,QACA,GAAG,SAIA;CACH,MAAM,UAAUF,MAAM,WAAW,kBAAkB;CACnD,MAAM,aAAa,QAAQ,UAAU;CAErC,OACE,iBAAA,GAAA,kBAAA,KAACC,SAAAA,YAAqB,MAAtB;EACE,aAAU;EACV,gBAAc,QAAQ,WAAW;EACjC,aAAW,QAAQ,QAAQ;EAC3B,eAAa;EACb,gBAAc,QAAQ;EACtB,WAAWC,WAAAA,GACTC,gCAAAA,eAAe;GACb,SAAS,QAAQ,WAAW;GAC5B,MAAM,QAAQ,QAAQ;GAGtB,OAAO,eAAe,UAAU,UAAU;EAC5C,CAAC,GACD,yDAEA,8DACA,sHACA,sHACA,6GACA,SACF;EACA,GAAI;EAEH;CACwB,CAAA;AAE/B"}
+{"version":3,"file":"index.cjs","names":["React","ToggleGroupPrimitive","cn","toggleVariants"],"sources":["../../../src/primitives/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport type { VariantProps } from \"class-variance-authority\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\";\nimport * as React from \"react\";\n\nimport { toggleVariants } from \"@/primitives/Toggle\";\nimport { cn } from \"@/utils\";\n\n// The group owns a `radius` (default/round) for its outer corners and segmented\n// borders; individual items derive their `shape` from it (see ToggleGroupItem).\ntype ToggleGroupRadius = \"default\" | \"round\";\n\nconst ToggleGroupContext = React.createContext<\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  radius: \"default\",\n  spacing: 0,\n});\n\n/**\n * A set of two-state buttons where one (`type=\"single\"`) or many\n * (`type=\"multiple\"`) can be pressed. Built on Radix ToggleGroup; items inherit\n * `variant`/`size`/`radius` via context.\n */\nfunction ToggleGroup({\n  className,\n  /** Visual style applied to every item: `default` (transparent) or `outline` (bordered). */\n  variant,\n  /** Control size applied to every item: `sm`, `default`, or `lg`. */\n  size,\n  // Must default here (not just in createContext): the Provider below always\n  // supplies a value, so an undefined radius would reach the items and drop the\n  // `data-radius` attribute the first/last rounding selectors depend on.\n  /** Outer corner shape of the group: `default` (8px) or `round` (pill). */\n  radius = \"default\",\n  /** Gap (in spacing units) between items; `0` collapses them into one segmented control. */\n  spacing = 0,\n  /** The `ToggleGroupItem` elements that make up the group. */\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-radius={radius}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-8\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, radius, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single toggle button inside a `ToggleGroup`. Identified by its required `value`. */\nfunction ToggleGroupItem({\n  className,\n  /** The item's label/content (text, icon, etc.). */\n  children,\n  /** Fallback visual style when not provided by the group context. */\n  variant,\n  /** Fallback control size when not provided by the group context. */\n  size,\n  /** Fallback corner shape when not provided by the group context. */\n  radius,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n  }) {\n  const context = React.useContext(ToggleGroupContext);\n  const itemRadius = context.radius || radius;\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-radius={itemRadius}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n          // The item's full-rounding amount; collapsed groups (spacing 0) override\n          // corners via the data-attribute classes below.\n          shape: itemRadius === \"round\" ? \"round\" : \"default\",\n        }),\n        \"w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10\",\n        // Collapsed (spacing 0): square inner corners, rounded outer edges per radius.\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none\",\n        \"data-[spacing=0]:data-[radius=default]:first:rounded-l-8 data-[spacing=0]:data-[radius=default]:last:rounded-r-8\",\n        \"data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full\",\n        \"data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":";;;;;;;;;AAaA,MAAM,qBAAqBA,MAAM,cAK/B;CACA,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;AACX,CAAC;;;;;;AAOD,SAAS,YAAY,EACnB,WAEA,SAEA,MAKA,SAAS,WAET,UAAU,GAEV,UACA,GAAG,SAKA;CACH,OACE,iBAAA,GAAA,kBAAA,KAACC,SAAAA,YAAqB,MAAtB;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,eAAa;EACb,gBAAc;EACd,OAAO,EAAE,SAAS,QAAQ;EAC1B,WAAWC,WAAAA,GACT,oFACA,SACF;EACA,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;GAAQ;GAClE;EAC0B,CAAA;CACJ,CAAA;AAE/B;;AAGA,SAAS,gBAAgB,EACvB,WAEA,UAEA,SAEA,MAEA,QACA,GAAG,SAIA;CACH,MAAM,UAAUF,MAAM,WAAW,kBAAkB;CACnD,MAAM,aAAa,QAAQ,UAAU;CAErC,OACE,iBAAA,GAAA,kBAAA,KAACC,SAAAA,YAAqB,MAAtB;EACE,aAAU;EACV,gBAAc,QAAQ,WAAW;EACjC,aAAW,QAAQ,QAAQ;EAC3B,eAAa;EACb,gBAAc,QAAQ;EACtB,WAAWC,WAAAA,GACTC,gCAAAA,eAAe;GACb,SAAS,QAAQ,WAAW;GAC5B,MAAM,QAAQ,QAAQ;GAGtB,OAAO,eAAe,UAAU,UAAU;EAC5C,CAAC,GACD,yDAEA,8DACA,oHACA,sHACA,6GACA,SACF;EACA,GAAI;EAEH;CACwB,CAAA;AAE/B"}

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

@@ -1,2 +1,2 @@
-import { n as ToggleGroupItem, t as ToggleGroup } from "../../index64.cjs";
+import { n as ToggleGroupItem, t as ToggleGroup } from "../../index65.cjs";
 export { ToggleGroup, ToggleGroupItem };

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

@@ -1,2 +1,2 @@
-import { n as ToggleGroupItem, t as ToggleGroup } from "../../index64.js";
+import { n as ToggleGroupItem, t as ToggleGroup } from "../../index65.js";
 export { ToggleGroup, ToggleGroupItem };

package/dist/primitives/ToggleGroup/index.js

@@ -23,7 +23,7 @@ function ToggleGroup({ className, variant, size, radius = "default", spacing = 0
 		"data-radius": radius,
 		"data-spacing": spacing,
 		style: { "--gap": spacing },
-		className: cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs", className),
+		className: cn("group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-8", className),
 		...props,
 		children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, {
 			value: {
@@ -50,7 +50,7 @@ function ToggleGroupItem({ className, children, variant, size, radius, ...props
 			variant: context.variant || variant,
 			size: context.size || size,
 			shape: itemRadius === "round" ? "round" : "default"
-		}), "w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none", "data-[spacing=0]:data-[radius=default]:first:rounded-l-md data-[spacing=0]:data-[radius=default]:last:rounded-r-md", "data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full", "data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l", className),
+		}), "w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10", "data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none", "data-[spacing=0]:data-[radius=default]:first:rounded-l-8 data-[spacing=0]:data-[radius=default]:last:rounded-r-8", "data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full", "data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l", className),
 		...props,
 		children
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ToggleGroupPrimitive"],"sources":["../../../src/primitives/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport type { VariantProps } from \"class-variance-authority\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\";\nimport * as React from \"react\";\n\nimport { toggleVariants } from \"@/primitives/Toggle\";\nimport { cn } from \"@/utils\";\n\n// The group owns a `radius` (default/round) for its outer corners and segmented\n// borders; individual items derive their `shape` from it (see ToggleGroupItem).\ntype ToggleGroupRadius = \"default\" | \"round\";\n\nconst ToggleGroupContext = React.createContext<\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  radius: \"default\",\n  spacing: 0,\n});\n\n/**\n * A set of two-state buttons where one (`type=\"single\"`) or many\n * (`type=\"multiple\"`) can be pressed. Built on Radix ToggleGroup; items inherit\n * `variant`/`size`/`radius` via context.\n */\nfunction ToggleGroup({\n  className,\n  /** Visual style applied to every item: `default` (transparent) or `outline` (bordered). */\n  variant,\n  /** Control size applied to every item: `sm`, `default`, or `lg`. */\n  size,\n  // Must default here (not just in createContext): the Provider below always\n  // supplies a value, so an undefined radius would reach the items and drop the\n  // `data-radius` attribute the first/last rounding selectors depend on.\n  /** Outer corner shape of the group: `default` (rounded-md) or `round` (pill). */\n  radius = \"default\",\n  /** Gap (in spacing units) between items; `0` collapses them into one segmented control. */\n  spacing = 0,\n  /** The `ToggleGroupItem` elements that make up the group. */\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-radius={radius}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-md data-[spacing=default]:data-[variant=outline]:shadow-xs\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, radius, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single toggle button inside a `ToggleGroup`. Identified by its required `value`. */\nfunction ToggleGroupItem({\n  className,\n  /** The item's label/content (text, icon, etc.). */\n  children,\n  /** Fallback visual style when not provided by the group context. */\n  variant,\n  /** Fallback control size when not provided by the group context. */\n  size,\n  /** Fallback corner shape when not provided by the group context. */\n  radius,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n  }) {\n  const context = React.useContext(ToggleGroupContext);\n  const itemRadius = context.radius || radius;\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-radius={itemRadius}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n          // The item's full-rounding amount; collapsed groups (spacing 0) override\n          // corners via the data-attribute classes below.\n          shape: itemRadius === \"round\" ? \"round\" : \"default\",\n        }),\n        \"w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10\",\n        // Collapsed (spacing 0): square inner corners, rounded outer edges per radius.\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none\",\n        \"data-[spacing=0]:data-[radius=default]:first:rounded-l-md data-[spacing=0]:data-[radius=default]:last:rounded-r-md\",\n        \"data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full\",\n        \"data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":";;;;;;AAaA,MAAM,qBAAqB,MAAM,cAK/B;CACA,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;AACX,CAAC;;;;;;AAOD,SAAS,YAAY,EACnB,WAEA,SAEA,MAKA,SAAS,WAET,UAAU,GAEV,UACA,GAAG,SAKA;CACH,OACE,oBAACA,cAAqB,MAAtB;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,eAAa;EACb,gBAAc;EACd,OAAO,EAAE,SAAS,QAAQ;EAC1B,WAAW,GACT,6IACA,SACF;EACA,GAAI;YAEJ,oBAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;GAAQ;GAClE;EAC0B,CAAA;CACJ,CAAA;AAE/B;;AAGA,SAAS,gBAAgB,EACvB,WAEA,UAEA,SAEA,MAEA,QACA,GAAG,SAIA;CACH,MAAM,UAAU,MAAM,WAAW,kBAAkB;CACnD,MAAM,aAAa,QAAQ,UAAU;CAErC,OACE,oBAACA,cAAqB,MAAtB;EACE,aAAU;EACV,gBAAc,QAAQ,WAAW;EACjC,aAAW,QAAQ,QAAQ;EAC3B,eAAa;EACb,gBAAc,QAAQ;EACtB,WAAW,GACT,eAAe;GACb,SAAS,QAAQ,WAAW;GAC5B,MAAM,QAAQ,QAAQ;GAGtB,OAAO,eAAe,UAAU,UAAU;EAC5C,CAAC,GACD,yDAEA,8DACA,sHACA,sHACA,6GACA,SACF;EACA,GAAI;EAEH;CACwB,CAAA;AAE/B"}
+{"version":3,"file":"index.js","names":["ToggleGroupPrimitive"],"sources":["../../../src/primitives/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["\"use client\";\n\nimport type { VariantProps } from \"class-variance-authority\";\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\";\nimport * as React from \"react\";\n\nimport { toggleVariants } from \"@/primitives/Toggle\";\nimport { cn } from \"@/utils\";\n\n// The group owns a `radius` (default/round) for its outer corners and segmented\n// borders; individual items derive their `shape` from it (see ToggleGroupItem).\ntype ToggleGroupRadius = \"default\" | \"round\";\n\nconst ToggleGroupContext = React.createContext<\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  radius: \"default\",\n  spacing: 0,\n});\n\n/**\n * A set of two-state buttons where one (`type=\"single\"`) or many\n * (`type=\"multiple\"`) can be pressed. Built on Radix ToggleGroup; items inherit\n * `variant`/`size`/`radius` via context.\n */\nfunction ToggleGroup({\n  className,\n  /** Visual style applied to every item: `default` (transparent) or `outline` (bordered). */\n  variant,\n  /** Control size applied to every item: `sm`, `default`, or `lg`. */\n  size,\n  // Must default here (not just in createContext): the Provider below always\n  // supplies a value, so an undefined radius would reach the items and drop the\n  // `data-radius` attribute the first/last rounding selectors depend on.\n  /** Outer corner shape of the group: `default` (8px) or `round` (pill). */\n  radius = \"default\",\n  /** Gap (in spacing units) between items; `0` collapses them into one segmented control. */\n  spacing = 0,\n  /** The `ToggleGroupItem` elements that make up the group. */\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n    spacing?: number;\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-radius={radius}\n      data-spacing={spacing}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        \"group/toggle-group flex w-fit items-center gap-[--spacing(var(--gap))] rounded-8\",\n        className,\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider value={{ variant, size, radius, spacing }}>\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  );\n}\n\n/** A single toggle button inside a `ToggleGroup`. Identified by its required `value`. */\nfunction ToggleGroupItem({\n  className,\n  /** The item's label/content (text, icon, etc.). */\n  children,\n  /** Fallback visual style when not provided by the group context. */\n  variant,\n  /** Fallback control size when not provided by the group context. */\n  size,\n  /** Fallback corner shape when not provided by the group context. */\n  radius,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  Omit<VariantProps<typeof toggleVariants>, \"shape\"> & {\n    radius?: ToggleGroupRadius;\n  }) {\n  const context = React.useContext(ToggleGroupContext);\n  const itemRadius = context.radius || radius;\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={context.variant || variant}\n      data-size={context.size || size}\n      data-radius={itemRadius}\n      data-spacing={context.spacing}\n      className={cn(\n        toggleVariants({\n          variant: context.variant || variant,\n          size: context.size || size,\n          // The item's full-rounding amount; collapsed groups (spacing 0) override\n          // corners via the data-attribute classes below.\n          shape: itemRadius === \"round\" ? \"round\" : \"default\",\n        }),\n        \"w-auto min-w-0 shrink-0 focus:z-10 focus-visible:z-10\",\n        // Collapsed (spacing 0): square inner corners, rounded outer edges per radius.\n        \"data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none\",\n        \"data-[spacing=0]:data-[radius=default]:first:rounded-l-8 data-[spacing=0]:data-[radius=default]:last:rounded-r-8\",\n        \"data-[spacing=0]:data-[radius=round]:first:rounded-l-full data-[spacing=0]:data-[radius=round]:last:rounded-r-full\",\n        \"data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  );\n}\n\nexport { ToggleGroup, ToggleGroupItem };\n"],"mappings":";;;;;;AAaA,MAAM,qBAAqB,MAAM,cAK/B;CACA,MAAM;CACN,SAAS;CACT,QAAQ;CACR,SAAS;AACX,CAAC;;;;;;AAOD,SAAS,YAAY,EACnB,WAEA,SAEA,MAKA,SAAS,WAET,UAAU,GAEV,UACA,GAAG,SAKA;CACH,OACE,oBAACA,cAAqB,MAAtB;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,eAAa;EACb,gBAAc;EACd,OAAO,EAAE,SAAS,QAAQ;EAC1B,WAAW,GACT,oFACA,SACF;EACA,GAAI;YAEJ,oBAAC,mBAAmB,UAApB;GAA6B,OAAO;IAAE;IAAS;IAAM;IAAQ;GAAQ;GAClE;EAC0B,CAAA;CACJ,CAAA;AAE/B;;AAGA,SAAS,gBAAgB,EACvB,WAEA,UAEA,SAEA,MAEA,QACA,GAAG,SAIA;CACH,MAAM,UAAU,MAAM,WAAW,kBAAkB;CACnD,MAAM,aAAa,QAAQ,UAAU;CAErC,OACE,oBAACA,cAAqB,MAAtB;EACE,aAAU;EACV,gBAAc,QAAQ,WAAW;EACjC,aAAW,QAAQ,QAAQ;EAC3B,eAAa;EACb,gBAAc,QAAQ;EACtB,WAAW,GACT,eAAe;GACb,SAAS,QAAQ,WAAW;GAC5B,MAAM,QAAQ,QAAQ;GAGtB,OAAO,eAAe,UAAU,UAAU;EAC5C,CAAC,GACD,yDAEA,8DACA,oHACA,sHACA,6GACA,SACF;EACA,GAAI;EAEH;CACwB,CAAA;AAE/B"}

package/dist/primitives/Tooltip/index.cjs

@@ -30,11 +30,11 @@ function TooltipContent({ className, sideOffset = 0, children, ...props }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tooltip.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(radix_ui.Tooltip.Content, {
 		"data-slot": "tooltip-content",
 		sideOffset,
-		className: require_cn.cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-lg bg-inverse px-3 py-1.5 text-xs text-balance text-inverse-foreground fade-in-0 zoom-in-95 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", className),
+		className: require_cn.cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-8 bg-primary-invert-bg px-2 py-1.5 text-xs leading-4 text-balance text-primary-invert-txt fade-in-0 zoom-in-95 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", className),
 		...props,
 		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(radix_ui.Tooltip.Arrow, {
 			"data-slot": "tooltip-arrow",
-			className: "z-50 size-2.5 fill-inverse"
+			className: "z-50 h-1.25 w-2.5 fill-primary-invert-bg"
 		})]
 	}) });
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["TooltipPrimitive","cn"],"sources":["../../../src/primitives/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Provides shared tooltip context (delay/skip timings) to all tooltips inside it. */\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\n/** Root tooltip: wraps a trigger + content and manages open state. Self-provides a TooltipProvider. */\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\n/** The element that opens the tooltip on hover/focus. Use `asChild` to render your own control. */\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\n/** The floating tooltip surface (portalled) with an arrow; carries the tooltip text. */\nfunction TooltipContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Gap in px between the trigger and the content. Defaults to 0. */\n  sideOffset = 0,\n  /** Tooltip body content. */\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          \"z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-lg bg-inverse px-3 py-1.5 text-xs text-balance text-inverse-foreground fade-in-0 zoom-in-95 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\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow data-slot=\"tooltip-arrow\" className=\"z-50 size-2.5 fill-inverse\" />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"mappings":";;;;;;AAMA,SAAS,gBAAgB,EACvB,gBAAgB,GAChB,GAAG,SACsD;CACzD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,UAAlB;EACE,aAAU;EACK;EACf,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OACE,iBAAA,GAAA,kBAAA,KAAC,iBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA,EACxC,CAAA;AAErB;;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,aAAa,GAEb,UACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,QAAiB,SAAlB;EACE,aAAU;EACE;EACZ,WAAWC,WAAAA,GACT,0aACA,SACF;EACA,GAAI;YAPN,CASG,UACD,iBAAA,GAAA,kBAAA,KAACD,SAAAA,QAAiB,OAAlB;GAAwB,aAAU;GAAgB,WAAU;EAA8B,CAAA,CAClE;IACH,CAAA;AAE7B"}
+{"version":3,"file":"index.cjs","names":["TooltipPrimitive","cn"],"sources":["../../../src/primitives/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Provides shared tooltip context (delay/skip timings) to all tooltips inside it. */\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\n/** Root tooltip: wraps a trigger + content and manages open state. Self-provides a TooltipProvider. */\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\n/** The element that opens the tooltip on hover/focus. Use `asChild` to render your own control. */\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\n/** The floating tooltip surface (portalled) with an arrow; carries the tooltip text. */\nfunction TooltipContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Gap in px between the trigger and the content. Defaults to 0. */\n  sideOffset = 0,\n  /** Tooltip body content. */\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          // Figma: inverted pill — bg/primary-invert surface, mini 12/16 type.\n          \"z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-8 bg-primary-invert-bg px-2 py-1.5 text-xs leading-4 text-balance text-primary-invert-txt fade-in-0 zoom-in-95 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\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow\n          data-slot=\"tooltip-arrow\"\n          className=\"z-50 h-1.25 w-2.5 fill-primary-invert-bg\"\n        />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"mappings":";;;;;;AAMA,SAAS,gBAAgB,EACvB,gBAAgB,GAChB,GAAG,SACsD;CACzD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,UAAlB;EACE,aAAU;EACK;EACf,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OACE,iBAAA,GAAA,kBAAA,KAAC,iBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA,EACxC,CAAA;AAErB;;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,aAAa,GAEb,UACA,GAAG,SACqD;CACxD,OACE,iBAAA,GAAA,kBAAA,KAACA,SAAAA,QAAiB,QAAlB,EAAA,UACE,iBAAA,GAAA,kBAAA,MAACA,SAAAA,QAAiB,SAAlB;EACE,aAAU;EACE;EACZ,WAAWC,WAAAA,GAET,6bACA,SACF;EACA,GAAI;YARN,CAUG,UACD,iBAAA,GAAA,kBAAA,KAACD,SAAAA,QAAiB,OAAlB;GACE,aAAU;GACV,WAAU;EACX,CAAA,CACuB;IACH,CAAA;AAE7B"}

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

@@ -1,2 +1,2 @@
-import { i as TooltipTrigger, n as TooltipContent, r as TooltipProvider, t as Tooltip } from "../../index51.cjs";
+import { i as TooltipTrigger, n as TooltipContent, r as TooltipProvider, t as Tooltip } from "../../index52.cjs";
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

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

@@ -1,2 +1,2 @@
-import { i as TooltipTrigger, n as TooltipContent, r as TooltipProvider, t as Tooltip } from "../../index51.js";
+import { i as TooltipTrigger, n as TooltipContent, r as TooltipProvider, t as Tooltip } from "../../index52.js";
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/dist/primitives/Tooltip/index.js

@@ -29,11 +29,11 @@ function TooltipContent({ className, sideOffset = 0, children, ...props }) {
 	return /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsxs(Tooltip$1.Content, {
 		"data-slot": "tooltip-content",
 		sideOffset,
-		className: cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-lg bg-inverse px-3 py-1.5 text-xs text-balance text-inverse-foreground fade-in-0 zoom-in-95 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", className),
+		className: cn("z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-8 bg-primary-invert-bg px-2 py-1.5 text-xs leading-4 text-balance text-primary-invert-txt fade-in-0 zoom-in-95 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", className),
 		...props,
 		children: [children, /* @__PURE__ */ jsx(Tooltip$1.Arrow, {
 			"data-slot": "tooltip-arrow",
-			className: "z-50 size-2.5 fill-inverse"
+			className: "z-50 h-1.25 w-2.5 fill-primary-invert-bg"
 		})]
 	}) });
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["TooltipPrimitive"],"sources":["../../../src/primitives/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Provides shared tooltip context (delay/skip timings) to all tooltips inside it. */\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\n/** Root tooltip: wraps a trigger + content and manages open state. Self-provides a TooltipProvider. */\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\n/** The element that opens the tooltip on hover/focus. Use `asChild` to render your own control. */\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\n/** The floating tooltip surface (portalled) with an arrow; carries the tooltip text. */\nfunction TooltipContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Gap in px between the trigger and the content. Defaults to 0. */\n  sideOffset = 0,\n  /** Tooltip body content. */\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          \"z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-lg bg-inverse px-3 py-1.5 text-xs text-balance text-inverse-foreground fade-in-0 zoom-in-95 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\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow data-slot=\"tooltip-arrow\" className=\"z-50 size-2.5 fill-inverse\" />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"mappings":";;;;;AAMA,SAAS,gBAAgB,EACvB,gBAAgB,GAChB,GAAG,SACsD;CACzD,OACE,oBAACA,UAAiB,UAAlB;EACE,aAAU;EACK;EACf,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OACE,oBAAC,iBAAD,EAAA,UACE,oBAACA,UAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA,EACxC,CAAA;AAErB;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,oBAACA,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,aAAa,GAEb,UACA,GAAG,SACqD;CACxD,OACE,oBAACA,UAAiB,QAAlB,EAAA,UACE,qBAACA,UAAiB,SAAlB;EACE,aAAU;EACE;EACZ,WAAW,GACT,0aACA,SACF;EACA,GAAI;YAPN,CASG,UACD,oBAACA,UAAiB,OAAlB;GAAwB,aAAU;GAAgB,WAAU;EAA8B,CAAA,CAClE;IACH,CAAA;AAE7B"}
+{"version":3,"file":"index.js","names":["TooltipPrimitive"],"sources":["../../../src/primitives/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/utils\";\n\n/** Provides shared tooltip context (delay/skip timings) to all tooltips inside it. */\nfunction TooltipProvider({\n  delayDuration = 0,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {\n  return (\n    <TooltipPrimitive.Provider\n      data-slot=\"tooltip-provider\"\n      delayDuration={delayDuration}\n      {...props}\n    />\n  );\n}\n\n/** Root tooltip: wraps a trigger + content and manages open state. Self-provides a TooltipProvider. */\nfunction Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {\n  return (\n    <TooltipProvider>\n      <TooltipPrimitive.Root data-slot=\"tooltip\" {...props} />\n    </TooltipProvider>\n  );\n}\n\n/** The element that opens the tooltip on hover/focus. Use `asChild` to render your own control. */\nfunction TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />;\n}\n\n/** The floating tooltip surface (portalled) with an arrow; carries the tooltip text. */\nfunction TooltipContent({\n  /** Extra classes merged onto the content surface. */\n  className,\n  /** Gap in px between the trigger and the content. Defaults to 0. */\n  sideOffset = 0,\n  /** Tooltip body content. */\n  children,\n  ...props\n}: React.ComponentProps<typeof TooltipPrimitive.Content>) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Content\n        data-slot=\"tooltip-content\"\n        sideOffset={sideOffset}\n        className={cn(\n          // Figma: inverted pill — bg/primary-invert surface, mini 12/16 type.\n          \"z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-8 bg-primary-invert-bg px-2 py-1.5 text-xs leading-4 text-balance text-primary-invert-txt fade-in-0 zoom-in-95 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\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <TooltipPrimitive.Arrow\n          data-slot=\"tooltip-arrow\"\n          className=\"z-50 h-1.25 w-2.5 fill-primary-invert-bg\"\n        />\n      </TooltipPrimitive.Content>\n    </TooltipPrimitive.Portal>\n  );\n}\n\nexport { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };\n"],"mappings":";;;;;AAMA,SAAS,gBAAgB,EACvB,gBAAgB,GAChB,GAAG,SACsD;CACzD,OACE,oBAACA,UAAiB,UAAlB;EACE,aAAU;EACK;EACf,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,QAAQ,EAAE,GAAG,SAA6D;CACjF,OACE,oBAAC,iBAAD,EAAA,UACE,oBAACA,UAAiB,MAAlB;EAAuB,aAAU;EAAU,GAAI;CAAQ,CAAA,EACxC,CAAA;AAErB;;AAGA,SAAS,eAAe,EAAE,GAAG,SAAgE;CAC3F,OAAO,oBAACA,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;CAAQ,CAAA;AAC3E;;AAGA,SAAS,eAAe,EAEtB,WAEA,aAAa,GAEb,UACA,GAAG,SACqD;CACxD,OACE,oBAACA,UAAiB,QAAlB,EAAA,UACE,qBAACA,UAAiB,SAAlB;EACE,aAAU;EACE;EACZ,WAAW,GAET,6bACA,SACF;EACA,GAAI;YARN,CAUG,UACD,oBAACA,UAAiB,OAAlB;GACE,aAAU;GACV,WAAU;EACX,CAAA,CACuB;IACH,CAAA;AAE7B"}

package/dist/primitives/index.cjs

@@ -40,13 +40,12 @@ const require_primitives_Item_index = require("./Item/index.cjs");
 const require_primitives_Kbd_index = require("./Kbd/index.cjs");
 const require_primitives_Link_index = require("./Link/index.cjs");
 const require_Logo = require("../Logo.cjs");
-const require_primitives_ThemeProvider_index = require("./ThemeProvider/index.cjs");
 const require_primitives_Menubar_index = require("./Menubar/index.cjs");
 const require_primitives_NativeSelect_index = require("./NativeSelect/index.cjs");
 const require_primitives_NavigationMenu_index = require("./NavigationMenu/index.cjs");
 const require_primitives_Popover_index = require("./Popover/index.cjs");
 const require_primitives_Tooltip_index = require("./Tooltip/index.cjs");
-const require_primitives_NavRail_index = require("./NavRail/index.cjs");
+const require_patterns_NavRail_index = require("../patterns/NavRail/index.cjs");
 const require_primitives_Pagination_index = require("./Pagination/index.cjs");
 const require_primitives_Progress_index = require("./Progress/index.cjs");
 const require_primitives_RadioGroup_index = require("./RadioGroup/index.cjs");
@@ -61,6 +60,7 @@ const require_primitives_Switch_index = require("./Switch/index.cjs");
 const require_primitives_Table_index = require("./Table/index.cjs");
 const require_primitives_Tabs_index = require("./Tabs/index.cjs");
 const require_primitives_Text_index = require("./Text/index.cjs");
+const require_primitives_ThemeProvider_index = require("./ThemeProvider/index.cjs");
 const require_primitives_Toggle_index = require("./Toggle/index.cjs");
 const require_primitives_ToggleGroup_index = require("./ToggleGroup/index.cjs");
 exports.Accordion = require_primitives_Accordion_index.Accordion;
@@ -261,14 +261,14 @@ exports.MenubarSubContent = require_primitives_Menubar_index.MenubarSubContent;
 exports.MenubarSubTrigger = require_primitives_Menubar_index.MenubarSubTrigger;
 exports.MenubarTrigger = require_primitives_Menubar_index.MenubarTrigger;
 exports.NativeSelect = require_primitives_NativeSelect_index.NativeSelect;
-exports.NavRail = require_primitives_NavRail_index.NavRail;
-exports.NavRailItem = require_primitives_NavRail_index.NavRailItem;
-exports.NavRailMenu = require_primitives_NavRail_index.NavRailMenu;
-exports.NavRailMenuContent = require_primitives_NavRail_index.NavRailMenuContent;
-exports.NavRailMenuItem = require_primitives_NavRail_index.NavRailMenuItem;
-exports.NavRailMenuTrigger = require_primitives_NavRail_index.NavRailMenuTrigger;
-exports.NavRailSeparator = require_primitives_NavRail_index.NavRailSeparator;
-exports.NavRailUser = require_primitives_NavRail_index.NavRailUser;
+exports.NavRail = require_patterns_NavRail_index.NavRail;
+exports.NavRailItem = require_patterns_NavRail_index.NavRailItem;
+exports.NavRailMenu = require_patterns_NavRail_index.NavRailMenu;
+exports.NavRailMenuContent = require_patterns_NavRail_index.NavRailMenuContent;
+exports.NavRailMenuItem = require_patterns_NavRail_index.NavRailMenuItem;
+exports.NavRailMenuTrigger = require_patterns_NavRail_index.NavRailMenuTrigger;
+exports.NavRailSeparator = require_patterns_NavRail_index.NavRailSeparator;
+exports.NavRailUser = require_patterns_NavRail_index.NavRailUser;
 exports.NavigationMenu = require_primitives_NavigationMenu_index.NavigationMenu;
 exports.NavigationMenuContent = require_primitives_NavigationMenu_index.NavigationMenuContent;
 exports.NavigationMenuIndicator = require_primitives_NavigationMenu_index.NavigationMenuIndicator;