@refraction-ui/react 0.20.1 → 0.22.0

package/dist/react-browser-chrome-mock.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../browser-chrome-mock/src/browser-chrome-mock.ts", "../../browser-chrome-mock/src/browser-chrome-mock.styles.ts", "../../react-browser-chrome-mock/src/browser-chrome-mock.tsx"],
-  "sourcesContent": ["/** Recording or live stream status for the browser chrome mock. */\nexport type BrowserChromeStatus = 'live' | 'rec'\n\nexport interface BrowserChromeMockProps {\n  /** URL to display in the address bar. */\n  url: string\n  /** Optional status badge shown in the chrome bar. */\n  status?: BrowserChromeStatus\n}\n\nexport interface BrowserChromeMockAPI {\n  /** ARIA attributes to spread on the group element. */\n  ariaProps: { role: 'group'; 'aria-label': string }\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/** Split a URL into bold domain and normal path segments. */\nexport function splitUrl(url: string): { domain: string; path: string } {\n  const slashIndex = url.indexOf('/')\n  if (slashIndex === -1) {\n    return { domain: url, path: '' }\n  }\n  return {\n    domain: url.slice(0, slashIndex),\n    path: url.slice(slashIndex),\n  }\n}\n\n/**\n * Build the framework-agnostic props for a BrowserChromeMock.\n *\n * Returns a `role=\"group\"` aria label plus optional `data-status` so adapters\n * can hook CSS without duplicating logic.\n */\nexport function createBrowserChromeMock(\n  props: Pick<BrowserChromeMockProps, 'status'> = {},\n): BrowserChromeMockAPI {\n  const { status } = props\n\n  const ariaProps = {\n    role: 'group' as const,\n    'aria-label': 'Browser preview',\n  }\n\n  const dataAttributes: Record<string, string> = {}\n  if (status !== undefined) {\n    dataAttributes['data-status'] = status\n  }\n\n  return { ariaProps, dataAttributes }\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/** Outer frame wrapping the chrome bar and content. */\nexport const browserChromeMockVariants = cva({\n  base: 'rounded-xl border border-border overflow-hidden bg-card',\n  variants: {},\n  defaultVariants: {},\n})\n\n/** The chrome toolbar row containing dots, URL bar, and optional badge. */\nexport const chromeBarClass =\n  'flex items-center gap-2 bg-muted/40 border-b border-border px-3 py-2'\n\n/** A single traffic-light dot. */\nexport const trafficDotClass = 'size-2.5 rounded-full border border-border'\n\n/** Centered URL bar. */\nexport const urlBarClass = 'flex-1 text-center font-mono text-[11px] text-muted-foreground'\n\n/** Bold domain segment inside the URL bar. */\nexport const urlDomainClass = 'font-semibold text-foreground'\n\n/**\n * Status badge shown in the chrome bar.\n *\n * live  → emerald tint (approved exception to semantic tokens)\n * rec   → destructive tint with a pulsing dot\n */\nexport const statusBadgeVariants = cva({\n  base: 'inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide',\n  variants: {\n    status: {\n      live: 'text-emerald-500 bg-emerald-500/10',\n      rec: 'text-destructive bg-destructive/10',\n    },\n  },\n  defaultVariants: {\n    status: 'live',\n  },\n})\n\n/** Inner content area that receives slotted/children content. */\nexport const contentAreaClass = 'p-0'\n", "import * as React from 'react'\nimport {\n  createBrowserChromeMock,\n  splitUrl,\n  browserChromeMockVariants,\n  chromeBarClass,\n  trafficDotClass,\n  urlBarClass,\n  urlDomainClass,\n  statusBadgeVariants,\n  contentAreaClass,\n  type BrowserChromeStatus,\n} from '@refraction-ui/browser-chrome-mock'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { BrowserChromeStatus }\n\nexport interface BrowserChromeMockProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'content'> {\n  /** URL to display in the address bar. Bold domain + normal path. */\n  url: string\n  /** Optional status badge shown in the chrome bar. */\n  status?: BrowserChromeStatus\n}\n\n/** Three traffic-light dots rendered in the chrome bar. */\nconst TRAFFIC_DOTS = ['bg-red-400', 'bg-yellow-400', 'bg-green-400'] as const\n\n/**\n * BrowserChromeMock — a decorative browser window frame.\n *\n * Renders a mock browser chrome with traffic-light dots, a monospace URL bar\n * (bold domain + normal path), an optional live/rec status badge, and a\n * content area for arbitrary children. Logic and styles come from the headless\n * `@refraction-ui/browser-chrome-mock` core.\n */\nexport const BrowserChromeMock = React.forwardRef<\n  HTMLDivElement,\n  BrowserChromeMockProps\n>(function BrowserChromeMock({ url, status, className, children, ...props }, ref) {\n  const { ariaProps, dataAttributes } = createBrowserChromeMock({ status })\n  const { domain, path } = splitUrl(url)\n\n  return (\n    <div\n      ref={ref}\n      className={cn(browserChromeMockVariants(), className)}\n      {...ariaProps}\n      {...dataAttributes}\n      {...props}\n    >\n      {/* Chrome toolbar */}\n      <div className={chromeBarClass}>\n        {/* Traffic-light dots */}\n        <div className=\"flex items-center gap-1.5 shrink-0\">\n          {TRAFFIC_DOTS.map((color) => (\n            <span key={color} className={cn(trafficDotClass, color)} />\n          ))}\n        </div>\n\n        {/* URL bar */}\n        <div className={urlBarClass}>\n          <span className={urlDomainClass}>{domain}</span>\n          {path && <span>{path}</span>}\n        </div>\n\n        {/* Status badge */}\n        {status && (\n          <div className={statusBadgeVariants({ status })}>\n            {status === 'rec' && (\n              <span className=\"size-1.5 rounded-full bg-destructive animate-pulse\" />\n            )}\n            {status}\n          </div>\n        )}\n      </div>\n\n      {/* Content area */}\n      <div className={contentAreaClass}>{children}</div>\n    </div>\n  )\n})\n"],
-  "mappings": ";;;;;;;;;AAkBO,SAAS,SAAS,KAA+C;AACtE,QAAM,aAAa,IAAI,QAAQ,GAAG;AAClC,MAAI,eAAe,IAAI;AACrB,WAAO,EAAE,QAAQ,KAAK,MAAM,GAAA;EAC9B;AACA,SAAO;IACL,QAAQ,IAAI,MAAM,GAAG,UAAU;IAC/B,MAAM,IAAI,MAAM,UAAU;EAAA;AAE9B;AAQO,SAAS,wBACd,QAAgD,CAAA,GAC1B;AACtB,QAAM,EAAE,OAAA,IAAW;AAEnB,QAAM,YAAY;IAChB,MAAM;IACN,cAAc;EAAA;AAGhB,QAAM,iBAAyC,CAAA;AAC/C,MAAI,WAAW,QAAW;AACxB,mBAAe,aAAa,IAAI;EAClC;AAEA,SAAO,EAAE,WAAW,eAAA;AACtB;AChDO,IAAM,4BAA4B,IAAI;EAC3C,MAAM;EACN,UAAU,CAAA;EACV,iBAAiB,CAAA;AACnB,CAAC;AAGM,IAAM,iBACX;AAGK,IAAM,kBAAkB;AAGxB,IAAM,cAAc;AAGpB,IAAM,iBAAiB;AAQvB,IAAM,sBAAsB,IAAI;EACrC,MAAM;EACN,UAAU;IACR,QAAQ;MACN,MAAM;MACN,KAAK;IAAA;EACP;EAEF,iBAAiB;IACf,QAAQ;EAAA;AAEZ,CAAC;AAGM,IAAM,mBAAmB;;;;AChBhC,IAAM,eAAe,CAAC,cAAc,iBAAiB,cAAc;AAU5D,IAAM,oBAA0B,iBAGrC,SAASA,mBAAkB,EAAE,KAAK,QAAQ,WAAW,UAAU,GAAG,MAAA,GAAS,KAAK;AAChF,QAAM,EAAE,WAAW,eAAA,IAAmB,wBAAwB,EAAE,OAAA,CAAQ;AACxE,QAAM,EAAE,QAAQ,KAAA,IAAS,SAAS,GAAG;AAErC,SACE;IAAC;IAAA;MACC;MACA,WAAW,GAAG,0BAAA,GAA6B,SAAS;MACnD,GAAG;MACH,GAAG;MACH,GAAG;MAGJ,UAAA;QAAA,qBAAC,OAAA,EAAI,WAAW,gBAEd,UAAA;UAAA,oBAAC,OAAA,EAAI,WAAU,sCACZ,UAAA,aAAa,IAAI,CAAC,UACjB,oBAAC,QAAA,EAAiB,WAAW,GAAG,iBAAiB,KAAK,EAAA,GAA3C,KAA8C,CAC1D,EAAA,CACH;UAGA,qBAAC,OAAA,EAAI,WAAW,aACd,UAAA;YAAA,oBAAC,QAAA,EAAK,WAAW,gBAAiB,UAAA,OAAA,CAAO;YACxC,QAAQ,oBAAC,QAAA,EAAM,UAAA,KAAA,CAAK;UAAA,EAAA,CACvB;UAGC,UAAA,qBACE,OAAA,EAAI,WAAW,oBAAoB,EAAE,OAAA,CAAQ,GAC3C,UAAA;YAAA,WAAW,SACV,oBAAC,QAAA,EAAK,WAAU,qDAAA,CAAqD;YAEtE;UAAA,EAAA,CACH;QAAA,EAAA,CAEJ;QAGA,oBAAC,OAAA,EAAI,WAAW,kBAAmB,SAAA,CAAS;MAAA;IAAA;EAAA;AAGlD,CAAC;",
+  "sourcesContent": ["/** Recording or live stream status for the browser chrome mock. */\nexport type BrowserChromeStatus = 'live' | 'rec'\n\nexport interface BrowserChromeMockProps {\n  /** URL to display in the address bar. */\n  url: string\n  /** Optional status badge shown in the chrome bar. */\n  status?: BrowserChromeStatus\n}\n\nexport interface BrowserChromeMockAPI {\n  /** ARIA attributes to spread on the group element. */\n  ariaProps: { role: 'group'; 'aria-label': string }\n  /** Data attributes for styling hooks. */\n  dataAttributes: Record<string, string>\n}\n\n/** Split a URL into bold domain and normal path segments. */\nexport function splitUrl(url: string): { domain: string; path: string } {\n  const slashIndex = url.indexOf('/')\n  if (slashIndex === -1) {\n    return { domain: url, path: '' }\n  }\n  return {\n    domain: url.slice(0, slashIndex),\n    path: url.slice(slashIndex),\n  }\n}\n\n/**\n * Build the framework-agnostic props for a BrowserChromeMock.\n *\n * Returns a `role=\"group\"` aria label plus optional `data-status` so adapters\n * can hook CSS without duplicating logic.\n */\nexport function createBrowserChromeMock(\n  props: Pick<BrowserChromeMockProps, 'status'> = {},\n): BrowserChromeMockAPI {\n  const { status } = props\n\n  const ariaProps = {\n    role: 'group' as const,\n    'aria-label': 'Browser preview',\n  }\n\n  const dataAttributes: Record<string, string> = {}\n  if (status !== undefined) {\n    dataAttributes['data-status'] = status\n  }\n\n  return { ariaProps, dataAttributes }\n}\n", "import { cva } from '@refraction-ui/shared'\n\n/** Outer frame wrapping the chrome bar and content. */\nexport const browserChromeMockVariants = cva({\n  base: 'rounded-xl border border-border overflow-hidden bg-card',\n  variants: {},\n  defaultVariants: {},\n})\n\n/** The chrome toolbar row containing dots, URL bar, and optional badge. */\nexport const chromeBarClass =\n  'flex items-center gap-2 bg-muted/40 border-b border-border px-3 py-2'\n\n/** A single traffic-light dot. */\nexport const trafficDotClass = 'size-2.5 rounded-full border border-border'\n\n/** Centered URL bar. */\nexport const urlBarClass = 'flex-1 text-center font-mono text-[11px] text-muted-foreground'\n\n/** Bold domain segment inside the URL bar. */\nexport const urlDomainClass = 'font-semibold text-foreground'\n\n/**\n * Status badge shown in the chrome bar.\n *\n * live  → emerald tint (approved exception to semantic tokens)\n * rec   → destructive tint with a pulsing dot\n */\nexport const statusBadgeVariants = cva({\n  base: 'inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide',\n  variants: {\n    status: {\n      live: 'text-emerald-500 bg-emerald-500/10',\n      rec: 'text-destructive bg-destructive/10',\n    },\n  },\n  defaultVariants: {\n    status: 'live',\n  },\n})\n\n/** Inner content area that receives slotted/children content. */\nexport const contentAreaClass = 'p-0'\n", "import * as React from 'react'\nimport {\n  createBrowserChromeMock,\n  splitUrl,\n  browserChromeMockVariants,\n  chromeBarClass,\n  trafficDotClass,\n  urlBarClass,\n  urlDomainClass,\n  statusBadgeVariants,\n  contentAreaClass,\n  type BrowserChromeStatus,\n} from '@refraction-ui/browser-chrome-mock'\nimport { cn } from '@refraction-ui/shared'\n\nexport type { BrowserChromeStatus }\n\nexport interface BrowserChromeMockProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'content'> {\n  /** URL to display in the address bar. Bold domain + normal path. */\n  url: string\n  /** Optional status badge shown in the chrome bar. */\n  status?: BrowserChromeStatus\n}\n\n/** Three traffic-light dots rendered in the chrome bar. */\n// macOS window-chrome realism, not status tones — deliberately not tokenized.\nconst TRAFFIC_DOTS = ['bg-red-400', 'bg-yellow-400', 'bg-green-400'] as const\n\n/**\n * BrowserChromeMock — a decorative browser window frame.\n *\n * Renders a mock browser chrome with traffic-light dots, a monospace URL bar\n * (bold domain + normal path), an optional live/rec status badge, and a\n * content area for arbitrary children. Logic and styles come from the headless\n * `@refraction-ui/browser-chrome-mock` core.\n */\nexport const BrowserChromeMock = React.forwardRef<\n  HTMLDivElement,\n  BrowserChromeMockProps\n>(function BrowserChromeMock({ url, status, className, children, ...props }, ref) {\n  const { ariaProps, dataAttributes } = createBrowserChromeMock({ status })\n  const { domain, path } = splitUrl(url)\n\n  return (\n    <div\n      ref={ref}\n      className={cn(browserChromeMockVariants(), className)}\n      {...ariaProps}\n      {...dataAttributes}\n      {...props}\n    >\n      {/* Chrome toolbar */}\n      <div className={chromeBarClass}>\n        {/* Traffic-light dots */}\n        <div className=\"flex items-center gap-1.5 shrink-0\">\n          {TRAFFIC_DOTS.map((color) => (\n            <span key={color} className={cn(trafficDotClass, color)} />\n          ))}\n        </div>\n\n        {/* URL bar */}\n        <div className={urlBarClass}>\n          <span className={urlDomainClass}>{domain}</span>\n          {path && <span>{path}</span>}\n        </div>\n\n        {/* Status badge */}\n        {status && (\n          <div className={statusBadgeVariants({ status })}>\n            {status === 'rec' && (\n              <span className=\"size-1.5 rounded-full bg-destructive animate-pulse\" />\n            )}\n            {status}\n          </div>\n        )}\n      </div>\n\n      {/* Content area */}\n      <div className={contentAreaClass}>{children}</div>\n    </div>\n  )\n})\n"],
+  "mappings": ";;;;;;;;;AAkBO,SAAS,SAAS,KAA+C;AACtE,QAAM,aAAa,IAAI,QAAQ,GAAG;AAClC,MAAI,eAAe,IAAI;AACrB,WAAO,EAAE,QAAQ,KAAK,MAAM,GAAA;EAC9B;AACA,SAAO;IACL,QAAQ,IAAI,MAAM,GAAG,UAAU;IAC/B,MAAM,IAAI,MAAM,UAAU;EAAA;AAE9B;AAQO,SAAS,wBACd,QAAgD,CAAA,GAC1B;AACtB,QAAM,EAAE,OAAA,IAAW;AAEnB,QAAM,YAAY;IAChB,MAAM;IACN,cAAc;EAAA;AAGhB,QAAM,iBAAyC,CAAA;AAC/C,MAAI,WAAW,QAAW;AACxB,mBAAe,aAAa,IAAI;EAClC;AAEA,SAAO,EAAE,WAAW,eAAA;AACtB;AChDO,IAAM,4BAA4B,IAAI;EAC3C,MAAM;EACN,UAAU,CAAA;EACV,iBAAiB,CAAA;AACnB,CAAC;AAGM,IAAM,iBACX;AAGK,IAAM,kBAAkB;AAGxB,IAAM,cAAc;AAGpB,IAAM,iBAAiB;AAQvB,IAAM,sBAAsB,IAAI;EACrC,MAAM;EACN,UAAU;IACR,QAAQ;MACN,MAAM;MACN,KAAK;IAAA;EACP;EAEF,iBAAiB;IACf,QAAQ;EAAA;AAEZ,CAAC;AAGM,IAAM,mBAAmB;;;;ACfhC,IAAM,eAAe,CAAC,cAAc,iBAAiB,cAAc;AAU5D,IAAM,oBAA0B,iBAGrC,SAASA,mBAAkB,EAAE,KAAK,QAAQ,WAAW,UAAU,GAAG,MAAA,GAAS,KAAK;AAChF,QAAM,EAAE,WAAW,eAAA,IAAmB,wBAAwB,EAAE,OAAA,CAAQ;AACxE,QAAM,EAAE,QAAQ,KAAA,IAAS,SAAS,GAAG;AAErC,SACE;IAAC;IAAA;MACC;MACA,WAAW,GAAG,0BAAA,GAA6B,SAAS;MACnD,GAAG;MACH,GAAG;MACH,GAAG;MAGJ,UAAA;QAAA,qBAAC,OAAA,EAAI,WAAW,gBAEd,UAAA;UAAA,oBAAC,OAAA,EAAI,WAAU,sCACZ,UAAA,aAAa,IAAI,CAAC,UACjB,oBAAC,QAAA,EAAiB,WAAW,GAAG,iBAAiB,KAAK,EAAA,GAA3C,KAA8C,CAC1D,EAAA,CACH;UAGA,qBAAC,OAAA,EAAI,WAAW,aACd,UAAA;YAAA,oBAAC,QAAA,EAAK,WAAW,gBAAiB,UAAA,OAAA,CAAO;YACxC,QAAQ,oBAAC,QAAA,EAAM,UAAA,KAAA,CAAK;UAAA,EAAA,CACvB;UAGC,UAAA,qBACE,OAAA,EAAI,WAAW,oBAAoB,EAAE,OAAA,CAAQ,GAC3C,UAAA;YAAA,WAAW,SACV,oBAAC,QAAA,EAAK,WAAU,qDAAA,CAAqD;YAEtE;UAAA,EAAA,CACH;QAAA,EAAA,CAEJ;QAGA,oBAAC,OAAA,EAAI,WAAW,kBAAmB,SAAA,CAAS;MAAA;IAAA;EAAA;AAGlD,CAAC;",
   "names": ["BrowserChromeMock"]
 }

package/dist/react-button.js

@@ -2,9 +2,9 @@ import {
   Button,
   buttonTokens,
   buttonVariants
-} from "./chunk-F7B64KT3.js";
-import "./chunk-WK2IIUFO.js";
-import "./chunk-ZF3OHCGV.js";
+} from "./chunk-3Y2T26QD.js";
+import "./chunk-QDMLIDYN.js";
+import "./chunk-2Q6HHFAN.js";
 export {
   Button,
   buttonTokens,

package/dist/react-calendar.js

@@ -2,7 +2,7 @@ import {
   cn,
   cva,
   generateId
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-calendar/dist/index.js
 import * as React from "react";

package/dist/react-call-controls.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-call-controls/dist/index.js
 import * as React from "react";

package/dist/react-callout.js

@@ -4,7 +4,7 @@ import {
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-callout/dist/index.js
 import * as React from "react";
@@ -14,7 +14,9 @@ function createCallout(props = {}) {
   const ariaProps = {};
   if (props.role) {
     ariaProps.role = props.role;
-  } else {
+  } else if (props.destructive) {
+    ariaProps.role = "alert";
+  } else if (props.labelled) {
     ariaProps.role = "region";
   }
   return {
@@ -60,7 +62,10 @@ var calloutDescriptionVariants = cva({
 import { jsx } from "react/jsx-runtime";
 var Callout = React.forwardRef(
   function Callout2({ className, variant, asChild = false, ...props }, ref) {
-    const api = createCallout({ role: variant === "destructive" ? "alert" : "region" });
+    const api = createCallout({
+      destructive: variant === "destructive",
+      labelled: Boolean(props["aria-label"] || props["aria-labelledby"])
+    });
     const classes = cn(calloutVariants({ variant }), className);
     if (asChild) {
       return /* @__PURE__ */ jsx(

package/dist/react-callout.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../callout/src/callout.ts", "../../callout/src/callout.styles.ts", "../../react-callout/src/callout.tsx"],
-  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\nexport interface CalloutProps {\n  /** Optional accessible role override */\n  role?: string\n}\n\nexport interface CalloutAPI {\n  ariaProps: Partial<AccessibilityProps>\n  dataAttributes: Record<string, string>\n}\n\nexport function createCallout(props: CalloutProps = {}): CalloutAPI {\n  const ariaProps: Partial<AccessibilityProps> = {}\n  \n  // Callouts are usually alert or region depending on severity\n  if (props.role) {\n    ariaProps.role = props.role\n  } else {\n    ariaProps.role = 'region'\n  }\n\n  return {\n    ariaProps,\n    dataAttributes: { 'data-slot': 'callout' },\n  }\n}\n\nexport function createCalloutIcon(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-icon' } }\n}\n\nexport function createCalloutContent(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-content' } }\n}\n\nexport function createCalloutTitle(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-title' } }\n}\n\nexport function createCalloutDescription(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-description' } }\n}", "import { cva } from '@refraction-ui/shared'\n\nexport const calloutVariants = cva({\n  base: 'relative w-full rounded-lg border p-4 text-sm flex gap-3',\n  variants: {\n    variant: {\n      default: 'bg-muted/50 border-border text-foreground',\n      destructive: 'bg-destructive/10 border-destructive/20 text-destructive',\n      success: 'bg-success/10 border-success/20 text-success',\n      warning: 'bg-warning/10 border-warning/20 text-warning',\n      info: 'bg-info/10 border-info/20 text-info',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n})\n\nexport const calloutTitleVariants = cva({\n  base: 'font-semibold leading-none tracking-tight mb-1',\n})\n\nexport const calloutDescriptionVariants = cva({\n  base: 'text-sm opacity-90 leading-relaxed',\n})\n", "import * as React from 'react'\nimport {\n  createCallout,\n  createCalloutIcon,\n  createCalloutContent,\n  createCalloutTitle,\n  createCalloutDescription,\n  calloutVariants,\n  calloutTitleVariants,\n  calloutDescriptionVariants,\n} from '@refraction-ui/callout'\nimport { cn } from '@refraction-ui/shared'\nimport { Slot } from '@refraction-ui/react-slot'\n\nexport interface CalloutProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant?: 'default' | 'destructive' | 'success' | 'warning' | 'info'\n  /** Merge the callout's classes/props onto the single child element instead\n   * of rendering a `<div>` (Radix-style `asChild`). Expects exactly one React\n   * element child. */\n  asChild?: boolean\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  function Callout({ className, variant, asChild = false, ...props }, ref) {\n    const api = createCallout({ role: variant === 'destructive' ? 'alert' : 'region' })\n    const classes = cn(calloutVariants({ variant }), className)\n\n    if (asChild) {\n      return (\n        <Slot\n          ref={ref as React.Ref<HTMLElement>}\n          className={classes}\n          {...api.ariaProps}\n          {...api.dataAttributes}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={classes}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutIcon = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutIcon({ className, ...props }, ref) {\n    const api = createCalloutIcon()\n    return (\n      <div\n        ref={ref}\n        className={cn('flex-shrink-0 mt-0.5', className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutContent({ className, ...props }, ref) {\n    const api = createCalloutContent()\n    return (\n      <div\n        ref={ref}\n        className={cn('flex-1', className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(\n  function CalloutTitle({ className, ...props }, ref) {\n    const api = createCalloutTitle()\n    return (\n      <h5\n        ref={ref}\n        className={cn(calloutTitleVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutDescription = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutDescription({ className, ...props }, ref) {\n    const api = createCalloutDescription()\n    return (\n      <div\n        ref={ref}\n        className={cn(calloutDescriptionVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n"],
-  "mappings": ";;;;;;;;;;;;AAYO,SAAS,cAAc,QAAsB,CAAA,GAAgB;AAClE,QAAM,YAAyC,CAAA;AAG/C,MAAI,MAAM,MAAM;AACd,cAAU,OAAO,MAAM;EACzB,OAAO;AACL,cAAU,OAAO;EACnB;AAEA,SAAO;IACL;IACA,gBAAgB,EAAE,aAAa,UAAA;EAAU;AAE7C;AAEO,SAAS,oBAAgE;AAC9E,SAAO,EAAE,gBAAgB,EAAE,aAAa,eAAA,EAAe;AACzD;AAEO,SAAS,uBAAmE;AACjF,SAAO,EAAE,gBAAgB,EAAE,aAAa,kBAAA,EAAkB;AAC5D;AAEO,SAAS,qBAAiE;AAC/E,SAAO,EAAE,gBAAgB,EAAE,aAAa,gBAAA,EAAgB;AAC1D;AAEO,SAAS,2BAAuE;AACrF,SAAO,EAAE,gBAAgB,EAAE,aAAa,sBAAA,EAAsB;AAChE;ACxCO,IAAM,kBAAkB,IAAI;EACjC,MAAM;EACN,UAAU;IACR,SAAS;MACP,SAAS;MACT,aAAa;MACb,SAAS;MACT,SAAS;MACT,MAAM;IAAA;EACR;EAEF,iBAAiB;IACf,SAAS;EAAA;AAEb,CAAC;AAEM,IAAM,uBAAuB,IAAI;EACtC,MAAM;AACR,CAAC;AAEM,IAAM,6BAA6B,IAAI;EAC5C,MAAM;AACR,CAAC;;;;ACFM,IAAM,UAAgB;EAC3B,SAASA,SAAQ,EAAE,WAAW,SAAS,UAAU,OAAO,GAAG,MAAA,GAAS,KAAK;AACvE,UAAM,MAAM,cAAc,EAAE,MAAM,YAAY,gBAAgB,UAAU,SAAA,CAAU;AAClF,UAAM,UAAU,GAAG,gBAAgB,EAAE,QAAA,CAAS,GAAG,SAAS;AAE1D,QAAI,SAAS;AACX,aACE;QAAC;QAAA;UACC;UACA,WAAW;UACV,GAAG,IAAI;UACP,GAAG,IAAI;UACP,GAAG;QAAA;MAAA;IAGV;AAEA,WACE;MAAC;MAAA;QACC;QACA,WAAW;QACV,GAAG,IAAI;QACP,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,cAAoB;EAC/B,SAASC,aAAY,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACjD,UAAM,MAAM,kBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,wBAAwB,SAAS;QAC9C,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,iBAAuB;EAClC,SAASC,gBAAe,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACpD,UAAM,MAAM,qBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,UAAU,SAAS;QAChC,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,eAAqB;EAChC,SAASC,cAAa,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AAClD,UAAM,MAAM,mBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,qBAAA,GAAwB,SAAS;QAC9C,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,qBAA2B;EACtC,SAASC,oBAAmB,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACxD,UAAM,MAAM,yBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,2BAAA,GAA8B,SAAS;QACpD,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;",
+  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\nexport interface CalloutProps {\n  /** Explicit role; always wins. */\n  role?: string\n  /** Destructive callouts are announced (`role=\"alert\"`). */\n  destructive?: boolean\n  /**\n   * Whether the callout has an accessible name (`aria-label` /\n   * `aria-labelledby`). Only a named callout becomes a `region` landmark — an\n   * unnamed region is an axe violation and landmark noise.\n   */\n  labelled?: boolean\n}\n\nexport interface CalloutAPI {\n  ariaProps: Partial<AccessibilityProps>\n  dataAttributes: Record<string, string>\n}\n\nexport function createCallout(props: CalloutProps = {}): CalloutAPI {\n  const ariaProps: Partial<AccessibilityProps> = {}\n  \n  if (props.role) {\n    ariaProps.role = props.role\n  } else if (props.destructive) {\n    ariaProps.role = 'alert'\n  } else if (props.labelled) {\n    ariaProps.role = 'region'\n  }\n\n  return {\n    ariaProps,\n    dataAttributes: { 'data-slot': 'callout' },\n  }\n}\n\nexport function createCalloutIcon(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-icon' } }\n}\n\nexport function createCalloutContent(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-content' } }\n}\n\nexport function createCalloutTitle(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-title' } }\n}\n\nexport function createCalloutDescription(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'callout-description' } }\n}", "import { cva } from '@refraction-ui/shared'\n\nexport const calloutVariants = cva({\n  base: 'relative w-full rounded-lg border p-4 text-sm flex gap-3',\n  variants: {\n    variant: {\n      default: 'bg-muted/50 border-border text-foreground',\n      destructive: 'bg-destructive/10 border-destructive/20 text-destructive',\n      success: 'bg-success/10 border-success/20 text-success',\n      warning: 'bg-warning/10 border-warning/20 text-warning',\n      info: 'bg-info/10 border-info/20 text-info',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n})\n\nexport const calloutTitleVariants = cva({\n  base: 'font-semibold leading-none tracking-tight mb-1',\n})\n\nexport const calloutDescriptionVariants = cva({\n  base: 'text-sm opacity-90 leading-relaxed',\n})\n", "import * as React from 'react'\nimport {\n  createCallout,\n  createCalloutIcon,\n  createCalloutContent,\n  createCalloutTitle,\n  createCalloutDescription,\n  calloutVariants,\n  calloutTitleVariants,\n  calloutDescriptionVariants,\n} from '@refraction-ui/callout'\nimport { cn } from '@refraction-ui/shared'\nimport { Slot } from '@refraction-ui/react-slot'\n\nexport interface CalloutProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant?: 'default' | 'destructive' | 'success' | 'warning' | 'info'\n  /** Merge the callout's classes/props onto the single child element instead\n   * of rendering a `<div>` (Radix-style `asChild`). Expects exactly one React\n   * element child. */\n  asChild?: boolean\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  function Callout({ className, variant, asChild = false, ...props }, ref) {\n    const api = createCallout({\n      destructive: variant === 'destructive',\n      labelled: Boolean(props['aria-label'] || props['aria-labelledby']),\n    })\n    const classes = cn(calloutVariants({ variant }), className)\n\n    if (asChild) {\n      return (\n        <Slot\n          ref={ref as React.Ref<HTMLElement>}\n          className={classes}\n          {...api.ariaProps}\n          {...api.dataAttributes}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={classes}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutIcon = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutIcon({ className, ...props }, ref) {\n    const api = createCalloutIcon()\n    return (\n      <div\n        ref={ref}\n        className={cn('flex-shrink-0 mt-0.5', className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutContent({ className, ...props }, ref) {\n    const api = createCalloutContent()\n    return (\n      <div\n        ref={ref}\n        className={cn('flex-1', className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(\n  function CalloutTitle({ className, ...props }, ref) {\n    const api = createCalloutTitle()\n    return (\n      <h5\n        ref={ref}\n        className={cn(calloutTitleVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const CalloutDescription = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CalloutDescription({ className, ...props }, ref) {\n    const api = createCalloutDescription()\n    return (\n      <div\n        ref={ref}\n        className={cn(calloutDescriptionVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n"],
+  "mappings": ";;;;;;;;;;;;AAoBO,SAAS,cAAc,QAAsB,CAAA,GAAgB;AAClE,QAAM,YAAyC,CAAA;AAE/C,MAAI,MAAM,MAAM;AACd,cAAU,OAAO,MAAM;EACzB,WAAW,MAAM,aAAa;AAC5B,cAAU,OAAO;EACnB,WAAW,MAAM,UAAU;AACzB,cAAU,OAAO;EACnB;AAEA,SAAO;IACL;IACA,gBAAgB,EAAE,aAAa,UAAA;EAAU;AAE7C;AAEO,SAAS,oBAAgE;AAC9E,SAAO,EAAE,gBAAgB,EAAE,aAAa,eAAA,EAAe;AACzD;AAEO,SAAS,uBAAmE;AACjF,SAAO,EAAE,gBAAgB,EAAE,aAAa,kBAAA,EAAkB;AAC5D;AAEO,SAAS,qBAAiE;AAC/E,SAAO,EAAE,gBAAgB,EAAE,aAAa,gBAAA,EAAgB;AAC1D;AAEO,SAAS,2BAAuE;AACrF,SAAO,EAAE,gBAAgB,EAAE,aAAa,sBAAA,EAAsB;AAChE;ACjDO,IAAM,kBAAkB,IAAI;EACjC,MAAM;EACN,UAAU;IACR,SAAS;MACP,SAAS;MACT,aAAa;MACb,SAAS;MACT,SAAS;MACT,MAAM;IAAA;EACR;EAEF,iBAAiB;IACf,SAAS;EAAA;AAEb,CAAC;AAEM,IAAM,uBAAuB,IAAI;EACtC,MAAM;AACR,CAAC;AAEM,IAAM,6BAA6B,IAAI;EAC5C,MAAM;AACR,CAAC;;;;ACFM,IAAM,UAAgB;EAC3B,SAASA,SAAQ,EAAE,WAAW,SAAS,UAAU,OAAO,GAAG,MAAA,GAAS,KAAK;AACvE,UAAM,MAAM,cAAc;MACxB,aAAa,YAAY;MACzB,UAAU,QAAQ,MAAM,YAAY,KAAK,MAAM,iBAAiB,CAAC;IAAA,CAClE;AACD,UAAM,UAAU,GAAG,gBAAgB,EAAE,QAAA,CAAS,GAAG,SAAS;AAE1D,QAAI,SAAS;AACX,aACE;QAAC;QAAA;UACC;UACA,WAAW;UACV,GAAG,IAAI;UACP,GAAG,IAAI;UACP,GAAG;QAAA;MAAA;IAGV;AAEA,WACE;MAAC;MAAA;QACC;QACA,WAAW;QACV,GAAG,IAAI;QACP,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,cAAoB;EAC/B,SAASC,aAAY,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACjD,UAAM,MAAM,kBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,wBAAwB,SAAS;QAC9C,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,iBAAuB;EAClC,SAASC,gBAAe,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACpD,UAAM,MAAM,qBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,UAAU,SAAS;QAChC,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,eAAqB;EAChC,SAASC,cAAa,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AAClD,UAAM,MAAM,mBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,qBAAA,GAAwB,SAAS;QAC9C,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;AAEO,IAAM,qBAA2B;EACtC,SAASC,oBAAmB,EAAE,WAAW,GAAG,MAAA,GAAS,KAAK;AACxD,UAAM,MAAM,yBAAA;AACZ,WACE;MAAC;MAAA;QACC;QACA,WAAW,GAAG,2BAAA,GAA8B,SAAS;QACpD,GAAG,IAAI;QACP,GAAG;MAAA;IAAA;EAGV;AACF;",
   "names": ["Callout", "CalloutIcon", "CalloutContent", "CalloutTitle", "CalloutDescription"]
 }

package/dist/react-card-grid.js

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-card-grid/dist/index.js
 import * as React from "react";

package/dist/react-card.js

@@ -4,7 +4,7 @@ import {
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-card/dist/index.js
 import * as React from "react";
@@ -44,8 +44,16 @@ var cardTokens = {
   }
 };
 var cardVariants = cva({
-  base: "rounded-lg border bg-card text-card-foreground shadow",
+  base: "rounded-lg border shadow",
   variants: {
+    variant: {
+      // Default — unchanged surface (bg-card + border via the global token).
+      default: "bg-card text-card-foreground",
+      // Lower-emphasis container on the subtle surface token (issue #485).
+      subtle: "bg-surface-subtle text-card-foreground",
+      // Tinted second-accent card (issue #485).
+      tertiary: "border-transparent bg-tertiary-soft text-tertiary-soft-foreground"
+    },
     padding: {
       none: "",
       default: "p-6",
@@ -53,6 +61,7 @@ var cardVariants = cva({
     }
   },
   defaultVariants: {
+    variant: "default",
     padding: "none"
   }
 });
@@ -85,9 +94,9 @@ var cardFooterVariants = cva({
 // ../react-card/dist/index.js
 import { jsx } from "react/jsx-runtime";
 var Card = React.forwardRef(
-  function Card2({ className, asChild = false, ...props }, ref) {
+  function Card2({ className, variant, padding, asChild = false, ...props }, ref) {
     const api = createCard();
-    const classes = cn(cardVariants(), className);
+    const classes = cn(cardVariants({ variant, padding }), className);
     if (asChild) {
       return /* @__PURE__ */ jsx(
         Slot,
@@ -127,10 +136,10 @@ var CardHeader = React.forwardRef(
   }
 );
 var CardTitle = React.forwardRef(
-  function CardTitle2({ className, ...props }, ref) {
+  function CardTitle2({ className, as: Heading = "h3", ...props }, ref) {
     const api = createCardTitle();
     return /* @__PURE__ */ jsx(
-      "h3",
+      Heading,
       {
         ref,
         className: cn(cardTitleVariants(), className),

package/dist/react-card.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../card/src/card.ts", "../../card/src/card.styles.ts", "../../react-card/src/card.tsx"],
-  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\nexport interface CardProps {\n  /** Optional accessible role override */\n  role?: string\n}\n\nexport interface CardAPI {\n  /** ARIA attributes to spread on the element */\n  ariaProps: Partial<AccessibilityProps>\n  /** Data attributes for CSS styling hooks */\n  dataAttributes: Record<string, string>\n}\n\nexport function createCard(props: CardProps = {}): CardAPI {\n  const ariaProps: Partial<AccessibilityProps> = {}\n  if (props.role) {\n    ariaProps.role = props.role\n  }\n\n  return {\n    ariaProps,\n    dataAttributes: { 'data-slot': 'card' },\n  }\n}\n\nexport function createCardHeader(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-header' } }\n}\n\nexport function createCardTitle(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-title' } }\n}\n\nexport function createCardDescription(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-description' } }\n}\n\nexport function createCardContent(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-content' } }\n}\n\nexport function createCardFooter(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-footer' } }\n}\n", "import { cva } from '@refraction-ui/shared'\nimport type { TokenContract } from '@refraction-ui/shared'\n\nexport const cardTokens: TokenContract = {\n  name: 'card',\n  tokens: {\n    bg: { variable: '--rfr-card-bg', fallback: 'hsl(var(--card))' },\n    fg: { variable: '--rfr-card-fg', fallback: 'hsl(var(--card-foreground))' },\n    border: { variable: '--rfr-card-border', fallback: 'hsl(var(--border))' },\n  },\n}\n\nexport const cardVariants = cva({\n  base: 'rounded-lg border bg-card text-card-foreground shadow',\n  variants: {\n    padding: {\n      none: '',\n      default: 'p-6',\n      compact: 'p-4',\n    },\n  },\n  defaultVariants: {\n    padding: 'none',\n  },\n})\n\nexport const cardHeaderVariants = cva({\n  base: 'flex flex-col space-y-1.5 p-6',\n})\n\nexport const cardTitleVariants = cva({\n  base: 'font-semibold leading-none tracking-tight',\n  variants: {\n    size: {\n      sm: 'text-lg',\n      default: 'text-2xl',\n      lg: 'text-3xl',\n    },\n  },\n  defaultVariants: {\n    size: 'default',\n  },\n})\n\nexport const cardDescriptionVariants = cva({\n  base: 'text-sm text-muted-foreground',\n})\n\nexport const cardContentVariants = cva({\n  base: 'p-6 pt-0',\n})\n\nexport const cardFooterVariants = cva({\n  base: 'flex items-center p-6 pt-0',\n})\n", "import * as React from 'react'\nimport {\n  createCard,\n  createCardHeader,\n  createCardTitle,\n  createCardDescription,\n  createCardContent,\n  createCardFooter,\n  cardVariants,\n  cardHeaderVariants,\n  cardTitleVariants,\n  cardDescriptionVariants,\n  cardContentVariants,\n  cardFooterVariants,\n} from '@refraction-ui/card'\nimport { cn } from '@refraction-ui/shared'\nimport { Slot } from '@refraction-ui/react-slot'\n\nexport interface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Merge the card's classes/props onto the single child element instead of\n   * rendering a `<div>` (Radix-style `asChild`) — e.g.\n   * `<Card asChild><a href=\"/x\">…</a></Card>` for a clickable card. Expects\n   * exactly one React element child. */\n  asChild?: boolean\n}\n\n/**\n * Card -- a container with rounded corners, border, and shadow.\n */\nexport const Card = React.forwardRef<HTMLDivElement, CardProps>(\n  function Card({ className, asChild = false, ...props }, ref) {\n    const api = createCard()\n    const classes = cn(cardVariants(), className)\n\n    if (asChild) {\n      return (\n        <Slot\n          ref={ref as React.Ref<HTMLElement>}\n          className={classes}\n          {...api.ariaProps}\n          {...api.dataAttributes}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={classes}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardHeader -- top section of a card, typically contains title and description.\n */\nexport const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardHeader({ className, ...props }, ref) {\n    const api = createCardHeader()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardHeaderVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardTitle -- heading within a card header.\n */\nexport const CardTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(\n  function CardTitle({ className, ...props }, ref) {\n    const api = createCardTitle()\n    return (\n      <h3\n        ref={ref}\n        className={cn(cardTitleVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardDescription -- subtext within a card header.\n */\nexport const CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n  function CardDescription({ className, ...props }, ref) {\n    const api = createCardDescription()\n    return (\n      <p\n        ref={ref}\n        className={cn(cardDescriptionVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardContent -- main body content area of a card.\n */\nexport const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardContent({ className, ...props }, ref) {\n    const api = createCardContent()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardContentVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardFooter -- bottom section of a card, typically contains actions.\n */\nexport const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardFooter({ className, ...props }, ref) {\n    const api = createCardFooter()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardFooterVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { AccessibilityProps } from '@refraction-ui/shared'\n\n/**\n * Visual tone of a card (issue #485).\n * - `default` — the standard surface (activates the `--rfr-card-*` contract).\n * - `subtle` — a lower-emphasis container on the subtle surface token.\n * - `tertiary` — a tinted second-brand-accent card.\n */\nexport type CardVariant = 'default' | 'subtle' | 'tertiary'\n\n/** Built-in inner padding of the Card container. */\nexport type CardPadding = 'none' | 'default' | 'compact'\n\n/** Heading element for CardTitle. */\nexport type CardTitleLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\nexport interface CardProps {\n  /** Optional accessible role override */\n  role?: string\n}\n\nexport interface CardAPI {\n  /** ARIA attributes to spread on the element */\n  ariaProps: Partial<AccessibilityProps>\n  /** Data attributes for CSS styling hooks */\n  dataAttributes: Record<string, string>\n}\n\nexport function createCard(props: CardProps = {}): CardAPI {\n  const ariaProps: Partial<AccessibilityProps> = {}\n  if (props.role) {\n    ariaProps.role = props.role\n  }\n\n  return {\n    ariaProps,\n    dataAttributes: { 'data-slot': 'card' },\n  }\n}\n\nexport function createCardHeader(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-header' } }\n}\n\nexport function createCardTitle(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-title' } }\n}\n\nexport function createCardDescription(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-description' } }\n}\n\nexport function createCardContent(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-content' } }\n}\n\nexport function createCardFooter(): { dataAttributes: Record<string, string> } {\n  return { dataAttributes: { 'data-slot': 'card-footer' } }\n}\n", "import { cva } from '@refraction-ui/shared'\nimport type { TokenContract } from '@refraction-ui/shared'\n\nexport const cardTokens: TokenContract = {\n  name: 'card',\n  tokens: {\n    bg: { variable: '--rfr-card-bg', fallback: 'hsl(var(--card))' },\n    fg: { variable: '--rfr-card-fg', fallback: 'hsl(var(--card-foreground))' },\n    border: { variable: '--rfr-card-border', fallback: 'hsl(var(--border))' },\n  },\n}\n\nexport const cardVariants = cva({\n  base: 'rounded-lg border shadow',\n  variants: {\n    variant: {\n      // Default — unchanged surface (bg-card + border via the global token).\n      default: 'bg-card text-card-foreground',\n      // Lower-emphasis container on the subtle surface token (issue #485).\n      subtle: 'bg-surface-subtle text-card-foreground',\n      // Tinted second-accent card (issue #485).\n      tertiary: 'border-transparent bg-tertiary-soft text-tertiary-soft-foreground',\n    },\n    padding: {\n      none: '',\n      default: 'p-6',\n      compact: 'p-4',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    padding: 'none',\n  },\n})\n\nexport const cardHeaderVariants = cva({\n  base: 'flex flex-col space-y-1.5 p-6',\n})\n\nexport const cardTitleVariants = cva({\n  base: 'font-semibold leading-none tracking-tight',\n  variants: {\n    size: {\n      sm: 'text-lg',\n      default: 'text-2xl',\n      lg: 'text-3xl',\n    },\n  },\n  defaultVariants: {\n    size: 'default',\n  },\n})\n\nexport const cardDescriptionVariants = cva({\n  base: 'text-sm text-muted-foreground',\n})\n\nexport const cardContentVariants = cva({\n  base: 'p-6 pt-0',\n})\n\nexport const cardFooterVariants = cva({\n  base: 'flex items-center p-6 pt-0',\n})\n", "import * as React from 'react'\nimport {\n  createCard,\n  createCardHeader,\n  createCardTitle,\n  createCardDescription,\n  createCardContent,\n  createCardFooter,\n  cardVariants,\n  cardHeaderVariants,\n  cardTitleVariants,\n  cardDescriptionVariants,\n  cardContentVariants,\n  cardFooterVariants,\n  type CardVariant,\n  type CardPadding,\n  type CardTitleLevel,\n} from '@refraction-ui/card'\nimport { cn } from '@refraction-ui/shared'\nimport { Slot } from '@refraction-ui/react-slot'\n\nexport interface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Visual tone of the card. Defaults to `'default'` (issue #485). */\n  variant?: CardVariant\n  /** Built-in inner padding. Defaults to `'none'` (compose CardHeader/CardContent for spacing). */\n  padding?: CardPadding\n  /** Merge the card's classes/props onto the single child element instead of\n   * rendering a `<div>` (Radix-style `asChild`) — e.g.\n   * `<Card asChild><a href=\"/x\">…</a></Card>` for a clickable card. Expects\n   * exactly one React element child. */\n  asChild?: boolean\n}\n\n/**\n * Card -- a container with rounded corners, border, and shadow.\n */\nexport const Card = React.forwardRef<HTMLDivElement, CardProps>(\n  function Card({ className, variant, padding, asChild = false, ...props }, ref) {\n    const api = createCard()\n    const classes = cn(cardVariants({ variant, padding }), className)\n\n    if (asChild) {\n      return (\n        <Slot\n          ref={ref as React.Ref<HTMLElement>}\n          className={classes}\n          {...api.ariaProps}\n          {...api.dataAttributes}\n          {...props}\n        />\n      )\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={classes}\n        {...api.ariaProps}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardHeader -- top section of a card, typically contains title and description.\n */\nexport const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardHeader({ className, ...props }, ref) {\n    const api = createCardHeader()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardHeaderVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardTitle -- heading within a card header.\n */\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n  /** Heading element. Defaults to `h3`; pick the level that fits the page outline. */\n  as?: CardTitleLevel\n}\n\nexport const CardTitle = React.forwardRef<HTMLHeadingElement, CardTitleProps>(\n  function CardTitle({ className, as: Heading = 'h3', ...props }, ref) {\n    const api = createCardTitle()\n    return (\n      <Heading\n        ref={ref}\n        className={cn(cardTitleVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardDescription -- subtext within a card header.\n */\nexport const CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n  function CardDescription({ className, ...props }, ref) {\n    const api = createCardDescription()\n    return (\n      <p\n        ref={ref}\n        className={cn(cardDescriptionVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardContent -- main body content area of a card.\n */\nexport const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardContent({ className, ...props }, ref) {\n    const api = createCardContent()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardContentVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n\n/**\n * CardFooter -- bottom section of a card, typically contains actions.\n */\nexport const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  function CardFooter({ className, ...props }, ref) {\n    const api = createCardFooter()\n    return (\n      <div\n        ref={ref}\n        className={cn(cardFooterVariants(), className)}\n        {...api.dataAttributes}\n        {...props}\n      />\n    )\n  },\n)\n"],
+  "mappings": "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",
   "names": ["Card", "CardHeader", "CardTitle", "CardDescription", "CardContent", "CardFooter"]
 }

package/dist/react-carousel.js

@@ -5,7 +5,7 @@ import {
 import {
   cn,
   devWarn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-carousel/dist/index.js
 import * as React from "react";

package/dist/react-charts.js

@@ -1,6 +1,6 @@
 import {
   devWarn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../charts/dist/index.js
 function createLinearScale(domain, range) {

package/dist/react-checkbox.js

@@ -2,7 +2,7 @@ import {
   Keys,
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-checkbox/dist/index.js
 import * as React from "react";

package/dist/react-checklist.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-checklist/dist/index.js
 import * as React from "react";

package/dist/react-code-block.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-code-block/dist/index.js
 import * as React from "react";

package/dist/react-code-editor.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-code-editor/dist/index.js
 import * as React from "react";

package/dist/react-collapsible.js

@@ -5,7 +5,7 @@ import {
   cva,
   devWarn,
   generateId
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-collapsible/dist/index.js
 import * as React from "react";

package/dist/react-combobox.js

@@ -3,7 +3,7 @@ import {
   cva,
   devWarn,
   generateId
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-combobox/dist/index.js
 import * as React from "react";

package/dist/react-command-input.js

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-command-input/dist/index.js
 import { useRef, useEffect, useState, forwardRef } from "react";

package/dist/react-command.js

@@ -5,7 +5,7 @@ import {
   cva,
   devWarn,
   generateId
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-command/dist/index.js
 import * as React from "react";

package/dist/react-composer.js

@@ -1,16 +1,16 @@
 import {
   detectEmojiShortcode,
   detectTriggerInText
-} from "./chunk-BOLFYVI6.js";
+} from "./chunk-QPCKJ2YR.js";
 import {
   searchEmojis
-} from "./chunk-533MCMSU.js";
+} from "./chunk-3I3DYDHR.js";
 import {
   cn,
   cva,
   generateId,
   prefersReducedMotion
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-composer/dist/index.js
 import * as React2 from "react";

package/dist/react-content-protection.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-content-protection/dist/index.js
 import * as React from "react";

package/dist/react-conversation.js

@@ -1,18 +1,18 @@
 import {
   formatRelativeTime,
   formatTimestamp
-} from "./chunk-ONACRMG4.js";
+} from "./chunk-XMFNBOPO.js";
 import {
   MarkdownRenderer
-} from "./chunk-UNEM2TRI.js";
+} from "./chunk-SDAJVXD4.js";
 import {
   detectTriggerInText
-} from "./chunk-BOLFYVI6.js";
-import "./chunk-533MCMSU.js";
+} from "./chunk-QPCKJ2YR.js";
+import "./chunk-3I3DYDHR.js";
 import {
   cn,
   generateId
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-conversation/dist/index.js
 import * as React2 from "react";

package/dist/react-cookie-consent.js

@@ -1,6 +1,6 @@
 import {
   cn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-cookie-consent/dist/index.js
 import * as React2 from "react";

package/dist/react-data-table.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-data-table/dist/index.js
 import * as React from "react";

package/dist/react-date-picker.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-date-picker/dist/index.js
 import * as React from "react";

package/dist/react-device-frame.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-device-frame/dist/index.js
 import * as React from "react";

package/dist/react-dialog.js

@@ -2,12 +2,12 @@ import {
   createDialog,
   dialogContentVariants,
   overlayStyles
-} from "./chunk-VK3EQ34F.js";
+} from "./chunk-V24GDHUX.js";
 import {
   cn,
   createKeyboardHandler,
   devWarn
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-dialog/dist/index.js
 import * as React from "react";

package/dist/react-diff-viewer.js

@@ -1,7 +1,7 @@
 import {
   cn,
   cva
-} from "./chunk-ZF3OHCGV.js";
+} from "./chunk-2Q6HHFAN.js";
 
 // ../react-diff-viewer/dist/index.js
 import * as React from "react";
@@ -156,6 +156,9 @@ var diffViewerTokens = {
     sidebarBg: { variable: "--rfr-diff-sidebar-bg", fallback: "hsl(var(--muted))" },
     headerBg: { variable: "--rfr-diff-header-bg", fallback: "hsl(var(--muted))" },
     border: { variable: "--rfr-diff-border", fallback: "hsl(var(--border))" },
+    // Diff add/del colors are syntax semantics (like code highlighting), not
+    // theme status tones — deliberately NOT routed through the success/
+    // destructive tokens. The --rfr-diff-* variables are the theming seam.
     addBg: { variable: "--rfr-diff-add-bg", fallback: "rgba(46, 160, 67, 0.15)" },
     delBg: { variable: "--rfr-diff-del-bg", fallback: "rgba(248, 81, 73, 0.15)" },
     addFg: { variable: "--rfr-diff-add-fg", fallback: "#3fb950" },