@clawnify/app 0.2.2 → 0.3.0

package/dist/client/index.d.ts

@@ -79,10 +79,28 @@ interface AppNavGroup {
     label?: string;
     items: AppNavItem[];
 }
+/** Host messages this app handles itself. The host falls back for the rest. */
+type HostFeature = "changes" | "path";
+/**
+ * What the user is looking at, for the dashboard's chat. It lets them say
+ * "this contact" and be understood. Labels and ids only: the chat reads the
+ * record itself through your API if it needs more.
+ */
+interface ChatContext {
+    /** The screen, e.g. "Contact" or "Pipeline". */
+    label?: string;
+    /** The record on screen, when there is one. */
+    record?: {
+        type: string;
+        id: string;
+        label?: string;
+    };
+}
 type AppToHostMessage = {
     source: "clawnify-app";
     v: 1;
     type: "ready";
+    features?: HostFeature[];
 } | {
     source: "clawnify-app";
     v: 1;
@@ -97,6 +115,16 @@ type AppToHostMessage = {
     v: 1;
     type: "location";
     path: string;
+} | {
+    source: "clawnify-app";
+    v: 1;
+    type: "context";
+    context: ChatContext | null;
+} | {
+    source: "clawnify-app";
+    v: 1;
+    type: "chat";
+    prompt?: string;
 };
 type HostToAppMessage = {
     source: "clawnify-host";
@@ -107,6 +135,16 @@ type HostToAppMessage = {
     v: 1;
     type: "navigate";
     id: string;
+} | {
+    source: "clawnify-host";
+    v: 1;
+    type: "navigate";
+    path: string;
+} | {
+    source: "clawnify-host";
+    v: 1;
+    type: "changed";
+    paths: string[];
 };
 /**
  * Whether this page is running inside the Clawnify dashboard. Computed once at
@@ -114,6 +152,46 @@ type HostToAppMessage = {
  * for the tab so in-iframe full navigations keep the mode.
  */
 declare const embedded: boolean;
+/**
+ * Open the dashboard's chat, optionally with a prompt in the composer. The
+ * prompt is a DRAFT: the user reads it and presses send. The host never sends
+ * text an app wrote, because an app renders data other people typed (a form
+ * submission, a contact note) and that text must not drive the user's agent.
+ *
+ * Returns false when standalone (no dashboard, no chat): hide the button then,
+ * or check `embedded` before rendering it.
+ *
+ *   {embedded && <button onClick={() => openChat(`Draft a follow-up for ${c.name}`)}>Ask AI</button>}
+ *   {embedded && <button onClick={() => openChat()}>Chat</button>}   // no prompt: just open it
+ */
+declare function openChat(prompt?: string): boolean;
+/**
+ * Tell the dashboard's chat what the user is looking at, so "this contact"
+ * means the one on screen. Call it from the screen that shows the record; the
+ * context clears when that screen unmounts. Labels and ids only, never the
+ * record's content: the chat reads that through your API when it needs to.
+ *
+ *   useChatContext({ label: "Contact", record: { type: "contact", id: c.id, label: c.name } });
+ */
+declare function useChatContext(context: ChatContext | null): void;
+/**
+ * Run `onChange` when the dashboard's chat has written this app's data (a
+ * POST, PUT, PATCH or DELETE through your API), with the API paths it called.
+ * Refetch what is on screen. While no mounted component uses this hook, the
+ * dashboard reloads the whole iframe after such a write instead.
+ *
+ *   useHostChanges(() => { void reload(); });
+ */
+declare function useHostChanges(onChange: (paths: string[]) => void): void;
+/**
+ * Let the dashboard (its chat, a deep link) open any page of the app through
+ * your router, without reloading the iframe. `path` is an in-app path such as
+ * "/contacts/42?tab=deals". While no mounted component uses this hook, the
+ * dashboard reloads the iframe at that path instead.
+ *
+ *   useHostNavigate((path) => navigate(path));
+ */
+declare function useHostNavigate(onNavigate: (path: string) => void): void;
 /**
  * Tell the host where the app is, so the dashboard URL can restore this view
  * on reload. Call it whenever your router's location changes; a no-op when
@@ -149,4 +227,4 @@ interface AppNavProps {
  */
 declare function AppNav({ title, icon, groups, active, onNavigate, children }: AppNavProps): react.JSX.Element | null;
 
-export { AppNav, type AppNavGroup, type AppNavItem, type AppNavProps, type AppToHostMessage, HOST_BRIDGE_VERSION, type HostToAppMessage, NAV_COLORS, type NavColor, TILE_ICONS, TileIcon, type TileIconName, type TileIconProps, embedded, navColorFor, reportLocation };
+export { AppNav, type AppNavGroup, type AppNavItem, type AppNavProps, type AppToHostMessage, type ChatContext, HOST_BRIDGE_VERSION, type HostFeature, type HostToAppMessage, NAV_COLORS, type NavColor, TILE_ICONS, TileIcon, type TileIconName, type TileIconProps, embedded, navColorFor, openChat, reportLocation, useChatContext, useHostChanges, useHostNavigate };

package/dist/client/index.js

@@ -188,6 +188,107 @@ function post(message) {
   if (!embedded) return;
   window.parent.postMessage(message, "*");
 }
+var hostListeners = /* @__PURE__ */ new Set();
+var featureCounts = /* @__PURE__ */ new Map();
+var listening = false;
+var chatContext = null;
+function announce() {
+  post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "ready", features: [...featureCounts.keys()] });
+}
+function listen() {
+  if (listening || !embedded) return;
+  listening = true;
+  window.addEventListener("message", (e) => {
+    if (e.source !== window.parent) return;
+    const d = e.data;
+    if (!d || d.source !== "clawnify-host" || d.v !== HOST_BRIDGE_VERSION) return;
+    if (d.type === "hello" && chatContext) {
+      post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "context", context: chatContext });
+    }
+    for (const listener of [...hostListeners]) listener(d);
+  });
+  announce();
+}
+function subscribe(listener, feature) {
+  if (!embedded) return () => {
+  };
+  listen();
+  hostListeners.add(listener);
+  if (feature) {
+    const n = featureCounts.get(feature) ?? 0;
+    featureCounts.set(feature, n + 1);
+    if (n === 0) announce();
+  }
+  return () => {
+    hostListeners.delete(listener);
+    if (!feature) return;
+    const n = (featureCounts.get(feature) ?? 1) - 1;
+    if (n > 0) featureCounts.set(feature, n);
+    else {
+      featureCounts.delete(feature);
+      announce();
+    }
+  };
+}
+function isAppPath(path) {
+  return typeof path === "string" && path.length <= 2048 && /^\/(?![/\\])/.test(path);
+}
+function openChat(prompt) {
+  if (!embedded) return false;
+  post({
+    source: "clawnify-app",
+    v: HOST_BRIDGE_VERSION,
+    type: "chat",
+    ...prompt ? { prompt: String(prompt).slice(0, 2e3) } : {}
+  });
+  return true;
+}
+function useChatContext(context) {
+  const key = embedded && context ? JSON.stringify(sanitizeContext(context)) : "";
+  useEffect(() => {
+    if (!embedded || !key) return;
+    listen();
+    chatContext = JSON.parse(key);
+    post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "context", context: chatContext });
+    return () => {
+      chatContext = null;
+      post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "context", context: null });
+    };
+  }, [key]);
+}
+function sanitizeContext(c) {
+  return {
+    ...c.label ? { label: String(c.label).slice(0, 60) } : {},
+    ...c.record && c.record.type && c.record.id ? {
+      record: {
+        type: String(c.record.type).slice(0, 40),
+        id: String(c.record.id).slice(0, 80),
+        ...c.record.label ? { label: String(c.record.label).slice(0, 80) } : {}
+      }
+    } : {}
+  };
+}
+function useHostChanges(onChange) {
+  const ref = useRef(onChange);
+  ref.current = onChange;
+  useEffect(
+    () => subscribe((d) => {
+      if (d.type !== "changed" || !Array.isArray(d.paths)) return;
+      ref.current(d.paths.filter((p) => typeof p === "string").slice(0, 20));
+    }, "changes"),
+    []
+  );
+}
+function useHostNavigate(onNavigate) {
+  const ref = useRef(onNavigate);
+  ref.current = onNavigate;
+  useEffect(
+    () => subscribe((d) => {
+      if (d.type === "navigate" && "path" in d && isAppPath(d.path)) ref.current(d.path);
+    }, "path"),
+    []
+  );
+}
 function reportLocation(path) {
   let clean = path;
   try {
@@ -212,25 +313,22 @@ function AppNav({ title, icon, groups, active, onNavigate, children }) {
     const { title: title2, icon: icon2, groups: groups2, active: active2 } = JSON.parse(payload);
     post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "nav", title: title2, icon: icon2, groups: groups2, active: active2 });
   }, [payload]);
-  useEffect(() => {
-    if (!embedded) return;
-    function onMessage(e) {
-      if (e.source !== window.parent) return;
-      const d = e.data;
-      if (!d || d.source !== "clawnify-host" || d.v !== HOST_BRIDGE_VERSION) return;
+  useEffect(
+    () => subscribe((d) => {
       if (d.type === "hello") {
         lastSent.current = "";
         const g = sanitize(groupsRef.current);
         post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "nav", title, icon, groups: g, active });
-      } else if (d.type === "navigate" && typeof d.id === "string") {
+      } else if (d.type === "navigate" && "id" in d && typeof d.id === "string") {
         const item = groupsRef.current.flatMap((g) => g.items).find((i) => i.id === d.id);
         if (item) onNavigateRef.current(item);
       }
-    }
-    window.addEventListener("message", onMessage);
-    post({ source: "clawnify-app", v: HOST_BRIDGE_VERSION, type: "ready" });
-    return () => window.removeEventListener("message", onMessage);
-  }, []);
+    }),
+    // title/active are read from the closure only on `hello`; the publish
+    // effect above covers their normal updates.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
   if (embedded) return null;
   const home = groups.flatMap((g) => g.items).find((i) => i.home);
   const brand = /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -414,6 +512,10 @@ export {
   TileIcon,
   embedded,
   navColorFor,
-  reportLocation
+  openChat,
+  reportLocation,
+  useChatContext,
+  useHostChanges,
+  useHostNavigate
 };
 //# sourceMappingURL=index.js.map

package/dist/client/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/client/index.tsx"],"sourcesContent":["/**\n * @clawnify/app/client — the host bridge for a Clawnify app's browser side.\n *\n * A Clawnify app is a full page on its own origin. Opened directly (local\n * `pnpm dev`, or `<slug>.apps.clawnify.com`) it renders its own sidebar.\n * Opened inside the Clawnify dashboard it sits in an iframe, and the dashboard\n * wants to render that same navigation in ITS sidebar so the user sees one\n * nav, not two.\n *\n * `<AppNav>` is the one definition of the app's navigation that serves both:\n *\n *   • standalone → it draws the app's sidebar (desktop rail, mobile strip)\n *   • embedded   → it draws nothing and posts the nav tree to the host over\n *                  `postMessage`; the host renders it and posts `navigate`\n *                  back when the user clicks.\n *\n * Nothing about the app changes between the two: same router, same screens,\n * same data. Only who paints the list of links.\n *\n *   import { AppNav, reportLocation } from \"@clawnify/app/client\";\n *\n *   <AppNav\n *     title=\"OpenDialer\"\n *     icon=\"phone\"\n *     groups={[{ label: \"Work\", items: [\n *       { id: \"dashboard\", label: \"Dashboard\", href: \"/\", home: true },\n *       { id: \"leads\", label: \"Leads\", href: \"/leads\", icon: \"users\", count: 12 },\n *     ]}]}\n *     active=\"leads\"\n *     onNavigate={(item) => navigate(item.href!)}\n *   />\n *\n * Re-render with a new `groups` / `active` and the host sidebar updates in\n * the same tick — counts are just a field, so \"Leads 12\" becomes \"Leads 11\"\n * the moment your own state does. No polling, no endpoint.\n *\n * Embedding is detected from the `clawnify_host=1` query parameter the\n * dashboard appends to the iframe URL, remembered in sessionStorage so a\n * full-page navigation inside the iframe stays in embedded mode. A page that\n * is iframed by anything else, or opened directly, is \"standalone\".\n *\n * Protocol (versioned, additive — `nav` and `location` are the first\n * message types; more host surfaces can ride the same channel later):\n *\n *   app  → host   { source: \"clawnify-app\",  v: 1, type: \"ready\" }\n *                 { source: \"clawnify-app\",  v: 1, type: \"nav\", title, icon?, groups, active? }\n *                 { source: \"clawnify-app\",  v: 1, type: \"location\", path }\n *   host → app    { source: \"clawnify-host\", v: 1, type: \"hello\" }\n *                 { source: \"clawnify-host\", v: 1, type: \"navigate\", id }\n */\nimport {\n  useEffect,\n  useRef,\n  type MouseEvent,\n  type ReactNode,\n} from \"react\";\nimport {\n  AddressBook,\n  Archive,\n  Bell,\n  BookOpen,\n  Briefcase,\n  Building,\n  Calendar,\n  CalendarDots,\n  Camera,\n  ChartBar,\n  ChartPie,\n  ChatCircle,\n  CheckSquare,\n  ClipboardText,\n  Clock,\n  ClockCounterClockwise,\n  Code,\n  CreditCard,\n  CurrencyDollar,\n  Database,\n  Envelope,\n  File,\n  FileText,\n  Folder,\n  Gear,\n  Globe,\n  GridFour,\n  Hash,\n  House,\n  Image,\n  Kanban,\n  Lightning,\n  Link,\n  List,\n  ListChecks,\n  MagnifyingGlass,\n  MapTrifold,\n  Microphone,\n  Package,\n  PaperPlaneTilt,\n  Phone,\n  Play,\n  Pulse,\n  Robot,\n  ShoppingCart,\n  Sparkle,\n  SquaresFour,\n  Stack,\n  Star,\n  Table,\n  Tag,\n  Target,\n  Tray,\n  Truck,\n  Upload,\n  User,\n  VideoCamera,\n  Wallet,\n  type Icon as PhosphorIcon,\n} from \"@phosphor-icons/react\";\n\nexport const HOST_BRIDGE_VERSION = 1 as const;\n\n/** One row in the navigation. `icon` is a lucide icon name (kebab-case). */\nexport interface AppNavItem {\n  /** Stable identifier the host hands back on `navigate`. */\n  id: string;\n  label: string;\n  /**\n   * In-app path this item opens. Optional: a state-driven view can omit it.\n   * When present the host uses it to restore the view on reload and to make\n   * the dashboard URL shareable.\n   */\n  href?: string;\n  /** Icon name from TILE_ICONS, e.g. \"layout-dashboard\". Unknown names render a dot. */\n  icon?: string;\n  /** Live badge, e.g. items waiting. Omit for none. */\n  count?: number;\n  /**\n   * The app's home screen. Not listed as a row: standalone the brand row\n   * opens it, and in the dashboard the app's own header does. One per app.\n   */\n  home?: boolean;\n  /**\n   * Tile colour for this section. Sections are the records inside an app,\n   * so they draw as a small coloured tile with a white glyph (the app itself\n   * is navigation and stays an outline glyph). One of `NAV_COLORS`; omitted\n   * = picked from the palette by `id`, stable across renders and hosts.\n   */\n  color?: NavColor;\n}\n\n/** The section tile palette, shared by the standalone sidebar and the dashboard. */\nexport const NAV_COLORS = {\n  red: \"#ef4444\",\n  orange: \"#f97514\",\n  amber: \"#f59e0b\",\n  green: \"#22c55e\",\n  sky: \"#17bde9\",\n  blue: \"#266df0\",\n  violet: \"#8b5cf6\",\n  pink: \"#ec4899\",\n} as const;\nexport type NavColor = keyof typeof NAV_COLORS;\n\n/** Deterministic palette pick for an item without an explicit colour. */\nexport function navColorFor(id: string): NavColor {\n  const names = Object.keys(NAV_COLORS) as NavColor[];\n  let h = 0;\n  for (let i = 0; i < id.length; i++) h = (h * 31 + id.charCodeAt(i)) >>> 0;\n  return names[h % names.length];\n}\n\n/**\n * The icon library: the names the Clawnify dashboard can draw for an app\n * and its sections (resolved to the Phosphor set in both sidebars). Pick\n * from these; the apps AGENTS.md lists them by meaning.\n */\nexport const TILE_ICONS = [\n  \"activity\",\n  \"archive\",\n  \"bar-chart-3\",\n  \"bell\",\n  \"book-open\",\n  \"bot\",\n  \"briefcase\",\n  \"building-2\",\n  \"calendar\",\n  \"calendar-days\",\n  \"camera\",\n  \"check-square\",\n  \"clipboard-list\",\n  \"clock\",\n  \"code-2\",\n  \"contact\",\n  \"credit-card\",\n  \"database\",\n  \"dollar-sign\",\n  \"file\",\n  \"file-text\",\n  \"folder\",\n  \"globe\",\n  \"hash\",\n  \"history\",\n  \"home\",\n  \"image\",\n  \"inbox\",\n  \"kanban\",\n  \"layers\",\n  \"layout-dashboard\",\n  \"layout-grid\",\n  \"link\",\n  \"list\",\n  \"list-checks\",\n  \"mail\",\n  \"map\",\n  \"message-square\",\n  \"mic\",\n  \"package\",\n  \"phone\",\n  \"pie-chart\",\n  \"play\",\n  \"search\",\n  \"send\",\n  \"settings\",\n  \"shopping-cart\",\n  \"sparkles\",\n  \"star\",\n  \"table\",\n  \"tag\",\n  \"target\",\n  \"truck\",\n  \"upload\",\n  \"user\",\n  \"users\",\n  \"video\",\n  \"wallet\",\n  \"zap\",\n] as const;\nexport type TileIconName = (typeof TILE_ICONS)[number];\n\nexport interface TileIconProps {\n  /** Icon name from TILE_ICONS. Unknown or missing = a small dot. */\n  icon?: string;\n  /** Palette colour. Omitted = picked from `seed` (or `icon`) by hash. */\n  color?: NavColor;\n  /** Stable string the colour is derived from when `color` is not given. */\n  seed?: string;\n  /** Tile edge in px. The glyph scales with it. Default 16. */\n  size?: number;\n  className?: string;\n  title?: string;\n}\n\n/**\n * The record tile: a small rounded square in a palette colour with a white\n * lucide glyph. The sidebar draws every app section with it; apps can use\n * the same tile anywhere a record type needs an identity mark (table rows,\n * cards, pickers) so the two surfaces stay one system. Self-contained inline\n * styles, so it works outside <AppNav> and in any stylesheet setup.\n *\n *   <TileIcon icon=\"users\" color=\"blue\" />\n *   <TileIcon icon=\"phone\" seed={lead.id} size={20} />\n */\nexport function TileIcon({ icon, color, seed, size = 16, className, title }: TileIconProps) {\n  const fill = NAV_COLORS[color ?? navColorFor(seed ?? icon ?? \"\")];\n  // The glyph box is 0.7 of the tile: Phosphor draws on ~224 of its 256\n  // units, so the visible glyph lands near 60% of the tile with clear\n  // padding around it, solid white — Attio's record-tile proportion.\n  const glyph = Math.round(size * 0.7);\n  return (\n    <span\n      className={className}\n      title={title}\n      aria-hidden={title ? undefined : true}\n      style={{\n        display: \"inline-flex\",\n        width: size,\n        height: size,\n        flexShrink: 0,\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        borderRadius: \"30%\",\n        border: \"1px solid rgb(0 0 0 / 0.06)\",\n        background: fill,\n        color: \"#fff\",\n      }}\n    >\n      {iconFor(icon) ? (\n        (() => { const I = iconFor(icon)!; return <I size={glyph} weight=\"fill\" aria-hidden />; })()\n      ) : (\n        <span style={{ width: glyph * 0.6, height: glyph * 0.6, borderRadius: 9999, background: \"currentColor\" }} />\n      )}\n    </span>\n  );\n}\n\nexport interface AppNavGroup {\n  /** Eyebrow shown above the items. Omit for an unlabelled group. */\n  label?: string;\n  items: AppNavItem[];\n}\n\nexport type AppToHostMessage =\n  | { source: \"clawnify-app\"; v: 1; type: \"ready\" }\n  | {\n      source: \"clawnify-app\";\n      v: 1;\n      type: \"nav\";\n      title: string;\n      /** lucide icon name for the app itself. */\n      icon?: string;\n      groups: AppNavGroup[];\n      active?: string;\n    }\n  | { source: \"clawnify-app\"; v: 1; type: \"location\"; path: string };\n\nexport type HostToAppMessage =\n  | { source: \"clawnify-host\"; v: 1; type: \"hello\" }\n  | { source: \"clawnify-host\"; v: 1; type: \"navigate\"; id: string };\n\nconst HOST_PARAM = \"clawnify_host\";\nconst STORAGE_KEY = \"clawnify_host\";\n\n/**\n * Whether this page is running inside the Clawnify dashboard. Computed once at\n * module load — the query parameter is only on the initial URL — and remembered\n * for the tab so in-iframe full navigations keep the mode.\n */\nexport const embedded: boolean = (() => {\n  if (typeof window === \"undefined\") return false;\n  if (window.parent === window) return false;\n  let flagged = false;\n  try {\n    flagged = new URLSearchParams(window.location.search).get(HOST_PARAM) === \"1\";\n    if (flagged) window.sessionStorage.setItem(STORAGE_KEY, \"1\");\n    else flagged = window.sessionStorage.getItem(STORAGE_KEY) === \"1\";\n  } catch {\n    // Storage can throw in a partitioned or locked-down iframe; the query\n    // parameter alone still decides for this document.\n  }\n  return flagged;\n})();\n\nfunction post(message: AppToHostMessage) {\n  if (!embedded) return;\n  // The dashboard may live on app.clawnify.com or a white-label domain, so the\n  // app cannot pin the target origin. The payload is navigation labels and a\n  // path — nothing secret — and the host verifies the sender is its own iframe.\n  window.parent.postMessage(message, \"*\");\n}\n\n/**\n * Tell the host where the app is, so the dashboard URL can restore this view\n * on reload. Call it whenever your router's location changes; a no-op when\n * standalone.\n */\nexport function reportLocation(path: string) {\n  // The initial URL carries the dashboard's own parameters (the app token\n  // and the host flag). They are not part of the app's location and must\n  // never land in a URL the dashboard writes, so strip them here as well.\n  let clean = path;\n  try {\n    const u = new URL(path, \"http://app.invalid\");\n    u.searchParams.delete(\"token\");\n    u.searchParams.delete(HOST_PARAM);\n    clean = u.pathname + u.search + u.hash;\n  } catch {\n    // Not a path we can parse: send as-is, the host validates its shape.\n  }\n  post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"location\", path: clean });\n}\n\nexport interface AppNavProps {\n  /** App name, shown in the brand row standalone and in the host's switcher. */\n  title: string;\n  /**\n   * The app's own glyph, a lucide icon name (kebab-case). Drawn as an\n   * outline icon with no background: in the standalone brand row, and by the\n   * dashboard on the app's sidebar item. Tiles are for records, not for\n   * navigation, so the app's coloured tile icon stays out of the sidebar.\n   */\n  icon?: string;\n  groups: AppNavGroup[];\n  /** `id` of the active item. */\n  active?: string;\n  /** Called with the item the user chose, from either renderer. */\n  onNavigate: (item: AppNavItem) => void;\n  /** Rendered at the bottom of the standalone sidebar (a footer action, say). */\n  children?: ReactNode;\n}\n\n/**\n * The app's navigation: sidebar when standalone, host-fed when embedded.\n *\n * Standalone layout: the sidebar is a 260px column at ≥768px and a horizontal\n * strip below that, so put it first inside a `flex flex-col md:flex-row`\n * container. It paints with the app's own theme tokens (`--surface`,\n * `--border`, `--primary`…) and falls back to the platform defaults when a\n * token is missing.\n */\nexport function AppNav({ title, icon, groups, active, onNavigate, children }: AppNavProps) {\n  // Always the latest callback, so the host listener never calls a stale one.\n  const onNavigateRef = useRef(onNavigate);\n  onNavigateRef.current = onNavigate;\n  const groupsRef = useRef(groups);\n  groupsRef.current = groups;\n\n  // Embedded: publish the tree whenever it changes. Serialising is the cheap\n  // way to dedupe — apps build `groups` inline every render.\n  const payload = embedded\n    ? JSON.stringify({ title, icon, groups: sanitize(groups), active })\n    : \"\";\n  const lastSent = useRef(\"\");\n  useEffect(() => {\n    if (!embedded || payload === lastSent.current) return;\n    lastSent.current = payload;\n    const { title, icon, groups, active } = JSON.parse(payload) as {\n      title: string;\n      icon?: string;\n      groups: AppNavGroup[];\n      active?: string;\n    };\n    post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"nav\", title, icon, groups, active });\n  }, [payload]);\n\n  // Embedded: handshake + listen for the host's clicks.\n  useEffect(() => {\n    if (!embedded) return;\n    function onMessage(e: MessageEvent) {\n      if (e.source !== window.parent) return;\n      const d = e.data as HostToAppMessage | undefined;\n      if (!d || d.source !== \"clawnify-host\" || d.v !== HOST_BRIDGE_VERSION) return;\n      if (d.type === \"hello\") {\n        // Host (re)mounted its listener after we first published: resend.\n        lastSent.current = \"\";\n        const g = sanitize(groupsRef.current);\n        post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"nav\", title, icon, groups: g, active });\n      } else if (d.type === \"navigate\" && typeof d.id === \"string\") {\n        const item = groupsRef.current.flatMap((g) => g.items).find((i) => i.id === d.id);\n        if (item) onNavigateRef.current(item);\n      }\n    }\n    window.addEventListener(\"message\", onMessage);\n    post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"ready\" });\n    return () => window.removeEventListener(\"message\", onMessage);\n    // title/active are read from the closure only on `hello`; the publish\n    // effect above covers their normal updates.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  if (embedded) return null;\n\n  const home = groups.flatMap((g) => g.items).find((i) => i.home);\n  const brand = (\n    <>\n      {(() => { const I = iconFor(icon); return I ? <I size={16} aria-hidden /> : null; })()}\n      <span>{title}</span>\n    </>\n  );\n\n  return (\n    <aside className=\"cn-nav\">\n      <style>{CSS}</style>\n      {home ? (\n        <a\n          href={home.href ?? \"/\"}\n          className=\"cn-nav-brand\"\n          data-active={home.id === active || undefined}\n          aria-current={home.id === active ? \"page\" : undefined}\n          onClick={(e: MouseEvent) => {\n            if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n            e.preventDefault();\n            onNavigate(home);\n          }}\n        >\n          {brand}\n        </a>\n      ) : (\n        <div className=\"cn-nav-brand\">{brand}</div>\n      )}\n      <nav className=\"cn-nav-groups\" aria-label=\"Primary\">\n        {groups.map((g, gi) => (\n          <div className=\"cn-nav-group\" key={g.label ?? gi}>\n            {g.label && <p className=\"cn-nav-eyebrow\">{g.label}</p>}\n            {g.items\n              .filter((item) => !item.home)\n              .map((item) => (\n                <NavRow key={item.id} item={item} active={item.id === active} onNavigate={onNavigate} />\n              ))}\n          </div>\n        ))}\n      </nav>\n      {children && <div className=\"cn-nav-footer\">{children}</div>}\n    </aside>\n  );\n}\n\nfunction NavRow({\n  item,\n  active,\n  onNavigate,\n}: {\n  item: AppNavItem;\n  active: boolean;\n  onNavigate: (item: AppNavItem) => void;\n}) {\n  const body = (\n    <>\n      <TileIcon icon={item.icon} color={item.color} seed={item.id} />\n      <span className=\"cn-nav-label\">{item.label}</span>\n      {typeof item.count === \"number\" && <span className=\"cn-nav-count\">{item.count}</span>}\n    </>\n  );\n  // A real link when there is an href — middle-click and copy-link keep\n  // working — but the click itself goes through the app's router.\n  if (item.href) {\n    return (\n      <a\n        href={item.href}\n        className=\"cn-nav-item\"\n        data-active={active || undefined}\n        aria-current={active ? \"page\" : undefined}\n        onClick={(e: MouseEvent) => {\n          if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n          e.preventDefault();\n          onNavigate(item);\n        }}\n      >\n        {body}\n      </a>\n    );\n  }\n  return (\n    <button\n      type=\"button\"\n      className=\"cn-nav-item\"\n      data-active={active || undefined}\n      aria-current={active ? \"page\" : undefined}\n      onClick={() => onNavigate(item)}\n    >\n      {body}\n    </button>\n  );\n}\n\n/** Our names → Phosphor components; the same map the dashboard holds. */\nconst ICONS: Record<string, PhosphorIcon> = {\n  \"activity\": Pulse,\n  \"archive\": Archive,\n  \"bar-chart-3\": ChartBar,\n  \"bell\": Bell,\n  \"book-open\": BookOpen,\n  \"bot\": Robot,\n  \"briefcase\": Briefcase,\n  \"building-2\": Building,\n  \"calendar\": Calendar,\n  \"calendar-days\": CalendarDots,\n  \"camera\": Camera,\n  \"check-square\": CheckSquare,\n  \"clipboard-list\": ClipboardText,\n  \"clock\": Clock,\n  \"code-2\": Code,\n  \"contact\": AddressBook,\n  \"credit-card\": CreditCard,\n  \"database\": Database,\n  \"dollar-sign\": CurrencyDollar,\n  \"file\": File,\n  \"file-text\": FileText,\n  \"folder\": Folder,\n  \"globe\": Globe,\n  \"hash\": Hash,\n  \"history\": ClockCounterClockwise,\n  \"home\": House,\n  \"image\": Image,\n  \"inbox\": Tray,\n  \"kanban\": Kanban,\n  \"layers\": Stack,\n  \"layout-dashboard\": SquaresFour,\n  \"layout-grid\": GridFour,\n  \"link\": Link,\n  \"list\": List,\n  \"list-checks\": ListChecks,\n  \"mail\": Envelope,\n  \"map\": MapTrifold,\n  \"message-square\": ChatCircle,\n  \"mic\": Microphone,\n  \"package\": Package,\n  \"phone\": Phone,\n  \"pie-chart\": ChartPie,\n  \"play\": Play,\n  \"search\": MagnifyingGlass,\n  \"send\": PaperPlaneTilt,\n  \"settings\": Gear,\n  \"shopping-cart\": ShoppingCart,\n  \"sparkles\": Sparkle,\n  \"star\": Star,\n  \"table\": Table,\n  \"tag\": Tag,\n  \"target\": Target,\n  \"truck\": Truck,\n  \"upload\": Upload,\n  \"user\": User,\n  \"users\": User,\n  \"video\": VideoCamera,\n  \"wallet\": Wallet,\n  \"zap\": Lightning,\n};\nfunction iconFor(name?: string): PhosphorIcon | undefined {\n  return name ? ICONS[name] : undefined;\n}\n\n/** Only the fields the protocol defines, with sane bounds, cross the bridge. */\nfunction sanitize(groups: AppNavGroup[]): AppNavGroup[] {\n  return groups.slice(0, 20).map((g) => ({\n    ...(g.label ? { label: String(g.label).slice(0, 40) } : {}),\n    items: g.items.slice(0, 100).map((i) => ({\n      id: String(i.id),\n      label: String(i.label).slice(0, 60),\n      ...(i.href ? { href: String(i.href) } : {}),\n      ...(i.icon ? { icon: String(i.icon) } : {}),\n      ...(typeof i.count === \"number\" && Number.isFinite(i.count) ? { count: i.count } : {}),\n      ...(i.home ? { home: true } : {}),\n      ...(i.color && i.color in NAV_COLORS ? { color: i.color } : {}),\n    })),\n  }));\n}\n\n// Scoped by class prefix; tokens follow apps/DESIGN.md with its light defaults\n// as fallbacks, so an app with a partial theme still gets a readable sidebar.\nconst CSS = `\n.cn-nav{width:16.25rem;flex-shrink:0;display:flex;flex-direction:column;border-right:1px solid var(--border,#e2e8f0);background:var(--surface,#fff);color:var(--foreground,#1a202c)}\n.cn-nav-brand{height:3.5rem;flex-shrink:0;display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;border-bottom:1px solid var(--border,#e2e8f0);font-size:.875rem;font-weight:600;color:inherit;text-decoration:none}\na.cn-nav-brand:hover{background:var(--sunken,#f1f5f9)}\n.cn-nav-brand>svg{color:var(--primary,#dd5164)}\n.cn-nav-groups{flex:1;overflow-y:auto;padding:.75rem}\n.cn-nav-group+.cn-nav-group{margin-top:1rem}\n.cn-nav-eyebrow{margin:0 0 .25rem;padding:0 .625rem;font-size:.75rem;font-weight:500;color:var(--muted,#475569)}\n.cn-nav-item{display:flex;align-items:center;gap:.5rem;width:100%;margin:0 0 .125rem;padding:.4375rem .625rem;border:0;border-radius:.375rem;background:none;color:inherit;font:inherit;font-size:.875rem;text-align:left;text-decoration:none;cursor:pointer}\n.cn-nav-item:hover{background:var(--sunken,#f1f5f9)}\n.cn-nav-item[data-active]{background:color-mix(in srgb,var(--primary,#dd5164) 12%,transparent);color:var(--primary,#dd5164);font-weight:600}\n.cn-nav-item:focus-visible{outline:2px solid var(--ring,#2563eb);outline-offset:-2px}\n.cn-nav-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.cn-nav-count{font-size:.75rem;font-variant-numeric:tabular-nums;color:var(--muted,#475569)}\n.cn-nav-item[data-active] .cn-nav-count{color:inherit}\n.cn-nav-footer{padding:.75rem;border-top:1px solid var(--border,#e2e8f0)}\n@media (max-width:767px){\n.cn-nav{width:100%;flex-direction:row;border-right:0;border-bottom:1px solid var(--border,#e2e8f0)}\n.cn-nav-brand,.cn-nav-eyebrow,.cn-nav-footer{display:none}\n.cn-nav-groups{display:flex;gap:.25rem;padding:.5rem .75rem;overflow-x:auto;overflow-y:hidden}\n.cn-nav-group{display:flex;gap:.25rem}\n.cn-nav-group+.cn-nav-group{margin:0}\n.cn-nav-item{width:auto;margin:0;white-space:nowrap}\n}\n`;\n"],"mappings":"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","names":["title","icon","groups","active"]}
+{"version":3,"sources":["../../src/client/index.tsx"],"sourcesContent":["/**\n * @clawnify/app/client — the host bridge for a Clawnify app's browser side.\n *\n * A Clawnify app is a full page on its own origin. Opened directly (local\n * `pnpm dev`, or `<slug>.apps.clawnify.com`) it renders its own sidebar.\n * Opened inside the Clawnify dashboard it sits in an iframe, and the dashboard\n * wants to render that same navigation in ITS sidebar so the user sees one\n * nav, not two.\n *\n * `<AppNav>` is the one definition of the app's navigation that serves both:\n *\n *   • standalone → it draws the app's sidebar (desktop rail, mobile strip)\n *   • embedded   → it draws nothing and posts the nav tree to the host over\n *                  `postMessage`; the host renders it and posts `navigate`\n *                  back when the user clicks.\n *\n * Nothing about the app changes between the two: same router, same screens,\n * same data. Only who paints the list of links.\n *\n *   import { AppNav, reportLocation } from \"@clawnify/app/client\";\n *\n *   <AppNav\n *     title=\"OpenDialer\"\n *     icon=\"phone\"\n *     groups={[{ label: \"Work\", items: [\n *       { id: \"dashboard\", label: \"Dashboard\", href: \"/\", home: true },\n *       { id: \"leads\", label: \"Leads\", href: \"/leads\", icon: \"users\", count: 12 },\n *     ]}]}\n *     active=\"leads\"\n *     onNavigate={(item) => navigate(item.href!)}\n *   />\n *\n * Re-render with a new `groups` / `active` and the host sidebar updates in\n * the same tick — counts are just a field, so \"Leads 12\" becomes \"Leads 11\"\n * the moment your own state does. No polling, no endpoint.\n *\n * Embedding is detected from the `clawnify_host=1` query parameter the\n * dashboard appends to the iframe URL, remembered in sessionStorage so a\n * full-page navigation inside the iframe stays in embedded mode. A page that\n * is iframed by anything else, or opened directly, is \"standalone\".\n *\n * The same channel connects the app to the dashboard's chat (the AG-UI idea:\n * the agent and the screen share one loop):\n *\n *   openChat(\"Draft a follow-up for Mario\")   opens the chat, text as a draft\n *   setChatContext({ label, record })         what the user is looking at\n *   useHostChanges((paths) => refetch())      the chat just wrote your data\n *   useHostNavigate((path) => navigate(path)) the chat opens one of your pages\n *\n * Protocol (versioned, additive):\n *\n *   app  → host   { source: \"clawnify-app\",  v: 1, type: \"ready\", features? }\n *                 { source: \"clawnify-app\",  v: 1, type: \"nav\", title, icon?, groups, active? }\n *                 { source: \"clawnify-app\",  v: 1, type: \"location\", path }\n *                 { source: \"clawnify-app\",  v: 1, type: \"context\", context }\n *                 { source: \"clawnify-app\",  v: 1, type: \"chat\", prompt? }\n *   host → app    { source: \"clawnify-host\", v: 1, type: \"hello\" }\n *                 { source: \"clawnify-host\", v: 1, type: \"navigate\", id }\n *                 { source: \"clawnify-host\", v: 1, type: \"navigate\", path }\n *                 { source: \"clawnify-host\", v: 1, type: \"changed\", paths }\n *\n * `features` tells the host which of its messages the app handles, so it can\n * fall back for the ones it does not: without \"changes\" the host reloads the\n * iframe after the chat writes data, without \"path\" it reloads it at the new\n * path instead of asking the app's router.\n */\nimport {\n  useEffect,\n  useRef,\n  type MouseEvent,\n  type ReactNode,\n} from \"react\";\nimport {\n  AddressBook,\n  Archive,\n  Bell,\n  BookOpen,\n  Briefcase,\n  Building,\n  Calendar,\n  CalendarDots,\n  Camera,\n  ChartBar,\n  ChartPie,\n  ChatCircle,\n  CheckSquare,\n  ClipboardText,\n  Clock,\n  ClockCounterClockwise,\n  Code,\n  CreditCard,\n  CurrencyDollar,\n  Database,\n  Envelope,\n  File,\n  FileText,\n  Folder,\n  Gear,\n  Globe,\n  GridFour,\n  Hash,\n  House,\n  Image,\n  Kanban,\n  Lightning,\n  Link,\n  List,\n  ListChecks,\n  MagnifyingGlass,\n  MapTrifold,\n  Microphone,\n  Package,\n  PaperPlaneTilt,\n  Phone,\n  Play,\n  Pulse,\n  Robot,\n  ShoppingCart,\n  Sparkle,\n  SquaresFour,\n  Stack,\n  Star,\n  Table,\n  Tag,\n  Target,\n  Tray,\n  Truck,\n  Upload,\n  User,\n  VideoCamera,\n  Wallet,\n  type Icon as PhosphorIcon,\n} from \"@phosphor-icons/react\";\n\nexport const HOST_BRIDGE_VERSION = 1 as const;\n\n/** One row in the navigation. `icon` is a lucide icon name (kebab-case). */\nexport interface AppNavItem {\n  /** Stable identifier the host hands back on `navigate`. */\n  id: string;\n  label: string;\n  /**\n   * In-app path this item opens. Optional: a state-driven view can omit it.\n   * When present the host uses it to restore the view on reload and to make\n   * the dashboard URL shareable.\n   */\n  href?: string;\n  /** Icon name from TILE_ICONS, e.g. \"layout-dashboard\". Unknown names render a dot. */\n  icon?: string;\n  /** Live badge, e.g. items waiting. Omit for none. */\n  count?: number;\n  /**\n   * The app's home screen. Not listed as a row: standalone the brand row\n   * opens it, and in the dashboard the app's own header does. One per app.\n   */\n  home?: boolean;\n  /**\n   * Tile colour for this section. Sections are the records inside an app,\n   * so they draw as a small coloured tile with a white glyph (the app itself\n   * is navigation and stays an outline glyph). One of `NAV_COLORS`; omitted\n   * = picked from the palette by `id`, stable across renders and hosts.\n   */\n  color?: NavColor;\n}\n\n/** The section tile palette, shared by the standalone sidebar and the dashboard. */\nexport const NAV_COLORS = {\n  red: \"#ef4444\",\n  orange: \"#f97514\",\n  amber: \"#f59e0b\",\n  green: \"#22c55e\",\n  sky: \"#17bde9\",\n  blue: \"#266df0\",\n  violet: \"#8b5cf6\",\n  pink: \"#ec4899\",\n} as const;\nexport type NavColor = keyof typeof NAV_COLORS;\n\n/** Deterministic palette pick for an item without an explicit colour. */\nexport function navColorFor(id: string): NavColor {\n  const names = Object.keys(NAV_COLORS) as NavColor[];\n  let h = 0;\n  for (let i = 0; i < id.length; i++) h = (h * 31 + id.charCodeAt(i)) >>> 0;\n  return names[h % names.length];\n}\n\n/**\n * The icon library: the names the Clawnify dashboard can draw for an app\n * and its sections (resolved to the Phosphor set in both sidebars). Pick\n * from these; the apps AGENTS.md lists them by meaning.\n */\nexport const TILE_ICONS = [\n  \"activity\",\n  \"archive\",\n  \"bar-chart-3\",\n  \"bell\",\n  \"book-open\",\n  \"bot\",\n  \"briefcase\",\n  \"building-2\",\n  \"calendar\",\n  \"calendar-days\",\n  \"camera\",\n  \"check-square\",\n  \"clipboard-list\",\n  \"clock\",\n  \"code-2\",\n  \"contact\",\n  \"credit-card\",\n  \"database\",\n  \"dollar-sign\",\n  \"file\",\n  \"file-text\",\n  \"folder\",\n  \"globe\",\n  \"hash\",\n  \"history\",\n  \"home\",\n  \"image\",\n  \"inbox\",\n  \"kanban\",\n  \"layers\",\n  \"layout-dashboard\",\n  \"layout-grid\",\n  \"link\",\n  \"list\",\n  \"list-checks\",\n  \"mail\",\n  \"map\",\n  \"message-square\",\n  \"mic\",\n  \"package\",\n  \"phone\",\n  \"pie-chart\",\n  \"play\",\n  \"search\",\n  \"send\",\n  \"settings\",\n  \"shopping-cart\",\n  \"sparkles\",\n  \"star\",\n  \"table\",\n  \"tag\",\n  \"target\",\n  \"truck\",\n  \"upload\",\n  \"user\",\n  \"users\",\n  \"video\",\n  \"wallet\",\n  \"zap\",\n] as const;\nexport type TileIconName = (typeof TILE_ICONS)[number];\n\nexport interface TileIconProps {\n  /** Icon name from TILE_ICONS. Unknown or missing = a small dot. */\n  icon?: string;\n  /** Palette colour. Omitted = picked from `seed` (or `icon`) by hash. */\n  color?: NavColor;\n  /** Stable string the colour is derived from when `color` is not given. */\n  seed?: string;\n  /** Tile edge in px. The glyph scales with it. Default 16. */\n  size?: number;\n  className?: string;\n  title?: string;\n}\n\n/**\n * The record tile: a small rounded square in a palette colour with a white\n * lucide glyph. The sidebar draws every app section with it; apps can use\n * the same tile anywhere a record type needs an identity mark (table rows,\n * cards, pickers) so the two surfaces stay one system. Self-contained inline\n * styles, so it works outside <AppNav> and in any stylesheet setup.\n *\n *   <TileIcon icon=\"users\" color=\"blue\" />\n *   <TileIcon icon=\"phone\" seed={lead.id} size={20} />\n */\nexport function TileIcon({ icon, color, seed, size = 16, className, title }: TileIconProps) {\n  const fill = NAV_COLORS[color ?? navColorFor(seed ?? icon ?? \"\")];\n  // The glyph box is 0.7 of the tile: Phosphor draws on ~224 of its 256\n  // units, so the visible glyph lands near 60% of the tile with clear\n  // padding around it, solid white — Attio's record-tile proportion.\n  const glyph = Math.round(size * 0.7);\n  return (\n    <span\n      className={className}\n      title={title}\n      aria-hidden={title ? undefined : true}\n      style={{\n        display: \"inline-flex\",\n        width: size,\n        height: size,\n        flexShrink: 0,\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        borderRadius: \"30%\",\n        border: \"1px solid rgb(0 0 0 / 0.06)\",\n        background: fill,\n        color: \"#fff\",\n      }}\n    >\n      {iconFor(icon) ? (\n        (() => { const I = iconFor(icon)!; return <I size={glyph} weight=\"fill\" aria-hidden />; })()\n      ) : (\n        <span style={{ width: glyph * 0.6, height: glyph * 0.6, borderRadius: 9999, background: \"currentColor\" }} />\n      )}\n    </span>\n  );\n}\n\nexport interface AppNavGroup {\n  /** Eyebrow shown above the items. Omit for an unlabelled group. */\n  label?: string;\n  items: AppNavItem[];\n}\n\n/** Host messages this app handles itself. The host falls back for the rest. */\nexport type HostFeature = \"changes\" | \"path\";\n\n/**\n * What the user is looking at, for the dashboard's chat. It lets them say\n * \"this contact\" and be understood. Labels and ids only: the chat reads the\n * record itself through your API if it needs more.\n */\nexport interface ChatContext {\n  /** The screen, e.g. \"Contact\" or \"Pipeline\". */\n  label?: string;\n  /** The record on screen, when there is one. */\n  record?: { type: string; id: string; label?: string };\n}\n\nexport type AppToHostMessage =\n  | { source: \"clawnify-app\"; v: 1; type: \"ready\"; features?: HostFeature[] }\n  | {\n      source: \"clawnify-app\";\n      v: 1;\n      type: \"nav\";\n      title: string;\n      /** lucide icon name for the app itself. */\n      icon?: string;\n      groups: AppNavGroup[];\n      active?: string;\n    }\n  | { source: \"clawnify-app\"; v: 1; type: \"location\"; path: string }\n  | { source: \"clawnify-app\"; v: 1; type: \"context\"; context: ChatContext | null }\n  | { source: \"clawnify-app\"; v: 1; type: \"chat\"; prompt?: string };\n\nexport type HostToAppMessage =\n  | { source: \"clawnify-host\"; v: 1; type: \"hello\" }\n  | { source: \"clawnify-host\"; v: 1; type: \"navigate\"; id: string }\n  | { source: \"clawnify-host\"; v: 1; type: \"navigate\"; path: string }\n  | { source: \"clawnify-host\"; v: 1; type: \"changed\"; paths: string[] };\n\nconst HOST_PARAM = \"clawnify_host\";\nconst STORAGE_KEY = \"clawnify_host\";\n\n/**\n * Whether this page is running inside the Clawnify dashboard. Computed once at\n * module load — the query parameter is only on the initial URL — and remembered\n * for the tab so in-iframe full navigations keep the mode.\n */\nexport const embedded: boolean = (() => {\n  if (typeof window === \"undefined\") return false;\n  if (window.parent === window) return false;\n  let flagged = false;\n  try {\n    flagged = new URLSearchParams(window.location.search).get(HOST_PARAM) === \"1\";\n    if (flagged) window.sessionStorage.setItem(STORAGE_KEY, \"1\");\n    else flagged = window.sessionStorage.getItem(STORAGE_KEY) === \"1\";\n  } catch {\n    // Storage can throw in a partitioned or locked-down iframe; the query\n    // parameter alone still decides for this document.\n  }\n  return flagged;\n})();\n\nfunction post(message: AppToHostMessage) {\n  if (!embedded) return;\n  // The dashboard may live on app.clawnify.com or a white-label domain, so the\n  // app cannot pin the target origin. The payload is navigation labels, a\n  // path, record labels and a draft prompt — nothing secret — and the host\n  // verifies the sender is its own iframe.\n  window.parent.postMessage(message, \"*\");\n}\n\n// ── One channel for every SDK surface ──────────────────────────────────────\n// <AppNav>, the chat context and the host hooks share one window listener, so\n// an app can use any of them without the others (a single-screen app has no\n// <AppNav> but can still refresh when the chat writes its data).\n\ntype HostListener = (message: HostToAppMessage) => void;\nconst hostListeners = new Set<HostListener>();\n/** How many mounted hooks handle each feature; announced while above zero. */\nconst featureCounts = new Map<HostFeature, number>();\nlet listening = false;\nlet chatContext: ChatContext | null = null;\n\nfunction announce() {\n  post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"ready\", features: [...featureCounts.keys()] });\n}\n\nfunction listen() {\n  if (listening || !embedded) return;\n  listening = true;\n  window.addEventListener(\"message\", (e: MessageEvent) => {\n    if (e.source !== window.parent) return;\n    const d = e.data as HostToAppMessage | undefined;\n    if (!d || d.source !== \"clawnify-host\" || d.v !== HOST_BRIDGE_VERSION) return;\n    // Host (re)mounted its listener: it has lost what we told it.\n    if (d.type === \"hello\" && chatContext) {\n      post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"context\", context: chatContext });\n    }\n    for (const listener of [...hostListeners]) listener(d);\n  });\n  announce();\n}\n\nfunction subscribe(listener: HostListener, feature?: HostFeature): () => void {\n  if (!embedded) return () => {};\n  listen();\n  hostListeners.add(listener);\n  if (feature) {\n    const n = featureCounts.get(feature) ?? 0;\n    featureCounts.set(feature, n + 1);\n    if (n === 0) announce();\n  }\n  return () => {\n    hostListeners.delete(listener);\n    if (!feature) return;\n    const n = (featureCounts.get(feature) ?? 1) - 1;\n    if (n > 0) featureCounts.set(feature, n);\n    else {\n      featureCounts.delete(feature);\n      announce();\n    }\n  };\n}\n\n/** An in-app path the host may hand us: absolute, same origin. */\nfunction isAppPath(path: unknown): path is string {\n  return typeof path === \"string\" && path.length <= 2048 && /^\\/(?![/\\\\])/.test(path);\n}\n\n/**\n * Open the dashboard's chat, optionally with a prompt in the composer. The\n * prompt is a DRAFT: the user reads it and presses send. The host never sends\n * text an app wrote, because an app renders data other people typed (a form\n * submission, a contact note) and that text must not drive the user's agent.\n *\n * Returns false when standalone (no dashboard, no chat): hide the button then,\n * or check `embedded` before rendering it.\n *\n *   {embedded && <button onClick={() => openChat(`Draft a follow-up for ${c.name}`)}>Ask AI</button>}\n *   {embedded && <button onClick={() => openChat()}>Chat</button>}   // no prompt: just open it\n */\nexport function openChat(prompt?: string): boolean {\n  if (!embedded) return false;\n  post({\n    source: \"clawnify-app\",\n    v: HOST_BRIDGE_VERSION,\n    type: \"chat\",\n    ...(prompt ? { prompt: String(prompt).slice(0, 2000) } : {}),\n  });\n  return true;\n}\n\n/**\n * Tell the dashboard's chat what the user is looking at, so \"this contact\"\n * means the one on screen. Call it from the screen that shows the record; the\n * context clears when that screen unmounts. Labels and ids only, never the\n * record's content: the chat reads that through your API when it needs to.\n *\n *   useChatContext({ label: \"Contact\", record: { type: \"contact\", id: c.id, label: c.name } });\n */\nexport function useChatContext(context: ChatContext | null) {\n  const key = embedded && context ? JSON.stringify(sanitizeContext(context)) : \"\";\n  useEffect(() => {\n    if (!embedded || !key) return;\n    listen();\n    chatContext = JSON.parse(key) as ChatContext;\n    post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"context\", context: chatContext });\n    return () => {\n      chatContext = null;\n      post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"context\", context: null });\n    };\n  }, [key]);\n}\n\nfunction sanitizeContext(c: ChatContext): ChatContext {\n  return {\n    ...(c.label ? { label: String(c.label).slice(0, 60) } : {}),\n    ...(c.record && c.record.type && c.record.id\n      ? {\n          record: {\n            type: String(c.record.type).slice(0, 40),\n            id: String(c.record.id).slice(0, 80),\n            ...(c.record.label ? { label: String(c.record.label).slice(0, 80) } : {}),\n          },\n        }\n      : {}),\n  };\n}\n\n/**\n * Run `onChange` when the dashboard's chat has written this app's data (a\n * POST, PUT, PATCH or DELETE through your API), with the API paths it called.\n * Refetch what is on screen. While no mounted component uses this hook, the\n * dashboard reloads the whole iframe after such a write instead.\n *\n *   useHostChanges(() => { void reload(); });\n */\nexport function useHostChanges(onChange: (paths: string[]) => void) {\n  const ref = useRef(onChange);\n  ref.current = onChange;\n  useEffect(\n    () =>\n      subscribe((d) => {\n        if (d.type !== \"changed\" || !Array.isArray(d.paths)) return;\n        ref.current(d.paths.filter((p): p is string => typeof p === \"string\").slice(0, 20));\n      }, \"changes\"),\n    [],\n  );\n}\n\n/**\n * Let the dashboard (its chat, a deep link) open any page of the app through\n * your router, without reloading the iframe. `path` is an in-app path such as\n * \"/contacts/42?tab=deals\". While no mounted component uses this hook, the\n * dashboard reloads the iframe at that path instead.\n *\n *   useHostNavigate((path) => navigate(path));\n */\nexport function useHostNavigate(onNavigate: (path: string) => void) {\n  const ref = useRef(onNavigate);\n  ref.current = onNavigate;\n  useEffect(\n    () =>\n      subscribe((d) => {\n        if (d.type === \"navigate\" && \"path\" in d && isAppPath(d.path)) ref.current(d.path);\n      }, \"path\"),\n    [],\n  );\n}\n\n/**\n * Tell the host where the app is, so the dashboard URL can restore this view\n * on reload. Call it whenever your router's location changes; a no-op when\n * standalone.\n */\nexport function reportLocation(path: string) {\n  // The initial URL carries the dashboard's own parameters (the app token\n  // and the host flag). They are not part of the app's location and must\n  // never land in a URL the dashboard writes, so strip them here as well.\n  let clean = path;\n  try {\n    const u = new URL(path, \"http://app.invalid\");\n    u.searchParams.delete(\"token\");\n    u.searchParams.delete(HOST_PARAM);\n    clean = u.pathname + u.search + u.hash;\n  } catch {\n    // Not a path we can parse: send as-is, the host validates its shape.\n  }\n  post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"location\", path: clean });\n}\n\nexport interface AppNavProps {\n  /** App name, shown in the brand row standalone and in the host's switcher. */\n  title: string;\n  /**\n   * The app's own glyph, a lucide icon name (kebab-case). Drawn as an\n   * outline icon with no background: in the standalone brand row, and by the\n   * dashboard on the app's sidebar item. Tiles are for records, not for\n   * navigation, so the app's coloured tile icon stays out of the sidebar.\n   */\n  icon?: string;\n  groups: AppNavGroup[];\n  /** `id` of the active item. */\n  active?: string;\n  /** Called with the item the user chose, from either renderer. */\n  onNavigate: (item: AppNavItem) => void;\n  /** Rendered at the bottom of the standalone sidebar (a footer action, say). */\n  children?: ReactNode;\n}\n\n/**\n * The app's navigation: sidebar when standalone, host-fed when embedded.\n *\n * Standalone layout: the sidebar is a 260px column at ≥768px and a horizontal\n * strip below that, so put it first inside a `flex flex-col md:flex-row`\n * container. It paints with the app's own theme tokens (`--surface`,\n * `--border`, `--primary`…) and falls back to the platform defaults when a\n * token is missing.\n */\nexport function AppNav({ title, icon, groups, active, onNavigate, children }: AppNavProps) {\n  // Always the latest callback, so the host listener never calls a stale one.\n  const onNavigateRef = useRef(onNavigate);\n  onNavigateRef.current = onNavigate;\n  const groupsRef = useRef(groups);\n  groupsRef.current = groups;\n\n  // Embedded: publish the tree whenever it changes. Serialising is the cheap\n  // way to dedupe — apps build `groups` inline every render.\n  const payload = embedded\n    ? JSON.stringify({ title, icon, groups: sanitize(groups), active })\n    : \"\";\n  const lastSent = useRef(\"\");\n  useEffect(() => {\n    if (!embedded || payload === lastSent.current) return;\n    lastSent.current = payload;\n    const { title, icon, groups, active } = JSON.parse(payload) as {\n      title: string;\n      icon?: string;\n      groups: AppNavGroup[];\n      active?: string;\n    };\n    post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"nav\", title, icon, groups, active });\n  }, [payload]);\n\n  // Embedded: handshake + listen for the host's clicks.\n  useEffect(\n    () =>\n      subscribe((d) => {\n        if (d.type === \"hello\") {\n          // Host (re)mounted its listener after we first published: resend.\n          lastSent.current = \"\";\n          const g = sanitize(groupsRef.current);\n          post({ source: \"clawnify-app\", v: HOST_BRIDGE_VERSION, type: \"nav\", title, icon, groups: g, active });\n        } else if (d.type === \"navigate\" && \"id\" in d && typeof d.id === \"string\") {\n          const item = groupsRef.current.flatMap((g) => g.items).find((i) => i.id === d.id);\n          if (item) onNavigateRef.current(item);\n        }\n      }),\n    // title/active are read from the closure only on `hello`; the publish\n    // effect above covers their normal updates.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  if (embedded) return null;\n\n  const home = groups.flatMap((g) => g.items).find((i) => i.home);\n  const brand = (\n    <>\n      {(() => { const I = iconFor(icon); return I ? <I size={16} aria-hidden /> : null; })()}\n      <span>{title}</span>\n    </>\n  );\n\n  return (\n    <aside className=\"cn-nav\">\n      <style>{CSS}</style>\n      {home ? (\n        <a\n          href={home.href ?? \"/\"}\n          className=\"cn-nav-brand\"\n          data-active={home.id === active || undefined}\n          aria-current={home.id === active ? \"page\" : undefined}\n          onClick={(e: MouseEvent) => {\n            if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n            e.preventDefault();\n            onNavigate(home);\n          }}\n        >\n          {brand}\n        </a>\n      ) : (\n        <div className=\"cn-nav-brand\">{brand}</div>\n      )}\n      <nav className=\"cn-nav-groups\" aria-label=\"Primary\">\n        {groups.map((g, gi) => (\n          <div className=\"cn-nav-group\" key={g.label ?? gi}>\n            {g.label && <p className=\"cn-nav-eyebrow\">{g.label}</p>}\n            {g.items\n              .filter((item) => !item.home)\n              .map((item) => (\n                <NavRow key={item.id} item={item} active={item.id === active} onNavigate={onNavigate} />\n              ))}\n          </div>\n        ))}\n      </nav>\n      {children && <div className=\"cn-nav-footer\">{children}</div>}\n    </aside>\n  );\n}\n\nfunction NavRow({\n  item,\n  active,\n  onNavigate,\n}: {\n  item: AppNavItem;\n  active: boolean;\n  onNavigate: (item: AppNavItem) => void;\n}) {\n  const body = (\n    <>\n      <TileIcon icon={item.icon} color={item.color} seed={item.id} />\n      <span className=\"cn-nav-label\">{item.label}</span>\n      {typeof item.count === \"number\" && <span className=\"cn-nav-count\">{item.count}</span>}\n    </>\n  );\n  // A real link when there is an href — middle-click and copy-link keep\n  // working — but the click itself goes through the app's router.\n  if (item.href) {\n    return (\n      <a\n        href={item.href}\n        className=\"cn-nav-item\"\n        data-active={active || undefined}\n        aria-current={active ? \"page\" : undefined}\n        onClick={(e: MouseEvent) => {\n          if (e.metaKey || e.ctrlKey || e.shiftKey || e.button !== 0) return;\n          e.preventDefault();\n          onNavigate(item);\n        }}\n      >\n        {body}\n      </a>\n    );\n  }\n  return (\n    <button\n      type=\"button\"\n      className=\"cn-nav-item\"\n      data-active={active || undefined}\n      aria-current={active ? \"page\" : undefined}\n      onClick={() => onNavigate(item)}\n    >\n      {body}\n    </button>\n  );\n}\n\n/** Our names → Phosphor components; the same map the dashboard holds. */\nconst ICONS: Record<string, PhosphorIcon> = {\n  \"activity\": Pulse,\n  \"archive\": Archive,\n  \"bar-chart-3\": ChartBar,\n  \"bell\": Bell,\n  \"book-open\": BookOpen,\n  \"bot\": Robot,\n  \"briefcase\": Briefcase,\n  \"building-2\": Building,\n  \"calendar\": Calendar,\n  \"calendar-days\": CalendarDots,\n  \"camera\": Camera,\n  \"check-square\": CheckSquare,\n  \"clipboard-list\": ClipboardText,\n  \"clock\": Clock,\n  \"code-2\": Code,\n  \"contact\": AddressBook,\n  \"credit-card\": CreditCard,\n  \"database\": Database,\n  \"dollar-sign\": CurrencyDollar,\n  \"file\": File,\n  \"file-text\": FileText,\n  \"folder\": Folder,\n  \"globe\": Globe,\n  \"hash\": Hash,\n  \"history\": ClockCounterClockwise,\n  \"home\": House,\n  \"image\": Image,\n  \"inbox\": Tray,\n  \"kanban\": Kanban,\n  \"layers\": Stack,\n  \"layout-dashboard\": SquaresFour,\n  \"layout-grid\": GridFour,\n  \"link\": Link,\n  \"list\": List,\n  \"list-checks\": ListChecks,\n  \"mail\": Envelope,\n  \"map\": MapTrifold,\n  \"message-square\": ChatCircle,\n  \"mic\": Microphone,\n  \"package\": Package,\n  \"phone\": Phone,\n  \"pie-chart\": ChartPie,\n  \"play\": Play,\n  \"search\": MagnifyingGlass,\n  \"send\": PaperPlaneTilt,\n  \"settings\": Gear,\n  \"shopping-cart\": ShoppingCart,\n  \"sparkles\": Sparkle,\n  \"star\": Star,\n  \"table\": Table,\n  \"tag\": Tag,\n  \"target\": Target,\n  \"truck\": Truck,\n  \"upload\": Upload,\n  \"user\": User,\n  \"users\": User,\n  \"video\": VideoCamera,\n  \"wallet\": Wallet,\n  \"zap\": Lightning,\n};\nfunction iconFor(name?: string): PhosphorIcon | undefined {\n  return name ? ICONS[name] : undefined;\n}\n\n/** Only the fields the protocol defines, with sane bounds, cross the bridge. */\nfunction sanitize(groups: AppNavGroup[]): AppNavGroup[] {\n  return groups.slice(0, 20).map((g) => ({\n    ...(g.label ? { label: String(g.label).slice(0, 40) } : {}),\n    items: g.items.slice(0, 100).map((i) => ({\n      id: String(i.id),\n      label: String(i.label).slice(0, 60),\n      ...(i.href ? { href: String(i.href) } : {}),\n      ...(i.icon ? { icon: String(i.icon) } : {}),\n      ...(typeof i.count === \"number\" && Number.isFinite(i.count) ? { count: i.count } : {}),\n      ...(i.home ? { home: true } : {}),\n      ...(i.color && i.color in NAV_COLORS ? { color: i.color } : {}),\n    })),\n  }));\n}\n\n// Scoped by class prefix; tokens follow apps/DESIGN.md with its light defaults\n// as fallbacks, so an app with a partial theme still gets a readable sidebar.\nconst CSS = `\n.cn-nav{width:16.25rem;flex-shrink:0;display:flex;flex-direction:column;border-right:1px solid var(--border,#e2e8f0);background:var(--surface,#fff);color:var(--foreground,#1a202c)}\n.cn-nav-brand{height:3.5rem;flex-shrink:0;display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;border-bottom:1px solid var(--border,#e2e8f0);font-size:.875rem;font-weight:600;color:inherit;text-decoration:none}\na.cn-nav-brand:hover{background:var(--sunken,#f1f5f9)}\n.cn-nav-brand>svg{color:var(--primary,#dd5164)}\n.cn-nav-groups{flex:1;overflow-y:auto;padding:.75rem}\n.cn-nav-group+.cn-nav-group{margin-top:1rem}\n.cn-nav-eyebrow{margin:0 0 .25rem;padding:0 .625rem;font-size:.75rem;font-weight:500;color:var(--muted,#475569)}\n.cn-nav-item{display:flex;align-items:center;gap:.5rem;width:100%;margin:0 0 .125rem;padding:.4375rem .625rem;border:0;border-radius:.375rem;background:none;color:inherit;font:inherit;font-size:.875rem;text-align:left;text-decoration:none;cursor:pointer}\n.cn-nav-item:hover{background:var(--sunken,#f1f5f9)}\n.cn-nav-item[data-active]{background:color-mix(in srgb,var(--primary,#dd5164) 12%,transparent);color:var(--primary,#dd5164);font-weight:600}\n.cn-nav-item:focus-visible{outline:2px solid var(--ring,#2563eb);outline-offset:-2px}\n.cn-nav-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.cn-nav-count{font-size:.75rem;font-variant-numeric:tabular-nums;color:var(--muted,#475569)}\n.cn-nav-item[data-active] .cn-nav-count{color:inherit}\n.cn-nav-footer{padding:.75rem;border-top:1px solid var(--border,#e2e8f0)}\n@media (max-width:767px){\n.cn-nav{width:100%;flex-direction:row;border-right:0;border-bottom:1px solid var(--border,#e2e8f0)}\n.cn-nav-brand,.cn-nav-eyebrow,.cn-nav-footer{display:none}\n.cn-nav-groups{display:flex;gap:.25rem;padding:.5rem .75rem;overflow-x:auto;overflow-y:hidden}\n.cn-nav-group{display:flex;gap:.25rem}\n.cn-nav-group+.cn-nav-group{margin:0}\n.cn-nav-item{width:auto;margin:0;white-space:nowrap}\n}\n`;\n"],"mappings":"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","names":["title","icon","groups","active"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clawnify/app",
-  "version": "0.2.2",
+  "version": "0.3.0",
   "description": "The standard Clawnify app skeleton in one call. createApp() returns a fully-wired OpenAPIHono with D1/Storage init + /api/openapi.json + /llms.txt discovery pre-baked, so an app is just imports + routes + export.",
   "type": "module",
   "main": "./dist/index.js",
@@ -23,8 +23,8 @@
     "dist"
   ],
   "dependencies": {
-    "@clawnify/routes": "^0.3.0",
-    "@clawnify/db": "^0.4.2"
+    "@clawnify/db": "^0.4.2",
+    "@clawnify/routes": "^0.3.0"
   },
   "peerDependencies": {
     "@hono/zod-openapi": ">=0.18 <1",