@elizaos/plugin-shopify-ui 2.0.3-beta.6 → 2.0.3-beta.7

package/dist/ProductsPanel.js

@@ -0,0 +1,419 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Input,
+  Skeleton
+} from "@elizaos/ui";
+import { useAgentElement } from "@elizaos/ui/agent-surface";
+import { ChevronLeft, ChevronRight, Image, Package, Plus } from "lucide-react";
+import { useState } from "react";
+function ProductStatusBadge({ status }) {
+  const styles = {
+    ACTIVE: "bg-ok",
+    DRAFT: "bg-muted",
+    ARCHIVED: "bg-danger"
+  };
+  const labels = {
+    ACTIVE: "Active",
+    DRAFT: "Draft",
+    ARCHIVED: "Archived"
+  };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      role: "img",
+      "aria-label": labels[status],
+      title: labels[status],
+      className: `inline-flex h-2.5 w-2.5 rounded-full ${styles[status]}`
+    }
+  );
+}
+function CreateProductDialog({ open, onClose }) {
+  const [title, setTitle] = useState("");
+  const [vendor, setVendor] = useState("");
+  const [productType, setProductType] = useState("");
+  const [price, setPrice] = useState("");
+  const [submitting, setSubmitting] = useState(false);
+  const [submitError, setSubmitError] = useState(null);
+  const titleInput = useAgentElement({
+    id: "create-product-title",
+    role: "text-input",
+    label: "Product title",
+    group: "create-product",
+    description: "Title for the new product (required)",
+    getValue: () => title,
+    onFill: (value) => setTitle(value)
+  });
+  const vendorInput = useAgentElement({
+    id: "create-product-vendor",
+    role: "text-input",
+    label: "Product vendor",
+    group: "create-product",
+    description: "Vendor for the new product",
+    getValue: () => vendor,
+    onFill: (value) => setVendor(value)
+  });
+  const typeInput = useAgentElement({
+    id: "create-product-type",
+    role: "text-input",
+    label: "Product type",
+    group: "create-product",
+    description: "Type/category for the new product",
+    getValue: () => productType,
+    onFill: (value) => setProductType(value)
+  });
+  const priceInput = useAgentElement({
+    id: "create-product-price",
+    role: "number-input",
+    label: "Product base price",
+    group: "create-product",
+    description: "Base price for the new product",
+    getValue: () => price,
+    onFill: (value) => setPrice(value)
+  });
+  const cancelButton = useAgentElement({
+    id: "create-product-cancel",
+    role: "button",
+    label: "Cancel create product",
+    group: "create-product",
+    description: "Close the create-product dialog without saving",
+    onActivate: onClose
+  });
+  const submitButton = useAgentElement({
+    id: "create-product-submit",
+    role: "button",
+    label: "Submit new product",
+    group: "create-product",
+    description: "Create the new draft product"
+  });
+  function reset() {
+    setTitle("");
+    setVendor("");
+    setProductType("");
+    setPrice("");
+    setSubmitting(false);
+    setSubmitError(null);
+  }
+  async function handleSubmit(e) {
+    e.preventDefault();
+    if (!title.trim()) return;
+    setSubmitting(true);
+    setSubmitError(null);
+    try {
+      const res = await fetch("/api/shopify/products", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          title: title.trim(),
+          vendor: vendor.trim() || void 0,
+          productType: productType.trim() || void 0,
+          price: price.trim() || void 0
+        })
+      });
+      if (!res.ok) {
+        const text = await res.text().catch(() => "Unknown error");
+        throw new Error(text);
+      }
+      reset();
+      onClose();
+    } catch (err) {
+      setSubmitError(
+        err instanceof Error ? err.message : "Failed to create product."
+      );
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (next) => {
+        if (!next) {
+          reset();
+          onClose();
+        }
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { children: [
+        /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Create product" }) }),
+        /* @__PURE__ */ jsxs("form", { onSubmit: (e) => void handleSubmit(e), className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsxs(
+              "label",
+              {
+                className: "text-xs font-semibold text-muted-strong",
+                htmlFor: "product-title",
+                children: [
+                  "Title ",
+                  /* @__PURE__ */ jsx("span", { className: "text-danger", children: "*" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: titleInput.ref,
+                id: "product-title",
+                placeholder: "e.g. Classic T-Shirt",
+                value: title,
+                onChange: (e) => setTitle(e.target.value),
+                required: true,
+                ...titleInput.agentProps
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(
+              "label",
+              {
+                className: "text-xs font-semibold text-muted-strong",
+                htmlFor: "product-vendor",
+                children: "Vendor"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: vendorInput.ref,
+                id: "product-vendor",
+                placeholder: "e.g. Acme Co.",
+                value: vendor,
+                onChange: (e) => setVendor(e.target.value),
+                ...vendorInput.agentProps
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(
+              "label",
+              {
+                className: "text-xs font-semibold text-muted-strong",
+                htmlFor: "product-type",
+                children: "Product type"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: typeInput.ref,
+                id: "product-type",
+                placeholder: "e.g. Apparel",
+                value: productType,
+                onChange: (e) => setProductType(e.target.value),
+                ...typeInput.agentProps
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(
+              "label",
+              {
+                className: "text-xs font-semibold text-muted-strong",
+                htmlFor: "product-price",
+                children: "Base price"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: priceInput.ref,
+                id: "product-price",
+                type: "number",
+                min: "0",
+                step: "0.01",
+                placeholder: "0.00",
+                value: price,
+                onChange: (e) => setPrice(e.target.value),
+                ...priceInput.agentProps
+              }
+            )
+          ] }),
+          submitError ? /* @__PURE__ */ jsx("div", { className: "px-1 py-2 text-xs text-danger", children: submitError }) : null,
+          /* @__PURE__ */ jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                ref: cancelButton.ref,
+                type: "button",
+                variant: "outline",
+                onClick: onClose,
+                ...cancelButton.agentProps,
+                children: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                ref: submitButton.ref,
+                type: "submit",
+                disabled: submitting || !title.trim(),
+                ...submitButton.agentProps,
+                children: submitting ? "Creating\u2026" : "Create product"
+              }
+            )
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+function ProductRow({ product }) {
+  const priceLabel = product.priceRange.min === product.priceRange.max ? product.priceRange.min : `${product.priceRange.min} \u2013 ${product.priceRange.max}`;
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 px-2 py-2 transition-colors hover:bg-bg-muted/20", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden", children: product.imageUrl ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: product.imageUrl,
+        alt: product.title,
+        className: "h-full w-full object-cover"
+      }
+    ) : /* @__PURE__ */ jsx(Image, { className: "h-4 w-4 text-muted/50" }) }),
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsx("div", { className: "truncate text-sm font-semibold text-txt", children: product.title }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex flex-wrap items-center gap-1.5 text-xs-tight text-muted", children: [
+        product.vendor ? /* @__PURE__ */ jsx("span", { children: product.vendor }) : null,
+        product.vendor && product.productType ? /* @__PURE__ */ jsx("span", { children: "\xB7" }) : null,
+        product.productType ? /* @__PURE__ */ jsx("span", { children: product.productType }) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "shrink-0 text-right", children: [
+      /* @__PURE__ */ jsx("div", { className: "text-sm font-semibold text-txt", children: priceLabel }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "mt-0.5 flex items-center justify-end gap-1 text-xs-tight text-muted",
+          title: "Inventory",
+          children: [
+            /* @__PURE__ */ jsx(Package, { className: "h-3 w-3", "aria-hidden": true }),
+            product.totalInventory.toLocaleString()
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsx(ProductStatusBadge, { status: product.status }) })
+  ] });
+}
+const PAGE_SIZE = 20;
+function ProductsPanel({
+  products,
+  total,
+  page,
+  loading,
+  error,
+  onPageChange
+}) {
+  const [createOpen, setCreateOpen] = useState(false);
+  const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
+  const createButton = useAgentElement({
+    id: "action-create-product",
+    role: "button",
+    label: "Create product",
+    group: "products",
+    description: "Open the dialog to create a new product"
+  });
+  const prevPageButton = useAgentElement({
+    id: "products-page-prev",
+    role: "button",
+    label: "Previous products page",
+    group: "products",
+    description: "Go to the previous page of products",
+    onActivate: () => onPageChange(page - 1)
+  });
+  const nextPageButton = useAgentElement({
+    id: "products-page-next",
+    role: "button",
+    label: "Next products page",
+    group: "products",
+    description: "Go to the next page of products",
+    onActivate: () => onPageChange(page + 1)
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "p",
+        {
+          "data-testid": "chat-search-hint",
+          className: "sr-only text-[13px] leading-relaxed text-txt/60",
+          children: "Search products by typing in the chat."
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          ref: createButton.ref,
+          type: "button",
+          size: "sm",
+          onClick: () => setCreateOpen(true),
+          className: "shrink-0 gap-1.5",
+          ...createButton.agentProps,
+          children: [
+            /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }),
+            "Create"
+          ]
+        }
+      )
+    ] }),
+    error ? /* @__PURE__ */ jsx("div", { className: "px-1 py-2 text-sm text-danger", children: error }) : null,
+    loading && products.length === 0 ? /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Array.from({ length: 6 }, (_, i) => i).map((i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-16 w-full" }, i)) }) : products.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 py-10 text-center", children: [
+      /* @__PURE__ */ jsx(Package, { className: "h-8 w-8 text-muted/40" }),
+      /* @__PURE__ */ jsx("div", { className: "text-sm text-muted", children: "None" })
+    ] }) : /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: products.map((product) => /* @__PURE__ */ jsx(ProductRow, { product }, product.id)) }),
+    total > PAGE_SIZE ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between pt-1", children: [
+      /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted", children: [
+        total.toLocaleString(),
+        " products \xB7 page ",
+        page,
+        " of ",
+        totalPages
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            ref: prevPageButton.ref,
+            type: "button",
+            variant: "outline",
+            size: "icon",
+            className: "h-8 w-8",
+            disabled: page <= 1 || loading,
+            onClick: () => onPageChange(page - 1),
+            "aria-label": "Previous page",
+            ...prevPageButton.agentProps,
+            children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            ref: nextPageButton.ref,
+            type: "button",
+            variant: "outline",
+            size: "icon",
+            className: "h-8 w-8",
+            disabled: page >= totalPages || loading,
+            onClick: () => onPageChange(page + 1),
+            "aria-label": "Next page",
+            ...nextPageButton.agentProps,
+            children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+          }
+        )
+      ] })
+    ] }) : null,
+    /* @__PURE__ */ jsx(
+      CreateProductDialog,
+      {
+        open: createOpen,
+        onClose: () => setCreateOpen(false)
+      }
+    )
+  ] });
+}
+export {
+  ProductsPanel
+};
+//# sourceMappingURL=ProductsPanel.js.map

package/dist/ProductsPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/ProductsPanel.tsx"],"sourcesContent":["import {\n  Button,\n  Dialog,\n  DialogContent,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  Input,\n  Skeleton,\n} from \"@elizaos/ui\";\nimport { useAgentElement } from \"@elizaos/ui/agent-surface\";\nimport { ChevronLeft, ChevronRight, Image, Package, Plus } from \"lucide-react\";\nimport { useState } from \"react\";\nimport type { ShopifyProduct } from \"./useShopifyDashboard.js\";\n\nfunction ProductStatusBadge({ status }: { status: ShopifyProduct[\"status\"] }) {\n  const styles = {\n    ACTIVE: \"bg-ok\",\n    DRAFT: \"bg-muted\",\n    ARCHIVED: \"bg-danger\",\n  } satisfies Record<ShopifyProduct[\"status\"], string>;\n\n  const labels: Record<ShopifyProduct[\"status\"], string> = {\n    ACTIVE: \"Active\",\n    DRAFT: \"Draft\",\n    ARCHIVED: \"Archived\",\n  };\n\n  return (\n    <span\n      role=\"img\"\n      aria-label={labels[status]}\n      title={labels[status]}\n      className={`inline-flex h-2.5 w-2.5 rounded-full ${styles[status]}`}\n    />\n  );\n}\n\ninterface CreateProductDialogProps {\n  open: boolean;\n  onClose: () => void;\n}\n\nfunction CreateProductDialog({ open, onClose }: CreateProductDialogProps) {\n  const [title, setTitle] = useState(\"\");\n  const [vendor, setVendor] = useState(\"\");\n  const [productType, setProductType] = useState(\"\");\n  const [price, setPrice] = useState(\"\");\n  const [submitting, setSubmitting] = useState(false);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n\n  const titleInput = useAgentElement<HTMLInputElement>({\n    id: \"create-product-title\",\n    role: \"text-input\",\n    label: \"Product title\",\n    group: \"create-product\",\n    description: \"Title for the new product (required)\",\n    getValue: () => title,\n    onFill: (value) => setTitle(value),\n  });\n  const vendorInput = useAgentElement<HTMLInputElement>({\n    id: \"create-product-vendor\",\n    role: \"text-input\",\n    label: \"Product vendor\",\n    group: \"create-product\",\n    description: \"Vendor for the new product\",\n    getValue: () => vendor,\n    onFill: (value) => setVendor(value),\n  });\n  const typeInput = useAgentElement<HTMLInputElement>({\n    id: \"create-product-type\",\n    role: \"text-input\",\n    label: \"Product type\",\n    group: \"create-product\",\n    description: \"Type/category for the new product\",\n    getValue: () => productType,\n    onFill: (value) => setProductType(value),\n  });\n  const priceInput = useAgentElement<HTMLInputElement>({\n    id: \"create-product-price\",\n    role: \"number-input\",\n    label: \"Product base price\",\n    group: \"create-product\",\n    description: \"Base price for the new product\",\n    getValue: () => price,\n    onFill: (value) => setPrice(value),\n  });\n  const cancelButton = useAgentElement<HTMLButtonElement>({\n    id: \"create-product-cancel\",\n    role: \"button\",\n    label: \"Cancel create product\",\n    group: \"create-product\",\n    description: \"Close the create-product dialog without saving\",\n    onActivate: onClose,\n  });\n  const submitButton = useAgentElement<HTMLButtonElement>({\n    id: \"create-product-submit\",\n    role: \"button\",\n    label: \"Submit new product\",\n    group: \"create-product\",\n    description: \"Create the new draft product\",\n  });\n\n  function reset() {\n    setTitle(\"\");\n    setVendor(\"\");\n    setProductType(\"\");\n    setPrice(\"\");\n    setSubmitting(false);\n    setSubmitError(null);\n  }\n\n  async function handleSubmit(e: React.FormEvent) {\n    e.preventDefault();\n    if (!title.trim()) return;\n    setSubmitting(true);\n    setSubmitError(null);\n    try {\n      const res = await fetch(\"/api/shopify/products\", {\n        method: \"POST\",\n        headers: { \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({\n          title: title.trim(),\n          vendor: vendor.trim() || undefined,\n          productType: productType.trim() || undefined,\n          price: price.trim() || undefined,\n        }),\n      });\n      if (!res.ok) {\n        const text = await res.text().catch(() => \"Unknown error\");\n        throw new Error(text);\n      }\n      reset();\n      onClose();\n    } catch (err) {\n      setSubmitError(\n        err instanceof Error ? err.message : \"Failed to create product.\",\n      );\n    } finally {\n      setSubmitting(false);\n    }\n  }\n\n  return (\n    <Dialog\n      open={open}\n      onOpenChange={(next) => {\n        if (!next) {\n          reset();\n          onClose();\n        }\n      }}\n    >\n      <DialogContent>\n        <DialogHeader>\n          <DialogTitle>Create product</DialogTitle>\n        </DialogHeader>\n        <form onSubmit={(e) => void handleSubmit(e)} className=\"space-y-3\">\n          <div className=\"space-y-1.5\">\n            <label\n              className=\"text-xs font-semibold text-muted-strong\"\n              htmlFor=\"product-title\"\n            >\n              Title <span className=\"text-danger\">*</span>\n            </label>\n            <Input\n              ref={titleInput.ref}\n              id=\"product-title\"\n              placeholder=\"e.g. Classic T-Shirt\"\n              value={title}\n              onChange={(e) => setTitle(e.target.value)}\n              required\n              {...titleInput.agentProps}\n            />\n          </div>\n          <div className=\"space-y-1.5\">\n            <label\n              className=\"text-xs font-semibold text-muted-strong\"\n              htmlFor=\"product-vendor\"\n            >\n              Vendor\n            </label>\n            <Input\n              ref={vendorInput.ref}\n              id=\"product-vendor\"\n              placeholder=\"e.g. Acme Co.\"\n              value={vendor}\n              onChange={(e) => setVendor(e.target.value)}\n              {...vendorInput.agentProps}\n            />\n          </div>\n          <div className=\"space-y-1.5\">\n            <label\n              className=\"text-xs font-semibold text-muted-strong\"\n              htmlFor=\"product-type\"\n            >\n              Product type\n            </label>\n            <Input\n              ref={typeInput.ref}\n              id=\"product-type\"\n              placeholder=\"e.g. Apparel\"\n              value={productType}\n              onChange={(e) => setProductType(e.target.value)}\n              {...typeInput.agentProps}\n            />\n          </div>\n          <div className=\"space-y-1.5\">\n            <label\n              className=\"text-xs font-semibold text-muted-strong\"\n              htmlFor=\"product-price\"\n            >\n              Base price\n            </label>\n            <Input\n              ref={priceInput.ref}\n              id=\"product-price\"\n              type=\"number\"\n              min=\"0\"\n              step=\"0.01\"\n              placeholder=\"0.00\"\n              value={price}\n              onChange={(e) => setPrice(e.target.value)}\n              {...priceInput.agentProps}\n            />\n          </div>\n\n          {submitError ? (\n            <div className=\"px-1 py-2 text-xs text-danger\">{submitError}</div>\n          ) : null}\n\n          <DialogFooter>\n            <Button\n              ref={cancelButton.ref}\n              type=\"button\"\n              variant=\"outline\"\n              onClick={onClose}\n              {...cancelButton.agentProps}\n            >\n              Cancel\n            </Button>\n            <Button\n              ref={submitButton.ref}\n              type=\"submit\"\n              disabled={submitting || !title.trim()}\n              {...submitButton.agentProps}\n            >\n              {submitting ? \"Creating…\" : \"Create product\"}\n            </Button>\n          </DialogFooter>\n        </form>\n      </DialogContent>\n    </Dialog>\n  );\n}\n\nfunction ProductRow({ product }: { product: ShopifyProduct }) {\n  const priceLabel =\n    product.priceRange.min === product.priceRange.max\n      ? product.priceRange.min\n      : `${product.priceRange.min} – ${product.priceRange.max}`;\n\n  return (\n    <div className=\"flex items-center gap-3 px-2 py-2 transition-colors hover:bg-bg-muted/20\">\n      <div className=\"flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden\">\n        {product.imageUrl ? (\n          <img\n            src={product.imageUrl}\n            alt={product.title}\n            className=\"h-full w-full object-cover\"\n          />\n        ) : (\n          <Image className=\"h-4 w-4 text-muted/50\" />\n        )}\n      </div>\n\n      <div className=\"min-w-0 flex-1\">\n        <div className=\"truncate text-sm font-semibold text-txt\">\n          {product.title}\n        </div>\n        <div className=\"mt-0.5 flex flex-wrap items-center gap-1.5 text-xs-tight text-muted\">\n          {product.vendor ? <span>{product.vendor}</span> : null}\n          {product.vendor && product.productType ? <span>·</span> : null}\n          {product.productType ? <span>{product.productType}</span> : null}\n        </div>\n      </div>\n\n      <div className=\"shrink-0 text-right\">\n        <div className=\"text-sm font-semibold text-txt\">{priceLabel}</div>\n        <div\n          className=\"mt-0.5 flex items-center justify-end gap-1 text-xs-tight text-muted\"\n          title=\"Inventory\"\n        >\n          <Package className=\"h-3 w-3\" aria-hidden />\n          {product.totalInventory.toLocaleString()}\n        </div>\n      </div>\n\n      <div className=\"shrink-0\">\n        <ProductStatusBadge status={product.status} />\n      </div>\n    </div>\n  );\n}\n\ninterface ProductsPanelProps {\n  products: ShopifyProduct[];\n  total: number;\n  page: number;\n  loading: boolean;\n  error: string | null;\n  search: string;\n  onPageChange: (page: number) => void;\n}\n\nconst PAGE_SIZE = 20;\n\nexport function ProductsPanel({\n  products,\n  total,\n  page,\n  loading,\n  error,\n  onPageChange,\n}: ProductsPanelProps) {\n  const [createOpen, setCreateOpen] = useState(false);\n  const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));\n\n  const createButton = useAgentElement<HTMLButtonElement>({\n    id: \"action-create-product\",\n    role: \"button\",\n    label: \"Create product\",\n    group: \"products\",\n    description: \"Open the dialog to create a new product\",\n  });\n  const prevPageButton = useAgentElement<HTMLButtonElement>({\n    id: \"products-page-prev\",\n    role: \"button\",\n    label: \"Previous products page\",\n    group: \"products\",\n    description: \"Go to the previous page of products\",\n    onActivate: () => onPageChange(page - 1),\n  });\n  const nextPageButton = useAgentElement<HTMLButtonElement>({\n    id: \"products-page-next\",\n    role: \"button\",\n    label: \"Next products page\",\n    group: \"products\",\n    description: \"Go to the next page of products\",\n    onActivate: () => onPageChange(page + 1),\n  });\n\n  return (\n    <div className=\"space-y-3\">\n      <div className=\"flex items-center justify-between gap-2\">\n        <p\n          data-testid=\"chat-search-hint\"\n          className=\"sr-only text-[13px] leading-relaxed text-txt/60\"\n        >\n          Search products by typing in the chat.\n        </p>\n        <Button\n          ref={createButton.ref}\n          type=\"button\"\n          size=\"sm\"\n          onClick={() => setCreateOpen(true)}\n          className=\"shrink-0 gap-1.5\"\n          {...createButton.agentProps}\n        >\n          <Plus className=\"h-4 w-4\" />\n          Create\n        </Button>\n      </div>\n\n      {error ? (\n        <div className=\"px-1 py-2 text-sm text-danger\">{error}</div>\n      ) : null}\n\n      {loading && products.length === 0 ? (\n        <div className=\"space-y-2\">\n          {Array.from({ length: 6 }, (_, i) => i).map((i) => (\n            <Skeleton key={i} className=\"h-16 w-full\" />\n          ))}\n        </div>\n      ) : products.length === 0 ? (\n        <div className=\"flex flex-col items-center gap-3 py-10 text-center\">\n          <Package className=\"h-8 w-8 text-muted/40\" />\n          <div className=\"text-sm text-muted\">None</div>\n        </div>\n      ) : (\n        <div className=\"space-y-1.5\">\n          {products.map((product) => (\n            <ProductRow key={product.id} product={product} />\n          ))}\n        </div>\n      )}\n\n      {total > PAGE_SIZE ? (\n        <div className=\"flex items-center justify-between pt-1\">\n          <span className=\"text-xs text-muted\">\n            {total.toLocaleString()} products · page {page} of {totalPages}\n          </span>\n          <div className=\"flex items-center gap-1.5\">\n            <Button\n              ref={prevPageButton.ref}\n              type=\"button\"\n              variant=\"outline\"\n              size=\"icon\"\n              className=\"h-8 w-8\"\n              disabled={page <= 1 || loading}\n              onClick={() => onPageChange(page - 1)}\n              aria-label=\"Previous page\"\n              {...prevPageButton.agentProps}\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n            </Button>\n            <Button\n              ref={nextPageButton.ref}\n              type=\"button\"\n              variant=\"outline\"\n              size=\"icon\"\n              className=\"h-8 w-8\"\n              disabled={page >= totalPages || loading}\n              onClick={() => onPageChange(page + 1)}\n              aria-label=\"Next page\"\n              {...nextPageButton.agentProps}\n            >\n              <ChevronRight className=\"h-4 w-4\" />\n            </Button>\n          </div>\n        </div>\n      ) : null}\n\n      <CreateProductDialog\n        open={createOpen}\n        onClose={() => setCreateOpen(false)}\n      />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/ShopifyAppView.d.ts

@@ -0,0 +1,3 @@
+import type { OverlayAppContext } from "@elizaos/ui";
+export declare function ShopifyAppView({ exitToApps }: OverlayAppContext): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ShopifyAppView.d.ts.map

package/dist/ShopifyAppView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShopifyAppView.d.ts","sourceRoot":"","sources":["../src/ShopifyAppView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AA6VrD,wBAAgB,cAAc,CAAC,EAAE,UAAU,EAAE,EAAE,iBAAiB,2CA2V/D"}

package/dist/ShopifyAppView.helpers.d.ts

@@ -0,0 +1,11 @@
+import type { ShopifyCustomersResponse, ShopifyInventoryResponse, ShopifyOrdersResponse, ShopifyProductsResponse, ShopifyStatus } from "./useShopifyDashboard";
+export declare function fetchShopifyTuiJson<T>(url: string): Promise<T | null>;
+export declare function postShopifyTuiJson(url: string, body: Record<string, unknown>): Promise<unknown>;
+export declare function loadShopifyTuiState(): Promise<{
+    status: ShopifyStatus;
+    products: ShopifyProductsResponse | null;
+    orders: ShopifyOrdersResponse | null;
+    inventory: ShopifyInventoryResponse | null;
+    customers: ShopifyCustomersResponse | null;
+}>;
+//# sourceMappingURL=ShopifyAppView.helpers.d.ts.map

package/dist/ShopifyAppView.helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShopifyAppView.helpers.d.ts","sourceRoot":"","sources":["../src/ShopifyAppView.helpers.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,wBAAwB,EACxB,wBAAwB,EACxB,qBAAqB,EACrB,uBAAuB,EACvB,aAAa,EACd,MAAM,uBAAuB,CAAC;AAE/B,wBAAsB,mBAAmB,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC,GAAG,IAAI,CAAC,CAY3E;AAED,wBAAsB,kBAAkB,CACtC,GAAG,EAAE,MAAM,EACX,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC5B,OAAO,CAAC,OAAO,CAAC,CAelB;AAED,wBAAsB,mBAAmB,IAAI,OAAO,CAAC;IACnD,MAAM,EAAE,aAAa,CAAC;IACtB,QAAQ,EAAE,uBAAuB,GAAG,IAAI,CAAC;IACzC,MAAM,EAAE,qBAAqB,GAAG,IAAI,CAAC;IACrC,SAAS,EAAE,wBAAwB,GAAG,IAAI,CAAC;IAC3C,SAAS,EAAE,wBAAwB,GAAG,IAAI,CAAC;CAC5C,CAAC,CAgCD"}

package/dist/ShopifyAppView.helpers.js

@@ -0,0 +1,59 @@
+async function fetchShopifyTuiJson(url) {
+  const response = await fetch(url);
+  if (response.status === 404) return null;
+  const data = await response.json().catch(() => null);
+  if (!response.ok) {
+    const message = data && typeof data === "object" && "error" in data ? String(data.error) : `Shopify request failed with ${response.status}`;
+    throw new Error(message);
+  }
+  return data;
+}
+async function postShopifyTuiJson(url, body) {
+  const response = await fetch(url, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  const data = await response.json().catch(() => ({}));
+  if (!response.ok) {
+    const message = data && typeof data === "object" && "error" in data ? String(data.error) : `Shopify request failed with ${response.status}`;
+    throw new Error(message);
+  }
+  return data;
+}
+async function loadShopifyTuiState() {
+  const status = await fetchShopifyTuiJson(
+    "/api/shopify/status"
+  ) ?? {
+    connected: false,
+    shop: null
+  };
+  if (!status.connected) {
+    return {
+      status,
+      products: null,
+      orders: null,
+      inventory: null,
+      customers: null
+    };
+  }
+  const [products, orders, inventory, customers] = await Promise.all([
+    fetchShopifyTuiJson(
+      "/api/shopify/products?page=1&limit=10&q="
+    ),
+    fetchShopifyTuiJson(
+      "/api/shopify/orders?status=any&limit=10"
+    ),
+    fetchShopifyTuiJson("/api/shopify/inventory"),
+    fetchShopifyTuiJson(
+      "/api/shopify/customers?q=&limit=10"
+    )
+  ]);
+  return { status, products, orders, inventory, customers };
+}
+export {
+  fetchShopifyTuiJson,
+  loadShopifyTuiState,
+  postShopifyTuiJson
+};
+//# sourceMappingURL=ShopifyAppView.helpers.js.map

package/dist/ShopifyAppView.helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/ShopifyAppView.helpers.ts"],"sourcesContent":["// Shared fetch helpers for the Shopify view, used by the `interact` capability\n// handler (in ShopifyAppView.interact.ts). Kept out of the .tsx so that file\n// exports only React components and stays Fast-Refresh-compatible in dev.\nimport type {\n  ShopifyCustomersResponse,\n  ShopifyInventoryResponse,\n  ShopifyOrdersResponse,\n  ShopifyProductsResponse,\n  ShopifyStatus,\n} from \"./useShopifyDashboard.js\";\n\nexport async function fetchShopifyTuiJson<T>(url: string): Promise<T | null> {\n  const response = await fetch(url);\n  if (response.status === 404) return null;\n  const data = await response.json().catch(() => null);\n  if (!response.ok) {\n    const message =\n      data && typeof data === \"object\" && \"error\" in data\n        ? String(data.error)\n        : `Shopify request failed with ${response.status}`;\n    throw new Error(message);\n  }\n  return data as T;\n}\n\nexport async function postShopifyTuiJson(\n  url: string,\n  body: Record<string, unknown>,\n): Promise<unknown> {\n  const response = await fetch(url, {\n    method: \"POST\",\n    headers: { \"Content-Type\": \"application/json\" },\n    body: JSON.stringify(body),\n  });\n  const data = await response.json().catch(() => ({}));\n  if (!response.ok) {\n    const message =\n      data && typeof data === \"object\" && \"error\" in data\n        ? String(data.error)\n        : `Shopify request failed with ${response.status}`;\n    throw new Error(message);\n  }\n  return data;\n}\n\nexport async function loadShopifyTuiState(): Promise<{\n  status: ShopifyStatus;\n  products: ShopifyProductsResponse | null;\n  orders: ShopifyOrdersResponse | null;\n  inventory: ShopifyInventoryResponse | null;\n  customers: ShopifyCustomersResponse | null;\n}> {\n  const status = (await fetchShopifyTuiJson<ShopifyStatus>(\n    \"/api/shopify/status\",\n  )) ?? {\n    connected: false,\n    shop: null,\n  };\n\n  if (!status.connected) {\n    return {\n      status,\n      products: null,\n      orders: null,\n      inventory: null,\n      customers: null,\n    };\n  }\n\n  const [products, orders, inventory, customers] = await Promise.all([\n    fetchShopifyTuiJson<ShopifyProductsResponse>(\n      \"/api/shopify/products?page=1&limit=10&q=\",\n    ),\n    fetchShopifyTuiJson<ShopifyOrdersResponse>(\n      \"/api/shopify/orders?status=any&limit=10\",\n    ),\n    fetchShopifyTuiJson<ShopifyInventoryResponse>(\"/api/shopify/inventory\"),\n    fetchShopifyTuiJson<ShopifyCustomersResponse>(\n      \"/api/shopify/customers?q=&limit=10\",\n    ),\n  ]);\n\n  return { status, products, orders, inventory, customers };\n}\n"],"mappings":"AAWA,eAAsB,oBAAuB,KAAgC;AAC3E,QAAM,WAAW,MAAM,MAAM,GAAG;AAChC,MAAI,SAAS,WAAW,IAAK,QAAO;AACpC,QAAM,OAAO,MAAM,SAAS,KAAK,EAAE,MAAM,MAAM,IAAI;AACnD,MAAI,CAAC,SAAS,IAAI;AAChB,UAAM,UACJ,QAAQ,OAAO,SAAS,YAAY,WAAW,OAC3C,OAAO,KAAK,KAAK,IACjB,+BAA+B,SAAS,MAAM;AACpD,UAAM,IAAI,MAAM,OAAO;AAAA,EACzB;AACA,SAAO;AACT;AAEA,eAAsB,mBACpB,KACA,MACkB;AAClB,QAAM,WAAW,MAAM,MAAM,KAAK;AAAA,IAChC,QAAQ;AAAA,IACR,SAAS,EAAE,gBAAgB,mBAAmB;AAAA,IAC9C,MAAM,KAAK,UAAU,IAAI;AAAA,EAC3B,CAAC;AACD,QAAM,OAAO,MAAM,SAAS,KAAK,EAAE,MAAM,OAAO,CAAC,EAAE;AACnD,MAAI,CAAC,SAAS,IAAI;AAChB,UAAM,UACJ,QAAQ,OAAO,SAAS,YAAY,WAAW,OAC3C,OAAO,KAAK,KAAK,IACjB,+BAA+B,SAAS,MAAM;AACpD,UAAM,IAAI,MAAM,OAAO;AAAA,EACzB;AACA,SAAO;AACT;AAEA,eAAsB,sBAMnB;AACD,QAAM,SAAU,MAAM;AAAA,IACpB;AAAA,EACF,KAAM;AAAA,IACJ,WAAW;AAAA,IACX,MAAM;AAAA,EACR;AAEA,MAAI,CAAC,OAAO,WAAW;AACrB,WAAO;AAAA,MACL;AAAA,MACA,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,WAAW;AAAA,IACb;AAAA,EACF;AAEA,QAAM,CAAC,UAAU,QAAQ,WAAW,SAAS,IAAI,MAAM,QAAQ,IAAI;AAAA,IACjE;AAAA,MACE;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,IACF;AAAA,IACA,oBAA8C,wBAAwB;AAAA,IACtE;AAAA,MACE;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAO,EAAE,QAAQ,UAAU,QAAQ,WAAW,UAAU;AAC1D;","names":[]}

package/dist/ShopifyAppView.interact.d.ts

@@ -0,0 +1,2 @@
+export declare function interact(capability: string, params?: Record<string, unknown>): Promise<unknown>;
+//# sourceMappingURL=ShopifyAppView.interact.d.ts.map

package/dist/ShopifyAppView.interact.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShopifyAppView.interact.d.ts","sourceRoot":"","sources":["../src/ShopifyAppView.interact.ts"],"names":[],"mappings":"AAgBA,wBAAsB,QAAQ,CAC5B,UAAU,EAAE,MAAM,EAClB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC/B,OAAO,CAAC,OAAO,CAAC,CAqGlB"}

package/dist/ShopifyAppView.interact.js

@@ -0,0 +1,93 @@
+import {
+  fetchShopifyTuiJson,
+  loadShopifyTuiState,
+  postShopifyTuiJson
+} from "./ShopifyAppView.helpers";
+async function interact(capability, params) {
+  if (capability === "terminal-shopify-state") {
+    return { viewType: "tui", ...await loadShopifyTuiState() };
+  }
+  if (capability === "terminal-shopify-products") {
+    const query = typeof params?.query === "string" ? params.query.trim() : "";
+    const page = typeof params?.page === "number" ? params.page : 1;
+    const limit = typeof params?.limit === "number" ? params.limit : 20;
+    return {
+      viewType: "tui",
+      products: await fetchShopifyTuiJson(
+        `/api/shopify/products?${new URLSearchParams({
+          page: String(page),
+          limit: String(limit),
+          q: query
+        })}`
+      )
+    };
+  }
+  if (capability === "terminal-shopify-orders") {
+    const status = typeof params?.status === "string" ? params.status.trim() : "any";
+    const limit = typeof params?.limit === "number" ? params.limit : 20;
+    return {
+      viewType: "tui",
+      orders: await fetchShopifyTuiJson(
+        `/api/shopify/orders?${new URLSearchParams({
+          status,
+          limit: String(limit)
+        })}`
+      )
+    };
+  }
+  if (capability === "terminal-shopify-inventory") {
+    return {
+      viewType: "tui",
+      inventory: await fetchShopifyTuiJson(
+        "/api/shopify/inventory"
+      )
+    };
+  }
+  if (capability === "terminal-shopify-customers") {
+    const query = typeof params?.query === "string" ? params.query.trim() : "";
+    const limit = typeof params?.limit === "number" ? params.limit : 20;
+    return {
+      viewType: "tui",
+      customers: await fetchShopifyTuiJson(
+        `/api/shopify/customers?${new URLSearchParams({
+          q: query,
+          limit: String(limit)
+        })}`
+      )
+    };
+  }
+  if (capability === "terminal-shopify-create-product") {
+    const title = typeof params?.title === "string" ? params.title.trim() : "";
+    if (!title) throw new Error("title is required");
+    return {
+      viewType: "tui",
+      product: await postShopifyTuiJson("/api/shopify/products", {
+        title,
+        vendor: typeof params?.vendor === "string" ? params.vendor : void 0,
+        productType: typeof params?.productType === "string" ? params.productType : void 0,
+        price: typeof params?.price === "string" || typeof params?.price === "number" ? params.price : void 0
+      })
+    };
+  }
+  if (capability === "terminal-shopify-adjust-inventory") {
+    const itemId = typeof params?.itemId === "string" ? params.itemId.trim() : "";
+    const delta = typeof params?.delta === "number" ? params.delta : null;
+    if (!itemId) throw new Error("itemId is required");
+    if (delta === null) throw new Error("delta is required");
+    return {
+      viewType: "tui",
+      inventory: await postShopifyTuiJson(
+        `/api/shopify/inventory/${encodeURIComponent(itemId)}/adjust`,
+        {
+          delta,
+          locationId: typeof params?.locationId === "string" ? params.locationId : void 0
+        }
+      )
+    };
+  }
+  throw new Error(`Unsupported capability "${capability}"`);
+}
+export {
+  interact
+};
+//# sourceMappingURL=ShopifyAppView.interact.js.map