@open-mercato/core 0.4.2-canary-10c7a8bf2a → 0.4.2-canary-e6bf6a353e

package/dist/modules/dashboards/widgets/dashboard/sales-by-region/widget.client.js

@@ -0,0 +1,131 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { BarChart } from "@open-mercato/ui/backend/charts";
+import { DateRangeSelect } from "@open-mercato/ui/backend/date-range";
+import { DEFAULT_SETTINGS, hydrateSettings } from "./config.js";
+import { formatCurrencyCompact } from "../../../lib/formatters.js";
+async function fetchSalesByRegionData(settings) {
+  const body = {
+    entityType: "sales:orders",
+    metric: {
+      field: "grandTotalGrossAmount",
+      aggregate: "sum"
+    },
+    groupBy: {
+      field: "shippingAddressSnapshot.region",
+      limit: settings.limit
+    },
+    dateRange: {
+      field: "placedAt",
+      preset: settings.dateRange
+    }
+  };
+  const call = await apiCall("/api/dashboards/widgets/data", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!call.ok) {
+    const errorMsg = call.result?.error;
+    throw new Error(typeof errorMsg === "string" ? errorMsg : "Failed to fetch sales by region data");
+  }
+  return call.result;
+}
+const SalesByRegionWidget = ({
+  mode,
+  settings = DEFAULT_SETTINGS,
+  onSettingsChange,
+  refreshToken,
+  onRefreshStateChange
+}) => {
+  const t = useT();
+  const hydrated = React.useMemo(() => hydrateSettings(settings), [settings]);
+  const [data, setData] = React.useState([]);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
+  const refresh = React.useCallback(async () => {
+    onRefreshStateChange?.(true);
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await fetchSalesByRegionData(hydrated);
+      const chartData = result.data.map((item) => ({
+        region: String(item.groupKey || t("dashboards.analytics.labels.unknown", "Unknown")),
+        Revenue: item.value ?? 0
+      }));
+      setData(chartData);
+    } catch (err) {
+      console.error("Failed to load sales by region data", err);
+      setError(t("dashboards.analytics.widgets.salesByRegion.error", "Failed to load data"));
+    } finally {
+      setLoading(false);
+      onRefreshStateChange?.(false);
+    }
+  }, [hydrated, onRefreshStateChange, t]);
+  React.useEffect(() => {
+    refresh().catch(() => {
+    });
+  }, [refresh, refreshToken]);
+  if (mode === "settings") {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-4 text-sm", children: [
+      /* @__PURE__ */ jsx(
+        DateRangeSelect,
+        {
+          id: "sales-by-region-date-range",
+          label: t("dashboards.analytics.settings.dateRange", "Date Range"),
+          value: hydrated.dateRange,
+          onChange: (dateRange) => onSettingsChange({ ...hydrated, dateRange })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            htmlFor: "sales-by-region-limit",
+            className: "text-xs font-semibold uppercase text-muted-foreground",
+            children: t("dashboards.analytics.settings.limit", "Number of items")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            id: "sales-by-region-limit",
+            type: "number",
+            min: 1,
+            max: 20,
+            className: "w-24 rounded-md border px-2 py-1 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+            value: hydrated.limit,
+            onChange: (e) => {
+              const next = Number(e.target.value);
+              onSettingsChange({ ...hydrated, limit: Number.isFinite(next) ? next : hydrated.limit });
+            }
+          }
+        )
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(
+    BarChart,
+    {
+      data,
+      index: "region",
+      categories: ["Revenue"],
+      categoryLabels: { Revenue: t("dashboards.analytics.widgets.topCustomers.column.revenue", "Revenue") },
+      loading,
+      error,
+      layout: "horizontal",
+      valueFormatter: formatCurrencyCompact,
+      colors: ["cyan"],
+      showLegend: false,
+      emptyMessage: t("dashboards.analytics.widgets.salesByRegion.empty", "No regional sales data for this period")
+    }
+  );
+};
+var widget_client_default = SalesByRegionWidget;
+export {
+  widget_client_default as default
+};
+//# sourceMappingURL=widget.client.js.map

package/dist/modules/dashboards/widgets/dashboard/sales-by-region/widget.client.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/sales-by-region/widget.client.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { BarChart, type BarChartDataItem } from '@open-mercato/ui/backend/charts'\nimport { DateRangeSelect, type DateRangePreset } from '@open-mercato/ui/backend/date-range'\nimport { DEFAULT_SETTINGS, hydrateSettings, type SalesByRegionSettings } from './config'\nimport type { WidgetDataResponse } from '../../../services/widgetDataService'\nimport { formatCurrencyCompact } from '../../../lib/formatters'\n\nasync function fetchSalesByRegionData(settings: SalesByRegionSettings): Promise<WidgetDataResponse> {\n  const body = {\n    entityType: 'sales:orders',\n    metric: {\n      field: 'grandTotalGrossAmount',\n      aggregate: 'sum',\n    },\n    groupBy: {\n      field: 'shippingAddressSnapshot.region',\n      limit: settings.limit,\n    },\n    dateRange: {\n      field: 'placedAt',\n      preset: settings.dateRange,\n    },\n  }\n\n  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {\n    method: 'POST',\n    headers: { 'Content-Type': 'application/json' },\n    body: JSON.stringify(body),\n  })\n\n  if (!call.ok) {\n    const errorMsg = (call.result as Record<string, unknown>)?.error\n    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch sales by region data')\n  }\n\n  return call.result as WidgetDataResponse\n}\n\nconst SalesByRegionWidget: React.FC<DashboardWidgetComponentProps<SalesByRegionSettings>> = ({\n  mode,\n  settings = DEFAULT_SETTINGS,\n  onSettingsChange,\n  refreshToken,\n  onRefreshStateChange,\n}) => {\n  const t = useT()\n  const hydrated = React.useMemo(() => hydrateSettings(settings), [settings])\n  const [data, setData] = React.useState<BarChartDataItem[]>([])\n  const [loading, setLoading] = React.useState(true)\n  const [error, setError] = React.useState<string | null>(null)\n\n  const refresh = React.useCallback(async () => {\n    onRefreshStateChange?.(true)\n    setLoading(true)\n    setError(null)\n    try {\n      const result = await fetchSalesByRegionData(hydrated)\n      const chartData = result.data.map((item) => ({\n        region: String(item.groupKey || t('dashboards.analytics.labels.unknown', 'Unknown')),\n        Revenue: item.value ?? 0,\n      }))\n      setData(chartData)\n    } catch (err) {\n      console.error('Failed to load sales by region data', err)\n      setError(t('dashboards.analytics.widgets.salesByRegion.error', 'Failed to load data'))\n    } finally {\n      setLoading(false)\n      onRefreshStateChange?.(false)\n    }\n  }, [hydrated, onRefreshStateChange, t])\n\n  React.useEffect(() => {\n    refresh().catch(() => {})\n  }, [refresh, refreshToken])\n\n  if (mode === 'settings') {\n    return (\n      <div className=\"space-y-4 text-sm\">\n        <DateRangeSelect\n          id=\"sales-by-region-date-range\"\n          label={t('dashboards.analytics.settings.dateRange', 'Date Range')}\n          value={hydrated.dateRange}\n          onChange={(dateRange: DateRangePreset) => onSettingsChange({ ...hydrated, dateRange })}\n        />\n        <div className=\"space-y-1.5\">\n          <label\n            htmlFor=\"sales-by-region-limit\"\n            className=\"text-xs font-semibold uppercase text-muted-foreground\"\n          >\n            {t('dashboards.analytics.settings.limit', 'Number of items')}\n          </label>\n          <input\n            id=\"sales-by-region-limit\"\n            type=\"number\"\n            min={1}\n            max={20}\n            className=\"w-24 rounded-md border px-2 py-1 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary\"\n            value={hydrated.limit}\n            onChange={(e) => {\n              const next = Number(e.target.value)\n              onSettingsChange({ ...hydrated, limit: Number.isFinite(next) ? next : hydrated.limit })\n            }}\n          />\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <BarChart\n      data={data}\n      index=\"region\"\n      categories={['Revenue']}\n      categoryLabels={{ Revenue: t('dashboards.analytics.widgets.topCustomers.column.revenue', 'Revenue') }}\n      loading={loading}\n      error={error}\n      layout=\"horizontal\"\n      valueFormatter={formatCurrencyCompact}\n      colors={['cyan']}\n      showLegend={false}\n      emptyMessage={t('dashboards.analytics.widgets.salesByRegion.empty', 'No regional sales data for this period')}\n    />\n  )\n}\n\nexport default SalesByRegionWidget\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/sales-by-region/widget.js

@@ -0,0 +1,25 @@
+import SalesByRegionWidget from "./widget.client.js";
+import { DEFAULT_SETTINGS, hydrateSettings } from "./config.js";
+const widget = {
+  metadata: {
+    id: "dashboards.analytics.salesByRegion",
+    title: "Sales by Region",
+    description: "Revenue distribution by shipping region",
+    features: ["analytics.view", "sales.orders.view"],
+    defaultSize: "md",
+    defaultEnabled: false,
+    defaultSettings: DEFAULT_SETTINGS,
+    tags: ["analytics", "sales", "geography", "chart"],
+    category: "analytics",
+    icon: "map-pin",
+    supportsRefresh: true
+  },
+  Widget: SalesByRegionWidget,
+  hydrateSettings,
+  dehydrateSettings: (s) => ({ dateRange: s.dateRange, limit: s.limit })
+};
+var widget_default = widget;
+export {
+  widget_default as default
+};
+//# sourceMappingURL=widget.js.map

package/dist/modules/dashboards/widgets/dashboard/sales-by-region/widget.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/sales-by-region/widget.ts"],
+  "sourcesContent": ["import type { DashboardWidgetModule } from '@open-mercato/shared/modules/dashboard/widgets'\nimport SalesByRegionWidget from './widget.client'\nimport { DEFAULT_SETTINGS, hydrateSettings, type SalesByRegionSettings } from './config'\n\nconst widget: DashboardWidgetModule<SalesByRegionSettings> = {\n  metadata: {\n    id: 'dashboards.analytics.salesByRegion',\n    title: 'Sales by Region',\n    description: 'Revenue distribution by shipping region',\n    features: ['analytics.view', 'sales.orders.view'],\n    defaultSize: 'md',\n    defaultEnabled: false,\n    defaultSettings: DEFAULT_SETTINGS,\n    tags: ['analytics', 'sales', 'geography', 'chart'],\n    category: 'analytics',\n    icon: 'map-pin',\n    supportsRefresh: true,\n  },\n  Widget: SalesByRegionWidget,\n  hydrateSettings,\n  dehydrateSettings: (s) => ({ dateRange: s.dateRange, limit: s.limit }),\n}\n\nexport default widget\n"],
+  "mappings": "AACA,OAAO,yBAAyB;AAChC,SAAS,kBAAkB,uBAAmD;AAE9E,MAAM,SAAuD;AAAA,EAC3D,UAAU;AAAA,IACR,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,aAAa;AAAA,IACb,UAAU,CAAC,kBAAkB,mBAAmB;AAAA,IAChD,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,MAAM,CAAC,aAAa,SAAS,aAAa,OAAO;AAAA,IACjD,UAAU;AAAA,IACV,MAAM;AAAA,IACN,iBAAiB;AAAA,EACnB;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,mBAAmB,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,OAAO,EAAE,MAAM;AACtE;AAEA,IAAO,iBAAQ;",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/top-customers/config.js

@@ -0,0 +1,19 @@
+import { isValidDateRangePreset } from "@open-mercato/ui/backend/date-range";
+const DEFAULT_SETTINGS = {
+  dateRange: "this_month",
+  limit: 10
+};
+function hydrateSettings(raw) {
+  if (!raw || typeof raw !== "object") return { ...DEFAULT_SETTINGS };
+  const obj = raw;
+  const parsedLimit = Number(obj.limit);
+  return {
+    dateRange: isValidDateRangePreset(obj.dateRange) ? obj.dateRange : DEFAULT_SETTINGS.dateRange,
+    limit: Number.isFinite(parsedLimit) && parsedLimit >= 1 && parsedLimit <= 20 ? Math.floor(parsedLimit) : DEFAULT_SETTINGS.limit
+  };
+}
+export {
+  DEFAULT_SETTINGS,
+  hydrateSettings
+};
+//# sourceMappingURL=config.js.map

package/dist/modules/dashboards/widgets/dashboard/top-customers/config.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/top-customers/config.ts"],
+  "sourcesContent": ["import { type DateRangePreset, isValidDateRangePreset } from '@open-mercato/ui/backend/date-range'\n\nexport type TopCustomersSettings = {\n  dateRange: DateRangePreset\n  limit: number\n}\n\nexport const DEFAULT_SETTINGS: TopCustomersSettings = {\n  dateRange: 'this_month',\n  limit: 10,\n}\n\nexport function hydrateSettings(raw: unknown): TopCustomersSettings {\n  if (!raw || typeof raw !== 'object') return { ...DEFAULT_SETTINGS }\n  const obj = raw as Record<string, unknown>\n  const parsedLimit = Number(obj.limit)\n  return {\n    dateRange: isValidDateRangePreset(obj.dateRange) ? obj.dateRange : DEFAULT_SETTINGS.dateRange,\n    limit: Number.isFinite(parsedLimit) && parsedLimit >= 1 && parsedLimit <= 20 ? Math.floor(parsedLimit) : DEFAULT_SETTINGS.limit,\n  }\n}\n"],
+  "mappings": "AAAA,SAA+B,8BAA8B;AAOtD,MAAM,mBAAyC;AAAA,EACpD,WAAW;AAAA,EACX,OAAO;AACT;AAEO,SAAS,gBAAgB,KAAoC;AAClE,MAAI,CAAC,OAAO,OAAO,QAAQ,SAAU,QAAO,EAAE,GAAG,iBAAiB;AAClE,QAAM,MAAM;AACZ,QAAM,cAAc,OAAO,IAAI,KAAK;AACpC,SAAO;AAAA,IACL,WAAW,uBAAuB,IAAI,SAAS,IAAI,IAAI,YAAY,iBAAiB;AAAA,IACpF,OAAO,OAAO,SAAS,WAAW,KAAK,eAAe,KAAK,eAAe,KAAK,KAAK,MAAM,WAAW,IAAI,iBAAiB;AAAA,EAC5H;AACF;",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/top-customers/widget.client.js

@@ -0,0 +1,153 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { TopNTable } from "@open-mercato/ui/backend/charts";
+import { DateRangeSelect } from "@open-mercato/ui/backend/date-range";
+import { DEFAULT_SETTINGS, hydrateSettings } from "./config.js";
+import { formatCurrencySafe } from "../../../lib/formatters.js";
+async function fetchTopCustomersData(settings) {
+  const body = {
+    entityType: "sales:orders",
+    metric: {
+      field: "grandTotalGrossAmount",
+      aggregate: "sum"
+    },
+    groupBy: {
+      field: "customerEntityId",
+      limit: settings.limit,
+      resolveLabels: true
+    },
+    dateRange: {
+      field: "placedAt",
+      preset: settings.dateRange
+    }
+  };
+  const call = await apiCall("/api/dashboards/widgets/data", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!call.ok) {
+    const errorMsg = call.result?.error;
+    throw new Error(typeof errorMsg === "string" ? errorMsg : "Failed to fetch top customers data");
+  }
+  return call.result;
+}
+function formatCustomerName(name, unknownLabel) {
+  if (!name) return unknownLabel;
+  return name;
+}
+const TopCustomersWidget = ({
+  mode,
+  settings = DEFAULT_SETTINGS,
+  onSettingsChange,
+  refreshToken,
+  onRefreshStateChange
+}) => {
+  const t = useT();
+  const hydrated = React.useMemo(() => hydrateSettings(settings), [settings]);
+  const [data, setData] = React.useState([]);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
+  const unknownLabel = t("dashboards.analytics.labels.unknown", "Unknown");
+  const columns = React.useMemo(
+    () => [
+      {
+        key: "rank",
+        header: "#",
+        width: "40px"
+      },
+      {
+        key: "customerId",
+        header: t("dashboards.analytics.widgets.topCustomers.column.customer", "Customer"),
+        formatter: (value) => formatCustomerName(String(value || ""), unknownLabel)
+      },
+      {
+        key: "revenue",
+        header: t("dashboards.analytics.widgets.topCustomers.column.revenue", "Revenue"),
+        align: "right",
+        formatter: (value) => formatCurrencySafe(value)
+      }
+    ],
+    [t, unknownLabel]
+  );
+  const refresh = React.useCallback(async () => {
+    onRefreshStateChange?.(true);
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await fetchTopCustomersData(hydrated);
+      const tableData = result.data.map((item, index) => ({
+        rank: index + 1,
+        customerId: item.groupLabel || String(item.groupKey || t("dashboards.analytics.labels.unknown", "Unknown")),
+        revenue: item.value ?? 0
+      }));
+      setData(tableData);
+    } catch (err) {
+      console.error("Failed to load top customers data", err);
+      setError(t("dashboards.analytics.widgets.topCustomers.error", "Failed to load data"));
+    } finally {
+      setLoading(false);
+      onRefreshStateChange?.(false);
+    }
+  }, [hydrated, onRefreshStateChange, t]);
+  React.useEffect(() => {
+    refresh().catch(() => {
+    });
+  }, [refresh, refreshToken]);
+  if (mode === "settings") {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-4 text-sm", children: [
+      /* @__PURE__ */ jsx(
+        DateRangeSelect,
+        {
+          id: "top-customers-date-range",
+          label: t("dashboards.analytics.settings.dateRange", "Date Range"),
+          value: hydrated.dateRange,
+          onChange: (dateRange) => onSettingsChange({ ...hydrated, dateRange })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            htmlFor: "top-customers-limit",
+            className: "text-xs font-semibold uppercase text-muted-foreground",
+            children: t("dashboards.analytics.settings.limit", "Number of items")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            id: "top-customers-limit",
+            type: "number",
+            min: 1,
+            max: 20,
+            className: "w-24 rounded-md border px-2 py-1 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+            value: hydrated.limit,
+            onChange: (e) => {
+              const next = Number(e.target.value);
+              onSettingsChange({ ...hydrated, limit: Number.isFinite(next) ? next : hydrated.limit });
+            }
+          }
+        )
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx(
+    TopNTable,
+    {
+      data,
+      columns,
+      loading,
+      error,
+      emptyMessage: t("dashboards.analytics.widgets.topCustomers.empty", "No customer data for this period")
+    }
+  );
+};
+var widget_client_default = TopCustomersWidget;
+export {
+  widget_client_default as default
+};
+//# sourceMappingURL=widget.client.js.map

package/dist/modules/dashboards/widgets/dashboard/top-customers/widget.client.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/top-customers/widget.client.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport type { DashboardWidgetComponentProps } from '@open-mercato/shared/modules/dashboard/widgets'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { TopNTable, type TopNTableColumn } from '@open-mercato/ui/backend/charts'\nimport { DateRangeSelect, type DateRangePreset } from '@open-mercato/ui/backend/date-range'\nimport { DEFAULT_SETTINGS, hydrateSettings, type TopCustomersSettings } from './config'\nimport type { WidgetDataResponse } from '../../../services/widgetDataService'\nimport { formatCurrencySafe } from '../../../lib/formatters'\n\ntype CustomerRow = {\n  rank: number\n  customerId: string\n  revenue: number\n}\n\nasync function fetchTopCustomersData(settings: TopCustomersSettings): Promise<WidgetDataResponse> {\n  const body = {\n    entityType: 'sales:orders',\n    metric: {\n      field: 'grandTotalGrossAmount',\n      aggregate: 'sum',\n    },\n    groupBy: {\n      field: 'customerEntityId',\n      limit: settings.limit,\n      resolveLabels: true,\n    },\n    dateRange: {\n      field: 'placedAt',\n      preset: settings.dateRange,\n    },\n  }\n\n  const call = await apiCall<WidgetDataResponse>('/api/dashboards/widgets/data', {\n    method: 'POST',\n    headers: { 'Content-Type': 'application/json' },\n    body: JSON.stringify(body),\n  })\n\n  if (!call.ok) {\n    const errorMsg = (call.result as Record<string, unknown>)?.error\n    throw new Error(typeof errorMsg === 'string' ? errorMsg : 'Failed to fetch top customers data')\n  }\n\n  return call.result as WidgetDataResponse\n}\n\nfunction formatCustomerName(name: string | null, unknownLabel: string): string {\n  if (!name) return unknownLabel\n  return name\n}\n\nconst TopCustomersWidget: React.FC<DashboardWidgetComponentProps<TopCustomersSettings>> = ({\n  mode,\n  settings = DEFAULT_SETTINGS,\n  onSettingsChange,\n  refreshToken,\n  onRefreshStateChange,\n}) => {\n  const t = useT()\n  const hydrated = React.useMemo(() => hydrateSettings(settings), [settings])\n  const [data, setData] = React.useState<CustomerRow[]>([])\n  const [loading, setLoading] = React.useState(true)\n  const [error, setError] = React.useState<string | null>(null)\n\n  const unknownLabel = t('dashboards.analytics.labels.unknown', 'Unknown')\n  const columns: TopNTableColumn<CustomerRow>[] = React.useMemo(\n    () => [\n      {\n        key: 'rank',\n        header: '#',\n        width: '40px',\n      },\n      {\n        key: 'customerId',\n        header: t('dashboards.analytics.widgets.topCustomers.column.customer', 'Customer'),\n        formatter: (value) => formatCustomerName(String(value || ''), unknownLabel),\n      },\n      {\n        key: 'revenue',\n        header: t('dashboards.analytics.widgets.topCustomers.column.revenue', 'Revenue'),\n        align: 'right',\n        formatter: (value: unknown) => formatCurrencySafe(value),\n      },\n    ],\n    [t, unknownLabel],\n  )\n\n  const refresh = React.useCallback(async () => {\n    onRefreshStateChange?.(true)\n    setLoading(true)\n    setError(null)\n    try {\n      const result = await fetchTopCustomersData(hydrated)\n      const tableData: CustomerRow[] = result.data.map((item, index) => ({\n        rank: index + 1,\n        customerId: item.groupLabel || String(item.groupKey || t('dashboards.analytics.labels.unknown', 'Unknown')),\n        revenue: item.value ?? 0,\n      }))\n      setData(tableData)\n    } catch (err) {\n      console.error('Failed to load top customers data', err)\n      setError(t('dashboards.analytics.widgets.topCustomers.error', 'Failed to load data'))\n    } finally {\n      setLoading(false)\n      onRefreshStateChange?.(false)\n    }\n  }, [hydrated, onRefreshStateChange, t])\n\n  React.useEffect(() => {\n    refresh().catch(() => {})\n  }, [refresh, refreshToken])\n\n  if (mode === 'settings') {\n    return (\n      <div className=\"space-y-4 text-sm\">\n        <DateRangeSelect\n          id=\"top-customers-date-range\"\n          label={t('dashboards.analytics.settings.dateRange', 'Date Range')}\n          value={hydrated.dateRange}\n          onChange={(dateRange: DateRangePreset) => onSettingsChange({ ...hydrated, dateRange })}\n        />\n        <div className=\"space-y-1.5\">\n          <label\n            htmlFor=\"top-customers-limit\"\n            className=\"text-xs font-semibold uppercase text-muted-foreground\"\n          >\n            {t('dashboards.analytics.settings.limit', 'Number of items')}\n          </label>\n          <input\n            id=\"top-customers-limit\"\n            type=\"number\"\n            min={1}\n            max={20}\n            className=\"w-24 rounded-md border px-2 py-1 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary\"\n            value={hydrated.limit}\n            onChange={(e) => {\n              const next = Number(e.target.value)\n              onSettingsChange({ ...hydrated, limit: Number.isFinite(next) ? next : hydrated.limit })\n            }}\n          />\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <TopNTable\n      data={data}\n      columns={columns}\n      loading={loading}\n      error={error}\n      emptyMessage={t('dashboards.analytics.widgets.topCustomers.empty', 'No customer data for this period')}\n    />\n  )\n}\n\nexport default TopCustomersWidget\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/top-customers/widget.js

@@ -0,0 +1,25 @@
+import TopCustomersWidget from "./widget.client.js";
+import { DEFAULT_SETTINGS, hydrateSettings } from "./config.js";
+const widget = {
+  metadata: {
+    id: "dashboards.analytics.topCustomers",
+    title: "Top Customers",
+    description: "Top customers by revenue",
+    features: ["analytics.view", "sales.orders.view", "customers.people.view"],
+    defaultSize: "md",
+    defaultEnabled: false,
+    defaultSettings: DEFAULT_SETTINGS,
+    tags: ["analytics", "sales", "customers", "table"],
+    category: "analytics",
+    icon: "users",
+    supportsRefresh: true
+  },
+  Widget: TopCustomersWidget,
+  hydrateSettings,
+  dehydrateSettings: (s) => ({ dateRange: s.dateRange, limit: s.limit })
+};
+var widget_default = widget;
+export {
+  widget_default as default
+};
+//# sourceMappingURL=widget.js.map

package/dist/modules/dashboards/widgets/dashboard/top-customers/widget.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/top-customers/widget.ts"],
+  "sourcesContent": ["import type { DashboardWidgetModule } from '@open-mercato/shared/modules/dashboard/widgets'\nimport TopCustomersWidget from './widget.client'\nimport { DEFAULT_SETTINGS, hydrateSettings, type TopCustomersSettings } from './config'\n\nconst widget: DashboardWidgetModule<TopCustomersSettings> = {\n  metadata: {\n    id: 'dashboards.analytics.topCustomers',\n    title: 'Top Customers',\n    description: 'Top customers by revenue',\n    features: ['analytics.view', 'sales.orders.view', 'customers.people.view'],\n    defaultSize: 'md',\n    defaultEnabled: false,\n    defaultSettings: DEFAULT_SETTINGS,\n    tags: ['analytics', 'sales', 'customers', 'table'],\n    category: 'analytics',\n    icon: 'users',\n    supportsRefresh: true,\n  },\n  Widget: TopCustomersWidget,\n  hydrateSettings,\n  dehydrateSettings: (s) => ({ dateRange: s.dateRange, limit: s.limit }),\n}\n\nexport default widget\n"],
+  "mappings": "AACA,OAAO,wBAAwB;AAC/B,SAAS,kBAAkB,uBAAkD;AAE7E,MAAM,SAAsD;AAAA,EAC1D,UAAU;AAAA,IACR,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,aAAa;AAAA,IACb,UAAU,CAAC,kBAAkB,qBAAqB,uBAAuB;AAAA,IACzE,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,MAAM,CAAC,aAAa,SAAS,aAAa,OAAO;AAAA,IACjD,UAAU;AAAA,IACV,MAAM;AAAA,IACN,iBAAiB;AAAA,EACnB;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,mBAAmB,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,OAAO,EAAE,MAAM;AACtE;AAEA,IAAO,iBAAQ;",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/top-products/config.js

@@ -0,0 +1,22 @@
+import { isValidDateRangePreset } from "@open-mercato/ui/backend/date-range";
+const DEFAULT_SETTINGS = {
+  dateRange: "this_month",
+  limit: 10,
+  layout: "horizontal"
+};
+function hydrateSettings(raw) {
+  if (!raw || typeof raw !== "object") return { ...DEFAULT_SETTINGS };
+  const obj = raw;
+  const parsedLimit = Number(obj.limit);
+  const layout = obj.layout === "vertical" ? "vertical" : "horizontal";
+  return {
+    dateRange: isValidDateRangePreset(obj.dateRange) ? obj.dateRange : DEFAULT_SETTINGS.dateRange,
+    limit: Number.isFinite(parsedLimit) && parsedLimit >= 1 && parsedLimit <= 20 ? Math.floor(parsedLimit) : DEFAULT_SETTINGS.limit,
+    layout
+  };
+}
+export {
+  DEFAULT_SETTINGS,
+  hydrateSettings
+};
+//# sourceMappingURL=config.js.map

package/dist/modules/dashboards/widgets/dashboard/top-products/config.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/modules/dashboards/widgets/dashboard/top-products/config.ts"],
+  "sourcesContent": ["import { type DateRangePreset, isValidDateRangePreset } from '@open-mercato/ui/backend/date-range'\n\nexport type ChartLayout = 'horizontal' | 'vertical'\n\nexport type TopProductsSettings = {\n  dateRange: DateRangePreset\n  limit: number\n  layout: ChartLayout\n}\n\nexport const DEFAULT_SETTINGS: TopProductsSettings = {\n  dateRange: 'this_month',\n  limit: 10,\n  layout: 'horizontal',\n}\n\nexport function hydrateSettings(raw: unknown): TopProductsSettings {\n  if (!raw || typeof raw !== 'object') return { ...DEFAULT_SETTINGS }\n  const obj = raw as Record<string, unknown>\n  const parsedLimit = Number(obj.limit)\n  const layout = obj.layout === 'vertical' ? 'vertical' : 'horizontal'\n  return {\n    dateRange: isValidDateRangePreset(obj.dateRange) ? obj.dateRange : DEFAULT_SETTINGS.dateRange,\n    limit: Number.isFinite(parsedLimit) && parsedLimit >= 1 && parsedLimit <= 20 ? Math.floor(parsedLimit) : DEFAULT_SETTINGS.limit,\n    layout,\n  }\n}\n"],
+  "mappings": "AAAA,SAA+B,8BAA8B;AAUtD,MAAM,mBAAwC;AAAA,EACnD,WAAW;AAAA,EACX,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,SAAS,gBAAgB,KAAmC;AACjE,MAAI,CAAC,OAAO,OAAO,QAAQ,SAAU,QAAO,EAAE,GAAG,iBAAiB;AAClE,QAAM,MAAM;AACZ,QAAM,cAAc,OAAO,IAAI,KAAK;AACpC,QAAM,SAAS,IAAI,WAAW,aAAa,aAAa;AACxD,SAAO;AAAA,IACL,WAAW,uBAAuB,IAAI,SAAS,IAAI,IAAI,YAAY,iBAAiB;AAAA,IACpF,OAAO,OAAO,SAAS,WAAW,KAAK,eAAe,KAAK,eAAe,KAAK,KAAK,MAAM,WAAW,IAAI,iBAAiB;AAAA,IAC1H;AAAA,EACF;AACF;",
+  "names": []
+}

package/dist/modules/dashboards/widgets/dashboard/top-products/widget.client.js

@@ -0,0 +1,180 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { BarChart } from "@open-mercato/ui/backend/charts";
+import { DateRangeSelect, InlineDateRangeSelect } from "@open-mercato/ui/backend/date-range";
+import { DEFAULT_SETTINGS, hydrateSettings } from "./config.js";
+import { formatCurrencyCompact } from "../../../lib/formatters.js";
+async function fetchTopProductsData(settings) {
+  const body = {
+    entityType: "sales:order_lines",
+    metric: {
+      field: "totalGrossAmount",
+      aggregate: "sum"
+    },
+    groupBy: {
+      field: "productId",
+      limit: settings.limit,
+      resolveLabels: true
+    },
+    dateRange: {
+      field: "createdAt",
+      preset: settings.dateRange
+    }
+  };
+  const call = await apiCall("/api/dashboards/widgets/data", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!call.ok) {
+    const errorMsg = call.result?.error;
+    throw new Error(typeof errorMsg === "string" ? errorMsg : "Failed to fetch top products data");
+  }
+  return call.result;
+}
+function truncateLabel(label, t, maxLength = 20) {
+  if (label == null || label === "") return t("dashboards.analytics.labels.unknownProduct", "Unknown Product");
+  const labelStr = String(label);
+  if (labelStr === "0" || labelStr === "null" || labelStr === "undefined") {
+    return t("dashboards.analytics.labels.unknownProduct", "Unknown Product");
+  }
+  if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(labelStr)) {
+    return t("dashboards.analytics.labels.unnamedProduct", "Unnamed Product");
+  }
+  if (labelStr.length <= maxLength) return labelStr;
+  return labelStr.slice(0, maxLength - 3) + "...";
+}
+const TopProductsWidget = ({
+  mode,
+  settings = DEFAULT_SETTINGS,
+  onSettingsChange,
+  refreshToken,
+  onRefreshStateChange
+}) => {
+  const t = useT();
+  const hydrated = React.useMemo(() => hydrateSettings(settings), [settings]);
+  const [data, setData] = React.useState([]);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
+  const fetchingRef = React.useRef(false);
+  const refresh = React.useCallback(async () => {
+    if (fetchingRef.current) return;
+    fetchingRef.current = true;
+    onRefreshStateChange?.(true);
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await fetchTopProductsData(hydrated);
+      const chartData = result.data.map((item, index) => ({
+        name: truncateLabel(item.groupLabel ?? item.groupKey ?? `Product ${index + 1}`, t),
+        Revenue: item.value ?? 0
+      }));
+      setData(chartData);
+    } catch (err) {
+      console.error("Failed to load top products data", err);
+      setError(t("dashboards.analytics.widgets.topProducts.error", "Failed to load data"));
+    } finally {
+      setLoading(false);
+      onRefreshStateChange?.(false);
+      fetchingRef.current = false;
+    }
+  }, [hydrated, onRefreshStateChange, t]);
+  React.useEffect(() => {
+    refresh().catch(() => {
+    });
+  }, [refresh, refreshToken]);
+  if (mode === "settings") {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-4 text-sm", children: [
+      /* @__PURE__ */ jsx(
+        DateRangeSelect,
+        {
+          id: "top-products-date-range",
+          label: t("dashboards.analytics.settings.dateRange", "Date Range"),
+          value: hydrated.dateRange,
+          onChange: (dateRange) => onSettingsChange({ ...hydrated, dateRange })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            htmlFor: "top-products-limit",
+            className: "text-xs font-semibold uppercase text-muted-foreground",
+            children: t("dashboards.analytics.settings.limit", "Number of items")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            id: "top-products-limit",
+            type: "number",
+            min: 1,
+            max: 20,
+            className: "w-24 rounded-md border px-2 py-1 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+            value: hydrated.limit,
+            onChange: (e) => {
+              const next = Number(e.target.value);
+              onSettingsChange({ ...hydrated, limit: Number.isFinite(next) ? next : hydrated.limit });
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            htmlFor: "top-products-layout",
+            className: "text-xs font-semibold uppercase text-muted-foreground",
+            children: t("dashboards.analytics.settings.chartLayout", "Chart Layout")
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            id: "top-products-layout",
+            className: "w-full rounded-md border bg-background px-2 py-1 text-sm text-foreground focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+            value: hydrated.layout,
+            onChange: (e) => onSettingsChange({ ...hydrated, layout: e.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "horizontal", children: t("dashboards.analytics.settings.horizontal", "Horizontal") }),
+              /* @__PURE__ */ jsx("option", { value: "vertical", children: t("dashboards.analytics.settings.vertical", "Vertical") })
+            ]
+          }
+        )
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex justify-end mb-2", children: /* @__PURE__ */ jsx(
+      InlineDateRangeSelect,
+      {
+        value: hydrated.dateRange,
+        onChange: (dateRange) => onSettingsChange({ ...hydrated, dateRange })
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsx(
+      BarChart,
+      {
+        data,
+        index: "name",
+        categories: ["Revenue"],
+        categoryLabels: { Revenue: t("dashboards.analytics.widgets.topCustomers.column.revenue", "Revenue") },
+        loading,
+        error,
+        layout: hydrated.layout,
+        valueFormatter: formatCurrencyCompact,
+        colors: ["emerald"],
+        showLegend: false,
+        emptyMessage: t("dashboards.analytics.widgets.topProducts.empty", "No product sales data for this period")
+      }
+    ) })
+  ] });
+};
+var widget_client_default = TopProductsWidget;
+export {
+  widget_client_default as default
+};
+//# sourceMappingURL=widget.client.js.map