@thorprovider/blocks 4.1.0 → 4.3.0

package/dist/blocks/designs/order-history/components/controls.js

@@ -0,0 +1,168 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var controls_exports = {};
+__export(controls_exports, {
+  Controls: () => Controls
+});
+module.exports = __toCommonJS(controls_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_blocks = require("@thorprovider/blocks");
+var import_contracts = require("../contracts.js");
+var import_icons = require("./icons.js");
+var import_toolbar_button = require("./toolbar-button.js");
+function Controls({
+  query,
+  searchValue,
+  labels,
+  capabilities,
+  counts,
+  columns,
+  presentation,
+  sortOptions,
+  onSearchChange,
+  onQuick,
+  onSort,
+  onPresentation,
+  onToggleColumn
+}) {
+  const viewsEnabled = capabilities.tableView === true;
+  const searchId = (0, import_react.useId)();
+  const quickId = (0, import_react.useId)();
+  const sortId = (0, import_react.useId)();
+  const [columnsOpen, setColumnsOpen] = (0, import_react.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative min-w-16 flex-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: searchId, className: "sr-only", children: labels.header.searchLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute top-1/2 left-2.5 -translate-y-1/2 text-muted-foreground",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: "search", className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "input",
+          {
+            id: searchId,
+            type: "search",
+            value: searchValue,
+            placeholder: labels.header.searchPlaceholder,
+            onChange: (event) => onSearchChange(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Escape") onSearchChange("");
+            },
+            className: (0, import_blocks.cn)(
+              "h-9 w-full min-w-0 rounded-md border border-input bg-background pl-7 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+              searchValue ? "pr-8" : "pr-2"
+            )
+          }
+        ),
+        searchValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => onSearchChange(""),
+            "aria-label": labels.header.clearSearch,
+            className: "absolute top-1/2 right-1 flex size-7 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: "close", className: "size-3.5" })
+          }
+        ) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: "shrink-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sr-only", children: labels.header.quickFilters }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "select",
+          {
+            id: quickId,
+            value: query.quick,
+            onChange: (event) => onQuick(event.target.value),
+            className: "h-9 w-20 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto",
+            children: import_contracts.QUICK_FILTERS.map((quick) => {
+              const count = counts?.[quick];
+              return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: quick, children: count !== void 0 ? `${labels.quick[quick]} (${count})` : labels.quick[quick] }, quick);
+            })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: "shrink-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sr-only", children: labels.header.sortLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "select",
+          {
+            id: sortId,
+            value: query.sort,
+            onChange: (event) => onSort(event.target.value),
+            className: "h-9 w-24 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto",
+            children: sortOptions.map((sort) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: sort, children: labels.header.sort[sort] }, sort))
+          }
+        )
+      ] }),
+      viewsEnabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_toolbar_button.ToolbarButton,
+        {
+          size: "sm",
+          className: "hidden md:inline-flex",
+          onClick: () => onPresentation(presentation === "cards" ? "table" : "cards"),
+          children: presentation === "cards" ? labels.header.viewTable : labels.header.viewCards
+        }
+      ) : null,
+      viewsEnabled && presentation === "table" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_toolbar_button.ToolbarButton,
+        {
+          size: "sm",
+          className: "hidden md:inline-flex",
+          "aria-expanded": columnsOpen,
+          onClick: () => setColumnsOpen((open) => !open),
+          children: labels.header.columns
+        }
+      ) : null
+    ] }),
+    columnsOpen && presentation === "table" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-xl border bg-card p-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-medium text-muted-foreground", children: labels.header.columns }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-2 grid grid-cols-2 gap-1 sm:grid-cols-3", children: import_contracts.ALL_COLUMNS.map((column) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "label",
+        {
+          className: "flex min-w-0 items-center gap-2 text-sm text-muted-foreground",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "input",
+              {
+                type: "checkbox",
+                checked: columns.includes(column),
+                disabled: column === "order",
+                onChange: () => onToggleColumn(column),
+                className: "size-4 shrink-0 rounded border-input accent-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "min-w-0 truncate", children: labels.table.columns[column] })
+          ]
+        },
+        column
+      )) })
+    ] }) : null
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Controls
+});
+//# sourceMappingURL=controls.js.map

package/dist/blocks/designs/order-history/components/controls.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/order-history/components/controls.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { cn } from '@thorprovider/blocks'\n\nimport type {\n  OrderHistoryCapabilities,\n  OrderHistoryLabels,\n  OrdersQuery,\n  Presentation,\n  QuickFilterId,\n  SortId,\n  TableColumnId,\n} from '../contracts'\nimport { ALL_COLUMNS, QUICK_FILTERS } from '../contracts'\nimport { Icon } from './icons'\nimport { ToolbarButton } from './toolbar-button'\n\ntype ControlsProps = {\n  query: OrdersQuery\n  searchValue: string\n  labels: OrderHistoryLabels\n  capabilities: OrderHistoryCapabilities\n  counts?: Record<QuickFilterId, number>\n  columns: TableColumnId[]\n  presentation: Presentation\n  sortOptions: SortId[]\n  onSearchChange: (value: string) => void\n  onQuick: (quick: QuickFilterId) => void\n  onSort: (sort: SortId) => void\n  onPresentation: (presentation: Presentation) => void\n  onToggleColumn: (column: TableColumnId) => void\n}\n\n/**\n * One toolbar row: search, the quick-filter select and sort. The filter is a\n * select rather than a strip of pills so the row never needs a second line;\n * counts travel in the option labels. The view switch only appears from `md`,\n * where the table exists (below it the surface always renders cards).\n */\nexport function Controls({\n  query,\n  searchValue,\n  labels,\n  capabilities,\n  counts,\n  columns,\n  presentation,\n  sortOptions,\n  onSearchChange,\n  onQuick,\n  onSort,\n  onPresentation,\n  onToggleColumn,\n}: ControlsProps) {\n  const viewsEnabled = capabilities.tableView === true\n  const searchId = useId()\n  const quickId = useId()\n  const sortId = useId()\n  const [columnsOpen, setColumnsOpen] = useState(false)\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex flex-wrap items-center gap-2\">\n        <div className=\"relative min-w-16 flex-1\">\n          <label htmlFor={searchId} className=\"sr-only\">\n            {labels.header.searchLabel}\n          </label>\n          <span\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute top-1/2 left-2.5 -translate-y-1/2 text-muted-foreground\"\n          >\n            <Icon name=\"search\" className=\"size-4\" />\n          </span>\n          <input\n            id={searchId}\n            type=\"search\"\n            value={searchValue}\n            placeholder={labels.header.searchPlaceholder}\n            onChange={(event) => onSearchChange(event.target.value)}\n            onKeyDown={(event) => {\n              if (event.key === 'Escape') onSearchChange('')\n            }}\n            className={cn(\n              'h-9 w-full min-w-0 rounded-md border border-input bg-background pl-7 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',\n              searchValue ? 'pr-8' : 'pr-2',\n            )}\n          />\n          {searchValue ? (\n            <button\n              type=\"button\"\n              onClick={() => onSearchChange('')}\n              aria-label={labels.header.clearSearch}\n              className=\"absolute top-1/2 right-1 flex size-7 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n            >\n              <Icon name=\"close\" className=\"size-3.5\" />\n            </button>\n          ) : null}\n        </div>\n\n        <label className=\"shrink-0\">\n          <span className=\"sr-only\">{labels.header.quickFilters}</span>\n          <select\n            id={quickId}\n            value={query.quick}\n            onChange={(event) => onQuick(event.target.value as QuickFilterId)}\n            className=\"h-9 w-20 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto\"\n          >\n            {QUICK_FILTERS.map((quick) => {\n              const count = counts?.[quick]\n              return (\n                <option key={quick} value={quick}>\n                  {count !== undefined\n                    ? `${labels.quick[quick]} (${count})`\n                    : labels.quick[quick]}\n                </option>\n              )\n            })}\n          </select>\n        </label>\n\n        <label className=\"shrink-0\">\n          <span className=\"sr-only\">{labels.header.sortLabel}</span>\n          <select\n            id={sortId}\n            value={query.sort}\n            onChange={(event) => onSort(event.target.value as SortId)}\n            className=\"h-9 w-24 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto\"\n          >\n            {sortOptions.map((sort) => (\n              <option key={sort} value={sort}>\n                {labels.header.sort[sort]}\n              </option>\n            ))}\n          </select>\n        </label>\n\n        {viewsEnabled ? (\n          <ToolbarButton\n            size=\"sm\"\n            className=\"hidden md:inline-flex\"\n            onClick={() => onPresentation(presentation === 'cards' ? 'table' : 'cards')}\n          >\n            {presentation === 'cards' ? labels.header.viewTable : labels.header.viewCards}\n          </ToolbarButton>\n        ) : null}\n\n        {viewsEnabled && presentation === 'table' ? (\n          <ToolbarButton\n            size=\"sm\"\n            className=\"hidden md:inline-flex\"\n            aria-expanded={columnsOpen}\n            onClick={() => setColumnsOpen((open) => !open)}\n          >\n            {labels.header.columns}\n          </ToolbarButton>\n        ) : null}\n      </div>\n\n      {columnsOpen && presentation === 'table' ? (\n        <div className=\"rounded-xl border bg-card p-3\">\n          <p className=\"text-xs font-medium text-muted-foreground\">{labels.header.columns}</p>\n          <div className=\"mt-2 grid grid-cols-2 gap-1 sm:grid-cols-3\">\n            {ALL_COLUMNS.map((column) => (\n              <label\n                key={column}\n                className=\"flex min-w-0 items-center gap-2 text-sm text-muted-foreground\"\n              >\n                <input\n                  type=\"checkbox\"\n                  checked={columns.includes(column)}\n                  disabled={column === 'order'}\n                  onChange={() => onToggleColumn(column)}\n                  className=\"size-4 shrink-0 rounded border-input accent-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n                />\n                <span className=\"min-w-0 truncate\">{labels.table.columns[column]}</span>\n              </label>\n            ))}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA8DQ;AA9DR,mBAAgC;AAChC,oBAAmB;AAWnB,uBAA2C;AAC3C,mBAAqB;AACrB,4BAA8B;AAwBvB,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAkB;AAChB,QAAM,eAAe,aAAa,cAAc;AAChD,QAAM,eAAW,oBAAM;AACvB,QAAM,cAAU,oBAAM;AACtB,QAAM,aAAS,oBAAM;AACrB,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,SACE,6CAAC,SAAI,WAAU,aACb;AAAA,iDAAC,SAAI,WAAU,qCACb;AAAA,mDAAC,SAAI,WAAU,4BACb;AAAA,oDAAC,WAAM,SAAS,UAAU,WAAU,WACjC,iBAAO,OAAO,aACjB;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,WAAU;AAAA,YAEV,sDAAC,qBAAK,MAAK,UAAS,WAAU,UAAS;AAAA;AAAA,QACzC;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,MAAK;AAAA,YACL,OAAO;AAAA,YACP,aAAa,OAAO,OAAO;AAAA,YAC3B,UAAU,CAAC,UAAU,eAAe,MAAM,OAAO,KAAK;AAAA,YACtD,WAAW,CAAC,UAAU;AACpB,kBAAI,MAAM,QAAQ,SAAU,gBAAe,EAAE;AAAA,YAC/C;AAAA,YACA,eAAW;AAAA,cACT;AAAA,cACA,cAAc,SAAS;AAAA,YACzB;AAAA;AAAA,QACF;AAAA,QACC,cACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM,eAAe,EAAE;AAAA,YAChC,cAAY,OAAO,OAAO;AAAA,YAC1B,WAAU;AAAA,YAEV,sDAAC,qBAAK,MAAK,SAAQ,WAAU,YAAW;AAAA;AAAA,QAC1C,IACE;AAAA,SACN;AAAA,MAEA,6CAAC,WAAM,WAAU,YACf;AAAA,oDAAC,UAAK,WAAU,WAAW,iBAAO,OAAO,cAAa;AAAA,QACtD;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,OAAO,MAAM;AAAA,YACb,UAAU,CAAC,UAAU,QAAQ,MAAM,OAAO,KAAsB;AAAA,YAChE,WAAU;AAAA,YAET,yCAAc,IAAI,CAAC,UAAU;AAC5B,oBAAM,QAAQ,SAAS,KAAK;AAC5B,qBACE,4CAAC,YAAmB,OAAO,OACxB,oBAAU,SACP,GAAG,OAAO,MAAM,KAAK,CAAC,KAAK,KAAK,MAChC,OAAO,MAAM,KAAK,KAHX,KAIb;AAAA,YAEJ,CAAC;AAAA;AAAA,QACH;AAAA,SACF;AAAA,MAEA,6CAAC,WAAM,WAAU,YACf;AAAA,oDAAC,UAAK,WAAU,WAAW,iBAAO,OAAO,WAAU;AAAA,QACnD;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,OAAO,MAAM;AAAA,YACb,UAAU,CAAC,UAAU,OAAO,MAAM,OAAO,KAAe;AAAA,YACxD,WAAU;AAAA,YAET,sBAAY,IAAI,CAAC,SAChB,4CAAC,YAAkB,OAAO,MACvB,iBAAO,OAAO,KAAK,IAAI,KADb,IAEb,CACD;AAAA;AAAA,QACH;AAAA,SACF;AAAA,MAEC,eACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,MAAM,eAAe,iBAAiB,UAAU,UAAU,OAAO;AAAA,UAEzE,2BAAiB,UAAU,OAAO,OAAO,YAAY,OAAO,OAAO;AAAA;AAAA,MACtE,IACE;AAAA,MAEH,gBAAgB,iBAAiB,UAChC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,iBAAe;AAAA,UACf,SAAS,MAAM,eAAe,CAAC,SAAS,CAAC,IAAI;AAAA,UAE5C,iBAAO,OAAO;AAAA;AAAA,MACjB,IACE;AAAA,OACN;AAAA,IAEC,eAAe,iBAAiB,UAC/B,6CAAC,SAAI,WAAU,iCACb;AAAA,kDAAC,OAAE,WAAU,6CAA6C,iBAAO,OAAO,SAAQ;AAAA,MAChF,4CAAC,SAAI,WAAU,8CACZ,uCAAY,IAAI,CAAC,WAChB;AAAA,QAAC;AAAA;AAAA,UAEC,WAAU;AAAA,UAEV;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS,QAAQ,SAAS,MAAM;AAAA,gBAChC,UAAU,WAAW;AAAA,gBACrB,UAAU,MAAM,eAAe,MAAM;AAAA,gBACrC,WAAU;AAAA;AAAA,YACZ;AAAA,YACA,4CAAC,UAAK,WAAU,oBAAoB,iBAAO,MAAM,QAAQ,MAAM,GAAE;AAAA;AAAA;AAAA,QAV5D;AAAA,MAWP,CACD,GACH;AAAA,OACF,IACE;AAAA,KACN;AAEJ;","names":[]}

package/dist/blocks/designs/order-history/components/controls.mjs

@@ -0,0 +1,144 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId, useState } from "react";
+import { cn } from "@thorprovider/blocks";
+import { ALL_COLUMNS, QUICK_FILTERS } from "../contracts.mjs";
+import { Icon } from "./icons.mjs";
+import { ToolbarButton } from "./toolbar-button.mjs";
+function Controls({
+  query,
+  searchValue,
+  labels,
+  capabilities,
+  counts,
+  columns,
+  presentation,
+  sortOptions,
+  onSearchChange,
+  onQuick,
+  onSort,
+  onPresentation,
+  onToggleColumn
+}) {
+  const viewsEnabled = capabilities.tableView === true;
+  const searchId = useId();
+  const quickId = useId();
+  const sortId = useId();
+  const [columnsOpen, setColumnsOpen] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative min-w-16 flex-1", children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: searchId, className: "sr-only", children: labels.header.searchLabel }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute top-1/2 left-2.5 -translate-y-1/2 text-muted-foreground",
+            children: /* @__PURE__ */ jsx(Icon, { name: "search", className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            id: searchId,
+            type: "search",
+            value: searchValue,
+            placeholder: labels.header.searchPlaceholder,
+            onChange: (event) => onSearchChange(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Escape") onSearchChange("");
+            },
+            className: cn(
+              "h-9 w-full min-w-0 rounded-md border border-input bg-background pl-7 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+              searchValue ? "pr-8" : "pr-2"
+            )
+          }
+        ),
+        searchValue ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => onSearchChange(""),
+            "aria-label": labels.header.clearSearch,
+            className: "absolute top-1/2 right-1 flex size-7 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+            children: /* @__PURE__ */ jsx(Icon, { name: "close", className: "size-3.5" })
+          }
+        ) : null
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "shrink-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: labels.header.quickFilters }),
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            id: quickId,
+            value: query.quick,
+            onChange: (event) => onQuick(event.target.value),
+            className: "h-9 w-20 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto",
+            children: QUICK_FILTERS.map((quick) => {
+              const count = counts?.[quick];
+              return /* @__PURE__ */ jsx("option", { value: quick, children: count !== void 0 ? `${labels.quick[quick]} (${count})` : labels.quick[quick] }, quick);
+            })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "shrink-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: labels.header.sortLabel }),
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            id: sortId,
+            value: query.sort,
+            onChange: (event) => onSort(event.target.value),
+            className: "h-9 w-24 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto",
+            children: sortOptions.map((sort) => /* @__PURE__ */ jsx("option", { value: sort, children: labels.header.sort[sort] }, sort))
+          }
+        )
+      ] }),
+      viewsEnabled ? /* @__PURE__ */ jsx(
+        ToolbarButton,
+        {
+          size: "sm",
+          className: "hidden md:inline-flex",
+          onClick: () => onPresentation(presentation === "cards" ? "table" : "cards"),
+          children: presentation === "cards" ? labels.header.viewTable : labels.header.viewCards
+        }
+      ) : null,
+      viewsEnabled && presentation === "table" ? /* @__PURE__ */ jsx(
+        ToolbarButton,
+        {
+          size: "sm",
+          className: "hidden md:inline-flex",
+          "aria-expanded": columnsOpen,
+          onClick: () => setColumnsOpen((open) => !open),
+          children: labels.header.columns
+        }
+      ) : null
+    ] }),
+    columnsOpen && presentation === "table" ? /* @__PURE__ */ jsxs("div", { className: "rounded-xl border bg-card p-3", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground", children: labels.header.columns }),
+      /* @__PURE__ */ jsx("div", { className: "mt-2 grid grid-cols-2 gap-1 sm:grid-cols-3", children: ALL_COLUMNS.map((column) => /* @__PURE__ */ jsxs(
+        "label",
+        {
+          className: "flex min-w-0 items-center gap-2 text-sm text-muted-foreground",
+          children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "checkbox",
+                checked: columns.includes(column),
+                disabled: column === "order",
+                onChange: () => onToggleColumn(column),
+                className: "size-4 shrink-0 rounded border-input accent-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: labels.table.columns[column] })
+          ]
+        },
+        column
+      )) })
+    ] }) : null
+  ] });
+}
+export {
+  Controls
+};
+//# sourceMappingURL=controls.mjs.map

package/dist/blocks/designs/order-history/components/controls.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/order-history/components/controls.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { cn } from '@thorprovider/blocks'\n\nimport type {\n  OrderHistoryCapabilities,\n  OrderHistoryLabels,\n  OrdersQuery,\n  Presentation,\n  QuickFilterId,\n  SortId,\n  TableColumnId,\n} from '../contracts'\nimport { ALL_COLUMNS, QUICK_FILTERS } from '../contracts'\nimport { Icon } from './icons'\nimport { ToolbarButton } from './toolbar-button'\n\ntype ControlsProps = {\n  query: OrdersQuery\n  searchValue: string\n  labels: OrderHistoryLabels\n  capabilities: OrderHistoryCapabilities\n  counts?: Record<QuickFilterId, number>\n  columns: TableColumnId[]\n  presentation: Presentation\n  sortOptions: SortId[]\n  onSearchChange: (value: string) => void\n  onQuick: (quick: QuickFilterId) => void\n  onSort: (sort: SortId) => void\n  onPresentation: (presentation: Presentation) => void\n  onToggleColumn: (column: TableColumnId) => void\n}\n\n/**\n * One toolbar row: search, the quick-filter select and sort. The filter is a\n * select rather than a strip of pills so the row never needs a second line;\n * counts travel in the option labels. The view switch only appears from `md`,\n * where the table exists (below it the surface always renders cards).\n */\nexport function Controls({\n  query,\n  searchValue,\n  labels,\n  capabilities,\n  counts,\n  columns,\n  presentation,\n  sortOptions,\n  onSearchChange,\n  onQuick,\n  onSort,\n  onPresentation,\n  onToggleColumn,\n}: ControlsProps) {\n  const viewsEnabled = capabilities.tableView === true\n  const searchId = useId()\n  const quickId = useId()\n  const sortId = useId()\n  const [columnsOpen, setColumnsOpen] = useState(false)\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex flex-wrap items-center gap-2\">\n        <div className=\"relative min-w-16 flex-1\">\n          <label htmlFor={searchId} className=\"sr-only\">\n            {labels.header.searchLabel}\n          </label>\n          <span\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute top-1/2 left-2.5 -translate-y-1/2 text-muted-foreground\"\n          >\n            <Icon name=\"search\" className=\"size-4\" />\n          </span>\n          <input\n            id={searchId}\n            type=\"search\"\n            value={searchValue}\n            placeholder={labels.header.searchPlaceholder}\n            onChange={(event) => onSearchChange(event.target.value)}\n            onKeyDown={(event) => {\n              if (event.key === 'Escape') onSearchChange('')\n            }}\n            className={cn(\n              'h-9 w-full min-w-0 rounded-md border border-input bg-background pl-7 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',\n              searchValue ? 'pr-8' : 'pr-2',\n            )}\n          />\n          {searchValue ? (\n            <button\n              type=\"button\"\n              onClick={() => onSearchChange('')}\n              aria-label={labels.header.clearSearch}\n              className=\"absolute top-1/2 right-1 flex size-7 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground hover:bg-muted focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n            >\n              <Icon name=\"close\" className=\"size-3.5\" />\n            </button>\n          ) : null}\n        </div>\n\n        <label className=\"shrink-0\">\n          <span className=\"sr-only\">{labels.header.quickFilters}</span>\n          <select\n            id={quickId}\n            value={query.quick}\n            onChange={(event) => onQuick(event.target.value as QuickFilterId)}\n            className=\"h-9 w-20 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto\"\n          >\n            {QUICK_FILTERS.map((quick) => {\n              const count = counts?.[quick]\n              return (\n                <option key={quick} value={quick}>\n                  {count !== undefined\n                    ? `${labels.quick[quick]} (${count})`\n                    : labels.quick[quick]}\n                </option>\n              )\n            })}\n          </select>\n        </label>\n\n        <label className=\"shrink-0\">\n          <span className=\"sr-only\">{labels.header.sortLabel}</span>\n          <select\n            id={sortId}\n            value={query.sort}\n            onChange={(event) => onSort(event.target.value as SortId)}\n            className=\"h-9 w-24 rounded-md border border-input bg-background px-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring sm:w-auto\"\n          >\n            {sortOptions.map((sort) => (\n              <option key={sort} value={sort}>\n                {labels.header.sort[sort]}\n              </option>\n            ))}\n          </select>\n        </label>\n\n        {viewsEnabled ? (\n          <ToolbarButton\n            size=\"sm\"\n            className=\"hidden md:inline-flex\"\n            onClick={() => onPresentation(presentation === 'cards' ? 'table' : 'cards')}\n          >\n            {presentation === 'cards' ? labels.header.viewTable : labels.header.viewCards}\n          </ToolbarButton>\n        ) : null}\n\n        {viewsEnabled && presentation === 'table' ? (\n          <ToolbarButton\n            size=\"sm\"\n            className=\"hidden md:inline-flex\"\n            aria-expanded={columnsOpen}\n            onClick={() => setColumnsOpen((open) => !open)}\n          >\n            {labels.header.columns}\n          </ToolbarButton>\n        ) : null}\n      </div>\n\n      {columnsOpen && presentation === 'table' ? (\n        <div className=\"rounded-xl border bg-card p-3\">\n          <p className=\"text-xs font-medium text-muted-foreground\">{labels.header.columns}</p>\n          <div className=\"mt-2 grid grid-cols-2 gap-1 sm:grid-cols-3\">\n            {ALL_COLUMNS.map((column) => (\n              <label\n                key={column}\n                className=\"flex min-w-0 items-center gap-2 text-sm text-muted-foreground\"\n              >\n                <input\n                  type=\"checkbox\"\n                  checked={columns.includes(column)}\n                  disabled={column === 'order'}\n                  onChange={() => onToggleColumn(column)}\n                  className=\"size-4 shrink-0 rounded border-input accent-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n                />\n                <span className=\"min-w-0 truncate\">{labels.table.columns[column]}</span>\n              </label>\n            ))}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/blocks/designs/order-history/components/feedback.d.ts

@@ -0,0 +1,30 @@
+import type { OrderHistoryLabels, Presentation } from '../contracts';
+type StatesLabels = OrderHistoryLabels['states'];
+type SkeletonProps = {
+    presentation: Presentation;
+    rows?: number;
+    labels: StatesLabels;
+};
+/** Reserves the result shape while the first page loads. */
+export declare function ResultsSkeleton({ presentation, rows, labels }: SkeletonProps): import("react").JSX.Element;
+type EmptyStateProps = {
+    kind: 'empty' | 'no-results';
+    labels: StatesLabels;
+    clearLabel?: string;
+    onClear?: () => void;
+};
+export declare function EmptyState({ kind, labels, clearLabel, onClear }: EmptyStateProps): import("react").JSX.Element;
+type ErrorStateProps = {
+    labels: StatesLabels;
+    onRetry: () => void;
+};
+export declare function ErrorState({ labels, onRetry }: ErrorStateProps): import("react").JSX.Element;
+export declare function PartialNotice({ labels, className }: {
+    labels: StatesLabels;
+    className?: string;
+}): import("react").JSX.Element;
+export declare function ForbiddenState({ labels }: {
+    labels: StatesLabels;
+}): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=feedback.d.ts.map

package/dist/blocks/designs/order-history/components/feedback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"feedback.d.ts","sourceRoot":"","sources":["../../../../../src/blocks/designs/order-history/components/feedback.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAIpE,KAAK,YAAY,GAAG,kBAAkB,CAAC,QAAQ,CAAC,CAAA;AAEhD,KAAK,aAAa,GAAG;IACnB,YAAY,EAAE,YAAY,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,YAAY,CAAA;CACrB,CAAA;AAED,4DAA4D;AAC5D,wBAAgB,eAAe,CAAC,EAAE,YAAY,EAAE,IAAQ,EAAE,MAAM,EAAE,EAAE,aAAa,+BAgChF;AAED,KAAK,eAAe,GAAG;IACrB,IAAI,EAAE,OAAO,GAAG,YAAY,CAAA;IAC5B,MAAM,EAAE,YAAY,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA;AAED,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,eAAe,+BAiBhF;AAED,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,YAAY,CAAA;IACpB,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,eAAe,+BAc9D;AAED,wBAAgB,aAAa,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAYhG;AAED,wBAAgB,cAAc,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,YAAY,CAAA;CAAE,+BAUlE"}

package/dist/blocks/designs/order-history/components/feedback.js

@@ -0,0 +1,107 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var feedback_exports = {};
+__export(feedback_exports, {
+  EmptyState: () => EmptyState,
+  ErrorState: () => ErrorState,
+  ForbiddenState: () => ForbiddenState,
+  PartialNotice: () => PartialNotice,
+  ResultsSkeleton: () => ResultsSkeleton
+});
+module.exports = __toCommonJS(feedback_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_blocks = require("@thorprovider/blocks");
+var import_icons = require("./icons.js");
+var import_toolbar_button = require("./toolbar-button.js");
+function ResultsSkeleton({ presentation, rows = 3, labels }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { "aria-busy": "true", className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { role: "status", className: "sr-only", children: labels.loading }),
+    Array.from(
+      { length: rows },
+      (_, index) => presentation === "table" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-12 animate-pulse rounded-lg border bg-muted/60" }, index) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3 rounded-xl border bg-card p-3.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-3 w-28 animate-pulse rounded bg-muted" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-2.5 w-20 animate-pulse rounded bg-muted" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-5 w-24 animate-pulse rounded-full bg-muted" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "size-10 animate-pulse rounded-lg bg-muted" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "size-10 animate-pulse rounded-lg bg-muted" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-3 w-32 animate-pulse rounded bg-muted" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 border-t pt-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-4 w-20 animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-8 w-28 animate-pulse rounded-md bg-muted" })
+        ] })
+      ] }, index)
+    )
+  ] });
+}
+function EmptyState({ kind, labels, clearLabel, onClear }) {
+  const title = kind === "empty" ? labels.emptyTitle : labels.noResultsTitle;
+  const body = kind === "empty" ? labels.emptyBody : labels.noResultsBody;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-secondary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: kind === "empty" ? "box" : "search", className: "size-5" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "text-sm font-medium", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "max-w-sm text-sm text-muted-foreground", children: body }),
+    kind === "no-results" && onClear ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_toolbar_button.ToolbarButton, { size: "sm", onClick: onClear, children: clearLabel }) : null
+  ] });
+}
+function ErrorState({ labels, onRetry }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { role: "alert", className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-destructive", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: "alert", className: "size-5" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "text-sm font-medium", children: labels.errorTitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "max-w-sm text-sm text-muted-foreground", children: labels.errorBody }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_toolbar_button.ToolbarButton, { size: "sm", onClick: onRetry, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: "refresh", className: "size-4" }),
+      labels.retry
+    ] })
+  ] });
+}
+function PartialNotice({ labels, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "p",
+    {
+      role: "status",
+      className: (0, import_blocks.cn)(
+        "rounded-lg border border-warning/40 bg-muted/40 px-3 py-2 text-xs text-muted-foreground",
+        className
+      ),
+      children: labels.partial
+    }
+  );
+}
+function ForbiddenState({ labels }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.Icon, { name: "alert", className: "size-5" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "text-sm font-medium", children: labels.forbiddenTitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "max-w-sm text-sm text-muted-foreground", children: labels.forbiddenBody })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  EmptyState,
+  ErrorState,
+  ForbiddenState,
+  PartialNotice,
+  ResultsSkeleton
+});
+//# sourceMappingURL=feedback.js.map

package/dist/blocks/designs/order-history/components/feedback.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/order-history/components/feedback.tsx"],"sourcesContent":["import { cn } from '@thorprovider/blocks'\n\nimport type { OrderHistoryLabels, Presentation } from '../contracts'\nimport { Icon } from './icons'\nimport { ToolbarButton } from './toolbar-button'\n\ntype StatesLabels = OrderHistoryLabels['states']\n\ntype SkeletonProps = {\n  presentation: Presentation\n  rows?: number\n  labels: StatesLabels\n}\n\n/** Reserves the result shape while the first page loads. */\nexport function ResultsSkeleton({ presentation, rows = 3, labels }: SkeletonProps) {\n  return (\n    <div aria-busy=\"true\" className=\"space-y-3\">\n      <p role=\"status\" className=\"sr-only\">\n        {labels.loading}\n      </p>\n      {Array.from({ length: rows }, (_, index) =>\n        presentation === 'table' ? (\n          <div key={index} className=\"h-12 animate-pulse rounded-lg border bg-muted/60\" />\n        ) : (\n          <div key={index} className=\"space-y-3 rounded-xl border bg-card p-3.5\">\n            <div className=\"flex items-center justify-between gap-3\">\n              <div className=\"space-y-2\">\n                <div className=\"h-3 w-28 animate-pulse rounded bg-muted\" />\n                <div className=\"h-2.5 w-20 animate-pulse rounded bg-muted\" />\n              </div>\n              <div className=\"h-5 w-24 animate-pulse rounded-full bg-muted\" />\n            </div>\n            <div className=\"flex items-center gap-3\">\n              <div className=\"size-10 animate-pulse rounded-lg bg-muted\" />\n              <div className=\"size-10 animate-pulse rounded-lg bg-muted\" />\n              <div className=\"h-3 w-32 animate-pulse rounded bg-muted\" />\n            </div>\n            <div className=\"flex items-center justify-between gap-3 border-t pt-3\">\n              <div className=\"h-4 w-20 animate-pulse rounded bg-muted\" />\n              <div className=\"h-8 w-28 animate-pulse rounded-md bg-muted\" />\n            </div>\n          </div>\n        ),\n      )}\n    </div>\n  )\n}\n\ntype EmptyStateProps = {\n  kind: 'empty' | 'no-results'\n  labels: StatesLabels\n  clearLabel?: string\n  onClear?: () => void\n}\n\nexport function EmptyState({ kind, labels, clearLabel, onClear }: EmptyStateProps) {\n  const title = kind === 'empty' ? labels.emptyTitle : labels.noResultsTitle\n  const body = kind === 'empty' ? labels.emptyBody : labels.noResultsBody\n  return (\n    <div className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-secondary-foreground\">\n        <Icon name={kind === 'empty' ? 'box' : 'search'} className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{title}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{body}</p>\n      {kind === 'no-results' && onClear ? (\n        <ToolbarButton size=\"sm\" onClick={onClear}>\n          {clearLabel}\n        </ToolbarButton>\n      ) : null}\n    </div>\n  )\n}\n\ntype ErrorStateProps = {\n  labels: StatesLabels\n  onRetry: () => void\n}\n\nexport function ErrorState({ labels, onRetry }: ErrorStateProps) {\n  return (\n    <div role=\"alert\" className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-destructive\">\n        <Icon name=\"alert\" className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{labels.errorTitle}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{labels.errorBody}</p>\n      <ToolbarButton size=\"sm\" onClick={onRetry}>\n        <Icon name=\"refresh\" className=\"size-4\" />\n        {labels.retry}\n      </ToolbarButton>\n    </div>\n  )\n}\n\nexport function PartialNotice({ labels, className }: { labels: StatesLabels; className?: string }) {\n  return (\n    <p\n      role=\"status\"\n      className={cn(\n        'rounded-lg border border-warning/40 bg-muted/40 px-3 py-2 text-xs text-muted-foreground',\n        className,\n      )}\n    >\n      {labels.partial}\n    </p>\n  )\n}\n\nexport function ForbiddenState({ labels }: { labels: StatesLabels }) {\n  return (\n    <div className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-muted-foreground\">\n        <Icon name=\"alert\" className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{labels.forbiddenTitle}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{labels.forbiddenBody}</p>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBM;AAlBN,oBAAmB;AAGnB,mBAAqB;AACrB,4BAA8B;AAWvB,SAAS,gBAAgB,EAAE,cAAc,OAAO,GAAG,OAAO,GAAkB;AACjF,SACE,6CAAC,SAAI,aAAU,QAAO,WAAU,aAC9B;AAAA,gDAAC,OAAE,MAAK,UAAS,WAAU,WACxB,iBAAO,SACV;AAAA,IACC,MAAM;AAAA,MAAK,EAAE,QAAQ,KAAK;AAAA,MAAG,CAAC,GAAG,UAChC,iBAAiB,UACf,4CAAC,SAAgB,WAAU,sDAAjB,KAAoE,IAE9E,6CAAC,SAAgB,WAAU,6CACzB;AAAA,qDAAC,SAAI,WAAU,2CACb;AAAA,uDAAC,SAAI,WAAU,aACb;AAAA,wDAAC,SAAI,WAAU,2CAA0C;AAAA,YACzD,4CAAC,SAAI,WAAU,6CAA4C;AAAA,aAC7D;AAAA,UACA,4CAAC,SAAI,WAAU,gDAA+C;AAAA,WAChE;AAAA,QACA,6CAAC,SAAI,WAAU,2BACb;AAAA,sDAAC,SAAI,WAAU,6CAA4C;AAAA,UAC3D,4CAAC,SAAI,WAAU,6CAA4C;AAAA,UAC3D,4CAAC,SAAI,WAAU,2CAA0C;AAAA,WAC3D;AAAA,QACA,6CAAC,SAAI,WAAU,yDACb;AAAA,sDAAC,SAAI,WAAU,2CAA0C;AAAA,UACzD,4CAAC,SAAI,WAAU,8CAA6C;AAAA,WAC9D;AAAA,WAhBQ,KAiBV;AAAA,IAEJ;AAAA,KACF;AAEJ;AASO,SAAS,WAAW,EAAE,MAAM,QAAQ,YAAY,QAAQ,GAAoB;AACjF,QAAM,QAAQ,SAAS,UAAU,OAAO,aAAa,OAAO;AAC5D,QAAM,OAAO,SAAS,UAAU,OAAO,YAAY,OAAO;AAC1D,SACE,6CAAC,SAAI,WAAU,qFACb;AAAA,gDAAC,UAAK,WAAU,gGACd,sDAAC,qBAAK,MAAM,SAAS,UAAU,QAAQ,UAAU,WAAU,UAAS,GACtE;AAAA,IACA,4CAAC,QAAG,WAAU,uBAAuB,iBAAM;AAAA,IAC3C,4CAAC,OAAE,WAAU,0CAA0C,gBAAK;AAAA,IAC3D,SAAS,gBAAgB,UACxB,4CAAC,uCAAc,MAAK,MAAK,SAAS,SAC/B,sBACH,IACE;AAAA,KACN;AAEJ;AAOO,SAAS,WAAW,EAAE,QAAQ,QAAQ,GAAoB;AAC/D,SACE,6CAAC,SAAI,MAAK,SAAQ,WAAU,qFAC1B;AAAA,gDAAC,UAAK,WAAU,uFACd,sDAAC,qBAAK,MAAK,SAAQ,WAAU,UAAS,GACxC;AAAA,IACA,4CAAC,QAAG,WAAU,uBAAuB,iBAAO,YAAW;AAAA,IACvD,4CAAC,OAAE,WAAU,0CAA0C,iBAAO,WAAU;AAAA,IACxE,6CAAC,uCAAc,MAAK,MAAK,SAAS,SAChC;AAAA,kDAAC,qBAAK,MAAK,WAAU,WAAU,UAAS;AAAA,MACvC,OAAO;AAAA,OACV;AAAA,KACF;AAEJ;AAEO,SAAS,cAAc,EAAE,QAAQ,UAAU,GAAiD;AACjG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,iBAAO;AAAA;AAAA,EACV;AAEJ;AAEO,SAAS,eAAe,EAAE,OAAO,GAA6B;AACnE,SACE,6CAAC,SAAI,WAAU,qFACb;AAAA,gDAAC,UAAK,WAAU,4FACd,sDAAC,qBAAK,MAAK,SAAQ,WAAU,UAAS,GACxC;AAAA,IACA,4CAAC,QAAG,WAAU,uBAAuB,iBAAO,gBAAe;AAAA,IAC3D,4CAAC,OAAE,WAAU,0CAA0C,iBAAO,eAAc;AAAA,KAC9E;AAEJ;","names":[]}

package/dist/blocks/designs/order-history/components/feedback.mjs

@@ -0,0 +1,79 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@thorprovider/blocks";
+import { Icon } from "./icons.mjs";
+import { ToolbarButton } from "./toolbar-button.mjs";
+function ResultsSkeleton({ presentation, rows = 3, labels }) {
+  return /* @__PURE__ */ jsxs("div", { "aria-busy": "true", className: "space-y-3", children: [
+    /* @__PURE__ */ jsx("p", { role: "status", className: "sr-only", children: labels.loading }),
+    Array.from(
+      { length: rows },
+      (_, index) => presentation === "table" ? /* @__PURE__ */ jsx("div", { className: "h-12 animate-pulse rounded-lg border bg-muted/60" }, index) : /* @__PURE__ */ jsxs("div", { className: "space-y-3 rounded-xl border bg-card p-3.5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx("div", { className: "h-3 w-28 animate-pulse rounded bg-muted" }),
+            /* @__PURE__ */ jsx("div", { className: "h-2.5 w-20 animate-pulse rounded bg-muted" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "h-5 w-24 animate-pulse rounded-full bg-muted" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx("div", { className: "size-10 animate-pulse rounded-lg bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "size-10 animate-pulse rounded-lg bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "h-3 w-32 animate-pulse rounded bg-muted" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-t pt-3", children: [
+          /* @__PURE__ */ jsx("div", { className: "h-4 w-20 animate-pulse rounded bg-muted" }),
+          /* @__PURE__ */ jsx("div", { className: "h-8 w-28 animate-pulse rounded-md bg-muted" })
+        ] })
+      ] }, index)
+    )
+  ] });
+}
+function EmptyState({ kind, labels, clearLabel, onClear }) {
+  const title = kind === "empty" ? labels.emptyTitle : labels.noResultsTitle;
+  const body = kind === "empty" ? labels.emptyBody : labels.noResultsBody;
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ jsx("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-secondary-foreground", children: /* @__PURE__ */ jsx(Icon, { name: kind === "empty" ? "box" : "search", className: "size-5" }) }),
+    /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium", children: title }),
+    /* @__PURE__ */ jsx("p", { className: "max-w-sm text-sm text-muted-foreground", children: body }),
+    kind === "no-results" && onClear ? /* @__PURE__ */ jsx(ToolbarButton, { size: "sm", onClick: onClear, children: clearLabel }) : null
+  ] });
+}
+function ErrorState({ labels, onRetry }) {
+  return /* @__PURE__ */ jsxs("div", { role: "alert", className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ jsx("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-destructive", children: /* @__PURE__ */ jsx(Icon, { name: "alert", className: "size-5" }) }),
+    /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium", children: labels.errorTitle }),
+    /* @__PURE__ */ jsx("p", { className: "max-w-sm text-sm text-muted-foreground", children: labels.errorBody }),
+    /* @__PURE__ */ jsxs(ToolbarButton, { size: "sm", onClick: onRetry, children: [
+      /* @__PURE__ */ jsx(Icon, { name: "refresh", className: "size-4" }),
+      labels.retry
+    ] })
+  ] });
+}
+function PartialNotice({ labels, className }) {
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      role: "status",
+      className: cn(
+        "rounded-lg border border-warning/40 bg-muted/40 px-3 py-2 text-xs text-muted-foreground",
+        className
+      ),
+      children: labels.partial
+    }
+  );
+}
+function ForbiddenState({ labels }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center", children: [
+    /* @__PURE__ */ jsx("span", { className: "flex size-11 items-center justify-center rounded-full bg-secondary text-muted-foreground", children: /* @__PURE__ */ jsx(Icon, { name: "alert", className: "size-5" }) }),
+    /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium", children: labels.forbiddenTitle }),
+    /* @__PURE__ */ jsx("p", { className: "max-w-sm text-sm text-muted-foreground", children: labels.forbiddenBody })
+  ] });
+}
+export {
+  EmptyState,
+  ErrorState,
+  ForbiddenState,
+  PartialNotice,
+  ResultsSkeleton
+};
+//# sourceMappingURL=feedback.mjs.map

package/dist/blocks/designs/order-history/components/feedback.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/order-history/components/feedback.tsx"],"sourcesContent":["import { cn } from '@thorprovider/blocks'\n\nimport type { OrderHistoryLabels, Presentation } from '../contracts'\nimport { Icon } from './icons'\nimport { ToolbarButton } from './toolbar-button'\n\ntype StatesLabels = OrderHistoryLabels['states']\n\ntype SkeletonProps = {\n  presentation: Presentation\n  rows?: number\n  labels: StatesLabels\n}\n\n/** Reserves the result shape while the first page loads. */\nexport function ResultsSkeleton({ presentation, rows = 3, labels }: SkeletonProps) {\n  return (\n    <div aria-busy=\"true\" className=\"space-y-3\">\n      <p role=\"status\" className=\"sr-only\">\n        {labels.loading}\n      </p>\n      {Array.from({ length: rows }, (_, index) =>\n        presentation === 'table' ? (\n          <div key={index} className=\"h-12 animate-pulse rounded-lg border bg-muted/60\" />\n        ) : (\n          <div key={index} className=\"space-y-3 rounded-xl border bg-card p-3.5\">\n            <div className=\"flex items-center justify-between gap-3\">\n              <div className=\"space-y-2\">\n                <div className=\"h-3 w-28 animate-pulse rounded bg-muted\" />\n                <div className=\"h-2.5 w-20 animate-pulse rounded bg-muted\" />\n              </div>\n              <div className=\"h-5 w-24 animate-pulse rounded-full bg-muted\" />\n            </div>\n            <div className=\"flex items-center gap-3\">\n              <div className=\"size-10 animate-pulse rounded-lg bg-muted\" />\n              <div className=\"size-10 animate-pulse rounded-lg bg-muted\" />\n              <div className=\"h-3 w-32 animate-pulse rounded bg-muted\" />\n            </div>\n            <div className=\"flex items-center justify-between gap-3 border-t pt-3\">\n              <div className=\"h-4 w-20 animate-pulse rounded bg-muted\" />\n              <div className=\"h-8 w-28 animate-pulse rounded-md bg-muted\" />\n            </div>\n          </div>\n        ),\n      )}\n    </div>\n  )\n}\n\ntype EmptyStateProps = {\n  kind: 'empty' | 'no-results'\n  labels: StatesLabels\n  clearLabel?: string\n  onClear?: () => void\n}\n\nexport function EmptyState({ kind, labels, clearLabel, onClear }: EmptyStateProps) {\n  const title = kind === 'empty' ? labels.emptyTitle : labels.noResultsTitle\n  const body = kind === 'empty' ? labels.emptyBody : labels.noResultsBody\n  return (\n    <div className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-secondary-foreground\">\n        <Icon name={kind === 'empty' ? 'box' : 'search'} className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{title}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{body}</p>\n      {kind === 'no-results' && onClear ? (\n        <ToolbarButton size=\"sm\" onClick={onClear}>\n          {clearLabel}\n        </ToolbarButton>\n      ) : null}\n    </div>\n  )\n}\n\ntype ErrorStateProps = {\n  labels: StatesLabels\n  onRetry: () => void\n}\n\nexport function ErrorState({ labels, onRetry }: ErrorStateProps) {\n  return (\n    <div role=\"alert\" className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-destructive\">\n        <Icon name=\"alert\" className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{labels.errorTitle}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{labels.errorBody}</p>\n      <ToolbarButton size=\"sm\" onClick={onRetry}>\n        <Icon name=\"refresh\" className=\"size-4\" />\n        {labels.retry}\n      </ToolbarButton>\n    </div>\n  )\n}\n\nexport function PartialNotice({ labels, className }: { labels: StatesLabels; className?: string }) {\n  return (\n    <p\n      role=\"status\"\n      className={cn(\n        'rounded-lg border border-warning/40 bg-muted/40 px-3 py-2 text-xs text-muted-foreground',\n        className,\n      )}\n    >\n      {labels.partial}\n    </p>\n  )\n}\n\nexport function ForbiddenState({ labels }: { labels: StatesLabels }) {\n  return (\n    <div className=\"flex flex-col items-center gap-3 rounded-xl border bg-card px-6 py-10 text-center\">\n      <span className=\"flex size-11 items-center justify-center rounded-full bg-secondary text-muted-foreground\">\n        <Icon name=\"alert\" className=\"size-5\" />\n      </span>\n      <h3 className=\"text-sm font-medium\">{labels.forbiddenTitle}</h3>\n      <p className=\"max-w-sm text-sm text-muted-foreground\">{labels.forbiddenBody}</p>\n    </div>\n  )\n}\n"],"mappings":"AAkBM,cASQ,YATR;AAlBN,SAAS,UAAU;AAGnB,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAWvB,SAAS,gBAAgB,EAAE,cAAc,OAAO,GAAG,OAAO,GAAkB;AACjF,SACE,qBAAC,SAAI,aAAU,QAAO,WAAU,aAC9B;AAAA,wBAAC,OAAE,MAAK,UAAS,WAAU,WACxB,iBAAO,SACV;AAAA,IACC,MAAM;AAAA,MAAK,EAAE,QAAQ,KAAK;AAAA,MAAG,CAAC,GAAG,UAChC,iBAAiB,UACf,oBAAC,SAAgB,WAAU,sDAAjB,KAAoE,IAE9E,qBAAC,SAAgB,WAAU,6CACzB;AAAA,6BAAC,SAAI,WAAU,2CACb;AAAA,+BAAC,SAAI,WAAU,aACb;AAAA,gCAAC,SAAI,WAAU,2CAA0C;AAAA,YACzD,oBAAC,SAAI,WAAU,6CAA4C;AAAA,aAC7D;AAAA,UACA,oBAAC,SAAI,WAAU,gDAA+C;AAAA,WAChE;AAAA,QACA,qBAAC,SAAI,WAAU,2BACb;AAAA,8BAAC,SAAI,WAAU,6CAA4C;AAAA,UAC3D,oBAAC,SAAI,WAAU,6CAA4C;AAAA,UAC3D,oBAAC,SAAI,WAAU,2CAA0C;AAAA,WAC3D;AAAA,QACA,qBAAC,SAAI,WAAU,yDACb;AAAA,8BAAC,SAAI,WAAU,2CAA0C;AAAA,UACzD,oBAAC,SAAI,WAAU,8CAA6C;AAAA,WAC9D;AAAA,WAhBQ,KAiBV;AAAA,IAEJ;AAAA,KACF;AAEJ;AASO,SAAS,WAAW,EAAE,MAAM,QAAQ,YAAY,QAAQ,GAAoB;AACjF,QAAM,QAAQ,SAAS,UAAU,OAAO,aAAa,OAAO;AAC5D,QAAM,OAAO,SAAS,UAAU,OAAO,YAAY,OAAO;AAC1D,SACE,qBAAC,SAAI,WAAU,qFACb;AAAA,wBAAC,UAAK,WAAU,gGACd,8BAAC,QAAK,MAAM,SAAS,UAAU,QAAQ,UAAU,WAAU,UAAS,GACtE;AAAA,IACA,oBAAC,QAAG,WAAU,uBAAuB,iBAAM;AAAA,IAC3C,oBAAC,OAAE,WAAU,0CAA0C,gBAAK;AAAA,IAC3D,SAAS,gBAAgB,UACxB,oBAAC,iBAAc,MAAK,MAAK,SAAS,SAC/B,sBACH,IACE;AAAA,KACN;AAEJ;AAOO,SAAS,WAAW,EAAE,QAAQ,QAAQ,GAAoB;AAC/D,SACE,qBAAC,SAAI,MAAK,SAAQ,WAAU,qFAC1B;AAAA,wBAAC,UAAK,WAAU,uFACd,8BAAC,QAAK,MAAK,SAAQ,WAAU,UAAS,GACxC;AAAA,IACA,oBAAC,QAAG,WAAU,uBAAuB,iBAAO,YAAW;AAAA,IACvD,oBAAC,OAAE,WAAU,0CAA0C,iBAAO,WAAU;AAAA,IACxE,qBAAC,iBAAc,MAAK,MAAK,SAAS,SAChC;AAAA,0BAAC,QAAK,MAAK,WAAU,WAAU,UAAS;AAAA,MACvC,OAAO;AAAA,OACV;AAAA,KACF;AAEJ;AAEO,SAAS,cAAc,EAAE,QAAQ,UAAU,GAAiD;AACjG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC,iBAAO;AAAA;AAAA,EACV;AAEJ;AAEO,SAAS,eAAe,EAAE,OAAO,GAA6B;AACnE,SACE,qBAAC,SAAI,WAAU,qFACb;AAAA,wBAAC,UAAK,WAAU,4FACd,8BAAC,QAAK,MAAK,SAAQ,WAAU,UAAS,GACxC;AAAA,IACA,oBAAC,QAAG,WAAU,uBAAuB,iBAAO,gBAAe;AAAA,IAC3D,oBAAC,OAAE,WAAU,0CAA0C,iBAAO,eAAc;AAAA,KAC9E;AAEJ;","names":[]}