@burdenoff/microfe-billing 2026.624.3 → 2026.625.2

package/dist/billing/modules/usage/pages/UsagePage.js

@@ -65,7 +65,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 		type: "button",
 		onClick: o,
 		"aria-pressed": a,
-		className: `rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 p-5 w-full text-left ${o ? "cursor-pointer transition-all duration-200 ease-[var(--motion-easing-out)] hover:border-border-strong hover:shadow-elevation-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)]" : ""} ${a ? "ring-1 ring-[var(--color-focus-ring)] border-border-strong" : ""}`,
+		className: `rounded-card border border-border-seam bg-bg-surface bg-accent-wash shadow-elevation-1 p-5 w-full text-left ${o ? "cursor-pointer transition-[box-shadow,transform] duration-200 ease-[var(--motion-easing-out)] shadow-[var(--shadow-pop)] hover:shadow-elevation-2 [@media(hover:none)]: focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)]" : ""} ${a ? "ring-1 ring-[var(--color-focus-ring)] border-border-strong" : ""}`,
 		children: [/* @__PURE__ */ j("div", {
 			className: "flex items-start justify-between gap-3",
 			children: [/* @__PURE__ */ A("span", {
@@ -143,7 +143,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 		]
 	});
 }, re = ({ quotas: e, planLabel: t, showPlanColumn: n = !0, onQuotaClick: r }) => /* @__PURE__ */ A("div", {
-	className: "overflow-x-auto rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1",
+	className: "overflow-x-auto rounded-card border border-border-seam bg-bg-surface shadow-elevation-1",
 	children: /* @__PURE__ */ j("table", {
 		className: "w-full text-left",
 		children: [/* @__PURE__ */ A("thead", { children: /* @__PURE__ */ j("tr", {
@@ -186,7 +186,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 		upgraded: `${t.primary.bg} ${t.primary.text}`
 	};
 	return /* @__PURE__ */ j("div", {
-		className: "border border-border-subtle rounded-card bg-bg-surface shadow-elevation-1 overflow-hidden",
+		className: "border border-border-seam rounded-card bg-bg-surface shadow-elevation-1 overflow-hidden",
 		children: [
 			/* @__PURE__ */ j("button", {
 				type: "button",
@@ -250,7 +250,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 			className: "absolute inset-0 bg-overlay-scrim",
 			onClick: o
 		}), /* @__PURE__ */ j("div", {
-			className: "relative bg-bg-elevated border border-border-subtle rounded-card shadow-[var(--shadow-elevation-4)] max-w-2xl w-full mx-4 max-h-[90vh] overflow-auto",
+			className: "relative bg-bg-elevated border border-border-seam rounded-card shadow-[var(--shadow-elevation-4)] max-w-2xl w-full mx-4 max-h-[90vh] overflow-auto",
 			role: "dialog",
 			"aria-modal": "true",
 			"aria-labelledby": "quota-detail-title",
@@ -332,7 +332,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 							className: "text-sm font-medium text-text-primary mb-3",
 							children: "Quota Breakdown"
 						}), /* @__PURE__ */ A("div", {
-							className: "border border-border-subtle rounded-card overflow-hidden divide-y divide-border-subtle",
+							className: "border border-border-seam rounded-card overflow-hidden divide-y divide-border-subtle",
 							children: [...n.quotaAssignments].sort((e, t) => (e.endtime ? new Date(e.endtime).getTime() : Infinity) - (t.endtime ? new Date(t.endtime).getTime() : Infinity)).map((e) => {
 								let n = e.endtime ? new Date(e.endtime) : null, r = /* @__PURE__ */ new Date(), a = n && n < r, o = n ? Math.ceil((n.getTime() - r.getTime()) / (1440 * 60 * 1e3)) : null, s = o !== null && o > 0 && o <= 7;
 								return /* @__PURE__ */ j("div", {
@@ -431,7 +431,7 @@ var ne = ({ status: e, className: n = "size-4" }) => {
 						}) : /* @__PURE__ */ A("div", {
 							className: "space-y-2",
 							children: g.map((e) => /* @__PURE__ */ j("div", {
-								className: "flex items-center justify-between p-3 border border-border-subtle rounded-card",
+								className: "flex items-center justify-between p-3 border border-border-seam rounded-card",
 								children: [/* @__PURE__ */ j("div", {
 									className: "flex-1 min-w-0",
 									children: [/* @__PURE__ */ A("p", {
@@ -571,7 +571,7 @@ var oe = ({ workspaceId: e }) => {
 				className: "grid grid-cols-3 gap-3",
 				children: [
 					/* @__PURE__ */ j("div", {
-						className: "rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 p-4",
+						className: "rounded-card border border-border-seam bg-bg-surface shadow-elevation-1 p-4",
 						children: [/* @__PURE__ */ j("div", {
 							className: "flex items-center gap-1.5 mb-1",
 							children: [/* @__PURE__ */ A("span", {
@@ -587,7 +587,7 @@ var oe = ({ workspaceId: e }) => {
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 p-4",
+						className: "rounded-card border border-border-seam bg-bg-surface shadow-elevation-1 p-4",
 						children: [/* @__PURE__ */ j("div", {
 							className: "flex items-center gap-1.5 mb-1",
 							children: [/* @__PURE__ */ A("span", {
@@ -603,7 +603,7 @@ var oe = ({ workspaceId: e }) => {
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 p-4",
+						className: "rounded-card border border-border-seam bg-bg-surface shadow-elevation-1 p-4",
 						children: [/* @__PURE__ */ j("div", {
 							className: "flex items-center gap-1.5 mb-1",
 							children: [/* @__PURE__ */ A("span", {
@@ -621,7 +621,7 @@ var oe = ({ workspaceId: e }) => {
 				]
 			}),
 			/* @__PURE__ */ A("div", {
-				className: "border border-border-subtle rounded-card bg-bg-surface shadow-elevation-1 overflow-hidden",
+				className: "border border-border-seam rounded-card bg-bg-surface shadow-elevation-1 overflow-hidden",
 				children: /* @__PURE__ */ j("table", {
 					className: "w-full text-sm",
 					children: [/* @__PURE__ */ A("thead", { children: /* @__PURE__ */ j("tr", {
@@ -1142,7 +1142,7 @@ var oe = ({ workspaceId: e }) => {
 					onQuotaClick: d
 				})] }),
 				N === "active" && W.length === 0 && U.length === 0 && !Q && /* @__PURE__ */ j("div", {
-					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-subtle rounded-card",
+					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-seam rounded-card",
 					children: [
 						/* @__PURE__ */ A("div", {
 							className: "size-12 rounded-full bg-[var(--color-accent-soft)] flex items-center justify-center mb-4",
@@ -1159,7 +1159,7 @@ var oe = ({ workspaceId: e }) => {
 					]
 				}),
 				N === "past" && G.length === 0 && !Q && !K && /* @__PURE__ */ j("div", {
-					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-subtle rounded-card",
+					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-seam rounded-card",
 					children: [
 						/* @__PURE__ */ A("div", {
 							className: "size-12 rounded-full bg-[var(--color-accent-soft)] flex items-center justify-center mb-4",
@@ -1190,7 +1190,7 @@ var oe = ({ workspaceId: e }) => {
 					].map((e) => /* @__PURE__ */ A("div", { className: "h-24 bg-bg-sunken animate-pulse rounded-card" }, e))
 				}),
 				Q && Z.active.length === 0 && Z.past.length === 0 && (N === "past" || J.length === 0) && /* @__PURE__ */ j("div", {
-					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-subtle rounded-card",
+					className: "flex flex-col items-center justify-center py-12 border border-dashed border-border-seam rounded-card",
 					children: [
 						/* @__PURE__ */ A("div", {
 							className: "size-12 rounded-full bg-[var(--color-accent-soft)] flex items-center justify-center mb-4",