@shophost/react 2.0.40 → 2.0.41

package/admin-client.js

@@ -44,7 +44,7 @@ import * as Ya from "@radix-ui/react-navigation-menu";
 import { useReactTable as tl, getSortedRowModel as rl, getCoreRowModel as il, getFilteredRowModel as nl, flexRender as Er, createColumnHelper as oa } from "@tanstack/react-table";
 import * as zr from "@radix-ui/react-checkbox";
 import * as ie from "@radix-ui/react-dropdown-menu";
-const zi = Ne(null), Di = ({ baseUrl: a, children: t }) => {
+const re = new qr({ defaultOptions: { queries: { retry: !1, refetchInterval: !1, refetchOnWindowFocus: !1 } } }), zi = Ne(null), Di = ({ baseUrl: a, children: t }) => {
   const r = se(() => Us({ baseUrl: a, throwOnUnknownStatus: !0, baseHeaders: {}, credentials: "include" }), [a]);
   return e(zi.Provider, { value: { client: r, baseUrl: a }, children: t });
 }, S = () => {
@@ -76,14 +76,13 @@ const Rt = /* @__PURE__ */ new Map();
 function cl(a) {
   return Rt.has(a) || Rt.set(a, dl(a)), Rt.get(a);
 }
-const re = new qr({ defaultOptions: { queries: { retry: !1, refetchInterval: !1, refetchOnWindowFocus: !1 } } });
 function ml(a) {
   const t = a.replace(/\/$/, "");
   return { home: t, signIn: `${t}/auth/sign-in`, signUp: `${t}/auth/sign-up`, organizations: `${t}/organizations`, dashboard: (r) => `${t}/${r}/dashboard`, liveOrders: (r) => `${t}/${r}/live-orders`, orders: (r) => `${t}/${r}/orders`, reservations: (r) => `${t}/${r}/reservations`, products: (r) => `${t}/${r}/products`, productCreate: (r) => `${t}/${r}/products/create`, productEdit: (r, n) => `${t}/${r}/products/${n}`, productCategories: (r) => `${t}/${r}/product-categories`, productCategoryCreate: (r) => `${t}/${r}/product-categories/create`, productCategoryEdit: (r, n) => `${t}/${r}/product-categories/${n}`, manufacturers: (r) => `${t}/${r}/manufacturers`, manufacturerCreate: (r) => `${t}/${r}/manufacturers/create`, manufacturerEdit: (r, n) => `${t}/${r}/manufacturers/${n}`, settings: (r) => `${t}/${r}/settings`, settingsOpeningTimes: (r) => `${t}/${r}/settings/opening-times`, settingsShippingMethods: (r) => `${t}/${r}/settings/shipping-methods`, settingsShippingMethodCreate: (r) => `${t}/${r}/settings/shipping-methods/create`, settingsShippingMethodEdit: (r, n) => `${t}/${r}/settings/shipping-methods/${n}`, settingsAccess: (r) => `${t}/${r}/settings/access`, settingsAccessInvite: (r) => `${t}/${r}/settings/access/invite`, settingsAccessMemberEdit: (r, n) => `${t}/${r}/settings/access/${n}` };
 }
 function yu({ config: a, children: t }) {
   const r = se(() => cl(a.apiBaseUrl), [a.apiBaseUrl]), n = se(() => ml(a.basePath), [a.basePath]);
-  return i(Wr, { client: re, children: [e(ss, { defaultTheme: "light", attribute: "class", children: e(Di, { baseUrl: a.apiBaseUrl, children: e(sl, { client: r, children: e(ll, { config: a, children: e(ol, { routes: n, children: t }) }) }) }) }), e(ds, {})] });
+  return e(Wr, { client: re, children: i("div", { className: "shophost-admin", children: [e(ss, { defaultTheme: "light", attribute: "class", children: e(Di, { baseUrl: a.apiBaseUrl, children: e(sl, { client: r, children: e(ll, { config: a, children: e(ol, { routes: n, children: t }) }) }) }) }), e(ds, {})] }) });
 }
 const Dr = "shophost-cart", ul = { items: [], isInitialized: !1, modifierModal: null, totalAmount: 0, itemCount: 0, removedItemsAlert: !1 }, bu = (a, t) => a.reduce((r, n) => {
   const s = t(n.productId);
@@ -1078,7 +1077,7 @@ function $(...a) {
 const Ra = ["focus:ring-2", "focus:ring-blue-200 dark:focus:ring-blue-700/30", "focus:border-blue-500 dark:focus:border-blue-700"], ge = ["outline outline-offset-2 outline-0 focus-visible:outline-2", "outline-blue-500 dark:outline-blue-500"], lr = ["ring-2", "border-red-500 dark:border-red-700", "ring-red-200 dark:ring-red-700/30"], Sd = (a, t = 0) => Intl.NumberFormat("us", { minimumFractionDigits: t, maximumFractionDigits: t }).format(Number(a)).toString(), te = { currency: (a, t = "USD") => new Intl.NumberFormat("en-US", { style: "currency", currency: t }).format(a), unit: (a) => `${Sd(a)}` }, Id = Qe({ base: ["relative inline-flex items-center justify-center whitespace-nowrap rounded-lg border px-3 py-2 text-center text-sm font-medium shadow-xs transition-all duration-100 ease-in-out", "disabled:pointer-events-none disabled:shadow-none", ge], variants: { variant: { primary: ["border-transparent", "text-white dark:text-white", "bg-blue-600 dark:bg-blue-500", "shadow-[0_16px_8px_rgba(31,31,31,0.01),0_12px_6px_rgba(31,31,31,0.04),0_4px_4px_rgba(31,31,31,0.07),0_1.5px_3px_rgba(31,31,31,0.08),0_0_0_1px_#2563eb,inset_0_1px_2px_hsla(0,0%,100%,0.12)] dark:outline-0 outline outline-2 outline-transparent outline-offset-2", "hover:bg-blue-500 dark:hover:bg-blue-600", "disabled:bg-blue-100 disabled:text-gray-400", "dark:disabled:bg-blue-800 dark:disabled:text-blue-400"], secondary: ["border-gray-200 dark:border-gray-800", "text-gray-900 dark:text-gray-50", "bg-white dark:bg-gray-950", "shadow-[0_1px_1px_0.5px_rgba(51,51,51,.04),0_3px_3px_-1.5px_rgba(51,51,51,.02),0_6px_6px_-3px_rgba(51,51,51,.04),0_12px_12px_-6px_rgba(51,51,51,.04),0_24px_24px_-12px_rgba(51,51,51,.04),0_48px_48px_-24px_rgba(51,51,51,.04),0_0_0_1px_rgba(51,51,51,.1),inset_0_-1px_1px_-0.5px_rgba(51,51,51,.06)] outline outline-2 dark:outline-0 outline-transparent outline-offset-2", "hover:bg-gray-50 dark:hover:bg-gray-900/60", "disabled:text-gray-400", "dark:disabled:text-gray-600"], light: ["shadow-none", "border-transparent", "text-gray-900 dark:text-gray-50", "bg-gray-200 dark:bg-gray-900", "hover:bg-gray-300/70 dark:hover:bg-gray-800/80", "disabled:bg-gray-100 disabled:text-gray-400", "dark:disabled:bg-gray-800 dark:disabled:text-gray-600"], ghost: ["shadow-none", "border-transparent", "text-gray-900 dark:text-gray-50", "bg-transparent hover:bg-gray-100 dark:hover:bg-gray-800/80", "disabled:text-gray-400", "dark:disabled:text-gray-600"], destructive: ["text-white", "border-transparent", "bg-red-600 dark:bg-red-700", "hover:bg-red-700 dark:hover:bg-red-600", "disabled:bg-red-300 disabled:text-white", "dark:disabled:bg-red-950 dark:disabled:text-red-400"] } }, defaultVariants: { variant: "primary" } }), z = E.forwardRef(({ asChild: a, isLoading: t = !1, loadingText: r, className: n, disabled: s, variant: l, children: o, ...d }, u) => e(a ? Zt : "button", { ref: u, className: x(Id({ variant: l }), n), disabled: s || t, ...d, children: t ? i("span", { className: "pointer-events-none flex shrink-0 items-center justify-center gap-1.5", children: [e(gi, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }), e("span", { className: "sr-only", children: r || "Loading" }), r || "Loading"] }) : o }));
 z.displayName = "Button";
 function wn({ onReset: a }) {
-  return e("div", { className: "flex flex-col items-center gap-4 h-screen justify-center", children: e("div", { className: "py-8 px-4 mx-auto max-w-(--breakpoint-xl) pb-64 lg:px-6", children: i("div", { className: "mx-auto max-w-(--breakpoint-sm) text-center", children: [e("h1", { className: "mb-4 text-7xl tracking-tight font-extrabold lg:text-9xl text-red-500 dark:text-primary-500", children: "500" }), e("p", { className: "mb-3 text-3xl tracking-tight font-bold text-gray-800 md:text-4xl dark:text-white", children: "Something went wrong" }), i("p", { className: "mb-4 text-lg text-gray-500 dark:text-gray-400", children: ["We are sorry, but there was an unexpected error. ", e("br", {}), "Please try reloading the page."] }), a && e(z, { className: "mt-3", onClick: a, children: "Reload Page" })] }) }) });
+  return e("div", { className: "shophost-admin flex h-screen flex-col items-center justify-center gap-4", children: e("div", { className: "py-8 px-4 mx-auto max-w-(--breakpoint-xl) pb-64 lg:px-6", children: i("div", { className: "mx-auto max-w-(--breakpoint-sm) text-center", children: [e("h1", { className: "mb-4 text-7xl tracking-tight font-extrabold lg:text-9xl text-red-500 dark:text-primary-500", children: "500" }), e("p", { className: "mb-3 font-red-hat-display text-3xl tracking-tight font-bold text-gray-800 md:text-4xl dark:text-white", children: "Something went wrong" }), i("p", { className: "mb-4 text-lg text-gray-500 dark:text-gray-400", children: ["We are sorry, but there was an unexpected error. ", e("br", {}), "Please try reloading the page."] }), a && e(z, { className: "mt-3", onClick: a, children: "Reload Page" })] }) }) });
 }
 const Ed = "redirect";
 function zd(a) {
@@ -1306,7 +1305,7 @@ function Zd() {
     if (k !== 200 || !y) throw new Error("Failed to fetch dashboard overview");
     return y;
   }, placeholderData: ue }), g = (o == null ? void 0 : o.summary.currency) ?? "USD", b = ((o == null ? void 0 : o.paymentMethods) ?? []).map((y) => ({ ...y, label: jd[y.method] ?? y.method })), f = ((o == null ? void 0 : o.fulfilmentMethods) ?? []).map((y) => ({ ...y, label: Vd[y.method] ?? y.method })), w = f.reduce((y, k) => y + k.count, 0);
-  return i("section", { "aria-labelledby": "dashboard-overview", children: [i("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-end lg:justify-between", children: [i("div", { children: [e("h1", { id: "dashboard-overview", className: "text-lg font-semibold text-gray-900 sm:text-xl dark:text-gray-50", children: "Overview" }), e("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-400", children: "Live store performance across orders, reservations, and payment behaviour." })] }), i("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center", children: [h ? e("span", { className: "text-sm text-gray-500 dark:text-gray-400", children: "Updating…" }) : null, e(In, { value: n, onChange: s, className: "w-full sm:w-fit", toDate: r, align: "end" })] })] }), u && !o ? e(ua, { className: "mt-8 border-red-200 dark:border-red-950", children: i("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", children: [i("div", { children: [e("h2", { className: "text-base font-semibold text-gray-900 dark:text-gray-50", children: "Dashboard data unavailable" }), e("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-400", children: d instanceof Error ? d.message : "We could not load the dashboard metrics for this range." })] }), i(z, { onClick: () => p(), className: "gap-2", children: [e(zs, { className: "size-4", "aria-hidden": "true" }), "Retry"] })] }) }) : null, e("div", { className: "mt-8 grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-4", children: c && !o ? Array.from({ length: 4 }).map((y, k) => e(xa, { className: "h-[148px]" }, k)) : o ? i(C, { children: [e(Va, { icon: Ds, title: "Paid sales", value: te.currency(o.summary.totalSales, g), description: "Successful payments in the selected range" }), e(Va, { icon: Fs, title: "Paid orders", value: te.unit(o.summary.paidOrders), description: `Average order value ${te.currency(o.summary.averageOrderValue, g)}` }), e(Va, { icon: Rs, title: "Reservations", value: te.unit(o.summary.reservations), description: "Scheduled reservations in the selected range" }), e(Va, { icon: Bs, title: "Reserved guests", value: te.unit(o.summary.guests), description: "Total covers booked from reservations" })] }) : null }), e("div", { className: "mt-4 grid grid-cols-1 gap-4 xl:grid-cols-2", children: c && !o ? i(C, { children: [e(xa, { className: "h-[360px]" }), e(xa, { className: "h-[360px]" })] }) : o ? i(C, { children: [e(Za, { title: "Paid sales by day", value: te.currency(o.summary.totalSales, g), description: "Gross paid revenue recognised on each order day.", children: e(Ta, { width: "100%", height: "100%", children: i(qs, { data: o.salesByDay, children: [e("defs", { children: i("linearGradient", { id: "salesGradient", x1: "0", y1: "0", x2: "0", y2: "1", children: [e("stop", { offset: "5%", stopColor: "#0f766e", stopOpacity: 0.28 }), e("stop", { offset: "95%", stopColor: "#0f766e", stopOpacity: 0.02 })] }) }), e(zt, { strokeDasharray: "3 3", stroke: "#e5e7eb", vertical: !1 }), e(Dt, { dataKey: "label", axisLine: !1, tickLine: !1, tick: { fill: "#6b7280", fontSize: 12 } }), e(Ft, { axisLine: !1, tickLine: !1, width: 48, tickFormatter: (y) => Ld.format(y), tick: { fill: "#6b7280", fontSize: 12 } }), e(Ja, { formatter: (y, k) => {
+  return i("section", { "aria-labelledby": "dashboard-overview", children: [i("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-end lg:justify-between", children: [i("div", { children: [e("h1", { className: "text-xl font-semibold text-gray-900 sm:text-2xl dark:text-gray-50", children: "Overview" }), e("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-400", children: "Live store performance across orders, reservations, and payment behaviour." })] }), i("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center", children: [h ? e("span", { className: "text-sm text-gray-500 dark:text-gray-400", children: "Updating…" }) : null, e(In, { value: n, onChange: s, className: "w-full sm:w-fit", toDate: r, align: "end" })] })] }), u && !o ? e(ua, { className: "mt-8 border-red-200 dark:border-red-950", children: i("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", children: [i("div", { children: [e("h2", { className: "text-base font-semibold text-gray-900 dark:text-gray-50", children: "Dashboard data unavailable" }), e("p", { className: "mt-1 text-sm text-gray-600 dark:text-gray-400", children: d instanceof Error ? d.message : "We could not load the dashboard metrics for this range." })] }), i(z, { onClick: () => p(), className: "gap-2", children: [e(zs, { className: "size-4", "aria-hidden": "true" }), "Retry"] })] }) }) : null, e("div", { className: "mt-8 grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-4", children: c && !o ? Array.from({ length: 4 }).map((y, k) => e(xa, { className: "h-[148px]" }, k)) : o ? i(C, { children: [e(Va, { icon: Ds, title: "Paid sales", value: te.currency(o.summary.totalSales, g), description: "Successful payments in the selected range" }), e(Va, { icon: Fs, title: "Paid orders", value: te.unit(o.summary.paidOrders), description: `Average order value ${te.currency(o.summary.averageOrderValue, g)}` }), e(Va, { icon: Rs, title: "Reservations", value: te.unit(o.summary.reservations), description: "Scheduled reservations in the selected range" }), e(Va, { icon: Bs, title: "Reserved guests", value: te.unit(o.summary.guests), description: "Total covers booked from reservations" })] }) : null }), e("div", { className: "mt-4 grid grid-cols-1 gap-4 xl:grid-cols-2", children: c && !o ? i(C, { children: [e(xa, { className: "h-[360px]" }), e(xa, { className: "h-[360px]" })] }) : o ? i(C, { children: [e(Za, { title: "Paid sales by day", value: te.currency(o.summary.totalSales, g), description: "Gross paid revenue recognised on each order day.", children: e(Ta, { width: "100%", height: "100%", children: i(qs, { data: o.salesByDay, children: [e("defs", { children: i("linearGradient", { id: "salesGradient", x1: "0", y1: "0", x2: "0", y2: "1", children: [e("stop", { offset: "5%", stopColor: "#0f766e", stopOpacity: 0.28 }), e("stop", { offset: "95%", stopColor: "#0f766e", stopOpacity: 0.02 })] }) }), e(zt, { strokeDasharray: "3 3", stroke: "#e5e7eb", vertical: !1 }), e(Dt, { dataKey: "label", axisLine: !1, tickLine: !1, tick: { fill: "#6b7280", fontSize: 12 } }), e(Ft, { axisLine: !1, tickLine: !1, width: 48, tickFormatter: (y) => Ld.format(y), tick: { fill: "#6b7280", fontSize: 12 } }), e(Ja, { formatter: (y, k) => {
     const v = ja(y);
     return [String(k) === "totalSales" ? te.currency(v, g) : te.unit(v), String(k) === "totalSales" ? "Sales" : "Paid orders"];
   }, contentStyle: Ha, labelStyle: Ua }), e(Ws, { type: "monotone", dataKey: "totalSales", stroke: "#0f766e", strokeWidth: 2.5, fill: "url(#salesGradient)", name: "totalSales" })] }) }) }), e(Za, { title: "Reservations per day", value: te.unit(o.summary.reservations), description: "Bookings are grouped by reservation date, not submission time.", children: e(Ta, { width: "100%", height: "100%", children: i(Sr, { data: o.reservationsByDay, children: [e(zt, { strokeDasharray: "3 3", stroke: "#e5e7eb", vertical: !1 }), e(Dt, { dataKey: "label", axisLine: !1, tickLine: !1, tick: { fill: "#6b7280", fontSize: 12 } }), e(Ft, { allowDecimals: !1, axisLine: !1, tickLine: !1, width: 36, tick: { fill: "#6b7280", fontSize: 12 } }), e(Ja, { formatter: (y, k) => [te.unit(ja(y)), String(k) === "guests" ? "Guests" : "Reservations"], contentStyle: Ha, labelStyle: Ua }), e(Ir, { dataKey: "reservations", name: "reservations", fill: "#fb923c", radius: [8, 8, 0, 0] })] }) }) })] }) : null }), e("div", { className: "mt-4 grid grid-cols-1 gap-4 xl:grid-cols-2", children: c && !o ? i(C, { children: [e(xa, { className: "h-[320px]" }), e(xa, { className: "h-[320px]" })] }) : o ? i(C, { children: [e(Za, { title: "Payment methods", value: te.unit(b.reduce((y, k) => y + k.count, 0)), description: "Successful orders grouped by how guests paid.", children: b.length > 0 ? e(Ta, { width: "100%", height: "100%", children: i(Sr, { data: b, layout: "vertical", margin: { left: 12, right: 12 }, children: [e(zt, { strokeDasharray: "3 3", stroke: "#e5e7eb", horizontal: !1 }), e(Dt, { type: "number", allowDecimals: !1, axisLine: !1, tickLine: !1, tick: { fill: "#6b7280", fontSize: 12 } }), e(Ft, { dataKey: "label", type: "category", axisLine: !1, tickLine: !1, width: 110, tick: { fill: "#374151", fontSize: 12 } }), e(Ja, { formatter: (y, k, v) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shophost/react",
-  "version": "2.0.40",
+  "version": "2.0.41",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.mjs",
@@ -82,8 +82,8 @@
     "@react-aria/datepicker": "^3.16.1",
     "@react-stately/datepicker": "^3.16.1",
     "@remixicon/react": "^4.6.0",
-    "@shophost/client": "^2.0.40",
-    "@shophost/rest-api": "^2.0.40",
+    "@shophost/client": "^2.0.41",
+    "@shophost/rest-api": "^2.0.41",
     "@tanstack/react-query": "^5.67.2",
     "@tanstack/react-table": "^8.21.3",
     "@vercel/blob": "^0.27.2",