@withpotter/components 0.13.0-next.101

package/dist/intent/intent-order-list.js

@@ -0,0 +1,235 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRouter } from "next/navigation";
+import { useScopeLabels } from "@withpotter/lib/intents/intent-scope";
+import { resolveIcon } from "@withpotter/lib/intents/icon-map";
+import { resolveOrderRowNoun } from "@withpotter/lib/intents/row-identity";
+import { useRowNounContext } from "@withpotter/lib/intents/use-row-noun";
+import {
+  resolveHideFulfillment,
+  resolveOrderActions,
+  resolveOrderColumns,
+  resolveOrderStatusLabel
+} from "@withpotter/lib/intents/order-sections";
+import { formatOrderStamp } from "@withpotter/lib/order-config";
+import {
+  ORDER_STATUS_CONFIG,
+  FULFILLMENT_STATUS_CONFIG
+} from "@withpotter/pages-commerce/dashboard/(commerce)/orders/_components/order-list-constants";
+import { OverflowMenu, OverflowItem } from "@withpotter/ui-kit/overflow-menu";
+import { TableShell, Th, TableRow } from "@withpotter/ui-kit/table-shell";
+import { Checkbox } from "@withpotter/ui-kit/checkbox";
+import { StatusBadge } from "@withpotter/components/shared/status-badge";
+import { IdentityCell, StackedCell } from "@withpotter/ui-kit/table-cells";
+import { formatOrderNumber } from "@withpotter/lib/order-config";
+const SETTLED_OR_WAITING = /* @__PURE__ */ new Set(["pending", "cancelled", "refunded", "completed"]);
+function fulfillmentLeads(order) {
+  const state = order.fulfillmentStatus;
+  if (!state || state === "unfulfilled") return false;
+  return !SETTLED_OR_WAITING.has(order.status);
+}
+function fulfillmentWord(state) {
+  if (!state) return "Unfulfilled";
+  return state === "partial" ? "Partly fulfilled" : titleCase(state);
+}
+function titleCase(value) {
+  return value.replace(/_/g, " ").replace(/\b\w/g, (character) => character.toUpperCase());
+}
+function isOffered(actionKey, order) {
+  const settled = order.status === "cancelled" || order.status === "refunded" || order.status === "completed";
+  switch (actionKey) {
+    case "fulfill":
+      return !settled && order.fulfillmentStatus !== "fulfilled" && order.fulfillmentStatus !== "delivered" && order.fulfillmentStatus !== "collected";
+    case "cancel":
+      return !settled;
+    case "confirm":
+      return order.status === "pending";
+    case "confirm_payment":
+      return order.paymentStatus === "awaiting_confirmation";
+    default:
+      return true;
+  }
+}
+function IntentOrderList({
+  configs,
+  orders,
+  formatCurrency,
+  formatDate,
+  intentKey,
+  onAction,
+  selectedIds,
+  onToggleSelect,
+  onToggleSelectAll,
+  allSelected,
+  someSelected
+}) {
+  const router = useRouter();
+  const { configs: rowConfigs, renamed: nounRenamed } = useRowNounContext();
+  const columns = resolveOrderColumns(configs);
+  const actions = resolveOrderActions(configs);
+  const hideFulfillment = resolveHideFulfillment(configs);
+  const selectable = !!selectedIds && !!onToggleSelect;
+  const hasDateColumn = columns.some((c) => c.key === "date");
+  const mergesFulfillment = columns.some((c) => c.key === "status") && columns.some((c) => c.key === "fulfillment") && !hideFulfillment;
+  const shownColumns = mergesFulfillment ? columns.filter((c) => c.key !== "fulfillment") : columns;
+  const scopedOrders = useScopeLabels()?.links?.orders;
+  const buildDetailHref = (orderId) => scopedOrders ? `${scopedOrders}/${orderId}` : intentKey ? `/dashboard/orders/${orderId}?intent=${intentKey}` : `/dashboard/orders/${orderId}`;
+  const getCellValue = (order, columnKey) => {
+    switch (columnKey) {
+      case "orderNumber":
+        return formatOrderNumber(order.orderNumber, `#${order.id.slice(0, 8)}`);
+      case "customer":
+        return order.customerName ?? order.customerEmail ?? "Guest";
+      case "eventName":
+        return order.items?.[0]?.title ?? "-";
+      case "ticketCount":
+        return String(
+          order.items?.reduce((sum, item) => sum + (item.quantity ?? 1), 0) ?? 0
+        );
+      case "total":
+        return formatCurrency(order.total ?? 0, order.currency);
+      case "status":
+        return resolveOrderStatusLabel(order, configs, configs[0], titleCase);
+      case "fulfillment":
+        if (hideFulfillment) return "-";
+        return order.fulfillmentStatus ? titleCase(order.fulfillmentStatus) : "-";
+      case "checkedIn": {
+        const ci = order.checkIn;
+        if (!ci) return "-";
+        return `${ci.checkedIn}/${ci.total}`;
+      }
+      case "items": {
+        const items = order.items ?? [];
+        if (items.length === 0) return "-";
+        const first = items[0].title ?? "Item";
+        return items.length === 1 ? first : `${first} +${items.length - 1}`;
+      }
+      case "date":
+        return order.createdAt ? formatDate(order.createdAt) : "-";
+      default:
+        return "-";
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    TableShell,
+    {
+      bare: true,
+      minWidth: selectable ? 820 : 760,
+      head: /* @__PURE__ */ jsxs("tr", { children: [
+        selectable && /* @__PURE__ */ jsx(Th, { className: "w-10", children: /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            checked: !!allSelected,
+            indeterminate: !allSelected && !!someSelected,
+            onChange: onToggleSelectAll,
+            "aria-label": allSelected ? "Clear selection" : "Select all"
+          }
+        ) }),
+        shownColumns.map((col) => /* @__PURE__ */ jsx(Th, { align: col.key === "total" ? "right" : "left", children: col.label }, col.key)),
+        actions.length > 0 && /* @__PURE__ */ jsx(Th, { align: "right", className: "w-12" })
+      ] }),
+      children: orders.map((order) => /* @__PURE__ */ jsxs(
+        TableRow,
+        {
+          onClick: () => router.push(buildDetailHref(order.id)),
+          children: [
+            selectable && /* `stopPropagation`, because the row navigates to the order.
+               Without it, ticking a box opens the record you were trying to
+               select — and selection is only ever used to act on several at
+               once, so that is the one click that must not travel. */
+            /* @__PURE__ */ jsx("td", { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                checked: !!selectedIds?.has(order.id),
+                onChange: () => onToggleSelect?.(order.id),
+                "aria-label": "Select order"
+              }
+            ) }),
+            shownColumns.map((col) => {
+              const value = getCellValue(order, col.key);
+              if (col.key === "customer") {
+                return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+                  IdentityCell,
+                  {
+                    name: value,
+                    secondary: order.customerName ? order.customerEmail : void 0,
+                    avatarSeed: order.customerName ?? order.customerEmail ?? "Guest"
+                  }
+                ) }, col.key);
+              }
+              if (col.key === "status" || col.key === "fulfillment") {
+                const showsFulfillment = col.key === "fulfillment" || mergesFulfillment && fulfillmentLeads(order);
+                if (value === "-") {
+                  return /* @__PURE__ */ jsx("td", { className: "text-[var(--text-tertiary)]", children: value }, col.key);
+                }
+                return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+                  StatusBadge,
+                  {
+                    neutral: true,
+                    status: showsFulfillment ? order.fulfillmentStatus ?? "unfulfilled" : order.status,
+                    label: showsFulfillment ? fulfillmentWord(order.fulfillmentStatus) : value,
+                    icon: showsFulfillment ? FULFILLMENT_STATUS_CONFIG[order.fulfillmentStatus ?? "unfulfilled"]?.icon : ORDER_STATUS_CONFIG[order.status]?.icon
+                  }
+                ) }, col.key);
+              }
+              if (col.key === "items") {
+                return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+                  StackedCell,
+                  {
+                    value,
+                    sub: resolveOrderRowNoun(order, rowConfigs, nounRenamed) ?? void 0
+                  }
+                ) }, col.key);
+              }
+              if (col.key === "orderNumber") {
+                return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+                  StackedCell,
+                  {
+                    tone: "brand",
+                    value,
+                    sub: hasDateColumn ? void 0 : formatOrderStamp(order.createdAt)
+                  }
+                ) }, col.key);
+              }
+              if (col.key === "total") {
+                return /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(StackedCell, { align: "right", value }) }, col.key);
+              }
+              return /* @__PURE__ */ jsx(
+                "td",
+                {
+                  className: "whitespace-nowrap text-[var(--text-secondary)]",
+                  children: value
+                },
+                col.key
+              );
+            }),
+            actions.length > 0 && /* @__PURE__ */ jsx("td", { className: "text-right", onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(OverflowMenu, { children: actions.filter((action) => isOffered(action.key, order)).map((action) => {
+              const Icon = resolveIcon(action.icon);
+              return /* @__PURE__ */ jsx(
+                OverflowItem,
+                {
+                  icon: /* @__PURE__ */ jsx(Icon, {}),
+                  destructive: action.variant === "destructive",
+                  onClick: () => {
+                    if (action.key === "view") {
+                      router.push(buildDetailHref(order.id));
+                    } else {
+                      onAction?.(action.key, order.id);
+                    }
+                  },
+                  children: action.label
+                },
+                action.key
+              );
+            }) }) })
+          ]
+        },
+        order.id
+      ))
+    }
+  );
+}
+export {
+  IntentOrderList
+};
+//# sourceMappingURL=intent-order-list.js.map

package/dist/intent/intent-order-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/intent/intent-order-list.tsx"],"sourcesContent":["'use client';\n\nimport { useRouter } from 'next/navigation';\nimport { useScopeLabels } from '@withpotter/lib/intents/intent-scope';\nimport type { IntentConfig } from '@withpotter/lib/intents/types';\nimport type { Order } from '@withpotter/lib/api/types';\nimport { resolveIcon } from '@withpotter/lib/intents/icon-map';\nimport { resolveOrderRowNoun } from '@withpotter/lib/intents/row-identity';\nimport { useRowNounContext } from '@withpotter/lib/intents/use-row-noun';\nimport {\n  resolveHideFulfillment,\n  resolveOrderActions,\n  resolveOrderColumns,\n  resolveOrderStatusLabel,\n} from '@withpotter/lib/intents/order-sections';\nimport { formatOrderStamp } from '@withpotter/lib/order-config';\nimport {\n  ORDER_STATUS_CONFIG,\n  FULFILLMENT_STATUS_CONFIG,\n} from '@withpotter/pages-commerce/dashboard/(commerce)/orders/_components/order-list-constants';\nimport { OverflowMenu, OverflowItem } from '@withpotter/ui-kit/overflow-menu';\nimport { TableShell, Th, TableRow } from '@withpotter/ui-kit/table-shell';\nimport { Checkbox } from '@withpotter/ui-kit/checkbox';\nimport { StatusBadge } from '@withpotter/components/shared/status-badge';\nimport { IdentityCell, StackedCell } from '@withpotter/ui-kit/table-cells';\nimport { formatOrderNumber } from '@withpotter/lib/order-config';\n\n/** Order states that are an answer in themselves, whatever was or was not handed over. */\nconst SETTLED_OR_WAITING = new Set(['pending', 'cancelled', 'refunded', 'completed']);\n\n/** True once handing over has started on an order that is still open. */\nfunction fulfillmentLeads(order: Order): boolean {\n  const state = order.fulfillmentStatus;\n  if (!state || state === 'unfulfilled') return false;\n  return !SETTLED_OR_WAITING.has(order.status);\n}\n\n/** \"partial\" on its own says partial what; the rest read fine title-cased. */\nfunction fulfillmentWord(state: Order['fulfillmentStatus']): string {\n  if (!state) return 'Unfulfilled';\n  return state === 'partial' ? 'Partly fulfilled' : titleCase(state);\n}\n\n/** \"checked_in\" → \"Checked In\", for statuses an archetype has not named. */\nfunction titleCase(value: string): string {\n  return value\n    .replace(/_/g, ' ')\n    .replace(/\\b\\w/g, (character) => character.toUpperCase());\n}\n\ninterface IntentOrderListProps {\n  /**\n   * Every archetype this list covers — one when the view is narrowed, all of\n   * them when it is not. This was a single `config`, which on an unscoped view\n   * was `primary`: one archetype's table, one archetype's menu and one\n   * archetype's vocabulary over rows belonging to all of them.\n   */\n  configs: IntentConfig[];\n  orders: Order[];\n  formatCurrency: (amount: number, currency?: string) => string;\n  formatDate: (dateString: string) => string;\n  intentKey?: string;\n  onAction?: (actionKey: string, orderId: string) => void;\n  /** Selection, mirroring `OrdersTable`. Omit all of these for a plain list. */\n  selectedIds?: Set<string>;\n  onToggleSelect?: (id: string) => void;\n  onToggleSelectAll?: () => void;\n  allSelected?: boolean;\n  someSelected?: boolean;\n}\n\n/**\n * Config-driven order list: the same page as `OrdersTable`, for a merchant\n * whose archetype names different columns.\n *\n * It used to be a second table rather than the same table with other columns.\n * It drew its own card (`rounded-xl border bg-elevated`, inside a `ListFrame`\n * that already draws one), its own hover on `--bg-subtle` where every other row\n * in the app hovers on `--interactive-hover`, its dividers a shade darker than\n * the system's, rows 2px taller, and column headings in UPPERCASE WITH TRACKING\n * — the eyebrow `Th` exists to have deleted, and `FactList`'s comment calls the\n * generic-dashboard tell. A merchant on the archetype path was not looking at a\n * variant of Orders; they were looking at a different product.\n *\n * Columns still come from the config. Everything drawing them now comes from\n * the same primitives the default table uses.\n */\n/**\n * Whether an action still has anything to do to this order.\n *\n * The menu listed every action its archetype declared, on every row, whatever\n * state the order was in — so a completed, fulfilled order offered \"Fulfill\",\n * and a cancelled one offered \"Cancel\". Both call the API, and the second\n * write is either a no-op or an error the merchant has to interpret; either\n * way the menu promised work that was already done.\n *\n * Deliberately narrow. It answers \"is this state reachable from that one\",\n * nothing about permissions or archetype rules, which have their own homes.\n */\nfunction isOffered(actionKey: string, order: Order): boolean {\n  const settled =\n    order.status === 'cancelled' ||\n    order.status === 'refunded' ||\n    order.status === 'completed';\n\n  switch (actionKey) {\n    case 'fulfill':\n      // Already handed over, or the order is closed and nothing is going out.\n      return (\n        !settled &&\n        order.fulfillmentStatus !== 'fulfilled' &&\n        order.fulfillmentStatus !== 'delivered' &&\n        order.fulfillmentStatus !== 'collected'\n      );\n    case 'cancel':\n      return !settled;\n    case 'confirm':\n      return order.status === 'pending';\n    case 'confirm_payment':\n      return order.paymentStatus === 'awaiting_confirmation';\n    default:\n      // `view` and anything an archetype invents stay available.\n      return true;\n  }\n}\n\nexport function IntentOrderList({\n  configs,\n  orders,\n  formatCurrency,\n  formatDate,\n  intentKey,\n  onAction,\n  selectedIds,\n  onToggleSelect,\n  onToggleSelectAll,\n  allSelected,\n  someSelected,\n}: IntentOrderListProps) {\n  const router = useRouter();\n  /**\n   * The archetypes actually on screen.\n   *\n   * Everything below used to come off `config` alone — one archetype's table,\n   * one archetype's menu and one archetype's vocabulary over a list that can\n   * hold all of them. Worse, on an unscoped view `config` is `primary`, which\n   * is whichever key last rode an `?intent=` into sessionStorage, so the table\n   * changed shape depending on where the merchant had last clicked.\n   */\n  const { configs: rowConfigs, renamed: nounRenamed } = useRowNounContext();\n  const columns = resolveOrderColumns(configs);\n  const actions = resolveOrderActions(configs);\n  const hideFulfillment = resolveHideFulfillment(configs);\n\n  /**\n   * Selection, which this list simply did not have.\n   *\n   * `OrdersTable` has carried checkboxes and driven the bulk bar for a while,\n   * and it renders only on the DEFAULT path — the one a merchant with an\n   * archetype never takes. So bulk confirm and bulk handover existed, were\n   * wired, and were unreachable for effectively every real tenant. The same\n   * trap the search box and filter panel fell into on this page.\n   */\n  const selectable = !!selectedIds && !!onToggleSelect;\n  const hasDateColumn = columns.some((c) => c.key === 'date');\n\n  /**\n   * Status and fulfilment are one column, not two.\n   *\n   * They are not independent facts a merchant reads separately — they are two\n   * halves of \"where is this order\", and split across neighbouring columns each\n   * row asked you to read them apart and put them back together. Fulfilment was\n   * also the emptier of the two by a distance: every archetype that sets\n   * `hideFulfillment` renders it as a dash for every row, so the column was\n   * frequently a column of nothing.\n   *\n   * Merged, the chip carries the state and fulfilment sits under it as the\n   * quiet second line — the same shape the order number and the total already\n   * use on this row. The config still declares both; only the rendering folds.\n   */\n  const mergesFulfillment =\n    columns.some((c) => c.key === 'status') &&\n    columns.some((c) => c.key === 'fulfillment') &&\n    !hideFulfillment;\n\n  const shownColumns = mergesFulfillment\n    ? columns.filter((c) => c.key !== 'fulfillment')\n    : columns;\n  // A screen mounted by an intent's route opens its orders at that route's own\n  // address; the shared list keeps the legacy one.\n  const scopedOrders = useScopeLabels()?.links?.orders;\n  const buildDetailHref = (orderId: string) =>\n    scopedOrders\n      ? `${scopedOrders}/${orderId}`\n      : intentKey\n        ? `/dashboard/orders/${orderId}?intent=${intentKey}`\n        : `/dashboard/orders/${orderId}`;\n\n  const getCellValue = (order: Order, columnKey: string): string => {\n    switch (columnKey) {\n      case 'orderNumber':\n        return formatOrderNumber(order.orderNumber, `#${order.id.slice(0, 8)}`);\n      case 'customer':\n        return order.customerName ?? order.customerEmail ?? 'Guest';\n      case 'eventName':\n        return order.items?.[0]?.title ?? '-';\n      case 'ticketCount':\n        return String(\n          order.items?.reduce((sum, item) => sum + (item.quantity ?? 1), 0) ??\n            0,\n        );\n      case 'total':\n        return formatCurrency(order.total ?? 0, order.currency);\n      case 'status':\n        // Per ROW, not per screen. An archetype only names the statuses it\n        // cares about, so anything else falls through to `titleCase` — the raw\n        // database value used to reach the column and read \"Pending, Confirmed,\n        // processing, Checked In, completed\", the unnamed ones arriving in\n        // lower case and looking like a bug.\n        return resolveOrderStatusLabel(order, configs, configs[0], titleCase);\n      case 'fulfillment':\n        if (hideFulfillment) return '-';\n        // Was the raw enum, so this column alone read \"unfulfilled\" in\n        // lowercase while every neighbour was title-cased — the column looked\n        // like data that had escaped rather than a state anybody named.\n        return order.fulfillmentStatus\n          ? titleCase(order.fulfillmentStatus)\n          : '-';\n      case 'checkedIn': {\n        const ci = order.checkIn;\n        if (!ci) return '-';\n        return `${ci.checkedIn}/${ci.total}`;\n      }\n      case 'items': {\n        // Was `items.length` — a bare number where the config's label says\n        // \"Plan\" or \"Items\". Name the first thing and count the rest.\n        const items = order.items ?? [];\n        if (items.length === 0) return '-';\n        const first = items[0].title ?? 'Item';\n        return items.length === 1 ? first : `${first} +${items.length - 1}`;\n      }\n      case 'date':\n        // Declared by several configs and never handled, so the column was\n        // permanently \"-\" while formatDate sat unused in props.\n        return order.createdAt ? formatDate(order.createdAt) : '-';\n      default:\n        return '-';\n    }\n  };\n\n  /**\n   * The row's own empty state is gone, not lost: this list renders inside the\n   * orders page's `ListStates`, which already resolves empty from the same\n   * config (`config.emptyStates.orders`) and draws it as `TableEmptyState`.\n   * The copy here was a second, differently-spaced answer to a question that\n   * had already been answered one component up.\n   */\n  return (\n    <TableShell\n      bare\n      /* Wider when selecting: the checkbox column is 40px taken out of the\n         row, and without this the order number wrapped onto two lines. Mirrors\n         the default table, which makes the same allowance. */\n      minWidth={selectable ? 820 : 760}\n      head={\n        <tr>\n          {/* Same `Checkbox` the catalogue and the default orders table tick,\n              so a mixed selection is a real `indeterminate` state rather than a\n              half-opacity glyph. */}\n          {selectable && (\n            <Th className=\"w-10\">\n              <Checkbox\n                checked={!!allSelected}\n                indeterminate={!allSelected && !!someSelected}\n                onChange={onToggleSelectAll}\n                aria-label={allSelected ? 'Clear selection' : 'Select all'}\n              />\n            </Th>\n          )}\n          {shownColumns.map((col) => (\n            <Th key={col.key} align={col.key === 'total' ? 'right' : 'left'}>\n              {col.label}\n            </Th>\n          ))}\n          {actions.length > 0 && <Th align=\"right\" className=\"w-12\" />}\n        </tr>\n      }\n    >\n      {orders.map((order) => (\n        <TableRow\n          key={order.id}\n          onClick={() => router.push(buildDetailHref(order.id))}\n        >\n          {selectable && (\n            /* `stopPropagation`, because the row navigates to the order.\n               Without it, ticking a box opens the record you were trying to\n               select — and selection is only ever used to act on several at\n               once, so that is the one click that must not travel. */\n            <td onClick={(e) => e.stopPropagation()}>\n              <Checkbox\n                checked={!!selectedIds?.has(order.id)}\n                onChange={() => onToggleSelect?.(order.id)}\n                aria-label=\"Select order\"\n              />\n            </td>\n          )}\n          {shownColumns.map((col) => {\n            const value = getCellValue(order, col.key);\n\n            if (col.key === 'customer') {\n              return (\n                <td key={col.key}>\n                  <IdentityCell\n                    name={value}\n                    secondary={\n                      order.customerName ? order.customerEmail : undefined\n                    }\n                    avatarSeed={\n                      order.customerName ?? order.customerEmail ?? 'Guest'\n                    }\n                  />\n                </td>\n              );\n            }\n\n            if (col.key === 'status' || col.key === 'fulfillment') {\n              // A dash is the absence of a state, not a state. Chipping it\n              // draws a frame around nothing.\n              const showsFulfillment =\n                col.key === 'fulfillment' ||\n                (mergesFulfillment && fulfillmentLeads(order));\n              if (value === '-') {\n                return (\n                  <td key={col.key} className=\"text-[var(--text-tertiary)]\">\n                    {value}\n                  </td>\n                );\n              }\n              return (\n                <td key={col.key}>\n                  {/* ONE STATUS A ROW. The merged column used to stack the\n                      fulfilment state under the order's chip, so a row read\n                      \"Confirmed\" and \"Partial\" at once and left the reader to\n                      work out which was the answer. Fulfilment is the later\n                      stage of the same journey: once it has started it is\n                      where the order is, and it takes the chip. Neutral, with\n                      the glyph from the app's own status maps, as before. */}\n                  <StatusBadge\n                    neutral\n                    status={\n                      showsFulfillment\n                        ? (order.fulfillmentStatus ?? 'unfulfilled')\n                        : order.status\n                    }\n                    label={\n                      showsFulfillment\n                        ? fulfillmentWord(order.fulfillmentStatus)\n                        : value\n                    }\n                    icon={\n                      showsFulfillment\n                        ? FULFILLMENT_STATUS_CONFIG[\n                            order.fulfillmentStatus ?? 'unfulfilled'\n                          ]?.icon\n                        : ORDER_STATUS_CONFIG[order.status]?.icon\n                    }\n                  />\n                </td>\n              );\n            }\n\n            if (col.key === 'items') {\n              /* WHAT WAS SOLD, not just its title.\n                 A gym's Orders holds membership sign-ups, session bookings and\n                 kit, and the reference number and customer say nothing about\n                 which. The order's own lines carry `behaviors`, so the row can\n                 — the same reading `resolveOrderSections` does one screen over.\n                 A mixed order says nothing: it is genuinely both, and a cell\n                 has one line to say it in. */\n              return (\n                <td key={col.key}>\n                  <StackedCell\n                    value={value}\n                    sub={\n                      resolveOrderRowNoun(order, rowConfigs, nounRenamed) ??\n                      undefined\n                    }\n                  />\n                </td>\n              );\n            }\n\n            if (col.key === 'orderNumber') {\n              return (\n                <td key={col.key}>\n                  {/* Brand ink, like the default table's order number — a\n                      reference you can open.\n                      *\n                      * The stamp rides underneath, but ONLY where the archetype\n                      * has not declared `date` as a column of its own: dine-in\n                      * and food-orders both do, and the same timestamp twice in\n                      * one row reads as a bug. */}\n                  <StackedCell\n                    tone=\"brand\"\n                    value={value}\n                    sub={\n                      hasDateColumn\n                        ? undefined\n                        : formatOrderStamp(order.createdAt)\n                    }\n                  />\n                </td>\n              );\n            }\n\n            if (col.key === 'total') {\n              return (\n                <td key={col.key}>\n                  <StackedCell align=\"right\" value={value} />\n                </td>\n              );\n            }\n\n            return (\n              <td\n                key={col.key}\n                className=\"whitespace-nowrap text-[var(--text-secondary)]\"\n              >\n                {value}\n              </td>\n            );\n          })}\n\n          {actions.length > 0 && (\n            <td className=\"text-right\" onClick={(e) => e.stopPropagation()}>\n              {/* Was a hand-rolled dropdown: a raw button toggling an absolutely\n                  positioned panel with no Escape, no outside-click on some\n                  paths and no roving focus. `OverflowMenu` is the app's answer\n                  and the orders page header already uses it. */}\n              <OverflowMenu>\n                {actions\n                  .filter((action) => isOffered(action.key, order))\n                  .map((action) => {\n                    const Icon = resolveIcon(action.icon);\n                    return (\n                      <OverflowItem\n                        key={action.key}\n                        icon={<Icon />}\n                        destructive={action.variant === 'destructive'}\n                        onClick={() => {\n                          if (action.key === 'view') {\n                            router.push(buildDetailHref(order.id));\n                          } else {\n                            onAction?.(action.key, order.id);\n                          }\n                        }}\n                      >\n                        {action.label}\n                      </OverflowItem>\n                    );\n                  })}\n              </OverflowMenu>\n            </td>\n          )}\n        </TableRow>\n      ))}\n    </TableShell>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/intent/sections/download-links-section.d.ts

@@ -0,0 +1,14 @@
+import type { SectionProps } from '@withpotter/lib/intents/section-registry';
+/**
+ * Whether the thing the customer bought actually reached them.
+ *
+ * digital-products declared `download-links` and it was never registered, so a
+ * merchant selling downloads could not tell delivery from silence. The engine
+ * mints a token per file on payment and tracks `downloadCount`, a limit and an
+ * expiry — all of which answers "did they get it, and can they still get it".
+ *
+ * The token itself is never shown. It is a bearer credential for the customer's
+ * file; printing it on a dashboard makes it shoulder-surfable and copyable into
+ * a support thread.
+ */
+export declare function DownloadLinksSection({ orderId }: SectionProps): import("react").JSX.Element | null;

package/dist/intent/sections/download-links-section.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Download, AlertTriangle } from "lucide-react";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { digitalFilesApi } from "@withpotter/lib/api/digital-files";
+import { Badge } from "@withpotter/ui-kit";
+function expiryLabel(expiresAt) {
+  if (!expiresAt) return null;
+  const ms = new Date(expiresAt).getTime() - Date.now();
+  if (ms <= 0) return "expired";
+  const days = Math.ceil(ms / 864e5);
+  return days === 1 ? "expires tomorrow" : `expires in ${days} days`;
+}
+function DownloadLinksSection({ orderId }) {
+  const { data: tokens, isLoading } = useApiQuery(
+    ["order-downloads", orderId],
+    (slug) => digitalFilesApi.listByOrder(slug, orderId),
+    { enabled: Boolean(orderId) }
+  );
+  if (isLoading || !tokens || tokens.length === 0) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-xl border border-[var(--border-default)] bg-[var(--bg-elevated)]", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b border-[var(--border-default)] px-4 py-3", children: [
+      /* @__PURE__ */ jsx(Download, { className: "h-[15px] w-[15px] text-[var(--text-tertiary)]" }),
+      /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Downloads" })
+    ] }),
+    /* @__PURE__ */ jsx("ul", { className: "divide-y divide-[var(--border-subtle)]", children: tokens.map((t) => {
+      const expiry = expiryLabel(t.expiresAt);
+      const spent = t.downloadLimit != null && t.downloadCount >= t.downloadLimit;
+      const untouched = t.downloadCount === 0;
+      return /* @__PURE__ */ jsxs(
+        "li",
+        {
+          className: "flex items-center justify-between gap-3 px-4 py-3 text-sm",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsxs("p", { className: "truncate text-[var(--text-primary)]", children: [
+                t.downloadCount,
+                t.downloadLimit != null ? ` of ${t.downloadLimit}` : "",
+                " ",
+                t.downloadCount === 1 ? "download" : "downloads"
+              ] }),
+              t.lastDownloadedAt && /* @__PURE__ */ jsxs("p", { className: "truncate text-xs text-[var(--text-tertiary)]", children: [
+                "Last",
+                " ",
+                new Date(t.lastDownloadedAt).toLocaleDateString("en-US", {
+                  day: "numeric",
+                  month: "short"
+                })
+              ] })
+            ] }),
+            untouched ? /* @__PURE__ */ jsxs(Badge, { variant: "warning", className: "flex-shrink-0 gap-1", children: [
+              /* @__PURE__ */ jsx(AlertTriangle, {}),
+              "Not collected"
+            ] }) : spent || expiry === "expired" ? /* @__PURE__ */ jsx(Badge, { className: "flex-shrink-0", children: spent ? "Limit reached" : "Expired" }) : expiry && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-xs text-[var(--text-tertiary)]", children: expiry })
+          ]
+        },
+        t.id
+      );
+    }) })
+  ] });
+}
+export {
+  DownloadLinksSection
+};
+//# sourceMappingURL=download-links-section.js.map

package/dist/intent/sections/download-links-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/intent/sections/download-links-section.tsx"],"sourcesContent":["'use client';\n\nimport { Download, AlertTriangle } from 'lucide-react';\nimport type { SectionProps } from '@withpotter/lib/intents/section-registry';\nimport { useApiQuery } from '@withpotter/hooks/use-api-query';\nimport { digitalFilesApi } from '@withpotter/lib/api/digital-files';\nimport { Badge } from '@withpotter/ui-kit';\n\nfunction expiryLabel(expiresAt: string | null) {\n  if (!expiresAt) return null;\n  const ms = new Date(expiresAt).getTime() - Date.now();\n  if (ms <= 0) return 'expired';\n  const days = Math.ceil(ms / 86_400_000);\n  return days === 1 ? 'expires tomorrow' : `expires in ${days} days`;\n}\n\n/**\n * Whether the thing the customer bought actually reached them.\n *\n * digital-products declared `download-links` and it was never registered, so a\n * merchant selling downloads could not tell delivery from silence. The engine\n * mints a token per file on payment and tracks `downloadCount`, a limit and an\n * expiry — all of which answers \"did they get it, and can they still get it\".\n *\n * The token itself is never shown. It is a bearer credential for the customer's\n * file; printing it on a dashboard makes it shoulder-surfable and copyable into\n * a support thread.\n */\nexport function DownloadLinksSection({ orderId }: SectionProps) {\n  const { data: tokens, isLoading } = useApiQuery(\n    ['order-downloads', orderId],\n    (slug) => digitalFilesApi.listByOrder(slug, orderId!),\n    { enabled: Boolean(orderId) },\n  );\n\n  if (isLoading || !tokens || tokens.length === 0) return null;\n\n  return (\n    <div className=\"overflow-hidden rounded-xl border border-[var(--border-default)] bg-[var(--bg-elevated)]\">\n      <div className=\"flex items-center gap-2 border-b border-[var(--border-default)] px-4 py-3\">\n        <Download className=\"h-[15px] w-[15px] text-[var(--text-tertiary)]\" />\n        <h3 className=\"text-sm font-semibold text-[var(--text-primary)]\">\n          Downloads\n        </h3>\n      </div>\n\n      <ul className=\"divide-y divide-[var(--border-subtle)]\">\n        {tokens.map((t) => {\n          const expiry = expiryLabel(t.expiresAt);\n          const spent =\n            t.downloadLimit != null && t.downloadCount >= t.downloadLimit;\n          const untouched = t.downloadCount === 0;\n          return (\n            <li\n              key={t.id}\n              className=\"flex items-center justify-between gap-3 px-4 py-3 text-sm\"\n            >\n              <div className=\"min-w-0\">\n                <p className=\"truncate text-[var(--text-primary)]\">\n                  {t.downloadCount}\n                  {t.downloadLimit != null ? ` of ${t.downloadLimit}` : ''}{' '}\n                  {t.downloadCount === 1 ? 'download' : 'downloads'}\n                </p>\n                {t.lastDownloadedAt && (\n                  <p className=\"truncate text-xs text-[var(--text-tertiary)]\">\n                    Last{' '}\n                    {new Date(t.lastDownloadedAt).toLocaleDateString('en-US', {\n                      day: 'numeric',\n                      month: 'short',\n                    })}\n                  </p>\n                )}\n              </div>\n\n              {/* Never collected is the one a merchant may need to act on. */}\n              {untouched ? (\n                <Badge variant=\"warning\" className=\"flex-shrink-0 gap-1\">\n                  <AlertTriangle />\n                  Not collected\n                </Badge>\n              ) : spent || expiry === 'expired' ? (\n                <Badge className=\"flex-shrink-0\">\n                  {spent ? 'Limit reached' : 'Expired'}\n                </Badge>\n              ) : (\n                expiry && (\n                  <span className=\"flex-shrink-0 text-xs text-[var(--text-tertiary)]\">\n                    {expiry}\n                  </span>\n                )\n              )}\n            </li>\n          );\n        })}\n      </ul>\n    </div>\n  );\n}\n"],"mappings":";AAuCM,SACE,KADF;AArCN,SAAS,UAAU,qBAAqB;AAExC,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAChC,SAAS,aAAa;AAEtB,SAAS,YAAY,WAA0B;AAC7C,MAAI,CAAC,UAAW,QAAO;AACvB,QAAM,KAAK,IAAI,KAAK,SAAS,EAAE,QAAQ,IAAI,KAAK,IAAI;AACpD,MAAI,MAAM,EAAG,QAAO;AACpB,QAAM,OAAO,KAAK,KAAK,KAAK,KAAU;AACtC,SAAO,SAAS,IAAI,qBAAqB,cAAc,IAAI;AAC7D;AAcO,SAAS,qBAAqB,EAAE,QAAQ,GAAiB;AAC9D,QAAM,EAAE,MAAM,QAAQ,UAAU,IAAI;AAAA,IAClC,CAAC,mBAAmB,OAAO;AAAA,IAC3B,CAAC,SAAS,gBAAgB,YAAY,MAAM,OAAQ;AAAA,IACpD,EAAE,SAAS,QAAQ,OAAO,EAAE;AAAA,EAC9B;AAEA,MAAI,aAAa,CAAC,UAAU,OAAO,WAAW,EAAG,QAAO;AAExD,SACE,qBAAC,SAAI,WAAU,4FACb;AAAA,yBAAC,SAAI,WAAU,6EACb;AAAA,0BAAC,YAAS,WAAU,iDAAgD;AAAA,MACpE,oBAAC,QAAG,WAAU,oDAAmD,uBAEjE;AAAA,OACF;AAAA,IAEA,oBAAC,QAAG,WAAU,0CACX,iBAAO,IAAI,CAAC,MAAM;AACjB,YAAM,SAAS,YAAY,EAAE,SAAS;AACtC,YAAM,QACJ,EAAE,iBAAiB,QAAQ,EAAE,iBAAiB,EAAE;AAClD,YAAM,YAAY,EAAE,kBAAkB;AACtC,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,WAAU;AAAA,UAEV;AAAA,iCAAC,SAAI,WAAU,WACb;AAAA,mCAAC,OAAE,WAAU,uCACV;AAAA,kBAAE;AAAA,gBACF,EAAE,iBAAiB,OAAO,OAAO,EAAE,aAAa,KAAK;AAAA,gBAAI;AAAA,gBACzD,EAAE,kBAAkB,IAAI,aAAa;AAAA,iBACxC;AAAA,cACC,EAAE,oBACD,qBAAC,OAAE,WAAU,gDAA+C;AAAA;AAAA,gBACrD;AAAA,gBACJ,IAAI,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,SAAS;AAAA,kBACxD,KAAK;AAAA,kBACL,OAAO;AAAA,gBACT,CAAC;AAAA,iBACH;AAAA,eAEJ;AAAA,YAGC,YACC,qBAAC,SAAM,SAAQ,WAAU,WAAU,uBACjC;AAAA,kCAAC,iBAAc;AAAA,cAAE;AAAA,eAEnB,IACE,SAAS,WAAW,YACtB,oBAAC,SAAM,WAAU,iBACd,kBAAQ,kBAAkB,WAC7B,IAEA,UACE,oBAAC,UAAK,WAAU,qDACb,kBACH;AAAA;AAAA;AAAA,QAlCC,EAAE;AAAA,MAqCT;AAAA,IAEJ,CAAC,GACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/intent/sections/event-tickets/attendee-list-section.d.ts

@@ -0,0 +1,8 @@
+import type { SectionProps } from '@withpotter/lib/intents/section-registry';
+/**
+ * Attendee List section for event order detail.
+ *
+ * Shows individual bookings/tickets on this order with name, tier,
+ * status, and check-in timestamp.
+ */
+export declare function AttendeeListSection({ data }: SectionProps): import("react").JSX.Element | null;

package/dist/intent/sections/event-tickets/attendee-list-section.js

@@ -0,0 +1,54 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Users, CheckCircle2, Clock, UserX } from "lucide-react";
+function AttendeeListSection({ data }) {
+  const order = data;
+  if (!order) return null;
+  const bookings = order.bookings;
+  if (!bookings?.length) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "surface", children: [
+    /* @__PURE__ */ jsx("div", { className: "px-4 py-3 border-b border-[var(--border-default)]", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(Users, { className: "size-4 text-[var(--text-tertiary)]" }),
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Attendees" })
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: "text-xs text-[var(--text-tertiary)]", children: [
+        bookings.length,
+        " ticket",
+        bookings.length !== 1 ? "s" : ""
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "divide-y divide-[var(--border-default)]", children: bookings.map((booking, idx) => {
+      const isCheckedIn = booking.status === "checked_in" || !!booking.checkedInAt;
+      const isNoShow = booking.status === "no_show";
+      const tierName = booking.data?.tierName ?? "";
+      const checkedInAt = booking.checkedInAt;
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "px-4 py-3 flex items-center gap-3",
+          children: [
+            isCheckedIn ? /* @__PURE__ */ jsx(CheckCircle2, { className: "size-4 text-[var(--success)] flex-shrink-0" }) : isNoShow ? /* @__PURE__ */ jsx(UserX, { className: "size-4 text-[var(--error)] flex-shrink-0" }) : /* @__PURE__ */ jsx(Clock, { className: "size-4 text-[var(--text-muted)] flex-shrink-0" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)] truncate", children: booking.customerName ?? "Guest" }),
+              tierName && /* @__PURE__ */ jsxs("p", { className: "text-xs text-[var(--text-tertiary)]", children: [
+                tierName,
+                " \xD7 ",
+                booking.quantity ?? 1
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "text-right flex-shrink-0", children: isCheckedIn ? /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--success)]", children: checkedInAt ? new Date(checkedInAt).toLocaleTimeString("en-US", {
+              hour: "numeric",
+              minute: "2-digit"
+            }) : "Checked in" }) : isNoShow ? /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--error)]", children: "No show" }) : /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--text-muted)]", children: "Not checked in" }) })
+          ]
+        },
+        booking.id ?? idx
+      );
+    }) })
+  ] });
+}
+export {
+  AttendeeListSection
+};
+//# sourceMappingURL=attendee-list-section.js.map

package/dist/intent/sections/event-tickets/attendee-list-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/intent/sections/event-tickets/attendee-list-section.tsx"],"sourcesContent":["'use client';\n\nimport { Users, CheckCircle2, Clock, UserX } from 'lucide-react';\nimport type { SectionProps } from '@withpotter/lib/intents/section-registry';\n\n/**\n * Attendee List section for event order detail.\n *\n * Shows individual bookings/tickets on this order with name, tier,\n * status, and check-in timestamp.\n */\nexport function AttendeeListSection({ data }: SectionProps) {\n  const order = data as Record<string, unknown> | undefined;\n  if (!order) return null;\n\n  const bookings = (order as any).bookings as\n    | Array<Record<string, unknown>>\n    | undefined;\n\n  if (!bookings?.length) return null;\n\n  return (\n    <div className=\"surface\">\n      <div className=\"px-4 py-3 border-b border-[var(--border-default)]\">\n        <div className=\"flex items-center justify-between\">\n          <div className=\"flex items-center gap-2\">\n            <Users className=\"size-4 text-[var(--text-tertiary)]\" />\n            <h3 className=\"text-sm font-semibold text-[var(--text-primary)]\">\n              Attendees\n            </h3>\n          </div>\n          <span className=\"text-xs text-[var(--text-tertiary)]\">\n            {bookings.length} ticket{bookings.length !== 1 ? 's' : ''}\n          </span>\n        </div>\n      </div>\n      <div className=\"divide-y divide-[var(--border-default)]\">\n        {bookings.map((booking, idx) => {\n          const isCheckedIn =\n            booking.status === 'checked_in' || !!booking.checkedInAt;\n          const isNoShow = booking.status === 'no_show';\n          const tierName = ((booking.data as any)?.tierName as string) ?? '';\n          const checkedInAt = booking.checkedInAt as string | undefined;\n\n          return (\n            <div\n              key={(booking.id as string) ?? idx}\n              className=\"px-4 py-3 flex items-center gap-3\"\n            >\n              {isCheckedIn ? (\n                <CheckCircle2 className=\"size-4 text-[var(--success)] flex-shrink-0\" />\n              ) : isNoShow ? (\n                <UserX className=\"size-4 text-[var(--error)] flex-shrink-0\" />\n              ) : (\n                <Clock className=\"size-4 text-[var(--text-muted)] flex-shrink-0\" />\n              )}\n              <div className=\"flex-1 min-w-0\">\n                <p className=\"text-sm font-medium text-[var(--text-primary)] truncate\">\n                  {(booking.customerName as string) ?? 'Guest'}\n                </p>\n                {tierName && (\n                  <p className=\"text-xs text-[var(--text-tertiary)]\">\n                    {tierName} &times; {(booking.quantity as number) ?? 1}\n                  </p>\n                )}\n              </div>\n              <div className=\"text-right flex-shrink-0\">\n                {isCheckedIn ? (\n                  <span className=\"text-xs text-[var(--success)]\">\n                    {checkedInAt\n                      ? new Date(checkedInAt).toLocaleTimeString('en-US', {\n                          hour: 'numeric',\n                          minute: '2-digit',\n                        })\n                      : 'Checked in'}\n                  </span>\n                ) : isNoShow ? (\n                  <span className=\"text-xs text-[var(--error)]\">No show</span>\n                ) : (\n                  <span className=\"text-xs text-[var(--text-muted)]\">\n                    Not checked in\n                  </span>\n                )}\n              </div>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAyBU,SACE,KADF;AAvBV,SAAS,OAAO,cAAc,OAAO,aAAa;AAS3C,SAAS,oBAAoB,EAAE,KAAK,GAAiB;AAC1D,QAAM,QAAQ;AACd,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,WAAY,MAAc;AAIhC,MAAI,CAAC,UAAU,OAAQ,QAAO;AAE9B,SACE,qBAAC,SAAI,WAAU,WACb;AAAA,wBAAC,SAAI,WAAU,qDACb,+BAAC,SAAI,WAAU,qCACb;AAAA,2BAAC,SAAI,WAAU,2BACb;AAAA,4BAAC,SAAM,WAAU,sCAAqC;AAAA,QACtD,oBAAC,QAAG,WAAU,oDAAmD,uBAEjE;AAAA,SACF;AAAA,MACA,qBAAC,UAAK,WAAU,uCACb;AAAA,iBAAS;AAAA,QAAO;AAAA,QAAQ,SAAS,WAAW,IAAI,MAAM;AAAA,SACzD;AAAA,OACF,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,2CACZ,mBAAS,IAAI,CAAC,SAAS,QAAQ;AAC9B,YAAM,cACJ,QAAQ,WAAW,gBAAgB,CAAC,CAAC,QAAQ;AAC/C,YAAM,WAAW,QAAQ,WAAW;AACpC,YAAM,WAAa,QAAQ,MAAc,YAAuB;AAChE,YAAM,cAAc,QAAQ;AAE5B,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,WAAU;AAAA,UAET;AAAA,0BACC,oBAAC,gBAAa,WAAU,8CAA6C,IACnE,WACF,oBAAC,SAAM,WAAU,4CAA2C,IAE5D,oBAAC,SAAM,WAAU,iDAAgD;AAAA,YAEnE,qBAAC,SAAI,WAAU,kBACb;AAAA,kCAAC,OAAE,WAAU,2DACT,kBAAQ,gBAA2B,SACvC;AAAA,cACC,YACC,qBAAC,OAAE,WAAU,uCACV;AAAA;AAAA,gBAAS;AAAA,gBAAW,QAAQ,YAAuB;AAAA,iBACtD;AAAA,eAEJ;AAAA,YACA,oBAAC,SAAI,WAAU,4BACZ,wBACC,oBAAC,UAAK,WAAU,iCACb,wBACG,IAAI,KAAK,WAAW,EAAE,mBAAmB,SAAS;AAAA,cAChD,MAAM;AAAA,cACN,QAAQ;AAAA,YACV,CAAC,IACD,cACN,IACE,WACF,oBAAC,UAAK,WAAU,+BAA8B,qBAAO,IAErD,oBAAC,UAAK,WAAU,oCAAmC,4BAEnD,GAEJ;AAAA;AAAA;AAAA,QArCM,QAAQ,MAAiB;AAAA,MAsCjC;AAAA,IAEJ,CAAC,GACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/intent/sections/event-tickets/check-in-status-section.d.ts

@@ -0,0 +1,8 @@
+import type { SectionProps } from '@withpotter/lib/intents/section-registry';
+/**
+ * Check-In Status section for event order detail.
+ *
+ * Shows the check-in status of tickets on this order: how many checked in,
+ * overall status badge, and checked-in timestamp.
+ */
+export declare function CheckInStatusSection({ data }: SectionProps): import("react").JSX.Element | null;

package/dist/intent/sections/event-tickets/check-in-status-section.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ScanLine, CheckCircle2, Clock, UserX } from "lucide-react";
+import { EmptyNote } from "@withpotter/ui-kit";
+function CheckInStatusSection({ data }) {
+  const order = data;
+  if (!order) return null;
+  const bookings = order.bookings;
+  if (!bookings?.length) {
+    return /* @__PURE__ */ jsxs("div", { className: "surface", children: [
+      /* @__PURE__ */ jsx("div", { className: "px-4 py-3 border-b border-[var(--border-default)]", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(ScanLine, { className: "size-4 text-[var(--text-tertiary)]" }),
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Check-In" })
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "px-4 py-4 text-center", children: /* @__PURE__ */ jsx(EmptyNote, { children: "No tickets issued yet" }) })
+    ] });
+  }
+  const checkedIn = bookings.filter(
+    (b) => b.status === "checked_in" || b.checkedInAt
+  );
+  const noShow = bookings.filter((b) => b.status === "no_show");
+  const pending = bookings.length - checkedIn.length - noShow.length;
+  return /* @__PURE__ */ jsxs("div", { className: "surface", children: [
+    /* @__PURE__ */ jsx("div", { className: "px-4 py-3 border-b border-[var(--border-default)]", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(ScanLine, { className: "size-4 text-[var(--text-tertiary)]" }),
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Check-In" })
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: "text-xs text-[var(--text-tertiary)]", children: [
+        checkedIn.length,
+        "/",
+        bookings.length,
+        " checked in"
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "px-4 py-3", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-3 text-center", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-1 text-[var(--success)]", children: [
+          /* @__PURE__ */ jsx(CheckCircle2, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { className: "text-lg font-bold", children: checkedIn.length })
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-tertiary)]", children: "Checked in" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-1 text-[var(--text-secondary)]", children: [
+          /* @__PURE__ */ jsx(Clock, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { className: "text-lg font-bold", children: pending })
+        ] }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-tertiary)]", children: "Pending" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-1 text-[var(--error)]", children: [
+          /* @__PURE__ */ jsx(UserX, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { className: "text-lg font-bold", children: noShow.length })
+        ] }),
+        /* @__PURE__ */ jsx(EmptyNote, { children: "No show" })
+      ] })
+    ] }) })
+  ] });
+}
+export {
+  CheckInStatusSection
+};
+//# sourceMappingURL=check-in-status-section.js.map

package/dist/intent/sections/event-tickets/check-in-status-section.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/intent/sections/event-tickets/check-in-status-section.tsx"],"sourcesContent":["'use client';\n\nimport { ScanLine, CheckCircle2, Clock, UserX } from 'lucide-react';\nimport type { SectionProps } from '@withpotter/lib/intents/section-registry';\nimport { EmptyNote } from '@withpotter/ui-kit';\n\n/**\n * Check-In Status section for event order detail.\n *\n * Shows the check-in status of tickets on this order: how many checked in,\n * overall status badge, and checked-in timestamp.\n */\nexport function CheckInStatusSection({ data }: SectionProps) {\n  const order = data as Record<string, unknown> | undefined;\n  if (!order) return null;\n\n  const bookings = (order as any).bookings as\n    | Array<Record<string, unknown>>\n    | undefined;\n\n  if (!bookings?.length) {\n    return (\n      <div className=\"surface\">\n        <div className=\"px-4 py-3 border-b border-[var(--border-default)]\">\n          <div className=\"flex items-center gap-2\">\n            <ScanLine className=\"size-4 text-[var(--text-tertiary)]\" />\n            <h3 className=\"text-sm font-semibold text-[var(--text-primary)]\">\n              Check-In\n            </h3>\n          </div>\n        </div>\n        <div className=\"px-4 py-4 text-center\">\n          <EmptyNote>No tickets issued yet</EmptyNote>\n        </div>\n      </div>\n    );\n  }\n\n  const checkedIn = bookings.filter(\n    (b) => b.status === 'checked_in' || b.checkedInAt,\n  );\n  const noShow = bookings.filter((b) => b.status === 'no_show');\n  const pending = bookings.length - checkedIn.length - noShow.length;\n\n  return (\n    <div className=\"surface\">\n      <div className=\"px-4 py-3 border-b border-[var(--border-default)]\">\n        <div className=\"flex items-center justify-between\">\n          <div className=\"flex items-center gap-2\">\n            <ScanLine className=\"size-4 text-[var(--text-tertiary)]\" />\n            <h3 className=\"text-sm font-semibold text-[var(--text-primary)]\">\n              Check-In\n            </h3>\n          </div>\n          <span className=\"text-xs text-[var(--text-tertiary)]\">\n            {checkedIn.length}/{bookings.length} checked in\n          </span>\n        </div>\n      </div>\n      <div className=\"px-4 py-3\">\n        <div className=\"grid grid-cols-3 gap-3 text-center\">\n          <div>\n            <div className=\"flex items-center justify-center gap-1 text-[var(--success)]\">\n              <CheckCircle2 className=\"size-4\" />\n              <span className=\"text-lg font-bold\">{checkedIn.length}</span>\n            </div>\n            <p className=\"text-xs text-[var(--text-tertiary)]\">Checked in</p>\n          </div>\n          <div>\n            <div className=\"flex items-center justify-center gap-1 text-[var(--text-secondary)]\">\n              <Clock className=\"size-4\" />\n              <span className=\"text-lg font-bold\">{pending}</span>\n            </div>\n            <p className=\"text-xs text-[var(--text-tertiary)]\">Pending</p>\n          </div>\n          <div>\n            <div className=\"flex items-center justify-center gap-1 text-[var(--error)]\">\n              <UserX className=\"size-4\" />\n              <span className=\"text-lg font-bold\">{noShow.length}</span>\n            </div>\n            <EmptyNote>No show</EmptyNote>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAwBU,SACE,KADF;AAtBV,SAAS,UAAU,cAAc,OAAO,aAAa;AAErD,SAAS,iBAAiB;AAQnB,SAAS,qBAAqB,EAAE,KAAK,GAAiB;AAC3D,QAAM,QAAQ;AACd,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,WAAY,MAAc;AAIhC,MAAI,CAAC,UAAU,QAAQ;AACrB,WACE,qBAAC,SAAI,WAAU,WACb;AAAA,0BAAC,SAAI,WAAU,qDACb,+BAAC,SAAI,WAAU,2BACb;AAAA,4BAAC,YAAS,WAAU,sCAAqC;AAAA,QACzD,oBAAC,QAAG,WAAU,oDAAmD,sBAEjE;AAAA,SACF,GACF;AAAA,MACA,oBAAC,SAAI,WAAU,yBACb,8BAAC,aAAU,mCAAqB,GAClC;AAAA,OACF;AAAA,EAEJ;AAEA,QAAM,YAAY,SAAS;AAAA,IACzB,CAAC,MAAM,EAAE,WAAW,gBAAgB,EAAE;AAAA,EACxC;AACA,QAAM,SAAS,SAAS,OAAO,CAAC,MAAM,EAAE,WAAW,SAAS;AAC5D,QAAM,UAAU,SAAS,SAAS,UAAU,SAAS,OAAO;AAE5D,SACE,qBAAC,SAAI,WAAU,WACb;AAAA,wBAAC,SAAI,WAAU,qDACb,+BAAC,SAAI,WAAU,qCACb;AAAA,2BAAC,SAAI,WAAU,2BACb;AAAA,4BAAC,YAAS,WAAU,sCAAqC;AAAA,QACzD,oBAAC,QAAG,WAAU,oDAAmD,sBAEjE;AAAA,SACF;AAAA,MACA,qBAAC,UAAK,WAAU,uCACb;AAAA,kBAAU;AAAA,QAAO;AAAA,QAAE,SAAS;AAAA,QAAO;AAAA,SACtC;AAAA,OACF,GACF;AAAA,IACA,oBAAC,SAAI,WAAU,aACb,+BAAC,SAAI,WAAU,sCACb;AAAA,2BAAC,SACC;AAAA,6BAAC,SAAI,WAAU,gEACb;AAAA,8BAAC,gBAAa,WAAU,UAAS;AAAA,UACjC,oBAAC,UAAK,WAAU,qBAAqB,oBAAU,QAAO;AAAA,WACxD;AAAA,QACA,oBAAC,OAAE,WAAU,uCAAsC,wBAAU;AAAA,SAC/D;AAAA,MACA,qBAAC,SACC;AAAA,6BAAC,SAAI,WAAU,uEACb;AAAA,8BAAC,SAAM,WAAU,UAAS;AAAA,UAC1B,oBAAC,UAAK,WAAU,qBAAqB,mBAAQ;AAAA,WAC/C;AAAA,QACA,oBAAC,OAAE,WAAU,uCAAsC,qBAAO;AAAA,SAC5D;AAAA,MACA,qBAAC,SACC;AAAA,6BAAC,SAAI,WAAU,8DACb;AAAA,8BAAC,SAAM,WAAU,UAAS;AAAA,UAC1B,oBAAC,UAAK,WAAU,qBAAqB,iBAAO,QAAO;AAAA,WACrD;AAAA,QACA,oBAAC,aAAU,qBAAO;AAAA,SACpB;AAAA,OACF,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/intent/sections/event-tickets/event-details-section.d.ts

@@ -0,0 +1,8 @@
+import type { SectionProps } from '@withpotter/lib/intents/section-registry';
+/**
+ * Event Details section for event order detail.
+ *
+ * Shows event date, time, venue, and venue address extracted from
+ * the first order item's ticketed behavior config.
+ */
+export declare function EventDetailsSection({ data }: SectionProps): import("react").JSX.Element | null;

package/dist/intent/sections/event-tickets/event-details-section.js

@@ -0,0 +1,64 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Calendar, MapPin, Clock } from "lucide-react";
+function EventDetailsSection({ data }) {
+  const order = data;
+  if (!order) return null;
+  const items = order.items ?? [];
+  const firstItem = items[0];
+  if (!firstItem) return null;
+  const itemData = firstItem.data ?? firstItem;
+  const behaviors = itemData.behaviors ?? {};
+  const ticketed = behaviors.ticketed ?? {};
+  const eventDate = ticketed.eventDate;
+  const eventEndDate = ticketed.eventEndDate;
+  const venueName = ticketed.venueName;
+  const venueAddress = ticketed.venueAddress;
+  if (!eventDate && !venueName) return null;
+  const formatDateTime = (dateStr) => {
+    const d = new Date(dateStr);
+    return {
+      date: d.toLocaleDateString("en-US", {
+        weekday: "long",
+        month: "long",
+        day: "numeric",
+        year: "numeric"
+      }),
+      time: d.toLocaleTimeString("en-US", {
+        hour: "numeric",
+        minute: "2-digit"
+      })
+    };
+  };
+  const start = eventDate ? formatDateTime(eventDate) : null;
+  const end = eventEndDate ? formatDateTime(eventEndDate) : null;
+  return /* @__PURE__ */ jsxs("div", { className: "surface", children: [
+    /* @__PURE__ */ jsx("div", { className: "px-4 py-3 border-b border-[var(--border-default)]", children: /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Event details" }) }),
+    /* @__PURE__ */ jsxs("div", { className: "px-4 py-3 space-y-3", children: [
+      start && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsx(Calendar, { className: "size-4 text-[var(--text-tertiary)] mt-0.5 flex-shrink-0" }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: start.date }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 mt-0.5", children: [
+            /* @__PURE__ */ jsx(Clock, { className: "text-[var(--text-muted)]" }),
+            /* @__PURE__ */ jsxs("span", { className: "text-xs text-[var(--text-secondary)]", children: [
+              start.time,
+              end ? ` \u2013 ${end.time}` : ""
+            ] })
+          ] })
+        ] })
+      ] }),
+      venueName && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsx(MapPin, { className: "size-4 text-[var(--text-tertiary)] mt-0.5 flex-shrink-0" }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: venueName }),
+          venueAddress && /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-secondary)] mt-0.5", children: venueAddress })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+export {
+  EventDetailsSection
+};
+//# sourceMappingURL=event-details-section.js.map