@usetheo/ui 0.13.0 → 0.13.2

package/dist/chunk-BE232OKN.js

@@ -0,0 +1,42 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var QuickActionChips = forwardRef(
+  ({ className, actions, onSelect, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "quick-action-chips",
+      ref,
+      className: cn("flex flex-wrap items-center justify-center gap-2", className),
+      ...props,
+      children: actions.map((a) => {
+        const Icon = a.icon;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => onSelect?.(a.id),
+            className: cn(
+              "inline-flex h-9 items-center gap-2 rounded-full border px-4",
+              "font-medium font-sans text-body-sm",
+              "transition-[box-shadow,background-color,border-color,color] duration-base ease-out-soft",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+              a.primary ? "border-transparent bg-primary text-primary-foreground hover:shadow-glow" : "border-border/60 bg-card text-foreground hover:border-primary/40 hover:bg-muted"
+            ),
+            children: [
+              Icon ? /* @__PURE__ */ jsx(Icon, { className: "size-4" }) : null,
+              a.label
+            ]
+          },
+          a.id
+        );
+      })
+    }
+  )
+);
+QuickActionChips.displayName = "QuickActionChips";
+
+export { QuickActionChips };
+//# sourceMappingURL=chunk-BE232OKN.js.map
+//# sourceMappingURL=chunk-BE232OKN.js.map

package/dist/chunk-BE232OKN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/quick-action-chips/quick-action-chips.tsx"],"names":[],"mappings":";;;;AAyBA,IAAM,gBAAA,GAAmB,UAAA;AAAA,EACvB,CAAC,EAAE,SAAA,EAAW,OAAA,EAAS,UAAU,GAAG,KAAA,IAAS,GAAA,qBAC3C,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,oBAAA;AAAA,MACV,GAAA;AAAA,MACA,SAAA,EAAW,EAAA,CAAG,kDAAA,EAAoD,SAAS,CAAA;AAAA,MAC1E,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAA,KAAM;AAClB,QAAA,MAAM,OAAO,CAAA,CAAE,IAAA;AACf,QAAA,uBACE,IAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YAEC,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,MAAM,QAAA,GAAW,CAAA,CAAE,EAAE,CAAA;AAAA,YAC9B,SAAA,EAAW,EAAA;AAAA,cACT,6DAAA;AAAA,cACA,oCAAA;AAAA,cACA,yFAAA;AAAA,cACA,0IAAA;AAAA,cACA,CAAA,CAAE,UACE,yEAAA,GACA;AAAA,aACN;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,IAAA,mBAAO,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS,CAAA,GAAK,IAAA;AAAA,cACrC,CAAA,CAAE;AAAA;AAAA,WAAA;AAAA,UAdE,CAAA,CAAE;AAAA,SAeT;AAAA,MAEJ,CAAC;AAAA;AAAA;AAGP;AACA,gBAAA,CAAiB,WAAA,GAAc,kBAAA","file":"chunk-BE232OKN.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\nexport interface QuickAction {\n  id: string;\n  label: ReactNode;\n  /** Icon component (e.g. from lucide-react). */\n  icon?: IconComponent;\n  /** When true, the chip is highlighted as the suggested next action. */\n  primary?: boolean;\n}\n\ninterface QuickActionChipsProps extends Omit<HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  actions: QuickAction[];\n  onSelect?: (id: string) => void;\n}\n\n/**\n * QuickActionChips — row of intent chips below a hero composer.\n *\n * Used in Chat Home (\"Escrever / Aprender / Código / Assuntos pessoais\")\n * and the Files panel.\n */\nconst QuickActionChips = forwardRef<HTMLDivElement, QuickActionChipsProps>(\n  ({ className, actions, onSelect, ...props }, ref) => (\n    <div\n      data-slot=\"quick-action-chips\"\n      ref={ref}\n      className={cn(\"flex flex-wrap items-center justify-center gap-2\", className)}\n      {...props}\n    >\n      {actions.map((a) => {\n        const Icon = a.icon;\n        return (\n          <button\n            key={a.id}\n            type=\"button\"\n            onClick={() => onSelect?.(a.id)}\n            className={cn(\n              \"inline-flex h-9 items-center gap-2 rounded-full border px-4\",\n              \"font-medium font-sans text-body-sm\",\n              \"transition-[box-shadow,background-color,border-color,color] duration-base ease-out-soft\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n              a.primary\n                ? \"border-transparent bg-primary text-primary-foreground hover:shadow-glow\"\n                : \"border-border/60 bg-card text-foreground hover:border-primary/40 hover:bg-muted\",\n            )}\n          >\n            {Icon ? <Icon className=\"size-4\" /> : null}\n            {a.label}\n          </button>\n        );\n      })}\n    </div>\n  ),\n);\nQuickActionChips.displayName = \"QuickActionChips\";\n\nexport { QuickActionChips };\n"]}

package/dist/chunk-BSF4Y4UT.js

@@ -0,0 +1,77 @@
+import { cn } from './chunk-EWDN56AS.js';
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { Pencil, ChevronDown, Check } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var IntentSelector = forwardRef(
+  ({ className, value, options, onChange, ...props }, ref) => {
+    const current = options.find((o) => o.id === value) ?? options[0];
+    const Icon = current?.icon ?? Pencil;
+    return /* @__PURE__ */ jsxs(DropdownMenu.Root, { children: [
+      /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          "data-slot": "intent-selector",
+          ref,
+          type: "button",
+          className: cn(
+            "inline-flex h-8 items-center gap-2 rounded-full border border-border/60 bg-card px-3",
+            "font-medium font-sans text-body-sm text-foreground",
+            "transition-colors duration-base ease-out-soft",
+            "hover:bg-muted",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+            className
+          ),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx(Icon, { className: "size-3.5 text-primary", "aria-hidden": "true" }),
+            current?.label ?? "Select intent",
+            /* @__PURE__ */ jsx(ChevronDown, { className: "size-3 text-muted-foreground", "aria-hidden": "true" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsx(DropdownMenu.Portal, { children: /* @__PURE__ */ jsx(
+        DropdownMenu.Content,
+        {
+          sideOffset: 6,
+          align: "start",
+          className: cn(
+            "z-50 min-w-[16rem] overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-md",
+            "data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in",
+            "data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out"
+          ),
+          children: options.map((opt) => {
+            const OptIcon = opt.icon ?? Pencil;
+            return /* @__PURE__ */ jsxs(
+              DropdownMenu.Item,
+              {
+                onSelect: () => onChange?.(opt.id),
+                className: cn(
+                  "flex cursor-pointer items-start gap-3 rounded-md px-2 py-2",
+                  "text-body-sm",
+                  "focus:bg-muted focus:outline-none",
+                  "data-[highlighted]:bg-muted"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(OptIcon, { className: "mt-0.5 size-4 shrink-0 text-primary", "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsxs("span", { className: "flex flex-1 flex-col", children: [
+                    /* @__PURE__ */ jsx("span", { className: "font-medium", children: opt.label }),
+                    opt.description ? /* @__PURE__ */ jsx("span", { className: "text-label text-muted-foreground", children: opt.description }) : null
+                  ] }),
+                  opt.id === value ? /* @__PURE__ */ jsx(Check, { className: "mt-0.5 size-3.5 shrink-0 text-primary" }) : null
+                ]
+              },
+              opt.id
+            );
+          })
+        }
+      ) })
+    ] });
+  }
+);
+IntentSelector.displayName = "IntentSelector";
+
+export { IntentSelector };
+//# sourceMappingURL=chunk-BSF4Y4UT.js.map
+//# sourceMappingURL=chunk-BSF4Y4UT.js.map

package/dist/chunk-BSF4Y4UT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/intent-selector/intent-selector.tsx"],"names":[],"mappings":"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","file":"chunk-BSF4Y4UT.js","sourcesContent":["import * as DropdownMenu from \"@radix-ui/react-dropdown-menu\";\nimport { Check, ChevronDown, Pencil } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { ButtonHTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { IconComponent } from \"../../../lib/types.js\";\n\nexport interface IntentOption {\n  id: string;\n  label: string;\n  /** Optional one-liner shown below the label in the menu. */\n  description?: string;\n  /** Optional icon — defaults to a pencil for the trigger if none. */\n  icon?: IconComponent;\n}\n\ninterface IntentSelectorProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  value: string;\n  options: IntentOption[];\n  onChange?: (id: string) => void;\n}\n\n/**\n * IntentSelector — chip dropdown for picking the agent's intent for the next\n * turn (e.g. edit / plan / review). Mirrors ModelSelector: pill trigger +\n * Radix DropdownMenu of options with description and a check on the active.\n */\nconst IntentSelector = forwardRef<HTMLButtonElement, IntentSelectorProps>(\n  ({ className, value, options, onChange, ...props }, ref) => {\n    const current = options.find((o) => o.id === value) ?? options[0];\n    const Icon = current?.icon ?? Pencil;\n    return (\n      <DropdownMenu.Root>\n        <DropdownMenu.Trigger asChild>\n          <button\n            data-slot=\"intent-selector\"\n            ref={ref}\n            type=\"button\"\n            className={cn(\n              \"inline-flex h-8 items-center gap-2 rounded-full border border-border/60 bg-card px-3\",\n              \"font-medium font-sans text-body-sm text-foreground\",\n              \"transition-colors duration-base ease-out-soft\",\n              \"hover:bg-muted\",\n              \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n              className,\n            )}\n            {...props}\n          >\n            <Icon className=\"size-3.5 text-primary\" aria-hidden=\"true\" />\n            {current?.label ?? \"Select intent\"}\n            <ChevronDown className=\"size-3 text-muted-foreground\" aria-hidden=\"true\" />\n          </button>\n        </DropdownMenu.Trigger>\n        <DropdownMenu.Portal>\n          <DropdownMenu.Content\n            sideOffset={6}\n            align=\"start\"\n            className={cn(\n              \"z-50 min-w-[16rem] overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-md\",\n              \"data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:animate-in\",\n              \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:animate-out\",\n            )}\n          >\n            {options.map((opt) => {\n              const OptIcon = opt.icon ?? Pencil;\n              return (\n                <DropdownMenu.Item\n                  key={opt.id}\n                  onSelect={() => onChange?.(opt.id)}\n                  className={cn(\n                    \"flex cursor-pointer items-start gap-3 rounded-md px-2 py-2\",\n                    \"text-body-sm\",\n                    \"focus:bg-muted focus:outline-none\",\n                    \"data-[highlighted]:bg-muted\",\n                  )}\n                >\n                  <OptIcon className=\"mt-0.5 size-4 shrink-0 text-primary\" aria-hidden=\"true\" />\n                  <span className=\"flex flex-1 flex-col\">\n                    <span className=\"font-medium\">{opt.label}</span>\n                    {opt.description ? (\n                      <span className=\"text-label text-muted-foreground\">{opt.description}</span>\n                    ) : null}\n                  </span>\n                  {opt.id === value ? (\n                    <Check className=\"mt-0.5 size-3.5 shrink-0 text-primary\" />\n                  ) : null}\n                </DropdownMenu.Item>\n              );\n            })}\n          </DropdownMenu.Content>\n        </DropdownMenu.Portal>\n      </DropdownMenu.Root>\n    );\n  },\n);\nIntentSelector.displayName = \"IntentSelector\";\n\nexport { IntentSelector };\n"]}

package/dist/chunk-BYUWQ6OP.js

@@ -0,0 +1,45 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { cva } from 'class-variance-authority';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var inputVariants = cva(
+  [
+    "flex w-full rounded-md border border-input bg-card",
+    "text-foreground placeholder:text-muted-foreground",
+    "transition-[box-shadow,border-color] duration-base ease-out-soft",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    "focus-visible:border-primary",
+    "disabled:cursor-not-allowed disabled:opacity-50",
+    "file:border-0 file:bg-transparent file:font-medium file:text-body-sm"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-8 px-2.5 py-1 text-body-sm",
+        // md: density-tunable via CSS var. Comfortable (default) = 36px.
+        md: "h-[var(--theo-control-h,2.25rem)] px-[var(--theo-control-px,0.875rem)] py-1.5 text-body-sm",
+        lg: "h-11 px-4 py-2.5 text-body-md"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+);
+var Input = forwardRef(
+  ({ className, type = "text", size, ...props }, ref) => /* @__PURE__ */ jsx(
+    "input",
+    {
+      "data-slot": "input",
+      "data-size": size,
+      ref,
+      type,
+      className: cn(inputVariants({ size }), className),
+      ...props
+    }
+  )
+);
+Input.displayName = "Input";
+
+export { Input };
+//# sourceMappingURL=chunk-BYUWQ6OP.js.map
+//# sourceMappingURL=chunk-BYUWQ6OP.js.map

package/dist/chunk-BYUWQ6OP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/input/input.tsx"],"names":[],"mappings":";;;;;AAKA,IAAM,aAAA,GAAgB,GAAA;AAAA,EACpB;AAAA,IACE,oDAAA;AAAA,IACA,mDAAA;AAAA,IACA,kEAAA;AAAA,IACA,0IAAA;AAAA,IACA,8BAAA;AAAA,IACA,iDAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,8BAAA;AAAA;AAAA,QAEJ,EAAA,EAAI,4FAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB,EAAE,IAAA,EAAM,IAAA;AAAK;AAElC,CAAA;AAqBA,IAAM,KAAA,GAAQ,UAAA;AAAA,EACZ,CAAC,EAAE,SAAA,EAAW,IAAA,GAAO,QAAQ,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,qBAC7C,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,OAAA;AAAA,MACV,WAAA,EAAW,IAAA;AAAA,MACX,GAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MAC/C,GAAG;AAAA;AAAA;AAGV;AACA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-BYUWQ6OP.js","sourcesContent":["import { type VariantProps, cva } from \"class-variance-authority\";\nimport { forwardRef } from \"react\";\nimport type { InputHTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\nconst inputVariants = cva(\n  [\n    \"flex w-full rounded-md border border-input bg-card\",\n    \"text-foreground placeholder:text-muted-foreground\",\n    \"transition-[box-shadow,border-color] duration-base ease-out-soft\",\n    \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n    \"focus-visible:border-primary\",\n    \"disabled:cursor-not-allowed disabled:opacity-50\",\n    \"file:border-0 file:bg-transparent file:font-medium file:text-body-sm\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"h-8 px-2.5 py-1 text-body-sm\",\n        // md: density-tunable via CSS var. Comfortable (default) = 36px.\n        md: \"h-[var(--theo-control-h,2.25rem)] px-[var(--theo-control-px,0.875rem)] py-1.5 text-body-sm\",\n        lg: \"h-11 px-4 py-2.5 text-body-md\",\n      },\n    },\n    defaultVariants: { size: \"md\" },\n  },\n);\n\n/**\n * Input — text input primitive.\n *\n * Violet Forge specifics:\n *   - height 40px (h-10) matching default Button md.\n *   - rounded-md (6px) — slightly less than buttons to differentiate.\n *   - focus uses violet ring (--ring).\n *   - placeholder uses --muted-foreground.\n *\n * The `size` prop accepts `\"sm\" | \"md\" | \"lg\"`. Default `md` preserves the\n * 40px tall input from before this prop existed. EC-1 (edge-case review):\n * this overrides the native HTML `size` attribute (text-input columns) —\n * use `{...{ size: 20 } as any}` if you genuinely need the HTML attribute,\n * which is exceedingly rare.\n */\nexport interface InputProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n    VariantProps<typeof inputVariants> {}\n\nconst Input = forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type = \"text\", size, ...props }, ref) => (\n    <input\n      data-slot=\"input\"\n      data-size={size}\n      ref={ref}\n      type={type}\n      className={cn(inputVariants({ size }), className)}\n      {...props}\n    />\n  ),\n);\nInput.displayName = \"Input\";\n\nexport { Input, inputVariants };\n"]}

package/dist/chunk-C5ULP2P5.js

@@ -0,0 +1,140 @@
+"use client";
+import { cn } from './chunk-EWDN56AS.js';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { AlertCircle } from 'lucide-react';
+import { createContext, forwardRef, useId, Children, isValidElement, cloneElement, useContext } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var FormFieldContext = createContext(null);
+function useFormField() {
+  const ctx = useContext(FormFieldContext);
+  if (!ctx) throw new Error("FormField subcomponents must be inside <FormField>.");
+  return ctx;
+}
+var rootGapBySize = {
+  sm: "gap-1",
+  md: "gap-1.5",
+  lg: "gap-2"
+};
+var FormFieldRoot = forwardRef(
+  ({ className, id: idProp, invalid, size = "md", ...props }, ref) => {
+    const auto = useId();
+    const fieldId = idProp ?? `field-${auto}`;
+    const ctx = {
+      fieldId,
+      hintId: `${fieldId}-hint`,
+      errorId: `${fieldId}-error`,
+      hasError: !!invalid,
+      size
+    };
+    return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "form-field",
+        ref,
+        className: cn("grid", rootGapBySize[size], className),
+        ...props
+      }
+    ) });
+  }
+);
+FormFieldRoot.displayName = "FormField";
+var labelFontBySize = {
+  sm: "text-label-caps",
+  md: "text-body-sm",
+  lg: "text-body-md"
+};
+var hintFontBySize = {
+  sm: "text-label-caps",
+  md: "text-body-sm",
+  lg: "text-body-md"
+};
+var FormFieldLabel = forwardRef(
+  ({ className, required, children, ...props }, ref) => {
+    const { fieldId, size } = useFormField();
+    return /* @__PURE__ */ jsxs(
+      LabelPrimitive.Root,
+      {
+        "data-slot": "form-field-label",
+        ref,
+        htmlFor: fieldId,
+        className: cn(
+          "inline-flex items-center gap-1 font-medium font-sans text-foreground",
+          labelFontBySize[size],
+          "peer-disabled:cursor-not-allowed peer-disabled:opacity-60",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          required ? /* @__PURE__ */ jsx("span", { className: "text-destructive", "aria-hidden": "true", children: "*" }) : null
+        ]
+      }
+    );
+  }
+);
+FormFieldLabel.displayName = "FormField.Label";
+var FormFieldControl = forwardRef(
+  ({ children, ...props }, ref) => {
+    const { fieldId, hintId, errorId, hasError } = useFormField();
+    const described = hasError ? errorId : hintId;
+    const only = Children.only(children);
+    const cloned = isValidElement(only) ? cloneElement(only, {
+      id: fieldId,
+      "aria-describedby": described,
+      "aria-invalid": hasError || void 0
+    }) : only;
+    return /* @__PURE__ */ jsx("div", { "data-slot": "form-field-control", ref, ...props, children: cloned });
+  }
+);
+FormFieldControl.displayName = "FormField.Control";
+var FormFieldHint = forwardRef(
+  ({ className, children, ...props }, ref) => {
+    const { hintId, hasError, size } = useFormField();
+    if (hasError) return null;
+    return /* @__PURE__ */ jsx(
+      "p",
+      {
+        "data-slot": "form-field-hint",
+        ref,
+        id: hintId,
+        className: cn("text-muted-foreground", hintFontBySize[size], className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+FormFieldHint.displayName = "FormField.Hint";
+var FormFieldError = forwardRef(
+  ({ className, children, ...props }, ref) => {
+    const { errorId, hasError, size } = useFormField();
+    if (!hasError) return null;
+    return /* @__PURE__ */ jsxs(
+      "p",
+      {
+        "data-slot": "form-field-error",
+        ref,
+        id: errorId,
+        role: "alert",
+        className: cn("flex items-center gap-1 text-destructive", hintFontBySize[size], className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(AlertCircle, { className: "size-3.5 shrink-0", "aria-hidden": "true" }),
+          children
+        ]
+      }
+    );
+  }
+);
+FormFieldError.displayName = "FormField.Error";
+var FormField = /* @__PURE__ */ Object.assign(FormFieldRoot, {
+  Label: FormFieldLabel,
+  Control: FormFieldControl,
+  Hint: FormFieldHint,
+  Error: FormFieldError
+});
+
+export { FormField };
+//# sourceMappingURL=chunk-C5ULP2P5.js.map
+//# sourceMappingURL=chunk-C5ULP2P5.js.map

package/dist/chunk-C5ULP2P5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/form-field/form-field.tsx"],"names":[],"mappings":"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","file":"chunk-C5ULP2P5.js","sourcesContent":["\"use client\";\n\nimport * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { AlertCircle } from \"lucide-react\";\nimport {\n  Children,\n  cloneElement,\n  createContext,\n  forwardRef,\n  isValidElement,\n  useContext,\n  useId,\n} from \"react\";\nimport type {\n  ComponentPropsWithoutRef,\n  ElementRef,\n  HTMLAttributes,\n  ReactElement,\n  ReactNode,\n} from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * FormField — composition wrapper for accessible form rows.\n *\n * Provides context with a generated `id`, so children (Label, Input, Hint,\n * Error) wire themselves via `htmlFor` / `id` / `aria-describedby` without\n * the consumer having to thread IDs manually.\n *\n * Composition:\n *   <FormField>\n *     <FormField.Label required>Email</FormField.Label>\n *     <FormField.Control>\n *       <Input type=\"email\" placeholder=\"…\" />\n *     </FormField.Control>\n *     <FormField.Hint>We never share your email.</FormField.Hint>\n *     <FormField.Error>{error}</FormField.Error>\n *   </FormField>\n *\n * Errors take precedence over hints (only one of them shows at once).\n */\n\ntype FormFieldSize = \"sm\" | \"md\" | \"lg\";\n\ninterface FormFieldContextValue {\n  fieldId: string;\n  hintId: string;\n  errorId: string;\n  hasError: boolean;\n  size: FormFieldSize;\n}\n\nconst FormFieldContext = createContext<FormFieldContextValue | null>(null);\n\nfunction useFormField(): FormFieldContextValue {\n  const ctx = useContext(FormFieldContext);\n  if (!ctx) throw new Error(\"FormField subcomponents must be inside <FormField>.\");\n  return ctx;\n}\n\ninterface FormFieldProps extends HTMLAttributes<HTMLDivElement> {\n  /** Optional explicit id override. */\n  id?: string;\n  /** Marks the field as invalid; switches Hint → Error and toggles aria. */\n  invalid?: boolean;\n  /**\n   * Size scale propagated to Label / Hint / Error subparts via Context.\n   * Default `md` preserves prior behavior. Subparts do NOT accept a `size`\n   * prop of their own — use `className` for granular tweaks (EC-8).\n   */\n  size?: FormFieldSize;\n}\n\nconst rootGapBySize: Record<FormFieldSize, string> = {\n  sm: \"gap-1\",\n  md: \"gap-1.5\",\n  lg: \"gap-2\",\n};\n\nconst FormFieldRoot = forwardRef<HTMLDivElement, FormFieldProps>(\n  ({ className, id: idProp, invalid, size = \"md\", ...props }, ref) => {\n    const auto = useId();\n    const fieldId = idProp ?? `field-${auto}`;\n    const ctx: FormFieldContextValue = {\n      fieldId,\n      hintId: `${fieldId}-hint`,\n      errorId: `${fieldId}-error`,\n      hasError: !!invalid,\n      size,\n    };\n    return (\n      <FormFieldContext.Provider value={ctx}>\n        <div\n          data-slot=\"form-field\"\n          ref={ref}\n          className={cn(\"grid\", rootGapBySize[size], className)}\n          {...props}\n        />\n      </FormFieldContext.Provider>\n    );\n  },\n);\nFormFieldRoot.displayName = \"FormField\";\n\nconst labelFontBySize: Record<FormFieldSize, string> = {\n  sm: \"text-label-caps\",\n  md: \"text-body-sm\",\n  lg: \"text-body-md\",\n};\n\nconst hintFontBySize: Record<FormFieldSize, string> = {\n  sm: \"text-label-caps\",\n  md: \"text-body-sm\",\n  lg: \"text-body-md\",\n};\n\ninterface FormFieldLabelProps extends ComponentPropsWithoutRef<typeof LabelPrimitive.Root> {\n  required?: boolean;\n}\n\n// Inlined label markup (was importing `<Label>` from sibling primitive).\n// BLOCKER-001 / D2: form-field stays in primitives/ but cannot cross-import.\n// Uses the same Radix LabelPrimitive primitive that the standalone `<Label>`\n// uses, with identical Tailwind tokens — visual parity is preserved.\nconst FormFieldLabel = forwardRef<ElementRef<typeof LabelPrimitive.Root>, FormFieldLabelProps>(\n  ({ className, required, children, ...props }, ref) => {\n    const { fieldId, size } = useFormField();\n    return (\n      <LabelPrimitive.Root\n        data-slot=\"form-field-label\"\n        ref={ref}\n        htmlFor={fieldId}\n        className={cn(\n          \"inline-flex items-center gap-1 font-medium font-sans text-foreground\",\n          labelFontBySize[size],\n          \"peer-disabled:cursor-not-allowed peer-disabled:opacity-60\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {required ? (\n          <span className=\"text-destructive\" aria-hidden=\"true\">\n            *\n          </span>\n        ) : null}\n      </LabelPrimitive.Root>\n    );\n  },\n);\nFormFieldLabel.displayName = \"FormField.Label\";\n\nconst FormFieldControl = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ children, ...props }, ref) => {\n    const { fieldId, hintId, errorId, hasError } = useFormField();\n    const described = hasError ? errorId : hintId;\n    // Children.only enforces exactly one child element (the form control) so we\n    // can safely clone it with the wiring props (id + aria-describedby + aria-invalid).\n    // The previous implementation spread the element object directly which relied\n    // on React's internal `$$typeof` invariant and silently dropped `ref` — the\n    // cloneElement path preserves both `ref` and `key`.\n    const only = Children.only(children) as ReactElement;\n    const cloned = isValidElement(only)\n      ? cloneElement(only, {\n          id: fieldId,\n          \"aria-describedby\": described,\n          \"aria-invalid\": hasError || undefined,\n        } as Partial<typeof only.props>)\n      : only;\n    return (\n      <div data-slot=\"form-field-control\" ref={ref} {...props}>\n        {cloned}\n      </div>\n    );\n  },\n);\nFormFieldControl.displayName = \"FormField.Control\";\n\nconst FormFieldHint = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(\n  ({ className, children, ...props }, ref) => {\n    const { hintId, hasError, size } = useFormField();\n    if (hasError) return null;\n    return (\n      <p\n        data-slot=\"form-field-hint\"\n        ref={ref}\n        id={hintId}\n        className={cn(\"text-muted-foreground\", hintFontBySize[size], className)}\n        {...props}\n      >\n        {children}\n      </p>\n    );\n  },\n);\nFormFieldHint.displayName = \"FormField.Hint\";\n\nconst FormFieldError = forwardRef<HTMLParagraphElement, HTMLAttributes<HTMLParagraphElement>>(\n  ({ className, children, ...props }, ref) => {\n    const { errorId, hasError, size } = useFormField();\n    if (!hasError) return null;\n    return (\n      <p\n        data-slot=\"form-field-error\"\n        ref={ref}\n        id={errorId}\n        role=\"alert\"\n        className={cn(\"flex items-center gap-1 text-destructive\", hintFontBySize[size], className)}\n        {...props}\n      >\n        <AlertCircle className=\"size-3.5 shrink-0\" aria-hidden=\"true\" />\n        {children as ReactNode}\n      </p>\n    );\n  },\n);\nFormFieldError.displayName = \"FormField.Error\";\n\nconst FormField = /*#__PURE__*/ Object.assign(FormFieldRoot, {\n  Label: FormFieldLabel,\n  Control: FormFieldControl,\n  Hint: FormFieldHint,\n  Error: FormFieldError,\n});\n\nexport { FormField };\n"]}

package/dist/chunk-CCG7PXLX.js

@@ -0,0 +1,24 @@
+import { LiveRegionProvider } from './chunk-UGKI466V.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var ChatThread = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(LiveRegionProvider, { value: true, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "chat-thread",
+      ref,
+      role: "log",
+      "aria-live": "polite",
+      "aria-relevant": "additions",
+      className: cn("flex flex-col gap-6", className),
+      ...props
+    }
+  ) })
+);
+ChatThread.displayName = "ChatThread";
+
+export { ChatThread };
+//# sourceMappingURL=chunk-CCG7PXLX.js.map
+//# sourceMappingURL=chunk-CCG7PXLX.js.map

package/dist/chunk-CCG7PXLX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/chat-thread/chat-thread.tsx"],"names":[],"mappings":";;;;;AAcA,IAAM,UAAA,GAAa,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,GAAG,KAAA,IAAS,GAAA,qBACxB,GAAA,CAAC,kBAAA,EAAA,EAAmB,KAAA,EAAO,IAAA,EACzB,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,aAAA;AAAA,MACV,GAAA;AAAA,MACA,IAAA,EAAK,KAAA;AAAA,MACL,WAAA,EAAU,QAAA;AAAA,MACV,eAAA,EAAc,WAAA;AAAA,MACd,SAAA,EAAW,EAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAC7C,GAAG;AAAA;AAAA,GACN,EACF;AAEJ;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-CCG7PXLX.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { LiveRegionProvider } from \"../../../lib/live-region-context.js\";\n\n/**\n * ChatThread — simple vertical container that applies spacing + scroll.\n *\n * No virtualization or stickiness. Wrap with your own scroller for long threads.\n *\n * T4.1 (MF-4): declares the outer live region and wraps children in\n * LiveRegionProvider so nested AgentStreaming / AgentErrorCard / Skeleton\n * don't add their own aria-live (double-announcement avoided).\n */\nconst ChatThread = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <LiveRegionProvider value={true}>\n      <div\n        data-slot=\"chat-thread\"\n        ref={ref}\n        role=\"log\"\n        aria-live=\"polite\"\n        aria-relevant=\"additions\"\n        className={cn(\"flex flex-col gap-6\", className)}\n        {...props}\n      />\n    </LiveRegionProvider>\n  ),\n);\nChatThread.displayName = \"ChatThread\";\n\nexport { ChatThread };\n"]}

package/dist/chunk-CFVSXYVT.js

@@ -0,0 +1,59 @@
+import { Card } from './chunk-UJAWV6LM.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { TrendingUp, TrendingDown, Minus } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function trendColor(trend, invert) {
+  if (trend === "neutral") return "text-muted-foreground";
+  const isPositive = invert ? trend === "down" : trend === "up";
+  return isPositive ? "text-success" : "text-destructive";
+}
+function TrendIcon({ trend, className }) {
+  if (trend === "up") return /* @__PURE__ */ jsx(TrendingUp, { className: cn("size-3.5", className), "aria-hidden": true });
+  if (trend === "down") return /* @__PURE__ */ jsx(TrendingDown, { className: cn("size-3.5", className), "aria-hidden": true });
+  return /* @__PURE__ */ jsx(Minus, { className: cn("size-3.5", className), "aria-hidden": true });
+}
+var MetricCard = forwardRef(
+  ({ title, value, delta, hint, icon, invertTrend = false, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      Card,
+      {
+        "data-slot": "metric-card",
+        ref,
+        className: cn("@container/metric-card flex w-full flex-col gap-2 p-4", className),
+        "data-testid": "metric-card",
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: title }),
+            icon !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: icon })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "font-semibold @sm/metric-card:text-3xl text-2xl text-foreground tracking-tight", children: value }),
+          (delta !== void 0 || hint !== void 0) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs", children: [
+            delta !== void 0 && /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: cn(
+                  "inline-flex items-center gap-1 font-medium",
+                  trendColor(delta.trend, invertTrend)
+                ),
+                "data-trend": delta.trend,
+                children: [
+                  /* @__PURE__ */ jsx(TrendIcon, { trend: delta.trend }),
+                  delta.value
+                ]
+              }
+            ),
+            hint !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: hint })
+          ] })
+        ]
+      }
+    );
+  }
+);
+MetricCard.displayName = "MetricCard";
+
+export { MetricCard };
+//# sourceMappingURL=chunk-CFVSXYVT.js.map
+//# sourceMappingURL=chunk-CFVSXYVT.js.map

package/dist/chunk-CFVSXYVT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/metric-card/metric-card.tsx"],"names":[],"mappings":";;;;;;AAsDA,SAAS,UAAA,CAAW,OAAwB,MAAA,EAAyB;AACnE,EAAA,IAAI,KAAA,KAAU,WAAW,OAAO,uBAAA;AAChC,EAAA,MAAM,UAAA,GAAa,MAAA,GAAS,KAAA,KAAU,MAAA,GAAS,KAAA,KAAU,IAAA;AACzD,EAAA,OAAO,aAAa,cAAA,GAAiB,kBAAA;AACvC;AAEA,SAAS,SAAA,CAAU,EAAE,KAAA,EAAO,SAAA,EAAU,EAAmD;AACvF,EAAA,IAAI,KAAA,KAAU,IAAA,EAAM,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,EAAA,CAAG,UAAA,EAAY,SAAS,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AACzF,EAAA,IAAI,KAAA,KAAU,MAAA,EAAQ,uBAAO,GAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAW,EAAA,CAAG,UAAA,EAAY,SAAS,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AAC7F,EAAA,uBAAO,GAAA,CAAC,SAAM,SAAA,EAAW,EAAA,CAAG,YAAY,SAAS,CAAA,EAAG,eAAW,IAAA,EAAC,CAAA;AAClE;AAEO,IAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,KAAA,EAAO,IAAA,EAAM,IAAA,EAAM,WAAA,GAAc,KAAA,EAAO,SAAA,EAAW,GAAG,IAAA,IAAQ,GAAA,KAAQ;AACrF,IAAA,uBACE,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAU,aAAA;AAAA,QACV,GAAA;AAAA,QAQA,SAAA,EAAW,EAAA,CAAG,uDAAA,EAAyD,SAAS,CAAA;AAAA,QAChF,aAAA,EAAY,aAAA;AAAA,QACX,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wCAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mEAAA,EACb,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,YACC,IAAA,KAAS,0BACR,GAAA,CAAC,MAAA,EAAA,EAAK,WAAU,uBAAA,EAAwB,aAAA,EAAW,MAChD,QAAA,EAAA,IAAA,EACH;AAAA,WAAA,EAEJ,CAAA;AAAA,0BAEA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gFAAA,EACZ,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAAA,CACE,UAAU,MAAA,IAAa,IAAA,KAAS,2BAChC,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,iCAAA,EACZ,QAAA,EAAA;AAAA,YAAA,KAAA,KAAU,MAAA,oBACT,IAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,EAAA;AAAA,kBACT,4CAAA;AAAA,kBACA,UAAA,CAAW,KAAA,CAAM,KAAA,EAAO,WAAW;AAAA,iBACrC;AAAA,gBACA,cAAY,KAAA,CAAM,KAAA;AAAA,gBAElB,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,SAAA,EAAA,EAAU,KAAA,EAAO,KAAA,CAAM,KAAA,EAAO,CAAA;AAAA,kBAC9B,KAAA,CAAM;AAAA;AAAA;AAAA,aACT;AAAA,YAED,SAAS,MAAA,oBAAa,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAyB,QAAA,EAAA,IAAA,EAAK;AAAA,WAAA,EACvE;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-CFVSXYVT.js","sourcesContent":["import { Minus, TrendingDown, TrendingUp } from \"lucide-react\";\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { cn } from \"../../../lib/cn.js\";\nimport { Card } from \"../../primitives/card/index.js\";\n\n/**\n * MetricCard — dashboard metric tile (composite).\n *\n * Pattern recurrente \"Card + CardHeader + value + delta + trend icon\" promoted\n * to a first-class composite per ADR-0007 community-best-practices plan.\n *\n * Trend → token mapping (default `invertTrend=false`):\n *   up    → text-success     (positive growth)\n *   down  → text-destructive (negative growth)\n *   neutral → text-muted-foreground\n *\n * EC-17 absorbed: pass `invertTrend` for metrics where \"up is bad\" (cost,\n * churn, latency). The mapping inverts cleanly:\n *   up    → text-destructive (cost growing = bad)\n *   down  → text-success     (cost dropping = good)\n *\n * @example\n *   <MetricCard title=\"Revenue\" value=\"$12,345\" delta={{ value: \"+12%\", trend: \"up\" }} />\n *   <MetricCard title=\"Monthly Cost\" value=\"$3,200\" delta={{ value: \"+18%\", trend: \"up\" }} invertTrend />\n */\n\nexport type MetricCardTrend = \"up\" | \"down\" | \"neutral\";\n\nexport interface MetricCardDelta {\n  /** Display text (e.g., `\"+12%\"`, `\"-3.4 pp\"`, `\"unchanged\"`). */\n  value: string;\n  /** Trend direction — drives icon and color (subject to `invertTrend`). */\n  trend: MetricCardTrend;\n}\n\nexport interface MetricCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Metric label (e.g., \"Revenue\", \"Active Users\"). */\n  title: string;\n  /** Headline value (e.g., \"$12,345\", \"1,234\"). */\n  value: ReactNode;\n  /** Optional delta with trend direction. */\n  delta?: MetricCardDelta;\n  /** Optional subtle context line below the value (e.g., \"vs last month\"). */\n  hint?: ReactNode;\n  /** Optional icon rendered top-right (e.g., `<DollarSign />`). */\n  icon?: ReactNode;\n  /**\n   * EC-17: invert default trend semantics. Use for Cost / Churn / Latency\n   * metrics where \"up\" is bad. Default `false` (Revenue / Users / Conversions).\n   */\n  invertTrend?: boolean;\n}\n\nfunction trendColor(trend: MetricCardTrend, invert: boolean): string {\n  if (trend === \"neutral\") return \"text-muted-foreground\";\n  const isPositive = invert ? trend === \"down\" : trend === \"up\";\n  return isPositive ? \"text-success\" : \"text-destructive\";\n}\n\nfunction TrendIcon({ trend, className }: { trend: MetricCardTrend; className?: string }) {\n  if (trend === \"up\") return <TrendingUp className={cn(\"size-3.5\", className)} aria-hidden />;\n  if (trend === \"down\") return <TrendingDown className={cn(\"size-3.5\", className)} aria-hidden />;\n  return <Minus className={cn(\"size-3.5\", className)} aria-hidden />;\n}\n\nexport const MetricCard = forwardRef<HTMLDivElement, MetricCardProps>(\n  ({ title, value, delta, hint, icon, invertTrend = false, className, ...rest }, ref) => {\n    return (\n      <Card\n        data-slot=\"metric-card\"\n        ref={ref}\n        // T5.5: `@container/metric-card` makes the tile responsive to its PARENT\n        // width, not the viewport. Consumers can drop multiple cards into any\n        // grid and child elements scale via `@sm:`, `@md:`, `@lg:` variants.\n        // `w-full` is the right default for a tile: consumers always wrap in a\n        // grid/flex parent (grid-cols-N, flex). Without it, the flex-col card\n        // collapses to min-content (~150px) when used in isolation — a real\n        // regression observed in the docs site preview pane.\n        className={cn(\"@container/metric-card flex w-full flex-col gap-2 p-4\", className)}\n        data-testid=\"metric-card\"\n        {...rest}\n      >\n        <div className=\"flex items-start justify-between gap-3\">\n          <span className=\"font-medium text-muted-foreground text-xs uppercase tracking-wide\">\n            {title}\n          </span>\n          {icon !== undefined && (\n            <span className=\"text-muted-foreground\" aria-hidden>\n              {icon}\n            </span>\n          )}\n        </div>\n        {/* Value scales 2xl → 3xl when the card container exceeds 18rem. */}\n        <div className=\"font-semibold @sm/metric-card:text-3xl text-2xl text-foreground tracking-tight\">\n          {value}\n        </div>\n        {(delta !== undefined || hint !== undefined) && (\n          <div className=\"flex items-center gap-2 text-xs\">\n            {delta !== undefined && (\n              <span\n                className={cn(\n                  \"inline-flex items-center gap-1 font-medium\",\n                  trendColor(delta.trend, invertTrend),\n                )}\n                data-trend={delta.trend}\n              >\n                <TrendIcon trend={delta.trend} />\n                {delta.value}\n              </span>\n            )}\n            {hint !== undefined && <span className=\"text-muted-foreground\">{hint}</span>}\n          </div>\n        )}\n      </Card>\n    );\n  },\n);\nMetricCard.displayName = \"MetricCard\";\n"]}

package/dist/chunk-CGWIOIEO.js

@@ -0,0 +1,27 @@
+import { useInLiveRegion } from './chunk-UGKI466V.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var Skeleton = forwardRef(
+  ({ className, ...props }, ref) => {
+    const inLiveRegion = useInLiveRegion();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "skeleton",
+        ref,
+        role: inLiveRegion ? void 0 : "status",
+        "aria-live": inLiveRegion ? void 0 : "polite",
+        "aria-label": inLiveRegion ? void 0 : "Loading",
+        className: cn("animate-pulse rounded-md bg-muted", className),
+        ...props
+      }
+    );
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+export { Skeleton };
+//# sourceMappingURL=chunk-CGWIOIEO.js.map
+//# sourceMappingURL=chunk-CGWIOIEO.js.map

package/dist/chunk-CGWIOIEO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/skeleton/skeleton.tsx"],"names":[],"mappings":";;;;;AAuBA,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CAAC,EAAE,SAAA,EAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAIhC,IAAA,MAAM,eAAe,eAAA,EAAgB;AACrC,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAU,UAAA;AAAA,QACV,GAAA;AAAA,QACA,IAAA,EAAM,eAAe,MAAA,GAAY,QAAA;AAAA,QACjC,WAAA,EAAW,eAAe,MAAA,GAAY,QAAA;AAAA,QACtC,YAAA,EAAY,eAAe,MAAA,GAAY,SAAA;AAAA,QACvC,SAAA,EAAW,EAAA,CAAG,mCAAA,EAAqC,SAAS,CAAA;AAAA,QAC3D,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-CGWIOIEO.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { useInLiveRegion } from \"../../../lib/live-region-context.js\";\n\n/**\n * Skeleton — placeholder block shown while content is loading.\n *\n * Uses --muted as base + a subtle shimmer that respects the violet theme.\n * Compose multiple Skeletons to mirror your component layout while loading.\n *\n * Accessibility (LOW-004): the default `role=\"status\"` + `aria-live=\"polite\"`\n * announces \"Loading\" to screen readers. In loops or grids where many\n * Skeletons mount simultaneously, this can be noisy. Override per-instance\n * with `aria-live=\"off\"` and/or `aria-hidden` when only one container-level\n * loading announcement is desired:\n *\n *   <div role=\"status\" aria-live=\"polite\" aria-label=\"Loading deployments\">\n *     {placeholders.map(id => (\n *       <Skeleton key={id} aria-live=\"off\" aria-hidden=\"true\" className=\"h-8\" />\n *     ))}\n *   </div>\n */\nconst Skeleton = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => {\n    // T4.1 (MF-4): when nested inside a container live region (BuildLogStream,\n    // ChatThread, etc.), omit role/aria-live so AT doesn't announce every\n    // placeholder mount as a separate \"loading\" event.\n    const inLiveRegion = useInLiveRegion();\n    return (\n      <div\n        data-slot=\"skeleton\"\n        ref={ref}\n        role={inLiveRegion ? undefined : \"status\"}\n        aria-live={inLiveRegion ? undefined : \"polite\"}\n        aria-label={inLiveRegion ? undefined : \"Loading\"}\n        className={cn(\"animate-pulse rounded-md bg-muted\", className)}\n        {...props}\n      />\n    );\n  },\n);\nSkeleton.displayName = \"Skeleton\";\n\nexport { Skeleton };\n"]}