@bfrs/agentic-components 0.1.1 → 0.1.2

package/BFRS_AGENTIC_COMPONENTS.md

@@ -45,7 +45,7 @@ import { Button, Input, Modal, DataTable, DateRangePicker, ToastProvider, useToa
 - All interactive components forward refs and spread native HTML props
 - Styling uses **Tailwind CSS** + **CVA** — do not add raw Tailwind classes on top of variant-controlled elements
 - Use the `cn()` utility from the library for conditional class merging
-- **Card surface standard** — all card-like components (`Card`, `MetricCard`, `FormSection`, `BusinessInfoDisplayCard`, and `StepProgressCard` when `surface="card"`) share the same surface style: `border-radius: 12px`, `border: 1px solid #D3DFD7` (`border-border-card`), `background: linear-gradient(168deg, #FFF 8.6%, #FFFFFD 97.41%)`, `box-shadow: 0 0 21.7px 0 rgba(24, 240, 64, 0.03)`. Do not override these properties unless intentionally switching to a `muted` or `soft` variant.
+- **Card surface standard** — all card-like components (`Card`, `MetricCard`, `FormSection`, `BusinessInfoDisplayCard`, and `StepProgressCard` when `surface="card"`) share the same surface style: `border-radius: 12px`, a faded green-grey gradient stroke (`dcl-faded-card-border`), `background: linear-gradient(168deg, #FFF 8.6%, #FFFFFD 97.41%)`, `box-shadow: 0 0 21.7px 0 rgba(24, 240, 64, 0.03)`. Do not override these properties unless intentionally switching to a `muted` or `soft` variant.
 
 ```tsx
 import { cn } from "@bfrs/agentic-components";
@@ -1104,7 +1104,7 @@ Branded full-screen loading screen. Use during auth redirects and account setup.
 
 #### `BusinessInfoDisplayCard`
 
-Rich business identity card with centered profile identity, metadata chips, and compact label-value details. Uses the standard card surface (`border-border-card`, white gradient background, green-glow shadow) and the Figma-derived green header wash.
+Rich business identity card with centered profile identity, metadata chips, and compact label-value details. Uses the standard card surface (faded green-grey gradient stroke, white gradient background, green-glow shadow) and the Figma-derived green header wash.
 
 ```tsx
 <BusinessInfoDisplayCard

package/dist/index.js

@@ -3053,11 +3053,11 @@ N0.displayName = "Container";
 const M0 = He("rounded-xl transition-shadow duration-200", {
   variants: {
     variant: {
-      default: "border border-border bg-surface-card shadow-card",
+      default: "dcl-faded-card-border bg-surface-card shadow-card",
       muted: "border border-border bg-surface-muted",
-      elevated: "border border-border bg-surface-card shadow-elevated",
+      elevated: "dcl-faded-card-border bg-surface-card shadow-elevated",
       outlined: "border border-border-strong bg-surface-card",
-      glass: "border border-border bg-surface-card/80 shadow-card backdrop-blur-md"
+      glass: "dcl-faded-card-border bg-surface-card/80 shadow-card backdrop-blur-md"
     },
     padding: {
       none: "p-0",
@@ -3157,14 +3157,14 @@ function eg({ icon: e, size: t = "md", weight: r = "regular", className: n, deco
   const s = typeof t == "number" ? t : V0[t];
   return /* @__PURE__ */ l(e, { "aria-hidden": a, className: N("inline-block shrink-0 align-middle", n), size: s, weight: r });
 }
-const _0 = He("rounded-xl border transition", {
+const _0 = He("rounded-xl transition", {
   variants: {
     variant: {
-      default: "border-border-card bg-[image:var(--gradient-card)] shadow-card",
-      elevated: "border-border-card bg-[image:var(--gradient-card)] shadow-elevated",
-      bordered: "border-border-card bg-[image:var(--gradient-card)] shadow-none",
-      muted: "border-border bg-surface-muted shadow-none",
-      soft: "border-primary-soft bg-primary-soft/60 shadow-none"
+      default: "dcl-faded-card-border bg-[image:var(--gradient-card)] shadow-card",
+      elevated: "dcl-faded-card-border bg-[image:var(--gradient-card)] shadow-elevated",
+      bordered: "dcl-faded-card-border bg-[image:var(--gradient-card)] shadow-none",
+      muted: "border border-border bg-surface-muted shadow-none",
+      soft: "border border-primary-soft bg-primary-soft/60 shadow-none"
     },
     padding: {
       none: "p-0",
@@ -3173,7 +3173,7 @@ const _0 = He("rounded-xl border transition", {
       lg: "p-5"
     },
     interactive: {
-      true: "cursor-pointer hover:border-border-strong hover:bg-surface-muted/70 focus-within:ring-2 focus-within:ring-border-focus/20"
+      true: "cursor-pointer hover:bg-surface-muted/70 focus-within:ring-2 focus-within:ring-border-focus/20"
     }
   },
   defaultVariants: {
@@ -12359,7 +12359,7 @@ const W8 = [
       {
         ref: b,
         className: N(
-          "relative w-full max-w-[354px] overflow-hidden rounded-b-[10px] rounded-t-xl border border-border-card bg-[image:var(--business-card-background)] p-0 shadow-card",
+          "dcl-faded-card-border relative w-full max-w-[354px] overflow-hidden rounded-b-[10px] rounded-t-xl bg-[image:var(--business-card-background)] p-0 shadow-card",
           e
         ),
         style: v,
@@ -12411,7 +12411,7 @@ const j8 = q(
     "div",
     {
       ref: n,
-      className: N("w-full max-w-[354px] overflow-hidden rounded-b-[10px] rounded-t-xl border border-border-card bg-[image:var(--gradient-business-info-card)] shadow-card", e),
+      className: N("dcl-faded-card-border w-full max-w-[354px] overflow-hidden rounded-b-[10px] rounded-t-xl bg-[image:var(--gradient-business-info-card)] shadow-card", e),
       "aria-hidden": "true",
       ...r,
       children: [
@@ -12472,7 +12472,7 @@ const Y8 = q(
         ref: d,
         className: N(
           "w-full max-w-[425px] [word-break:break-word]",
-          s === "card" && "rounded-xl border border-border-card bg-[image:var(--gradient-card)] p-5 shadow-card",
+          s === "card" && "dcl-faded-card-border rounded-xl bg-[image:var(--gradient-card)] p-5 shadow-card",
           e
         ),
         "aria-label": typeof t == "string" ? t : "Progress",
@@ -12534,7 +12534,7 @@ const X8 = q(({ className: e, steps: t = 4, surface: r = "plain", ...n }, a) =>
     ref: a,
     className: N(
       "w-full max-w-[425px]",
-      r === "card" && "rounded-xl border border-border-card bg-[image:var(--gradient-card)] p-5 shadow-card",
+      r === "card" && "dcl-faded-card-border rounded-xl bg-[image:var(--gradient-card)] p-5 shadow-card",
       e
     ),
     "aria-hidden": "true",