@thorprovider/blocks 4.1.0 → 4.3.0

package/dist/blocks/designs/customer-favorites/components/favorite-list-detail.js

@@ -0,0 +1,142 @@
+"use strict";
+"use client";
+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 favorite_list_detail_exports = {};
+__export(favorite_list_detail_exports, {
+  FavoriteListDetail: () => FavoriteListDetail
+});
+module.exports = __toCommonJS(favorite_list_detail_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_blocks = require("@thorprovider/blocks");
+function AddToCartIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "svg",
+    {
+      "aria-hidden": "true",
+      viewBox: "0 0 24 24",
+      className: "size-4",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.8",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3 4h2l2.2 10.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L20 7H6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "9", cy: "20", r: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17", cy: "20", r: "1" })
+      ]
+    }
+  );
+}
+function FavoriteListDetail({
+  list,
+  count,
+  actions,
+  labels,
+  busy = false,
+  onAddAll,
+  onRename,
+  onDelete,
+  onShare
+}) {
+  const menuRef = (0, import_react.useRef)(null);
+  const closeMenu = () => menuRef.current?.removeAttribute("open");
+  const hasMenu = actions.share && onShare || actions.rename && onRename || actions.remove && onDelete;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-2 rounded-lg border border-border bg-card px-2.5 py-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "truncate text-sm font-semibold", children: list.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_blocks.Badge, { variant: "secondary", className: "shrink-0 text-[10px]", children: labels.demo.roles[list.role] }),
+        list.scope === "organization" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_blocks.Badge, { variant: "outline", className: "shrink-0 text-[10px]", children: labels.collections.organizationGroup }) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "truncate text-[11px] text-muted-foreground", children: [
+        labels.collections.count.replace("{count}", String(count)),
+        list.description ? ` \xB7 ${list.description}` : ""
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex shrink-0 items-center gap-1", children: [
+      onAddAll && count > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_blocks.Button,
+        {
+          type: "button",
+          size: "icon",
+          "aria-label": labels.cart.addAll,
+          onClick: onAddAll,
+          disabled: busy,
+          className: "size-9",
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AddToCartIcon, {})
+        }
+      ) : null,
+      hasMenu ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { ref: menuRef, className: "relative", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "summary",
+          {
+            "aria-label": labels.dialogs.listActions,
+            className: "flex size-9 cursor-pointer list-none items-center justify-center rounded-md border border-border bg-background text-muted-foreground hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none [&::-webkit-details-marker]:hidden",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "aria-hidden": "true", children: "\u22EF" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "absolute top-full right-0 z-20 mt-1 w-44 rounded-md border border-border bg-card p-1 shadow-lg", children: [
+          actions.share && onShare ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onShare();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.shareTitle
+            }
+          ) : null,
+          actions.rename && onRename ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onRename();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.rename
+            }
+          ) : null,
+          actions.remove && onDelete ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onDelete();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm text-destructive hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.deleteConfirm
+            }
+          ) : null
+        ] })
+      ] }) : null
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FavoriteListDetail
+});
+//# sourceMappingURL=favorite-list-detail.js.map

package/dist/blocks/designs/customer-favorites/components/favorite-list-detail.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/customer-favorites/components/favorite-list-detail.tsx"],"sourcesContent":["'use client'\n\nimport { useRef } from 'react'\n\nimport { Badge, Button } from '@thorprovider/blocks'\n\nimport type { FavoriteList, FavoritesLabels } from '../contracts'\nimport type { ListActions } from '../permissions'\n\ntype Props = {\n  list: FavoriteList\n  count: number\n  actions: ListActions\n  labels: FavoritesLabels\n  busy?: boolean\n  onAddAll?: () => void\n  onRename?: () => void\n  onDelete?: () => void\n  onShare?: () => void\n}\n\nfunction AddToCartIcon() {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      viewBox=\"0 0 24 24\"\n      className=\"size-4\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.8\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M3 4h2l2.2 10.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L20 7H6\" />\n      <circle cx=\"9\" cy=\"20\" r=\"1\" />\n      <circle cx=\"17\" cy=\"20\" r=\"1\" />\n    </svg>\n  )\n}\n\n/** One compact row for the active list; owner actions live in a contextual menu. */\nexport function FavoriteListDetail({\n  list,\n  count,\n  actions,\n  labels,\n  busy = false,\n  onAddAll,\n  onRename,\n  onDelete,\n  onShare,\n}: Props) {\n  const menuRef = useRef<HTMLDetailsElement>(null)\n  const closeMenu = () => menuRef.current?.removeAttribute('open')\n  const hasMenu =\n    (actions.share && onShare) || (actions.rename && onRename) || (actions.remove && onDelete)\n\n  return (\n    <div className=\"flex items-center justify-between gap-2 rounded-lg border border-border bg-card px-2.5 py-2\">\n      <div className=\"min-w-0\">\n        <div className=\"flex min-w-0 items-center gap-1.5\">\n          <h3 className=\"truncate text-sm font-semibold\">{list.name}</h3>\n          <Badge variant=\"secondary\" className=\"shrink-0 text-[10px]\">\n            {labels.demo.roles[list.role]}\n          </Badge>\n          {list.scope === 'organization' ? (\n            <Badge variant=\"outline\" className=\"shrink-0 text-[10px]\">\n              {labels.collections.organizationGroup}\n            </Badge>\n          ) : null}\n        </div>\n        <p className=\"truncate text-[11px] text-muted-foreground\">\n          {labels.collections.count.replace('{count}', String(count))}\n          {list.description ? ` · ${list.description}` : ''}\n        </p>\n      </div>\n\n      <div className=\"flex shrink-0 items-center gap-1\">\n        {onAddAll && count > 0 ? (\n          <Button\n            type=\"button\"\n            size=\"icon\"\n            aria-label={labels.cart.addAll}\n            onClick={onAddAll}\n            disabled={busy}\n            className=\"size-9\"\n          >\n            <AddToCartIcon />\n          </Button>\n        ) : null}\n\n        {hasMenu ? (\n          <details ref={menuRef} className=\"relative\">\n            <summary\n              aria-label={labels.dialogs.listActions}\n              className=\"flex size-9 cursor-pointer list-none items-center justify-center rounded-md border border-border bg-background text-muted-foreground hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none [&::-webkit-details-marker]:hidden\"\n            >\n              <span aria-hidden=\"true\">⋯</span>\n            </summary>\n\n            <div className=\"absolute top-full right-0 z-20 mt-1 w-44 rounded-md border border-border bg-card p-1 shadow-lg\">\n              {actions.share && onShare ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onShare()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.shareTitle}\n                </button>\n              ) : null}\n              {actions.rename && onRename ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onRename()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.rename}\n                </button>\n              ) : null}\n              {actions.remove && onDelete ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onDelete()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm text-destructive hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.deleteConfirm}\n                </button>\n              ) : null}\n            </div>\n          </details>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/blocks/designs/customer-favorites/components/favorite-list-detail.mjs

@@ -0,0 +1,118 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import { Badge, Button } from "@thorprovider/blocks";
+function AddToCartIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      "aria-hidden": "true",
+      viewBox: "0 0 24 24",
+      className: "size-4",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.8",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M3 4h2l2.2 10.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L20 7H6" }),
+        /* @__PURE__ */ jsx("circle", { cx: "9", cy: "20", r: "1" }),
+        /* @__PURE__ */ jsx("circle", { cx: "17", cy: "20", r: "1" })
+      ]
+    }
+  );
+}
+function FavoriteListDetail({
+  list,
+  count,
+  actions,
+  labels,
+  busy = false,
+  onAddAll,
+  onRename,
+  onDelete,
+  onShare
+}) {
+  const menuRef = useRef(null);
+  const closeMenu = () => menuRef.current?.removeAttribute("open");
+  const hasMenu = actions.share && onShare || actions.rename && onRename || actions.remove && onDelete;
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 rounded-lg border border-border bg-card px-2.5 py-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx("h3", { className: "truncate text-sm font-semibold", children: list.name }),
+        /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "shrink-0 text-[10px]", children: labels.demo.roles[list.role] }),
+        list.scope === "organization" ? /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "shrink-0 text-[10px]", children: labels.collections.organizationGroup }) : null
+      ] }),
+      /* @__PURE__ */ jsxs("p", { className: "truncate text-[11px] text-muted-foreground", children: [
+        labels.collections.count.replace("{count}", String(count)),
+        list.description ? ` \xB7 ${list.description}` : ""
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [
+      onAddAll && count > 0 ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          size: "icon",
+          "aria-label": labels.cart.addAll,
+          onClick: onAddAll,
+          disabled: busy,
+          className: "size-9",
+          children: /* @__PURE__ */ jsx(AddToCartIcon, {})
+        }
+      ) : null,
+      hasMenu ? /* @__PURE__ */ jsxs("details", { ref: menuRef, className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          "summary",
+          {
+            "aria-label": labels.dialogs.listActions,
+            className: "flex size-9 cursor-pointer list-none items-center justify-center rounded-md border border-border bg-background text-muted-foreground hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none [&::-webkit-details-marker]:hidden",
+            children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u22EF" })
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "absolute top-full right-0 z-20 mt-1 w-44 rounded-md border border-border bg-card p-1 shadow-lg", children: [
+          actions.share && onShare ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onShare();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.shareTitle
+            }
+          ) : null,
+          actions.rename && onRename ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onRename();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.rename
+            }
+          ) : null,
+          actions.remove && onDelete ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                closeMenu();
+                onDelete();
+              },
+              className: "flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm text-destructive hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+              children: labels.dialogs.deleteConfirm
+            }
+          ) : null
+        ] })
+      ] }) : null
+    ] })
+  ] });
+}
+export {
+  FavoriteListDetail
+};
+//# sourceMappingURL=favorite-list-detail.mjs.map

package/dist/blocks/designs/customer-favorites/components/favorite-list-detail.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/customer-favorites/components/favorite-list-detail.tsx"],"sourcesContent":["'use client'\n\nimport { useRef } from 'react'\n\nimport { Badge, Button } from '@thorprovider/blocks'\n\nimport type { FavoriteList, FavoritesLabels } from '../contracts'\nimport type { ListActions } from '../permissions'\n\ntype Props = {\n  list: FavoriteList\n  count: number\n  actions: ListActions\n  labels: FavoritesLabels\n  busy?: boolean\n  onAddAll?: () => void\n  onRename?: () => void\n  onDelete?: () => void\n  onShare?: () => void\n}\n\nfunction AddToCartIcon() {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      viewBox=\"0 0 24 24\"\n      className=\"size-4\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.8\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M3 4h2l2.2 10.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L20 7H6\" />\n      <circle cx=\"9\" cy=\"20\" r=\"1\" />\n      <circle cx=\"17\" cy=\"20\" r=\"1\" />\n    </svg>\n  )\n}\n\n/** One compact row for the active list; owner actions live in a contextual menu. */\nexport function FavoriteListDetail({\n  list,\n  count,\n  actions,\n  labels,\n  busy = false,\n  onAddAll,\n  onRename,\n  onDelete,\n  onShare,\n}: Props) {\n  const menuRef = useRef<HTMLDetailsElement>(null)\n  const closeMenu = () => menuRef.current?.removeAttribute('open')\n  const hasMenu =\n    (actions.share && onShare) || (actions.rename && onRename) || (actions.remove && onDelete)\n\n  return (\n    <div className=\"flex items-center justify-between gap-2 rounded-lg border border-border bg-card px-2.5 py-2\">\n      <div className=\"min-w-0\">\n        <div className=\"flex min-w-0 items-center gap-1.5\">\n          <h3 className=\"truncate text-sm font-semibold\">{list.name}</h3>\n          <Badge variant=\"secondary\" className=\"shrink-0 text-[10px]\">\n            {labels.demo.roles[list.role]}\n          </Badge>\n          {list.scope === 'organization' ? (\n            <Badge variant=\"outline\" className=\"shrink-0 text-[10px]\">\n              {labels.collections.organizationGroup}\n            </Badge>\n          ) : null}\n        </div>\n        <p className=\"truncate text-[11px] text-muted-foreground\">\n          {labels.collections.count.replace('{count}', String(count))}\n          {list.description ? ` · ${list.description}` : ''}\n        </p>\n      </div>\n\n      <div className=\"flex shrink-0 items-center gap-1\">\n        {onAddAll && count > 0 ? (\n          <Button\n            type=\"button\"\n            size=\"icon\"\n            aria-label={labels.cart.addAll}\n            onClick={onAddAll}\n            disabled={busy}\n            className=\"size-9\"\n          >\n            <AddToCartIcon />\n          </Button>\n        ) : null}\n\n        {hasMenu ? (\n          <details ref={menuRef} className=\"relative\">\n            <summary\n              aria-label={labels.dialogs.listActions}\n              className=\"flex size-9 cursor-pointer list-none items-center justify-center rounded-md border border-border bg-background text-muted-foreground hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none [&::-webkit-details-marker]:hidden\"\n            >\n              <span aria-hidden=\"true\">⋯</span>\n            </summary>\n\n            <div className=\"absolute top-full right-0 z-20 mt-1 w-44 rounded-md border border-border bg-card p-1 shadow-lg\">\n              {actions.share && onShare ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onShare()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.shareTitle}\n                </button>\n              ) : null}\n              {actions.rename && onRename ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onRename()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.rename}\n                </button>\n              ) : null}\n              {actions.remove && onDelete ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    closeMenu()\n                    onDelete()\n                  }}\n                  className=\"flex min-h-9 w-full items-center rounded-sm px-2 text-left text-sm text-destructive hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n                >\n                  {labels.dialogs.deleteConfirm}\n                </button>\n              ) : null}\n            </div>\n          </details>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/blocks/designs/customer-favorites/components/favorite-product-card.d.ts

@@ -0,0 +1,30 @@
+import type { FavoritesCapabilities, FavoritesLabels, FavoritesRow } from '../contracts';
+type Props = {
+    row: FavoritesRow;
+    labels: FavoritesLabels;
+    capabilities: FavoritesCapabilities;
+    saved: boolean;
+    saving?: boolean;
+    saveError?: boolean;
+    showQuantity: boolean;
+    quantityLabel: string;
+    quantityMax: number;
+    personalListCount?: number;
+    busy?: boolean;
+    selecting?: boolean;
+    selected?: boolean;
+    onToggleSelected?: () => void;
+    onToggleFavorite: () => void;
+    onAddToCart?: () => void;
+    onOrganize?: () => void;
+    onOpenProduct?: () => void;
+    onQuantityChange?: (quantity: number) => void;
+    onRemoveFromList?: () => void;
+};
+/**
+ * Vertical wishlist cell: image-first, two-line title, one variant line, current
+ * and previous price, and the actions pinned to the bottom so cards align.
+ */
+export declare function FavoriteProductCard({ row, labels, capabilities, saved, saving, saveError, showQuantity, quantityLabel, quantityMax, personalListCount, busy, selecting, selected, onToggleSelected, onToggleFavorite, onAddToCart, onOrganize, onOpenProduct, onQuantityChange, onRemoveFromList, }: Props): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=favorite-product-card.d.ts.map

package/dist/blocks/designs/customer-favorites/components/favorite-product-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"favorite-product-card.d.ts","sourceRoot":"","sources":["../../../../../src/blocks/designs/customer-favorites/components/favorite-product-card.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAMxF,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,YAAY,CAAA;IACjB,MAAM,EAAE,eAAe,CAAA;IACvB,YAAY,EAAE,qBAAqB,CAAA;IACnC,KAAK,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,EAAE,OAAO,CAAA;IACrB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,gBAAgB,EAAE,MAAM,IAAI,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7C,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;CAC9B,CAAA;AAoBD;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,MAAM,EACN,YAAY,EACZ,KAAK,EACL,MAAc,EACd,SAAiB,EACjB,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAqB,EACrB,IAAY,EACZ,SAAiB,EACjB,QAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,gBAAgB,GACjB,EAAE,KAAK,+BAoJP"}

package/dist/blocks/designs/customer-favorites/components/favorite-product-card.js

@@ -0,0 +1,184 @@
+"use strict";
+"use client";
+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 favorite_product_card_exports = {};
+__export(favorite_product_card_exports, {
+  FavoriteProductCard: () => FavoriteProductCard
+});
+module.exports = __toCommonJS(favorite_product_card_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_blocks = require("@thorprovider/blocks");
+var import_engine = require("../engine.js");
+var import_favorite_button = require("./favorite-button.js");
+var import_quantity_stepper = require("./quantity-stepper.js");
+function OrganizeIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "svg",
+    {
+      "aria-hidden": "true",
+      viewBox: "0 0 24 24",
+      className: "size-4",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.8",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M4 7h10M4 12h10M4 17h6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M17 12v6M14 15h6" })
+      ]
+    }
+  );
+}
+function FavoriteProductCard({
+  row,
+  labels,
+  capabilities,
+  saved,
+  saving = false,
+  saveError = false,
+  showQuantity,
+  quantityLabel,
+  quantityMax,
+  personalListCount = 0,
+  busy = false,
+  selecting = false,
+  selected = false,
+  onToggleSelected,
+  onToggleFavorite,
+  onAddToCart,
+  onOrganize,
+  onOpenProduct,
+  onQuantityChange,
+  onRemoveFromList
+}) {
+  const { product, variant } = row;
+  const previousPrice = (0, import_engine.compareAtLabel)(product);
+  const variantText = variant ? variant.options.slice(0, 2).map((option) => `${option.name}: ${option.value}`).join(" \xB7 ") : product.variants.length > 1 ? labels.card.variantPending : "";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_blocks.Card, { className: "group flex h-full flex-col gap-0 overflow-hidden py-0", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative aspect-[4/3] w-full overflow-hidden bg-muted", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "img",
+        {
+          src: product.image ?? import_blocks.PRODUCT_IMAGE_FALLBACK,
+          alt: product.imageAlt ?? product.title,
+          loading: "lazy",
+          className: "h-full w-full object-cover transition-transform duration-300 group-hover:scale-105 motion-reduce:transition-none"
+        }
+      ),
+      selecting && onToggleSelected ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { className: "absolute top-1 left-1 flex size-8 items-center justify-center rounded-md bg-background/90 shadow-sm focus-within:ring-2 focus-within:ring-ring", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          type: "checkbox",
+          checked: selected,
+          "aria-label": `${labels.aria.selectItem}: ${product.title}`,
+          onChange: onToggleSelected,
+          className: "size-5 rounded border-input accent-primary"
+        }
+      ) }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute top-1 right-1", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_favorite_button.FavoriteButton,
+        {
+          saved,
+          saving,
+          error: saveError,
+          disabled: !capabilities.enabled || busy,
+          labels,
+          compact: true,
+          onToggle: onToggleFavorite
+        }
+      ) }),
+      product.availability !== "available" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_blocks.Badge, { variant: "secondary", className: "absolute bottom-1.5 left-1.5 max-w-[70%] truncate", children: labels.card.availability[product.availability] }) : null,
+      capabilities.namedLists && onOrganize ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_blocks.Button,
+        {
+          type: "button",
+          size: "icon",
+          variant: "secondary",
+          disabled: busy,
+          "aria-label": labels.card.organize,
+          onClick: onOrganize,
+          className: "absolute right-1 bottom-1 size-8 bg-background/90 shadow-sm",
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(OrganizeIcon, {})
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5 p-2", children: [
+      onOpenProduct ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: onOpenProduct,
+          className: "line-clamp-2 min-h-9 text-left text-[13px] leading-snug font-semibold hover:underline focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+          children: product.title
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "line-clamp-2 min-h-9 text-[13px] leading-snug font-semibold", children: product.title }),
+      product.brand ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "truncate text-[10px] tracking-wide text-muted-foreground uppercase", children: product.brand }) : null,
+      variantText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "truncate text-[10px] text-muted-foreground", children: variantText }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-auto flex flex-col gap-1.5 pt-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-baseline gap-x-1.5 gap-y-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[13px] font-semibold", children: (0, import_engine.priceLabel)(product, labels.card.unavailablePrice) }),
+          previousPrice ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[11px] text-muted-foreground line-through", children: previousPrice }) : null
+        ] }),
+        personalListCount > 1 && !showQuantity ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "truncate text-[10px] text-muted-foreground", children: labels.card.inLists.replace("{count}", String(personalListCount)) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-1.5", children: capabilities.addToCart && onAddToCart ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_blocks.Button,
+          {
+            type: "button",
+            size: "sm",
+            disabled: busy,
+            onClick: onAddToCart,
+            className: "min-h-8 flex-1 px-1.5 text-[11px]",
+            children: labels.card.addToCart
+          }
+        ) : null }),
+        showQuantity && onQuantityChange ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center justify-between gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_quantity_stepper.QuantityStepper,
+            {
+              value: row.quantity ?? 1,
+              max: quantityMax,
+              label: quantityLabel,
+              labels,
+              disabled: busy,
+              onChange: onQuantityChange
+            }
+          ),
+          onRemoveFromList ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_blocks.Button,
+            {
+              type: "button",
+              size: "sm",
+              variant: "ghost",
+              disabled: busy,
+              onClick: onRemoveFromList,
+              className: "min-h-8 px-1.5 text-[11px] text-destructive",
+              children: labels.card.removeFromList
+            }
+          ) : null
+        ] }) : null
+      ] })
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FavoriteProductCard
+});
+//# sourceMappingURL=favorite-product-card.js.map

package/dist/blocks/designs/customer-favorites/components/favorite-product-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/blocks/designs/customer-favorites/components/favorite-product-card.tsx"],"sourcesContent":["'use client'\n\nimport { Badge, Button, Card, PRODUCT_IMAGE_FALLBACK } from '@thorprovider/blocks'\n\nimport type { FavoritesCapabilities, FavoritesLabels, FavoritesRow } from '../contracts'\nimport { compareAtLabel, priceLabel } from '../engine'\n\nimport { FavoriteButton } from './favorite-button'\nimport { QuantityStepper } from './quantity-stepper'\n\ntype Props = {\n  row: FavoritesRow\n  labels: FavoritesLabels\n  capabilities: FavoritesCapabilities\n  saved: boolean\n  saving?: boolean\n  saveError?: boolean\n  showQuantity: boolean\n  quantityLabel: string\n  quantityMax: number\n  personalListCount?: number\n  busy?: boolean\n  selecting?: boolean\n  selected?: boolean\n  onToggleSelected?: () => void\n  onToggleFavorite: () => void\n  onAddToCart?: () => void\n  onOrganize?: () => void\n  onOpenProduct?: () => void\n  onQuantityChange?: (quantity: number) => void\n  onRemoveFromList?: () => void\n}\n\nfunction OrganizeIcon() {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      viewBox=\"0 0 24 24\"\n      className=\"size-4\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.8\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M4 7h10M4 12h10M4 17h6\" />\n      <path d=\"M17 12v6M14 15h6\" />\n    </svg>\n  )\n}\n\n/**\n * Vertical wishlist cell: image-first, two-line title, one variant line, current\n * and previous price, and the actions pinned to the bottom so cards align.\n */\nexport function FavoriteProductCard({\n  row,\n  labels,\n  capabilities,\n  saved,\n  saving = false,\n  saveError = false,\n  showQuantity,\n  quantityLabel,\n  quantityMax,\n  personalListCount = 0,\n  busy = false,\n  selecting = false,\n  selected = false,\n  onToggleSelected,\n  onToggleFavorite,\n  onAddToCart,\n  onOrganize,\n  onOpenProduct,\n  onQuantityChange,\n  onRemoveFromList,\n}: Props) {\n  const { product, variant } = row\n  const previousPrice = compareAtLabel(product)\n  const variantText = variant\n    ? variant.options\n        .slice(0, 2)\n        .map((option) => `${option.name}: ${option.value}`)\n        .join(' · ')\n    : product.variants.length > 1\n      ? labels.card.variantPending\n      : ''\n\n  return (\n    <Card className=\"group flex h-full flex-col gap-0 overflow-hidden py-0\">\n      <div className=\"relative aspect-[4/3] w-full overflow-hidden bg-muted\">\n        <img\n          src={product.image ?? PRODUCT_IMAGE_FALLBACK}\n          alt={product.imageAlt ?? product.title}\n          loading=\"lazy\"\n          className=\"h-full w-full object-cover transition-transform duration-300 group-hover:scale-105 motion-reduce:transition-none\"\n        />\n\n        {selecting && onToggleSelected ? (\n          <label className=\"absolute top-1 left-1 flex size-8 items-center justify-center rounded-md bg-background/90 shadow-sm focus-within:ring-2 focus-within:ring-ring\">\n            <input\n              type=\"checkbox\"\n              checked={selected}\n              aria-label={`${labels.aria.selectItem}: ${product.title}`}\n              onChange={onToggleSelected}\n              className=\"size-5 rounded border-input accent-primary\"\n            />\n          </label>\n        ) : null}\n\n        <div className=\"absolute top-1 right-1\">\n          <FavoriteButton\n            saved={saved}\n            saving={saving}\n            error={saveError}\n            disabled={!capabilities.enabled || busy}\n            labels={labels}\n            compact\n            onToggle={onToggleFavorite}\n          />\n        </div>\n\n        {product.availability !== 'available' ? (\n          <Badge variant=\"secondary\" className=\"absolute bottom-1.5 left-1.5 max-w-[70%] truncate\">\n            {labels.card.availability[product.availability]}\n          </Badge>\n        ) : null}\n\n        {capabilities.namedLists && onOrganize ? (\n          <Button\n            type=\"button\"\n            size=\"icon\"\n            variant=\"secondary\"\n            disabled={busy}\n            aria-label={labels.card.organize}\n            onClick={onOrganize}\n            className=\"absolute right-1 bottom-1 size-8 bg-background/90 shadow-sm\"\n          >\n            <OrganizeIcon />\n          </Button>\n        ) : null}\n      </div>\n\n      <div className=\"flex min-w-0 flex-1 flex-col gap-0.5 p-2\">\n        {onOpenProduct ? (\n          <button\n            type=\"button\"\n            onClick={onOpenProduct}\n            className=\"line-clamp-2 min-h-9 text-left text-[13px] leading-snug font-semibold hover:underline focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none\"\n          >\n            {product.title}\n          </button>\n        ) : (\n          <p className=\"line-clamp-2 min-h-9 text-[13px] leading-snug font-semibold\">{product.title}</p>\n        )}\n\n        {product.brand ? (\n          <p className=\"truncate text-[10px] tracking-wide text-muted-foreground uppercase\">\n            {product.brand}\n          </p>\n        ) : null}\n\n        {variantText ? (\n          <p className=\"truncate text-[10px] text-muted-foreground\">{variantText}</p>\n        ) : null}\n\n        <div className=\"mt-auto flex flex-col gap-1.5 pt-1\">\n          <div className=\"flex flex-wrap items-baseline gap-x-1.5 gap-y-0\">\n            <span className=\"text-[13px] font-semibold\">\n              {priceLabel(product, labels.card.unavailablePrice)}\n            </span>\n            {previousPrice ? (\n              <span className=\"text-[11px] text-muted-foreground line-through\">{previousPrice}</span>\n            ) : null}\n          </div>\n\n          {personalListCount > 1 && !showQuantity ? (\n            <p className=\"truncate text-[10px] text-muted-foreground\">\n              {labels.card.inLists.replace('{count}', String(personalListCount))}\n            </p>\n          ) : null}\n\n          <div className=\"flex items-center gap-1.5\">\n            {capabilities.addToCart && onAddToCart ? (\n              <Button\n                type=\"button\"\n                size=\"sm\"\n                disabled={busy}\n                onClick={onAddToCart}\n                className=\"min-h-8 flex-1 px-1.5 text-[11px]\"\n              >\n                {labels.card.addToCart}\n              </Button>\n            ) : null}\n          </div>\n\n          {showQuantity && onQuantityChange ? (\n            <div className=\"flex flex-wrap items-center justify-between gap-1\">\n              <QuantityStepper\n                value={row.quantity ?? 1}\n                max={quantityMax}\n                label={quantityLabel}\n                labels={labels}\n                disabled={busy}\n                onChange={onQuantityChange}\n              />\n              {onRemoveFromList ? (\n                <Button\n                  type=\"button\"\n                  size=\"sm\"\n                  variant=\"ghost\"\n                  disabled={busy}\n                  onClick={onRemoveFromList}\n                  className=\"min-h-8 px-1.5 text-[11px] text-destructive\"\n                >\n                  {labels.card.removeFromList}\n                </Button>\n              ) : null}\n            </div>\n          ) : null}\n        </div>\n      </div>\n    </Card>\n  )\n}\n"],"mappings":"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","names":[]}