@burdenoff/microfe-billing 2026.828.3 → 2026.828.5

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.
@@ -9,32 +9,32 @@ import { getPlanFeatureQuantity as o } from "../../../shared/utils/planFeatureQu
9
9
  import "../../../shared/utils/index.js";
10
10
  import { useBillingPermissions as s } from "../../../hooks/useBillingPermissions.js";
11
11
  import { useBillingNavigate as c } from "../../../hooks/useBillingNavigate.js";
12
- import { usePlan as l, usePlanMutations as ee } from "../hooks/usePlans.js";
13
- import { useQuotas as u } from "../hooks/useQuotas.js";
12
+ import { usePlan as l, usePlanMutations as u } from "../hooks/usePlans.js";
13
+ import { useQuotas as d } from "../hooks/useQuotas.js";
14
14
  import "../hooks/index.js";
15
- import { useEffect as d, useState as f } from "react";
16
- import { useParams as p } from "react-router";
17
- import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
18
- import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
19
- import { PagePurpose as v } from "@burdenoff/fe-libs/ui";
15
+ import { useEffect as f, useState as p } from "react";
16
+ import { useParams as m } from "react-router";
17
+ import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
18
+ import { useI18n as v } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
19
+ import { PagePurpose as y } from "@burdenoff/fe-libs/ui";
20
20
  //#region src/billing/modules/plans/pages/PlanEditPage.tsx
21
- var y = () => {
22
- let { t: y } = _(), b = (e, t) => {
23
- let n = y(e);
21
+ var b = () => {
22
+ let { t: b } = v(), x = (e, t) => {
23
+ let n = b(e);
24
24
  return n === e ? t : n;
25
- }, { planId: x } = p(), S = c(), C = s(), { plan: w, isLoading: T, error: E, refetch: D } = l(x), { quotas: O, isLoading: k } = u({ onlyActive: !0 }), { updatePlan: A, isUpdating: j } = ee(), [M, N] = f(""), [P, F] = f(""), [I, L] = f("USD"), [R, z] = f(i.MONTHLY), [B, V] = f(!0), [H, U] = f(!0), [W, G] = f([]), [K, q] = f([]), [J, Y] = f(null), [X, Z] = f(!1);
26
- if (d(() => {
27
- if (w) {
28
- if (N(w.name ?? ""), F(String(w.price ?? "")), L(w.currency ?? "USD"), z(w.duration ?? i.MONTHLY), V(w.isActive ?? !0), U(w.isPurchasable ?? !0), w.currencyPrices && typeof w.currencyPrices == "object") {
29
- let e = w.currencyPrices;
25
+ }, { planId: S } = m(), C = c(), w = s(), { plan: T, isLoading: ee, error: E, refetch: D } = l(S), { quotas: O, isLoading: k } = d({ onlyActive: !0 }), { updatePlan: A, isUpdating: j } = u(), [M, N] = p(""), [P, F] = p(""), [I, L] = p("USD"), [R, z] = p(i.MONTHLY), [B, V] = p(!0), [H, U] = p(!0), [W, G] = p([]), [K, q] = p([]), [J, Y] = p(null), [X, Z] = p(!1);
26
+ if (f(() => {
27
+ if (T) {
28
+ if (N(T.name ?? ""), F(String(T.price ?? "")), L(T.currency ?? "USD"), z(T.duration ?? i.MONTHLY), V(T.isActive ?? !0), U(T.isPurchasable ?? !0), T.currencyPrices && typeof T.currencyPrices == "object") {
29
+ let e = T.currencyPrices;
30
30
  q(Object.entries(e).filter(([, e]) => typeof e == "number").map(([e, t]) => ({
31
31
  currency: e,
32
32
  amount: t
33
33
  })));
34
34
  }
35
- if (w.features && w.features.length > 0) {
35
+ if (T.features && T.features.length > 0) {
36
36
  let e = [], t = /* @__PURE__ */ new Map();
37
- for (let e of w.features) if (e.quota?.id) {
37
+ for (let e of T.features) if (e.quota?.id) {
38
38
  let n = e.quota.id, r = o(e) || 1;
39
39
  t.set(n, r);
40
40
  }
@@ -45,10 +45,10 @@ var y = () => {
45
45
  G(e);
46
46
  }
47
47
  }
48
- }, [w]), !C.canManagePlans) return /* @__PURE__ */ h(e, { message: b("billing.plans.noEditPermission", "You don't have permission to edit plans.") });
49
- if (T || k) return /* @__PURE__ */ g("div", {
48
+ }, [T]), !w.canManagePlans) return /* @__PURE__ */ g(e, { message: x("billing.plans.noEditPermission", "You don't have permission to edit plans.") });
49
+ if (ee || k) return /* @__PURE__ */ _("div", {
50
50
  className: "space-y-6 p-6",
51
- children: [/* @__PURE__ */ h("div", { className: "h-8 w-48 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ h("div", {
51
+ children: [/* @__PURE__ */ g("div", { className: "h-8 w-48 bg-bg-sunken animate-pulse rounded" }), /* @__PURE__ */ g("div", {
52
52
  className: "max-w-2xl space-y-4",
53
53
  children: [
54
54
  1,
@@ -56,28 +56,28 @@ var y = () => {
56
56
  3,
57
57
  4,
58
58
  5
59
- ].map((e) => /* @__PURE__ */ h("div", { className: "h-16 bg-bg-sunken animate-pulse rounded" }, e))
59
+ ].map((e) => /* @__PURE__ */ g("div", { className: "h-16 bg-bg-sunken animate-pulse rounded" }, e))
60
60
  })]
61
61
  });
62
- if (E && a(E)) return /* @__PURE__ */ h("div", {
62
+ if (E && a(E)) return /* @__PURE__ */ g("div", {
63
63
  className: "p-6",
64
- children: /* @__PURE__ */ h(n, {
65
- title: b("billing.plans.serverUnavailable", "Server Unavailable"),
66
- message: b("billing.plans.serverUnavailableLoadPlan", "Unable to load plan. The server might be down or experiencing issues."),
64
+ children: /* @__PURE__ */ g(n, {
65
+ title: x("billing.plans.serverUnavailable", "Server Unavailable"),
66
+ message: x("billing.plans.serverUnavailableLoadPlan", "Unable to load plan. The server might be down or experiencing issues."),
67
67
  onRetry: () => D(),
68
68
  showRetry: !0
69
69
  })
70
70
  });
71
- if (!w) return /* @__PURE__ */ h("div", {
71
+ if (!T) return /* @__PURE__ */ g("div", {
72
72
  className: "flex items-center justify-center h-full min-h-[400px]",
73
- children: /* @__PURE__ */ g("div", {
73
+ children: /* @__PURE__ */ _("div", {
74
74
  className: "text-center space-y-4",
75
- children: [/* @__PURE__ */ h("h2", {
75
+ children: [/* @__PURE__ */ g("h2", {
76
76
  className: "text-lg font-semibold text-text-primary",
77
- children: b("billing.plans.planNotFound", "Plan not found")
78
- }), /* @__PURE__ */ h("button", {
77
+ children: x("billing.plans.planNotFound", "Plan not found")
78
+ }), /* @__PURE__ */ g("button", {
79
79
  type: "button",
80
- onClick: () => S("/plans"),
80
+ onClick: () => C("/plans"),
81
81
  className: "px-4 py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover",
82
82
  children: "Back to Plans"
83
83
  })]
@@ -94,15 +94,15 @@ var y = () => {
94
94
  let r = [...W];
95
95
  t === "quotaId" ? r[e].quotaId = n : r[e].quantity = Number(n), G(r);
96
96
  };
97
- return /* @__PURE__ */ g("div", {
97
+ return /* @__PURE__ */ _("div", {
98
98
  className: "space-y-6 p-6",
99
99
  children: [
100
- /* @__PURE__ */ h(t, {
101
- title: `Edit Plan: ${w.name}`,
102
- description: b("billing.plans.editPlanDesc", "Update the plan details and quota allocations")
100
+ /* @__PURE__ */ g(t, {
101
+ title: `Edit Plan: ${T.name}`,
102
+ description: x("billing.plans.editPlanDesc", "Update the plan details and quota allocations")
103
103
  }),
104
- /* @__PURE__ */ h(v, { children: b("billing.plans.editPurpose", "Update this plan's price, currency/seat pricing and the quotas it grants. Changes apply to new subscriptions; existing subscribers keep the terms they signed up with until they renew or change plans.") }),
105
- /* @__PURE__ */ g("form", {
104
+ /* @__PURE__ */ g(y, { children: x("billing.plans.editPurpose", "Update this plan's price, currency/seat pricing and the quotas it grants. Changes apply to new subscriptions; existing subscribers keep the terms they signed up with until they renew or change plans.") }),
105
+ /* @__PURE__ */ _("form", {
106
106
  onSubmit: async (e) => {
107
107
  if (e.preventDefault(), Y(null), Z(!1), !M.trim()) {
108
108
  Y("Plan name is required");
@@ -121,7 +121,7 @@ var y = () => {
121
121
  return;
122
122
  }
123
123
  let t = {
124
- id: x,
124
+ id: S,
125
125
  name: M.trim(),
126
126
  price: Number(P),
127
127
  currency: I,
@@ -135,60 +135,60 @@ var y = () => {
135
135
  ...K.length > 0 ? { currencyPriceOverrides: K } : {}
136
136
  };
137
137
  try {
138
- await A(t), Z(!0), setTimeout(() => S(`/plans/${x}`), 1500);
138
+ await A(t), Z(!0), setTimeout(() => C(`/plans/${S}`), 1500);
139
139
  } catch (e) {
140
140
  Y(e instanceof Error ? e.message : "Failed to update plan");
141
141
  }
142
142
  },
143
143
  className: "space-y-6",
144
144
  children: [
145
- J && /* @__PURE__ */ h("div", {
145
+ J && /* @__PURE__ */ g("div", {
146
146
  className: "p-4 bg-status-error-bg-subtle border border-border-subtle rounded-lg",
147
- children: /* @__PURE__ */ h("p", {
147
+ children: /* @__PURE__ */ g("p", {
148
148
  className: "text-sm text-status-error-text",
149
149
  children: J
150
150
  })
151
151
  }),
152
- X && /* @__PURE__ */ h("div", {
152
+ X && /* @__PURE__ */ g("div", {
153
153
  className: "p-4 bg-status-success-bg-subtle border border-border-subtle rounded-lg",
154
- children: /* @__PURE__ */ h("p", {
154
+ children: /* @__PURE__ */ g("p", {
155
155
  className: "text-sm text-status-success-text",
156
- children: b("billing.plans.updateSuccess", "Plan updated successfully! Redirecting...")
156
+ children: x("billing.plans.updateSuccess", "Plan updated successfully! Redirecting...")
157
157
  })
158
158
  }),
159
- /* @__PURE__ */ g("div", {
159
+ /* @__PURE__ */ _("div", {
160
160
  className: "grid grid-cols-1 lg:grid-cols-2 gap-6",
161
- children: [/* @__PURE__ */ g("div", {
161
+ children: [/* @__PURE__ */ _("div", {
162
162
  className: "border border-border-seam rounded-card bg-bg-surface overflow-hidden shadow-[var(--shadow-elevation-1)] h-fit",
163
- children: [/* @__PURE__ */ h("div", {
163
+ children: [/* @__PURE__ */ g("div", {
164
164
  className: "p-4 border-b border-border-subtle bg-bg-sunken/30",
165
- children: /* @__PURE__ */ h("h2", {
165
+ children: /* @__PURE__ */ g("h2", {
166
166
  className: "font-semibold text-text-primary",
167
- children: b("billing.plans.basicInfo", "Basic Information")
167
+ children: x("billing.plans.basicInfo", "Basic Information")
168
168
  })
169
- }), /* @__PURE__ */ g("div", {
169
+ }), /* @__PURE__ */ _("div", {
170
170
  className: "p-4 space-y-4",
171
171
  children: [
172
- /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ g("label", {
172
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ _("label", {
173
173
  htmlFor: "name",
174
174
  className: "block text-sm font-medium text-text-primary mb-1",
175
- children: [b("billing.plans.planNameLabel", "Plan Name"), " *"]
176
- }), /* @__PURE__ */ h("input", {
175
+ children: [x("billing.plans.planNameLabel", "Plan Name"), " *"]
176
+ }), /* @__PURE__ */ g("input", {
177
177
  id: "name",
178
178
  type: "text",
179
179
  value: M,
180
180
  onChange: (e) => N(e.target.value),
181
181
  className: "w-full px-3 py-2 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
182
- placeholder: b("billing.plans.planNamePlaceholder", "e.g., Pro Plan"),
182
+ placeholder: x("billing.plans.planNamePlaceholder", "e.g., Pro Plan"),
183
183
  required: !0
184
184
  })] }),
185
- /* @__PURE__ */ g("div", {
185
+ /* @__PURE__ */ _("div", {
186
186
  className: "grid grid-cols-2 gap-4",
187
- children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ g("label", {
187
+ children: [/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ _("label", {
188
188
  htmlFor: "price",
189
189
  className: "block text-sm font-medium text-text-primary mb-1",
190
- children: [b("billing.plans.priceLabel", "Price"), " *"]
191
- }), /* @__PURE__ */ h("input", {
190
+ children: [x("billing.plans.priceLabel", "Price"), " *"]
191
+ }), /* @__PURE__ */ g("input", {
192
192
  id: "price",
193
193
  type: "number",
194
194
  step: "0.01",
@@ -198,148 +198,148 @@ var y = () => {
198
198
  className: "w-full px-3 py-2 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
199
199
  placeholder: "49.99",
200
200
  required: !0
201
- })] }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ g("label", {
201
+ })] }), /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ _("label", {
202
202
  htmlFor: "currency",
203
203
  className: "block text-sm font-medium text-text-primary mb-1",
204
- children: [b("billing.plans.currencyLabel", "Currency"), " *"]
205
- }), /* @__PURE__ */ g("select", {
204
+ children: [x("billing.plans.currencyLabel", "Currency"), " *"]
205
+ }), /* @__PURE__ */ _("select", {
206
206
  id: "currency",
207
207
  value: I,
208
208
  onChange: (e) => L(e.target.value),
209
209
  className: "w-full px-3 py-2 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
210
210
  children: [
211
- /* @__PURE__ */ h("option", {
211
+ /* @__PURE__ */ g("option", {
212
212
  value: "USD",
213
213
  children: "USD ($)"
214
214
  }),
215
- /* @__PURE__ */ h("option", {
215
+ /* @__PURE__ */ g("option", {
216
216
  value: "EUR",
217
217
  children: "EUR"
218
218
  }),
219
- /* @__PURE__ */ h("option", {
219
+ /* @__PURE__ */ g("option", {
220
220
  value: "GBP",
221
221
  children: "GBP"
222
222
  }),
223
- /* @__PURE__ */ h("option", {
223
+ /* @__PURE__ */ g("option", {
224
224
  value: "INR",
225
225
  children: "INR"
226
226
  }),
227
- /* @__PURE__ */ h("option", {
227
+ /* @__PURE__ */ g("option", {
228
228
  value: "AUD",
229
229
  children: "AUD"
230
230
  }),
231
- /* @__PURE__ */ h("option", {
231
+ /* @__PURE__ */ g("option", {
232
232
  value: "CAD",
233
233
  children: "CAD"
234
234
  }),
235
- /* @__PURE__ */ h("option", {
235
+ /* @__PURE__ */ g("option", {
236
236
  value: "JPY",
237
237
  children: "JPY"
238
238
  }),
239
- /* @__PURE__ */ h("option", {
239
+ /* @__PURE__ */ g("option", {
240
240
  value: "SGD",
241
241
  children: "SGD"
242
242
  })
243
243
  ]
244
244
  })] })]
245
245
  }),
246
- /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ g("label", {
246
+ /* @__PURE__ */ _("div", { children: [/* @__PURE__ */ _("label", {
247
247
  htmlFor: "duration",
248
248
  className: "block text-sm font-medium text-text-primary mb-1",
249
- children: [b("billing.plans.billingPeriodLabel", "Billing Period"), " *"]
250
- }), /* @__PURE__ */ g("select", {
249
+ children: [x("billing.plans.billingPeriodLabel", "Billing Period"), " *"]
250
+ }), /* @__PURE__ */ _("select", {
251
251
  id: "duration",
252
252
  value: R,
253
253
  onChange: (e) => z(e.target.value),
254
254
  className: "w-full px-3 py-2 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
255
- children: [/* @__PURE__ */ h("option", {
255
+ children: [/* @__PURE__ */ g("option", {
256
256
  value: i.MONTHLY,
257
257
  children: "Monthly"
258
- }), /* @__PURE__ */ h("option", {
258
+ }), /* @__PURE__ */ g("option", {
259
259
  value: i.YEARLY,
260
260
  children: "Yearly"
261
261
  })]
262
262
  })] }),
263
- /* @__PURE__ */ g("div", {
263
+ /* @__PURE__ */ _("div", {
264
264
  className: "flex items-center gap-3",
265
- children: [/* @__PURE__ */ h("input", {
265
+ children: [/* @__PURE__ */ g("input", {
266
266
  id: "isActive",
267
267
  type: "checkbox",
268
268
  checked: B,
269
269
  onChange: (e) => V(e.target.checked),
270
270
  className: "size-4 rounded border-border-subtle text-text-link focus:ring-[var(--color-focus-ring)]"
271
- }), /* @__PURE__ */ h("label", {
271
+ }), /* @__PURE__ */ g("label", {
272
272
  htmlFor: "isActive",
273
273
  className: "text-sm font-medium text-text-primary",
274
- children: b("billing.plans.planIsActive", "Plan is active")
274
+ children: x("billing.plans.planIsActive", "Plan is active")
275
275
  })]
276
276
  }),
277
- /* @__PURE__ */ g("div", {
277
+ /* @__PURE__ */ _("div", {
278
278
  className: "flex items-start justify-between gap-4 pt-1",
279
- children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("p", {
279
+ children: [/* @__PURE__ */ _("div", { children: [/* @__PURE__ */ g("p", {
280
280
  className: "text-sm font-medium text-text-primary",
281
- children: b("billing.plans.isPurchasableLabel", "Publicly purchasable")
282
- }), /* @__PURE__ */ h("p", {
281
+ children: x("billing.plans.isPurchasableLabel", "Publicly purchasable")
282
+ }), /* @__PURE__ */ g("p", {
283
283
  className: "text-xs text-text-muted mt-0.5",
284
- children: H ? b("billing.plans.isPurchasableOn", "Visible on pricing page — users can subscribe directly.") : b("billing.plans.isPurchasableOff", "Internal / custom plan — hidden from pricing page, assign via API only.")
285
- })] }), /* @__PURE__ */ h("button", {
284
+ children: H ? x("billing.plans.isPurchasableOn", "Visible on pricing page — users can subscribe directly.") : x("billing.plans.isPurchasableOff", "Internal / custom plan — hidden from pricing page, assign via API only.")
285
+ })] }), /* @__PURE__ */ g("button", {
286
286
  type: "button",
287
287
  role: "switch",
288
288
  "aria-checked": H,
289
289
  onClick: () => U((e) => !e),
290
290
  className: `relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] focus:ring-offset-2 ${H ? "bg-action-primary-bg" : "bg-text-muted/30"}`,
291
- children: /* @__PURE__ */ h("span", { className: `inline-block h-5 w-5 transform rounded-full bg-bg-surface shadow transition-transform ${H ? "translate-x-5" : "translate-x-0"}` })
291
+ children: /* @__PURE__ */ g("span", { className: `inline-block h-5 w-5 transform rounded-full bg-bg-surface shadow transition-transform ${H ? "translate-x-5" : "translate-x-0"}` })
292
292
  })]
293
293
  })
294
294
  ]
295
295
  })]
296
- }), /* @__PURE__ */ g("div", {
296
+ }), /* @__PURE__ */ _("div", {
297
297
  className: "border border-border-seam rounded-card bg-bg-surface overflow-hidden shadow-[var(--shadow-elevation-1)] h-fit",
298
- children: [/* @__PURE__ */ g("div", {
298
+ children: [/* @__PURE__ */ _("div", {
299
299
  className: "p-4 border-b border-border-subtle bg-bg-sunken/30 flex items-center justify-between",
300
- children: [/* @__PURE__ */ h("h2", {
300
+ children: [/* @__PURE__ */ g("h2", {
301
301
  className: "font-semibold text-text-primary",
302
- children: b("billing.plans.quotaAllocations", "Quota Allocations")
303
- }), /* @__PURE__ */ h("button", {
302
+ children: x("billing.plans.quotaAllocations", "Quota Allocations")
303
+ }), /* @__PURE__ */ g("button", {
304
304
  type: "button",
305
305
  onClick: Q,
306
306
  className: "px-3 py-1 text-sm font-medium text-text-link hover:bg-[var(--color-accent-soft)] rounded-md transition-colors",
307
307
  children: "+ Add Quota"
308
308
  })]
309
- }), /* @__PURE__ */ h("div", {
309
+ }), /* @__PURE__ */ g("div", {
310
310
  className: "p-4 space-y-3",
311
- children: W.length === 0 ? /* @__PURE__ */ h("p", {
311
+ children: W.length === 0 ? /* @__PURE__ */ g("p", {
312
312
  className: "text-sm text-text-muted",
313
- children: b("billing.plans.noQuotasAllocated", "No quotas allocated. Click \"Add Quota\" to add one.")
313
+ children: x("billing.plans.noQuotasAllocated", "No quotas allocated. Click \"Add Quota\" to add one.")
314
314
  }) : W.map((e, t) => {
315
- let n = O.find((t) => t.id === e.quotaId), r = n?.limits, i = r?.value ?? 0, a = r?.type ?? "unknown", o = i * e.quantity;
316
- return /* @__PURE__ */ g("div", {
315
+ let n = O.find((t) => t.id === e.quotaId), r = n?.limits?.type ?? "unknown";
316
+ return /* @__PURE__ */ _("div", {
317
317
  className: "p-3 border border-border-subtle rounded-lg bg-bg-sunken/20 space-y-3",
318
- children: [/* @__PURE__ */ g("div", {
318
+ children: [/* @__PURE__ */ _("div", {
319
319
  className: "flex items-center gap-3",
320
- children: [/* @__PURE__ */ g("select", {
320
+ children: [/* @__PURE__ */ _("select", {
321
321
  value: e.quotaId,
322
322
  onChange: (e) => $(t, "quotaId", e.target.value),
323
323
  className: `flex-1 px-3 py-2 border border-border-subtle rounded-input bg-bg-surface focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] ${e.quotaId === "" ? "text-text-muted" : "text-text-primary"}`,
324
- children: [/* @__PURE__ */ h("option", {
324
+ children: [/* @__PURE__ */ g("option", {
325
325
  value: "",
326
326
  disabled: !0,
327
- children: b("billing.plans.selectQuota", "Select a quota...")
328
- }), O.map((e) => /* @__PURE__ */ h("option", {
327
+ children: x("billing.plans.selectQuota", "Select a quota...")
328
+ }), O.map((e) => /* @__PURE__ */ g("option", {
329
329
  value: e.id,
330
330
  children: e.name
331
331
  }, e.id))]
332
- }), /* @__PURE__ */ h("button", {
332
+ }), /* @__PURE__ */ g("button", {
333
333
  type: "button",
334
334
  onClick: () => te(t),
335
335
  className: "p-2 text-status-error-text hover:bg-status-error-bg-subtle rounded-md transition-colors",
336
336
  title: "Remove quota",
337
- children: /* @__PURE__ */ h("svg", {
337
+ children: /* @__PURE__ */ g("svg", {
338
338
  className: "size-5",
339
339
  fill: "none",
340
340
  viewBox: "0 0 24 24",
341
341
  stroke: "currentColor",
342
- children: /* @__PURE__ */ h("path", {
342
+ children: /* @__PURE__ */ g("path", {
343
343
  strokeLinecap: "round",
344
344
  strokeLinejoin: "round",
345
345
  strokeWidth: 2,
@@ -347,52 +347,23 @@ var y = () => {
347
347
  })
348
348
  })
349
349
  })]
350
- }), n && /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("div", {
350
+ }), n && /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g("div", {
351
351
  className: "flex items-center justify-between text-sm",
352
- children: /* @__PURE__ */ g("div", {
353
- className: "text-text-muted",
354
- children: [
355
- /* @__PURE__ */ g("span", {
356
- className: "capitalize",
357
- children: ["Type: ", a]
358
- }),
359
- /* @__PURE__ */ h("span", {
360
- className: "mx-2",
361
- children: "•"
362
- }),
363
- /* @__PURE__ */ g("span", { children: [
364
- "Value per unit:",
365
- " ",
366
- /* @__PURE__ */ h("span", {
367
- className: "font-medium text-text-primary",
368
- children: i.toLocaleString()
369
- })
370
- ] })
371
- ]
352
+ children: /* @__PURE__ */ _("span", {
353
+ className: "capitalize text-text-muted",
354
+ children: ["Type: ", r]
372
355
  })
373
- }), /* @__PURE__ */ g("div", {
374
- className: "flex items-center gap-4",
375
- children: [/* @__PURE__ */ g("div", {
376
- className: "flex items-center gap-2",
377
- children: [/* @__PURE__ */ g("label", {
378
- className: "text-sm text-text-muted",
379
- children: [b("billing.plans.quantity", "Quantity"), ":"]
380
- }), /* @__PURE__ */ h("input", {
381
- type: "number",
382
- min: "1",
383
- value: e.quantity,
384
- onChange: (e) => $(t, "quantity", e.target.value),
385
- className: "w-24 px-3 py-1.5 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] text-center"
386
- })]
387
- }), /* @__PURE__ */ g("div", {
388
- className: "flex items-center gap-2 text-sm",
389
- children: [/* @__PURE__ */ h("span", {
390
- className: "text-text-muted",
391
- children: "="
392
- }), /* @__PURE__ */ g("span", {
393
- className: "font-semibold text-status-success-text",
394
- children: [o.toLocaleString(), " total"]
395
- })]
356
+ }), /* @__PURE__ */ _("div", {
357
+ className: "flex items-center gap-2",
358
+ children: [/* @__PURE__ */ _("label", {
359
+ className: "text-sm text-text-muted",
360
+ children: [x("billing.plans.limit", "Limit"), ":"]
361
+ }), /* @__PURE__ */ g("input", {
362
+ type: "number",
363
+ min: "1",
364
+ value: e.quantity,
365
+ onChange: (e) => $(t, "quantity", e.target.value),
366
+ className: "w-36 px-3 py-1.5 border border-border-subtle rounded-input bg-bg-surface text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] text-center"
396
367
  })]
397
368
  })] })]
398
369
  }, t);
@@ -400,20 +371,20 @@ var y = () => {
400
371
  })]
401
372
  })]
402
373
  }),
403
- /* @__PURE__ */ h(r, {
374
+ /* @__PURE__ */ g(r, {
404
375
  overrides: K,
405
376
  onChange: q
406
377
  }),
407
- /* @__PURE__ */ g("div", {
378
+ /* @__PURE__ */ _("div", {
408
379
  className: "flex items-center gap-3 pt-4",
409
- children: [/* @__PURE__ */ h("button", {
380
+ children: [/* @__PURE__ */ g("button", {
410
381
  type: "submit",
411
382
  disabled: j,
412
383
  className: "px-6 py-2 text-sm font-medium bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-colors disabled:opacity-50",
413
- children: j ? b("billing.plans.saving", "Saving...") : b("billing.plans.saveChanges", "Save Changes")
414
- }), /* @__PURE__ */ h("button", {
384
+ children: j ? x("billing.plans.saving", "Saving...") : x("billing.plans.saveChanges", "Save Changes")
385
+ }), /* @__PURE__ */ g("button", {
415
386
  type: "button",
416
- onClick: () => S(`/plans/${x}`),
387
+ onClick: () => C(`/plans/${S}`),
417
388
  className: "px-6 py-2 text-sm font-medium border border-border-subtle text-text-primary rounded-button hover:bg-bg-sunken transition-colors",
418
389
  children: "Cancel"
419
390
  })]
@@ -424,6 +395,6 @@ var y = () => {
424
395
  });
425
396
  };
426
397
  //#endregion
427
- export { y as PlanEditPage };
398
+ export { b as PlanEditPage };
428
399
 
429
400
  //# sourceMappingURL=PlanEditPage.js.map