@burdenoff/microfe-billing 2026.625.2 → 2026.625.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/billing/modules/billing/pages/TransactionsPage.js +26 -37
  2. package/dist/billing/modules/billing/pages/TransactionsPage.js.map +1 -1
  3. package/dist/billing/modules/credits/pages/CreditTransactionsPage.js +41 -40
  4. package/dist/billing/modules/credits/pages/CreditTransactionsPage.js.map +1 -1
  5. package/dist/billing/modules/dashboard/pages/OverviewPage.js +234 -225
  6. package/dist/billing/modules/dashboard/pages/OverviewPage.js.map +1 -1
  7. package/dist/billing/modules/subscriptions/pages/SubscriptionDetailPage.js +1 -0
  8. package/dist/billing/modules/subscriptions/pages/SubscriptionDetailPage.js.map +1 -1
  9. package/dist/billing/modules/subscriptions/pages/SubscriptionsListPage.js +1 -0
  10. package/dist/billing/modules/subscriptions/pages/SubscriptionsListPage.js.map +1 -1
  11. package/dist/billing/shared/ui/StatusPill.js +1 -1
  12. package/dist/billing/shared/ui/StatusPill.js.map +1 -1
  13. package/package.json +2 -2
package/dist/billing/modules/dashboard/pages/OverviewPage.js CHANGED
@@ -1,285 +1,292 @@
1
1
  import { useBilling as e } from "../../../providers/BillingProvider.js";
2
2
  import { AccessDenied as t } from "../../../shared/components/AccessDenied.js";
3
3
  import { StatCard as n } from "../../../shared/components/StatCard.js";
4
- import { EmptyState as ee } from "../../../shared/components/EmptyState.js";
5
- import { ServerError as te } from "../../../shared/components/ServerError.js";
6
- import { useBillingEventEmitter as ne } from "../../../hooks/useBillingEventEmitter.js";
7
- import { getStoredBillingAccountId as re, setStoredBillingAccountId as ie } from "../../../hooks/useBillingAccountSelection.js";
8
- import { isServerError as ae } from "../../../shared/utils/error.js";
4
+ import { ServerError as ee } from "../../../shared/components/ServerError.js";
5
+ import { useBillingEventEmitter as te } from "../../../hooks/useBillingEventEmitter.js";
6
+ import { getStoredBillingAccountId as ne, setStoredBillingAccountId as re } from "../../../hooks/useBillingAccountSelection.js";
7
+ import { isServerError as ie } from "../../../shared/utils/error.js";
9
8
  import "../../../shared/utils/index.js";
10
- import { useBillingPermissions as oe } from "../../../hooks/useBillingPermissions.js";
11
- import { useDashboardMutations as se } from "../hooks/useDashboard.js";
12
- import { useBillingOverviewData as ce } from "../hooks/useBillingOverviewData.js";
9
+ import { useBillingPermissions as ae } from "../../../hooks/useBillingPermissions.js";
10
+ import { useDashboardMutations as oe } from "../hooks/useDashboard.js";
11
+ import { useBillingOverviewData as se } from "../hooks/useBillingOverviewData.js";
13
12
  import "../hooks/index.js";
14
- import { BillingAccountCard as le } from "../components/BillingAccountCard.js";
15
- import { PaymentMethodsSection as ue } from "../components/PaymentMethodsSection.js";
16
- import { ActiveSubscriptionCard as de } from "../components/ActiveSubscriptionCard.js";
17
- import { RecommendedAddonsSection as fe } from "../components/RecommendedAddonsSection.js";
13
+ import { BillingAccountCard as ce } from "../components/BillingAccountCard.js";
14
+ import { PaymentMethodsSection as le } from "../components/PaymentMethodsSection.js";
15
+ import { ActiveSubscriptionCard as ue } from "../components/ActiveSubscriptionCard.js";
16
+ import { RecommendedAddonsSection as de } from "../components/RecommendedAddonsSection.js";
18
17
  import { CreateBillingAccountModal as r } from "../components/CreateBillingAccountModal.js";
19
- import { AddPaymentMethodModal as pe } from "../components/AddPaymentMethodModal.js";
18
+ import { AddPaymentMethodModal as fe } from "../components/AddPaymentMethodModal.js";
20
19
  import "../components/index.js";
21
- import { useAddonCartStore as me } from "../../addons/store/addonCartStore.js";
22
- import { FloatingCartDrawer as he } from "../../addons/components/FloatingCartDrawer.js";
20
+ import { useAddonCartStore as pe } from "../../addons/store/addonCartStore.js";
21
+ import { FloatingCartDrawer as me } from "../../addons/components/FloatingCartDrawer.js";
23
22
  import { withBillingAccountId as i } from "../../../shared/utils/navigation.js";
24
23
  import { useCallback as a, useEffect as o, useState as s } from "react";
25
- import { Activity as ge, ArrowRight as _e, Building2 as c, Check as l, ChevronDown as u, Coins as ve, Crown as ye, Loader2 as be, Plus as xe, Receipt as Se, RefreshCw as d, Sparkles as Ce, Wallet as f } from "lucide-react";
26
- import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
24
+ import { Activity as he, ArrowRight as ge, Building2 as c, Check as l, ChevronDown as _e, Coins as ve, Crown as ye, Loader2 as be, Plus as u, Receipt as xe, RefreshCw as Se, Sparkles as Ce, Wallet as d } from "lucide-react";
25
+ import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
27
26
  import { useI18n as we } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
28
- import { Button as Te, CTAOverflowMenu as Ee, EmphasisPanel as De } from "@burdenoff/fe-libs/ui";
27
+ import { AuroraBackground as h, Button as Te, CTAOverflowMenu as Ee, GlassCard as De, GradientText as g, IllustratedEmptyState as Oe } from "@burdenoff/fe-libs/ui";
29
28
  //#region src/billing/modules/dashboard/pages/OverviewPage.tsx
30
- var g = () => {
31
- let { t: g } = we(), _ = (e, t) => {
32
- let n = g(e);
29
+ var _ = () => {
30
+ let { t: _ } = we(), v = (e, t) => {
31
+ let n = _(e);
33
32
  return n === e ? t : n;
34
- }, { navigate: v, basePath: y, orgId: b, productId: Oe } = e(), x = oe(), { emit: S } = ne(), [C, ke] = s(() => re(b)), [w, T] = s(!1), [E, D] = s(null), [O, k] = s(!1), [Ae, A] = s(!1), [j, M] = s(0), [N, P] = s(!1), { billingAccounts: F, currentAccount: I, paymentMethods: L, activeSubscriptions: R, hasActiveSubscription: z, recommendedAddons: je, isLoading: B, error: V, refetchAll: H } = ce(C, Oe), U = I?.id, Me = B, W = a((e) => {
35
- ke(e), ie(b, e);
36
- }, [b]), { addToCart: G, isInCart: K, getCartItem: q, updateQuantity: J, removeFromCart: Y } = me(), { createBillingAccount: Ne, setBillingAddress: X, setDefaultPaymentMethod: Pe, deletePaymentMethod: Fe, isCreatingAccount: Ie } = se();
33
+ }, { navigate: y, basePath: b, orgId: x, productId: ke } = e(), S = ae(), { emit: C } = te(), [w, Ae] = s(() => ne(x)), [T, E] = s(!1), [D, O] = s(null), [k, A] = s(!1), [je, Me] = s(!1), [j, M] = s(0), [N, P] = s(!1), { billingAccounts: F, currentAccount: I, paymentMethods: L, activeSubscriptions: R, hasActiveSubscription: z, recommendedAddons: Ne, isLoading: B, error: V, refetchAll: H } = se(w, ke), U = I?.id, Pe = B, W = a((e) => {
34
+ Ae(e), re(x, e);
35
+ }, [x]), { addToCart: G, isInCart: K, getCartItem: q, updateQuantity: J, removeFromCart: Y } = pe(), { createBillingAccount: X, setBillingAddress: Fe, setDefaultPaymentMethod: Ie, deletePaymentMethod: Le, isCreatingAccount: Re } = oe();
37
36
  o(() => {
38
37
  M(0), P(!1);
39
38
  }, [U, R.length]), o(() => {
40
- C && F.length > 0 && (F.some((e) => e.id === C) || W(null));
39
+ w && F.length > 0 && (F.some((e) => e.id === w) || W(null));
41
40
  }, [
42
41
  F,
43
- C,
42
+ w,
44
43
  W
45
44
  ]), o(() => {
46
- !C && F.length > 0 && W((F.find((e) => e.isDefault) ?? F[0]).id);
45
+ !w && F.length > 0 && W((F.find((e) => e.isDefault) ?? F[0]).id);
47
46
  }, [
48
47
  F,
49
- C,
48
+ w,
50
49
  W
51
50
  ]);
52
51
  let Z = R[j] || R[0] || null, Q = a((e) => {
53
52
  let t = e;
54
- y && y !== "/" && (t = `${y.endsWith("/") ? y.slice(0, -1) : y}${e.startsWith("/") ? e : `/${e}`}`), v(t);
55
- }, [v, y]), Le = a(async (e, t) => {
56
- D(null);
53
+ b && b !== "/" && (t = `${b.endsWith("/") ? b.slice(0, -1) : b}${e.startsWith("/") ? e : `/${e}`}`), y(t);
54
+ }, [y, b]), ze = a(async (e, t) => {
55
+ O(null);
57
56
  try {
58
- let n = await Ne(e);
59
- t && n.id && await X({
57
+ let n = await X(e);
58
+ t && n.id && await Fe({
60
59
  billingAccountId: n.id,
61
60
  ...t
62
- }), T(!1), W(n.id), S("billing.billing_account.created", {
61
+ }), E(!1), W(n.id), C("billing.billing_account.created", {
63
62
  route: "/billing/overview",
64
63
  entityId: n.id,
65
64
  source: "overview"
66
65
  }), await H();
67
66
  } catch (e) {
68
- D(e instanceof Error ? e.message : "Failed to create billing account");
67
+ O(e instanceof Error ? e.message : "Failed to create billing account");
69
68
  }
70
69
  }, [
71
- Ne,
72
- S,
73
- H,
74
70
  X,
71
+ C,
72
+ H,
73
+ Fe,
75
74
  W
76
- ]), Re = a(() => {
77
- A(!0);
75
+ ]), Be = a(() => {
76
+ Me(!0);
78
77
  }, []), $ = a(async () => {
79
78
  await H();
80
- }, [H]), ze = a(async () => {
81
- S("billing.payment_method.added", {
79
+ }, [H]), Ve = a(async () => {
80
+ C("billing.payment_method.added", {
82
81
  route: "/billing/overview",
83
82
  entityId: U,
84
83
  source: "overview"
85
84
  }), await $();
86
85
  }, [
87
86
  U,
88
- S,
87
+ C,
89
88
  $
90
- ]), Be = a(async (e) => {
91
- U && (await Pe(e, U), S("billing.payment_method.default_set", {
89
+ ]), He = a(async (e) => {
90
+ U && (await Ie(e, U), C("billing.payment_method.default_set", {
92
91
  route: "/billing/overview",
93
92
  entityId: e,
94
93
  source: "overview"
95
94
  }), await $());
96
95
  }, [
97
96
  U,
98
- S,
99
- Pe,
97
+ C,
98
+ Ie,
100
99
  $
101
- ]), Ve = a(async (e) => {
102
- U && (await Fe(e, U), S("billing.payment_method.deleted", {
100
+ ]), Ue = a(async (e) => {
101
+ U && (await Le(e, U), C("billing.payment_method.deleted", {
103
102
  route: "/billing/overview",
104
103
  entityId: e,
105
104
  source: "overview"
106
105
  }), await $());
107
106
  }, [
108
107
  U,
109
- Fe,
110
- S,
108
+ Le,
109
+ C,
111
110
  $
112
- ]), He = a((e) => {
113
- W(e.id), k(!1);
114
- }, [W]), Ue = a(async () => {
111
+ ]), We = a((e) => {
112
+ W(e.id), A(!1);
113
+ }, [W]), Ge = a(async () => {
115
114
  await H();
116
- }, [H]), We = a((e) => {
115
+ }, [H]), Ke = a((e) => {
117
116
  G(e);
118
- }, [G]), Ge = a((e) => K(e), [K]), Ke = a((e) => q(e)?.quantity || 0, [q]), qe = a((e, t) => {
117
+ }, [G]), qe = a((e) => K(e), [K]), Je = a((e) => q(e)?.quantity || 0, [q]), Ye = a((e, t) => {
119
118
  t <= 0 ? Y(e) : J(e, t);
120
- }, [J, Y]), Je = a((e) => {
119
+ }, [J, Y]), Xe = a((e) => {
121
120
  Y(e);
122
121
  }, [Y]);
123
- return x.canViewBillingAccount ? V && ae(V) && !B ? /* @__PURE__ */ m("div", {
122
+ return S.canViewBillingAccount ? V && ie(V) && !B ? /* @__PURE__ */ p("div", {
124
123
  className: "p-6",
125
- children: /* @__PURE__ */ m(te, {
124
+ children: /* @__PURE__ */ p(ee, {
126
125
  title: "Server Unavailable",
127
126
  message: "Unable to load billing overview. The server might be down or experiencing issues.",
128
- onRetry: Ue,
127
+ onRetry: Ge,
129
128
  showRetry: !0
130
129
  })
131
- }) : B && !I ? /* @__PURE__ */ m("div", {
130
+ }) : B && !I ? /* @__PURE__ */ p("div", {
132
131
  className: "flex items-center justify-center min-h-[400px]",
133
- children: /* @__PURE__ */ h("div", {
132
+ children: /* @__PURE__ */ m("div", {
134
133
  className: "flex flex-col items-center gap-3",
135
- children: [/* @__PURE__ */ m(be, { className: "size-8 animate-spin text-text-link" }), /* @__PURE__ */ m("p", {
134
+ children: [/* @__PURE__ */ p(be, { className: "size-8 animate-spin text-text-link" }), /* @__PURE__ */ p("p", {
136
135
  className: "text-sm text-text-secondary",
137
- children: _("billing.overview.loadingInfo", "Loading billing information...")
136
+ children: v("billing.overview.loadingInfo", "Loading billing information...")
138
137
  })]
139
138
  })
140
- }) : !B && F.length === 0 ? /* @__PURE__ */ h("div", {
139
+ }) : !B && F.length === 0 ? /* @__PURE__ */ m("div", {
141
140
  className: "px-6 lg:px-8 py-6",
142
141
  children: [
143
- /* @__PURE__ */ h("header", {
144
- className: "mb-8",
145
- children: [/* @__PURE__ */ m("h1", {
146
- className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
147
- children: _("billing.overview.title", "Billing Overview")
148
- }), /* @__PURE__ */ m("p", {
149
- className: "text-sm text-text-secondary mt-1",
150
- children: _("billing.overview.emptySetupDescription", "Set up billing to manage subscriptions, payments, and invoices")
151
- })]
142
+ /* @__PURE__ */ m("header", {
143
+ className: "relative overflow-hidden mb-8 rounded-card",
144
+ children: [
145
+ /* @__PURE__ */ p(h, { intensity: "subtle" }),
146
+ /* @__PURE__ */ p("h1", {
147
+ className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
148
+ children: /* @__PURE__ */ p(g, { children: v("billing.overview.title", "Billing Overview") })
149
+ }),
150
+ /* @__PURE__ */ p("p", {
151
+ className: "text-sm text-text-secondary mt-1",
152
+ children: v("billing.overview.emptySetupDescription", "Set up billing to manage subscriptions, payments, and invoices")
153
+ })
154
+ ]
152
155
  }),
153
- /* @__PURE__ */ m(ee, {
154
- icon: /* @__PURE__ */ m(c, { className: "size-6 text-text-secondary" }),
155
- title: _("billing.overview.emptyTitle", "No billing account"),
156
- description: _("billing.overview.emptyDescription", "Create a billing account to start managing your subscriptions and payments"),
157
- action: x.canManageBillingAccount ? /* @__PURE__ */ h("button", {
156
+ /* @__PURE__ */ p(Oe, {
157
+ illustration: "onboarding",
158
+ title: v("billing.overview.emptyTitle", "No billing account"),
159
+ description: v("billing.overview.emptyDescription", "Create a billing account to start managing your subscriptions and payments"),
160
+ action: S.canManageBillingAccount ? /* @__PURE__ */ m("button", {
158
161
  type: "button",
159
- onClick: () => T(!0),
162
+ onClick: () => E(!0),
160
163
  className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-action-primary-text bg-action-primary-bg rounded-button hover:bg-action-primary-bgHover transition-colors duration-200",
161
- children: [/* @__PURE__ */ m(xe, { className: "size-4" }), _("billing.overview.createBillingAccount", "Create Billing Account")]
164
+ children: [/* @__PURE__ */ p(u, { className: "size-4" }), v("billing.overview.createBillingAccount", "Create Billing Account")]
162
165
  }) : void 0
163
166
  }),
164
- /* @__PURE__ */ m(r, {
165
- isOpen: w,
167
+ /* @__PURE__ */ p(r, {
168
+ isOpen: T,
166
169
  onClose: () => {
167
- T(!1), D(null);
170
+ E(!1), O(null);
168
171
  },
169
- onSubmit: Le,
170
- isSubmitting: Ie,
171
- error: E
172
+ onSubmit: ze,
173
+ isSubmitting: Re,
174
+ error: D
172
175
  })
173
176
  ]
174
- }) : /* @__PURE__ */ h("div", {
177
+ }) : /* @__PURE__ */ m("div", {
175
178
  className: "px-6 lg:px-8 py-6 space-y-6 sm:space-y-8",
176
179
  children: [
177
- /* @__PURE__ */ h("header", {
178
- className: "flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4",
179
- children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h1", {
180
- className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
181
- children: _("billing.overview.title", "Billing Overview")
182
- }), /* @__PURE__ */ m("p", {
183
- className: "text-sm text-text-secondary mt-1",
184
- children: _("billing.overview.description", "Manage your billing accounts, subscriptions, and payment methods")
185
- })] }), /* @__PURE__ */ m(Ee, {
186
- primary: x.canManageBillingAccount && F.length > 0 ? {
187
- label: _("billing.overview.newAccount", "New Account"),
188
- onSelect: () => T(!0),
189
- icon: /* @__PURE__ */ m(xe, { className: "size-4" })
190
- } : void 0,
191
- actions: [{
192
- label: _("billing.overview.refresh", "Refresh"),
193
- onSelect: () => {
194
- Ue();
195
- },
196
- icon: /* @__PURE__ */ m(d, { className: `size-4 ${B ? "animate-spin" : ""}` })
197
- }]
198
- })]
180
+ /* @__PURE__ */ m("header", {
181
+ className: "relative overflow-hidden rounded-card flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4",
182
+ children: [
183
+ /* @__PURE__ */ p(h, { intensity: "subtle" }),
184
+ /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("h1", {
185
+ className: "text-2xl md:text-3xl font-semibold tracking-tight text-text-primary",
186
+ children: /* @__PURE__ */ p(g, { children: v("billing.overview.title", "Billing Overview") })
187
+ }), /* @__PURE__ */ p("p", {
188
+ className: "text-sm text-text-secondary mt-1",
189
+ children: v("billing.overview.description", "Manage your billing accounts, subscriptions, and payment methods")
190
+ })] }),
191
+ /* @__PURE__ */ p(Ee, {
192
+ primary: S.canManageBillingAccount && F.length > 0 ? {
193
+ label: v("billing.overview.newAccount", "New Account"),
194
+ onSelect: () => E(!0),
195
+ icon: /* @__PURE__ */ p(u, { className: "size-4" })
196
+ } : void 0,
197
+ actions: [{
198
+ label: v("billing.overview.refresh", "Refresh"),
199
+ onSelect: () => {
200
+ Ge();
201
+ },
202
+ icon: /* @__PURE__ */ p(Se, { className: `size-4 ${B ? "animate-spin" : ""}` })
203
+ }]
204
+ })
205
+ ]
199
206
  }),
200
- F.length > 1 && /* @__PURE__ */ h("div", {
207
+ F.length > 1 && /* @__PURE__ */ m("div", {
201
208
  className: "relative",
202
209
  "data-tour": "billing-overview-account-selector",
203
- children: [/* @__PURE__ */ h("button", {
210
+ children: [/* @__PURE__ */ m("button", {
204
211
  type: "button",
205
- onClick: () => k(!O),
212
+ onClick: () => A(!k),
206
213
  className: "w-full sm:w-auto flex items-center justify-between gap-3 px-4 py-3 border border-border-seam rounded-card bg-bg-surface hover:bg-bg-sunken hover:border-border-strong transition-all duration-200",
207
- children: [/* @__PURE__ */ h("div", {
214
+ children: [/* @__PURE__ */ m("div", {
208
215
  className: "flex items-center gap-3",
209
- children: [/* @__PURE__ */ m("div", {
216
+ children: [/* @__PURE__ */ p("div", {
210
217
  className: "size-9 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
211
- children: /* @__PURE__ */ m(c, { className: "size-4 text-text-link" })
212
- }), /* @__PURE__ */ h("div", {
218
+ children: /* @__PURE__ */ p(c, { className: "size-4 text-text-link" })
219
+ }), /* @__PURE__ */ m("div", {
213
220
  className: "text-left",
214
- children: [/* @__PURE__ */ m("p", {
221
+ children: [/* @__PURE__ */ p("p", {
215
222
  className: "text-sm font-medium text-text-primary",
216
- children: I?.name || _("billing.overview.selectAccount", "Select Account")
217
- }), /* @__PURE__ */ m("p", {
223
+ children: I?.name || v("billing.overview.selectAccount", "Select Account")
224
+ }), /* @__PURE__ */ p("p", {
218
225
  className: "text-xs text-text-secondary",
219
226
  children: I?.email
220
227
  })]
221
228
  })]
222
- }), /* @__PURE__ */ m(u, { className: `size-4 text-text-muted transition-transform ${O ? "rotate-180" : ""}` })]
223
- }), O && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("div", {
229
+ }), /* @__PURE__ */ p(_e, { className: `size-4 text-text-muted transition-transform ${k ? "rotate-180" : ""}` })]
230
+ }), k && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", {
224
231
  className: "fixed inset-0 z-10",
225
- onClick: () => k(!1)
226
- }), /* @__PURE__ */ m("div", {
232
+ onClick: () => A(!1)
233
+ }), /* @__PURE__ */ p("div", {
227
234
  className: "absolute top-full left-0 right-0 sm:right-auto mt-1 w-full sm:w-80 bg-bg-elevated border border-border-seam rounded-card shadow-elevation-3 z-20 py-1 max-h-60 overflow-y-auto",
228
- children: F.map((e) => /* @__PURE__ */ h("button", {
235
+ children: F.map((e) => /* @__PURE__ */ m("button", {
229
236
  type: "button",
230
- onClick: () => He(e),
237
+ onClick: () => We(e),
231
238
  className: "w-full flex items-center justify-between gap-3 px-4 py-3 hover:bg-bg-sunken transition-colors",
232
- children: [/* @__PURE__ */ h("div", {
239
+ children: [/* @__PURE__ */ m("div", {
233
240
  className: "flex items-center gap-3 min-w-0",
234
- children: [/* @__PURE__ */ m("div", {
241
+ children: [/* @__PURE__ */ p("div", {
235
242
  className: "size-9 rounded-lg bg-bg-sunken flex items-center justify-center flex-shrink-0",
236
- children: /* @__PURE__ */ m(c, { className: "size-4 text-text-secondary" })
237
- }), /* @__PURE__ */ h("div", {
243
+ children: /* @__PURE__ */ p(c, { className: "size-4 text-text-secondary" })
244
+ }), /* @__PURE__ */ m("div", {
238
245
  className: "text-left min-w-0",
239
- children: [/* @__PURE__ */ m("p", {
246
+ children: [/* @__PURE__ */ p("p", {
240
247
  className: "text-sm font-medium text-text-primary truncate",
241
248
  children: e.name
242
- }), /* @__PURE__ */ m("p", {
249
+ }), /* @__PURE__ */ p("p", {
243
250
  className: "text-xs text-text-secondary truncate",
244
251
  children: e.email
245
252
  })]
246
253
  })]
247
- }), I?.id === e.id && /* @__PURE__ */ m(l, { className: "size-4 text-text-link flex-shrink-0" })]
254
+ }), I?.id === e.id && /* @__PURE__ */ p(l, { className: "size-4 text-text-link flex-shrink-0" })]
248
255
  }, e.id))
249
256
  })] })]
250
257
  }),
251
- I && /* @__PURE__ */ h("div", {
258
+ I && /* @__PURE__ */ m("div", {
252
259
  className: "grid grid-cols-1 xs:grid-cols-2 sm:grid-cols-4 gap-3 sm:gap-4",
253
260
  "data-tour": "billing-overview-stats-row",
254
261
  children: [
255
- /* @__PURE__ */ m(n, {
256
- label: _("billing.overview.stats.creditBalance", "Credit Balance"),
262
+ /* @__PURE__ */ p(n, {
263
+ label: v("billing.overview.stats.creditBalance", "Credit Balance"),
257
264
  value: `${(I.creditAmount || 0).toLocaleString()} Credits`,
258
- icon: /* @__PURE__ */ m(f, { className: "size-5" })
265
+ icon: /* @__PURE__ */ p(d, { className: "size-5" })
259
266
  }),
260
- /* @__PURE__ */ m(n, {
261
- label: _("billing.overview.stats.activePlans", "Active Plans"),
262
- value: R.length > 0 ? R.length === 1 ? R[0]?.plan?.name || "1 Plan" : `${R.length} ${_("billing.overview.stats.plansSuffix", "Plans")}` : _("billing.overview.stats.none", "None"),
263
- icon: /* @__PURE__ */ m(d, { className: "size-5" })
267
+ /* @__PURE__ */ p(n, {
268
+ label: v("billing.overview.stats.activePlans", "Active Plans"),
269
+ value: R.length > 0 ? R.length === 1 ? R[0]?.plan?.name || "1 Plan" : `${R.length} ${v("billing.overview.stats.plansSuffix", "Plans")}` : v("billing.overview.stats.none", "None"),
270
+ icon: /* @__PURE__ */ p(Se, { className: "size-5" })
264
271
  }),
265
- /* @__PURE__ */ m(n, {
266
- label: _("billing.overview.stats.paymentMethods", "Payment Methods"),
272
+ /* @__PURE__ */ p(n, {
273
+ label: v("billing.overview.stats.paymentMethods", "Payment Methods"),
267
274
  value: L.length,
268
- icon: /* @__PURE__ */ m(c, { className: "size-5" })
275
+ icon: /* @__PURE__ */ p(c, { className: "size-5" })
269
276
  }),
270
- /* @__PURE__ */ m(n, {
271
- label: _("billing.overview.stats.paymentCurrency", "Payment Currency"),
277
+ /* @__PURE__ */ p(n, {
278
+ label: v("billing.overview.stats.paymentCurrency", "Payment Currency"),
272
279
  value: I.currency || "USD",
273
- icon: /* @__PURE__ */ m(c, { className: "size-5" })
280
+ icon: /* @__PURE__ */ p(c, { className: "size-5" })
274
281
  })
275
282
  ]
276
283
  }),
277
- /* @__PURE__ */ h("div", {
284
+ /* @__PURE__ */ m("div", {
278
285
  className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
279
- children: [/* @__PURE__ */ h("div", {
286
+ children: [/* @__PURE__ */ m("div", {
280
287
  className: "lg:col-span-2 space-y-6",
281
288
  children: [
282
- I && /* @__PURE__ */ m(le, {
289
+ I && /* @__PURE__ */ p(ce, {
283
290
  dataTour: "billing-overview-billing-account-card",
284
291
  account: I,
285
292
  isDefault: I.isDefault ?? !1,
@@ -287,24 +294,24 @@ var g = () => {
287
294
  onViewTransactions: () => Q(`/transactions/${I.id}`),
288
295
  onViewCreditTransactions: () => Q(`/creditTransactions/${I.id}`)
289
296
  }),
290
- /* @__PURE__ */ h("div", {
297
+ /* @__PURE__ */ m("div", {
291
298
  className: "space-y-3",
292
- children: [R.length > 1 && /* @__PURE__ */ h("div", {
299
+ children: [R.length > 1 && /* @__PURE__ */ m("div", {
293
300
  className: "relative",
294
- children: [/* @__PURE__ */ h("button", {
301
+ children: [/* @__PURE__ */ m("button", {
295
302
  type: "button",
296
303
  onClick: () => P(!N),
297
304
  className: "w-full sm:w-auto flex items-center justify-between gap-3 px-4 py-3 border border-border-seam rounded-card bg-bg-surface hover:bg-bg-sunken hover:border-border-strong transition-all duration-200",
298
- children: [/* @__PURE__ */ h("div", {
305
+ children: [/* @__PURE__ */ m("div", {
299
306
  className: "flex items-center gap-3",
300
- children: [/* @__PURE__ */ m("div", {
307
+ children: [/* @__PURE__ */ p("div", {
301
308
  className: "size-9 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
302
- children: /* @__PURE__ */ m(ye, { className: "size-4 text-text-link" })
303
- }), /* @__PURE__ */ h("div", {
309
+ children: /* @__PURE__ */ p(ye, { className: "size-4 text-text-link" })
310
+ }), /* @__PURE__ */ m("div", {
304
311
  className: "text-left",
305
- children: [/* @__PURE__ */ h("p", {
312
+ children: [/* @__PURE__ */ m("p", {
306
313
  className: "text-sm font-medium text-text-primary",
307
- children: [Z?.plan?.name || _("billing.overview.selectSubscription", "Select Subscription"), Z?.plan?.product?.name && /* @__PURE__ */ h("span", {
314
+ children: [Z?.plan?.name || v("billing.overview.selectSubscription", "Select Subscription"), Z?.plan?.product?.name && /* @__PURE__ */ m("span", {
308
315
  className: "text-text-secondary font-normal",
309
316
  children: [
310
317
  " ",
@@ -312,53 +319,53 @@ var g = () => {
312
319
  Z.plan.product.name
313
320
  ]
314
321
  })]
315
- }), /* @__PURE__ */ h("p", {
322
+ }), /* @__PURE__ */ m("p", {
316
323
  className: "text-xs text-text-secondary",
317
324
  children: [
318
325
  R.length,
319
326
  " ",
320
- _("billing.overview.activeSubscriptions", "active subscriptions")
327
+ v("billing.overview.activeSubscriptions", "active subscriptions")
321
328
  ]
322
329
  })]
323
330
  })]
324
- }), /* @__PURE__ */ m(u, { className: `size-4 text-text-muted transition-transform ${N ? "rotate-180" : ""}` })]
325
- }), N && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("div", {
331
+ }), /* @__PURE__ */ p(_e, { className: `size-4 text-text-muted transition-transform ${N ? "rotate-180" : ""}` })]
332
+ }), N && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", {
326
333
  className: "fixed inset-0 z-10",
327
334
  onClick: () => P(!1)
328
- }), /* @__PURE__ */ m("div", {
335
+ }), /* @__PURE__ */ p("div", {
329
336
  className: "absolute top-full left-0 right-0 sm:right-auto mt-1 w-full sm:w-80 bg-bg-elevated border border-border-seam rounded-card shadow-elevation-3 z-20 py-1 max-h-60 overflow-y-auto",
330
- children: R.map((e, t) => /* @__PURE__ */ h("button", {
337
+ children: R.map((e, t) => /* @__PURE__ */ m("button", {
331
338
  type: "button",
332
339
  onClick: () => {
333
340
  M(t), P(!1);
334
341
  },
335
342
  className: "w-full flex items-center justify-between gap-3 px-4 py-3 hover:bg-bg-sunken transition-colors",
336
- children: [/* @__PURE__ */ h("div", {
343
+ children: [/* @__PURE__ */ m("div", {
337
344
  className: "flex items-center gap-3 min-w-0",
338
- children: [/* @__PURE__ */ m("div", {
345
+ children: [/* @__PURE__ */ p("div", {
339
346
  className: "size-9 rounded-lg bg-bg-sunken flex items-center justify-center flex-shrink-0",
340
- children: /* @__PURE__ */ m(ye, { className: "size-4 text-text-secondary" })
341
- }), /* @__PURE__ */ h("div", {
347
+ children: /* @__PURE__ */ p(ye, { className: "size-4 text-text-secondary" })
348
+ }), /* @__PURE__ */ m("div", {
342
349
  className: "text-left min-w-0",
343
- children: [/* @__PURE__ */ m("p", {
350
+ children: [/* @__PURE__ */ p("p", {
344
351
  className: "text-sm font-medium text-text-primary truncate",
345
- children: e.plan?.name || _("billing.overview.subscription", "Subscription")
346
- }), /* @__PURE__ */ h("p", {
352
+ children: e.plan?.name || v("billing.overview.subscription", "Subscription")
353
+ }), /* @__PURE__ */ m("p", {
347
354
  className: "text-xs text-text-secondary truncate",
348
355
  children: [
349
- e.plan?.product?.name || _("billing.overview.unknownProduct", "Unknown Product"),
356
+ e.plan?.product?.name || v("billing.overview.unknownProduct", "Unknown Product"),
350
357
  " ",
351
358
  "· ",
352
- _("billing.overview.ends", "Ends"),
359
+ v("billing.overview.ends", "Ends"),
353
360
  " ",
354
361
  new Date(e.endDate).toLocaleDateString()
355
362
  ]
356
363
  })]
357
364
  })]
358
- }), j === t && /* @__PURE__ */ m(l, { className: "size-4 text-text-link flex-shrink-0" })]
365
+ }), j === t && /* @__PURE__ */ p(l, { className: "size-4 text-text-link flex-shrink-0" })]
359
366
  }, e.id))
360
367
  })] })]
361
- }), /* @__PURE__ */ m(de, {
368
+ }), /* @__PURE__ */ p(ue, {
362
369
  dataTour: "billing-overview-active-subscription-card",
363
370
  subscription: Z,
364
371
  onViewDetails: () => Z && Q(i(`/subscriptions/${Z.id}`, Z.billingAccountId ?? I?.id)),
@@ -367,128 +374,130 @@ var g = () => {
367
374
  onPurchasePlan: () => Q("/plans")
368
375
  })]
369
376
  }),
370
- I && /* @__PURE__ */ m(ue, {
377
+ I && /* @__PURE__ */ p(le, {
371
378
  dataTour: "billing-overview-payment-methods-section",
372
379
  paymentMethods: L,
373
380
  billingAccountId: I.id,
374
- onAddPaymentMethod: Re,
375
- onSetDefault: Be,
376
- onDelete: Ve,
381
+ onAddPaymentMethod: Be,
382
+ onSetDefault: He,
383
+ onDelete: Ue,
377
384
  isLoading: B
378
385
  })
379
386
  ]
380
- }), /* @__PURE__ */ h("div", {
387
+ }), /* @__PURE__ */ m("div", {
381
388
  className: "space-y-6",
382
- children: [/* @__PURE__ */ h("section", {
389
+ children: [/* @__PURE__ */ m("section", {
383
390
  className: "border border-border-seam rounded-card bg-bg-surface shadow-elevation-1 p-5",
384
391
  "data-tour": "billing-overview-quick-actions",
385
- children: [/* @__PURE__ */ m("h3", {
392
+ children: [/* @__PURE__ */ p("h3", {
386
393
  className: "font-semibold text-text-primary mb-4",
387
394
  children: "Quick Actions"
388
- }), /* @__PURE__ */ h("div", {
395
+ }), /* @__PURE__ */ m("div", {
389
396
  className: "space-y-1.5",
390
397
  children: [
391
- /* @__PURE__ */ h("button", {
398
+ /* @__PURE__ */ m("button", {
392
399
  type: "button",
393
400
  onClick: () => I && Q(`/transactions/${I.id}`),
394
401
  disabled: !I,
395
402
  className: "w-full flex items-center gap-3 px-3 py-2.5 text-sm text-left text-text-primary hover:bg-bg-sunken rounded-button transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
396
- children: [/* @__PURE__ */ m("div", {
403
+ children: [/* @__PURE__ */ p("div", {
397
404
  className: "size-9 rounded-lg bg-status-info-bg-subtle flex items-center justify-center",
398
- children: /* @__PURE__ */ m(Se, { className: "size-4 text-status-info-text" })
405
+ children: /* @__PURE__ */ p(xe, { className: "size-4 text-status-info-text" })
399
406
  }), "View Transactions"]
400
407
  }),
401
- /* @__PURE__ */ h("button", {
408
+ /* @__PURE__ */ m("button", {
402
409
  type: "button",
403
410
  onClick: () => I && Q(`/creditTransactions/${I.id}`),
404
411
  disabled: !I,
405
412
  className: "w-full flex items-center gap-3 px-3 py-2.5 text-sm text-left text-text-primary hover:bg-bg-sunken rounded-button transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
406
- children: [/* @__PURE__ */ m("div", {
413
+ children: [/* @__PURE__ */ p("div", {
407
414
  className: "size-9 rounded-lg bg-status-warning-bg-subtle flex items-center justify-center",
408
- children: /* @__PURE__ */ m(f, { className: "size-4 text-status-warning-text" })
415
+ children: /* @__PURE__ */ p(d, { className: "size-4 text-status-warning-text" })
409
416
  }), "Credit History"]
410
417
  }),
411
- /* @__PURE__ */ h("button", {
418
+ /* @__PURE__ */ m("button", {
412
419
  type: "button",
413
420
  onClick: () => Q("/checkout/credits"),
414
421
  className: "w-full flex items-center gap-3 px-3 py-2.5 text-sm text-left text-text-primary hover:bg-bg-sunken rounded-button transition-colors",
415
- children: [/* @__PURE__ */ m("div", {
422
+ children: [/* @__PURE__ */ p("div", {
416
423
  className: "size-9 rounded-lg bg-status-success-bg-subtle flex items-center justify-center",
417
- children: /* @__PURE__ */ m(ve, { className: "size-4 text-status-success-text" })
424
+ children: /* @__PURE__ */ p(ve, { className: "size-4 text-status-success-text" })
418
425
  }), "Purchase Credits"]
419
426
  }),
420
- /* @__PURE__ */ h("button", {
427
+ /* @__PURE__ */ m("button", {
421
428
  type: "button",
422
429
  onClick: () => I && Q(`/usage?billingAccountId=${I.id}`),
423
430
  disabled: !I,
424
431
  className: "w-full flex items-center gap-3 px-3 py-2.5 text-sm text-left text-text-primary hover:bg-bg-sunken rounded-button transition-colors disabled:opacity-50 disabled:cursor-not-allowed",
425
- children: [/* @__PURE__ */ m("div", {
432
+ children: [/* @__PURE__ */ p("div", {
426
433
  className: "size-9 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
427
- children: /* @__PURE__ */ m(ge, { className: "size-4 text-text-link" })
434
+ children: /* @__PURE__ */ p(he, { className: "size-4 text-text-link" })
428
435
  }), "Usage Analytics"]
429
436
  })
430
437
  ]
431
438
  })]
432
- }), !z && /* @__PURE__ */ h(De, {
439
+ }), !z && /* @__PURE__ */ m(De, {
440
+ treatment: "glass",
441
+ glow: !0,
433
442
  className: "p-5",
434
- children: [/* @__PURE__ */ h("div", {
443
+ children: [/* @__PURE__ */ m("div", {
435
444
  className: "flex items-start gap-3 mb-4",
436
- children: [/* @__PURE__ */ m("div", {
445
+ children: [/* @__PURE__ */ p("div", {
437
446
  className: "size-10 rounded-lg bg-bg-surface flex items-center justify-center flex-shrink-0 shadow-elevation-1",
438
- children: /* @__PURE__ */ m(Ce, { className: "size-5 text-text-link" })
439
- }), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h3", {
447
+ children: /* @__PURE__ */ p(Ce, { className: "size-5 text-text-link" })
448
+ }), /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("h3", {
440
449
  className: "font-semibold text-text-primary",
441
450
  children: "Get Started"
442
- }), /* @__PURE__ */ m("p", {
451
+ }), /* @__PURE__ */ p("p", {
443
452
  className: "text-sm text-text-secondary mt-1",
444
453
  children: "Choose a plan that fits your needs to unlock all features"
445
454
  })] })]
446
- }), /* @__PURE__ */ h(Te, {
455
+ }), /* @__PURE__ */ m(Te, {
447
456
  type: "button",
448
457
  onClick: () => Q("/plans"),
449
458
  className: "w-full",
450
- children: ["Browse Plans", /* @__PURE__ */ m(_e, { className: "size-4" })]
459
+ children: ["Browse Plans", /* @__PURE__ */ p(ge, { className: "size-4" })]
451
460
  })]
452
461
  })]
453
462
  })]
454
463
  }),
455
- /* @__PURE__ */ m(fe, {
464
+ /* @__PURE__ */ p(de, {
456
465
  dataTour: "billing-overview-recommended-addons",
457
- addons: je,
466
+ addons: Ne,
458
467
  hasSubscription: z,
459
468
  onViewAddon: (e) => Q(`/addons/${e}`),
460
469
  onPurchaseAddon: (e) => Q(`/addons/${e}?action=purchase`),
461
470
  onViewAllAddons: () => Q("/addons"),
462
- onAddToCart: We,
463
- isInCart: Ge,
464
- getCartQuantity: Ke,
465
- onUpdateQuantity: qe,
466
- onRemoveFromCart: Je,
471
+ onAddToCart: Ke,
472
+ isInCart: qe,
473
+ getCartQuantity: Je,
474
+ onUpdateQuantity: Ye,
475
+ onRemoveFromCart: Xe,
467
476
  maxAddons: 3,
468
- isLoading: Me
477
+ isLoading: Pe
469
478
  }),
470
- /* @__PURE__ */ m(he, {}),
471
- /* @__PURE__ */ m(r, {
472
- isOpen: w,
479
+ /* @__PURE__ */ p(me, {}),
480
+ /* @__PURE__ */ p(r, {
481
+ isOpen: T,
473
482
  onClose: () => {
474
- T(!1), D(null);
483
+ E(!1), O(null);
475
484
  },
476
- onSubmit: Le,
477
- isSubmitting: Ie,
478
- error: E
485
+ onSubmit: ze,
486
+ isSubmitting: Re,
487
+ error: D
479
488
  }),
480
- I && /* @__PURE__ */ m(pe, {
481
- isOpen: Ae,
482
- onClose: () => A(!1),
489
+ I && /* @__PURE__ */ p(fe, {
490
+ isOpen: je,
491
+ onClose: () => Me(!1),
483
492
  billingAccountId: I.id,
484
493
  currency: I.currency,
485
494
  country: I.billingAddresses?.[0]?.country,
486
- onSuccess: ze
495
+ onSuccess: Ve
487
496
  })
488
497
  ]
489
- }) : /* @__PURE__ */ m(t, { message: "You don't have permission to view billing information." });
498
+ }) : /* @__PURE__ */ p(t, { message: "You don't have permission to view billing information." });
490
499
  };
491
500
  //#endregion
492
- export { g as OverviewPage };
501
+ export { _ as OverviewPage };
493
502
 
494
503
  //# sourceMappingURL=OverviewPage.js.map