@arbidocs/blocks 0.3.118 → 0.3.120

package/dist/record/index.cjs

@@ -0,0 +1,178 @@
+'use strict';
+
+var test = require('@playwright/test');
+
+// src/record/index.ts
+var DEFAULTS = {
+  displayFont: "ui-serif, Georgia, serif",
+  sansFont: "Inter, ui-sans-serif, system-ui, sans-serif",
+  cursor: { from: "rgba(31,111,235,.98)", to: "rgba(11,42,74,.92)" },
+  ripple: "rgba(11,42,74,.85)",
+  cover: { from: "#0b1622", mid: "#0e1b2c", to: "#1f6feb" },
+  accent: "#c9a24b",
+  ink: "#0e1b2d",
+  coverTitle: "#f4f6f8"
+};
+function createCinematic(config) {
+  const b = config.brand;
+  const skin = {
+    firmLabel: b.firmLabel,
+    displayFont: b.displayFont ?? DEFAULTS.displayFont,
+    sansFont: b.sansFont ?? DEFAULTS.sansFont,
+    cursorFrom: b.cursor?.from ?? DEFAULTS.cursor.from,
+    cursorTo: b.cursor?.to ?? DEFAULTS.cursor.to,
+    ripple: b.ripple ?? DEFAULTS.ripple,
+    coverFrom: b.cover?.from ?? DEFAULTS.cover.from,
+    coverMid: b.cover?.mid ?? DEFAULTS.cover.mid,
+    coverTo: b.cover?.to ?? DEFAULTS.cover.to,
+    accent: b.accent ?? DEFAULTS.accent,
+    ink: b.ink ?? DEFAULTS.ink,
+    coverTitle: b.coverTitle ?? DEFAULTS.coverTitle
+  };
+  const loginPath = config.loginPath ?? "/app/login";
+  const appUrlPattern = config.appUrlPattern ?? /\/app$/;
+  const ids = {
+    email: config.testIds?.email ?? "auth-email",
+    password: config.testIds?.password ?? "auth-password",
+    submit: config.testIds?.submit ?? "auth-login-submit"
+  };
+  const resolve = (page, t) => typeof t === "string" ? page.getByTestId(t) : t;
+  async function installStage(page) {
+    await page.addInitScript((s) => {
+      const boot = () => {
+        if (document.getElementById("__cine_cursor")) return;
+        const cursor = document.createElement("div");
+        cursor.id = "__cine_cursor";
+        cursor.style.cssText = `position:fixed;left:0;top:0;z-index:2147483647;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;transition:transform .09s ease-out;background:radial-gradient(circle at 35% 35%, ${s.cursorFrom}, ${s.cursorTo});box-shadow:0 0 0 3px rgba(255,255,255,.6),0 2px 10px rgba(0,0,0,.4);`;
+        document.body.appendChild(cursor);
+        window.addEventListener(
+          "mousemove",
+          (e) => {
+            cursor.style.transform = `translate(${e.clientX}px,${e.clientY}px)`;
+          },
+          true
+        );
+        window.addEventListener(
+          "mousedown",
+          (e) => {
+            const m = e;
+            const r = document.createElement("div");
+            r.style.cssText = `position:fixed;left:${m.clientX}px;top:${m.clientY}px;z-index:2147483646;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;pointer-events:none;border:2px solid ${s.ripple};animation:__cine_ripple .55s ease-out forwards;`;
+            document.body.appendChild(r);
+            setTimeout(() => r.remove(), 600);
+          },
+          true
+        );
+        const cap = document.createElement("div");
+        cap.id = "__cine_cap";
+        cap.style.cssText = `position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(8px);z-index:2147483646;max-width:72%;padding:13px 24px;border-radius:13px;font:500 17px/1.45 ${s.sansFont};color:#fff;letter-spacing:.01em;background:${s.ink}e0;backdrop-filter:blur(7px);box-shadow:0 10px 34px rgba(0,0,0,.4);text-align:center;opacity:0;transition:opacity .35s,transform .35s;`;
+        document.body.appendChild(cap);
+        const style = document.createElement("style");
+        style.textContent = "@keyframes __cine_ripple{to{width:46px;height:46px;margin:-23px 0 0 -23px;opacity:0}}";
+        document.head.appendChild(style);
+        window.__cine_cap = (t) => {
+          cap.textContent = t;
+          cap.style.opacity = t ? "1" : "0";
+          cap.style.transform = `translateX(-50%) translateY(${t ? 0 : 8}px)`;
+        };
+      };
+      if (document.body) boot();
+      else document.addEventListener("DOMContentLoaded", boot);
+    }, skin);
+  }
+  async function cover(page, { kicker, title, subtitle }, holdMs = 2600) {
+    await page.evaluate(
+      ({ kicker: kicker2, title: title2, subtitle: subtitle2, s }) => {
+        document.getElementById("__cine_cover")?.remove();
+        const el = document.createElement("div");
+        el.id = "__cine_cover";
+        el.style.cssText = `position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 8%;background:linear-gradient(135deg,${s.coverFrom} 0%,${s.coverMid} 48%,${s.coverTo} 165%);opacity:0;transition:opacity .5s ease;font-family:${s.sansFont};`;
+        el.innerHTML = `<div style="text-transform:uppercase;letter-spacing:.26em;font-size:13px;font-weight:600;color:${s.accent};margin-bottom:22px">${kicker2}</div><div style="font-family:${s.displayFont};font-weight:600;font-size:52px;line-height:1.08;letter-spacing:-.02em;color:${s.coverTitle};max-width:16ch">${title2}</div>` + (subtitle2 ? `<div style="margin-top:22px;font-size:19px;line-height:1.5;color:${s.coverTitle}b8;max-width:46ch">${subtitle2}</div>` : "") + `<div style="margin-top:44px;display:flex;align-items:center;gap:10px;color:${s.coverTitle}80;font-size:13px;letter-spacing:.02em"><span style="width:26px;height:1px;background:${s.accent}"></span>${s.firmLabel}</div>`;
+        document.body.appendChild(el);
+        requestAnimationFrame(() => el.style.opacity = "1");
+      },
+      { kicker, title, subtitle: subtitle ?? "", s: skin }
+    );
+    await page.waitForTimeout(holdMs);
+  }
+  async function uncover(page) {
+    await page.evaluate(() => {
+      const el = document.getElementById("__cine_cover");
+      if (!el) return;
+      el.style.opacity = "0";
+      setTimeout(() => el.remove(), 520);
+    });
+    await page.waitForTimeout(560);
+  }
+  async function caption(page, text, holdMs) {
+    await page.evaluate(
+      (t) => window.__cine_cap?.(t),
+      text
+    );
+    const hold = holdMs ?? Math.min(4200, 900 + text.length * 45);
+    await page.waitForTimeout(hold);
+  }
+  async function clearCaption(page) {
+    await page.evaluate(
+      () => window.__cine_cap?.("")
+    );
+  }
+  async function beat(page, ms = 650) {
+    await page.waitForTimeout(ms);
+  }
+  async function glideTo(page, target) {
+    const loc = resolve(page, target).first();
+    await loc.scrollIntoViewIfNeeded().catch(() => {
+    });
+    const box = await loc.boundingBox();
+    if (box) {
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2, { steps: 26 });
+      await page.waitForTimeout(180);
+    }
+    return loc;
+  }
+  async function click(page, target) {
+    const loc = await glideTo(page, target);
+    await loc.click();
+    await page.waitForTimeout(260);
+  }
+  async function type(page, target, text) {
+    const loc = await glideTo(page, target);
+    await loc.click();
+    await loc.fill("");
+    await loc.pressSequentially(text, { delay: 42 });
+    await page.waitForTimeout(240);
+  }
+  async function login(page, opts = {}) {
+    await page.goto(loginPath);
+    if (opts.show === false) {
+      await page.getByTestId(ids.email).fill(config.creds.email);
+      await page.getByTestId(ids.password).fill(config.creds.password);
+      await page.getByTestId(ids.submit).click();
+      await test.expect(page).toHaveURL(appUrlPattern, { timeout: 45e3 });
+      return;
+    }
+    await caption(page, opts.caption ?? `${b.firmLabel} \u2014 signing in.`, 1600);
+    await type(page, ids.email, config.creds.email);
+    await type(page, ids.password, config.creds.password);
+    await click(page, ids.submit);
+    await test.expect(page).toHaveURL(appUrlPattern, { timeout: 45e3 });
+    await beat(page, 800);
+  }
+  return {
+    installStage,
+    cover,
+    uncover,
+    caption,
+    clearCaption,
+    beat,
+    glideTo,
+    click,
+    type,
+    login
+  };
+}
+
+exports.createCinematic = createCinematic;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/record/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/record/index.ts"],"names":["kicker","title","subtitle","expect"],"mappings":"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","file":"index.cjs","sourcesContent":["/**\n * Cinematic recording harness — firm-agnostic.\n *\n * Turns a Playwright run into a narrated product demo: a visible cursor that\n * glides between targets, a click ripple, a caption bar that narrates each step,\n * full-screen chapter \"cover\" cards, and human-speed pacing. Every firm app gets\n * the same polished demo capability from one factory — brand colours, fonts,\n * credentials and the login flow arrive as config, so nothing here names a firm.\n *\n * Pair with a Playwright project that records video (see the firm's\n * `playwright.record.config.ts`: video on, a large viewport, some slowMo).\n *\n * Usage in a `*.record.ts` spec:\n *   const cine = createCinematic({ brand, creds })\n *   await cine.installStage(page)          // before the first navigation\n *   await cine.cover(page, { kicker, title, subtitle })\n *   await cine.login(page)\n *   await cine.uncover(page)\n *   await cine.caption(page, \"Opening the flagship matter…\")\n *   await cine.click(page, \"matters-row-…\")\n *\n * `@playwright/test` is a peer dependency — it is only imported by e2e specs, so\n * it never reaches an app bundle.\n */\nimport { type Page, type Locator, expect } from '@playwright/test'\n\n/** Brand skin for the on-screen chrome. All optional — sensible neutral defaults. */\nexport interface CinematicBrand {\n  /** Footer line on chapter cards, e.g. \"Meridian · AI-native counsel\". */\n  firmLabel: string\n  /** Serif display font for cover titles (CSS font-family value). */\n  displayFont?: string\n  /** Sans font for captions + cover body. */\n  sansFont?: string\n  /** Cursor dot radial-gradient stops. */\n  cursor?: { from: string; to: string }\n  /** Click-ripple ring colour. */\n  ripple?: string\n  /** Chapter-card background gradient stops. */\n  cover?: { from: string; mid: string; to: string }\n  /** Accent (kicker text + rule) on chapter cards. */\n  accent?: string\n  /** Caption bar background base colour. */\n  ink?: string\n  /** Cover title text colour. */\n  coverTitle?: string\n}\n\nexport interface CinematicCreds {\n  email: string\n  password: string\n}\n\nexport interface CinematicConfig {\n  brand: CinematicBrand\n  creds: CinematicCreds\n  /** Login route (default \"/app/login\"). */\n  loginPath?: string\n  /** URL the app lands on after auth (default /\\/app$/). */\n  appUrlPattern?: RegExp\n  /** Login form testids (defaults match the shared AppShell/login convention). */\n  testIds?: { email?: string; password?: string; submit?: string }\n}\n\nexport interface Cinematic {\n  installStage(page: Page): Promise<void>\n  cover(\n    page: Page,\n    opts: { kicker: string; title: string; subtitle?: string },\n    holdMs?: number\n  ): Promise<void>\n  uncover(page: Page): Promise<void>\n  caption(page: Page, text: string, holdMs?: number): Promise<void>\n  clearCaption(page: Page): Promise<void>\n  beat(page: Page, ms?: number): Promise<void>\n  glideTo(page: Page, target: string | Locator): Promise<Locator>\n  click(page: Page, target: string | Locator): Promise<void>\n  type(page: Page, target: string | Locator, text: string): Promise<void>\n  /** Sign in. `{ show: false }` authenticates fast + silent (no animation/caption). */\n  login(page: Page, opts?: { show?: boolean; caption?: string }): Promise<void>\n}\n\nconst DEFAULTS = {\n  displayFont: 'ui-serif, Georgia, serif',\n  sansFont: 'Inter, ui-sans-serif, system-ui, sans-serif',\n  cursor: { from: 'rgba(31,111,235,.98)', to: 'rgba(11,42,74,.92)' },\n  ripple: 'rgba(11,42,74,.85)',\n  cover: { from: '#0b1622', mid: '#0e1b2c', to: '#1f6feb' },\n  accent: '#c9a24b',\n  ink: '#0e1b2d',\n  coverTitle: '#f4f6f8',\n}\n\nexport function createCinematic(config: CinematicConfig): Cinematic {\n  const b = config.brand\n  const skin = {\n    firmLabel: b.firmLabel,\n    displayFont: b.displayFont ?? DEFAULTS.displayFont,\n    sansFont: b.sansFont ?? DEFAULTS.sansFont,\n    cursorFrom: b.cursor?.from ?? DEFAULTS.cursor.from,\n    cursorTo: b.cursor?.to ?? DEFAULTS.cursor.to,\n    ripple: b.ripple ?? DEFAULTS.ripple,\n    coverFrom: b.cover?.from ?? DEFAULTS.cover.from,\n    coverMid: b.cover?.mid ?? DEFAULTS.cover.mid,\n    coverTo: b.cover?.to ?? DEFAULTS.cover.to,\n    accent: b.accent ?? DEFAULTS.accent,\n    ink: b.ink ?? DEFAULTS.ink,\n    coverTitle: b.coverTitle ?? DEFAULTS.coverTitle,\n  }\n  const loginPath = config.loginPath ?? '/app/login'\n  const appUrlPattern = config.appUrlPattern ?? /\\/app$/\n  const ids = {\n    email: config.testIds?.email ?? 'auth-email',\n    password: config.testIds?.password ?? 'auth-password',\n    submit: config.testIds?.submit ?? 'auth-login-submit',\n  }\n\n  const resolve = (page: Page, t: string | Locator): Locator =>\n    typeof t === 'string' ? page.getByTestId(t) : t\n\n  async function installStage(page: Page): Promise<void> {\n    await page.addInitScript((s: typeof skin) => {\n      const boot = () => {\n        if (document.getElementById('__cine_cursor')) return\n\n        const cursor = document.createElement('div')\n        cursor.id = '__cine_cursor'\n        cursor.style.cssText =\n          'position:fixed;left:0;top:0;z-index:2147483647;width:22px;height:22px;' +\n          'margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;' +\n          'transition:transform .09s ease-out;' +\n          `background:radial-gradient(circle at 35% 35%, ${s.cursorFrom}, ${s.cursorTo});` +\n          'box-shadow:0 0 0 3px rgba(255,255,255,.6),0 2px 10px rgba(0,0,0,.4);'\n        document.body.appendChild(cursor)\n\n        window.addEventListener(\n          'mousemove',\n          (e) => {\n            cursor.style.transform = `translate(${(e as MouseEvent).clientX}px,${(e as MouseEvent).clientY}px)`\n          },\n          true\n        )\n        window.addEventListener(\n          'mousedown',\n          (e) => {\n            const m = e as MouseEvent\n            const r = document.createElement('div')\n            r.style.cssText =\n              `position:fixed;left:${m.clientX}px;top:${m.clientY}px;z-index:2147483646;` +\n              'width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;pointer-events:none;' +\n              `border:2px solid ${s.ripple};animation:__cine_ripple .55s ease-out forwards;`\n            document.body.appendChild(r)\n            setTimeout(() => r.remove(), 600)\n          },\n          true\n        )\n\n        const cap = document.createElement('div')\n        cap.id = '__cine_cap'\n        cap.style.cssText =\n          'position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(8px);' +\n          'z-index:2147483646;max-width:72%;padding:13px 24px;border-radius:13px;' +\n          `font:500 17px/1.45 ${s.sansFont};color:#fff;letter-spacing:.01em;` +\n          `background:${s.ink}e0;backdrop-filter:blur(7px);` +\n          'box-shadow:0 10px 34px rgba(0,0,0,.4);text-align:center;opacity:0;transition:opacity .35s,transform .35s;'\n        document.body.appendChild(cap)\n\n        const style = document.createElement('style')\n        style.textContent =\n          '@keyframes __cine_ripple{to{width:46px;height:46px;margin:-23px 0 0 -23px;opacity:0}}'\n        document.head.appendChild(style)\n\n        ;(window as unknown as { __cine_cap: (t: string) => void }).__cine_cap = (t: string) => {\n          cap.textContent = t\n          cap.style.opacity = t ? '1' : '0'\n          cap.style.transform = `translateX(-50%) translateY(${t ? 0 : 8}px)`\n        }\n      }\n      if (document.body) boot()\n      else document.addEventListener('DOMContentLoaded', boot)\n    }, skin)\n  }\n\n  async function cover(\n    page: Page,\n    { kicker, title, subtitle }: { kicker: string; title: string; subtitle?: string },\n    holdMs = 2600\n  ): Promise<void> {\n    await page.evaluate(\n      ({ kicker, title, subtitle, s }) => {\n        document.getElementById('__cine_cover')?.remove()\n        const el = document.createElement('div')\n        el.id = '__cine_cover'\n        el.style.cssText =\n          'position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;' +\n          'align-items:center;justify-content:center;text-align:center;padding:0 8%;' +\n          `background:linear-gradient(135deg,${s.coverFrom} 0%,${s.coverMid} 48%,${s.coverTo} 165%);` +\n          `opacity:0;transition:opacity .5s ease;font-family:${s.sansFont};`\n        el.innerHTML =\n          `<div style=\"text-transform:uppercase;letter-spacing:.26em;font-size:13px;font-weight:600;color:${s.accent};margin-bottom:22px\">${kicker}</div>` +\n          `<div style=\"font-family:${s.displayFont};font-weight:600;font-size:52px;line-height:1.08;letter-spacing:-.02em;color:${s.coverTitle};max-width:16ch\">${title}</div>` +\n          (subtitle\n            ? `<div style=\"margin-top:22px;font-size:19px;line-height:1.5;color:${s.coverTitle}b8;max-width:46ch\">${subtitle}</div>`\n            : '') +\n          `<div style=\"margin-top:44px;display:flex;align-items:center;gap:10px;color:${s.coverTitle}80;font-size:13px;letter-spacing:.02em\">` +\n          `<span style=\"width:26px;height:1px;background:${s.accent}\"></span>${s.firmLabel}</div>`\n        document.body.appendChild(el)\n        requestAnimationFrame(() => (el.style.opacity = '1'))\n      },\n      { kicker, title, subtitle: subtitle ?? '', s: skin }\n    )\n    await page.waitForTimeout(holdMs)\n  }\n\n  async function uncover(page: Page): Promise<void> {\n    await page.evaluate(() => {\n      const el = document.getElementById('__cine_cover')\n      if (!el) return\n      el.style.opacity = '0'\n      setTimeout(() => el.remove(), 520)\n    })\n    await page.waitForTimeout(560)\n  }\n\n  async function caption(page: Page, text: string, holdMs?: number): Promise<void> {\n    await page.evaluate(\n      (t) => (window as unknown as { __cine_cap?: (s: string) => void }).__cine_cap?.(t),\n      text\n    )\n    const hold = holdMs ?? Math.min(4200, 900 + text.length * 45)\n    await page.waitForTimeout(hold)\n  }\n\n  async function clearCaption(page: Page): Promise<void> {\n    await page.evaluate(() =>\n      (window as unknown as { __cine_cap?: (s: string) => void }).__cine_cap?.('')\n    )\n  }\n\n  async function beat(page: Page, ms = 650): Promise<void> {\n    await page.waitForTimeout(ms)\n  }\n\n  async function glideTo(page: Page, target: string | Locator): Promise<Locator> {\n    const loc = resolve(page, target).first()\n    await loc.scrollIntoViewIfNeeded().catch(() => {})\n    const box = await loc.boundingBox()\n    if (box) {\n      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2, { steps: 26 })\n      await page.waitForTimeout(180)\n    }\n    return loc\n  }\n\n  async function click(page: Page, target: string | Locator): Promise<void> {\n    const loc = await glideTo(page, target)\n    await loc.click()\n    await page.waitForTimeout(260)\n  }\n\n  async function type(page: Page, target: string | Locator, text: string): Promise<void> {\n    const loc = await glideTo(page, target)\n    await loc.click()\n    await loc.fill('')\n    await loc.pressSequentially(text, { delay: 42 })\n    await page.waitForTimeout(240)\n  }\n\n  async function login(page: Page, opts: { show?: boolean; caption?: string } = {}): Promise<void> {\n    await page.goto(loginPath)\n    if (opts.show === false) {\n      await page.getByTestId(ids.email).fill(config.creds.email)\n      await page.getByTestId(ids.password).fill(config.creds.password)\n      await page.getByTestId(ids.submit).click()\n      await expect(page).toHaveURL(appUrlPattern, { timeout: 45_000 })\n      return\n    }\n    await caption(page, opts.caption ?? `${b.firmLabel} — signing in.`, 1600)\n    await type(page, ids.email, config.creds.email)\n    await type(page, ids.password, config.creds.password)\n    await click(page, ids.submit)\n    await expect(page).toHaveURL(appUrlPattern, { timeout: 45_000 })\n    await beat(page, 800)\n  }\n\n  return {\n    installStage,\n    cover,\n    uncover,\n    caption,\n    clearCaption,\n    beat,\n    glideTo,\n    click,\n    type,\n    login,\n  }\n}\n"]}

package/dist/record/index.d.cts

@@ -0,0 +1,96 @@
+import { Page, Locator } from '@playwright/test';
+
+/**
+ * Cinematic recording harness — firm-agnostic.
+ *
+ * Turns a Playwright run into a narrated product demo: a visible cursor that
+ * glides between targets, a click ripple, a caption bar that narrates each step,
+ * full-screen chapter "cover" cards, and human-speed pacing. Every firm app gets
+ * the same polished demo capability from one factory — brand colours, fonts,
+ * credentials and the login flow arrive as config, so nothing here names a firm.
+ *
+ * Pair with a Playwright project that records video (see the firm's
+ * `playwright.record.config.ts`: video on, a large viewport, some slowMo).
+ *
+ * Usage in a `*.record.ts` spec:
+ *   const cine = createCinematic({ brand, creds })
+ *   await cine.installStage(page)          // before the first navigation
+ *   await cine.cover(page, { kicker, title, subtitle })
+ *   await cine.login(page)
+ *   await cine.uncover(page)
+ *   await cine.caption(page, "Opening the flagship matter…")
+ *   await cine.click(page, "matters-row-…")
+ *
+ * `@playwright/test` is a peer dependency — it is only imported by e2e specs, so
+ * it never reaches an app bundle.
+ */
+
+/** Brand skin for the on-screen chrome. All optional — sensible neutral defaults. */
+interface CinematicBrand {
+    /** Footer line on chapter cards, e.g. "Meridian · AI-native counsel". */
+    firmLabel: string;
+    /** Serif display font for cover titles (CSS font-family value). */
+    displayFont?: string;
+    /** Sans font for captions + cover body. */
+    sansFont?: string;
+    /** Cursor dot radial-gradient stops. */
+    cursor?: {
+        from: string;
+        to: string;
+    };
+    /** Click-ripple ring colour. */
+    ripple?: string;
+    /** Chapter-card background gradient stops. */
+    cover?: {
+        from: string;
+        mid: string;
+        to: string;
+    };
+    /** Accent (kicker text + rule) on chapter cards. */
+    accent?: string;
+    /** Caption bar background base colour. */
+    ink?: string;
+    /** Cover title text colour. */
+    coverTitle?: string;
+}
+interface CinematicCreds {
+    email: string;
+    password: string;
+}
+interface CinematicConfig {
+    brand: CinematicBrand;
+    creds: CinematicCreds;
+    /** Login route (default "/app/login"). */
+    loginPath?: string;
+    /** URL the app lands on after auth (default /\/app$/). */
+    appUrlPattern?: RegExp;
+    /** Login form testids (defaults match the shared AppShell/login convention). */
+    testIds?: {
+        email?: string;
+        password?: string;
+        submit?: string;
+    };
+}
+interface Cinematic {
+    installStage(page: Page): Promise<void>;
+    cover(page: Page, opts: {
+        kicker: string;
+        title: string;
+        subtitle?: string;
+    }, holdMs?: number): Promise<void>;
+    uncover(page: Page): Promise<void>;
+    caption(page: Page, text: string, holdMs?: number): Promise<void>;
+    clearCaption(page: Page): Promise<void>;
+    beat(page: Page, ms?: number): Promise<void>;
+    glideTo(page: Page, target: string | Locator): Promise<Locator>;
+    click(page: Page, target: string | Locator): Promise<void>;
+    type(page: Page, target: string | Locator, text: string): Promise<void>;
+    /** Sign in. `{ show: false }` authenticates fast + silent (no animation/caption). */
+    login(page: Page, opts?: {
+        show?: boolean;
+        caption?: string;
+    }): Promise<void>;
+}
+declare function createCinematic(config: CinematicConfig): Cinematic;
+
+export { type Cinematic, type CinematicBrand, type CinematicConfig, type CinematicCreds, createCinematic };

package/dist/record/index.d.ts

@@ -0,0 +1,96 @@
+import { Page, Locator } from '@playwright/test';
+
+/**
+ * Cinematic recording harness — firm-agnostic.
+ *
+ * Turns a Playwright run into a narrated product demo: a visible cursor that
+ * glides between targets, a click ripple, a caption bar that narrates each step,
+ * full-screen chapter "cover" cards, and human-speed pacing. Every firm app gets
+ * the same polished demo capability from one factory — brand colours, fonts,
+ * credentials and the login flow arrive as config, so nothing here names a firm.
+ *
+ * Pair with a Playwright project that records video (see the firm's
+ * `playwright.record.config.ts`: video on, a large viewport, some slowMo).
+ *
+ * Usage in a `*.record.ts` spec:
+ *   const cine = createCinematic({ brand, creds })
+ *   await cine.installStage(page)          // before the first navigation
+ *   await cine.cover(page, { kicker, title, subtitle })
+ *   await cine.login(page)
+ *   await cine.uncover(page)
+ *   await cine.caption(page, "Opening the flagship matter…")
+ *   await cine.click(page, "matters-row-…")
+ *
+ * `@playwright/test` is a peer dependency — it is only imported by e2e specs, so
+ * it never reaches an app bundle.
+ */
+
+/** Brand skin for the on-screen chrome. All optional — sensible neutral defaults. */
+interface CinematicBrand {
+    /** Footer line on chapter cards, e.g. "Meridian · AI-native counsel". */
+    firmLabel: string;
+    /** Serif display font for cover titles (CSS font-family value). */
+    displayFont?: string;
+    /** Sans font for captions + cover body. */
+    sansFont?: string;
+    /** Cursor dot radial-gradient stops. */
+    cursor?: {
+        from: string;
+        to: string;
+    };
+    /** Click-ripple ring colour. */
+    ripple?: string;
+    /** Chapter-card background gradient stops. */
+    cover?: {
+        from: string;
+        mid: string;
+        to: string;
+    };
+    /** Accent (kicker text + rule) on chapter cards. */
+    accent?: string;
+    /** Caption bar background base colour. */
+    ink?: string;
+    /** Cover title text colour. */
+    coverTitle?: string;
+}
+interface CinematicCreds {
+    email: string;
+    password: string;
+}
+interface CinematicConfig {
+    brand: CinematicBrand;
+    creds: CinematicCreds;
+    /** Login route (default "/app/login"). */
+    loginPath?: string;
+    /** URL the app lands on after auth (default /\/app$/). */
+    appUrlPattern?: RegExp;
+    /** Login form testids (defaults match the shared AppShell/login convention). */
+    testIds?: {
+        email?: string;
+        password?: string;
+        submit?: string;
+    };
+}
+interface Cinematic {
+    installStage(page: Page): Promise<void>;
+    cover(page: Page, opts: {
+        kicker: string;
+        title: string;
+        subtitle?: string;
+    }, holdMs?: number): Promise<void>;
+    uncover(page: Page): Promise<void>;
+    caption(page: Page, text: string, holdMs?: number): Promise<void>;
+    clearCaption(page: Page): Promise<void>;
+    beat(page: Page, ms?: number): Promise<void>;
+    glideTo(page: Page, target: string | Locator): Promise<Locator>;
+    click(page: Page, target: string | Locator): Promise<void>;
+    type(page: Page, target: string | Locator, text: string): Promise<void>;
+    /** Sign in. `{ show: false }` authenticates fast + silent (no animation/caption). */
+    login(page: Page, opts?: {
+        show?: boolean;
+        caption?: string;
+    }): Promise<void>;
+}
+declare function createCinematic(config: CinematicConfig): Cinematic;
+
+export { type Cinematic, type CinematicBrand, type CinematicConfig, type CinematicCreds, createCinematic };

package/dist/record/index.js

@@ -0,0 +1,176 @@
+import { expect } from '@playwright/test';
+
+// src/record/index.ts
+var DEFAULTS = {
+  displayFont: "ui-serif, Georgia, serif",
+  sansFont: "Inter, ui-sans-serif, system-ui, sans-serif",
+  cursor: { from: "rgba(31,111,235,.98)", to: "rgba(11,42,74,.92)" },
+  ripple: "rgba(11,42,74,.85)",
+  cover: { from: "#0b1622", mid: "#0e1b2c", to: "#1f6feb" },
+  accent: "#c9a24b",
+  ink: "#0e1b2d",
+  coverTitle: "#f4f6f8"
+};
+function createCinematic(config) {
+  const b = config.brand;
+  const skin = {
+    firmLabel: b.firmLabel,
+    displayFont: b.displayFont ?? DEFAULTS.displayFont,
+    sansFont: b.sansFont ?? DEFAULTS.sansFont,
+    cursorFrom: b.cursor?.from ?? DEFAULTS.cursor.from,
+    cursorTo: b.cursor?.to ?? DEFAULTS.cursor.to,
+    ripple: b.ripple ?? DEFAULTS.ripple,
+    coverFrom: b.cover?.from ?? DEFAULTS.cover.from,
+    coverMid: b.cover?.mid ?? DEFAULTS.cover.mid,
+    coverTo: b.cover?.to ?? DEFAULTS.cover.to,
+    accent: b.accent ?? DEFAULTS.accent,
+    ink: b.ink ?? DEFAULTS.ink,
+    coverTitle: b.coverTitle ?? DEFAULTS.coverTitle
+  };
+  const loginPath = config.loginPath ?? "/app/login";
+  const appUrlPattern = config.appUrlPattern ?? /\/app$/;
+  const ids = {
+    email: config.testIds?.email ?? "auth-email",
+    password: config.testIds?.password ?? "auth-password",
+    submit: config.testIds?.submit ?? "auth-login-submit"
+  };
+  const resolve = (page, t) => typeof t === "string" ? page.getByTestId(t) : t;
+  async function installStage(page) {
+    await page.addInitScript((s) => {
+      const boot = () => {
+        if (document.getElementById("__cine_cursor")) return;
+        const cursor = document.createElement("div");
+        cursor.id = "__cine_cursor";
+        cursor.style.cssText = `position:fixed;left:0;top:0;z-index:2147483647;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;transition:transform .09s ease-out;background:radial-gradient(circle at 35% 35%, ${s.cursorFrom}, ${s.cursorTo});box-shadow:0 0 0 3px rgba(255,255,255,.6),0 2px 10px rgba(0,0,0,.4);`;
+        document.body.appendChild(cursor);
+        window.addEventListener(
+          "mousemove",
+          (e) => {
+            cursor.style.transform = `translate(${e.clientX}px,${e.clientY}px)`;
+          },
+          true
+        );
+        window.addEventListener(
+          "mousedown",
+          (e) => {
+            const m = e;
+            const r = document.createElement("div");
+            r.style.cssText = `position:fixed;left:${m.clientX}px;top:${m.clientY}px;z-index:2147483646;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;pointer-events:none;border:2px solid ${s.ripple};animation:__cine_ripple .55s ease-out forwards;`;
+            document.body.appendChild(r);
+            setTimeout(() => r.remove(), 600);
+          },
+          true
+        );
+        const cap = document.createElement("div");
+        cap.id = "__cine_cap";
+        cap.style.cssText = `position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(8px);z-index:2147483646;max-width:72%;padding:13px 24px;border-radius:13px;font:500 17px/1.45 ${s.sansFont};color:#fff;letter-spacing:.01em;background:${s.ink}e0;backdrop-filter:blur(7px);box-shadow:0 10px 34px rgba(0,0,0,.4);text-align:center;opacity:0;transition:opacity .35s,transform .35s;`;
+        document.body.appendChild(cap);
+        const style = document.createElement("style");
+        style.textContent = "@keyframes __cine_ripple{to{width:46px;height:46px;margin:-23px 0 0 -23px;opacity:0}}";
+        document.head.appendChild(style);
+        window.__cine_cap = (t) => {
+          cap.textContent = t;
+          cap.style.opacity = t ? "1" : "0";
+          cap.style.transform = `translateX(-50%) translateY(${t ? 0 : 8}px)`;
+        };
+      };
+      if (document.body) boot();
+      else document.addEventListener("DOMContentLoaded", boot);
+    }, skin);
+  }
+  async function cover(page, { kicker, title, subtitle }, holdMs = 2600) {
+    await page.evaluate(
+      ({ kicker: kicker2, title: title2, subtitle: subtitle2, s }) => {
+        document.getElementById("__cine_cover")?.remove();
+        const el = document.createElement("div");
+        el.id = "__cine_cover";
+        el.style.cssText = `position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 8%;background:linear-gradient(135deg,${s.coverFrom} 0%,${s.coverMid} 48%,${s.coverTo} 165%);opacity:0;transition:opacity .5s ease;font-family:${s.sansFont};`;
+        el.innerHTML = `<div style="text-transform:uppercase;letter-spacing:.26em;font-size:13px;font-weight:600;color:${s.accent};margin-bottom:22px">${kicker2}</div><div style="font-family:${s.displayFont};font-weight:600;font-size:52px;line-height:1.08;letter-spacing:-.02em;color:${s.coverTitle};max-width:16ch">${title2}</div>` + (subtitle2 ? `<div style="margin-top:22px;font-size:19px;line-height:1.5;color:${s.coverTitle}b8;max-width:46ch">${subtitle2}</div>` : "") + `<div style="margin-top:44px;display:flex;align-items:center;gap:10px;color:${s.coverTitle}80;font-size:13px;letter-spacing:.02em"><span style="width:26px;height:1px;background:${s.accent}"></span>${s.firmLabel}</div>`;
+        document.body.appendChild(el);
+        requestAnimationFrame(() => el.style.opacity = "1");
+      },
+      { kicker, title, subtitle: subtitle ?? "", s: skin }
+    );
+    await page.waitForTimeout(holdMs);
+  }
+  async function uncover(page) {
+    await page.evaluate(() => {
+      const el = document.getElementById("__cine_cover");
+      if (!el) return;
+      el.style.opacity = "0";
+      setTimeout(() => el.remove(), 520);
+    });
+    await page.waitForTimeout(560);
+  }
+  async function caption(page, text, holdMs) {
+    await page.evaluate(
+      (t) => window.__cine_cap?.(t),
+      text
+    );
+    const hold = holdMs ?? Math.min(4200, 900 + text.length * 45);
+    await page.waitForTimeout(hold);
+  }
+  async function clearCaption(page) {
+    await page.evaluate(
+      () => window.__cine_cap?.("")
+    );
+  }
+  async function beat(page, ms = 650) {
+    await page.waitForTimeout(ms);
+  }
+  async function glideTo(page, target) {
+    const loc = resolve(page, target).first();
+    await loc.scrollIntoViewIfNeeded().catch(() => {
+    });
+    const box = await loc.boundingBox();
+    if (box) {
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2, { steps: 26 });
+      await page.waitForTimeout(180);
+    }
+    return loc;
+  }
+  async function click(page, target) {
+    const loc = await glideTo(page, target);
+    await loc.click();
+    await page.waitForTimeout(260);
+  }
+  async function type(page, target, text) {
+    const loc = await glideTo(page, target);
+    await loc.click();
+    await loc.fill("");
+    await loc.pressSequentially(text, { delay: 42 });
+    await page.waitForTimeout(240);
+  }
+  async function login(page, opts = {}) {
+    await page.goto(loginPath);
+    if (opts.show === false) {
+      await page.getByTestId(ids.email).fill(config.creds.email);
+      await page.getByTestId(ids.password).fill(config.creds.password);
+      await page.getByTestId(ids.submit).click();
+      await expect(page).toHaveURL(appUrlPattern, { timeout: 45e3 });
+      return;
+    }
+    await caption(page, opts.caption ?? `${b.firmLabel} \u2014 signing in.`, 1600);
+    await type(page, ids.email, config.creds.email);
+    await type(page, ids.password, config.creds.password);
+    await click(page, ids.submit);
+    await expect(page).toHaveURL(appUrlPattern, { timeout: 45e3 });
+    await beat(page, 800);
+  }
+  return {
+    installStage,
+    cover,
+    uncover,
+    caption,
+    clearCaption,
+    beat,
+    glideTo,
+    click,
+    type,
+    login
+  };
+}
+
+export { createCinematic };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/record/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/record/index.ts"],"names":["kicker","title","subtitle"],"mappings":";;;AAkFA,IAAM,QAAA,GAAW;AAAA,EACf,WAAA,EAAa,0BAAA;AAAA,EACb,QAAA,EAAU,6CAAA;AAAA,EACV,MAAA,EAAQ,EAAE,IAAA,EAAM,sBAAA,EAAwB,IAAI,oBAAA,EAAqB;AAAA,EACjE,MAAA,EAAQ,oBAAA;AAAA,EACR,OAAO,EAAE,IAAA,EAAM,WAAW,GAAA,EAAK,SAAA,EAAW,IAAI,SAAA,EAAU;AAAA,EACxD,MAAA,EAAQ,SAAA;AAAA,EACR,GAAA,EAAK,SAAA;AAAA,EACL,UAAA,EAAY;AACd,CAAA;AAEO,SAAS,gBAAgB,MAAA,EAAoC;AAClE,EAAA,MAAM,IAAI,MAAA,CAAO,KAAA;AACjB,EAAA,MAAM,IAAA,GAAO;AAAA,IACX,WAAW,CAAA,CAAE,SAAA;AAAA,IACb,WAAA,EAAa,CAAA,CAAE,WAAA,IAAe,QAAA,CAAS,WAAA;AAAA,IACvC,QAAA,EAAU,CAAA,CAAE,QAAA,IAAY,QAAA,CAAS,QAAA;AAAA,IACjC,UAAA,EAAY,CAAA,CAAE,MAAA,EAAQ,IAAA,IAAQ,SAAS,MAAA,CAAO,IAAA;AAAA,IAC9C,QAAA,EAAU,CAAA,CAAE,MAAA,EAAQ,EAAA,IAAM,SAAS,MAAA,CAAO,EAAA;AAAA,IAC1C,MAAA,EAAQ,CAAA,CAAE,MAAA,IAAU,QAAA,CAAS,MAAA;AAAA,IAC7B,SAAA,EAAW,CAAA,CAAE,KAAA,EAAO,IAAA,IAAQ,SAAS,KAAA,CAAM,IAAA;AAAA,IAC3C,QAAA,EAAU,CAAA,CAAE,KAAA,EAAO,GAAA,IAAO,SAAS,KAAA,CAAM,GAAA;AAAA,IACzC,OAAA,EAAS,CAAA,CAAE,KAAA,EAAO,EAAA,IAAM,SAAS,KAAA,CAAM,EAAA;AAAA,IACvC,MAAA,EAAQ,CAAA,CAAE,MAAA,IAAU,QAAA,CAAS,MAAA;AAAA,IAC7B,GAAA,EAAK,CAAA,CAAE,GAAA,IAAO,QAAA,CAAS,GAAA;AAAA,IACvB,UAAA,EAAY,CAAA,CAAE,UAAA,IAAc,QAAA,CAAS;AAAA,GACvC;AACA,EAAA,MAAM,SAAA,GAAY,OAAO,SAAA,IAAa,YAAA;AACtC,EAAA,MAAM,aAAA,GAAgB,OAAO,aAAA,IAAiB,QAAA;AAC9C,EAAA,MAAM,GAAA,GAAM;AAAA,IACV,KAAA,EAAO,MAAA,CAAO,OAAA,EAAS,KAAA,IAAS,YAAA;AAAA,IAChC,QAAA,EAAU,MAAA,CAAO,OAAA,EAAS,QAAA,IAAY,eAAA;AAAA,IACtC,MAAA,EAAQ,MAAA,CAAO,OAAA,EAAS,MAAA,IAAU;AAAA,GACpC;AAEA,EAAA,MAAM,OAAA,GAAU,CAAC,IAAA,EAAY,CAAA,KAC3B,OAAO,MAAM,QAAA,GAAW,IAAA,CAAK,WAAA,CAAY,CAAC,CAAA,GAAI,CAAA;AAEhD,EAAA,eAAe,aAAa,IAAA,EAA2B;AACrD,IAAA,MAAM,IAAA,CAAK,aAAA,CAAc,CAAC,CAAA,KAAmB;AAC3C,MAAA,MAAM,OAAO,MAAM;AACjB,QAAA,IAAI,QAAA,CAAS,cAAA,CAAe,eAAe,CAAA,EAAG;AAE9C,QAAA,MAAM,MAAA,GAAS,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AAC3C,QAAA,MAAA,CAAO,EAAA,GAAK,eAAA;AACZ,QAAA,MAAA,CAAO,MAAM,OAAA,GACX,CAAA,oNAAA,EAGiD,EAAE,UAAU,CAAA,EAAA,EAAK,EAAE,QAAQ,CAAA,sEAAA,CAAA;AAE9E,QAAA,QAAA,CAAS,IAAA,CAAK,YAAY,MAAM,CAAA;AAEhC,QAAA,MAAA,CAAO,gBAAA;AAAA,UACL,WAAA;AAAA,UACA,CAAC,CAAA,KAAM;AACL,YAAA,MAAA,CAAO,MAAM,SAAA,GAAY,CAAA,UAAA,EAAc,EAAiB,OAAO,CAAA,GAAA,EAAO,EAAiB,OAAO,CAAA,GAAA,CAAA;AAAA,UAChG,CAAA;AAAA,UACA;AAAA,SACF;AACA,QAAA,MAAA,CAAO,gBAAA;AAAA,UACL,WAAA;AAAA,UACA,CAAC,CAAA,KAAM;AACL,YAAA,MAAM,CAAA,GAAI,CAAA;AACV,YAAA,MAAM,CAAA,GAAI,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AACtC,YAAA,CAAA,CAAE,KAAA,CAAM,OAAA,GACN,CAAA,oBAAA,EAAuB,CAAA,CAAE,OAAO,UAAU,CAAA,CAAE,OAAO,CAAA,yHAAA,EAE/B,CAAA,CAAE,MAAM,CAAA,gDAAA,CAAA;AAC9B,YAAA,QAAA,CAAS,IAAA,CAAK,YAAY,CAAC,CAAA;AAC3B,YAAA,UAAA,CAAW,MAAM,CAAA,CAAE,MAAA,EAAO,EAAG,GAAG,CAAA;AAAA,UAClC,CAAA;AAAA,UACA;AAAA,SACF;AAEA,QAAA,MAAM,GAAA,GAAM,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AACxC,QAAA,GAAA,CAAI,EAAA,GAAK,YAAA;AACT,QAAA,GAAA,CAAI,MAAM,OAAA,GACR,CAAA,wKAAA,EAEsB,EAAE,QAAQ,CAAA,4CAAA,EAClB,EAAE,GAAG,CAAA,sIAAA,CAAA;AAErB,QAAA,QAAA,CAAS,IAAA,CAAK,YAAY,GAAG,CAAA;AAE7B,QAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAC5C,QAAA,KAAA,CAAM,WAAA,GACJ,uFAAA;AACF,QAAA,QAAA,CAAS,IAAA,CAAK,YAAY,KAAK,CAAA;AAE9B,QAAC,MAAA,CAA0D,UAAA,GAAa,CAAC,CAAA,KAAc;AACtF,UAAA,GAAA,CAAI,WAAA,GAAc,CAAA;AAClB,UAAA,GAAA,CAAI,KAAA,CAAM,OAAA,GAAU,CAAA,GAAI,GAAA,GAAM,GAAA;AAC9B,UAAA,GAAA,CAAI,KAAA,CAAM,SAAA,GAAY,CAAA,4BAAA,EAA+B,CAAA,GAAI,IAAI,CAAC,CAAA,GAAA,CAAA;AAAA,QAChE,CAAA;AAAA,MACF,CAAA;AACA,MAAA,IAAI,QAAA,CAAS,MAAM,IAAA,EAAK;AAAA,WACnB,QAAA,CAAS,gBAAA,CAAiB,kBAAA,EAAoB,IAAI,CAAA;AAAA,IACzD,GAAG,IAAI,CAAA;AAAA,EACT;AAEA,EAAA,eAAe,KAAA,CACb,MACA,EAAE,MAAA,EAAQ,OAAO,QAAA,EAAS,EAC1B,SAAS,IAAA,EACM;AACf,IAAA,MAAM,IAAA,CAAK,QAAA;AAAA,MACT,CAAC,EAAE,MAAA,EAAAA,OAAAA,EAAQ,OAAAC,MAAAA,EAAO,QAAA,EAAAC,SAAAA,EAAU,CAAA,EAAE,KAAM;AAClC,QAAA,QAAA,CAAS,cAAA,CAAe,cAAc,CAAA,EAAG,MAAA,EAAO;AAChD,QAAA,MAAM,EAAA,GAAK,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AACvC,QAAA,EAAA,CAAG,EAAA,GAAK,cAAA;AACR,QAAA,EAAA,CAAG,KAAA,CAAM,OAAA,GACP,CAAA,wLAAA,EAEqC,CAAA,CAAE,SAAS,CAAA,IAAA,EAAO,CAAA,CAAE,QAAQ,CAAA,KAAA,EAAQ,CAAA,CAAE,OAAO,CAAA,yDAAA,EAC7B,EAAE,QAAQ,CAAA,CAAA,CAAA;AACjE,QAAA,EAAA,CAAG,SAAA,GACD,CAAA,+FAAA,EAAkG,CAAA,CAAE,MAAM,CAAA,qBAAA,EAAwBF,OAAM,CAAA,8BAAA,EAC7G,CAAA,CAAE,WAAW,CAAA,6EAAA,EAAgF,CAAA,CAAE,UAAU,oBAAoBC,MAAK,CAAA,MAAA,CAAA,IAC5JC,SAAAA,GACG,CAAA,iEAAA,EAAoE,CAAA,CAAE,UAAU,CAAA,mBAAA,EAAsBA,SAAQ,WAC9G,EAAA,CAAA,GACJ,CAAA,2EAAA,EAA8E,CAAA,CAAE,UAAU,CAAA,sFAAA,EACzC,CAAA,CAAE,MAAM,CAAA,SAAA,EAAY,EAAE,SAAS,CAAA,MAAA,CAAA;AAClF,QAAA,QAAA,CAAS,IAAA,CAAK,YAAY,EAAE,CAAA;AAC5B,QAAA,qBAAA,CAAsB,MAAO,EAAA,CAAG,KAAA,CAAM,OAAA,GAAU,GAAI,CAAA;AAAA,MACtD,CAAA;AAAA,MACA,EAAE,MAAA,EAAQ,KAAA,EAAO,UAAU,QAAA,IAAY,EAAA,EAAI,GAAG,IAAA;AAAK,KACrD;AACA,IAAA,MAAM,IAAA,CAAK,eAAe,MAAM,CAAA;AAAA,EAClC;AAEA,EAAA,eAAe,QAAQ,IAAA,EAA2B;AAChD,IAAA,MAAM,IAAA,CAAK,SAAS,MAAM;AACxB,MAAA,MAAM,EAAA,GAAK,QAAA,CAAS,cAAA,CAAe,cAAc,CAAA;AACjD,MAAA,IAAI,CAAC,EAAA,EAAI;AACT,MAAA,EAAA,CAAG,MAAM,OAAA,GAAU,GAAA;AACnB,MAAA,UAAA,CAAW,MAAM,EAAA,CAAG,MAAA,EAAO,EAAG,GAAG,CAAA;AAAA,IACnC,CAAC,CAAA;AACD,IAAA,MAAM,IAAA,CAAK,eAAe,GAAG,CAAA;AAAA,EAC/B;AAEA,EAAA,eAAe,OAAA,CAAQ,IAAA,EAAY,IAAA,EAAc,MAAA,EAAgC;AAC/E,IAAA,MAAM,IAAA,CAAK,QAAA;AAAA,MACT,CAAC,CAAA,KAAO,MAAA,CAA2D,UAAA,GAAa,CAAC,CAAA;AAAA,MACjF;AAAA,KACF;AACA,IAAA,MAAM,IAAA,GAAO,UAAU,IAAA,CAAK,GAAA,CAAI,MAAM,GAAA,GAAM,IAAA,CAAK,SAAS,EAAE,CAAA;AAC5D,IAAA,MAAM,IAAA,CAAK,eAAe,IAAI,CAAA;AAAA,EAChC;AAEA,EAAA,eAAe,aAAa,IAAA,EAA2B;AACrD,IAAA,MAAM,IAAA,CAAK,QAAA;AAAA,MAAS,MACjB,MAAA,CAA2D,UAAA,GAAa,EAAE;AAAA,KAC7E;AAAA,EACF;AAEA,EAAA,eAAe,IAAA,CAAK,IAAA,EAAY,EAAA,GAAK,GAAA,EAAoB;AACvD,IAAA,MAAM,IAAA,CAAK,eAAe,EAAE,CAAA;AAAA,EAC9B;AAEA,EAAA,eAAe,OAAA,CAAQ,MAAY,MAAA,EAA4C;AAC7E,IAAA,MAAM,GAAA,GAAM,OAAA,CAAQ,IAAA,EAAM,MAAM,EAAE,KAAA,EAAM;AACxC,IAAA,MAAM,GAAA,CAAI,sBAAA,EAAuB,CAAE,KAAA,CAAM,MAAM;AAAA,IAAC,CAAC,CAAA;AACjD,IAAA,MAAM,GAAA,GAAM,MAAM,GAAA,CAAI,WAAA,EAAY;AAClC,IAAA,IAAI,GAAA,EAAK;AACP,MAAA,MAAM,KAAK,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,CAAA,GAAI,IAAI,KAAA,GAAQ,CAAA,EAAG,GAAA,CAAI,CAAA,GAAI,IAAI,MAAA,GAAS,CAAA,EAAG,EAAE,KAAA,EAAO,IAAI,CAAA;AAClF,MAAA,MAAM,IAAA,CAAK,eAAe,GAAG,CAAA;AAAA,IAC/B;AACA,IAAA,OAAO,GAAA;AAAA,EACT;AAEA,EAAA,eAAe,KAAA,CAAM,MAAY,MAAA,EAAyC;AACxE,IAAA,MAAM,GAAA,GAAM,MAAM,OAAA,CAAQ,IAAA,EAAM,MAAM,CAAA;AACtC,IAAA,MAAM,IAAI,KAAA,EAAM;AAChB,IAAA,MAAM,IAAA,CAAK,eAAe,GAAG,CAAA;AAAA,EAC/B;AAEA,EAAA,eAAe,IAAA,CAAK,IAAA,EAAY,MAAA,EAA0B,IAAA,EAA6B;AACrF,IAAA,MAAM,GAAA,GAAM,MAAM,OAAA,CAAQ,IAAA,EAAM,MAAM,CAAA;AACtC,IAAA,MAAM,IAAI,KAAA,EAAM;AAChB,IAAA,MAAM,GAAA,CAAI,KAAK,EAAE,CAAA;AACjB,IAAA,MAAM,IAAI,iBAAA,CAAkB,IAAA,EAAM,EAAE,KAAA,EAAO,IAAI,CAAA;AAC/C,IAAA,MAAM,IAAA,CAAK,eAAe,GAAG,CAAA;AAAA,EAC/B;AAEA,EAAA,eAAe,KAAA,CAAM,IAAA,EAAY,IAAA,GAA6C,EAAC,EAAkB;AAC/F,IAAA,MAAM,IAAA,CAAK,KAAK,SAAS,CAAA;AACzB,IAAA,IAAI,IAAA,CAAK,SAAS,KAAA,EAAO;AACvB,MAAA,MAAM,IAAA,CAAK,YAAY,GAAA,CAAI,KAAK,EAAE,IAAA,CAAK,MAAA,CAAO,MAAM,KAAK,CAAA;AACzD,MAAA,MAAM,IAAA,CAAK,YAAY,GAAA,CAAI,QAAQ,EAAE,IAAA,CAAK,MAAA,CAAO,MAAM,QAAQ,CAAA;AAC/D,MAAA,MAAM,IAAA,CAAK,WAAA,CAAY,GAAA,CAAI,MAAM,EAAE,KAAA,EAAM;AACzC,MAAA,MAAM,MAAA,CAAO,IAAI,CAAA,CAAE,SAAA,CAAU,eAAe,EAAE,OAAA,EAAS,MAAQ,CAAA;AAC/D,MAAA;AAAA,IACF;AACA,IAAA,MAAM,OAAA,CAAQ,MAAM,IAAA,CAAK,OAAA,IAAW,GAAG,CAAA,CAAE,SAAS,uBAAkB,IAAI,CAAA;AACxE,IAAA,MAAM,KAAK,IAAA,EAAM,GAAA,CAAI,KAAA,EAAO,MAAA,CAAO,MAAM,KAAK,CAAA;AAC9C,IAAA,MAAM,KAAK,IAAA,EAAM,GAAA,CAAI,QAAA,EAAU,MAAA,CAAO,MAAM,QAAQ,CAAA;AACpD,IAAA,MAAM,KAAA,CAAM,IAAA,EAAM,GAAA,CAAI,MAAM,CAAA;AAC5B,IAAA,MAAM,MAAA,CAAO,IAAI,CAAA,CAAE,SAAA,CAAU,eAAe,EAAE,OAAA,EAAS,MAAQ,CAAA;AAC/D,IAAA,MAAM,IAAA,CAAK,MAAM,GAAG,CAAA;AAAA,EACtB;AAEA,EAAA,OAAO;AAAA,IACL,YAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA;AAAA,GACF;AACF","file":"index.js","sourcesContent":["/**\n * Cinematic recording harness — firm-agnostic.\n *\n * Turns a Playwright run into a narrated product demo: a visible cursor that\n * glides between targets, a click ripple, a caption bar that narrates each step,\n * full-screen chapter \"cover\" cards, and human-speed pacing. Every firm app gets\n * the same polished demo capability from one factory — brand colours, fonts,\n * credentials and the login flow arrive as config, so nothing here names a firm.\n *\n * Pair with a Playwright project that records video (see the firm's\n * `playwright.record.config.ts`: video on, a large viewport, some slowMo).\n *\n * Usage in a `*.record.ts` spec:\n *   const cine = createCinematic({ brand, creds })\n *   await cine.installStage(page)          // before the first navigation\n *   await cine.cover(page, { kicker, title, subtitle })\n *   await cine.login(page)\n *   await cine.uncover(page)\n *   await cine.caption(page, \"Opening the flagship matter…\")\n *   await cine.click(page, \"matters-row-…\")\n *\n * `@playwright/test` is a peer dependency — it is only imported by e2e specs, so\n * it never reaches an app bundle.\n */\nimport { type Page, type Locator, expect } from '@playwright/test'\n\n/** Brand skin for the on-screen chrome. All optional — sensible neutral defaults. */\nexport interface CinematicBrand {\n  /** Footer line on chapter cards, e.g. \"Meridian · AI-native counsel\". */\n  firmLabel: string\n  /** Serif display font for cover titles (CSS font-family value). */\n  displayFont?: string\n  /** Sans font for captions + cover body. */\n  sansFont?: string\n  /** Cursor dot radial-gradient stops. */\n  cursor?: { from: string; to: string }\n  /** Click-ripple ring colour. */\n  ripple?: string\n  /** Chapter-card background gradient stops. */\n  cover?: { from: string; mid: string; to: string }\n  /** Accent (kicker text + rule) on chapter cards. */\n  accent?: string\n  /** Caption bar background base colour. */\n  ink?: string\n  /** Cover title text colour. */\n  coverTitle?: string\n}\n\nexport interface CinematicCreds {\n  email: string\n  password: string\n}\n\nexport interface CinematicConfig {\n  brand: CinematicBrand\n  creds: CinematicCreds\n  /** Login route (default \"/app/login\"). */\n  loginPath?: string\n  /** URL the app lands on after auth (default /\\/app$/). */\n  appUrlPattern?: RegExp\n  /** Login form testids (defaults match the shared AppShell/login convention). */\n  testIds?: { email?: string; password?: string; submit?: string }\n}\n\nexport interface Cinematic {\n  installStage(page: Page): Promise<void>\n  cover(\n    page: Page,\n    opts: { kicker: string; title: string; subtitle?: string },\n    holdMs?: number\n  ): Promise<void>\n  uncover(page: Page): Promise<void>\n  caption(page: Page, text: string, holdMs?: number): Promise<void>\n  clearCaption(page: Page): Promise<void>\n  beat(page: Page, ms?: number): Promise<void>\n  glideTo(page: Page, target: string | Locator): Promise<Locator>\n  click(page: Page, target: string | Locator): Promise<void>\n  type(page: Page, target: string | Locator, text: string): Promise<void>\n  /** Sign in. `{ show: false }` authenticates fast + silent (no animation/caption). */\n  login(page: Page, opts?: { show?: boolean; caption?: string }): Promise<void>\n}\n\nconst DEFAULTS = {\n  displayFont: 'ui-serif, Georgia, serif',\n  sansFont: 'Inter, ui-sans-serif, system-ui, sans-serif',\n  cursor: { from: 'rgba(31,111,235,.98)', to: 'rgba(11,42,74,.92)' },\n  ripple: 'rgba(11,42,74,.85)',\n  cover: { from: '#0b1622', mid: '#0e1b2c', to: '#1f6feb' },\n  accent: '#c9a24b',\n  ink: '#0e1b2d',\n  coverTitle: '#f4f6f8',\n}\n\nexport function createCinematic(config: CinematicConfig): Cinematic {\n  const b = config.brand\n  const skin = {\n    firmLabel: b.firmLabel,\n    displayFont: b.displayFont ?? DEFAULTS.displayFont,\n    sansFont: b.sansFont ?? DEFAULTS.sansFont,\n    cursorFrom: b.cursor?.from ?? DEFAULTS.cursor.from,\n    cursorTo: b.cursor?.to ?? DEFAULTS.cursor.to,\n    ripple: b.ripple ?? DEFAULTS.ripple,\n    coverFrom: b.cover?.from ?? DEFAULTS.cover.from,\n    coverMid: b.cover?.mid ?? DEFAULTS.cover.mid,\n    coverTo: b.cover?.to ?? DEFAULTS.cover.to,\n    accent: b.accent ?? DEFAULTS.accent,\n    ink: b.ink ?? DEFAULTS.ink,\n    coverTitle: b.coverTitle ?? DEFAULTS.coverTitle,\n  }\n  const loginPath = config.loginPath ?? '/app/login'\n  const appUrlPattern = config.appUrlPattern ?? /\\/app$/\n  const ids = {\n    email: config.testIds?.email ?? 'auth-email',\n    password: config.testIds?.password ?? 'auth-password',\n    submit: config.testIds?.submit ?? 'auth-login-submit',\n  }\n\n  const resolve = (page: Page, t: string | Locator): Locator =>\n    typeof t === 'string' ? page.getByTestId(t) : t\n\n  async function installStage(page: Page): Promise<void> {\n    await page.addInitScript((s: typeof skin) => {\n      const boot = () => {\n        if (document.getElementById('__cine_cursor')) return\n\n        const cursor = document.createElement('div')\n        cursor.id = '__cine_cursor'\n        cursor.style.cssText =\n          'position:fixed;left:0;top:0;z-index:2147483647;width:22px;height:22px;' +\n          'margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;' +\n          'transition:transform .09s ease-out;' +\n          `background:radial-gradient(circle at 35% 35%, ${s.cursorFrom}, ${s.cursorTo});` +\n          'box-shadow:0 0 0 3px rgba(255,255,255,.6),0 2px 10px rgba(0,0,0,.4);'\n        document.body.appendChild(cursor)\n\n        window.addEventListener(\n          'mousemove',\n          (e) => {\n            cursor.style.transform = `translate(${(e as MouseEvent).clientX}px,${(e as MouseEvent).clientY}px)`\n          },\n          true\n        )\n        window.addEventListener(\n          'mousedown',\n          (e) => {\n            const m = e as MouseEvent\n            const r = document.createElement('div')\n            r.style.cssText =\n              `position:fixed;left:${m.clientX}px;top:${m.clientY}px;z-index:2147483646;` +\n              'width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;pointer-events:none;' +\n              `border:2px solid ${s.ripple};animation:__cine_ripple .55s ease-out forwards;`\n            document.body.appendChild(r)\n            setTimeout(() => r.remove(), 600)\n          },\n          true\n        )\n\n        const cap = document.createElement('div')\n        cap.id = '__cine_cap'\n        cap.style.cssText =\n          'position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(8px);' +\n          'z-index:2147483646;max-width:72%;padding:13px 24px;border-radius:13px;' +\n          `font:500 17px/1.45 ${s.sansFont};color:#fff;letter-spacing:.01em;` +\n          `background:${s.ink}e0;backdrop-filter:blur(7px);` +\n          'box-shadow:0 10px 34px rgba(0,0,0,.4);text-align:center;opacity:0;transition:opacity .35s,transform .35s;'\n        document.body.appendChild(cap)\n\n        const style = document.createElement('style')\n        style.textContent =\n          '@keyframes __cine_ripple{to{width:46px;height:46px;margin:-23px 0 0 -23px;opacity:0}}'\n        document.head.appendChild(style)\n\n        ;(window as unknown as { __cine_cap: (t: string) => void }).__cine_cap = (t: string) => {\n          cap.textContent = t\n          cap.style.opacity = t ? '1' : '0'\n          cap.style.transform = `translateX(-50%) translateY(${t ? 0 : 8}px)`\n        }\n      }\n      if (document.body) boot()\n      else document.addEventListener('DOMContentLoaded', boot)\n    }, skin)\n  }\n\n  async function cover(\n    page: Page,\n    { kicker, title, subtitle }: { kicker: string; title: string; subtitle?: string },\n    holdMs = 2600\n  ): Promise<void> {\n    await page.evaluate(\n      ({ kicker, title, subtitle, s }) => {\n        document.getElementById('__cine_cover')?.remove()\n        const el = document.createElement('div')\n        el.id = '__cine_cover'\n        el.style.cssText =\n          'position:fixed;inset:0;z-index:2147483647;display:flex;flex-direction:column;' +\n          'align-items:center;justify-content:center;text-align:center;padding:0 8%;' +\n          `background:linear-gradient(135deg,${s.coverFrom} 0%,${s.coverMid} 48%,${s.coverTo} 165%);` +\n          `opacity:0;transition:opacity .5s ease;font-family:${s.sansFont};`\n        el.innerHTML =\n          `<div style=\"text-transform:uppercase;letter-spacing:.26em;font-size:13px;font-weight:600;color:${s.accent};margin-bottom:22px\">${kicker}</div>` +\n          `<div style=\"font-family:${s.displayFont};font-weight:600;font-size:52px;line-height:1.08;letter-spacing:-.02em;color:${s.coverTitle};max-width:16ch\">${title}</div>` +\n          (subtitle\n            ? `<div style=\"margin-top:22px;font-size:19px;line-height:1.5;color:${s.coverTitle}b8;max-width:46ch\">${subtitle}</div>`\n            : '') +\n          `<div style=\"margin-top:44px;display:flex;align-items:center;gap:10px;color:${s.coverTitle}80;font-size:13px;letter-spacing:.02em\">` +\n          `<span style=\"width:26px;height:1px;background:${s.accent}\"></span>${s.firmLabel}</div>`\n        document.body.appendChild(el)\n        requestAnimationFrame(() => (el.style.opacity = '1'))\n      },\n      { kicker, title, subtitle: subtitle ?? '', s: skin }\n    )\n    await page.waitForTimeout(holdMs)\n  }\n\n  async function uncover(page: Page): Promise<void> {\n    await page.evaluate(() => {\n      const el = document.getElementById('__cine_cover')\n      if (!el) return\n      el.style.opacity = '0'\n      setTimeout(() => el.remove(), 520)\n    })\n    await page.waitForTimeout(560)\n  }\n\n  async function caption(page: Page, text: string, holdMs?: number): Promise<void> {\n    await page.evaluate(\n      (t) => (window as unknown as { __cine_cap?: (s: string) => void }).__cine_cap?.(t),\n      text\n    )\n    const hold = holdMs ?? Math.min(4200, 900 + text.length * 45)\n    await page.waitForTimeout(hold)\n  }\n\n  async function clearCaption(page: Page): Promise<void> {\n    await page.evaluate(() =>\n      (window as unknown as { __cine_cap?: (s: string) => void }).__cine_cap?.('')\n    )\n  }\n\n  async function beat(page: Page, ms = 650): Promise<void> {\n    await page.waitForTimeout(ms)\n  }\n\n  async function glideTo(page: Page, target: string | Locator): Promise<Locator> {\n    const loc = resolve(page, target).first()\n    await loc.scrollIntoViewIfNeeded().catch(() => {})\n    const box = await loc.boundingBox()\n    if (box) {\n      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2, { steps: 26 })\n      await page.waitForTimeout(180)\n    }\n    return loc\n  }\n\n  async function click(page: Page, target: string | Locator): Promise<void> {\n    const loc = await glideTo(page, target)\n    await loc.click()\n    await page.waitForTimeout(260)\n  }\n\n  async function type(page: Page, target: string | Locator, text: string): Promise<void> {\n    const loc = await glideTo(page, target)\n    await loc.click()\n    await loc.fill('')\n    await loc.pressSequentially(text, { delay: 42 })\n    await page.waitForTimeout(240)\n  }\n\n  async function login(page: Page, opts: { show?: boolean; caption?: string } = {}): Promise<void> {\n    await page.goto(loginPath)\n    if (opts.show === false) {\n      await page.getByTestId(ids.email).fill(config.creds.email)\n      await page.getByTestId(ids.password).fill(config.creds.password)\n      await page.getByTestId(ids.submit).click()\n      await expect(page).toHaveURL(appUrlPattern, { timeout: 45_000 })\n      return\n    }\n    await caption(page, opts.caption ?? `${b.firmLabel} — signing in.`, 1600)\n    await type(page, ids.email, config.creds.email)\n    await type(page, ids.password, config.creds.password)\n    await click(page, ids.submit)\n    await expect(page).toHaveURL(appUrlPattern, { timeout: 45_000 })\n    await beat(page, 800)\n  }\n\n  return {\n    installStage,\n    cover,\n    uncover,\n    caption,\n    clearCaption,\n    beat,\n    glideTo,\n    click,\n    type,\n    login,\n  }\n}\n"]}