@fluid-app/portal-sdk 0.1.300 → 0.1.302

package/dist/{SubscriptionsScreen-DLLDU_aU.cjs → SubscriptionsScreen-YL-1_nFd.cjs}

@@ -3131,10 +3131,10 @@ function PortalSubscriptionsList({ customerId, isLoadingCustomer, onSubscription
 	}) }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "relative",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: "max-w-profile-container relative mx-auto px-5 pt-8 pb-20 md:px-8",
+			className: "relative mx-auto max-w-4xl px-5 pt-8 pb-20 md:px-8",
 			children: [
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
-					className: "text-profile-hero tracking-profile-hero text-profile-text md:text-profile-hero-lg font-bold",
+					className: "text-foreground text-xl font-bold tracking-tight md:text-2xl",
 					children: t("list_title")
 				}),
 				list.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FilterPills, {
@@ -3163,7 +3163,7 @@ function PortalSubscriptionsList({ customerId, isLoadingCustomer, onSubscription
 				}), inactiveSubs.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: activeSubs.length > 0 ? "mt-10" : "mt-6",
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "text-profile-xs text-profile-text-muted mb-2 px-1 font-semibold",
+						className: "text-muted-foreground mb-2 px-1 text-xs font-semibold",
 						children: t("list_cancelled_section_label", { n: String(inactiveSubs.length) })
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						className: "space-y-3",
@@ -3180,7 +3180,7 @@ function PortalSubscriptionsList({ customerId, isLoadingCustomer, onSubscription
 						type: "button",
 						onClick: () => fetchNextPage(),
 						disabled: isFetchingNextPage,
-						className: "ring-profile-border bg-profile-card text-profile-text hover:bg-profile-pill-hover text-profile-xs inline-flex items-center gap-1 rounded-md px-3 py-1.5 font-bold ring-1 transition-all disabled:cursor-not-allowed disabled:opacity-40",
+						className: "ring-border text-foreground hover:bg-muted inline-flex items-center gap-1 rounded-md bg-transparent px-3 py-1.5 text-xs font-bold ring-1 transition-all disabled:cursor-not-allowed disabled:opacity-40",
 						children: isFetchingNextPage ? t("list_loading") : t("list_load_more")
 					})
 				})
@@ -3215,9 +3215,9 @@ function FilterPills({ active, counts, onChange, t }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 				type: "button",
 				onClick: () => onChange(f.key),
-				className: `text-profile-xs inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 font-bold transition-all ${isActive ? "bg-profile-dark text-profile-dark-foreground" : "ring-profile-border bg-profile-card text-profile-text hover:bg-profile-pill-hover ring-1"}`,
+				className: `inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-bold transition-all ${isActive ? "bg-primary text-primary-foreground" : "ring-border text-foreground hover:bg-muted bg-transparent ring-1"}`,
 				children: [t(f.labelKey), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: `text-profile-micro tabular-nums ${isActive ? "text-profile-dark-foreground/70" : "text-profile-text-muted"}`,
+					className: `text-xs tabular-nums ${isActive ? "text-primary-foreground/70" : "text-muted-foreground"}`,
 					children: count
 				})]
 			}, f.key);
@@ -3236,7 +3236,7 @@ function SubscriptionCard({ sub, onClick, onResume, t }) {
 	const cycle = computeCycleProgress(sub.last_bill_date, sub.next_bill_date, t);
 	const showCycle = cycle != null && !isPaused && !isCancelled && !isPastDue;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: `group has-[:focus-visible]:ring-profile-text/30 relative flex flex-col gap-5 rounded-2xl p-5 ring-1 transition-all duration-300 hover:-translate-y-0.5 has-[:focus-visible]:ring-2 ${isPastDue ? "bg-profile-card from-profile-danger-wash via-profile-danger-wash-faint shadow-profile-card ring-profile-danger-edge hover:shadow-profile-danger-card-hover hover:ring-profile-danger-edge-strong bg-gradient-to-br to-transparent" : "bg-profile-card ring-profile-card-edge shadow-profile-card hover:ring-profile-text/10 hover:shadow-profile-card-hover"} ${isPaused || isCancelled ? "opacity-90" : ""}`,
+		className: `group has-[:focus-visible]:ring-foreground/30 relative flex flex-col gap-5 rounded-2xl p-5 ring-1 transition-all duration-300 hover:-translate-y-0.5 has-[:focus-visible]:ring-2 ${isPastDue ? "from-destructive/10 via-destructive/[0.03] ring-destructive/15 hover:ring-destructive/30 bg-transparent bg-gradient-to-br to-transparent shadow-sm hover:shadow-lg" : "ring-foreground/5 hover:ring-foreground/10 bg-transparent shadow-sm hover:shadow-lg"} ${isPaused || isCancelled ? "opacity-90" : ""}`,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 			type: "button",
 			onClick,
@@ -3252,52 +3252,52 @@ function SubscriptionCard({ sub, onClick, onResume, t }) {
 						className: "min-w-0 flex-1 pt-1",
 						children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: "text-profile-lg text-profile-text truncate font-bold",
+								className: "text-foreground truncate text-base font-bold",
 								children: sub.variant.product.title || t("list_product_fallback")
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: "text-profile-sm-plus text-profile-text-muted mt-0.5",
+								className: "text-muted-foreground mt-0.5 text-sm",
 								children: cadence
 							}),
 							(isPaused || isCancelled || isPastDue) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-								className: `text-profile-xs mt-2 inline-flex items-center gap-1.5 font-semibold ${isPastDue ? "text-profile-danger-icon" : "text-profile-text-faint"}`,
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: `size-1.5 rounded-full ${isCancelled || isPastDue ? "bg-profile-danger-icon" : "bg-profile-text-muted"}` }), status.label]
+								className: `mt-2 inline-flex items-center gap-1.5 text-xs font-semibold ${isPastDue ? "text-destructive" : "text-muted-foreground/75"}`,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: `size-1.5 rounded-full ${isCancelled || isPastDue ? "bg-destructive" : "bg-muted-foreground"}` }), status.label]
 							})
 						]
 					})]
 				}),
 				isCancelled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "bg-profile-icon-bg text-profile-base text-profile-text-muted rounded-xl px-4 py-3 font-semibold",
+					className: "bg-muted text-muted-foreground rounded-xl px-4 py-3 text-sm font-semibold",
 					children: status.label
 				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: "bg-profile-icon-bg rounded-xl px-4 py-3.5",
+					className: "bg-muted rounded-xl px-4 py-3.5",
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: `text-profile-md font-bold ${isPastDue ? "text-profile-danger-icon" : "text-profile-text"}`,
+						className: `text-sm font-bold ${isPastDue ? "text-destructive" : "text-foreground"}`,
 						children: isPastDue ? daysOverdue === 1 ? t("list_bill_due_1_day_ago") : daysOverdue > 0 ? t("list_bill_due_n_days_ago", { n: String(daysOverdue) }) : t("list_bill_overdue") : isPaused ? t("list_last_bill_label") : t("list_next_bill_label")
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: "mt-3 grid grid-cols-2",
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: "pr-4",
 							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: "text-profile-xs text-profile-text-muted",
+								className: "text-muted-foreground text-xs",
 								children: isPaused ? t("list_last_bill_date") : t("list_bill_date")
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: `text-profile-lg tracking-profile-tight mt-1 font-bold tabular-nums ${isPastDue ? "text-profile-danger-icon" : "text-profile-text"}`,
+								className: `mt-1 text-base font-bold tracking-tight tabular-nums ${isPastDue ? "text-destructive" : "text-foreground"}`,
 								children: (isPaused ? lastBillLong : nextBillLong) ?? "—"
 							})]
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: "border-profile-divider border-l pl-4",
+							className: "border-border border-l pl-4",
 							children: [
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: "text-profile-xs text-profile-text-muted",
+									className: "text-muted-foreground text-xs",
 									children: isPaused ? t("list_last_bill_amount") : t("list_bill_amount")
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: "text-profile-lg tracking-profile-tight text-profile-text mt-1 font-bold tabular-nums",
+									className: "text-foreground mt-1 text-base font-bold tracking-tight tabular-nums",
 									children: formatPrice(sub)
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: "text-profile-xs text-profile-text-muted",
+									className: "text-muted-foreground text-xs",
 									children: pricingSuffix(sub.subscription_plan, t)
 								})
 							]
@@ -3310,7 +3310,7 @@ function SubscriptionCard({ sub, onClick, onResume, t }) {
 			type: "button",
 			onClick: onResume,
 			disabled: !onResume,
-			className: "bg-profile-dark text-profile-dark-foreground hover:bg-profile-dark-hover text-profile-xs inline-flex w-full items-center justify-center gap-1.5 rounded-md py-2.5 font-bold transition-colors focus:outline-none disabled:cursor-not-allowed disabled:opacity-40",
+			className: "bg-primary text-primary-foreground hover:bg-primary/90 inline-flex w-full items-center justify-center gap-1.5 rounded-md py-2.5 text-xs font-bold transition-colors focus:outline-none disabled:cursor-not-allowed disabled:opacity-40",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Play, {
 				className: "size-3 fill-current",
 				strokeWidth: 2.25
@@ -3320,13 +3320,13 @@ function SubscriptionCard({ sub, onClick, onResume, t }) {
 }
 function CycleProgress({ cycle }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: "bg-profile-icon-bg relative h-1.5 overflow-hidden rounded-full",
+		className: "bg-muted relative h-1.5 overflow-hidden rounded-full",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "bg-profile-text absolute top-0 left-0 h-full rounded-full transition-all duration-500",
+			className: "bg-foreground absolute top-0 left-0 h-full rounded-full transition-all duration-500",
 			style: { width: `${Math.round(cycle.progress * 100)}%` }
 		})
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "text-profile-2xs text-profile-text-muted mt-2 flex items-center justify-between font-medium",
+		className: "text-muted-foreground mt-2 flex items-center justify-between text-xs font-medium",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: cycle.startLabel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: cycle.endLabel })]
 	})] });
 }
@@ -3336,15 +3336,15 @@ function InactiveSubscriptionRow({ sub, onClick, t }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 		type: "button",
 		onClick,
-		className: "group bg-profile-card ring-profile-card-edge shadow-profile-card hover:ring-profile-text/10 hover:shadow-profile-card-hover focus-visible:ring-profile-text/30 flex w-full cursor-pointer items-center gap-3 rounded-2xl px-4 py-3 text-left ring-1 transition-all duration-300 hover:-translate-y-0.5 focus-visible:ring-2 focus-visible:outline-none",
+		className: "group ring-foreground/5 hover:ring-foreground/10 focus-visible:ring-foreground/30 flex w-full cursor-pointer items-center gap-3 rounded-2xl bg-transparent px-4 py-3 text-left shadow-sm ring-1 transition-all duration-300 hover:-translate-y-0.5 hover:shadow-lg focus-visible:ring-2 focus-visible:outline-none",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "relative size-10 shrink-0 opacity-60 saturate-50",
 			children: sub.variant.product.image_url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
 				src: sub.variant.product.image_url,
 				alt: "",
-				className: "bg-profile-card ring-profile-canvas size-10 rounded-xl object-cover ring-[3px]"
+				className: "ring-background size-10 rounded-xl bg-transparent object-cover ring-[3px]"
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "bg-profile-icon-bg ring-profile-canvas text-profile-text-muted flex size-10 items-center justify-center rounded-xl ring-[3px]",
+				className: "bg-muted ring-background text-muted-foreground flex size-10 items-center justify-center rounded-xl ring-[3px]",
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ImageOff, {
 					className: "size-4",
 					strokeWidth: 1.75
@@ -3353,10 +3353,10 @@ function InactiveSubscriptionRow({ sub, onClick, t }) {
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 			className: "min-w-0 flex-1",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "text-profile-md text-profile-text truncate font-bold",
+				className: "text-foreground truncate text-sm font-bold",
 				children: sub.variant.product.title || t("list_product_fallback")
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "text-profile-xs text-profile-text-muted truncate",
+				className: "text-muted-foreground truncate text-xs",
 				children: detail
 			})]
 		})]
@@ -3368,15 +3368,15 @@ function Thumbnail({ product, muted, t }) {
 		children: [product.image_url ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
 			src: product.image_url,
 			alt: "",
-			className: "bg-profile-card ring-profile-canvas size-24 rounded-2xl object-cover ring-[3px] shadow-sm"
+			className: "bg-transparent ring-background size-24 rounded-2xl object-cover ring-[3px] shadow-sm"
 		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "bg-profile-icon-bg ring-profile-canvas text-profile-text-muted flex size-24 items-center justify-center rounded-2xl shadow-sm ring-[3px]",
+			className: "bg-muted ring-background text-muted-foreground flex size-24 items-center justify-center rounded-2xl shadow-sm ring-[3px]",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ImageOff, {
 				className: "size-7",
 				strokeWidth: 1.75
 			})
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "bg-profile-dark text-profile-dark-foreground ring-profile-canvas absolute -top-1 -right-1 z-40 flex size-6 items-center justify-center rounded-full ring-2",
+			className: "bg-primary text-primary-foreground ring-background absolute -top-1 -right-1 z-40 flex size-6 items-center justify-center rounded-full ring-2",
 			title: t("list_recurring_badge"),
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Repeat, {
 				className: "size-3",
@@ -3387,55 +3387,55 @@ function Thumbnail({ product, muted, t }) {
 }
 function SubscriptionCardSkeleton() {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "ring-profile-border bg-profile-card flex flex-col gap-5 rounded-2xl p-5 ring-1",
+		className: "ring-border flex flex-col gap-5 rounded-2xl bg-transparent p-5 ring-1",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 				className: "flex items-start gap-4",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-profile-icon-bg size-20 shrink-0 animate-pulse rounded-2xl" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted size-20 shrink-0 animate-pulse rounded-2xl" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "flex-1 space-y-2 pt-1",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-profile-icon-bg h-5 w-2/3 animate-pulse rounded" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-profile-icon-bg h-4 w-1/2 animate-pulse rounded" })]
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-5 w-2/3 animate-pulse rounded" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-4 w-1/2 animate-pulse rounded" })]
 				})]
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-profile-icon-bg h-12 animate-pulse rounded" }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-profile-icon-bg h-6 animate-pulse rounded" })
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-12 animate-pulse rounded" }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-6 animate-pulse rounded" })
 		]
 	});
 }
 function EmptyState({ filtered, t }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "ring-profile-border bg-profile-card mx-auto mt-12 flex max-w-md flex-col items-center gap-2 rounded-2xl px-6 py-12 text-center ring-1",
+		className: "ring-border mx-auto mt-12 flex max-w-md flex-col items-center gap-2 rounded-2xl bg-transparent px-6 py-12 text-center ring-1",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "text-profile-base text-profile-text font-bold",
+			className: "text-foreground text-sm font-bold",
 			children: filtered ? t("list_no_in_view") : t("list_none_yet")
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "text-profile-xs text-profile-text-muted",
+			className: "text-muted-foreground text-xs",
 			children: filtered ? t("list_filtered_hint") : t("list_empty_hint")
 		})]
 	});
 }
 function ErrorState({ onRetry, t }) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "ring-profile-border bg-profile-card mx-auto mt-12 flex max-w-md flex-col items-center gap-2 rounded-2xl px-6 py-12 text-center ring-1",
+		className: "ring-border mx-auto mt-12 flex max-w-md flex-col items-center gap-2 rounded-2xl bg-transparent px-6 py-12 text-center ring-1",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "bg-profile-icon-bg flex size-12 items-center justify-center rounded-full",
+				className: "bg-muted flex size-12 items-center justify-center rounded-full",
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlertCircle, {
-					className: "text-profile-text-muted size-5",
+					className: "text-muted-foreground size-5",
 					strokeWidth: 2
 				})
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "text-profile-base text-profile-text font-bold",
+				className: "text-foreground text-sm font-bold",
 				children: t("list_load_failed_title")
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "text-profile-xs text-profile-text-muted",
+				className: "text-muted-foreground text-xs",
 				children: t("list_load_failed_hint")
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 				type: "button",
 				onClick: onRetry,
-				className: "bg-profile-dark text-profile-dark-foreground hover:bg-profile-dark-hover text-profile-xs mt-2 inline-flex items-center gap-1 rounded-md px-3 py-1.5 font-bold transition-all",
+				className: "bg-primary text-primary-foreground hover:bg-primary/90 mt-2 inline-flex items-center gap-1 rounded-md px-3 py-1.5 text-xs font-bold transition-all",
 				children: t("list_try_again")
 			})
 		]
@@ -5767,4 +5767,4 @@ Object.defineProperty(exports, "subscriptionsScreenPropertySchema", {
 	}
 });
 
-//# sourceMappingURL=SubscriptionsScreen-DLLDU_aU.cjs.map
+//# sourceMappingURL=SubscriptionsScreen-YL-1_nFd.cjs.map