@drawbridge/components 0.1.4 → 0.1.5

package/dist/dashboard/card-task.js

@@ -61,27 +61,25 @@ const CardTask = ({
     classes.push(className);
   }
   const button = () => {
-    const { element = import_link.default, text, ...props } = rest == null ? void 0 : rest.button;
+    const { element = import_link.default, onClick, text, ...props } = rest == null ? void 0 : rest.button;
+    const close = () => {
+      modal.close();
+      queryClient.setQueryData(
+        ["drawer"],
+        (data) => ({
+          ...data,
+          active: false
+        })
+      );
+    };
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_button.default,
       {
         ...{
           element,
-          onClick: () => {
-            modal.close();
-            queryClient.setQueryData(
-              ["drawer"],
-              (data) => ({
-                ...data,
-                active: false
-              })
-            );
-            if (props.onClick) {
-              props.onClick();
-            }
-          },
           size: "small",
-          ...props
+          ...props,
+          onClick: onClick || close
         },
         children: text
       }

package/dist/dashboard/card-task.mjs

@@ -29,27 +29,25 @@ const CardTask = ({
     classes.push(className);
   }
   const button = () => {
-    const { element = Link, text, ...props } = rest == null ? void 0 : rest.button;
+    const { element = Link, onClick, text, ...props } = rest == null ? void 0 : rest.button;
+    const close = () => {
+      modal.close();
+      queryClient.setQueryData(
+        ["drawer"],
+        (data) => ({
+          ...data,
+          active: false
+        })
+      );
+    };
     return /* @__PURE__ */ jsx(
       Button,
       {
         ...{
           element,
-          onClick: () => {
-            modal.close();
-            queryClient.setQueryData(
-              ["drawer"],
-              (data) => ({
-                ...data,
-                active: false
-              })
-            );
-            if (props.onClick) {
-              props.onClick();
-            }
-          },
           size: "small",
-          ...props
+          ...props,
+          onClick: onClick || close
         },
         children: text
       }

package/dist/dashboard/drawer-subscription.js

@@ -294,9 +294,9 @@ const DrawerSubscriptionSummary = ({
                 "Subtotal",
                 "$" + (0, import_drawbridge_utils.formatNumber)((first.subtotal || 0) / 100, 2)
               ),
-              renderLine(
+              first.discount > 0 && renderLine(
                 "Discount",
-                "-$" + (0, import_drawbridge_utils.formatNumber)((first.discount || 0) / 100, 2)
+                "-$" + (0, import_drawbridge_utils.formatNumber)(first.discount / 100, 2)
               ),
               renderLine(
                 "Tax",

package/dist/dashboard/drawer-subscription.mjs

@@ -262,9 +262,9 @@ const DrawerSubscriptionSummary = ({
                 "Subtotal",
                 "$" + formatNumber((first.subtotal || 0) / 100, 2)
               ),
-              renderLine(
+              first.discount > 0 && renderLine(
                 "Discount",
-                "-$" + formatNumber((first.discount || 0) / 100, 2)
+                "-$" + formatNumber(first.discount / 100, 2)
               ),
               renderLine(
                 "Tax",

package/dist/dashboard/form-organization-campaign-link.js

@@ -78,7 +78,9 @@ const FormOrganizationCampaignLink = ({
       import_yup.default.object({
         asset: import_yup.default.object().label("Asset").nullable(),
         title: import_yup.default.string().label("Title").required().max(150),
-        url: import_yup.default.string().label("Url").max(150).matches(import_drawbridge_utils.regex.url, "Url must start with https").required().url()
+        // @story links/create
+        // The server stores any length; a UTM-tagged URL passes 150 easily.
+        url: import_yup.default.string().label("Url").max(2048).matches(import_drawbridge_utils.regex.url, "Url must start with https").required().url()
       })
     ),
     values

package/dist/dashboard/form-organization-campaign-link.mjs

@@ -46,7 +46,9 @@ const FormOrganizationCampaignLink = ({
       yup.object({
         asset: yup.object().label("Asset").nullable(),
         title: yup.string().label("Title").required().max(150),
-        url: yup.string().label("Url").max(150).matches(regex.url, "Url must start with https").required().url()
+        // @story links/create
+        // The server stores any length; a UTM-tagged URL passes 150 easily.
+        url: yup.string().label("Url").max(2048).matches(regex.url, "Url must start with https").required().url()
       })
     ),
     values

package/dist/dashboard/recharts.js

@@ -256,6 +256,7 @@ const ChartLine = ({
     "shortcodes"
   ],
   empty,
+  format = (value) => value,
   legend = true
 }) => {
   const [active, setActive] = (0, import_react.useState)(datasets);
@@ -432,8 +433,11 @@ const ChartLine = ({
               import_recharts.Tooltip,
               {
                 ...{
+                  // @story redemptions/overview
+                  // A money chart passes `format` so a day's summed gross reads
+                  // "$12.50", not 12.500000000000002; counts pass nothing.
                   formatter: (value, name) => [
-                    value,
+                    format(value),
                     label(name)
                   ]
                 }

package/dist/dashboard/recharts.mjs

@@ -223,6 +223,7 @@ const ChartLine = ({
     "shortcodes"
   ],
   empty,
+  format = (value) => value,
   legend = true
 }) => {
   const [active, setActive] = useState(datasets);
@@ -399,8 +400,11 @@ const ChartLine = ({
               Tooltip,
               {
                 ...{
+                  // @story redemptions/overview
+                  // A money chart passes `format` so a day's summed gross reads
+                  // "$12.50", not 12.500000000000002; counts pass nothing.
                   formatter: (value, name) => [
-                    value,
+                    format(value),
                     label(name)
                   ]
                 }

package/dist/dashboard/table.js

@@ -35,6 +35,7 @@ __export(table_exports, {
   TableContainer: () => TableContainer,
   TableHeader: () => TableHeader,
   TableRow: () => TableRow,
+  currencyCell: () => currencyCell,
   dateCell: () => dateCell,
   dateTimeCell: () => dateTimeCell,
   default: () => table_default,
@@ -94,6 +95,14 @@ const rateCell = ({ getValue, row }) => {
   if (((_a = row == null ? void 0 : row.original) == null ? void 0 : _a.type) === "redemption") return "\u2014";
   return rate || rate === 0 ? rate + "%" : "\u2014";
 };
+const currencyCell = ({ getValue, row }) => {
+  var _a;
+  return (0, import_drawbridge_utils.formatCurrency)({
+    // A null code would reach Intl and throw; undefined takes the USD default.
+    code: ((_a = row == null ? void 0 : row.original) == null ? void 0 : _a.currency) || void 0,
+    value: getValue() || 0
+  });
+};
 const dateTimeCell = ({ getValue }) => {
   const value = getValue();
   return value ? (0, import_drawbridge_utils.formatDateString)({
@@ -759,6 +768,7 @@ var table_default = Table;
   TableContainer,
   TableHeader,
   TableRow,
+  currencyCell,
   dateCell,
   dateTimeCell,
   rateCell

package/dist/dashboard/table.mjs

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table";
 import { useQueryClient } from "@tanstack/react-query";
-import { formatDateString } from "@drawbridge/drawbridge-utils";
+import { formatCurrency, formatDateString } from "@drawbridge/drawbridge-utils";
 import { request } from "@drawbridge/drawbridge-utils/fetch";
 import Link from "./link.mjs";
 import { forwardRef, useMemo } from "react";
@@ -52,6 +52,14 @@ const rateCell = ({ getValue, row }) => {
   if (((_a = row == null ? void 0 : row.original) == null ? void 0 : _a.type) === "redemption") return "\u2014";
   return rate || rate === 0 ? rate + "%" : "\u2014";
 };
+const currencyCell = ({ getValue, row }) => {
+  var _a;
+  return formatCurrency({
+    // A null code would reach Intl and throw; undefined takes the USD default.
+    code: ((_a = row == null ? void 0 : row.original) == null ? void 0 : _a.currency) || void 0,
+    value: getValue() || 0
+  });
+};
 const dateTimeCell = ({ getValue }) => {
   const value = getValue();
   return value ? formatDateString({
@@ -716,6 +724,7 @@ export {
   TableContainer,
   TableHeader,
   TableRow,
+  currencyCell,
   dateCell,
   dateTimeCell,
   table_default as default,

package/dist/dashboard/template-dashboard.js

@@ -620,19 +620,23 @@ const TemplateDashboardResource = ({
   refetchOnMount,
   ...chrome
 }) => {
+  const dynamic = Object.values(chrome).some((value) => value instanceof Function);
   const errorHandler = error || ((query) => {
     var _a, _b, _c;
-    if (((_a = query == null ? void 0 : query.error) == null ? void 0 : _a.status) === 403 || (0, import_fetch.isTransientError)(query == null ? void 0 : query.error)) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TemplateDashboard, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      TemplateDashboardError,
-      {
-        ...{
-          error: {
-            ...(_b = query == null ? void 0 : query.error) == null ? void 0 : _b.data,
-            message: (_c = query == null ? void 0 : query.error) == null ? void 0 : _c.message
+    if (((_a = query == null ? void 0 : query.error) == null ? void 0 : _a.status) === 403 || (0, import_fetch.isTransientError)(query == null ? void 0 : query.error)) {
+      const panel = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        TemplateDashboardError,
+        {
+          ...{
+            error: {
+              ...(_b = query == null ? void 0 : query.error) == null ? void 0 : _b.data,
+              message: (_c = query == null ? void 0 : query.error) == null ? void 0 : _c.message
+            }
           }
         }
-      }
-    ) });
+      );
+      return dynamic ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TemplateDashboard, { children: panel }) : panel;
+    }
     (0, import_navigation.notFound)();
   });
   const provider = {
@@ -654,7 +658,6 @@ const TemplateDashboardResource = ({
     }
   };
   const resolve = (value, data) => value instanceof Function ? value(data) : value;
-  const dynamic = Object.values(chrome).some((value) => value instanceof Function);
   if (!dynamic) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     TemplateDashboard,
     {

package/dist/dashboard/template-dashboard.mjs

@@ -585,19 +585,23 @@ const TemplateDashboardResource = ({
   refetchOnMount,
   ...chrome
 }) => {
+  const dynamic = Object.values(chrome).some((value) => value instanceof Function);
   const errorHandler = error || ((query) => {
     var _a, _b, _c;
-    if (((_a = query == null ? void 0 : query.error) == null ? void 0 : _a.status) === 403 || isTransientError(query == null ? void 0 : query.error)) return /* @__PURE__ */ jsx(TemplateDashboard, { children: /* @__PURE__ */ jsx(
-      TemplateDashboardError,
-      {
-        ...{
-          error: {
-            ...(_b = query == null ? void 0 : query.error) == null ? void 0 : _b.data,
-            message: (_c = query == null ? void 0 : query.error) == null ? void 0 : _c.message
+    if (((_a = query == null ? void 0 : query.error) == null ? void 0 : _a.status) === 403 || isTransientError(query == null ? void 0 : query.error)) {
+      const panel = /* @__PURE__ */ jsx(
+        TemplateDashboardError,
+        {
+          ...{
+            error: {
+              ...(_b = query == null ? void 0 : query.error) == null ? void 0 : _b.data,
+              message: (_c = query == null ? void 0 : query.error) == null ? void 0 : _c.message
+            }
           }
         }
-      }
-    ) });
+      );
+      return dynamic ? /* @__PURE__ */ jsx(TemplateDashboard, { children: panel }) : panel;
+    }
     notFound();
   });
   const provider = {
@@ -619,7 +623,6 @@ const TemplateDashboardResource = ({
     }
   };
   const resolve = (value, data) => value instanceof Function ? value(data) : value;
-  const dynamic = Object.values(chrome).some((value) => value instanceof Function);
   if (!dynamic) return /* @__PURE__ */ jsx(
     TemplateDashboard,
     {

package/dist/dashboard/template-socket.js

@@ -171,6 +171,9 @@ const TemplateSocketCampaign = ({
         queryClient.invalidateQueries({
           queryKey: ["organization-campaign-prize-draws", prize]
         });
+        queryClient.invalidateQueries({
+          queryKey: ["organization-campaign-prizes", params.organization, params.campaign]
+        });
       }
     },
     // The live handler applies leads as a delta, which can't be replayed after
@@ -184,7 +187,8 @@ const TemplateSocketCampaign = ({
     resync: [
       ["campaign", params == null ? void 0 : params.campaign],
       ["campaign-advertisements", params == null ? void 0 : params.organization, params == null ? void 0 : params.campaign],
-      ["organization-campaign-advertisement"]
+      ["organization-campaign-advertisement"],
+      ["organization-campaign-prizes", params == null ? void 0 : params.organization, params == null ? void 0 : params.campaign]
     ]
   });
   return children;

package/dist/dashboard/template-socket.mjs

@@ -136,6 +136,9 @@ const TemplateSocketCampaign = ({
         queryClient.invalidateQueries({
           queryKey: ["organization-campaign-prize-draws", prize]
         });
+        queryClient.invalidateQueries({
+          queryKey: ["organization-campaign-prizes", params.organization, params.campaign]
+        });
       }
     },
     // The live handler applies leads as a delta, which can't be replayed after
@@ -149,7 +152,8 @@ const TemplateSocketCampaign = ({
     resync: [
       ["campaign", params == null ? void 0 : params.campaign],
       ["campaign-advertisements", params == null ? void 0 : params.organization, params == null ? void 0 : params.campaign],
-      ["organization-campaign-advertisement"]
+      ["organization-campaign-advertisement"],
+      ["organization-campaign-prizes", params == null ? void 0 : params.organization, params == null ? void 0 : params.campaign]
     ]
   });
   return children;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawbridge/components",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "exports": {
     "./advertisement": {
       "types": "./types/advertisement.d.ts",
@@ -1636,7 +1636,7 @@
   },
   "devDependencies": {
     "@analytics/google-tag-manager": "0.5.5",
-    "@drawbridge/drawbridge-agents": "0.1.74",
+    "@drawbridge/drawbridge-agents": "0.1.79",
     "@drawbridge/drawbridge-telemetry": "0.0.19",
     "@drawbridge/drawbridge-utils": "0.0.221",
     "@headlessui/react": "2.2.9",

package/types/dashboard/recharts.d.ts

@@ -23,6 +23,9 @@ export interface ChartLineProps {
 	// when every point is zero across these.
 	datasets?: ChartDataset[];
 	empty?: ChartEmptyProps;
+	// Formats each value in the hover tooltip; a money chart passes one so a
+	// summed amount reads "$12.50". Defaults to the raw value.
+	format?: ( value: number ) => ReactNode;
 	// Clicking an entry toggles its series.
 	legend?: boolean;
 }

package/types/dashboard/table.d.ts

@@ -83,6 +83,8 @@ export declare const TableCellId: ComponentType<{ id?: string | null }>;
 export declare const dateTimeCell: TableCellRenderer;
 // 'N%', '—' when empty or on a redemption row.
 export declare const rateCell: TableCellRenderer;
+// The amount in its row's own `currency` ('€12.50' on a EUR row), USD when the row has none.
+export declare const currencyCell: TableCellRenderer;
 
 export declare const TableContainer: ComponentType<{ children?: ReactNode; className?: string }>;