@withpotter/components 0.13.0-next.101

package/dist/companion/companion-context.js

@@ -0,0 +1,120 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useState
+} from "react";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { useToast } from "@withpotter/ui-kit/use-toast";
+import { tenantApi } from "@withpotter/lib/api";
+import { useCurrentTemplate } from "@withpotter/lib/template-context";
+import { proposalsApi, isDecidable } from "@withpotter/lib/proposals-api";
+import { buildProposeDocument } from "@withpotter/lib/editor-agent/template-document";
+import {
+  COMPANION,
+  COMPANION_NAME_SETTING,
+  MAX_COMPANION_NAME_LENGTH,
+  resolveCompanionName
+} from "@withpotter/lib/companion/config";
+const CompanionContext = createContext(null);
+function useCompanion() {
+  const ctx = useContext(CompanionContext);
+  if (!ctx) {
+    throw new Error("useCompanion must be used within a CompanionProvider");
+  }
+  return ctx;
+}
+function CompanionProvider({ children }) {
+  const { tenant, refreshTenant } = useAuth();
+  const { toast } = useToast();
+  const [open, setOpen] = useState(false);
+  const [renaming, setRenaming] = useState(false);
+  const { template } = useCurrentTemplate(tenant?.templateId);
+  const { data, isLoading, refetch } = useApiQuery(
+    ["proposals"],
+    (slug) => proposalsApi.list(slug)
+  );
+  const waiting = useMemo(
+    () => (data ?? []).filter((p) => isDecidable(p.status)),
+    [data]
+  );
+  const name = resolveCompanionName(tenant?.settings);
+  const conversationContext = useMemo(() => {
+    if (!tenant?.templateId || template?.id !== tenant.templateId)
+      return void 0;
+    const pages = template?.pageContent;
+    if (!pages) return void 0;
+    const pageId = pages.home ? "home" : Object.keys(pages)[0];
+    const page = pageId ? pages[pageId] : void 0;
+    if (!pageId || !page) return void 0;
+    return {
+      pageId,
+      templateDocument: buildProposeDocument(
+        page.sections.map((section) => section.id),
+        null
+      )
+    };
+  }, [tenant?.templateId, template?.id, template?.pageContent]);
+  const rename = useCallback(
+    async (nextName) => {
+      const trimmed = nextName.trim().slice(0, MAX_COMPANION_NAME_LENGTH);
+      if (!tenant?.slug || !trimmed || trimmed === name) return;
+      setRenaming(true);
+      try {
+        await tenantApi.updateSettings(tenant.slug, {
+          ...tenant.settings ?? {},
+          [COMPANION_NAME_SETTING]: trimmed
+        });
+        await refreshTenant();
+        toast({ title: `Say hello to ${trimmed}.` });
+      } catch (err) {
+        toast({
+          title: "Couldn\u2019t save that name",
+          description: err instanceof Error ? err.message : "Please try again.",
+          variant: "destructive"
+        });
+      } finally {
+        setRenaming(false);
+      }
+    },
+    [tenant?.slug, tenant?.settings, name, refreshTenant, toast]
+  );
+  const value = useMemo(
+    () => ({
+      name,
+      label: COMPANION.label,
+      description: COMPANION.description,
+      href: COMPANION.href,
+      waiting,
+      waitingCount: waiting.length,
+      loading: isLoading,
+      refresh: () => refetch(),
+      open,
+      setOpen,
+      rename,
+      renaming,
+      maxNameLength: MAX_COMPANION_NAME_LENGTH,
+      conversationContext
+    }),
+    [
+      name,
+      waiting,
+      isLoading,
+      open,
+      rename,
+      renaming,
+      refetch,
+      conversationContext
+    ]
+  );
+  return /* @__PURE__ */ jsx(CompanionContext.Provider, { value, children });
+}
+export {
+  CompanionProvider,
+  useCompanion
+};
+//# sourceMappingURL=companion-context.js.map

package/dist/companion/companion-context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/companion/companion-context.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { useApiQuery } from '@withpotter/hooks/use-api-query';\nimport { useToast } from '@withpotter/ui-kit/use-toast';\nimport { tenantApi } from '@withpotter/lib/api';\nimport { useCurrentTemplate } from '@withpotter/lib/template-context';\nimport { proposalsApi, isDecidable, type Proposal } from '@withpotter/lib/proposals-api';\nimport type { ConversationContext } from '@withpotter/lib/editor-agent/contracts';\nimport { buildProposeDocument } from '@withpotter/lib/editor-agent/template-document';\nimport {\n  COMPANION,\n  COMPANION_NAME_SETTING,\n  MAX_COMPANION_NAME_LENGTH,\n  resolveCompanionName,\n} from '@withpotter/lib/companion/config';\n\ninterface CompanionContextValue {\n  /** Resolved persona name (merchant's custom name, or the default). */\n  name: string;\n  /** Sidebar/product label — positioning, not the name. */\n  label: string;\n  description: string;\n  href: string;\n  /** Suggestions awaiting a decision. */\n  waiting: Proposal[];\n  waitingCount: number;\n  loading: boolean;\n  refresh: () => void;\n  /** Drawer open state. */\n  open: boolean;\n  setOpen: (open: boolean) => void;\n  /** Rename the companion (persists to tenant settings). */\n  rename: (name: string) => Promise<void>;\n  renaming: boolean;\n  maxNameLength: number;\n  /** Read-only home-page grounding for conversations outside the editor. */\n  conversationContext?: ConversationContext;\n}\n\nconst CompanionContext = createContext<CompanionContextValue | null>(null);\n\nexport function useCompanion(): CompanionContextValue {\n  const ctx = useContext(CompanionContext);\n  if (!ctx) {\n    throw new Error('useCompanion must be used within a CompanionProvider');\n  }\n  return ctx;\n}\n\nexport function CompanionProvider({ children }: { children: React.ReactNode }) {\n  const { tenant, refreshTenant } = useAuth();\n  const { toast } = useToast();\n  const [open, setOpen] = useState(false);\n  const [renaming, setRenaming] = useState(false);\n  const { template } = useCurrentTemplate(tenant?.templateId);\n\n  const { data, isLoading, refetch } = useApiQuery(['proposals'], (slug) =>\n    proposalsApi.list(slug),\n  );\n\n  const waiting = useMemo(\n    () => (data ?? []).filter((p) => isDecidable(p.status)),\n    [data],\n  );\n\n  const name = resolveCompanionName(tenant?.settings);\n  const conversationContext = useMemo<ConversationContext | undefined>(() => {\n    if (!tenant?.templateId || template?.id !== tenant.templateId)\n      return undefined;\n    const pages = template?.pageContent;\n    if (!pages) return undefined;\n    const pageId = pages.home ? 'home' : Object.keys(pages)[0];\n    const page = pageId ? pages[pageId] : undefined;\n    if (!pageId || !page) return undefined;\n    return {\n      pageId,\n      templateDocument: buildProposeDocument(\n        page.sections.map((section) => section.id),\n        null,\n      ),\n    };\n  }, [tenant?.templateId, template?.id, template?.pageContent]);\n\n  const rename = useCallback(\n    async (nextName: string) => {\n      const trimmed = nextName.trim().slice(0, MAX_COMPANION_NAME_LENGTH);\n      if (!tenant?.slug || !trimmed || trimmed === name) return;\n      setRenaming(true);\n      try {\n        await tenantApi.updateSettings(tenant.slug, {\n          ...(tenant.settings ?? {}),\n          [COMPANION_NAME_SETTING]: trimmed,\n        });\n        await refreshTenant();\n        toast({ title: `Say hello to ${trimmed}.` });\n      } catch (err) {\n        toast({\n          title: 'Couldn’t save that name',\n          description: err instanceof Error ? err.message : 'Please try again.',\n          variant: 'destructive',\n        });\n      } finally {\n        setRenaming(false);\n      }\n    },\n    [tenant?.slug, tenant?.settings, name, refreshTenant, toast],\n  );\n\n  const value = useMemo<CompanionContextValue>(\n    () => ({\n      name,\n      label: COMPANION.label,\n      description: COMPANION.description,\n      href: COMPANION.href,\n      waiting,\n      waitingCount: waiting.length,\n      loading: isLoading,\n      refresh: () => refetch(),\n      open,\n      setOpen,\n      rename,\n      renaming,\n      maxNameLength: MAX_COMPANION_NAME_LENGTH,\n      conversationContext,\n    }),\n    [\n      name,\n      waiting,\n      isLoading,\n      open,\n      rename,\n      renaming,\n      refetch,\n      conversationContext,\n    ],\n  );\n\n  return (\n    <CompanionContext.Provider value={value}>\n      {children}\n    </CompanionContext.Provider>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/companion/companion-dock.d.ts

@@ -0,0 +1,12 @@
+/**
+ * The always-present companion. `CompanionSurface` mounts the floating
+ * launcher + drawer globally; `CompanionNavButton` is the quick-access entry
+ * point in the top nav bar. Both share state through the CompanionProvider,
+ * so opening from either place shows the same conversation.
+ */
+export declare function CompanionSurface(): import("react").JSX.Element | null;
+/**
+ * Quick-access companion shortcut for the top nav bar. Shows a badge when
+ * suggestions are waiting.
+ */
+export declare function CompanionNavButton(): import("react").JSX.Element;

package/dist/companion/companion-dock.js

@@ -0,0 +1,399 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import {
+  Bot,
+  X,
+  Check,
+  Loader2,
+  History,
+  Pencil,
+  Send,
+  Sparkles
+} from "lucide-react";
+import Link from "next/link";
+import { usePathname } from "@withpotter/lib/use-pathname";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { cn } from "@withpotter/lib/utils";
+import { useCompanion } from "@withpotter/components/companion/companion-context";
+import { useConverse } from "@withpotter/lib/editor-agent/use-converse";
+import {
+  isCompanionBusinessEnabled,
+  isInteractiveCompanionEnabled
+} from "@withpotter/lib/editor-agent/flag";
+function CompanionSurface() {
+  const { tenant, loading } = useAuth();
+  const { name, description, waitingCount, open, setOpen } = useCompanion();
+  if (loading || !tenant) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen(true),
+        "aria-label": `Open ${name}, your ${description.toLowerCase()}`,
+        className: cn(
+          "fixed z-[91] flex h-10 w-10 items-center justify-center rounded-full transition",
+          "border border-[var(--border-default)] bg-[var(--bg-elevated)] text-[var(--text-secondary)] shadow-sm",
+          "hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] active:scale-95",
+          "bottom-[calc(148px+env(safe-area-inset-bottom))] right-4 lg:bottom-24 lg:right-6"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Bot, { className: "h-[18px] w-[18px]" }),
+          waitingCount > 0 && /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "absolute -right-1 -top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white",
+              "aria-label": `${waitingCount} waiting for you`,
+              children: waitingCount
+            }
+          )
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsx(CompanionDrawer, { tenantSlug: tenant.slug }, tenant.slug)
+  ] });
+}
+function CompanionNavButton() {
+  const { name, waitingCount, setOpen } = useCompanion();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: () => setOpen(true),
+      "aria-label": `Open ${name}${waitingCount > 0 ? `, ${waitingCount} waiting` : ""}`,
+      className: "relative rounded-md p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]",
+      children: [
+        /* @__PURE__ */ jsx(Bot, { className: "size-5" }),
+        waitingCount > 0 && /* @__PURE__ */ jsx("span", { className: "absolute right-1 top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white", children: waitingCount })
+      ]
+    }
+  );
+}
+function CompanionDrawer({ tenantSlug }) {
+  const {
+    name,
+    description,
+    href,
+    waitingCount,
+    refresh,
+    setOpen,
+    conversationContext
+  } = useCompanion();
+  const onClose = () => setOpen(false);
+  return /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-[100] flex justify-end", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "absolute inset-0 bg-black/40 backdrop-blur-[1px]",
+        onClick: onClose,
+        "aria-hidden": true
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "dialog",
+        "aria-label": name,
+        className: "relative flex h-full w-full max-w-md flex-col border-l border-[var(--border-default)] bg-[var(--bg-base)] shadow-2xl",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between border-b border-[var(--border-default)] px-4 py-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-[var(--accent-primary)] text-white", children: /* @__PURE__ */ jsx(Bot, { className: "size-5" }) }),
+              /* @__PURE__ */ jsx(CompanionIdentity, { name, description })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxs(
+                Link,
+                {
+                  href,
+                  onClick: onClose,
+                  "aria-label": `View activity${waitingCount > 0 ? `, ${waitingCount} waiting` : ""}`,
+                  title: "Activity",
+                  className: "relative rounded p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]",
+                  children: [
+                    /* @__PURE__ */ jsx(History, { className: "h-[18px] w-[18px]" }),
+                    waitingCount > 0 && /* @__PURE__ */ jsx("span", { className: "absolute -right-1 -top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white", children: waitingCount })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: onClose,
+                  "aria-label": "Close",
+                  className: "rounded p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]",
+                  children: /* @__PURE__ */ jsx(X, { className: "size-5" })
+                }
+              )
+            ] })
+          ] }),
+          isInteractiveCompanionEnabled() ? /* @__PURE__ */ jsx(
+            CompanionConversation,
+            {
+              tenantSlug,
+              name,
+              context: conversationContext,
+              onProposal: refresh
+            }
+          ) : /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center px-6 text-center", children: /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { className: "mx-auto mb-3 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--success-bg)]", children: /* @__PURE__ */ jsx(Check, { className: "size-5 text-[var(--success)]" }) }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: "You're all caught up" }),
+            /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-[var(--text-tertiary)]", children: "Use the Activity button above when something needs a decision." })
+          ] }) })
+        ]
+      }
+    )
+  ] });
+}
+function CompanionConversation({
+  tenantSlug,
+  name,
+  context,
+  onProposal
+}) {
+  const [prompt, setPrompt] = useState("");
+  const textareaRef = useRef(null);
+  const wasStreamingRef = useRef(false);
+  const pathname = usePathname();
+  const { messages, streaming, error, send } = useConverse({ tenantSlug });
+  const businessFirst = isCompanionBusinessEnabled() && !pathname.startsWith("/dashboard/editor");
+  useEffect(() => {
+    if (wasStreamingRef.current && !streaming) {
+      textareaRef.current?.focus();
+    }
+    wasStreamingRef.current = streaming;
+  }, [streaming]);
+  async function submit(value = prompt) {
+    const trimmed = value.trim();
+    if (!trimmed || streaming || !businessFirst && !context) return;
+    setPrompt("");
+    try {
+      const result = await send({
+        prompt: trimmed,
+        ...businessFirst ? {} : { selection: { scope: "page" }, context }
+      });
+      if (result.receiptId) onProposal();
+    } catch {
+    }
+  }
+  return /* @__PURE__ */ jsxs("section", { className: "flex min-h-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "min-h-0 flex-1 overflow-y-auto px-4 py-4",
+        "aria-live": "polite",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center gap-2 text-sm font-medium text-[var(--text-primary)]", children: [
+            /* @__PURE__ */ jsx(Sparkles, { className: "size-4 text-[var(--accent-primary)]" }),
+            "Ask ",
+            name
+          ] }),
+          messages.length > 0 ? /* @__PURE__ */ jsx("div", { className: "space-y-2", children: messages.map((message) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "w-fit max-w-[88%] rounded-md px-3 py-2 text-sm",
+                message.role === "user" ? "ml-auto bg-[var(--accent-primary)] text-white" : "bg-[var(--bg-muted)] text-[var(--text-secondary)]"
+              ),
+              children: [
+                message.domain && /* @__PURE__ */ jsx("div", { className: "mb-1 text-xs font-medium text-[var(--text-primary)]", children: message.domain.label }),
+                message.content || /* @__PURE__ */ jsx(
+                  Loader2,
+                  {
+                    className: "size-4 animate-spin",
+                    "aria-label": "Thinking"
+                  }
+                ),
+                message.evidence && /* @__PURE__ */ jsx(EvidenceList, { evidence: message.evidence }),
+                message.clarify?.options && /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: message.clarify.options.map((option) => /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    disabled: streaming,
+                    onClick: () => void submit(option),
+                    className: "rounded-md border border-[var(--border-default)] bg-[var(--bg-base)] px-3 py-2 text-xs font-medium text-[var(--text-primary)] transition-colors hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] disabled:opacity-50",
+                    children: option
+                  },
+                  option
+                )) })
+              ]
+            },
+            message.id
+          )) }) : /* @__PURE__ */ jsx("div", { className: "flex min-h-[55vh] items-center justify-center text-center", children: /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { className: "mx-auto mb-3 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--success-bg)]", children: /* @__PURE__ */ jsx(Check, { className: "size-5 text-[var(--success)]" }) }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: "You're all caught up" }),
+            /* @__PURE__ */ jsxs("p", { className: "mt-1 text-sm text-[var(--text-tertiary)]", children: [
+              "Ask ",
+              name,
+              " about your storefront whenever you're ready."
+            ] })
+          ] }) }),
+          error && /* @__PURE__ */ jsx("p", { className: "mt-3 text-xs text-[var(--error)]", children: error })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "shrink-0 border-t border-[var(--border-default)] bg-[var(--bg-base)] px-4 py-4", children: [
+      !context && /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs text-[var(--text-tertiary)]", children: "Your storefront template is still loading." }),
+      /* @__PURE__ */ jsxs(
+        "form",
+        {
+          onSubmit: (event) => {
+            event.preventDefault();
+            void submit();
+          },
+          className: "flex items-end gap-2 rounded-lg border border-[var(--border-default)] bg-[var(--bg-muted)] p-2 shadow-sm transition-colors focus-within:border-[var(--accent-primary)] focus-within:ring-2 focus-within:ring-[var(--accent-primary)]/10",
+          children: [
+            /* @__PURE__ */ jsx(
+              "textarea",
+              {
+                ref: textareaRef,
+                value: prompt,
+                onChange: (event) => setPrompt(event.target.value),
+                onKeyDown: (event) => {
+                  if (event.key !== "Enter" || event.shiftKey || event.nativeEvent.isComposing) {
+                    return;
+                  }
+                  event.preventDefault();
+                  void submit();
+                },
+                rows: 1,
+                disabled: streaming || !context,
+                placeholder: "Ask about your storefront\u2026",
+                className: "min-h-9 max-h-28 flex-1 resize-none bg-transparent px-2 py-2 text-sm leading-5 text-[var(--text-primary)] outline-none placeholder:text-[var(--text-tertiary)] disabled:opacity-60"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "submit",
+                disabled: !prompt.trim() || streaming || !context,
+                "aria-label": "Send message",
+                className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-[var(--accent-primary)] text-white transition-colors hover:bg-[var(--accent-hover)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--accent-primary)]/30 disabled:opacity-40",
+                children: streaming ? /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx(Send, { className: "size-4" })
+              }
+            )
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function EvidenceList({ evidence }) {
+  const generatedAt = new Intl.DateTimeFormat(void 0, {
+    dateStyle: "medium",
+    timeStyle: "short"
+  }).format(new Date(evidence.generatedAt));
+  return /* @__PURE__ */ jsxs("div", { className: "mt-2 border-t border-[var(--border-default)] pt-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-1 text-xs text-[var(--text-muted)]", children: [
+      "Evidence \xB7 ",
+      generatedAt
+    ] }),
+    /* @__PURE__ */ jsx("dl", { className: "space-y-1", children: evidence.items.slice(0, 6).map((item) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex min-w-0 items-baseline justify-between gap-3 text-xs",
+        children: [
+          /* @__PURE__ */ jsx("dt", { className: "min-w-0 truncate text-[var(--text-muted)]", children: item.label }),
+          /* @__PURE__ */ jsx("dd", { className: "shrink-0 font-medium text-[var(--text-primary)]", children: formatEvidenceValue(item.value, item.unit, evidence.currency) })
+        ]
+      },
+      item.key
+    )) })
+  ] });
+}
+function formatEvidenceValue(value, unit, currency) {
+  if (typeof value !== "number") return value;
+  if (unit === "currency") {
+    return new Intl.NumberFormat(void 0, {
+      style: "currency",
+      currency,
+      maximumFractionDigits: 2
+    }).format(value);
+  }
+  if (unit === "percent") return `${value}%`;
+  return new Intl.NumberFormat().format(value);
+}
+function CompanionIdentity({
+  name,
+  description
+}) {
+  const { rename, renaming, maxNameLength } = useCompanion();
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState(name);
+  function startEditing() {
+    setDraft(name);
+    setEditing(true);
+  }
+  async function save() {
+    await rename(draft);
+    setEditing(false);
+  }
+  if (editing) {
+    return /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: (e) => {
+          e.preventDefault();
+          void save();
+        },
+        className: "flex items-center gap-2",
+        children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              autoFocus: true,
+              value: draft,
+              onChange: (e) => setDraft(e.target.value),
+              maxLength: maxNameLength,
+              placeholder: "Give your companion a name",
+              "aria-label": "Companion name",
+              className: "w-40 rounded-md border border-[var(--border-default)] bg-[var(--bg-base)] px-2 py-1 text-sm text-[var(--text-primary)] outline-none focus:border-[var(--accent-primary)]"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "submit",
+              disabled: renaming || !draft.trim(),
+              className: "rounded-md bg-[var(--accent-primary)] px-3 py-1 text-xs font-semibold text-white transition-colors hover:bg-[var(--accent-hover)] disabled:opacity-60",
+              children: renaming ? "\u2026" : "Save"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => setEditing(false),
+              disabled: renaming,
+              className: "text-xs text-[var(--text-tertiary)] hover:text-[var(--text-secondary)]",
+              children: "Cancel"
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-[var(--text-primary)]", children: name }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: startEditing,
+          "aria-label": "Rename your companion",
+          className: "rounded p-0.5 text-[var(--text-tertiary)] transition-colors hover:text-[var(--text-secondary)]",
+          children: /* @__PURE__ */ jsx(Pencil, { className: "size-[13px]" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-tertiary)]", children: description })
+  ] });
+}
+export {
+  CompanionNavButton,
+  CompanionSurface
+};
+//# sourceMappingURL=companion-dock.js.map

package/dist/companion/companion-dock.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/companion/companion-dock.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\nimport {\n  Bot,\n  X,\n  Check,\n  Loader2,\n  History,\n  Pencil,\n  Send,\n  Sparkles,\n} from 'lucide-react';\nimport Link from 'next/link';\nimport { usePathname } from '@withpotter/lib/use-pathname';\n\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { cn } from '@withpotter/lib/utils';\nimport { useCompanion } from '@withpotter/components/companion/companion-context';\nimport { useConverse } from '@withpotter/lib/editor-agent/use-converse';\nimport {\n  isCompanionBusinessEnabled,\n  isInteractiveCompanionEnabled,\n} from '@withpotter/lib/editor-agent/flag';\nimport type { BusinessEvidence } from '@withpotter/lib/editor-agent/contracts';\n\n/**\n * The always-present companion. `CompanionSurface` mounts the floating\n * launcher + drawer globally; `CompanionNavButton` is the quick-access entry\n * point in the top nav bar. Both share state through the CompanionProvider,\n * so opening from either place shows the same conversation.\n */\nexport function CompanionSurface() {\n  const { tenant, loading } = useAuth();\n  const { name, description, waitingCount, open, setOpen } = useCompanion();\n\n  // Don't mount until we know who we're helping.\n  if (loading || !tenant) return null;\n\n  return (\n    <>\n      {/* Subtle launcher — icon-only, neutral surface so it doesn't compete\n          with the feedback widget. The top-nav button is the primary entry. */}\n      <button\n        type=\"button\"\n        onClick={() => setOpen(true)}\n        aria-label={`Open ${name}, your ${description.toLowerCase()}`}\n        className={cn(\n          'fixed z-[91] flex h-10 w-10 items-center justify-center rounded-full transition',\n          'border border-[var(--border-default)] bg-[var(--bg-elevated)] text-[var(--text-secondary)] shadow-sm',\n          'hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] active:scale-95',\n          'bottom-[calc(148px+env(safe-area-inset-bottom))] right-4 lg:bottom-24 lg:right-6',\n        )}\n      >\n        <Bot className=\"h-[18px] w-[18px]\" />\n        {waitingCount > 0 && (\n          <span\n            className=\"absolute -right-1 -top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white\"\n            aria-label={`${waitingCount} waiting for you`}\n          >\n            {waitingCount}\n          </span>\n        )}\n      </button>\n\n      {open && <CompanionDrawer key={tenant.slug} tenantSlug={tenant.slug} />}\n    </>\n  );\n}\n\n/**\n * Quick-access companion shortcut for the top nav bar. Shows a badge when\n * suggestions are waiting.\n */\nexport function CompanionNavButton() {\n  const { name, waitingCount, setOpen } = useCompanion();\n  return (\n    <button\n      type=\"button\"\n      onClick={() => setOpen(true)}\n      aria-label={`Open ${name}${waitingCount > 0 ? `, ${waitingCount} waiting` : ''}`}\n      className=\"relative rounded-md p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]\"\n    >\n      <Bot className=\"size-5\" />\n      {waitingCount > 0 && (\n        <span className=\"absolute right-1 top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white\">\n          {waitingCount}\n        </span>\n      )}\n    </button>\n  );\n}\n\n// ── Drawer ───────────────────────────────────────────────────────────────────\n\nfunction CompanionDrawer({ tenantSlug }: { tenantSlug: string }) {\n  const {\n    name,\n    description,\n    href,\n    waitingCount,\n    refresh,\n    setOpen,\n    conversationContext,\n  } = useCompanion();\n  const onClose = () => setOpen(false);\n\n  return (\n    <div className=\"fixed inset-0 z-[100] flex justify-end\">\n      {/* Backdrop */}\n      <div\n        className=\"absolute inset-0 bg-black/40 backdrop-blur-[1px]\"\n        onClick={onClose}\n        aria-hidden\n      />\n\n      {/* Panel */}\n      <div\n        role=\"dialog\"\n        aria-label={name}\n        className=\"relative flex h-full w-full max-w-md flex-col border-l border-[var(--border-default)] bg-[var(--bg-base)] shadow-2xl\"\n      >\n        {/* Header */}\n        <div className=\"flex items-start justify-between border-b border-[var(--border-default)] px-4 py-4\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-[var(--accent-primary)] text-white\">\n              <Bot className=\"size-5\" />\n            </div>\n            <CompanionIdentity name={name} description={description} />\n          </div>\n          <div className=\"flex items-center gap-1\">\n            <Link\n              href={href}\n              onClick={onClose}\n              aria-label={`View activity${waitingCount > 0 ? `, ${waitingCount} waiting` : ''}`}\n              title=\"Activity\"\n              className=\"relative rounded p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]\"\n            >\n              <History className=\"h-[18px] w-[18px]\" />\n              {waitingCount > 0 && (\n                <span className=\"absolute -right-1 -top-1 flex h-4 min-w-4 items-center justify-center rounded-full bg-[var(--accent-primary)] px-1 text-[10px] font-bold text-white\">\n                  {waitingCount}\n                </span>\n              )}\n            </Link>\n            <button\n              type=\"button\"\n              onClick={onClose}\n              aria-label=\"Close\"\n              className=\"rounded p-2 text-[var(--text-tertiary)] transition-colors hover:bg-[var(--interactive-active)] hover:text-[var(--text-secondary)]\"\n            >\n              <X className=\"size-5\" />\n            </button>\n          </div>\n        </div>\n\n        {isInteractiveCompanionEnabled() ? (\n          <CompanionConversation\n            tenantSlug={tenantSlug}\n            name={name}\n            context={conversationContext}\n            onProposal={refresh}\n          />\n        ) : (\n          <div className=\"flex flex-1 items-center justify-center px-6 text-center\">\n            <div>\n              <div className=\"mx-auto mb-3 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--success-bg)]\">\n                <Check className=\"size-5 text-[var(--success)]\" />\n              </div>\n              <p className=\"text-sm font-medium text-[var(--text-primary)]\">\n                You&apos;re all caught up\n              </p>\n              <p className=\"mt-1 text-sm text-[var(--text-tertiary)]\">\n                Use the Activity button above when something needs a decision.\n              </p>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction CompanionConversation({\n  tenantSlug,\n  name,\n  context,\n  onProposal,\n}: {\n  tenantSlug: string;\n  name: string;\n  context: ReturnType<typeof useCompanion>['conversationContext'];\n  onProposal: () => void;\n}) {\n  const [prompt, setPrompt] = useState('');\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const wasStreamingRef = useRef(false);\n  const pathname = usePathname();\n  const { messages, streaming, error, send } = useConverse({ tenantSlug });\n  const businessFirst =\n    isCompanionBusinessEnabled() && !pathname.startsWith('/dashboard/editor');\n\n  useEffect(() => {\n    if (wasStreamingRef.current && !streaming) {\n      textareaRef.current?.focus();\n    }\n    wasStreamingRef.current = streaming;\n  }, [streaming]);\n\n  async function submit(value = prompt) {\n    const trimmed = value.trim();\n    if (!trimmed || streaming || (!businessFirst && !context)) return;\n    setPrompt('');\n    try {\n      const result = await send({\n        prompt: trimmed,\n        ...(businessFirst\n          ? {}\n          : { selection: { scope: 'page' as const }, context }),\n      });\n      if (result.receiptId) onProposal();\n    } catch {\n      // The hook renders the terminal error inline.\n    }\n  }\n\n  return (\n    <section className=\"flex min-h-0 flex-1 flex-col\">\n      <div\n        className=\"min-h-0 flex-1 overflow-y-auto px-4 py-4\"\n        aria-live=\"polite\"\n      >\n        <div className=\"mb-4 flex items-center gap-2 text-sm font-medium text-[var(--text-primary)]\">\n          <Sparkles className=\"size-4 text-[var(--accent-primary)]\" />\n          Ask {name}\n        </div>\n        {messages.length > 0 ? (\n          <div className=\"space-y-2\">\n            {messages.map((message) => (\n              <div\n                key={message.id}\n                className={cn(\n                  'w-fit max-w-[88%] rounded-md px-3 py-2 text-sm',\n                  message.role === 'user'\n                    ? 'ml-auto bg-[var(--accent-primary)] text-white'\n                    : 'bg-[var(--bg-muted)] text-[var(--text-secondary)]',\n                )}\n              >\n                {message.domain && (\n                  <div className=\"mb-1 text-xs font-medium text-[var(--text-primary)]\">\n                    {message.domain.label}\n                  </div>\n                )}\n                {message.content || (\n                  <Loader2\n                    className=\"size-4 animate-spin\"\n                    aria-label=\"Thinking\"\n                  />\n                )}\n                {message.evidence && (\n                  <EvidenceList evidence={message.evidence} />\n                )}\n                {message.clarify?.options && (\n                  <div className=\"mt-2 flex flex-wrap gap-2\">\n                    {message.clarify.options.map((option) => (\n                      <button\n                        key={option}\n                        type=\"button\"\n                        disabled={streaming}\n                        onClick={() => void submit(option)}\n                        className=\"rounded-md border border-[var(--border-default)] bg-[var(--bg-base)] px-3 py-2 text-xs font-medium text-[var(--text-primary)] transition-colors hover:border-[var(--accent-primary)] hover:text-[var(--accent-primary)] disabled:opacity-50\"\n                      >\n                        {option}\n                      </button>\n                    ))}\n                  </div>\n                )}\n              </div>\n            ))}\n          </div>\n        ) : (\n          <div className=\"flex min-h-[55vh] items-center justify-center text-center\">\n            <div>\n              <div className=\"mx-auto mb-3 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--success-bg)]\">\n                <Check className=\"size-5 text-[var(--success)]\" />\n              </div>\n              <p className=\"text-sm font-medium text-[var(--text-primary)]\">\n                You&apos;re all caught up\n              </p>\n              <p className=\"mt-1 text-sm text-[var(--text-tertiary)]\">\n                Ask {name} about your storefront whenever you&apos;re ready.\n              </p>\n            </div>\n          </div>\n        )}\n        {error && <p className=\"mt-3 text-xs text-[var(--error)]\">{error}</p>}\n      </div>\n\n      <div className=\"shrink-0 border-t border-[var(--border-default)] bg-[var(--bg-base)] px-4 py-4\">\n        {!context && (\n          <p className=\"mb-2 text-xs text-[var(--text-tertiary)]\">\n            Your storefront template is still loading.\n          </p>\n        )}\n        <form\n          onSubmit={(event) => {\n            event.preventDefault();\n            void submit();\n          }}\n          className=\"flex items-end gap-2 rounded-lg border border-[var(--border-default)] bg-[var(--bg-muted)] p-2 shadow-sm transition-colors focus-within:border-[var(--accent-primary)] focus-within:ring-2 focus-within:ring-[var(--accent-primary)]/10\"\n        >\n          <textarea\n            ref={textareaRef}\n            value={prompt}\n            onChange={(event) => setPrompt(event.target.value)}\n            onKeyDown={(event) => {\n              if (\n                event.key !== 'Enter' ||\n                event.shiftKey ||\n                event.nativeEvent.isComposing\n              ) {\n                return;\n              }\n              event.preventDefault();\n              void submit();\n            }}\n            rows={1}\n            disabled={streaming || !context}\n            placeholder=\"Ask about your storefront…\"\n            className=\"min-h-9 max-h-28 flex-1 resize-none bg-transparent px-2 py-2 text-sm leading-5 text-[var(--text-primary)] outline-none placeholder:text-[var(--text-tertiary)] disabled:opacity-60\"\n          />\n          <button\n            type=\"submit\"\n            disabled={!prompt.trim() || streaming || !context}\n            aria-label=\"Send message\"\n            className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-[var(--accent-primary)] text-white transition-colors hover:bg-[var(--accent-hover)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--accent-primary)]/30 disabled:opacity-40\"\n          >\n            {streaming ? (\n              <Loader2 className=\"size-4 animate-spin\" />\n            ) : (\n              <Send className=\"size-4\" />\n            )}\n          </button>\n        </form>\n      </div>\n    </section>\n  );\n}\n\nfunction EvidenceList({ evidence }: { evidence: BusinessEvidence }) {\n  const generatedAt = new Intl.DateTimeFormat(undefined, {\n    dateStyle: 'medium',\n    timeStyle: 'short',\n  }).format(new Date(evidence.generatedAt));\n\n  return (\n    <div className=\"mt-2 border-t border-[var(--border-default)] pt-2\">\n      <div className=\"mb-1 text-xs text-[var(--text-muted)]\">\n        Evidence · {generatedAt}\n      </div>\n      <dl className=\"space-y-1\">\n        {evidence.items.slice(0, 6).map((item) => (\n          <div\n            key={item.key}\n            className=\"flex min-w-0 items-baseline justify-between gap-3 text-xs\"\n          >\n            <dt className=\"min-w-0 truncate text-[var(--text-muted)]\">\n              {item.label}\n            </dt>\n            <dd className=\"shrink-0 font-medium text-[var(--text-primary)]\">\n              {formatEvidenceValue(item.value, item.unit, evidence.currency)}\n            </dd>\n          </div>\n        ))}\n      </dl>\n    </div>\n  );\n}\n\nfunction formatEvidenceValue(\n  value: number | string,\n  unit: BusinessEvidence['items'][number]['unit'],\n  currency: string,\n): string {\n  if (typeof value !== 'number') return value;\n  if (unit === 'currency') {\n    return new Intl.NumberFormat(undefined, {\n      style: 'currency',\n      currency,\n      maximumFractionDigits: 2,\n    }).format(value);\n  }\n  if (unit === 'percent') return `${value}%`;\n  return new Intl.NumberFormat().format(value);\n}\n\n// ── Identity + rename ────────────────────────────────────────────────────────\n\nfunction CompanionIdentity({\n  name,\n  description,\n}: {\n  name: string;\n  description: string;\n}) {\n  const { rename, renaming, maxNameLength } = useCompanion();\n  const [editing, setEditing] = useState(false);\n  const [draft, setDraft] = useState(name);\n\n  function startEditing() {\n    setDraft(name);\n    setEditing(true);\n  }\n\n  async function save() {\n    await rename(draft);\n    setEditing(false);\n  }\n\n  if (editing) {\n    return (\n      <form\n        onSubmit={(e) => {\n          e.preventDefault();\n          void save();\n        }}\n        className=\"flex items-center gap-2\"\n      >\n        <input\n          autoFocus\n          value={draft}\n          onChange={(e) => setDraft(e.target.value)}\n          maxLength={maxNameLength}\n          placeholder=\"Give your companion a name\"\n          aria-label=\"Companion name\"\n          className=\"w-40 rounded-md border border-[var(--border-default)] bg-[var(--bg-base)] px-2 py-1 text-sm text-[var(--text-primary)] outline-none focus:border-[var(--accent-primary)]\"\n        />\n        <button\n          type=\"submit\"\n          disabled={renaming || !draft.trim()}\n          className=\"rounded-md bg-[var(--accent-primary)] px-3 py-1 text-xs font-semibold text-white transition-colors hover:bg-[var(--accent-hover)] disabled:opacity-60\"\n        >\n          {renaming ? '…' : 'Save'}\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => setEditing(false)}\n          disabled={renaming}\n          className=\"text-xs text-[var(--text-tertiary)] hover:text-[var(--text-secondary)]\"\n        >\n          Cancel\n        </button>\n      </form>\n    );\n  }\n\n  return (\n    <div>\n      <div className=\"flex items-center gap-2\">\n        <p className=\"text-sm font-semibold text-[var(--text-primary)]\">\n          {name}\n        </p>\n        <button\n          type=\"button\"\n          onClick={startEditing}\n          aria-label=\"Rename your companion\"\n          className=\"rounded p-0.5 text-[var(--text-tertiary)] transition-colors hover:text-[var(--text-secondary)]\"\n        >\n          <Pencil className=\"size-[13px]\" />\n        </button>\n      </div>\n      <p className=\"text-xs text-[var(--text-tertiary)]\">{description}</p>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/connect/command-detail.d.ts

@@ -0,0 +1,5 @@
+import type { CommandRecord } from '@withpotter/lib/connect';
+export declare function CommandDetail({ command, onClose, }: {
+    command: CommandRecord | null;
+    onClose: () => void;
+}): import("react").JSX.Element;