@withpotter/components 0.13.0-next.101

package/dist/dashboard/home/greeting.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/dashboard/home/greeting.ts"],"sourcesContent":["/**\n * The home greeting.\n *\n * MODELLED ON CLAUDE'S, THEN TAKEN FURTHER. Claude.ai rotates a greeting keyed\n * to real context rather than novelty: time of day (\"Good morning\", \"Evening\"),\n * day of week (\"Happy Friday\", \"Welcome to the weekend\"), a contextual set\n * (\"Hello, night owl\"), a casual set (\"Back at it\", \"What's new\"), and a\n * fallback when it doesn't know your name. The name is appended, never required.\n *\n * Copying that verbatim would give Box a chat app's greeting. Box knows\n * things a chat app doesn't — what the business has done today, where you are\n * in the month, how long since you last opened this — so those are layers of\n * their own. The clock is the floor, not the ceiling.\n *\n * THE ONE RULE. Every line is either a plain greeting or a statement that is\n * literally TRUE at the moment it renders. That is what separates this from the\n * slogans it replaced (\"Let's make money today\", \"Who's buying today?\"), which\n * were marketing copy bolted onto a business tool. Personality comes from voice\n * and from noticing real things — never from claiming things.\n *\n * PRIORITY, highest first. Each layer REPLACES the ones below it, so the most\n * specific true thing wins:\n *   1. return    you've been away a while\n *   2. state     what the business has done today\n *   3. calendar  first/last day of the month, new year\n *   4. time + day  time of day, MIXED with any day-of-week flavour\n *\n * The first three replace what's below them. The last is the floor and always\n * resolves, so there is no state in which the greeting comes out empty.\n *\n * STABILITY. Deterministic, seeded by date + day-part. It cannot reshuffle on a\n * remount, a re-render or a route change — only when the clock crosses into a\n * new part of the day. The version this replaced reshuffled on every remount,\n * which made the page feel unstable.\n */\n\nexport interface GreetingContext {\n  /** First name, already capitalised. Omit and the lines drop the name. */\n  firstName?: string;\n  /** Orders/sales recorded today. */\n  todayOrders: number;\n  /** Bookings starting today. */\n  todaysBookings: number;\n  /** Whole days since this person last opened the dashboard, if known. */\n  daysSinceLastSeen?: number;\n  /** Injected so this is pure and testable. */\n  now: Date;\n}\n\ntype Band =\n  | 'lateNight'\n  | 'earlyMorning'\n  | 'morning'\n  | 'afternoon'\n  | 'evening'\n  | 'night';\n\nconst BANDS: Band[] = [\n  'lateNight',\n  'earlyMorning',\n  'morning',\n  'afternoon',\n  'evening',\n  'night',\n];\n\nfunction band(hour: number): Band {\n  if (hour < 5) return 'lateNight';\n  if (hour < 9) return 'earlyMorning';\n  if (hour < 12) return 'morning';\n  if (hour < 17) return 'afternoon';\n  if (hour < 22) return 'evening';\n  return 'night';\n}\n\n/** Time of day. The floor: always available, so a greeting always resolves. */\nconst TIME_LINES: Record<Band, string[]> = {\n  lateNight: [\n    'Still up, {name}',\n    'Late one',\n    'Burning the midnight oil',\n    'The night shift',\n    'Quiet hours, {name}',\n  ],\n  earlyMorning: [\n    'Early start, {name}',\n    'Good morning, {name}',\n    'First one in',\n    'Bright and early, {name}',\n  ],\n  morning: [\n    'Good morning, {name}',\n    'Morning, {name}',\n    'Hey {name}',\n    'Here we go, {name}',\n    'Right then, {name}',\n  ],\n  afternoon: [\n    'Good afternoon, {name}',\n    'Afternoon, {name}',\n    'How’s it going, {name}',\n    'Back at it, {name}',\n  ],\n  evening: ['Good evening, {name}', 'Evening, {name}', 'Home stretch, {name}'],\n  night: [\n    'Winding down, {name}',\n    'Good evening, {name}',\n    'Late one, {name}',\n    'One last look, {name}',\n  ],\n};\n\n/** Day of week. */\nconst DAY_LINES: Record<number, string[]> = {\n  0: [\n    'Working the weekend, {name}',\n    'Sunday shift, {name}',\n    'Happy Sunday, {name}',\n  ],\n  1: ['Happy new week, {name}', 'New week, {name}', 'Happy Monday, {name}'],\n  2: ['Happy Tuesday, {name}'],\n  3: ['Midweek, {name}', 'Happy Wednesday, {name}'],\n  4: ['Happy Thursday, {name}', 'Nearly there, {name}'],\n  5: [\n    'Happy Friday, {name}',\n    'That Friday feeling',\n    'Made it to Friday, {name}',\n  ],\n  6: [\n    'Weekend shift, {name}',\n    'Happy Saturday, {name}',\n    'Saturday trade, {name}',\n  ],\n};\n\n/**\n * Calendar moments. True by definition, and worth noticing — a merchant thinks\n * in months, so the first and last day of one are real events.\n */\nfunction calendarLines(now: Date): string[] {\n  const day = now.getDate();\n  const lastOfMonth = new Date(\n    now.getFullYear(),\n    now.getMonth() + 1,\n    0,\n  ).getDate();\n  const month = now.toLocaleDateString(undefined, { month: 'long' });\n\n  if (now.getMonth() === 0 && day === 1) {\n    return ['Happy new year, {name}', 'New year, {name}'];\n  }\n  if (day === 1) {\n    return [\n      'Happy new month, {name}',\n      `${month}, {name}`,\n      'Clean slate, {name}',\n    ];\n  }\n  if (day === lastOfMonth) {\n    return ['Last day of the month, {name}', 'Closing out the month, {name}'];\n  }\n  return [];\n}\n\n/**\n * How long since you were last here. The most human thing the dashboard can\n * notice, and entirely truthful. Silent for same-day and next-day returns —\n * greeting a daily user with \"welcome back\" every morning is noise.\n */\nfunction returnLines(days: number | undefined): string[] {\n  if (days === undefined || days <= 1) return [];\n  if (days < 7) return ['Welcome back, {name}', 'Good to see you, {name}'];\n  if (days < 30) {\n    return [\n      'Been a minute, {name}',\n      'Welcome back, {name}',\n      'It’s been a week, {name}',\n    ];\n  }\n  return ['Long time, {name}', 'Welcome back, {name}'];\n}\n\n/**\n * What the business has done today. Box's own layer, and the thing a chat\n * app can't say. Every line is threshold-gated so it can only appear when true.\n */\nfunction stateLines(ctx: GreetingContext): string[] {\n  const { todayOrders, todaysBookings, now } = ctx;\n  const activity = todayOrders + todaysBookings;\n  const hour = now.getHours();\n\n  if (activity >= 20) {\n    // Not \"Some day\" — it read as *someday*, a vague future, which is the\n    // opposite of what twenty on the board means, and looked like a broken\n    // string sitting in 32px type at the top of the page.\n    return ['What a day, {name}', 'Flat out, {name}', 'Big one today, {name}'];\n  }\n  if (activity >= 10) {\n    return [\n      'Busy one, {name}',\n      'Good day so far, {name}',\n      'Steady stream, {name}',\n    ];\n  }\n  if (activity > 0 && hour < 11) {\n    return ['Off to a start, {name}', 'First one’s in, {name}'];\n  }\n  if (activity > 0) {\n    return ['Ticking along, {name}', 'Wheels turning, {name}'];\n  }\n  return [];\n}\n\n/**\n * Stable within a part of the day, different across days. Not Math.random: the\n * greeting must not change when the component remounts.\n */\nfunction seed(now: Date, bandName: Band): number {\n  const dayOfYear = Math.floor(\n    (now.getTime() - new Date(now.getFullYear(), 0, 0).getTime()) / 86400000,\n  );\n  return dayOfYear * 7 + BANDS.indexOf(bandName);\n}\n\nfunction firstNonEmpty(lists: string[][]): string[] | undefined {\n  for (const l of lists) if (l.length) return l;\n  return undefined;\n}\n\nexport function resolveGreeting(ctx: GreetingContext): string {\n  const { firstName, now, daysSinceLastSeen } = ctx;\n  const b = band(now.getHours());\n\n  // Each layer REPLACES the ones below rather than joining them, so the most\n  // specific true thing wins. Appending was the original bug: a club with\n  // fourteen bookings on the board could still be told \"Afternoon\".\n  // Return / state / calendar REPLACE everything below them: they're specific\n  // and occasional. (Appending was the original bug — a club with fourteen\n  // bookings could still be told \"Afternoon\".)\n  //\n  // Day-of-week MIXES with time-of-day instead of replacing it. Tuesday only\n  // has one line worth writing, so replacing would mean every Tuesday said\n  // \"Happy Tuesday\" at breakfast, lunch and closing.\n  const pool = firstNonEmpty([\n    returnLines(daysSinceLastSeen),\n    stateLines(ctx),\n    calendarLines(now),\n  ]) ?? [...TIME_LINES[b], ...(DAY_LINES[now.getDay()] ?? [])];\n\n  const line = pool[seed(now, b) % pool.length] ?? 'Good morning, {name}';\n\n  // Drop the name cleanly rather than greeting a blank. Claude's equivalent is\n  // \"Greetings, whoever you are\"; ours just states the time of day, because a\n  // business tool addressing \"whoever you are\" wears out by the second morning.\n  return firstName\n    ? line.replace('{name}', firstName)\n    : line.replace(/,?\\s*\\{name\\}/, '').replace(/^Hey$/, 'Hey there');\n}\n"],"mappings":"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","names":[]}

package/dist/dashboard/home/home-add-item-links.d.ts

@@ -0,0 +1,22 @@
+import type { EntityLabel, ResolvedIntentConfig } from '@withpotter/lib/intents/types';
+/**
+ * Where Home's "Add product" sends the merchant: type one, or import a sheet.
+ *
+ * A business running several archetypes lists its products by name — the
+ * sidebar's Inventory asks for `intent=sell-products`, and the API matches it
+ * exactly. Home's links named no intent, so the editor and the importer filed
+ * the new item under `primary`: the first archetype, or whichever one was open
+ * last. A product added from Home became an event or a service and never
+ * showed in Inventory.
+ *
+ * So the links name the archetype the button speaks for: one whose word for an
+ * item is the word on the button, selling products first when several share
+ * it. A merchant's own rename matches no archetype; then it is selling
+ * products, if the business does, else its first archetype. A business with
+ * one archetype is never narrowed, so its links stay as they were.
+ */
+export declare function homeAddItemIntent(config: Pick<ResolvedIntentConfig, 'mode' | 'all'>, label: EntityLabel): string | undefined;
+export declare function homeAddItemLinks(intent: string | undefined): {
+    create: string;
+    importSheet: string;
+};

package/dist/dashboard/home/home-add-item-links.js

@@ -0,0 +1,26 @@
+function homeAddItemIntent(config, label) {
+  if (config.mode !== "multi" || config.all.length === 0) return void 0;
+  const word = label.singular.toLowerCase();
+  const named = config.all.filter(
+    (c) => c.entities.item.singular.toLowerCase() === word
+  );
+  const products = (list) => list.find((c) => c.key === "sell-products");
+  return (products(named) ?? named[0] ?? products(config.all) ?? config.all[0]).key;
+}
+function homeAddItemLinks(intent) {
+  if (!intent)
+    return {
+      create: "/dashboard/catalog/new",
+      importSheet: "/dashboard/catalog?import=1"
+    };
+  const key = encodeURIComponent(intent);
+  return {
+    create: `/dashboard/catalog/new?intent=${key}`,
+    importSheet: `/dashboard/catalog?intent=${key}&import=1`
+  };
+}
+export {
+  homeAddItemIntent,
+  homeAddItemLinks
+};
+//# sourceMappingURL=home-add-item-links.js.map

package/dist/dashboard/home/home-add-item-links.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/dashboard/home/home-add-item-links.ts"],"sourcesContent":["import type {\n  EntityLabel,\n  IntentConfig,\n  ResolvedIntentConfig,\n} from '@withpotter/lib/intents/types';\n\n/**\n * Where Home's \"Add product\" sends the merchant: type one, or import a sheet.\n *\n * A business running several archetypes lists its products by name — the\n * sidebar's Inventory asks for `intent=sell-products`, and the API matches it\n * exactly. Home's links named no intent, so the editor and the importer filed\n * the new item under `primary`: the first archetype, or whichever one was open\n * last. A product added from Home became an event or a service and never\n * showed in Inventory.\n *\n * So the links name the archetype the button speaks for: one whose word for an\n * item is the word on the button, selling products first when several share\n * it. A merchant's own rename matches no archetype; then it is selling\n * products, if the business does, else its first archetype. A business with\n * one archetype is never narrowed, so its links stay as they were.\n */\nexport function homeAddItemIntent(\n  config: Pick<ResolvedIntentConfig, 'mode' | 'all'>,\n  label: EntityLabel,\n): string | undefined {\n  if (config.mode !== 'multi' || config.all.length === 0) return undefined;\n\n  const word = label.singular.toLowerCase();\n  const named = config.all.filter(\n    (c) => c.entities.item.singular.toLowerCase() === word,\n  );\n  const products = (list: IntentConfig[]) =>\n    list.find((c) => c.key === 'sell-products');\n\n  return (\n    products(named) ??\n    named[0] ??\n    products(config.all) ??\n    config.all[0]\n  ).key;\n}\n\nexport function homeAddItemLinks(intent: string | undefined): {\n  create: string;\n  importSheet: string;\n} {\n  if (!intent)\n    return {\n      create: '/dashboard/catalog/new',\n      importSheet: '/dashboard/catalog?import=1',\n    };\n  const key = encodeURIComponent(intent);\n  return {\n    create: `/dashboard/catalog/new?intent=${key}`,\n    importSheet: `/dashboard/catalog?intent=${key}&import=1`,\n  };\n}\n"],"mappings":"AAsBO,SAAS,kBACd,QACA,OACoB;AACpB,MAAI,OAAO,SAAS,WAAW,OAAO,IAAI,WAAW,EAAG,QAAO;AAE/D,QAAM,OAAO,MAAM,SAAS,YAAY;AACxC,QAAM,QAAQ,OAAO,IAAI;AAAA,IACvB,CAAC,MAAM,EAAE,SAAS,KAAK,SAAS,YAAY,MAAM;AAAA,EACpD;AACA,QAAM,WAAW,CAAC,SAChB,KAAK,KAAK,CAAC,MAAM,EAAE,QAAQ,eAAe;AAE5C,UACE,SAAS,KAAK,KACd,MAAM,CAAC,KACP,SAAS,OAAO,GAAG,KACnB,OAAO,IAAI,CAAC,GACZ;AACJ;AAEO,SAAS,iBAAiB,QAG/B;AACA,MAAI,CAAC;AACH,WAAO;AAAA,MACL,QAAQ;AAAA,MACR,aAAa;AAAA,IACf;AACF,QAAM,MAAM,mBAAmB,MAAM;AACrC,SAAO;AAAA,IACL,QAAQ,iCAAiC,GAAG;AAAA,IAC5C,aAAa,6BAA6B,GAAG;AAAA,EAC/C;AACF;","names":[]}

package/dist/dashboard/home/home-ask.d.ts

@@ -0,0 +1,35 @@
+import { type RefObject } from 'react';
+/**
+ * The home's one box: a search, and a way to reach support.
+ *
+ * SEARCH IS THE DEFAULT. Clicking the field folds the board away and fills the
+ * room with what has been happening, then with what matches as you type, and a
+ * row opens that record. See `AskResults` and `SearchTips`.
+ *
+ * SUPPORT IS A MODE, chosen on the pill beside the paperclip or entered by
+ * using the mic or the paperclip, neither of which can be searched for. In it
+ * the round send button grows into "Send to support" and opens a case through
+ * the same call the Support page uses, with the message, and the voice note or
+ * picture, attached. A voice note can go with no words; a picture cannot, and
+ * the card says so under it. The mechanics live in `useAskSupport`.
+ *
+ * ENTER SENDS, SHIFT+ENTER BREAKS THE LINE. In search it only keeps the caret
+ * where it is, because the list under the box is the answer; an IME
+ * composition's Enter is neither and is left alone.
+ *
+ * THE NOTICE STRIP IS DRIVEN BY `usage`, and renders nothing without it. There
+ * is no usage figure to read yet, so the home passes none; when there is,
+ * handing it in is the whole of the wiring.
+ */
+export declare function HomeAsk({ 
+/** Optional handle, so the page header's Box control can focus this. */
+inputRef: externalRef, usage, onOpenChange, }: {
+    /** The search opened or closed; the page folds the board away on open. */
+    onOpenChange?: (open: boolean) => void;
+    inputRef?: RefObject<HTMLTextAreaElement | null>;
+    /** Share of the allowance used, and where "View usage" goes. */
+    usage?: {
+        percent: number;
+        href: string;
+    };
+}): import("react").JSX.Element;

package/dist/dashboard/home/home-ask.js

@@ -0,0 +1,295 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from "react";
+import Link from "next/link";
+import { Info, X } from "lucide-react";
+import { AutoGrowTextarea } from "@withpotter/ui-kit/auto-grow-textarea";
+import { useEntityLabel } from "@withpotter/lib/intents/use-entity-label";
+import { AskControls } from "./ask-controls";
+import { AskGlow } from "./ask-glow";
+import { AskModeChip } from "./ask-mode-chip";
+import { AskSendButton } from "./ask-send-button";
+import { AskSupportAttachments } from "./ask-support-attachments";
+import { useAskSupport } from "./use-ask-support";
+import { AnimatePresence, motion } from "motion/react";
+import { springs } from "@withpotter/lib/motion";
+import { SUPPORT_NAME } from "@withpotter/lib/support";
+import { AskResults } from "./ask-results";
+import { SearchTips } from "./search-tips";
+import { HomeQuickActions } from "./home-quick-actions";
+function HomeAsk({
+  /** Optional handle, so the page header's Box control can focus this. */
+  inputRef: externalRef,
+  usage,
+  onOpenChange
+}) {
+  const orderLabel = useEntityLabel("order");
+  const itemLabel = useEntityLabel("item");
+  const prompts = useMemo(
+    () => [
+      `Search ${orderLabel.plural.toLowerCase()} by customer name`,
+      "Search customers by name or email",
+      `Search ${itemLabel.plural.toLowerCase()} by name or SKU`,
+      `Find an invoice by number`
+    ],
+    [orderLabel, itemLabel]
+  );
+  const focusedPrompt = `Search ${orderLabel.plural.toLowerCase()}, customers, ${itemLabel.plural.toLowerCase()}\u2026`;
+  const [i, setI] = useState(0);
+  const [value, setValue] = useState("");
+  const [focused, setFocused] = useState(false);
+  const [noticeDismissed, setNoticeDismissed] = useState(false);
+  const [mode, setMode] = useState("search");
+  const ownRef = useRef(null);
+  const inputRef = externalRef ?? ownRef;
+  const root = useRef(null);
+  const [searching, setSearching] = useState(false);
+  const setOpen = (next) => {
+    setSearching(next);
+    onOpenChange?.(next);
+  };
+  const support = useAskSupport(value, setValue, () => setMode("search"));
+  const inSupport = mode === "support" || support.engaged;
+  const recording = support.composer.recordingNow;
+  const voice = {
+    supported: support.voiceSupported,
+    active: recording,
+    start: () => {
+      setMode("support");
+      support.startVoice();
+    },
+    stop: support.stopVoice,
+    /* One clip at a time: remove it to record another. */
+    disabled: Boolean(support.composer.voice) || support.composer.recorder.isBusy
+  };
+  const latest = useRef({ mode, engaged: false, value: "" });
+  useEffect(() => {
+    latest.current = { mode, engaged: support.engaged, value };
+  });
+  const closeSearch = () => {
+    setOpen(false);
+    const l = latest.current;
+    if (l.mode === "support" && !l.engaged && !l.value.trim()) {
+      setMode("search");
+    }
+  };
+  useEffect(() => {
+    if (!searching) return;
+    const onDown = (e) => {
+      const t = e.target;
+      const inside = !!root.current?.contains(t) && !!t.closest('[data-ask-card],a,button,input,textarea,[role="menu"]');
+      const inMenu = !!t.closest('[role="menu"]');
+      if (!inside && !inMenu) closeSearch();
+    };
+    document.addEventListener("pointerdown", onDown);
+    return () => document.removeEventListener("pointerdown", onDown);
+  }, [searching]);
+  const supportPrompt = recording ? "Listening. What you say appears here\u2026" : "Tell support what you need\u2026";
+  useEffect(() => {
+    if (focused || value || inSupport) return;
+    const t = setInterval(() => setI((n) => (n + 1) % prompts.length), 4200);
+    return () => clearInterval(t);
+  }, [focused, value, inSupport, prompts.length]);
+  const canSearchSend = value.trim().length > 0;
+  const submit = () => {
+    inputRef.current?.focus();
+  };
+  const showNotice = !!usage && !noticeDismissed;
+  return /* @__PURE__ */ jsxs("div", { ref: root, className: "relative isolate w-full", children: [
+    showNotice && /* @__PURE__ */ jsxs("div", { className: "flex h-11 items-center gap-3 rounded-t-[var(--radius-card)] bg-[var(--bg-muted)] pb-3 pl-4 pr-3 text-sm text-[var(--text-primary)]", children: [
+      /* @__PURE__ */ jsx(
+        Info,
+        {
+          "aria-hidden": true,
+          className: "size-4 shrink-0 text-[var(--text-tertiary)]"
+        }
+      ),
+      /* @__PURE__ */ jsxs("p", { className: "min-w-0 flex-1 truncate", children: [
+        "You've used ",
+        Math.round(usage.percent),
+        "% of your tokens.",
+        " ",
+        /* @__PURE__ */ jsx(Link, { href: usage.href, className: "text-brand-500 hover:underline", children: "View usage" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setNoticeDismissed(true),
+          "aria-label": "Dismiss",
+          className: "grid size-6 shrink-0 place-items-center rounded-md text-[var(--text-tertiary)] transition-colors hover:text-[var(--text-primary)]",
+          children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-ask-card": true,
+        className: `group relative rounded-[var(--radius-card)] border border-[var(--border-default)] bg-[color-mix(in_srgb,var(--bg-muted)_55%,var(--bg-base))] transition-colors focus-within:border-[color-mix(in_srgb,var(--brand-500)_45%,var(--text-muted))] ${showNotice ? "-mt-3" : ""}`,
+        children: [
+          /* @__PURE__ */ jsx(AskGlow, {}),
+          /* @__PURE__ */ jsx(AskSupportAttachments, { support }),
+          /* @__PURE__ */ jsxs("div", { className: "relative px-4 pt-3", children: [
+            /* @__PURE__ */ jsx(
+              AutoGrowTextarea,
+              {
+                ref: inputRef,
+                value,
+                onChange: (e) => setValue(e.target.value),
+                onFocus: () => {
+                  setFocused(true);
+                  setOpen(true);
+                },
+                onBlur: () => setFocused(false),
+                onClick: () => {
+                  if (!searching) setOpen(true);
+                },
+                onKeyDown: (e) => {
+                  if (e.nativeEvent.isComposing) return;
+                  if (e.key === "Enter" && !e.shiftKey) {
+                    e.preventDefault();
+                    if (inSupport) void support.send();
+                    else submit();
+                  }
+                  if (e.key === "Escape") {
+                    if (!inSupport) setValue("");
+                    closeSearch();
+                    e.currentTarget.blur();
+                  }
+                },
+                "aria-label": inSupport ? "Message to support" : "Search",
+                className: "block min-h-[36px] w-full bg-transparent text-md text-[var(--text-primary)] outline-none"
+              }
+            ),
+            !value && /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": true,
+                className: "pointer-events-none absolute inset-x-4 top-3 flex items-start",
+                children: (inSupport ? [supportPrompt] : focused ? [focusedPrompt] : prompts).map((p, n) => /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: `block truncate text-md text-[var(--text-muted)] transition-opacity duration-[var(--motion-slow)] ${focused || inSupport || n === i ? "opacity-100" : "absolute inset-0 opacity-0"}`,
+                    children: p
+                  },
+                  p
+                ))
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 pb-2 pt-1", children: [
+            /* @__PURE__ */ jsx(
+              AskModeChip,
+              {
+                mode: inSupport ? "support" : "search",
+                onChange: setMode,
+                locked: support.engaged
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-2", children: /* @__PURE__ */ jsx(
+              AskControls,
+              {
+                voice,
+                voiceLabels: {
+                  start: "Record a voice note for support",
+                  stop: "Stop recording"
+                },
+                value,
+                canSend: canSearchSend,
+                engaged: false,
+                inputRef,
+                onSubmit: submit,
+                onClose: () => inputRef.current?.blur(),
+                send: !inSupport ? /* @__PURE__ */ jsx(Fragment, {}) : /* @__PURE__ */ jsx(
+                  AskSendButton,
+                  {
+                    support: inSupport,
+                    canSend: inSupport ? support.canSend : canSearchSend,
+                    sending: support.sending,
+                    sent: support.sent,
+                    title: support.needsCaption ? "Add a few words about the picture first" : void 0,
+                    onClick: () => void support.send()
+                  }
+                )
+              }
+            ) })
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(AnimatePresence, { initial: false, mode: "popLayout", children: !searching && /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0, transition: { duration: 0.1 } },
+        transition: { duration: 0.2 },
+        children: /* @__PURE__ */ jsx(HomeQuickActions, {})
+      },
+      "quick"
+    ) }),
+    /* @__PURE__ */ jsxs(AnimatePresence, { initial: false, mode: "popLayout", children: [
+      searching && inSupport && /* @__PURE__ */ jsxs(
+        motion.div,
+        {
+          className: "mt-3 px-1 text-center text-sm text-[var(--text-tertiary)]",
+          initial: { opacity: 0, y: 12 },
+          animate: { opacity: 1, y: 0 },
+          exit: { opacity: 0, y: 8, transition: { duration: 0.12 } },
+          transition: springs.gentle,
+          children: [
+            "This goes to ",
+            SUPPORT_NAME,
+            " support. We reply in Support and by email."
+          ]
+        },
+        "support"
+      ),
+      searching && !inSupport && /* @__PURE__ */ jsxs(
+        motion.div,
+        {
+          className: "mt-3",
+          initial: { opacity: 0, y: 12 },
+          animate: { opacity: 1, y: 0 },
+          exit: { opacity: 0, y: 8, transition: { duration: 0.12 } },
+          transition: springs.gentle,
+          children: [
+            !value.trim() && /* 260px from the card to the top of the first suggestion on a tall
+               window. The quick actions are hidden while the search is open,
+               so the only thing between is the rail's own 8px of top padding
+               and this margin: 252. On a short window the gap gives way
+               instead of the page scrolling: 100vh less what sits above the
+               rail (about 271px of heading and box) and the rail itself
+               (296px) and the container's inset, never below 24px. The list's
+               12px margin above collapses into this one, so it adds nothing. */
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  marginTop: "clamp(24px, calc(100vh - 585px), 252px)"
+                },
+                children: /* @__PURE__ */ jsx(SearchTips, {})
+              }
+            ),
+            value.trim() && /* @__PURE__ */ jsx(
+              AskResults,
+              {
+                query: value,
+                onNavigate: () => {
+                  setOpen(false);
+                  setValue("");
+                }
+              }
+            )
+          ]
+        },
+        "search"
+      )
+    ] })
+  ] });
+}
+export {
+  HomeAsk
+};
+//# sourceMappingURL=home-ask.js.map

package/dist/dashboard/home/home-ask.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/dashboard/home/home-ask.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useMemo, useRef, useState, type RefObject } from 'react';\nimport Link from 'next/link';\nimport { Info, X } from 'lucide-react';\nimport { AutoGrowTextarea } from '@withpotter/ui-kit/auto-grow-textarea';\nimport { useEntityLabel } from '@withpotter/lib/intents/use-entity-label';\nimport { AskControls } from './ask-controls';\nimport { AskGlow } from './ask-glow';\nimport { AskModeChip, type AskMode } from './ask-mode-chip';\nimport { AskSendButton } from './ask-send-button';\nimport { AskSupportAttachments } from './ask-support-attachments';\nimport { useAskSupport } from './use-ask-support';\nimport { AnimatePresence, motion } from 'motion/react';\nimport { springs } from '@withpotter/lib/motion';\nimport { SUPPORT_NAME } from '@withpotter/lib/support';\nimport { AskResults } from './ask-results';\nimport { SearchTips } from './search-tips';\nimport { HomeQuickActions } from './home-quick-actions';\n\n/**\n * The home's one box: a search, and a way to reach support.\n *\n * SEARCH IS THE DEFAULT. Clicking the field folds the board away and fills the\n * room with what has been happening, then with what matches as you type, and a\n * row opens that record. See `AskResults` and `SearchTips`.\n *\n * SUPPORT IS A MODE, chosen on the pill beside the paperclip or entered by\n * using the mic or the paperclip, neither of which can be searched for. In it\n * the round send button grows into \"Send to support\" and opens a case through\n * the same call the Support page uses, with the message, and the voice note or\n * picture, attached. A voice note can go with no words; a picture cannot, and\n * the card says so under it. The mechanics live in `useAskSupport`.\n *\n * ENTER SENDS, SHIFT+ENTER BREAKS THE LINE. In search it only keeps the caret\n * where it is, because the list under the box is the answer; an IME\n * composition's Enter is neither and is left alone.\n *\n * THE NOTICE STRIP IS DRIVEN BY `usage`, and renders nothing without it. There\n * is no usage figure to read yet, so the home passes none; when there is,\n * handing it in is the whole of the wiring.\n */\nexport function HomeAsk({\n  /** Optional handle, so the page header's Box control can focus this. */\n  inputRef: externalRef,\n  usage,\n  onOpenChange,\n}: {\n  /** The search opened or closed; the page folds the board away on open. */\n  onOpenChange?: (open: boolean) => void;\n  inputRef?: RefObject<HTMLTextAreaElement | null>;\n  /** Share of the allowance used, and where \"View usage\" goes. */\n  usage?: { percent: number; href: string };\n}) {\n  const orderLabel = useEntityLabel('order');\n  const itemLabel = useEntityLabel('item');\n  /* SEARCH WORDING, NOT QUESTIONS. This field finds records, so what it\n     suggests is what can be found; `askPlaceholders` are things to ask the\n     assistant and no longer belong here. */\n  const prompts = useMemo(\n    () => [\n      `Search ${orderLabel.plural.toLowerCase()} by customer name`,\n      'Search customers by name or email',\n      `Search ${itemLabel.plural.toLowerCase()} by name or SKU`,\n      `Find an invoice by number`,\n    ],\n    [orderLabel, itemLabel],\n  );\n  const focusedPrompt = `Search ${orderLabel.plural.toLowerCase()}, customers, ${itemLabel.plural.toLowerCase()}…`;\n  const [i, setI] = useState(0);\n  const [value, setValue] = useState('');\n  const [focused, setFocused] = useState(false);\n  const [noticeDismissed, setNoticeDismissed] = useState(false);\n  /* What the box is for. Search unless someone chose Support, or put a voice\n     note or a picture on the card, which can only go to support. */\n  const [mode, setMode] = useState<AskMode>('search');\n  const ownRef = useRef<HTMLTextAreaElement>(null);\n  const inputRef = externalRef ?? ownRef;\n  const root = useRef<HTMLDivElement>(null);\n\n  /* THE SEARCH, NOT A CONVERSATION. Focusing the field opens it: the page\n     folds the board away and the room holds what has been happening, then what\n     matches as you type. It stays open across a blur (pressing a result blurs\n     the field before the click lands) and closes on Escape, a press outside\n     this card and its list, or navigating. */\n  const [searching, setSearching] = useState(false);\n  const setOpen = (next: boolean) => {\n    setSearching(next);\n    onOpenChange?.(next);\n  };\n\n  /* After a case goes and the green \"Sent\" has had its moment, the box is\n     back to what it normally is: a search. */\n  const support = useAskSupport(value, setValue, () => setMode('search'));\n  const inSupport = mode === 'support' || support.engaged;\n  const recording = support.composer.recordingNow;\n  const voice = {\n    supported: support.voiceSupported,\n    active: recording,\n    start: () => {\n      setMode('support');\n      support.startVoice();\n    },\n    stop: support.stopVoice,\n    /* One clip at a time: remove it to record another. */\n    disabled:\n      Boolean(support.composer.voice) || support.composer.recorder.isBusy,\n  };\n  /* The latest of these, for the handlers below that were created on an\n     earlier render and would otherwise close over stale ones. */\n  const latest = useRef({ mode, engaged: false, value: '' });\n  useEffect(() => {\n    latest.current = { mode, engaged: support.engaged, value };\n  });\n  /* CLOSING THE SEARCH ENDS A SUPPORT MODE NOBODY IS USING. Support is sticky\n     on purpose while there is something in the box, but a pill left on Support\n     after the box was emptied and closed hid the carousel next time with no\n     sign of why, and the bottom of the page just sat blank. If there are words\n     or an attachment, the mode stays; if not, the box goes back to searching. */\n  const closeSearch = () => {\n    setOpen(false);\n    const l = latest.current;\n    if (l.mode === 'support' && !l.engaged && !l.value.trim()) {\n      setMode('search');\n    }\n  };\n  useEffect(() => {\n    if (!searching) return;\n    /* STAYS OPEN ONLY FOR A PRESS ON SOMETHING. The search block is wider and\n       taller than anything in it: it holds the empty gap under the box and the\n       carousel's own background, and a press there is a press on nothing. So\n       \"inside\" is the card itself or a real control in this block (a link, a\n       button, a field), plus the Add menu, which is portaled out of it. */\n    const onDown = (e: PointerEvent) => {\n      const t = e.target as HTMLElement;\n      const inside =\n        !!root.current?.contains(t) &&\n        !!t.closest('[data-ask-card],a,button,input,textarea,[role=\"menu\"]');\n      const inMenu = !!t.closest('[role=\"menu\"]');\n      if (!inside && !inMenu) closeSearch();\n    };\n    document.addEventListener('pointerdown', onDown);\n    return () => document.removeEventListener('pointerdown', onDown);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searching]);\n\n  const supportPrompt = recording\n    ? 'Listening. What you say appears here…'\n    : 'Tell support what you need…';\n\n  /* The rotation stops the moment there is a caret in the field: a placeholder\n     that keeps changing under one reads as the field arguing with you. */\n  useEffect(() => {\n    if (focused || value || inSupport) return;\n    const t = setInterval(() => setI((n) => (n + 1) % prompts.length), 4200);\n    return () => clearInterval(t);\n  }, [focused, value, inSupport, prompts.length]);\n\n  const canSearchSend = value.trim().length > 0;\n\n  /* No hand-off to the ask screen: this field searches. Enter keeps the\n     caret where it is and the list under it is the answer. */\n  const submit = () => {\n    inputRef.current?.focus();\n  };\n\n  const showNotice = !!usage && !noticeDismissed;\n\n  return (\n    <div ref={root} className=\"relative isolate w-full\">\n      {showNotice && (\n        <div className=\"flex h-11 items-center gap-3 rounded-t-[var(--radius-card)] bg-[var(--bg-muted)] pb-3 pl-4 pr-3 text-sm text-[var(--text-primary)]\">\n          <Info\n            aria-hidden\n            className=\"size-4 shrink-0 text-[var(--text-tertiary)]\"\n          />\n          <p className=\"min-w-0 flex-1 truncate\">\n            You&apos;ve used {Math.round(usage.percent)}% of your tokens.{' '}\n            <Link href={usage.href} className=\"text-brand-500 hover:underline\">\n              View usage\n            </Link>\n          </p>\n          <button\n            type=\"button\"\n            onClick={() => setNoticeDismissed(true)}\n            aria-label=\"Dismiss\"\n            className=\"grid size-6 shrink-0 place-items-center rounded-md text-[var(--text-tertiary)] transition-colors hover:text-[var(--text-primary)]\"\n          >\n            <X className=\"size-4\" />\n          </button>\n        </div>\n      )}\n\n      {/* The card overlaps the strip's bottom edge, which is why the strip\n          carries a padding-bottom it never shows: the card's top border runs\n          through the strip, as drawn. */}\n      <div\n        data-ask-card\n        className={`group relative rounded-[var(--radius-card)] border border-[var(--border-default)] bg-[color-mix(in_srgb,var(--bg-muted)_55%,var(--bg-base))] transition-colors focus-within:border-[color-mix(in_srgb,var(--brand-500)_45%,var(--text-muted))] ${\n          showNotice ? '-mt-3' : ''\n        }`}\n      >\n        {/* The rings sit at -z-10 behind this card's OPAQUE fill, which is what\n            keeps the centre clear. They bloom on hover and on focus. */}\n        <AskGlow />\n        <AskSupportAttachments support={support} />\n        <div className=\"relative px-4 pt-3\">\n          <AutoGrowTextarea\n            ref={inputRef}\n            value={value}\n            onChange={(e) => setValue(e.target.value)}\n            onFocus={() => {\n              setFocused(true);\n              setOpen(true);\n            }}\n            onBlur={() => setFocused(false)}\n            /* Focus alone is not enough: close the search with the box still\n               focused (a press on a non-focusable part of the page can leave\n               it so) and clicking back in fires no focus event, so nothing\n               opened and the bottom stayed blank. */\n            onClick={() => {\n              if (!searching) setOpen(true);\n            }}\n            onKeyDown={(e) => {\n              if (e.nativeEvent.isComposing) return;\n              if (e.key === 'Enter' && !e.shiftKey) {\n                e.preventDefault();\n                if (inSupport) void support.send();\n                else submit();\n              }\n              if (e.key === 'Escape') {\n                /* A message to support is somebody's words: closing the box\n                   does not throw them away. */\n                if (!inSupport) setValue('');\n                closeSearch();\n                e.currentTarget.blur();\n              }\n            }}\n            aria-label={inSupport ? 'Message to support' : 'Search'}\n            className=\"block min-h-[36px] w-full bg-transparent text-md text-[var(--text-primary)] outline-none\"\n          />\n          {/* Crossfading placeholders, stacked so the card never changes\n              height and the rotation cannot reflow it. Rendered beside the\n              field rather than as its `placeholder`, which cannot animate. */}\n          {!value && (\n            <span\n              aria-hidden\n              className=\"pointer-events-none absolute inset-x-4 top-3 flex items-start\"\n            >\n              {(inSupport\n                ? [supportPrompt]\n                : focused\n                  ? [focusedPrompt]\n                  : prompts\n              ).map((p, n) => (\n                <span\n                  key={p}\n                  className={`block truncate text-md text-[var(--text-muted)] transition-opacity duration-[var(--motion-slow)] ${\n                    focused || inSupport || n === i\n                      ? 'opacity-100'\n                      : 'absolute inset-0 opacity-0'\n                  }`}\n                >\n                  {p}\n                </span>\n              ))}\n            </span>\n          )}\n        </div>\n\n        <div className=\"flex items-center gap-2 px-3 pb-2 pt-1\">\n          {/* The plus that attached a picture is out of this row for now, on\n              John's call, 2026-10-09. Sending a picture to support still works\n              underneath (`support.composer.pickImage`, and the card's\n              attachment frame); put a button back here to reach it. */}\n          <AskModeChip\n            mode={inSupport ? 'support' : 'search'}\n            onChange={setMode}\n            locked={support.engaged}\n          />\n\n          <div className=\"ml-auto flex items-center gap-2\">\n            <AskControls\n              voice={voice}\n              voiceLabels={{\n                start: 'Record a voice note for support',\n                stop: 'Stop recording',\n              }}\n              value={value}\n              canSend={canSearchSend}\n              engaged={false}\n              inputRef={inputRef}\n              onSubmit={submit}\n              onClose={() => inputRef.current?.blur()}\n              /* SEARCH HAS NO SEND BUTTON. Results update as you type, so an\n                 arrow there was a control that did nothing and made the box\n                 read as a chat input. It appears in Message support, where\n                 pressing it really sends. */\n              send={\n                !inSupport ? (\n                  <></>\n                ) : (\n                <AskSendButton\n                  support={inSupport}\n                  canSend={inSupport ? support.canSend : canSearchSend}\n                  sending={support.sending}\n                  sent={support.sent}\n                  title={\n                    support.needsCaption\n                      ? 'Add a few words about the picture first'\n                      : undefined\n                  }\n                  onClick={() => void support.send()}\n                />\n                )\n              }\n            />\n          </div>\n        </div>\n      </div>\n      {/* THE QUICK ACTIONS STEP ASIDE while the search is open. They are the\n          most-used things on the page, so they are there whenever the box is\n          closed; once you click in, the room under it belongs to the search.\n          `popLayout` takes them out of the flow at once and fades them where\n          they stood, so the carousel does not wait for them to finish leaving. */}\n      <AnimatePresence initial={false} mode=\"popLayout\">\n        {!searching && (\n          <motion.div\n            key=\"quick\"\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            exit={{ opacity: 0, transition: { duration: 0.1 } }}\n            transition={{ duration: 0.2 }}\n          >\n            <HomeQuickActions />\n          </motion.div>\n        )}\n      </AnimatePresence>\n\n      {/* The results rise in from below as the board lifts away, and sink back\n          out of the way when you click off, so the page never just blinks\n          between states. `popLayout`, not `wait`, so the results start at once\n          instead of after the old state has finished leaving. */}\n      <AnimatePresence initial={false} mode=\"popLayout\">\n        {searching && inSupport && (\n          <motion.div\n            key=\"support\"\n            className=\"mt-3 px-1 text-center text-sm text-[var(--text-tertiary)]\"\n            initial={{ opacity: 0, y: 12 }}\n            animate={{ opacity: 1, y: 0 }}\n            exit={{ opacity: 0, y: 8, transition: { duration: 0.12 } }}\n            transition={springs.gentle}\n          >\n            This goes to {SUPPORT_NAME} support. We reply in Support and by email.\n          </motion.div>\n        )}\n        {searching && !inSupport && (\n          <motion.div\n            key=\"search\"\n            className=\"mt-3\"\n            initial={{ opacity: 0, y: 12 }}\n            animate={{ opacity: 1, y: 0 }}\n            exit={{ opacity: 0, y: 8, transition: { duration: 0.12 } }}\n            transition={springs.gentle}\n          >\n            {/* Before anything is typed: suggestions that move on their own. */}\n            {!value.trim() && (\n              /* 260px from the card to the top of the first suggestion on a tall\n                 window. The quick actions are hidden while the search is open,\n                 so the only thing between is the rail's own 8px of top padding\n                 and this margin: 252. On a short window the gap gives way\n                 instead of the page scrolling: 100vh less what sits above the\n                 rail (about 271px of heading and box) and the rail itself\n                 (296px) and the container's inset, never below 24px. The list's\n                 12px margin above collapses into this one, so it adds nothing. */\n              <div\n                style={{\n                  marginTop: 'clamp(24px, calc(100vh - 585px), 252px)',\n                }}\n              >\n                <SearchTips />\n              </div>\n            )}\n            {/* Results only once there is something to look for. With an empty\n                box the carousel above is the whole panel: a list of recent\n                orders and customers under it read as a second, unrelated\n                thing, and it cost three requests on every focus. */}\n            {value.trim() && (\n              <AskResults\n                query={value}\n                onNavigate={() => {\n                  setOpen(false);\n                  setValue('');\n                }}\n              />\n            )}\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n}\n"],"mappings":";AA4KU,SAgIQ,UAhIR,KAIA,YAJA;AA1KV,SAAS,WAAW,SAAS,QAAQ,gBAAgC;AACrE,OAAO,UAAU;AACjB,SAAS,MAAM,SAAS;AACxB,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AACxB,SAAS,mBAAiC;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,6BAA6B;AACtC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB,cAAc;AACxC,SAAS,eAAe;AACxB,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AAwB1B,SAAS,QAAQ;AAAA;AAAA,EAEtB,UAAU;AAAA,EACV;AAAA,EACA;AACF,GAMG;AACD,QAAM,aAAa,eAAe,OAAO;AACzC,QAAM,YAAY,eAAe,MAAM;AAIvC,QAAM,UAAU;AAAA,IACd,MAAM;AAAA,MACJ,UAAU,WAAW,OAAO,YAAY,CAAC;AAAA,MACzC;AAAA,MACA,UAAU,UAAU,OAAO,YAAY,CAAC;AAAA,MACxC;AAAA,IACF;AAAA,IACA,CAAC,YAAY,SAAS;AAAA,EACxB;AACA,QAAM,gBAAgB,UAAU,WAAW,OAAO,YAAY,CAAC,gBAAgB,UAAU,OAAO,YAAY,CAAC;AAC7G,QAAM,CAAC,GAAG,IAAI,IAAI,SAAS,CAAC;AAC5B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAG5D,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,QAAQ;AAClD,QAAM,SAAS,OAA4B,IAAI;AAC/C,QAAM,WAAW,eAAe;AAChC,QAAM,OAAO,OAAuB,IAAI;AAOxC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,UAAU,CAAC,SAAkB;AACjC,iBAAa,IAAI;AACjB,mBAAe,IAAI;AAAA,EACrB;AAIA,QAAM,UAAU,cAAc,OAAO,UAAU,MAAM,QAAQ,QAAQ,CAAC;AACtE,QAAM,YAAY,SAAS,aAAa,QAAQ;AAChD,QAAM,YAAY,QAAQ,SAAS;AACnC,QAAM,QAAQ;AAAA,IACZ,WAAW,QAAQ;AAAA,IACnB,QAAQ;AAAA,IACR,OAAO,MAAM;AACX,cAAQ,SAAS;AACjB,cAAQ,WAAW;AAAA,IACrB;AAAA,IACA,MAAM,QAAQ;AAAA;AAAA,IAEd,UACE,QAAQ,QAAQ,SAAS,KAAK,KAAK,QAAQ,SAAS,SAAS;AAAA,EACjE;AAGA,QAAM,SAAS,OAAO,EAAE,MAAM,SAAS,OAAO,OAAO,GAAG,CAAC;AACzD,YAAU,MAAM;AACd,WAAO,UAAU,EAAE,MAAM,SAAS,QAAQ,SAAS,MAAM;AAAA,EAC3D,CAAC;AAMD,QAAM,cAAc,MAAM;AACxB,YAAQ,KAAK;AACb,UAAM,IAAI,OAAO;AACjB,QAAI,EAAE,SAAS,aAAa,CAAC,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,GAAG;AACzD,cAAQ,QAAQ;AAAA,IAClB;AAAA,EACF;AACA,YAAU,MAAM;AACd,QAAI,CAAC,UAAW;AAMhB,UAAM,SAAS,CAAC,MAAoB;AAClC,YAAM,IAAI,EAAE;AACZ,YAAM,SACJ,CAAC,CAAC,KAAK,SAAS,SAAS,CAAC,KAC1B,CAAC,CAAC,EAAE,QAAQ,uDAAuD;AACrE,YAAM,SAAS,CAAC,CAAC,EAAE,QAAQ,eAAe;AAC1C,UAAI,CAAC,UAAU,CAAC,OAAQ,aAAY;AAAA,IACtC;AACA,aAAS,iBAAiB,eAAe,MAAM;AAC/C,WAAO,MAAM,SAAS,oBAAoB,eAAe,MAAM;AAAA,EAEjE,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,gBAAgB,YAClB,+CACA;AAIJ,YAAU,MAAM;AACd,QAAI,WAAW,SAAS,UAAW;AACnC,UAAM,IAAI,YAAY,MAAM,KAAK,CAAC,OAAO,IAAI,KAAK,QAAQ,MAAM,GAAG,IAAI;AACvE,WAAO,MAAM,cAAc,CAAC;AAAA,EAC9B,GAAG,CAAC,SAAS,OAAO,WAAW,QAAQ,MAAM,CAAC;AAE9C,QAAM,gBAAgB,MAAM,KAAK,EAAE,SAAS;AAI5C,QAAM,SAAS,MAAM;AACnB,aAAS,SAAS,MAAM;AAAA,EAC1B;AAEA,QAAM,aAAa,CAAC,CAAC,SAAS,CAAC;AAE/B,SACE,qBAAC,SAAI,KAAK,MAAM,WAAU,2BACvB;AAAA,kBACC,qBAAC,SAAI,WAAU,sIACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA;AAAA,MACZ;AAAA,MACA,qBAAC,OAAE,WAAU,2BAA0B;AAAA;AAAA,QACnB,KAAK,MAAM,MAAM,OAAO;AAAA,QAAE;AAAA,QAAkB;AAAA,QAC9D,oBAAC,QAAK,MAAM,MAAM,MAAM,WAAU,kCAAiC,wBAEnE;AAAA,SACF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS,MAAM,mBAAmB,IAAI;AAAA,UACtC,cAAW;AAAA,UACX,WAAU;AAAA,UAEV,8BAAC,KAAE,WAAU,UAAS;AAAA;AAAA,MACxB;AAAA,OACF;AAAA,IAMF;AAAA,MAAC;AAAA;AAAA,QACC,iBAAa;AAAA,QACb,WAAW,kPACT,aAAa,UAAU,EACzB;AAAA,QAIA;AAAA,8BAAC,WAAQ;AAAA,UACT,oBAAC,yBAAsB,SAAkB;AAAA,UACzC,qBAAC,SAAI,WAAU,sBACb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,KAAK;AAAA,gBACL;AAAA,gBACA,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,gBACxC,SAAS,MAAM;AACb,6BAAW,IAAI;AACf,0BAAQ,IAAI;AAAA,gBACd;AAAA,gBACA,QAAQ,MAAM,WAAW,KAAK;AAAA,gBAK9B,SAAS,MAAM;AACb,sBAAI,CAAC,UAAW,SAAQ,IAAI;AAAA,gBAC9B;AAAA,gBACA,WAAW,CAAC,MAAM;AAChB,sBAAI,EAAE,YAAY,YAAa;AAC/B,sBAAI,EAAE,QAAQ,WAAW,CAAC,EAAE,UAAU;AACpC,sBAAE,eAAe;AACjB,wBAAI,UAAW,MAAK,QAAQ,KAAK;AAAA,wBAC5B,QAAO;AAAA,kBACd;AACA,sBAAI,EAAE,QAAQ,UAAU;AAGtB,wBAAI,CAAC,UAAW,UAAS,EAAE;AAC3B,gCAAY;AACZ,sBAAE,cAAc,KAAK;AAAA,kBACvB;AAAA,gBACF;AAAA,gBACA,cAAY,YAAY,uBAAuB;AAAA,gBAC/C,WAAU;AAAA;AAAA,YACZ;AAAA,YAIC,CAAC,SACA;AAAA,cAAC;AAAA;AAAA,gBACC,eAAW;AAAA,gBACX,WAAU;AAAA,gBAER,uBACE,CAAC,aAAa,IACd,UACE,CAAC,aAAa,IACd,SACJ,IAAI,CAAC,GAAG,MACR;AAAA,kBAAC;AAAA;AAAA,oBAEC,WAAW,oGACT,WAAW,aAAa,MAAM,IAC1B,gBACA,4BACN;AAAA,oBAEC;AAAA;AAAA,kBAPI;AAAA,gBAQP,CACD;AAAA;AAAA,YACH;AAAA,aAEJ;AAAA,UAEA,qBAAC,SAAI,WAAU,0CAKb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,MAAM,YAAY,YAAY;AAAA,gBAC9B,UAAU;AAAA,gBACV,QAAQ,QAAQ;AAAA;AAAA,YAClB;AAAA,YAEA,oBAAC,SAAI,WAAU,mCACb;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,aAAa;AAAA,kBACX,OAAO;AAAA,kBACP,MAAM;AAAA,gBACR;AAAA,gBACA;AAAA,gBACA,SAAS;AAAA,gBACT,SAAS;AAAA,gBACT;AAAA,gBACA,UAAU;AAAA,gBACV,SAAS,MAAM,SAAS,SAAS,KAAK;AAAA,gBAKtC,MACE,CAAC,YACC,gCAAE,IAEJ;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAS;AAAA,oBACT,SAAS,YAAY,QAAQ,UAAU;AAAA,oBACvC,SAAS,QAAQ;AAAA,oBACjB,MAAM,QAAQ;AAAA,oBACd,OACE,QAAQ,eACJ,4CACA;AAAA,oBAEN,SAAS,MAAM,KAAK,QAAQ,KAAK;AAAA;AAAA,gBACnC;AAAA;AAAA,YAGJ,GACF;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,IAMA,oBAAC,mBAAgB,SAAS,OAAO,MAAK,aACnC,WAAC,aACA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QAEC,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,MAAM,EAAE,SAAS,GAAG,YAAY,EAAE,UAAU,IAAI,EAAE;AAAA,QAClD,YAAY,EAAE,UAAU,IAAI;AAAA,QAE5B,8BAAC,oBAAiB;AAAA;AAAA,MANd;AAAA,IAON,GAEJ;AAAA,IAMA,qBAAC,mBAAgB,SAAS,OAAO,MAAK,aACnC;AAAA,mBAAa,aACZ;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,UAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,UAC5B,MAAM,EAAE,SAAS,GAAG,GAAG,GAAG,YAAY,EAAE,UAAU,KAAK,EAAE;AAAA,UACzD,YAAY,QAAQ;AAAA,UACrB;AAAA;AAAA,YACe;AAAA,YAAa;AAAA;AAAA;AAAA,QAPvB;AAAA,MAQN;AAAA,MAED,aAAa,CAAC,aACb;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,UAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,UAC5B,MAAM,EAAE,SAAS,GAAG,GAAG,GAAG,YAAY,EAAE,UAAU,KAAK,EAAE;AAAA,UACzD,YAAY,QAAQ;AAAA,UAGnB;AAAA,aAAC,MAAM,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YASX;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,kBACL,WAAW;AAAA,gBACb;AAAA,gBAEA,8BAAC,cAAW;AAAA;AAAA,YACd;AAAA,YAMD,MAAM,KAAK,KACV;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP,YAAY,MAAM;AAChB,0BAAQ,KAAK;AACb,2BAAS,EAAE;AAAA,gBACb;AAAA;AAAA,YACF;AAAA;AAAA;AAAA,QApCE;AAAA,MAsCN;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}

package/dist/dashboard/home/home-board-fold.d.ts

@@ -0,0 +1,26 @@
+import { type ReactNode } from 'react';
+/**
+ * The home board, folding away while the search is open.
+ *
+ * It is hidden rather than unmounted, so the widgets keep their data and the
+ * board is back the moment the search closes. `inert` takes it out of the tab
+ * order while it is gone.
+ *
+ * HEIGHT IS NOT ANIMATED. Animating `height` re-lays-out the whole board on
+ * every frame, and the search block above it is growing at the same moment, so
+ * the page was reflowing twice a frame. The height flips once, and the board is
+ * left to fade and lift on opacity and transform alone, which the GPU does
+ * without a layout.
+ *
+ * AND IT LEAVES LAYOUT ONCE IT HAS FADED. A height of 0 alone is not enough:
+ * with its overflow visible (so it can be seen fading) a zero-height board
+ * still adds its whole 570px to the page's scrollable area, which left the
+ * carousel with most of a screen of empty space under it. `gone` is set when an
+ * animation ends with the search open, and it stops mattering the moment the
+ * search closes, because `display` only goes to `none` while `open` is true.
+ */
+export declare function HomeBoardFold({ open, children, }: {
+    /** The search is open, so the board is out of the way. */
+    open: boolean;
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/dashboard/home/home-board-fold.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { motion, useReducedMotion } from "motion/react";
+import { springs } from "@withpotter/lib/motion";
+function HomeBoardFold({
+  open,
+  children
+}) {
+  const reduceMotion = useReducedMotion() ?? false;
+  const [gone, setGone] = useState(false);
+  return /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      initial: false,
+      style: {
+        height: open ? 0 : "auto",
+        display: open && gone ? "none" : void 0
+      },
+      animate: open ? { opacity: 0, y: -16 } : { opacity: 1, y: 0 },
+      onAnimationComplete: () => setGone(open),
+      transition: reduceMotion ? { duration: 0 } : {
+        y: springs.gentle,
+        opacity: { duration: open ? 0.14 : 0.26 }
+      },
+      inert: open,
+      children
+    }
+  );
+}
+export {
+  HomeBoardFold
+};
+//# sourceMappingURL=home-board-fold.js.map

package/dist/dashboard/home/home-board-fold.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/dashboard/home/home-board-fold.tsx"],"sourcesContent":["'use client';\n\nimport { useState, type ReactNode } from 'react';\nimport { motion, useReducedMotion } from 'motion/react';\nimport { springs } from '@withpotter/lib/motion';\n\n/**\n * The home board, folding away while the search is open.\n *\n * It is hidden rather than unmounted, so the widgets keep their data and the\n * board is back the moment the search closes. `inert` takes it out of the tab\n * order while it is gone.\n *\n * HEIGHT IS NOT ANIMATED. Animating `height` re-lays-out the whole board on\n * every frame, and the search block above it is growing at the same moment, so\n * the page was reflowing twice a frame. The height flips once, and the board is\n * left to fade and lift on opacity and transform alone, which the GPU does\n * without a layout.\n *\n * AND IT LEAVES LAYOUT ONCE IT HAS FADED. A height of 0 alone is not enough:\n * with its overflow visible (so it can be seen fading) a zero-height board\n * still adds its whole 570px to the page's scrollable area, which left the\n * carousel with most of a screen of empty space under it. `gone` is set when an\n * animation ends with the search open, and it stops mattering the moment the\n * search closes, because `display` only goes to `none` while `open` is true.\n */\nexport function HomeBoardFold({\n  open,\n  children,\n}: {\n  /** The search is open, so the board is out of the way. */\n  open: boolean;\n  children: ReactNode;\n}) {\n  const reduceMotion = useReducedMotion() ?? false;\n  const [gone, setGone] = useState(false);\n\n  return (\n    <motion.div\n      initial={false}\n      style={{\n        height: open ? 0 : 'auto',\n        display: open && gone ? 'none' : undefined,\n      }}\n      animate={open ? { opacity: 0, y: -16 } : { opacity: 1, y: 0 }}\n      onAnimationComplete={() => setGone(open)}\n      transition={\n        reduceMotion\n          ? { duration: 0 }\n          : {\n              y: springs.gentle,\n              opacity: { duration: open ? 0.14 : 0.26 },\n            }\n      }\n      inert={open}\n    >\n      {children}\n    </motion.div>\n  );\n}\n"],"mappings":";AAsCI;AApCJ,SAAS,gBAAgC;AACzC,SAAS,QAAQ,wBAAwB;AACzC,SAAS,eAAe;AAsBjB,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AACF,GAIG;AACD,QAAM,eAAe,iBAAiB,KAAK;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,SACE;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACC,SAAS;AAAA,MACT,OAAO;AAAA,QACL,QAAQ,OAAO,IAAI;AAAA,QACnB,SAAS,QAAQ,OAAO,SAAS;AAAA,MACnC;AAAA,MACA,SAAS,OAAO,EAAE,SAAS,GAAG,GAAG,IAAI,IAAI,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,MAC5D,qBAAqB,MAAM,QAAQ,IAAI;AAAA,MACvC,YACE,eACI,EAAE,UAAU,EAAE,IACd;AAAA,QACE,GAAG,QAAQ;AAAA,QACX,SAAS,EAAE,UAAU,OAAO,OAAO,KAAK;AAAA,MAC1C;AAAA,MAEN,OAAO;AAAA,MAEN;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/dashboard/home/home-card.d.ts

@@ -0,0 +1,62 @@
+import type { ReactNode } from 'react';
+/**
+ * The home board's card.
+ *
+ * Ported from `admin.shopify.com`'s home cards, read off their stylesheets and
+ * their live computed styles on 2026-08-18 rather than copied from a
+ * screenshot. Every number is measured; where we already had a token for the
+ * same idea ours wins, and the one place that happens is the easing curve —
+ * theirs is `cubic-bezier(.34, 1.8, .64, 1)`, ours is `eases.overshoot`
+ * (.34, 1.56, .64, 1), the same curve a touch gentler. No second version of one
+ * idea enters the system.
+ *
+ * WHY A SECOND CARD EXISTS AT ALL. `surface` dresses forty list and detail
+ * screens and must keep doing exactly that. This file was written after an
+ * attempt to fold Shopify's card INTO `surface` was reverted, correctly, for
+ * rewriting the whole app from one page. A 320px card carrying full-bleed art
+ * that lifts under the pointer is a different object from a table panel, and it
+ * says so by being a different component rather than by being `surface` with
+ * six overrides at the call site.
+ *
+ * The states, the shadows and the reasoning for the two-element split live in
+ * `globals.css` under "The home board's card"; the classes here are that
+ * recipe's only call site. The anatomy is:
+ *
+ *   HomeCard          the target and the card
+ *     HomeCardMedia   art, laid out LARGER than the card and cropped by it
+ *     …content…       z-10, above the art
+ *     HomeCardAction  z-20, pinned bottom-left in front of everything
+ */
+export declare function HomeCard({ children, className, }: {
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+/**
+ * Art that bleeds past the card and is cropped by it.
+ *
+ * Shopify's `[data-onboarding-media]` is `position: absolute; inset: -16px` —
+ * exactly one padding step LARGER than the card on every side — and it is the
+ * card's own `overflow: clip` that crops it. That is the whole trick behind
+ * their illustrations reading as photographs of objects rather than as icons:
+ * nothing is composed to fit, everything is composed to overflow. An
+ * illustration drawn to sit politely inside its box always reads as a
+ * placeholder, however good the drawing is.
+ *
+ * `z-0` against the content's `z-10`: art is behind the words, always. And
+ * `aria-hidden`, because it is never the accessible name of anything.
+ */
+export declare function HomeCardMedia({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+/**
+ * The card's action, pinned in front of the art.
+ *
+ * `position: absolute; bottom: 16px; inset-inline: 16px` — theirs exactly, and
+ * absolute rather than `margin-top: auto` for a reason worth keeping: the
+ * button's vertical position must not depend on how long the description ran,
+ * so a two-line card and a four-line card put their buttons on one baseline and
+ * the row reads as a row.
+ */
+export declare function HomeCardAction({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/dashboard/home/home-card.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+function HomeCard({
+  children,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsx("div", { className: "home-card-target group/card", children: /* @__PURE__ */ jsx("div", { className: `home-card ${className}`, children }) });
+}
+function HomeCardMedia({ children }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-hidden": true,
+      className: "pointer-events-none absolute -inset-4 z-0 overflow-hidden rounded-[var(--radius-card)]",
+      children: /* @__PURE__ */ jsx("div", { className: "home-card-media absolute inset-0 flex items-end justify-end p-3", children })
+    }
+  );
+}
+function HomeCardAction({ children }) {
+  return /* @__PURE__ */ jsx("div", { className: "absolute inset-x-4 bottom-4 z-20 flex items-center gap-3", children });
+}
+export {
+  HomeCard,
+  HomeCardAction,
+  HomeCardMedia
+};
+//# sourceMappingURL=home-card.js.map