@withpotter/components 0.13.0-next.101

package/dist/discount-editor/product-scope-picker.js

@@ -0,0 +1,246 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { X, Check, Package } from "lucide-react";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { inventoryApi } from "@withpotter/lib/api/inventory";
+import { SearchField } from "@withpotter/ui-kit/search-field";
+import { OptionButton, EmptyNote } from "@withpotter/ui-kit";
+const CHIP = "inline-flex items-center gap-2 rounded-full bg-[var(--accent-secondary)] py-1 pl-1 pr-3 text-xs text-[var(--accent-secondary-ink)]";
+function imageUrl(image) {
+  if (!image) return void 0;
+  return typeof image === "string" ? image : image.thumbnail ?? image.url;
+}
+function ProductThumb({
+  product,
+  size = 20
+}) {
+  const src = imageUrl(product?.image);
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "inline-block shrink-0 overflow-hidden rounded-full bg-[var(--bg-muted)]",
+      style: { width: size, height: size },
+      children: src ? (
+        // eslint-disable-next-line @next/next/no-img-element
+        /* @__PURE__ */ jsx(
+          "img",
+          {
+            src,
+            alt: "",
+            loading: "lazy",
+            decoding: "async",
+            className: "h-full w-full object-cover"
+          }
+        )
+      ) : /* @__PURE__ */ jsx("span", { className: "grid h-full w-full place-items-center", children: /* @__PURE__ */ jsx(
+        Package,
+        {
+          className: "text-[var(--text-tertiary)]",
+          style: { width: size * 0.55, height: size * 0.55 }
+        }
+      ) })
+    }
+  );
+}
+const INPUT = "w-full rounded-md border border-[var(--border-default)] py-2 pl-9 pr-3 text-sm outline-none focus:border-brand-500 focus:ring-1 focus:ring-brand-500";
+function ProductScopePicker({
+  conditions,
+  onChange
+}) {
+  const productIds = conditions.productIds ?? [];
+  const categoryIds = conditions.categoryIds ?? [];
+  const excludedProductIds = conditions.excludedProductIds ?? [];
+  const initialScope = productIds.length > 0 ? "products" : categoryIds.length > 0 ? "categories" : "all";
+  const [scope, setScope] = useState(initialScope);
+  const [query, setQuery] = useState("");
+  const [showExclusions, setShowExclusions] = useState(
+    excludedProductIds.length > 0
+  );
+  const needsProducts = scope !== "all" || showExclusions;
+  const { data } = useApiQuery(
+    ["discount-scope-products", { query }],
+    (slug) => inventoryApi.list(
+      slug,
+      { search: query || void 0, limit: 50 },
+      { assignedOnly: false }
+    ),
+    { staleTime: 6e4, enabled: needsProducts }
+  );
+  const products = data?.items ?? [];
+  const productById = useMemo(() => {
+    const m = /* @__PURE__ */ new Map();
+    for (const p of products) m.set(p.id, p);
+    return m;
+  }, [products]);
+  const categories = useMemo(() => {
+    const set = /* @__PURE__ */ new Set();
+    for (const p of products) if (p.category) set.add(p.category);
+    for (const c of categoryIds) set.add(c);
+    return Array.from(set).sort();
+  }, [products, categoryIds]);
+  const setScopeMode = (next) => {
+    setScope(next);
+    if (next === "all")
+      onChange({
+        ...conditions,
+        productIds: void 0,
+        categoryIds: void 0
+      });
+    if (next === "products")
+      onChange({ ...conditions, categoryIds: void 0 });
+    if (next === "categories")
+      onChange({ ...conditions, productIds: void 0 });
+  };
+  const toggle = (key, id) => {
+    const current = conditions[key] ?? [];
+    const next = current.includes(id) ? current.filter((x) => x !== id) : [...current, id];
+    onChange({ ...conditions, [key]: next.length ? next : void 0 });
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-[var(--text-secondary)]", children: "Applies to" }),
+    /* @__PURE__ */ jsx("div", { className: "inline-flex rounded-md border border-[var(--border-default)] p-0.5", children: [
+      ["all", "All products"],
+      ["products", "Specific products"],
+      ["categories", "Categories"]
+    ].map(([value, label]) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setScopeMode(value),
+        className: `rounded px-3 py-2 text-sm transition-colors ${scope === value ? "bg-brand-500 text-white" : "text-[var(--text-secondary)] hover:bg-[var(--interactive-hover)]"}`,
+        children: label
+      },
+      value
+    )) }),
+    scope === "products" && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      productIds.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: productIds.map((id) => /* @__PURE__ */ jsxs("span", { className: CHIP, children: [
+        /* @__PURE__ */ jsx(ProductThumb, { product: productById.get(id) }),
+        productById.get(id)?.title ?? "Product no longer in stock list",
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => toggle("productIds", id),
+            "aria-label": "Remove",
+            children: /* @__PURE__ */ jsx(X, {})
+          }
+        )
+      ] }, id)) }),
+      /* @__PURE__ */ jsx(
+        ProductSearch,
+        {
+          query,
+          setQuery,
+          products,
+          selectedIds: productIds,
+          onToggle: (id) => toggle("productIds", id)
+        }
+      )
+    ] }),
+    scope === "categories" && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+      categories.length === 0 && /* @__PURE__ */ jsx(EmptyNote, { children: "No product categories found yet." }),
+      categories.map((c) => {
+        const on = categoryIds.includes(c);
+        return /* @__PURE__ */ jsx(
+          OptionButton,
+          {
+            selected: on,
+            onClick: () => toggle("categoryIds", c),
+            children: c
+          },
+          c
+        );
+      })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "pt-1", children: !showExclusions ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setShowExclusions(true),
+        className: "text-xs text-brand-500 hover:underline",
+        children: "+ Exclude specific products"
+      }
+    ) : /* @__PURE__ */ jsxs("div", { className: "space-y-2 rounded-md border border-[var(--border-subtle)] p-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-[var(--text-secondary)]", children: "Excluded products" }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              setShowExclusions(false);
+              onChange({ ...conditions, excludedProductIds: void 0 });
+            },
+            className: "text-xs text-[var(--text-muted)] hover:text-[var(--text-secondary)]",
+            children: "Clear"
+          }
+        )
+      ] }),
+      excludedProductIds.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: excludedProductIds.map((id) => /* @__PURE__ */ jsxs("span", { className: CHIP, children: [
+        /* @__PURE__ */ jsx(ProductThumb, { product: productById.get(id) }),
+        productById.get(id)?.title ?? "Product no longer in stock list",
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => toggle("excludedProductIds", id),
+            "aria-label": "Remove",
+            children: /* @__PURE__ */ jsx(X, {})
+          }
+        )
+      ] }, id)) }),
+      /* @__PURE__ */ jsx(
+        ProductSearch,
+        {
+          query,
+          setQuery,
+          products,
+          selectedIds: excludedProductIds,
+          onToggle: (id) => toggle("excludedProductIds", id)
+        }
+      )
+    ] }) })
+  ] });
+}
+function ProductSearch({
+  query,
+  setQuery,
+  products,
+  selectedIds,
+  onToggle
+}) {
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      SearchField,
+      {
+        value: query,
+        onChange: setQuery,
+        placeholder: "Search products\u2026"
+      }
+    ),
+    products.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-2 max-h-48 overflow-y-auto rounded-md border border-[var(--border-subtle)]", children: products.map((p) => {
+      const on = selectedIds.includes(p.id);
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: () => onToggle(p.id),
+          className: "flex w-full items-center justify-between gap-2 px-3 py-2 text-left text-sm hover:bg-[var(--interactive-hover)]",
+          children: [
+            /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-3", children: [
+              /* @__PURE__ */ jsx(ProductThumb, { product: p, size: 28 }),
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-[var(--text-primary)]", children: p.title })
+            ] }),
+            on && /* @__PURE__ */ jsx(Check, { className: "size-4 shrink-0 text-brand-500" })
+          ]
+        },
+        p.id
+      );
+    }) })
+  ] });
+}
+export {
+  ProductScopePicker
+};
+//# sourceMappingURL=product-scope-picker.js.map

package/dist/discount-editor/product-scope-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/discount-editor/product-scope-picker.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\nimport { X, Check, Package } from 'lucide-react';\nimport { useApiQuery } from '@withpotter/hooks/use-api-query';\nimport { inventoryApi } from '@withpotter/lib/api/inventory';\nimport type { DiscountConditions, InventoryProduct } from '@withpotter/lib/api/types';\nimport { SearchField } from '@withpotter/ui-kit/search-field';\nimport { OptionButton, EmptyNote } from '@withpotter/ui-kit';\n\ntype Scope = 'all' | 'products' | 'categories';\n\ninterface ProductScopePickerProps {\n  conditions: DiscountConditions;\n  onChange: (next: DiscountConditions) => void;\n}\n\nconst CHIP =\n  'inline-flex items-center gap-2 rounded-full bg-[var(--accent-secondary)] py-1 pl-1 pr-3 text-xs text-[var(--accent-secondary-ink)]';\n\n/** InventoryProduct.image is either a URL or a media object. */\nfunction imageUrl(image: InventoryProduct['image']): string | undefined {\n  if (!image) return undefined;\n  return typeof image === 'string' ? image : (image.thumbnail ?? image.url);\n}\n\n/**\n * A product as a picture, not a UUID.\n *\n * Scope used to render as text chips holding whatever title happened to be in\n * the loaded page, falling back to the raw id when it was not — so a merchant\n * checking they had picked the right three items could be reading three UUIDs.\n */\nfunction ProductThumb({\n  product,\n  size = 20,\n}: {\n  product?: Pick<InventoryProduct, 'title' | 'image'>;\n  size?: number;\n}) {\n  const src = imageUrl(product?.image);\n  return (\n    <span\n      className=\"inline-block shrink-0 overflow-hidden rounded-full bg-[var(--bg-muted)]\"\n      style={{ width: size, height: size }}\n    >\n      {src ? (\n        // eslint-disable-next-line @next/next/no-img-element\n        <img\n          src={src}\n          alt=\"\"\n          loading=\"lazy\"\n          decoding=\"async\"\n          className=\"h-full w-full object-cover\"\n        />\n      ) : (\n        <span className=\"grid h-full w-full place-items-center\">\n          <Package className=\"text-[var(--text-tertiary)]\"\n            style={{ width: size * 0.55, height: size * 0.55 }}\n          />\n        </span>\n      )}\n    </span>\n  );\n}\nconst INPUT =\n  'w-full rounded-md border border-[var(--border-default)] py-2 pl-9 pr-3 text-sm outline-none focus:border-brand-500 focus:ring-1 focus:ring-brand-500';\n\nexport function ProductScopePicker({\n  conditions,\n  onChange,\n}: ProductScopePickerProps) {\n  const productIds = conditions.productIds ?? [];\n  const categoryIds = conditions.categoryIds ?? [];\n  const excludedProductIds = conditions.excludedProductIds ?? [];\n\n  const initialScope: Scope =\n    productIds.length > 0\n      ? 'products'\n      : categoryIds.length > 0\n        ? 'categories'\n        : 'all';\n  const [scope, setScope] = useState<Scope>(initialScope);\n  const [query, setQuery] = useState('');\n  const [showExclusions, setShowExclusions] = useState(\n    excludedProductIds.length > 0,\n  );\n\n  // Gated on the scope actually needing products. This fired on every mount —\n  // so opening \"New discount\", where the scope defaults to \"all\", pulled 50\n  // products and their images before you had typed a name. Nothing on screen\n  // used them until you chose Products or Categories.\n  const needsProducts = scope !== 'all' || showExclusions;\n  const { data } = useApiQuery(\n    ['discount-scope-products', { query }],\n    (slug) =>\n      inventoryApi.list(\n        slug,\n        { search: query || undefined, limit: 50 },\n        { assignedOnly: false },\n      ),\n    { staleTime: 60_000, enabled: needsProducts },\n  );\n  const products = data?.items ?? [];\n\n  // The whole product for each loaded id, so a chip can show its picture and\n  // its name rather than falling back to the raw id.\n  const productById = useMemo(() => {\n    const m = new Map<string, InventoryProduct>();\n    for (const p of products) m.set(p.id, p);\n    return m;\n  }, [products]);\n\n  // Distinct categories derived from the loaded products (no category endpoint\n  // exists — category is a free-text field on products).\n  const categories = useMemo(() => {\n    const set = new Set<string>();\n    for (const p of products) if (p.category) set.add(p.category);\n    for (const c of categoryIds) set.add(c);\n    return Array.from(set).sort();\n  }, [products, categoryIds]);\n\n  const setScopeMode = (next: Scope) => {\n    setScope(next);\n    // Clearing the other dimension keeps the rule unambiguous.\n    if (next === 'all')\n      onChange({\n        ...conditions,\n        productIds: undefined,\n        categoryIds: undefined,\n      });\n    if (next === 'products')\n      onChange({ ...conditions, categoryIds: undefined });\n    if (next === 'categories')\n      onChange({ ...conditions, productIds: undefined });\n  };\n\n  const toggle = (\n    key: 'productIds' | 'categoryIds' | 'excludedProductIds',\n    id: string,\n  ) => {\n    const current = conditions[key] ?? [];\n    const next = current.includes(id)\n      ? current.filter((x) => x !== id)\n      : [...current, id];\n    onChange({ ...conditions, [key]: next.length ? next : undefined });\n  };\n\n  return (\n    <div className=\"space-y-3\">\n      <label className=\"block text-sm font-medium text-[var(--text-secondary)]\">\n        Applies to\n      </label>\n      <div className=\"inline-flex rounded-md border border-[var(--border-default)] p-0.5\">\n        {(\n          [\n            ['all', 'All products'],\n            ['products', 'Specific products'],\n            ['categories', 'Categories'],\n          ] as [Scope, string][]\n        ).map(([value, label]) => (\n          <button\n            key={value}\n            type=\"button\"\n            onClick={() => setScopeMode(value)}\n            className={`rounded px-3 py-2 text-sm transition-colors ${\n              scope === value\n                ? 'bg-brand-500 text-white'\n                : 'text-[var(--text-secondary)] hover:bg-[var(--interactive-hover)]'\n            }`}\n          >\n            {label}\n          </button>\n        ))}\n      </div>\n\n      {scope === 'products' && (\n        <div className=\"space-y-2\">\n          {productIds.length > 0 && (\n            <div className=\"flex flex-wrap gap-2\">\n              {productIds.map((id) => (\n                <span key={id} className={CHIP}>\n                  <ProductThumb product={productById.get(id)} />\n                  {productById.get(id)?.title ??\n                    'Product no longer in stock list'}\n                  <button\n                    type=\"button\"\n                    onClick={() => toggle('productIds', id)}\n                    aria-label=\"Remove\"\n                  >\n                    <X />\n                  </button>\n                </span>\n              ))}\n            </div>\n          )}\n          <ProductSearch\n            query={query}\n            setQuery={setQuery}\n            products={products}\n            selectedIds={productIds}\n            onToggle={(id) => toggle('productIds', id)}\n          />\n        </div>\n      )}\n\n      {scope === 'categories' && (\n        <div className=\"flex flex-wrap gap-2\">\n          {categories.length === 0 && (\n            <EmptyNote>No product categories found yet.</EmptyNote>\n          )}\n          {categories.map((c) => {\n            const on = categoryIds.includes(c);\n            return (\n              <OptionButton\n                key={c}\n                selected={on}\n                onClick={() => toggle('categoryIds', c)}\n              >\n                {c}\n              </OptionButton>\n            );\n          })}\n        </div>\n      )}\n\n      {/* Exclusions — applies within any scope */}\n      <div className=\"pt-1\">\n        {!showExclusions ? (\n          <button\n            type=\"button\"\n            onClick={() => setShowExclusions(true)}\n            className=\"text-xs text-brand-500 hover:underline\"\n          >\n            + Exclude specific products\n          </button>\n        ) : (\n          <div className=\"space-y-2 rounded-md border border-[var(--border-subtle)] p-3\">\n            <div className=\"flex items-center justify-between\">\n              <span className=\"text-xs font-medium text-[var(--text-secondary)]\">\n                Excluded products\n              </span>\n              <button\n                type=\"button\"\n                onClick={() => {\n                  setShowExclusions(false);\n                  onChange({ ...conditions, excludedProductIds: undefined });\n                }}\n                className=\"text-xs text-[var(--text-muted)] hover:text-[var(--text-secondary)]\"\n              >\n                Clear\n              </button>\n            </div>\n            {excludedProductIds.length > 0 && (\n              <div className=\"flex flex-wrap gap-2\">\n                {excludedProductIds.map((id) => (\n                  <span key={id} className={CHIP}>\n                    <ProductThumb product={productById.get(id)} />\n                    {productById.get(id)?.title ??\n                      'Product no longer in stock list'}\n                    <button\n                      type=\"button\"\n                      onClick={() => toggle('excludedProductIds', id)}\n                      aria-label=\"Remove\"\n                    >\n                      <X />\n                    </button>\n                  </span>\n                ))}\n              </div>\n            )}\n            <ProductSearch\n              query={query}\n              setQuery={setQuery}\n              products={products}\n              selectedIds={excludedProductIds}\n              onToggle={(id) => toggle('excludedProductIds', id)}\n            />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction ProductSearch({\n  query,\n  setQuery,\n  products,\n  selectedIds,\n  onToggle,\n}: {\n  query: string;\n  setQuery: (v: string) => void;\n  products: InventoryProduct[];\n  selectedIds: string[];\n  onToggle: (id: string) => void;\n}) {\n  return (\n    <div>\n      <SearchField\n        value={query}\n        onChange={setQuery}\n        placeholder=\"Search products…\"\n      />\n      {products.length > 0 && (\n        <div className=\"mt-2 max-h-48 overflow-y-auto rounded-md border border-[var(--border-subtle)]\">\n          {products.map((p) => {\n            const on = selectedIds.includes(p.id);\n            return (\n              <button\n                key={p.id}\n                type=\"button\"\n                onClick={() => onToggle(p.id)}\n                className=\"flex w-full items-center justify-between gap-2 px-3 py-2 text-left text-sm hover:bg-[var(--interactive-hover)]\"\n              >\n                <span className=\"flex min-w-0 items-center gap-3\">\n                  <ProductThumb product={p} size={28} />\n                  <span className=\"min-w-0 truncate text-[var(--text-primary)]\">\n                    {p.title}\n                  </span>\n                </span>\n                {on && <Check className=\"size-4 shrink-0 text-brand-500\" />}\n              </button>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/discount-editor/tier-gate-picker.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Reserve a code for particular loyalty tiers.
+ *
+ * "Members only" answers whether someone is signed in. A tiered programme wants
+ * the next question — whether they reached Gold — and until now there was no
+ * way to express it, so a merchant running tiers had to police it by hand or
+ * not offer the reward at all.
+ *
+ * Selecting nothing means everyone, which is why there is no "All tiers"
+ * option: an empty selection already says it, and a checkbox that has to be
+ * ticked to mean "no restriction" is a trap.
+ *
+ * The control hides itself when the tenant has no tiers. Offering a gate with
+ * nothing to gate on is how a form teaches people that its settings do not do
+ * anything.
+ */
+export declare function TierGatePicker({ selectedTierIds, onChange, }: {
+    selectedTierIds: string[];
+    onChange: (ids: string[]) => void;
+}): import("react").JSX.Element | null;

package/dist/discount-editor/tier-gate-picker.js

@@ -0,0 +1,68 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import Link from "next/link";
+import { loyaltyApi } from "@withpotter/lib/api/loyalty";
+import { Checkbox } from "@withpotter/ui-kit/checkbox";
+import { useAuth } from "@withpotter/lib/auth-context";
+function TierGatePicker({
+  selectedTierIds,
+  onChange
+}) {
+  const { tenant } = useAuth();
+  const [tiers, setTiers] = useState(null);
+  useEffect(() => {
+    if (!tenant?.slug) return;
+    let cancelled = false;
+    loyaltyApi.listTiers(tenant.slug).then((t) => {
+      if (cancelled) return;
+      setTiers(
+        [...t].sort((a, b) => a.minLifetimePoints - b.minLifetimePoints)
+      );
+    }).catch(() => {
+      if (!cancelled) setTiers(null);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [tenant?.slug]);
+  if (!tiers) return null;
+  if (tiers.length === 0) {
+    return /* @__PURE__ */ jsxs("p", { className: "text-xs text-[var(--text-tertiary)]", children: [
+      "No loyalty tiers yet.",
+      " ",
+      /* @__PURE__ */ jsx(
+        Link,
+        {
+          href: "/dashboard/loyalty",
+          className: "text-brand-500 hover:underline",
+          children: "Set some up"
+        }
+      ),
+      " ",
+      "to reserve a code for your best customers."
+    ] });
+  }
+  const toggle = (id) => {
+    onChange(
+      selectedTierIds.includes(id) ? selectedTierIds.filter((t) => t !== id) : [...selectedTierIds, id]
+    );
+  };
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("span", { className: "mb-1 block text-sm font-medium text-[var(--text-secondary)]", children: "Reserved for tiers" }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-x-4 gap-y-2", children: tiers.map((tier) => /* @__PURE__ */ jsx(
+      Checkbox,
+      {
+        checked: selectedTierIds.includes(tier.id),
+        onChange: () => toggle(tier.id),
+        label: tier.name
+      },
+      tier.id
+    )) }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-[var(--text-tertiary)]", children: selectedTierIds.length === 0 ? "Anyone can use this code." : "Only customers on the ticked tiers can use it." })
+  ] });
+}
+export {
+  TierGatePicker
+};
+//# sourceMappingURL=tier-gate-picker.js.map

package/dist/discount-editor/tier-gate-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/discount-editor/tier-gate-picker.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\nimport Link from 'next/link';\nimport { loyaltyApi } from '@withpotter/lib/api/loyalty';\nimport type { LoyaltyTier } from '@withpotter/lib/api/types';\nimport { Checkbox } from '@withpotter/ui-kit/checkbox';\nimport { useAuth } from '@withpotter/lib/auth-context';\n\n/**\n * Reserve a code for particular loyalty tiers.\n *\n * \"Members only\" answers whether someone is signed in. A tiered programme wants\n * the next question — whether they reached Gold — and until now there was no\n * way to express it, so a merchant running tiers had to police it by hand or\n * not offer the reward at all.\n *\n * Selecting nothing means everyone, which is why there is no \"All tiers\"\n * option: an empty selection already says it, and a checkbox that has to be\n * ticked to mean \"no restriction\" is a trap.\n *\n * The control hides itself when the tenant has no tiers. Offering a gate with\n * nothing to gate on is how a form teaches people that its settings do not do\n * anything.\n */\nexport function TierGatePicker({\n  selectedTierIds,\n  onChange,\n}: {\n  selectedTierIds: string[];\n  onChange: (ids: string[]) => void;\n}) {\n  const { tenant } = useAuth();\n  const [tiers, setTiers] = useState<LoyaltyTier[] | null>(null);\n\n  useEffect(() => {\n    if (!tenant?.slug) return;\n    let cancelled = false;\n    loyaltyApi\n      .listTiers(tenant.slug)\n      .then((t) => {\n        if (cancelled) return;\n        setTiers(\n          [...t].sort((a, b) => a.minLifetimePoints - b.minLifetimePoints),\n        );\n      })\n      .catch(() => {\n        // A programme we cannot read is not a programme with no tiers, so the\n        // control stays hidden rather than claiming there are none.\n        if (!cancelled) setTiers(null);\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [tenant?.slug]);\n\n  if (!tiers) return null;\n\n  if (tiers.length === 0) {\n    return (\n      <p className=\"text-xs text-[var(--text-tertiary)]\">\n        No loyalty tiers yet.{' '}\n        <Link\n          href=\"/dashboard/loyalty\"\n          className=\"text-brand-500 hover:underline\"\n        >\n          Set some up\n        </Link>{' '}\n        to reserve a code for your best customers.\n      </p>\n    );\n  }\n\n  const toggle = (id: string) => {\n    onChange(\n      selectedTierIds.includes(id)\n        ? selectedTierIds.filter((t) => t !== id)\n        : [...selectedTierIds, id],\n    );\n  };\n\n  return (\n    <div>\n      <span className=\"mb-1 block text-sm font-medium text-[var(--text-secondary)]\">\n        Reserved for tiers\n      </span>\n      <div className=\"flex flex-wrap gap-x-4 gap-y-2\">\n        {tiers.map((tier) => (\n          <Checkbox\n            key={tier.id}\n            checked={selectedTierIds.includes(tier.id)}\n            onChange={() => toggle(tier.id)}\n            label={tier.name}\n          />\n        ))}\n      </div>\n      <p className=\"mt-1 text-xs text-[var(--text-tertiary)]\">\n        {selectedTierIds.length === 0\n          ? 'Anyone can use this code.'\n          : 'Only customers on the ticked tiers can use it.'}\n      </p>\n    </div>\n  );\n}\n"],"mappings":";AA4DM,SAEE,KAFF;AA1DN,SAAS,WAAW,gBAAgB;AACpC,OAAO,UAAU;AACjB,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,eAAe;AAkBjB,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AACF,GAGG;AACD,QAAM,EAAE,OAAO,IAAI,QAAQ;AAC3B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA+B,IAAI;AAE7D,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ,KAAM;AACnB,QAAI,YAAY;AAChB,eACG,UAAU,OAAO,IAAI,EACrB,KAAK,CAAC,MAAM;AACX,UAAI,UAAW;AACf;AAAA,QACE,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,MAAM,EAAE,oBAAoB,EAAE,iBAAiB;AAAA,MACjE;AAAA,IACF,CAAC,EACA,MAAM,MAAM;AAGX,UAAI,CAAC,UAAW,UAAS,IAAI;AAAA,IAC/B,CAAC;AACH,WAAO,MAAM;AACX,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,QAAQ,IAAI,CAAC;AAEjB,MAAI,CAAC,MAAO,QAAO;AAEnB,MAAI,MAAM,WAAW,GAAG;AACtB,WACE,qBAAC,OAAE,WAAU,uCAAsC;AAAA;AAAA,MAC3B;AAAA,MACtB;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACX;AAAA;AAAA,MAED;AAAA,MAAQ;AAAA,MAAI;AAAA,OAEd;AAAA,EAEJ;AAEA,QAAM,SAAS,CAAC,OAAe;AAC7B;AAAA,MACE,gBAAgB,SAAS,EAAE,IACvB,gBAAgB,OAAO,CAAC,MAAM,MAAM,EAAE,IACtC,CAAC,GAAG,iBAAiB,EAAE;AAAA,IAC7B;AAAA,EACF;AAEA,SACE,qBAAC,SACC;AAAA,wBAAC,UAAK,WAAU,+DAA8D,gCAE9E;AAAA,IACA,oBAAC,SAAI,WAAU,kCACZ,gBAAM,IAAI,CAAC,SACV;AAAA,MAAC;AAAA;AAAA,QAEC,SAAS,gBAAgB,SAAS,KAAK,EAAE;AAAA,QACzC,UAAU,MAAM,OAAO,KAAK,EAAE;AAAA,QAC9B,OAAO,KAAK;AAAA;AAAA,MAHP,KAAK;AAAA,IAIZ,CACD,GACH;AAAA,IACA,oBAAC,OAAE,WAAU,4CACV,0BAAgB,WAAW,IACxB,8BACA,kDACN;AAAA,KACF;AAEJ;","names":[]}

package/dist/discount-editor.d.ts

@@ -0,0 +1 @@
+export * from './discount-editor/index';

package/dist/discount-editor.js

@@ -0,0 +1 @@
+export * from './discount-editor/index.js';

package/dist/duplicate-workspace-modal.d.ts

@@ -0,0 +1,7 @@
+interface DuplicateWorkspaceModalProps {
+    sourceTenantId: string;
+    sourceBusinessName: string;
+    onClose: () => void;
+}
+export declare function DuplicateWorkspaceModal({ sourceTenantId, sourceBusinessName, onClose, }: DuplicateWorkspaceModalProps): import("react").JSX.Element;
+export {};

package/dist/duplicate-workspace-modal.js

@@ -0,0 +1,122 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Copy, Loader2, X } from "lucide-react";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { Button } from "@withpotter/ui-kit/button";
+import { Input } from "@withpotter/ui-kit";
+function DuplicateWorkspaceModal({
+  sourceTenantId,
+  sourceBusinessName,
+  onClose
+}) {
+  const { duplicateWorkspace } = useAuth();
+  const [businessName, setBusinessName] = useState(
+    `${sourceBusinessName} (Copy)`
+  );
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const handleDuplicate = async () => {
+    if (!businessName.trim()) return;
+    setLoading(true);
+    setError(null);
+    try {
+      await duplicateWorkspace(sourceTenantId, businessName.trim());
+      onClose();
+      window.location.reload();
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : "Failed to duplicate business."
+      );
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-[var(--z-modal)] flex items-center justify-center p-4", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "absolute inset-0 bg-black/40",
+        onClick: !loading ? onClose : void 0
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "relative bg-[var(--bg-base)] rounded-md border border-[var(--border-default)] w-full max-w-md", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-4 border-b border-[var(--border-subtle)]", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx("div", { className: "w-8 h-8 rounded-md bg-[var(--accent-secondary)] flex items-center justify-center", children: /* @__PURE__ */ jsx(Copy, { className: "size-4 text-brand-500" }) }),
+          /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold text-[var(--text-primary)]", children: "Duplicate business" })
+        ] }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            "aria-label": "Close",
+            variant: "ghost",
+            size: "icon",
+            onClick: onClose,
+            disabled: loading,
+            children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "px-4 py-4 space-y-4", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-sm text-[var(--text-tertiary)]", children: [
+          "Creates a new business with the same template, industry profile, and settings as",
+          " ",
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-[var(--text-secondary)]", children: sourceBusinessName }),
+          ". Content, orders, and customers are not copied."
+        ] }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(
+            "label",
+            {
+              htmlFor: "dup-name",
+              className: "block text-xs font-medium text-[var(--text-secondary)] mb-2",
+              children: "Business name"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "dup-name",
+              type: "text",
+              value: businessName,
+              onChange: (e) => setBusinessName(e.target.value),
+              disabled: loading
+            }
+          )
+        ] }),
+        error && /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--error)]", children: error })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2 px-4 py-4 border-t border-[var(--border-subtle)] bg-[var(--bg-subtle)]", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            disabled: loading,
+            className: "px-4 py-2 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)] font-medium transition-colors cursor-pointer disabled:opacity-60",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            onClick: handleDuplicate,
+            disabled: loading || !businessName.trim(),
+            children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin" }),
+              "Duplicating..."
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Copy, { className: "size-4" }),
+              "Duplicate"
+            ] })
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  DuplicateWorkspaceModal
+};
+//# sourceMappingURL=duplicate-workspace-modal.js.map

package/dist/duplicate-workspace-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/duplicate-workspace-modal.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Copy, Loader2, X } from 'lucide-react';\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { Button } from '@withpotter/ui-kit/button';\nimport { Input } from '@withpotter/ui-kit';\n\ninterface DuplicateWorkspaceModalProps {\n  sourceTenantId: string;\n  sourceBusinessName: string;\n  onClose: () => void;\n}\n\nexport function DuplicateWorkspaceModal({\n  sourceTenantId,\n  sourceBusinessName,\n  onClose,\n}: DuplicateWorkspaceModalProps) {\n  const { duplicateWorkspace } = useAuth();\n  const [businessName, setBusinessName] = useState(\n    `${sourceBusinessName} (Copy)`,\n  );\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const handleDuplicate = async () => {\n    if (!businessName.trim()) return;\n    setLoading(true);\n    setError(null);\n    try {\n      await duplicateWorkspace(sourceTenantId, businessName.trim());\n      onClose();\n      window.location.reload();\n    } catch (err: unknown) {\n      setError(\n        err instanceof Error ? err.message : 'Failed to duplicate business.',\n      );\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <div className=\"fixed inset-0 z-[var(--z-modal)] flex items-center justify-center p-4\">\n      {/* Backdrop */}\n      <div\n        className=\"absolute inset-0 bg-black/40\"\n        onClick={!loading ? onClose : undefined}\n      />\n\n      {/* Modal */}\n      <div className=\"relative bg-[var(--bg-base)] rounded-md border border-[var(--border-default)] w-full max-w-md\">\n        {/* Header */}\n        <div className=\"flex items-center justify-between px-4 py-4 border-b border-[var(--border-subtle)]\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"w-8 h-8 rounded-md bg-[var(--accent-secondary)] flex items-center justify-center\">\n              <Copy className=\"size-4 text-brand-500\" />\n            </div>\n            <h2 className=\"text-sm font-semibold text-[var(--text-primary)]\">\n              Duplicate business\n            </h2>\n          </div>\n          <Button\n            aria-label=\"Close\"\n            variant=\"ghost\"\n            size=\"icon\"\n            onClick={onClose}\n            disabled={loading}\n          >\n            <X className=\"size-4\" />\n          </Button>\n        </div>\n\n        {/* Body */}\n        <div className=\"px-4 py-4 space-y-4\">\n          <p className=\"text-sm text-[var(--text-tertiary)]\">\n            Creates a new business with the same template, industry profile,\n            and settings as{' '}\n            <span className=\"font-medium text-[var(--text-secondary)]\">\n              {sourceBusinessName}\n            </span>\n            . Content, orders, and customers are not copied.\n          </p>\n\n          <div>\n            <label\n              htmlFor=\"dup-name\"\n              className=\"block text-xs font-medium text-[var(--text-secondary)] mb-2\"\n            >\n              Business name\n            </label>\n            <Input\n              id=\"dup-name\"\n              type=\"text\"\n              value={businessName}\n              onChange={(e) => setBusinessName(e.target.value)}\n              disabled={loading}\n            />\n          </div>\n\n          {error && <p className=\"text-sm text-[var(--error)]\">{error}</p>}\n        </div>\n\n        {/* Footer */}\n        <div className=\"flex justify-end gap-2 px-4 py-4 border-t border-[var(--border-subtle)] bg-[var(--bg-subtle)]\">\n          <button\n            type=\"button\"\n            onClick={onClose}\n            disabled={loading}\n            className=\"px-4 py-2 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)] font-medium transition-colors cursor-pointer disabled:opacity-60\"\n          >\n            Cancel\n          </button>\n          <Button\n            onClick={handleDuplicate}\n            disabled={loading || !businessName.trim()}\n          >\n            {loading ? (\n              <>\n                <Loader2 className=\"size-4 animate-spin\" />\n                Duplicating...\n              </>\n            ) : (\n              <>\n                <Copy className=\"size-4\" />\n                Duplicate\n              </>\n            )}\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA8CM,SAyEQ,UAzER,KASI,YATJ;AA5CN,SAAS,gBAAgB;AACzB,SAAS,MAAM,SAAS,SAAS;AACjC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,aAAa;AAQf,SAAS,wBAAwB;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACF,GAAiC;AAC/B,QAAM,EAAE,mBAAmB,IAAI,QAAQ;AACvC,QAAM,CAAC,cAAc,eAAe,IAAI;AAAA,IACtC,GAAG,kBAAkB;AAAA,EACvB;AACA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,IAAI;AAEtD,QAAM,kBAAkB,YAAY;AAClC,QAAI,CAAC,aAAa,KAAK,EAAG;AAC1B,eAAW,IAAI;AACf,aAAS,IAAI;AACb,QAAI;AACF,YAAM,mBAAmB,gBAAgB,aAAa,KAAK,CAAC;AAC5D,cAAQ;AACR,aAAO,SAAS,OAAO;AAAA,IACzB,SAAS,KAAc;AACrB;AAAA,QACE,eAAe,QAAQ,IAAI,UAAU;AAAA,MACvC;AAAA,IACF,UAAE;AACA,iBAAW,KAAK;AAAA,IAClB;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,yEAEb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,SAAS,CAAC,UAAU,UAAU;AAAA;AAAA,IAChC;AAAA,IAGA,qBAAC,SAAI,WAAU,iGAEb;AAAA,2BAAC,SAAI,WAAU,sFACb;AAAA,6BAAC,SAAI,WAAU,2BACb;AAAA,8BAAC,SAAI,WAAU,oFACb,8BAAC,QAAK,WAAU,yBAAwB,GAC1C;AAAA,UACA,oBAAC,QAAG,WAAU,oDAAmD,gCAEjE;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,cAAW;AAAA,YACX,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,SAAS;AAAA,YACT,UAAU;AAAA,YAEV,8BAAC,KAAE,WAAU,UAAS;AAAA;AAAA,QACxB;AAAA,SACF;AAAA,MAGA,qBAAC,SAAI,WAAU,uBACb;AAAA,6BAAC,OAAE,WAAU,uCAAsC;AAAA;AAAA,UAEjC;AAAA,UAChB,oBAAC,UAAK,WAAU,4CACb,8BACH;AAAA,UAAO;AAAA,WAET;AAAA,QAEA,qBAAC,SACC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACX;AAAA;AAAA,UAED;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,MAAK;AAAA,cACL,OAAO;AAAA,cACP,UAAU,CAAC,MAAM,gBAAgB,EAAE,OAAO,KAAK;AAAA,cAC/C,UAAU;AAAA;AAAA,UACZ;AAAA,WACF;AAAA,QAEC,SAAS,oBAAC,OAAE,WAAU,+BAA+B,iBAAM;AAAA,SAC9D;AAAA,MAGA,qBAAC,SAAI,WAAU,iGACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS;AAAA,YACT,UAAU;AAAA,YACV,WAAU;AAAA,YACX;AAAA;AAAA,QAED;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,SAAS;AAAA,YACT,UAAU,WAAW,CAAC,aAAa,KAAK;AAAA,YAEvC,oBACC,iCACE;AAAA,kCAAC,WAAQ,WAAU,uBAAsB;AAAA,cAAE;AAAA,eAE7C,IAEA,iCACE;AAAA,kCAAC,QAAK,WAAU,UAAS;AAAA,cAAE;AAAA,eAE7B;AAAA;AAAA,QAEJ;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/dynamic-form/fields-basic.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { type FieldRendererProps } from './shared';
+/**
+ * The plain fields: text, number, money, and the small controls.
+ *
+ * Each is a thin adapter from a `ContentFieldConfig` onto a primitive —
+ * Input, Textarea, ColorField, DateField, TimeField, Toggle. Nothing here
+ * fetches anything, which is what separates this file from the two beside it.
+ */
+export declare function TextField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+/**
+ * A colour, as a swatch you can open and a hex you can paste.
+ *
+ * `color` has been in `FieldType` all along and fell through to a plain text
+ * input, so a template asking for one handed the merchant an empty box and the
+ * expectation that they knew to type `#E9564A`. On templates where a colour is
+ * decoration that is untidy; on one where each product owns a colour and it is
+ * the ground the product stands on, it is the main setting on the record.
+ *
+ * The swatch, the hex box and the tolerance for a paste with no hash all live
+ * in `ColorField` now — this is only the field-type binding.
+ */
+export declare function ColorFieldRenderer({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function TextareaField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function NumberField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function CurrencyField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function TagsField({ field, value, onChange, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function ToggleField({ value, onChange, disabled }: FieldRendererProps): React.JSX.Element;
+export declare function DateField({ value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function TimeField({ value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function RichTextField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function PhoneField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;
+export declare function EmailField({ field, value, onChange, error, disabled, }: FieldRendererProps): React.JSX.Element;