@graph8/sdk 0.370.0 → 0.373.0

package/dist/types/blocks/brand.d.ts

@@ -75,7 +75,7 @@ export declare function renderBrandConfig(f: BrandFields): string;
 export declare function readBrandConfig(source: string): Partial<BrandFields> | null;
 /** The config with its region rewritten, or null when the user owns the file (no markers). */
 export declare function applyBrandConfig(source: string, f: BrandFields): string | null;
-export declare const BRAND_USAGE = "Usage: npx @graph8/sdk brand [options]\n\nBrand an app made by `create` (run it in the app's root). Every option is optional; values you leave out stay.\n  --name <text>              the app's name (sidebar, page title)\n  --brand-color <hex>        primary colour, e.g. \"#0f62fe\": writes --brand, a 50-900 scale and --primary into\n                             app/globals.css, with button text checked for WCAG AA (adjusted when needed)\n  --dark-brand-color <hex>   the colour in dark mode (default: derived from --brand-color, lightened if too dark)\n  --logo <path>              an svg, png, jpg, webp or gif (max 512 KB), copied to public/brand/ and shown in the sidebar\n  --app-url <url>            white-label: where link-outs go (default https://app.graph8.com)\n  --link-label <text>        white-label: what the platform is called in copy and links (default graph8)\n  --dir <path>               the app's root (default: current directory)\n  --dry-run                  print what would change, write nothing\nRunning it again with the same options changes nothing.";
+export declare const BRAND_USAGE = "Usage: npx @graph8/sdk brand [options]\n\nBrand an app made by `create` (run it in the app's root). Every option is optional; values you leave out stay.\n  --name <text>              the app's name (sidebar, page title)\n  --brand-color <hex>        primary colour, e.g. \"#0f62fe\": writes --brand, a 50-900 scale and --primary into\n                             app/globals.css, with button text checked for WCAG AA (adjusted when needed)\n  --dark-brand-color <hex>   the colour in dark mode (default: derived from --brand-color, lightened if too dark)\n  --logo <path>              an svg, png, jpg, webp or gif (max 512 KB), copied to public/brand/ and shown in the sidebar\n  --app-url <url>            white-label: where link-outs go (default https://app.graph8.com)\n  --link-label <text>        white-label: what the platform is called in copy and links (default graph8)\n  --from-org                 fill in what you did not pass from the organization's Brand Kit (needs G8_API_KEY in the\n                             environment or .env.local): name, primary colour, logo. Running brand with no options\n                             does the same when the kit has something. Values you pass always win; they replace what the app has now.\n  --no-org-brand             never read the Brand Kit\n  --dir <path>               the app's root (default: current directory)\n  --dry-run                  print what would change, write nothing\nRunning it again with the same options changes nothing.";
 export interface BrandOptions {
     dir: string;
     name?: string;
@@ -85,6 +85,10 @@ export interface BrandOptions {
     appUrl?: string;
     linkLabel?: string;
     dryRun?: boolean;
+    /** `--from-org`, or a bare `brand`: fill the gaps from the org's Brand Kit. */
+    fromOrg?: boolean;
+    /** `--no-org-brand`. */
+    noOrgBrand?: boolean;
 }
 /** The brand flags (shared with `create`). Returns true when `argv[i]` was one; `next()` consumes its value. */
 export declare function takeBrandFlag(o: Partial<BrandOptions>, flag: string, next: () => string): boolean;
@@ -92,6 +96,11 @@ export declare function hasBrandInput(o: Partial<BrandOptions>): boolean;
 export declare function parseBrandArgs(argv: string[]): BrandOptions;
 export declare const LOGO_TYPES: string[];
 export declare const MAX_LOGO_BYTES: number;
+export type OrgBrandValues = Pick<BrandOptions, "name" | "color" | "logo">;
+/** Explicit options win per field; org values fill only what the user left out. */
+export declare function mergeOrgBrand<T extends Partial<BrandOptions>>(explicit: T | undefined, org: OrgBrandValues, skip?: {
+    name?: boolean;
+}): T;
 export interface BrandIO {
     out: (line: string) => void;
     err: (line: string) => void;
@@ -109,5 +118,5 @@ export declare function planBrand(o: BrandOptions, root: string, cwd: string, fa
     notes: string[];
 };
 /** Run `brand`. Returns the exit code. */
-export declare function runBrand(o: BrandOptions, io: BrandIO, cwd: string, fallbackName?: string): number;
+export declare function runBrand(given: BrandOptions, io: BrandIO, cwd: string, fallbackName?: string, org?: OrgBrandValues): number;
 export {};

package/dist/types/blocks/create.d.ts

@@ -7,11 +7,11 @@
  * Node only. Reads `templates/next-app/**` (shipped in the package) and the
  * block registry; writes only inside `<dir>`.
  */
-import { type BrandOptions } from "./brand";
+import { type OrgBrandValues, type BrandOptions } from "./brand";
 import { type AddIO, type PackageManager } from "./add";
 import { componentImportPath, navParts, navUsesExtras, pageFileFor, render } from "./navfile";
 import { type Registry, type Stack, type StackNav } from "./registry";
-export declare const CREATE_USAGE = "Usage: npx @graph8/sdk create <stack> <dir> [options]\n\nScaffold a Next.js (App Router, TypeScript, Tailwind CSS v4) app for a stack and\ninstall the stack's blocks into it. Run `graph8-sdk list` to see the stacks.\n  --package-manager <npm|pnpm|yarn|bun>   default: the one running the command, else npm\n  --no-install      write the files and blocks, do not install dependencies\n  --dry-run         print what would be written, write and install nothing\n  --force           allow a non-empty <dir> (template files are overwritten, and graph8.json\n                    is reset: blocks you added to that app earlier are no longer recorded)\nThen: `npm run dev` in <dir>, open http://localhost:3000 and paste a graph8 API key (local preview), and run\n`npx @graph8/sdk doctor --stack <stack>` (add --production before going live).\n\nOr pick the features yourself, for any app (also: `create custom --blocks ...`):\n  npx @graph8/sdk create --blocks <id,id,...> [--title \"Acme CRM\"] <dir> [options]\nEvery requested block's dependencies come with it. The app gets one route and one sidebar entry per finished\nScreen of the requested blocks, plus the user-facing Screens of their dependencies (asking for deals also gives\nyou crm's screens). `/` opens the analytics screen if you asked for one, else the first screen.\n  --title <text>          the app's name (default: graph8 app)\n  --with-deps-screens     also add the plain fallback page of dependency blocks that have no Screen\n  --no-deps-screens       add screens only for the blocks you named\nRun `graph8-sdk list` to see each block and which have Screens.\n\nBrand it (any stack or --blocks; the same as running `graph8-sdk brand` in the new app afterwards):\n  --name <text>             the app's name (with --blocks, the same as --title)\n  --brand-color <hex>       primary colour, AA-checked; --dark-brand-color <hex> for dark mode\n  --logo <path>             svg/png/jpg/webp/gif, shown in the sidebar\n  --app-url <url>           white-label: where \"Open in graph8\" links go; --link-label <text>: what they call it\nA directory literally named `custom` would read as the alias: pass `--blocks crm ./custom`.";
+export declare const CREATE_USAGE = "Usage: npx @graph8/sdk create <stack> <dir> [options]\n\nScaffold a Next.js (App Router, TypeScript, Tailwind CSS v4) app for a stack and\ninstall the stack's blocks into it. Run `graph8-sdk list` to see the stacks.\n  --package-manager <npm|pnpm|yarn|bun>   default: the one running the command, else npm\n  --no-install      write the files and blocks, do not install dependencies\n  --dry-run         print what would be written, write and install nothing\n  --force           allow a non-empty <dir> (template files are overwritten, and graph8.json\n                    is reset: blocks you added to that app earlier are no longer recorded)\nThen: `npm run dev` in <dir>, open http://localhost:3000 and paste a graph8 API key (local preview), and run\n`npx @graph8/sdk doctor --stack <stack>` (add --production before going live).\n\nOr pick the features yourself, for any app (also: `create custom --blocks ...`):\n  npx @graph8/sdk create --blocks <id,id,...> [--title \"Acme CRM\"] <dir> [options]\nEvery requested block's dependencies come with it. The app gets one route and one sidebar entry per finished\nScreen of the requested blocks, plus the user-facing Screens of their dependencies (asking for deals also gives\nyou crm's screens). `/` opens the analytics screen if you asked for one, else the first screen.\n  --title <text>          the app's name (default: graph8 app)\n  --with-deps-screens     also add the plain fallback page of dependency blocks that have no Screen\n  --no-deps-screens       add screens only for the blocks you named\nRun `graph8-sdk list` to see each block and which have Screens.\n\nBrand it (any stack or --blocks; the same as running `graph8-sdk brand` in the new app afterwards):\n  --name <text>             the app's name (with --blocks, the same as --title)\n  --brand-color <hex>       primary colour, AA-checked; --dark-brand-color <hex> for dark mode\n  --logo <path>             svg/png/jpg/webp/gif, shown in the sidebar\n  --app-url <url>           white-label: where \"Open in graph8\" links go; --link-label <text>: what they call it\nWith a graph8 API key (G8_API_KEY in the environment or .env.local) the org's Brand Kit fills in what you did not\npass: the app name, the primary colour and the logo (downloaded into public/brand/). No key, no kit or an error:\nthe default look, one info line, never a failure. --no-org-brand skips it.\nA directory literally named `custom` would read as the alias: pass `--blocks crm ./custom`.";
 export interface CreateOptions {
     stack: string;
     dir: string;
@@ -26,6 +26,8 @@ export interface CreateOptions {
     depsScreens?: "default" | "with" | "none";
     /** `--name`, `--brand-color`, `--logo`, ...: applied with `graph8-sdk brand` once the app is written. */
     brand?: Omit<BrandOptions, "dir" | "dryRun">;
+    /** false with `--no-org-brand`: do not pull the org's Brand Kit. */
+    orgBrand?: false;
 }
 export declare function parseCreateArgs(argv: string[]): CreateOptions;
 /** What `graph8.json` records about a custom app, so `add` and `doctor` know its routes. */
@@ -45,6 +47,8 @@ export interface CreateIO extends AddIO {
     sdkPackageJson?: string;
     /** npm_config_user_agent, to default the package manager. */
     userAgent?: string;
+    /** Name, colour and logo pulled from the org's Brand Kit (see orgBrand.ts); explicit brand flags win. */
+    orgBrand?: OrgBrandValues;
 }
 export declare function packageManagerFromUserAgent(ua: string | undefined): PackageManager;
 /** A valid npm package name from a directory name. */
@@ -59,5 +63,5 @@ export declare function stackProblem(reg: Registry, stack: Stack): string | null
 export declare function stackPageFile(reg: Registry, stack: Stack, n: StackNav): string | null;
 export declare function planCreate(reg: Registry, stack: Stack, appName: string, pm: PackageManager, io: CreateIO, app?: AppRecord): OutFile[];
 /** Run `create`. Returns the process exit code. */
-export declare function runCreate(opts: CreateOptions, reg: Registry, io: CreateIO, cwd: string): number;
+export declare function runCreate(given: CreateOptions, reg: Registry, io: CreateIO, cwd: string): number;
 export { componentImportPath, navParts, navUsesExtras, pageFileFor, render };

package/dist/types/blocks/doctor.d.ts

@@ -25,6 +25,7 @@ export interface DoctorIO {
     env: Record<string, string | undefined>;
     fetch?: typeof fetch;
 }
+export declare function readSetting(name: string, root: string, env: DoctorIO["env"]): string | undefined;
 /** Same rules as the server's `key_has_scope`. */
 export declare function scopeGranted(granted: string[], required: string): boolean;
 /** Run doctor. Returns the exit code: 0 when every check passes. */

package/dist/types/blocks/flows.d.ts

@@ -14,7 +14,13 @@ export interface UnreachedComponent {
     component: string;
 }
 /**
- * Components of the stack's own blocks (the foundation's shared UI is exempt) that no
+ * Library blocks hold shared building blocks that other blocks import, not pages of their own: the foundation's shared
+ * UI and the pickers. A stack installs them whole but each screen uses only some, so they are never "unreached".
+ * Every other block is judged component by component.
+ */
+export declare const LIBRARY_BLOCKS: ReadonlySet<string>;
+/**
+ * Components of the stack's own blocks (library blocks are exempt) that no
  * generated page reaches, directly or through a Screen that imports them.
  */
 export declare function unreachedComponents(reg: Registry, stack: Stack): UnreachedComponent[];

package/dist/types/blocks/orgBrand.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Pull the organization's Brand Kit into a new app: `create` and `brand --from-org`.
+ *
+ * Reads two Developer API operations with the project's key (the same resolution `doctor` uses: G8_API_KEY from
+ * the environment, then .env.local; G8_API_URL for a non-default API):
+ *   - get_brand_kit_overview_brand_kit_get  -> logo_url, design_tokens.colors, source_url (scope campaigns:read)
+ *   - describe_current_key_me_get           -> org_name
+ * The kit has ONE logo URL (no light/dark/icon variant), a measured colour palette and fonts, a tagline and voice
+ * traits. Only the name, the primary colour and the logo map onto the brand inputs; fonts, tagline and voice have no
+ * SDK brand input and are ignored.
+ *
+ * Never fails the caller: no key, a 4xx/5xx, a network error, a timeout or an empty kit all give `{}` plus one info
+ * line. The key is never printed or written. The logo is downloaded to a temp file (https or data: URL, an image type,
+ * at most 512 KB) so `brand` copies it into public/brand/ like any `--logo` file: nothing is hot-linked.
+ */
+import { mergeOrgBrand, type OrgBrandValues } from "./brand";
+export { mergeOrgBrand, type OrgBrandValues };
+export interface OrgBrandPull {
+    values: OrgBrandValues;
+    /** One line for the CLI to print. */
+    info: string;
+    /** Remove the temp logo file. */
+    cleanup: () => void;
+}
+export interface OrgBrandIO {
+    env: Record<string, string | undefined>;
+    fetch?: typeof fetch;
+}
+/** The primary colour of the kit's measured tokens, or null. */
+export declare function pickColor(tokens: unknown): string | null;
+/** A display name that is safe to write into generated files. */
+export declare function cleanName(v: unknown): string | null;
+/** Pull name, primary colour and logo from the org's Brand Kit. Never throws. */
+export declare function pullOrgBrand(io: OrgBrandIO, root: string): Promise<OrgBrandPull>;

package/dist/types/cli.d.ts

@@ -10,6 +10,7 @@
  * Node only. Built as a separate entry (dist/cli.js), so nothing here reaches
  * the browser bundle or the package's main exports.
  */
+import type { OrgBrandValues } from "./blocks/brand";
 export interface CliIO {
     cwd: string;
     out: (line: string) => void;
@@ -26,6 +27,8 @@ export interface CliIO {
     env?: Record<string, string | undefined>;
     /** fetch for `doctor`. Default: global fetch. */
     fetch?: typeof fetch;
+    /** Name, colour and logo pulled from the org's Brand Kit by `runCliAsync` for `create` and `brand`. */
+    orgBrand?: OrgBrandValues;
 }
 export declare function runCli(argv: string[], io: CliIO): number;
 /** Like `runCli`, plus the commands that talk to the network (`doctor`). */

package/dist/types/version.d.ts

@@ -5,6 +5,6 @@
  * both together (the version-parity gate already pins package.json, the
  * lockfile and the CHANGELOG to each other).
  */
-export declare const SDK_VERSION = "0.370.0";
+export declare const SDK_VERSION = "0.373.0";
 /** Value of the `X-G8-Client` header every SDK request carries (I-13). */
-export declare const SDK_CLIENT_ID = "js-sdk/0.370.0";
+export declare const SDK_CLIENT_ID = "js-sdk/0.373.0";

package/docs/api/desk.d.ts

@@ -155,7 +155,7 @@ export interface DeskOperations {
   };
   /**
    * POST /desk/cards
-   * Create Desk Card
+   * Put one planned outreach touch (an email, LinkedIn or call step for one contact) on a rep's desk with its why, facts and draft. The rep edits and sends it; nothing sends by itself. owner_id must be the caller's own email unless the key is an org or machine key: a personal key or an OAuth connection is a person and gets 403 owner_not_self for anyone else. Posting the same external_key again updates the open card instead of adding a second one. Needs deals:write and a key allowed to see the contact
    * tier: write · scope: deals:write
    */
   create_desk_card_desk_cards_post: {
@@ -1582,7 +1582,7 @@ export interface DeskCardCreateRequest {
   external_key?: string | null;
   list_id?: number | null;
   origin?: DeskCardOrigin | null;
-  /** Whose desk: a team member's email, id or user id. */
+  /** Whose desk: a team member's email, id or user id. With a personal key or an OAuth connection this must be the caller's own email (the key is a person; anyone else is 403 owner_not_self). Only an org or machine key may name another rep. */
   owner_id: string;
   /** low, normal, high or urgent. */
   priority?: string;

package/docs/api/desk.md

@@ -26,7 +26,7 @@ Exact TypeScript types for every operation on this page, and every schema they u
 | [`askDesk`](#op-askdesk) | `POST /api/v1/desk/ask` | billable | `deals:run` | Ask Desk |
 | [`checkCommitteePlay`](#op-checkcommitteeplay) | `GET /api/v1/desk/accounts/{account_id}/committee/plays/{action_id}/check` | read | `deals:read` | Check Committee Play |
 | [`checkDeskPlanStageSweep`](#op-checkdeskplanstagesweep) | `GET /api/v1/desk/org-settings/plan-stages/check` | read | `deals:read` | Check Desk Plan Stage Sweep |
-| [`createDeskCard`](#op-createdeskcard) | `POST /api/v1/desk/cards` | write | `deals:write` | Create Desk Card |
+| [`createDeskCard`](#op-createdeskcard) | `POST /api/v1/desk/cards` | write | `deals:write` | Put one planned outreach touch (an email, LinkedIn or call step for one contact) on a rep's desk with its why, facts an… |
 | [`createOrReplanAccountPlan`](#op-createorreplanaccountplan) | `POST /api/v1/desk/accounts/{account_id}/plan` | write | `deals:write` | Create Or Replan Account Plan |
 | [`decideDeskPlayApproval`](#op-decidedeskplayapproval) | `POST /api/v1/desk/plays/approvals/{execution_id}/decide` | external | `deals:run` | Decide Desk Play Approval |
 | [`draftAccountPlan`](#op-draftaccountplan) | `POST /api/v1/desk/accounts/{account_id}/plan/draft` | billable | `deals:run` | Draft Account Plan |
@@ -261,7 +261,7 @@ const result = await g8.api.desk.checkDeskPlanStageSweep();
 
 ### `g8.api.desk.createDeskCard(input)`
 
-**Create Desk Card**
+**Put one planned outreach touch (an email, LinkedIn or call step for one contact) on a rep's desk with its why, facts and draft. The rep edits and sends it; nothing sends by itself. owner_id must be t…**
 
 - HTTP: `POST /api/v1/desk/cards`
 - operationId: `create_desk_card_desk_cards_post` (also callable as `g8.api.call("create_desk_card_desk_cards_post", input)`)
@@ -297,7 +297,7 @@ Body fields (`DeskCardCreateRequest`):
 |---|---|---|---|
 | `body.channel` | `string` | yes | email, linkedin or call. min length 1, max length 32 |
 | `body.contact_id` | `integer` | yes | The contact the touch is for. max 9223372036854776000, > 0 |
-| `body.owner_id` | `string` | yes | Whose desk: a team member's email, id or user id. min length 1, max length 320 |
+| `body.owner_id` | `string` | yes | Whose desk: a team member's email, id or user id. With a personal key or an OAuth connection this must be the caller's own email (the key is a person; anyone else is 403 owner_not_self). Only an org or machine key may name another rep. min length 1, max length 320 |
 | `body.account_id` | `integer \| null` | no | The contact's company, when it is not the contact's own. max 9223372036854776000, > 0 |
 | `body.context` | `DeskCardContext \| null` | no |  |
 | `body.draft` | `DeskCardDraft \| null` | no |  |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graph8/sdk",
-  "version": "0.370.0",
+  "version": "0.373.0",
   "description": "graph8 SDK - CRM, enrichment, sequences, campaigns, and tracking for B2B",
   "license": "MIT",
   "author": "graph8 <support@graph8.com> (https://graph8.com)",

package/stacks/6sense/pages/companies.tsx.tmpl

@@ -0,0 +1,21 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { CompaniesScreen } from "@/components/g8/crm/companies-screen";
+import { CompanyIntelligenceTab } from "@/components/g8/company-intelligence/company-intelligence-tab";
+import { RecordEngagementTab } from "@/components/g8/crm/record-engagement-tab";
+import { useRouter } from "next/navigation";
+
+export default function Page() {
+  const router = useRouter();
+  return (
+    <CompaniesScreen
+      onOpenContact={(contact) => router.push(`/contacts?id=${contact.id}`)}
+      extraDetailTabs={[
+        { id: "engagement", label: "Engagement", render: (c) => <RecordEngagementTab kind="companies" id={c.id} /> },
+        { id: "intelligence", label: "Intelligence", render: (c) => <CompanyIntelligenceTab company={c} onOpenIntelligence={() => router.push("/company-intelligence")} /> },
+      ]}
+    />
+  );
+}

package/stacks/6sense/pages/contacts.tsx.tmpl

@@ -0,0 +1,19 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { ContactsScreen } from "@/components/g8/crm/contacts-screen";
+import { RecordEngagementTab } from "@/components/g8/crm/record-engagement-tab";
+import { useRouter } from "next/navigation";
+
+export default function Page() {
+  const router = useRouter();
+  return (
+    <ContactsScreen
+      onOpenCompany={(id) => router.push(`/companies?id=${id}`)}
+      extraDetailTabs={[
+        { id: "engagement", label: "Engagement", render: (c) => <RecordEngagementTab kind="contacts" id={c.id} /> },
+      ]}
+    />
+  );
+}

package/stacks/6sense/pages/tasks.tsx.tmpl

@@ -0,0 +1,19 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { useRouter } from "next/navigation";
+import { TasksScreen } from "@/components/g8/crm/tasks-screen";
+
+/** A task's linked record opens in the screen that owns it. */
+export default function Page() {
+  const router = useRouter();
+  return (
+    <TasksScreen
+      onOpenRecord={(record) => {
+        if (record.entity_type === "contact") router.push(`/contacts?id=${encodeURIComponent(record.entity_id)}`);
+        if (record.entity_type === "company") router.push(`/companies?id=${encodeURIComponent(record.entity_id)}`);
+      }}
+    />
+  );
+}

package/stacks/6sense.json

@@ -9,7 +9,8 @@
     "crm",
     "intent",
     "visitors",
-    "radar"
+    "radar",
+    "company-intelligence"
   ],
   "home": "/intent",
   "nav": [
@@ -47,7 +48,17 @@
       "component": "CompaniesScreen",
       "icon": "Building2",
       "group": "Prospect",
-      "description": "Accounts and the people at them"
+      "description": "Accounts and the people at them",
+      "page": "pages/companies.tsx.tmpl"
+    },
+    {
+      "label": "Company intelligence",
+      "path": "/company-intelligence",
+      "block": "company-intelligence",
+      "component": "CompanyIntelligenceScreen",
+      "icon": "Telescope",
+      "group": "Signals",
+      "description": "Research your website: profile, competitors, news, documents and reports"
     },
     {
       "label": "Contacts",
@@ -56,7 +67,8 @@
       "component": "ContactsScreen",
       "icon": "Users",
       "group": "Prospect",
-      "description": "People you sell to, with notes, tasks and activity"
+      "description": "People you sell to, with notes, tasks and activity",
+      "page": "pages/contacts.tsx.tmpl"
     },
     {
       "label": "Tasks",
@@ -65,7 +77,8 @@
       "component": "TasksScreen",
       "icon": "CheckSquare",
       "group": "Work",
-      "description": "Follow-ups due across your records"
+      "description": "Follow-ups due across your records",
+      "page": "pages/tasks.tsx.tmpl"
     }
   ]
 }

package/stacks/apollo/pages/calls.tsx.tmpl

@@ -0,0 +1,23 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { useRouter } from "next/navigation";
+import { Button } from "@graph8/sdk/ui";
+import { UserRound } from "lucide-react";
+import { CallLogScreen } from "@/components/g8/dialer/call-log-screen";
+
+/** A call opens the person it was made to. */
+export default function Page() {
+  const router = useRouter();
+  return (
+    <CallLogScreen
+      renderDetailActions={(call) => call.contact_id ? (
+        <Button size="sm" variant="outline" onClick={() => router.push(`/contacts?id=${encodeURIComponent(call.contact_id as string)}`)}>
+          <UserRound className="mr-1 size-4" aria-hidden />
+          Open contact
+        </Button>
+      ) : null}
+    />
+  );
+}

package/stacks/apollo/pages/companies.tsx.tmpl

@@ -2,49 +2,32 @@
 
 // Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
 // other blocks of this app plugged into its slots. Edit freely: this file is yours.
-import Link from "next/link";
-import { Skeleton } from "@graph8/sdk/ui";
-import { Handshake } from "lucide-react";
-import { ApiError } from "@/components/g8/_foundation/api-error";
-import { EmptyState } from "@/components/g8/_foundation/empty-state";
-import { useG8Query } from "@/components/g8/_foundation/hooks/use-g8-query";
-import { g8Get } from "@/components/g8/_foundation/lib/g8-client";
 import { CompaniesScreen } from "@/components/g8/crm/companies-screen";
+import { RecordEngagementTab } from "@/components/g8/crm/record-engagement-tab";
+import { RecordDealsTab } from "@/components/g8/deals/record-deals-tab";
 import { EnrichButton } from "@/components/g8/enrichment/enrich-button";
-import { dataOf, formatMoney } from "@/components/g8/deals/lib/deals-types";
-
-/** One row of GET /contacts/{id}/deals and GET /companies/{id}/deals (the API's ContactDealResponse). */
-interface LinkedDeal { deal_id?: string | null; name?: string | null; stage?: string | null; value?: number | null; currency?: string | null; role?: string | null }
-
-/** The deals linked to one contact or company, each opening in the Deals page. */
-function LinkedDeals({ kind, id }: { kind: "contacts" | "companies"; id: number }) {
-  const q = useG8Query(async (signal) => {
-    const inner = dataOf<{ items?: LinkedDeal[] } | LinkedDeal[]>(await g8Get(`/${kind}/${id}/deals`, undefined, { signal }));
-    return (Array.isArray(inner) ? inner : (inner.items ?? [])).filter((d) => d.deal_id);
-  }, [kind, id]);
-  if (q.error) return <ApiError error={q.error} title="Could not load deals" onRetry={() => void q.refetch()} />;
-  if (!q.data) return <Skeleton className="h-24 w-full" aria-label="Loading deals" />;
-  if (q.data.length === 0) return <EmptyState compact icon={<Handshake className="size-8" />} title="No deals yet" description="Deals linked to this record show up here." />;
-  return (
-    <ul className="divide-y rounded-md border" aria-label="Deals">
-      {q.data.map((d) => (
-        <li key={d.deal_id}>
-          <Link href={`/deals?id=${encodeURIComponent(d.deal_id as string)}`} className="flex items-center justify-between gap-3 p-3 text-sm hover:bg-muted">
-            <span className="min-w-0 truncate font-medium">{d.name || "Untitled deal"}</span>
-            <span className="shrink-0 text-xs text-muted-foreground">{[d.stage, d.value != null ? formatMoney(d.value, d.currency) : null].filter(Boolean).join(" · ")}</span>
-          </Link>
-        </li>
-      ))}
-    </ul>
-  );
-}
+import { AddCompanyPeopleToListButton } from "@/components/g8/lists/add-company-people-to-list-button";
+import { CompanyIntelligenceTab } from "@/components/g8/company-intelligence/company-intelligence-tab";
+import { useRouter } from "next/navigation";
 
 export default function Page() {
+  const router = useRouter();
   return (
     <CompaniesScreen
+      onOpenContact={(contact) => router.push(`/contacts?id=${contact.id}`)}
       renderRowActions={(c, { reload }) => <EnrichButton kind="company" lookup={{ domain: c.domain ?? undefined, name: c.name ?? undefined }} record={{ ...c }} onApplied={reload} label="Enrich" size="sm" variant="ghost" />}
-      renderDetailActions={(c, { reload }) => <EnrichButton kind="company" lookup={{ domain: c.domain ?? undefined, name: c.name ?? undefined }} record={{ ...c }} onApplied={reload} label="Enrich" />}
-      extraDetailTabs={[{ id: "deals", label: "Deals", render: (c) => <LinkedDeals kind="companies" id={c.id} /> }]}
+      renderBulkActions={({ ids, clear }) => <AddCompanyPeopleToListButton companyIds={ids} onAdded={clear} />}
+      renderDetailActions={(c, { reload }) => (
+        <>
+          <EnrichButton kind="company" lookup={{ domain: c.domain ?? undefined, name: c.name ?? undefined }} record={{ ...c }} onApplied={reload} label="Enrich" />
+          <AddCompanyPeopleToListButton companyIds={[c.id]} />
+        </>
+      )}
+      extraDetailTabs={[
+        { id: "deals", label: "Deals", render: (c) => <RecordDealsTab kind="companies" id={c.id} onOpenDeal={(id) => router.push(`/deals?id=${encodeURIComponent(id)}`)} /> },
+        { id: "engagement", label: "Engagement", render: (c) => <RecordEngagementTab kind="companies" id={c.id} /> },
+        { id: "intelligence", label: "Intelligence", render: (c) => <CompanyIntelligenceTab company={c} onOpenIntelligence={() => router.push("/company-intelligence")} /> },
+      ]}
     />
   );
 }

package/stacks/apollo/pages/contacts.tsx.tmpl

@@ -2,116 +2,50 @@
 
 // Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
 // other blocks of this app plugged into its slots. Edit freely: this file is yours.
-import { useState } from "react";
-import Link from "next/link";
-import { Button, Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, Skeleton } from "@graph8/sdk/ui";
-import { Handshake, ListPlus } from "lucide-react";
-import { ApiError } from "@/components/g8/_foundation/api-error";
-import { EmptyState } from "@/components/g8/_foundation/empty-state";
-import { useG8Query } from "@/components/g8/_foundation/hooks/use-g8-query";
-import { g8Get } from "@/components/g8/_foundation/lib/g8-client";
+import { RecordMeetingsTab } from "@/components/g8/appointments/record-meetings-tab";
 import { ContactsScreen } from "@/components/g8/crm/contacts-screen";
+import { RecordEngagementTab } from "@/components/g8/crm/record-engagement-tab";
+import { RecordDealsTab } from "@/components/g8/deals/record-deals-tab";
 import { CallContactButton } from "@/components/g8/dialer/call-contact-button";
+import { RecordCallsTab } from "@/components/g8/dialer/record-calls-tab";
 import { EnrichButton } from "@/components/g8/enrichment/enrich-button";
-import { dataOf, formatMoney } from "@/components/g8/deals/lib/deals-types";
-import { EnrollDialog } from "@/components/g8/sequencer/enroll-dialog";
-import { listOf, statusGroup, type SequenceRow } from "@/components/g8/sequencer/lib/sequencer-utils";
-
-/** Every active sequence, paging through the whole list (the API answers one page at a time). */
-async function activeSequences(signal: AbortSignal): Promise<SequenceRow[]> {
-  const out: SequenceRow[] = [];
-  for (let page = 1; page <= 50; page++) {
-    const env = await g8Get("/sequences", { page, limit: 100 }, { signal });
-    const rows = listOf<SequenceRow>(env);
-    out.push(...rows.filter((s) => statusGroup(s.status) === "live"));
-    const more = (env as { pagination?: { has_next?: boolean } }).pagination?.has_next;
-    if (!more || rows.length === 0) break;
-  }
-  return out;
-}
-
-/** Pick a sequence, then enroll the contacts in it. The enroll dialog shows the sending preflight before anything is sent. */
-function AddToSequence({ contactIds, onEnrolled, variant = "outline" }: { contactIds: number[]; onEnrolled?: () => void; variant?: "outline" | "default" }) {
-  const [step, setStep] = useState<"closed" | "pick" | "enroll">("closed");
-  const [sequenceId, setSequenceId] = useState("");
-  const sequences = useG8Query(activeSequences, [], { enabled: step === "pick" });
-  const chosen = (sequences.data ?? []).find((s) => s.id === sequenceId);
-  return (
-    <>
-      <Button size="sm" variant={variant} disabled={contactIds.length === 0} onClick={() => { setSequenceId(""); setStep("pick"); }}>
-        <ListPlus className="mr-1 size-4" aria-hidden />
-        Add to sequence
-      </Button>
-      <Sheet open={step === "pick"} onOpenChange={(o) => { if (!o) setStep("closed"); }}>
-        <SheetContent className="w-full sm:max-w-md">
-          <SheetHeader>
-            <SheetTitle>Add to sequence</SheetTitle>
-            <SheetDescription>{contactIds.length === 1 ? "1 contact" : `${contactIds.length} contacts`} will be enrolled in the sequence you pick.</SheetDescription>
-          </SheetHeader>
-          <div className="space-y-3 p-4">
-            {sequences.error ? <ApiError error={sequences.error} title="Could not load sequences" onRetry={() => void sequences.refetch()} /> : null}
-            {sequences.loading && !sequences.data ? <Skeleton className="h-9 w-full" aria-label="Loading sequences" /> : null}
-            {sequences.data && sequences.data.length === 0 ? <EmptyState compact title="No active sequences" description="Launch a sequence on the Sequences page first." /> : null}
-            {sequences.data && sequences.data.length > 0 ? (
-              <>
-                <label htmlFor="enroll-sequence" className="text-sm font-medium">Sequence</label>
-                <select id="enroll-sequence" className="h-9 w-full rounded-md border bg-background px-2 text-sm" value={sequenceId} onChange={(e) => setSequenceId(e.target.value)}>
-                  <option value="">Choose a sequence</option>
-                  {sequences.data.map((s) => <option key={s.id} value={s.id}>{s.name || s.id}</option>)}
-                </select>
-                <Button disabled={!sequenceId} onClick={() => setStep("enroll")}>Continue</Button>
-              </>
-            ) : null}
-          </div>
-        </SheetContent>
-      </Sheet>
-      {step === "enroll" && chosen ? (
-        <EnrollDialog open sequenceId={chosen.id} sequenceName={chosen.name ?? undefined} contactIds={contactIds} onClose={() => setStep("closed")} onEnrolled={() => { setStep("closed"); onEnrolled?.(); }} />
-      ) : null}
-    </>
-  );
-}
-
-/** One row of GET /contacts/{id}/deals and GET /companies/{id}/deals (the API's ContactDealResponse). */
-interface LinkedDeal { deal_id?: string | null; name?: string | null; stage?: string | null; value?: number | null; currency?: string | null; role?: string | null }
-
-/** The deals linked to one contact or company, each opening in the Deals page. */
-function LinkedDeals({ kind, id }: { kind: "contacts" | "companies"; id: number }) {
-  const q = useG8Query(async (signal) => {
-    const inner = dataOf<{ items?: LinkedDeal[] } | LinkedDeal[]>(await g8Get(`/${kind}/${id}/deals`, undefined, { signal }));
-    return (Array.isArray(inner) ? inner : (inner.items ?? [])).filter((d) => d.deal_id);
-  }, [kind, id]);
-  if (q.error) return <ApiError error={q.error} title="Could not load deals" onRetry={() => void q.refetch()} />;
-  if (!q.data) return <Skeleton className="h-24 w-full" aria-label="Loading deals" />;
-  if (q.data.length === 0) return <EmptyState compact icon={<Handshake className="size-8" />} title="No deals yet" description="Deals linked to this record show up here." />;
-  return (
-    <ul className="divide-y rounded-md border" aria-label="Deals">
-      {q.data.map((d) => (
-        <li key={d.deal_id}>
-          <Link href={`/deals?id=${encodeURIComponent(d.deal_id as string)}`} className="flex items-center justify-between gap-3 p-3 text-sm hover:bg-muted">
-            <span className="min-w-0 truncate font-medium">{d.name || "Untitled deal"}</span>
-            <span className="shrink-0 text-xs text-muted-foreground">{[d.stage, d.value != null ? formatMoney(d.value, d.currency) : null].filter(Boolean).join(" · ")}</span>
-          </Link>
-        </li>
-      ))}
-    </ul>
-  );
-}
+import { RecordConversationsTab } from "@/components/g8/inbox/record-conversations-tab";
+import { AddToListButton } from "@/components/g8/lists/add-to-list-button";
+import { RecordListsTab } from "@/components/g8/lists/record-lists-tab";
+import { AddToSequenceButton } from "@/components/g8/sequencer/add-to-sequence-button";
+import { RecordSequencesTab } from "@/components/g8/sequencer/record-sequences-tab";
+import { useRouter } from "next/navigation";
 
 export default function Page() {
+  const router = useRouter();
   return (
     <ContactsScreen
+      onOpenCompany={(id) => router.push(`/companies?id=${id}`)}
       renderRowActions={(c, { reload }) => <EnrichButton kind="person" lookup={{ email: c.work_email ?? undefined, linkedin_url: c.linkedin_url ?? undefined, first_name: c.first_name ?? undefined, last_name: c.last_name ?? undefined }} record={{ ...c }} onApplied={reload} label="Enrich" size="sm" variant="ghost" />}
-      renderBulkActions={({ ids, clear }) => <AddToSequence contactIds={ids} onEnrolled={clear} />}
+      renderBulkActions={({ ids, clear }) => (
+        <>
+          <AddToSequenceButton contactIds={ids} onEnrolled={clear} />
+          <AddToListButton contactIds={ids} onAdded={clear} />
+        </>
+      )}
       renderDetailActions={(c, { reload }) => (
         <>
           <EnrichButton kind="person" lookup={{ email: c.work_email ?? undefined, linkedin_url: c.linkedin_url ?? undefined, first_name: c.first_name ?? undefined, last_name: c.last_name ?? undefined }} record={{ ...c }} onApplied={reload} label="Enrich" />
-          <AddToSequence contactIds={[c.id]} />
+          <AddToSequenceButton contactIds={[c.id]} />
+          <AddToListButton contactIds={[c.id]} />
           {/* One call to this contact through the dialer; confirmed, and your softphone joins it. */}
           <CallContactButton contact={{ id: c.id, first_name: c.first_name, last_name: c.last_name, full_name: c.full_name, email: c.work_email, company: c.company_name, mobile_phone: c.mobile_phone, direct_phone: c.direct_phone }} />
         </>
       )}
-      extraDetailTabs={[{ id: "deals", label: "Deals", render: (c) => <LinkedDeals kind="contacts" id={c.id} /> }]}
+      extraDetailTabs={[
+        { id: "lists", label: "Lists", render: (c) => <RecordListsTab contactId={c.id} onOpenList={(id) => router.push(`/lists?id=${id}`)} /> },
+        { id: "sequences", label: "Sequences", render: (c) => <RecordSequencesTab contactId={c.id} onOpenSequence={(id) => router.push(`/sequences?id=${encodeURIComponent(id)}`)} /> },
+        { id: "meetings", label: "Meetings", render: (c) => <RecordMeetingsTab contactId={c.id} onOpenMeeting={(sel) => router.push(`/meetings?sel=${encodeURIComponent(sel)}`)} /> },
+        { id: "calls", label: "Calls", render: (c) => <RecordCallsTab contact={{ id: c.id, first_name: c.first_name, last_name: c.last_name, full_name: c.full_name, email: c.work_email, company: c.company_name, mobile_phone: c.mobile_phone, direct_phone: c.direct_phone }} onOpenCall={(room) => router.push(`/calls?id=${encodeURIComponent(room)}`)} /> },
+        { id: "deals", label: "Deals", render: (c) => <RecordDealsTab kind="contacts" id={c.id} onOpenDeal={(id) => router.push(`/deals?id=${encodeURIComponent(id)}`)} /> },
+        { id: "conversations", label: "Conversations", render: (c) => <RecordConversationsTab email={c.work_email} alsoEmails={[c.personal_emails]} onOpenThread={(sel) => router.push(`/inbox?id=${encodeURIComponent(sel)}`)} /> },
+        { id: "engagement", label: "Engagement", render: (c) => <RecordEngagementTab kind="contacts" id={c.id} /> },
+      ]}
     />
   );
 }

package/stacks/apollo/pages/deals.tsx.tmpl

@@ -0,0 +1,17 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { useRouter } from "next/navigation";
+import { DealsScreen } from "@/components/g8/deals/deals-screen";
+
+/** A deal opens its quotes, its contacts and (from a contact) their company. */
+export default function Page() {
+  const router = useRouter();
+  return (
+    <DealsScreen
+      onOpenContact={(id) => router.push(`/contacts?id=${id}`)}
+      onOpenCompany={(id) => router.push(`/companies?id=${id}`)}
+    />
+  );
+}

package/stacks/apollo/pages/inbox-contact.tsx.tmpl

@@ -0,0 +1,13 @@
+"use client";
+
+// Generated by `graph8-sdk create {{stackId}}`. The {{block}} block's {{component}} (source in {{blockDir}}), with the
+// other blocks of this app plugged into its slots. Edit freely: this file is yours.
+import { useRouter } from "next/navigation";
+import { ContactLookupLink } from "@/components/g8/crm/contact-lookup-link";
+import { InboxScreen } from "@/components/g8/inbox/inbox-screen";
+
+/** A conversation opens the sender when they are a contact in your CRM. */
+export default function Page() {
+  const router = useRouter();
+  return <InboxScreen renderDetailActions={(thread) => <ContactLookupLink email={thread.contact?.email} onOpen={(id) => router.push(`/contacts?id=${id}`)} />} />;
+}