@multiplatform.one/core 7.1.0 → 7.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@multiplatform.one/core",
-  "version": "7.1.0",
+  "version": "7.2.0",
   "description": "Core framework shell, provider composition, and layout factories for multiplatform.one",
   "keywords": [
     "app",
@@ -42,15 +42,16 @@
   },
   "dependencies": {
     "@tanstack/devtools-event-client": "^0.4.3",
+    "@tanstack/devtools-utils": "^0.4.0",
+    "@tanstack/pacer-devtools": "1.3.0",
     "@tanstack/react-devtools": "^0.10.2",
     "@tanstack/react-form-devtools": "0.2.22",
-    "@tanstack/react-pacer-devtools": "^0.7.0",
     "react-cookie": "^8.1.2",
-    "@multiplatform.one/i18n": "7.1.0",
-    "@multiplatform.one/logger": "7.1.0",
-    "@multiplatform.one/platform": "7.1.0",
-    "@multiplatform.one/store": "7.1.0",
-    "@multiplatform.one/theme": "7.1.0"
+    "@multiplatform.one/platform": "7.2.0",
+    "@multiplatform.one/logger": "7.2.0",
+    "@multiplatform.one/i18n": "7.2.0",
+    "@multiplatform.one/theme": "7.2.0",
+    "@multiplatform.one/store": "7.2.0"
   },
   "devDependencies": {
     "@sentry/react": "^10.51.0",
@@ -68,8 +69,8 @@
     "tamagui": "2.7.6",
     "typescript": "~5.9.3",
     "vitest": "^4.1.5",
-    "@multiplatform.one/frappe": "7.1.0",
-    "@multiplatform.one/web3": "7.1.0"
+    "@multiplatform.one/web3": "7.2.0",
+    "@multiplatform.one/frappe": "7.2.0"
   },
   "peerDependencies": {
     "@sentry/react": "^9.0.0",
@@ -85,10 +86,10 @@
     "react-native-gesture-handler": ">=2.0.0",
     "react-native-safe-area-context": ">=4.0.0",
     "tamagui": "^2.0.0-rc",
-    "@multiplatform.one/frappe": "^7.1.0",
-    "@multiplatform.one/frappe-ui": "^7.1.0",
-    "@multiplatform.one/keycloak": "^7.1.0",
-    "@multiplatform.one/web3": "^7.1.0"
+    "@multiplatform.one/frappe": "^7.2.0",
+    "@multiplatform.one/frappe-ui": "^7.2.0",
+    "@multiplatform.one/keycloak": "^7.2.0",
+    "@multiplatform.one/web3": "^7.2.0"
   },
   "peerDependenciesMeta": {
     "@multiplatform.one/web3": {

package/src/app/CreateApp.tsx

@@ -52,6 +52,15 @@ export function followPageOriginForLoopback(configured: string): string {
 export interface TanstackConfig {
   /** Show React Query devtools (web only, ignored on native and in Storybook). */
   debug?: boolean;
+  /**
+   * Shake the device to open the devtools shell (web only; requires
+   * `debug`). Defaults to true whenever the devtools mount. On iOS 13+
+   * WebKit the motion permission is requested once from the user's first
+   * tap; Android and desktop need no permission (desktop simply never
+   * fires devicemotion — use the Ctrl/Cmd+` shortcut there). Set false to
+   * keep the keyboard shortcut as the only trigger.
+   */
+  shakeToOpen?: boolean;
   /** Options forwarded to the QueryClient constructor. */
   queryClientOptions?: Record<string, unknown>;
   /**
@@ -70,6 +79,22 @@ export interface TanstackConfig {
    * Passed automatically by `createApp()` from the theme config.
    */
   tamaguiConfig?: unknown;
+  /**
+   * Theme COLOR names the devtools panel offers in its accent dropdown
+   * (e.g. `["", "blue", "green", "purple"]`; `""` is the base theme).
+   * The panel renders the dropdown only when this AND `onThemeColorChange`
+   * are both set, and only then does the panel's Randomize action touch the
+   * accent — otherwise the picker is inert.
+   */
+  themeColors?: string[];
+  /** The theme color the app currently has applied (`""` for the base). */
+  currentThemeColor?: string;
+  /**
+   * Apply a theme color the user picked. The app owns this because a theme
+   * color is app state, not devtools state: the panel changes nothing on its
+   * own, it hands the choice back.
+   */
+  onThemeColorChange?: (color: string) => void;
 }
 
 export interface KeycloakConfig {

package/src/app/TanstackDevtools.tsx

@@ -1,15 +1,36 @@
 import React from "react";
-import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+// The `/production` subpaths carry the same implementations the main
+// entries carry in development, but WITHOUT the NODE_ENV !== "development"
+// no-op stubs the main entries dead-code themselves into in a production
+// build. This whole file is lazy-loaded and gated on `tanstackConfig.debug`,
+// so importing the real panels unconditionally is what lets a deployed
+// build that opts in (debug: true) actually show devtools.
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools/production";
 import { TanStackDevtools } from "@tanstack/react-devtools";
-import { formDevtoolsPlugin } from "@tanstack/react-form-devtools";
-import { pacerDevtoolsPlugin } from "@tanstack/react-pacer-devtools";
+import { formDevtoolsPlugin } from "@tanstack/react-form-devtools/production";
+import { createReactPanel, createReactPlugin } from "@tanstack/devtools-utils/react";
+import { PacerDevtoolsCore } from "@tanstack/pacer-devtools/production";
 import { ThemeDevtoolsPanel } from "@multiplatform.one/theme";
 import { storage } from "@multiplatform.one/store";
 import { useEffect, useState } from "react";
 import type { TanstackConfig } from "./CreateApp";
+import { devtoolsOpenHotkey, useShakeToOpen } from "./devtoolsTrigger";
 
 const devtoolsSettingsKey = "tanstack_devtools_settings";
 
+// @tanstack/react-pacer-devtools' /production entry is broken upstream
+// (0.7.x): it re-exports its panel from ReactPacerDevtools.js, which pulls
+// PacerDevtoolsCore from @tanstack/pacer-devtools' MAIN entry — the
+// NODE_ENV-gated one — so its "production" plugin silently mounts the no-op
+// core in a deployed bundle. Rebuild the plugin from the genuinely ungated
+// /production core instead. devtoolsTrigger.spec.ts pins the resolved core
+// as real (its unmount throws; the NoOp's is silent).
+const [PacerDevtoolsPanel] = createReactPanel(PacerDevtoolsCore);
+const [pacerDevtoolsPlugin] = createReactPlugin({
+  name: "TanStack Pacer",
+  Component: PacerDevtoolsPanel,
+});
+
 /**
  * Sync the resolved color scheme into the TanStack Devtools settings
  * stored via the shared storage adapter. The devtools shell reads this on mount and
@@ -36,7 +57,7 @@ export interface TanstackDevtoolsProps {
 /**
  * Lazily-loaded devtools shell. All heavy devtools dependencies
  * (`@tanstack/react-devtools`, `@tanstack/react-query-devtools`,
- * `@tanstack/react-form-devtools`, `@tanstack/react-pacer-devtools`,
+ * `@tanstack/react-form-devtools`, `@tanstack/pacer-devtools`,
  * and `ThemeDevtoolsPanel`) live here so they are code-split away
  * from the production bundle.
  */
@@ -108,6 +129,11 @@ export default function TanstackDevtoolsWrapper({
 
   const frappePlugin = useFrappePlugin();
 
+  // Shake-to-open (devicemotion) — the phone-friendly counterpart to the
+  // keyboard shortcut. Ships whenever the devtools mount unless the app
+  // opts out with `tanstack: { shakeToOpen: false }`.
+  useShakeToOpen(tanstackConfig.shakeToOpen !== false);
+
   const plugins = [
     {
       id: "react-query",
@@ -119,11 +145,29 @@ export default function TanstackDevtoolsWrapper({
     {
       id: "theme",
       name: "Theme",
+      // The panel opens focused on Theme, so a shake (or the hotkey) lands
+      // straight on the theme flipper — the whole point of the trigger is
+      // to check that everything is themable. `defaultOpen` seeds the tab
+      // only on first open, when no layout is persisted yet; once the user
+      // moves to another tab their choice is restored on later opens.
+      defaultOpen: true,
       render: (_el: HTMLElement, props: { theme: "dark" | "light" }) => (
         <ThemeDevtoolsPanel
           useUserScheme={tanstackConfig.useUserScheme}
           devtoolsTheme={props.theme}
           tamaguiConfig={tanstackConfig.tamaguiConfig}
+          // The accent channel. `ThemeDevtoolsPanel` has taken these three
+          // props all along and core passed none of them, so the panel's
+          // accent dropdown never rendered and its Randomize action skipped
+          // the colour — a control that is present in the component and
+          // unreachable through the only wrapper that mounts it. They are
+          // forwarded, not invented here: a theme colour is app state, so the
+          // app supplies the list, the current value and the setter, exactly
+          // as it already supplies `useUserScheme`. Undefined stays undefined,
+          // so an app that wires nothing sees the panel it sees today.
+          themeColors={tanstackConfig.themeColors}
+          currentThemeColor={tanstackConfig.currentThemeColor}
+          onThemeColorChange={tanstackConfig.onThemeColorChange}
         />
       ),
     },
@@ -136,7 +180,7 @@ export default function TanstackDevtoolsWrapper({
       config={{
         defaultOpen: false,
         triggerHidden: true,
-        openHotkey: ["CtrlOrMeta", "`"],
+        openHotkey: [...devtoolsOpenHotkey],
         theme: resolvedScheme,
       }}
       plugins={plugins}

package/src/app/devtoolsTrigger.spec.ts

@@ -0,0 +1,488 @@
+/**
+ * @vitest-environment node
+ */
+
+import { existsSync, readFileSync, readdirSync, realpathSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import {
+  __resetMotionArming,
+  armDevtoolsMotion,
+  createMotionPermissionFlow,
+  createShakeDetector,
+  devtoolsArmMotionEvent,
+  devtoolsMotionArmedEvent,
+  devtoolsOpenHotkey,
+  devtoolsShellPluginId,
+  devtoolsTriggerToggledEvent,
+  isMotionPermissionRequired,
+  motionMagnitude,
+  openDevtoolsShell,
+  requestMotionPermissionFromGesture,
+  shakeDefaults,
+} from "./devtoolsTrigger";
+
+const here = dirname(fileURLToPath(import.meta.url));
+
+/** A single devicemotion-shaped sample with the given magnitude on x. */
+function sample(magnitude: number) {
+  return { acceleration: { x: magnitude, y: 0, z: 0 } };
+}
+
+describe("motionMagnitude", () => {
+  it("prefers the gravity-excluded acceleration reading", () => {
+    expect(
+      motionMagnitude({
+        acceleration: { x: 3, y: 4, z: 0 },
+        accelerationIncludingGravity: { x: 100, y: 0, z: 0 },
+      }),
+    ).toBe(5);
+  });
+
+  it("falls back to accelerationIncludingGravity minus standard gravity", () => {
+    expect(
+      motionMagnitude({
+        acceleration: null,
+        accelerationIncludingGravity: { x: 0, y: 0, z: 9.81 },
+      }),
+    ).toBeCloseTo(0);
+    expect(
+      motionMagnitude({
+        accelerationIncludingGravity: { x: 0, y: 0, z: 29.81 },
+      }),
+    ).toBeCloseTo(20);
+  });
+
+  it("treats missing axes as zero", () => {
+    expect(motionMagnitude({ acceleration: { x: 13, y: null, z: null } })).toBe(13);
+  });
+
+  it("returns null when the event carries no data (all-null desktop events)", () => {
+    expect(motionMagnitude({})).toBeNull();
+    expect(motionMagnitude({ acceleration: null, accelerationIncludingGravity: null })).toBeNull();
+    expect(
+      motionMagnitude({
+        acceleration: { x: null, y: null, z: null },
+        accelerationIncludingGravity: { x: null, y: null, z: null },
+      }),
+    ).toBeNull();
+  });
+});
+
+describe("createShakeDetector", () => {
+  it("fires after three fast peaks inside the window", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    detector.handleMotion(sample(20), 0);
+    detector.handleMotion(sample(20), 150);
+    expect(onShake).not.toHaveBeenCalled();
+    detector.handleMotion(sample(20), 300);
+    expect(onShake).toHaveBeenCalledTimes(1);
+  });
+
+  it("ignores samples at or below the threshold", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    for (let t = 0; t < 2000; t += 100) {
+      detector.handleMotion(sample(shakeDefaults.threshold), t);
+    }
+    expect(onShake).not.toHaveBeenCalled();
+  });
+
+  it("counts one swing as one peak (min gap between peaks)", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    // Six samples of the same 100ms swing, 20ms apart — only two peaks
+    // (t=0 and t=100) survive the 80ms gap, so no fire.
+    for (let t = 0; t <= 100; t += 20) {
+      detector.handleMotion(sample(25), t);
+    }
+    expect(onShake).not.toHaveBeenCalled();
+  });
+
+  it("does not fire when peaks fall outside the rolling window", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    detector.handleMotion(sample(20), 0);
+    detector.handleMotion(sample(20), 600);
+    detector.handleMotion(sample(20), 1200); // t=0 peak has left the 1000ms window
+    expect(onShake).not.toHaveBeenCalled();
+    detector.handleMotion(sample(20), 1700); // t=600 is also gone; 1200+1700 = 2 peaks
+    expect(onShake).not.toHaveBeenCalled();
+    detector.handleMotion(sample(20), 1800); // 1200, 1700, 1800 all inside
+    expect(onShake).toHaveBeenCalledTimes(1);
+  });
+
+  it("goes dead for the cooldown after firing, then re-arms", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    detector.handleMotion(sample(20), 0);
+    detector.handleMotion(sample(20), 100);
+    detector.handleMotion(sample(20), 200);
+    expect(onShake).toHaveBeenCalledTimes(1);
+    // A continued violent shake inside the 2000ms cooldown is dropped.
+    detector.handleMotion(sample(25), 500);
+    detector.handleMotion(sample(25), 700);
+    detector.handleMotion(sample(25), 900);
+    detector.handleMotion(sample(25), 2100);
+    expect(onShake).toHaveBeenCalledTimes(1);
+    // After the cooldown (200 + 2000 = 2200) a fresh three-peak shake
+    // fires again; nothing from the cooldown window carries over.
+    detector.handleMotion(sample(25), 2300);
+    detector.handleMotion(sample(25), 2450);
+    detector.handleMotion(sample(25), 2600);
+    expect(onShake).toHaveBeenCalledTimes(2);
+  });
+
+  it("reset clears peaks and cooldown", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake });
+    detector.handleMotion(sample(20), 0);
+    detector.handleMotion(sample(20), 100);
+    detector.reset();
+    detector.handleMotion(sample(20), 200);
+    expect(onShake).not.toHaveBeenCalled();
+  });
+
+  it("honors custom tuning", () => {
+    const onShake = vi.fn();
+    const detector = createShakeDetector({ onShake, threshold: 5, peakCount: 2, windowMs: 300 });
+    detector.handleMotion(sample(6), 0);
+    detector.handleMotion(sample(6), 200);
+    expect(onShake).toHaveBeenCalledTimes(1);
+  });
+});
+
+describe("createMotionPermissionFlow", () => {
+  it("grants immediately when no requestPermission exists (Android/desktop)", () => {
+    const onGranted = vi.fn();
+    const flow = createMotionPermissionFlow({ onGranted });
+    expect(flow.state).toBe("granted");
+    expect(onGranted).toHaveBeenCalledTimes(1);
+  });
+
+  it("waits for a gesture on iOS and grants on 'granted'", async () => {
+    const onGranted = vi.fn();
+    const requestPermission = vi.fn().mockResolvedValue("granted");
+    const flow = createMotionPermissionFlow({ requestPermission, onGranted });
+    expect(flow.state).toBe("awaiting-gesture");
+    expect(onGranted).not.toHaveBeenCalled();
+    await flow.handleGesture();
+    expect(flow.state).toBe("granted");
+    expect(onGranted).toHaveBeenCalledTimes(1);
+    expect(requestPermission).toHaveBeenCalledTimes(1);
+  });
+
+  it("lands on denied (terminal for this load) on 'denied'", async () => {
+    const onGranted = vi.fn();
+    const onDenied = vi.fn();
+    const flow = createMotionPermissionFlow({
+      requestPermission: vi.fn().mockResolvedValue("denied"),
+      onGranted,
+      onDenied,
+    });
+    await flow.handleGesture();
+    expect(flow.state).toBe("denied");
+    expect(onGranted).not.toHaveBeenCalled();
+    expect(onDenied).toHaveBeenCalledTimes(1);
+  });
+
+  it("treats a rejection (called outside a gesture / insecure context) as denied", async () => {
+    const flow = createMotionPermissionFlow({
+      requestPermission: vi.fn().mockRejectedValue(new Error("NotAllowedError")),
+      onGranted: vi.fn(),
+    });
+    await flow.handleGesture();
+    expect(flow.state).toBe("denied");
+  });
+
+  it("no-ops repeat gestures after settling and while a request is in flight", async () => {
+    const onGranted = vi.fn();
+    let resolve!: (v: string) => void;
+    const requestPermission = vi.fn(
+      () =>
+        new Promise<string>((r) => {
+          resolve = r;
+        }),
+    );
+    const flow = createMotionPermissionFlow({ requestPermission, onGranted });
+    const first = flow.handleGesture();
+    expect(flow.state).toBe("requesting");
+    await flow.handleGesture(); // in flight — must not re-ask
+    expect(requestPermission).toHaveBeenCalledTimes(1);
+    resolve("granted");
+    await first;
+    await flow.handleGesture(); // settled — must not re-ask
+    expect(requestPermission).toHaveBeenCalledTimes(1);
+    expect(onGranted).toHaveBeenCalledTimes(1);
+  });
+});
+
+describe("openDevtoolsShell", () => {
+  afterEach(() => {
+    (globalThis as { __TANSTACK_EVENT_TARGET__?: EventTarget | null }).__TANSTACK_EVENT_TARGET__ =
+      null;
+  });
+
+  it("emits the shell's trigger-toggled open event on the devtools bus", () => {
+    const bus = new EventTarget();
+    (globalThis as { __TANSTACK_EVENT_TARGET__?: EventTarget | null }).__TANSTACK_EVENT_TARGET__ =
+      bus;
+    // Play the shell's side of the connect handshake.
+    bus.addEventListener("tanstack-connect", () => {
+      bus.dispatchEvent(new CustomEvent("tanstack-connect-success"));
+    });
+    const received: Array<{ type: string; payload: { isOpen: boolean } }> = [];
+    bus.addEventListener("tanstack-dispatch-event", (event) => {
+      received.push((event as CustomEvent).detail);
+    });
+    openDevtoolsShell();
+    expect(received).toHaveLength(1);
+    expect(received[0]).toMatchObject({
+      type: `${devtoolsShellPluginId}:${devtoolsTriggerToggledEvent}`,
+      payload: { isOpen: true },
+    });
+    // Once connected, later shakes emit directly (open-only, never close).
+    openDevtoolsShell();
+    expect(received).toHaveLength(2);
+    expect(received[1]?.payload).toEqual({ isOpen: true });
+  });
+});
+
+describe("upstream contract (installed packages)", () => {
+  // The trigger-toggled bus event is an internal implementation detail of
+  // @tanstack/devtools, not documented public API. Pin it against the
+  // installed packages so an upstream rename fails tests instead of
+  // silently breaking shake-to-open.
+  /**
+   * Locate an installed package dir regardless of linker layout: walk
+   * ancestor node_modules (hoisted puts everything at the repo root),
+   * then fall back to a sibling of a package that depends on it
+   * (pnpm's isolated virtual store keeps dependencies as siblings).
+   */
+  function findInstalled(pkg: string, siblingOf?: string): string | null {
+    let dir = here;
+    for (let depth = 0; depth < 8; depth++) {
+      const candidate = join(dir, "node_modules", pkg);
+      if (existsSync(candidate)) return realpathSync(candidate);
+      const parent = dirname(dir);
+      if (parent === dir) break;
+      dir = parent;
+    }
+    if (siblingOf) {
+      const sibling = join(siblingOf, "..", pkg.split("/").pop() as string);
+      if (existsSync(sibling)) return realpathSync(sibling);
+    }
+    return null;
+  }
+
+  it("@tanstack/devtools still listens for the trigger-toggled event", () => {
+    const reactDevtoolsDir = findInstalled("@tanstack/react-devtools");
+    expect(reactDevtoolsDir).toBeTruthy();
+    const devtoolsDir = findInstalled("@tanstack/devtools", reactDevtoolsDir as string);
+    expect(devtoolsDir).toBeTruthy();
+    const chunkDir = join(devtoolsDir as string, "dist", "devtools");
+    const chunks = readdirSync(chunkDir).filter((f) => f.endsWith(".js"));
+    const hit = chunks.some((f) =>
+      readFileSync(join(chunkDir, f), "utf8").includes(`"${devtoolsTriggerToggledEvent}"`),
+    );
+    expect(hit).toBe(true);
+  });
+
+  it("@tanstack/devtools-client still uses the tanstack-devtools-core plugin id", () => {
+    const reactDevtoolsDir = findInstalled("@tanstack/react-devtools");
+    const devtoolsDir = findInstalled("@tanstack/devtools", reactDevtoolsDir as string);
+    const clientDir = findInstalled("@tanstack/devtools-client", devtoolsDir as string);
+    expect(clientDir).toBeTruthy();
+    const source = readFileSync(join(clientDir as string, "dist", "esm", "index.js"), "utf8");
+    expect(source).toContain(`pluginId: "${devtoolsShellPluginId}"`);
+  });
+
+  it("@tanstack/pacer-devtools/production resolves the REAL core, not the NoOp", async () => {
+    // A NoOp core (constructCoreClass's second class) has silent
+    // mount/unmount; the real core throws "Devtools is not mounted" when
+    // unmounted before mount. That behavioral difference — not an import
+    // string — is what proves a deployed bundle gets a working Pacer panel.
+    const pacerDir = findInstalled("@tanstack/pacer-devtools");
+    expect(pacerDir).toBeTruthy();
+
+    // Sanity-check the trap first: vitest runs with NODE_ENV !== "development",
+    // the same condition a deployed bundle sees, so the MAIN entry's gate
+    // must hand back the NoOp here. If this half fails, upstream removed the
+    // gate and the /production workaround can be dropped.
+    const mainEntry = await import(
+      pathToFileURL(join(pacerDir as string, "dist", "index.js")).href
+    );
+    expect(() => new mainEntry.PacerDevtoolsCore().unmount()).not.toThrow();
+
+    // The entry the shell actually imports must be the real core.
+    const prodEntry = await import(
+      pathToFileURL(join(pacerDir as string, "dist", "production", "index.js")).href
+    );
+    expect(() => new prodEntry.PacerDevtoolsCore().unmount()).toThrow(/not mounted/i);
+  });
+});
+
+describe("motion arming (deliberate, app-driven grant)", () => {
+  const realWindow = (globalThis as { window?: unknown }).window;
+  const realMotion = (globalThis as { DeviceMotionEvent?: unknown }).DeviceMotionEvent;
+
+  afterEach(() => {
+    __resetMotionArming();
+    (globalThis as { window?: unknown }).window = realWindow;
+    (globalThis as { DeviceMotionEvent?: unknown }).DeviceMotionEvent = realMotion;
+    vi.restoreAllMocks();
+  });
+
+  /** Stand up a window (an EventTarget) and, optionally, an iOS motion ctor. */
+  function stubEnv(requestPermission?: () => Promise<string>) {
+    const win = new EventTarget();
+    (globalThis as { window?: unknown }).window = win;
+    (globalThis as { DeviceMotionEvent?: unknown }).DeviceMotionEvent = requestPermission
+      ? { requestPermission }
+      : {};
+    return win as EventTarget & { addEventListener: EventTarget["addEventListener"] };
+  }
+
+  it("isMotionPermissionRequired is true only when requestPermission exists (iOS)", () => {
+    stubEnv(async () => "granted");
+    expect(isMotionPermissionRequired()).toBe(true);
+    stubEnv(undefined);
+    expect(isMotionPermissionRequired()).toBe(false);
+  });
+
+  it("grants immediately with no prompt on Android/desktop and broadcasts granted", async () => {
+    const win = stubEnv(undefined);
+    const armed: Array<boolean> = [];
+    win.addEventListener(devtoolsMotionArmedEvent, (e) =>
+      armed.push((e as CustomEvent).detail.granted),
+    );
+    const state = await requestMotionPermissionFromGesture();
+    expect(state).toBe("granted");
+    expect(armed).toEqual([true]);
+  });
+
+  it("asks once on iOS and broadcasts the granted outcome", async () => {
+    const requestPermission = vi.fn().mockResolvedValue("granted");
+    const win = stubEnv(requestPermission);
+    const armed: Array<boolean> = [];
+    win.addEventListener(devtoolsMotionArmedEvent, (e) =>
+      armed.push((e as CustomEvent).detail.granted),
+    );
+    const state = await requestMotionPermissionFromGesture();
+    expect(requestPermission).toHaveBeenCalledTimes(1);
+    expect(state).toBe("granted");
+    expect(armed).toEqual([true]);
+  });
+
+  it("broadcasts a denial and does not re-prompt once granted", async () => {
+    const denied = vi.fn().mockResolvedValue("denied");
+    const win = stubEnv(denied);
+    const armed: Array<boolean> = [];
+    win.addEventListener(devtoolsMotionArmedEvent, (e) =>
+      armed.push((e as CustomEvent).detail.granted),
+    );
+    expect(await requestMotionPermissionFromGesture()).toBe("denied");
+    expect(armed).toEqual([false]);
+
+    // A later grant flips it; after that the flow short-circuits without
+    // touching requestPermission again (Safari remembers the answer).
+    __resetMotionArming();
+    const granted = vi.fn().mockResolvedValue("granted");
+    stubEnv(granted);
+    expect(await requestMotionPermissionFromGesture()).toBe("granted");
+    expect(await requestMotionPermissionFromGesture()).toBe("granted");
+    expect(granted).toHaveBeenCalledTimes(1);
+  });
+
+  it("armDevtoolsMotion dispatches the arm event on window", () => {
+    const win = stubEnv(async () => "granted");
+    const seen = vi.fn();
+    win.addEventListener(devtoolsArmMotionEvent, seen);
+    armDevtoolsMotion();
+    expect(seen).toHaveBeenCalledTimes(1);
+  });
+});
+
+describe("devtools shell wiring", () => {
+  const shellSource = readFileSync(join(here, "TanstackDevtools.tsx"), "utf8");
+  const triggerSource = readFileSync(join(here, "devtoolsTrigger.ts"), "utf8");
+
+  it("opens focused on the Theme tab (defaultOpen on the theme plugin)", () => {
+    // The theme plugin object carries `defaultOpen: true` so a shake lands
+    // on the theme flipper on first open.
+    expect(shellSource).toMatch(/id:\s*"theme"[\s\S]*?defaultOpen:\s*true/);
+  });
+
+  it("arms iOS motion deliberately, never by grabbing an arbitrary tap", () => {
+    // The old build grabbed the first `pointerup` anywhere to self-grant,
+    // which popped the iOS prompt on a random tap. The trigger is now a
+    // deliberate arm event and the pointerup grab is gone.
+    expect(triggerSource).not.toContain('addEventListener("pointerup"');
+    expect(triggerSource).toContain("window.addEventListener(devtoolsArmMotionEvent");
+    expect(shellSource).toContain("useShakeToOpen(tanstackConfig.shakeToOpen !== false)");
+  });
+
+  it("keeps the existing Ctrl/Cmd+` shortcut", () => {
+    expect(devtoolsOpenHotkey).toEqual(["CtrlOrMeta", "`"]);
+    // The shell config must spread the pinned constant, not restate it.
+    expect(shellSource).toContain("openHotkey: [...devtoolsOpenHotkey]");
+  });
+
+  it("mounts shake-to-open with the config opt-out", () => {
+    expect(shellSource).toContain("useShakeToOpen(tanstackConfig.shakeToOpen !== false)");
+  });
+
+  it("forwards the accent channel to the theme panel", () => {
+    // `ThemeDevtoolsPanel` takes themeColors / currentThemeColor /
+    // onThemeColorChange and renders its accent dropdown only when the list
+    // and the setter are both present. The shell mounts that panel and used
+    // to pass none of the three, so the control existed and was unreachable
+    // through the only wrapper that mounts it.
+    for (const prop of ["themeColors", "currentThemeColor", "onThemeColorChange"]) {
+      expect(shellSource).toContain(`${prop}={tanstackConfig.${prop}}`);
+    }
+  });
+
+  it("keeps the accent channel app-owned — the shell invents no default", () => {
+    // A theme colour is app state. The shell forwards what the app gives it
+    // and nothing else, so an app that wires nothing sees the panel it saw
+    // before this change rather than a dropdown that changes nothing.
+    expect(shellSource).not.toMatch(/themeColors=\{(?!tanstackConfig\.themeColors\})/);
+    expect(shellSource).not.toMatch(
+      /onThemeColorChange=\{(?!tanstackConfig\.onThemeColorChange\})/,
+    );
+  });
+
+  it("loads the plugin panels through their production entries", () => {
+    // The main entries dead-code themselves into no-ops when
+    // NODE_ENV !== "development"; a deployed build needs /production.
+    expect(shellSource).toContain('"@tanstack/react-query-devtools/production"');
+    expect(shellSource).toContain('"@tanstack/react-form-devtools/production"');
+    // Pacer cannot go through @tanstack/react-pacer-devtools/production:
+    // that entry transitively imports @tanstack/pacer-devtools' NODE_ENV-gated
+    // MAIN entry, so its "production" plugin mounts the NoOp core. The shell
+    // rebuilds the plugin from the ungated core instead.
+    expect(shellSource).toContain('"@tanstack/pacer-devtools/production"');
+    expect(shellSource).toContain("createReactPanel(PacerDevtoolsCore)");
+    expect(shellSource).not.toContain('from "@tanstack/react-pacer-devtools');
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Type-level lock: the three accent fields on TanstackConfig ARE the panel's,
+// so widening or renaming one upstream breaks the typecheck here instead of
+// silently dropping the channel again.
+// ---------------------------------------------------------------------------
+type PanelProps = import("@multiplatform.one/theme").ThemeDevtoolsPanelProps;
+type Cfg = import("./CreateApp").TanstackConfig;
+type _AccentChannelMatches =
+  Pick<Cfg, "themeColors" | "currentThemeColor" | "onThemeColorChange"> extends Pick<
+    PanelProps,
+    "themeColors" | "currentThemeColor" | "onThemeColorChange"
+  >
+    ? true
+    : never;
+const _accentChannelLock: _AccentChannelMatches = true;
+void _accentChannelLock;

package/src/app/devtoolsTrigger.ts

@@ -0,0 +1,385 @@
+import { EventClient } from "@tanstack/devtools-event-client";
+import { useEffect } from "react";
+
+// ---------------------------------------------------------------------------
+// Keyboard trigger
+// ---------------------------------------------------------------------------
+
+/**
+ * Keyboard shortcut that toggles the devtools shell (Ctrl+` / Cmd+`).
+ * Handled inside `@tanstack/react-devtools`, which skips editable targets
+ * (inputs, textareas, contentEditable), so it cannot collide with app
+ * typing. Exported so tests pin the binding.
+ */
+export const devtoolsOpenHotkey = ["CtrlOrMeta", "`"] as const;
+
+// ---------------------------------------------------------------------------
+// Programmatic open — the same event the devtools shell's own trigger emits
+// ---------------------------------------------------------------------------
+
+/**
+ * Plugin id of the TanStack Devtools shell's internal event client
+ * (`devtoolsEventClient` in `@tanstack/devtools-client`). The shell
+ * subscribes to `<pluginId>:trigger-toggled` and opens/closes on the
+ * payload's `isOpen`. The spec asserts both strings
+ * against the installed packages so an upstream rename fails the build
+ * instead of silently breaking shake-to-open.
+ */
+export const devtoolsShellPluginId = "tanstack-devtools-core";
+
+/** Event suffix the shell listens on for open/close state changes. */
+export const devtoolsTriggerToggledEvent = "trigger-toggled";
+
+interface DevtoolsShellEventMap {
+  "trigger-toggled": { isOpen: boolean };
+}
+
+let shellEventClient: EventClient<DevtoolsShellEventMap> | undefined;
+
+/**
+ * Open the TanStack Devtools shell programmatically by emitting the same
+ * bus event the shell's own (hidden) trigger button uses. Open-only by
+ * design: a continued shake must not immediately re-close the panel —
+ * closing stays on the close button / Escape / the keyboard shortcut.
+ * The event client queues emits until the bus connects, so an early shake
+ * racing the shell mount is still delivered.
+ */
+export function openDevtoolsShell() {
+  shellEventClient ??= new EventClient<DevtoolsShellEventMap>({
+    pluginId: devtoolsShellPluginId,
+  });
+  shellEventClient.emit(devtoolsTriggerToggledEvent, { isOpen: true });
+}
+
+// ---------------------------------------------------------------------------
+// Shake detection — pure state machine over devicemotion samples
+// ---------------------------------------------------------------------------
+
+const gravityMs2 = 9.81;
+
+/** Defaults: deliberate shakes peak 15–25 m/s²; walking/bumps stay under ~8. */
+export const shakeDefaults = {
+  /** m/s² a sample must exceed to count as a shake peak. */
+  threshold: 12,
+  /** Minimum ms between counted peaks (one swing = one peak, not many samples). */
+  minPeakGapMs: 80,
+  /** Peaks required inside the rolling window to fire. */
+  peakCount: 3,
+  /** Rolling window (ms) the peaks must land in. */
+  windowMs: 1000,
+  /** Dead time (ms) after firing before the detector re-arms. */
+  cooldownMs: 2000,
+} as const;
+
+interface MotionAxes {
+  x?: number | null;
+  y?: number | null;
+  z?: number | null;
+}
+
+/** Structural subset of DeviceMotionEvent the detector needs (testable in node). */
+export interface MotionEventLike {
+  acceleration?: MotionAxes | null;
+  accelerationIncludingGravity?: MotionAxes | null;
+}
+
+/**
+ * Acceleration magnitude (m/s²) of a devicemotion sample. Prefers the
+ * gravity-excluded reading; falls back to the including-gravity reading
+ * minus standard gravity. Returns null when the event carries no data
+ * (some desktop browsers fire devicemotion with all-null axes).
+ */
+export function motionMagnitude(event: MotionEventLike): number | null {
+  const a = event.acceleration;
+  if (a && (a.x != null || a.y != null || a.z != null)) {
+    return Math.hypot(a.x ?? 0, a.y ?? 0, a.z ?? 0);
+  }
+  const g = event.accelerationIncludingGravity;
+  if (g && (g.x != null || g.y != null || g.z != null)) {
+    return Math.abs(Math.hypot(g.x ?? 0, g.y ?? 0, g.z ?? 0) - gravityMs2);
+  }
+  return null;
+}
+
+export interface ShakeDetectorOptions {
+  onShake: () => void;
+  threshold?: number;
+  minPeakGapMs?: number;
+  peakCount?: number;
+  windowMs?: number;
+  cooldownMs?: number;
+}
+
+export interface ShakeDetector {
+  /** Feed a devicemotion sample. `now` is injectable for tests. */
+  handleMotion: (event: MotionEventLike, now?: number) => void;
+  /** Drop all peaks and cooldown state. */
+  reset: () => void;
+}
+
+/**
+ * Debounced shake detector: fires `onShake` when `peakCount` peaks above
+ * `threshold` (each at least `minPeakGapMs` apart) land inside a rolling
+ * `windowMs`, then goes dead for `cooldownMs` before re-arming.
+ */
+export function createShakeDetector({
+  onShake,
+  threshold = shakeDefaults.threshold,
+  minPeakGapMs = shakeDefaults.minPeakGapMs,
+  peakCount = shakeDefaults.peakCount,
+  windowMs = shakeDefaults.windowMs,
+  cooldownMs = shakeDefaults.cooldownMs,
+}: ShakeDetectorOptions): ShakeDetector {
+  let peaks: number[] = [];
+  let lastPeakAt = Number.NEGATIVE_INFINITY;
+  let cooldownUntil = Number.NEGATIVE_INFINITY;
+
+  function reset() {
+    peaks = [];
+    lastPeakAt = Number.NEGATIVE_INFINITY;
+    cooldownUntil = Number.NEGATIVE_INFINITY;
+  }
+
+  function handleMotion(event: MotionEventLike, now: number = Date.now()) {
+    if (now < cooldownUntil) return;
+    const magnitude = motionMagnitude(event);
+    if (magnitude == null || magnitude <= threshold) return;
+    if (now - lastPeakAt < minPeakGapMs) return;
+    lastPeakAt = now;
+    peaks = peaks.filter((at) => now - at <= windowMs);
+    peaks.push(now);
+    if (peaks.length < peakCount) return;
+    peaks = [];
+    lastPeakAt = Number.NEGATIVE_INFINITY;
+    cooldownUntil = now + cooldownMs;
+    onShake();
+  }
+
+  return { handleMotion, reset };
+}
+
+// ---------------------------------------------------------------------------
+// Motion permission — iOS 13+ WebKit gesture-gated grant flow
+// ---------------------------------------------------------------------------
+
+export type MotionPermissionState = "granted" | "awaiting-gesture" | "requesting" | "denied";
+
+export interface MotionPermissionFlow {
+  readonly state: MotionPermissionState;
+  /**
+   * Call from a user gesture (pointerup/click). Resolves once the
+   * permission settles; no-ops unless state is "awaiting-gesture".
+   */
+  handleGesture: () => Promise<void>;
+}
+
+/**
+ * Permission state machine. Platforms without
+ * `DeviceMotionEvent.requestPermission` (Android, desktop) grant
+ * immediately; iOS WebKit waits for a user gesture, asks once, and lands
+ * on granted or denied. A denial is terminal for this page load — Safari
+ * remembers the answer per site, so later loads resolve silently.
+ */
+export function createMotionPermissionFlow({
+  requestPermission,
+  onGranted,
+  onDenied,
+}: {
+  requestPermission?: () => Promise<string>;
+  onGranted: () => void;
+  onDenied?: () => void;
+}): MotionPermissionFlow {
+  let state: MotionPermissionState = requestPermission ? "awaiting-gesture" : "granted";
+  if (state === "granted") onGranted();
+
+  async function handleGesture() {
+    if (state !== "awaiting-gesture" || !requestPermission) return;
+    state = "requesting";
+    let result: string;
+    try {
+      result = await requestPermission();
+    } catch {
+      // requestPermission rejects when called outside a user gesture or in
+      // an insecure context — treat as denied for this load.
+      result = "denied";
+    }
+    if (result === "granted") {
+      state = "granted";
+      onGranted();
+    } else {
+      state = "denied";
+      onDenied?.();
+    }
+  }
+
+  return {
+    get state() {
+      return state;
+    },
+    handleGesture,
+  };
+}
+
+// ---------------------------------------------------------------------------
+// Motion arming — a DELIBERATE, app-driven grant (no arbitrary tap grab)
+// ---------------------------------------------------------------------------
+
+interface DeviceMotionEventConstructorLike {
+  requestPermission?: () => Promise<string>;
+}
+
+function motionEventCtor(): DeviceMotionEventConstructorLike | undefined {
+  return (globalThis as { DeviceMotionEvent?: DeviceMotionEventConstructorLike }).DeviceMotionEvent;
+}
+
+/**
+ * True only on the platform that gates devicemotion behind a user-gesture
+ * grant: iOS 13+ WebKit exposes `DeviceMotionEvent.requestPermission`.
+ * Android and desktop return false — they deliver motion events without a
+ * prompt, so shake-to-open arms itself there and no trigger UI is needed.
+ */
+export function isMotionPermissionRequired(): boolean {
+  return typeof motionEventCtor()?.requestPermission === "function";
+}
+
+/**
+ * The window event an app dispatches from a DELIBERATE user gesture to arm
+ * shake-to-open on iOS (e.g. the SHC console's triple-tap on the build
+ * number in Settings › Estate). It is a window CustomEvent rather than an
+ * imported function on purpose: the trigger lives in a feature package that
+ * does not — and must not — depend on this core build. `dispatchEvent` is
+ * synchronous, so the `requestPermission()` this fires runs INSIDE the
+ * originating gesture's call stack, which is the whole reason iOS accepts
+ * it. `armDevtoolsMotion()` dispatches it for callers that CAN import core.
+ */
+export const devtoolsArmMotionEvent = "mpo:devtools-arm-motion";
+
+/**
+ * The window event core dispatches back once an arm attempt settles, so a
+ * trigger UI can report the honest outcome. `detail.granted` is true only
+ * when motion is now live.
+ */
+export const devtoolsMotionArmedEvent = "mpo:devtools-motion-armed";
+
+// The grant is a one-shot module latch plus a set of attachers (one per
+// mounted `useShakeToOpen`). Once granted, a shell that mounts LATER — a
+// colour-scheme change remounts it under a new key — attaches immediately
+// instead of waiting for a second arm gesture.
+let motionGranted = false;
+const motionAttachers = new Set<() => void>();
+
+function registerMotionAttacher(attach: () => void): () => void {
+  if (motionGranted) {
+    attach();
+    return () => {};
+  }
+  motionAttachers.add(attach);
+  return () => {
+    motionAttachers.delete(attach);
+  };
+}
+
+function grantAndAttachAll() {
+  motionGranted = true;
+  // Safe to iterate directly: `attach` adds a devicemotion listener and
+  // never mutates the set, and a shell mounting mid-grant sees
+  // motionGranted === true and attaches without registering.
+  for (const attach of motionAttachers) attach();
+}
+
+/** Test seam: forget the grant and drop attachers between cases. */
+export function __resetMotionArming() {
+  motionGranted = false;
+  motionAttachers.clear();
+}
+
+/**
+ * Request motion permission from within a user gesture and, on grant,
+ * attach every waiting shake listener. Idempotent once granted. Resolves
+ * to the settled permission state; a denial is terminal for this page load
+ * (Safari remembers it per site). Broadcast the outcome on
+ * `devtoolsMotionArmedEvent` so a trigger UI can report it.
+ */
+export async function requestMotionPermissionFromGesture(): Promise<MotionPermissionState> {
+  if (motionGranted) return "granted";
+  const ctor = motionEventCtor();
+  const flow = createMotionPermissionFlow({
+    // Invoke as a static method on the constructor — a detached reference
+    // throws in WebKit.
+    requestPermission:
+      typeof ctor?.requestPermission === "function" ? () => ctor.requestPermission!() : undefined,
+    onGranted: grantAndAttachAll,
+  });
+  // Non-iOS: the flow granted (and attached) synchronously in its
+  // constructor — nothing to await.
+  if (flow.state !== "granted") await flow.handleGesture();
+  if (typeof window !== "undefined") {
+    window.dispatchEvent(
+      new CustomEvent(devtoolsMotionArmedEvent, {
+        detail: { granted: flow.state === "granted" },
+      }),
+    );
+  }
+  return flow.state;
+}
+
+/**
+ * Arm shake-to-open programmatically. For callers that CAN import core
+ * (the app layer); a feature package instead dispatches
+ * `devtoolsArmMotionEvent` directly. Must be called from a user gesture on
+ * iOS. No-op on the server.
+ */
+export function armDevtoolsMotion(): void {
+  if (typeof window === "undefined") return;
+  window.dispatchEvent(new Event(devtoolsArmMotionEvent));
+}
+
+// ---------------------------------------------------------------------------
+// React wiring
+// ---------------------------------------------------------------------------
+
+/**
+ * Shake-to-open for the devtools shell. Attaches a `devicemotion` listener
+ * and opens the shell on a detected shake. Desktop browsers deliver no
+ * devicemotion events, so the listener is inert there — the keyboard
+ * shortcut is the desktop path.
+ *
+ * iOS 13+ gates devicemotion behind a permission prompt that can ONLY be
+ * requested from a user gesture, and the first shake cannot self-grant. So
+ * on iOS the listener attaches only after the app arms it — by dispatching
+ * `devtoolsArmMotionEvent` from a deliberate gesture (the console wires the
+ * build-number triple-tap). Android/desktop attach immediately. SSR-safe;
+ * every listener is torn down on unmount.
+ */
+export function useShakeToOpen(enabled: boolean, onShake: () => void = openDevtoolsShell) {
+  useEffect(() => {
+    if (!enabled || typeof window === "undefined") return;
+
+    const detector = createShakeDetector({ onShake });
+    const motionListener = (event: Event) =>
+      detector.handleMotion(event as unknown as MotionEventLike);
+    const attach = () => window.addEventListener("devicemotion", motionListener, { passive: true });
+    const detach = () => window.removeEventListener("devicemotion", motionListener);
+
+    if (!isMotionPermissionRequired()) {
+      // Android / desktop: no grant needed — listen right away.
+      attach();
+      return detach;
+    }
+
+    // iOS: attach now if a prior deliberate arm already granted; otherwise
+    // wait for the app's arm event (dispatched from a user gesture, so the
+    // permission request it fires stays inside that gesture's stack).
+    const removeAttacher = registerMotionAttacher(attach);
+    const armListener = () => {
+      void requestMotionPermissionFromGesture();
+    };
+    window.addEventListener(devtoolsArmMotionEvent, armListener);
+
+    return () => {
+      detach();
+      removeAttacher();
+      window.removeEventListener(devtoolsArmMotionEvent, armListener);
+    };
+  }, [enabled, onShake]);
+}

package/types/app/CreateApp.d.ts

@@ -15,6 +15,15 @@ export declare function followPageOriginForLoopback(configured: string): string;
 export interface TanstackConfig {
     /** Show React Query devtools (web only, ignored on native and in Storybook). */
     debug?: boolean;
+    /**
+     * Shake the device to open the devtools shell (web only; requires
+     * `debug`). Defaults to true whenever the devtools mount. On iOS 13+
+     * WebKit the motion permission is requested once from the user's first
+     * tap; Android and desktop need no permission (desktop simply never
+     * fires devicemotion — use the Ctrl/Cmd+` shortcut there). Set false to
+     * keep the keyboard shortcut as the only trigger.
+     */
+    shakeToOpen?: boolean;
     /** Options forwarded to the QueryClient constructor. */
     queryClientOptions?: Record<string, unknown>;
     /**
@@ -33,6 +42,22 @@ export interface TanstackConfig {
      * Passed automatically by `createApp()` from the theme config.
      */
     tamaguiConfig?: unknown;
+    /**
+     * Theme COLOR names the devtools panel offers in its accent dropdown
+     * (e.g. `["", "blue", "green", "purple"]`; `""` is the base theme).
+     * The panel renders the dropdown only when this AND `onThemeColorChange`
+     * are both set, and only then does the panel's Randomize action touch the
+     * accent — otherwise the picker is inert.
+     */
+    themeColors?: string[];
+    /** The theme color the app currently has applied (`""` for the base). */
+    currentThemeColor?: string;
+    /**
+     * Apply a theme color the user picked. The app owns this because a theme
+     * color is app state, not devtools state: the panel changes nothing on its
+     * own, it hands the choice back.
+     */
+    onThemeColorChange?: (color: string) => void;
 }
 export interface KeycloakConfig {
     /** Force-enable or disable. When omitted, reads KEYCLOAK_ENABLED from env config. */

package/types/app/CreateApp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateApp.d.ts","sourceRoot":"","sources":["../../src/app/CreateApp.tsx"],"names":[],"mappings":"AAAA,OAAc,EAKZ,KAAK,aAAa,EAClB,KAAK,iBAAiB,EAEvB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAU5D,MAAM,MAAM,iBAAiB,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC;AAIjE;;;;;;;;;GASG;AACH,wBAAgB,2BAA2B,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAWtE;AAMD,MAAM,WAAW,cAAc;IAC7B,gFAAgF;IAChF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM;QACpB,OAAO,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;QACrC,KAAK,EAAE,OAAO,GAAG,MAAM,CAAC;QACxB,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,KAAK,IAAI,CAAC;KAC/C,CAAC;IACF;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,cAAc;IAC7B,qFAAqF;IACrF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B;;qBAEiB;IACjB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B,mFAAmF;IACnF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;QAClD,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;CACH;AAED,MAAM,WAAW,aAAa;IAC5B,iFAAiF;IACjF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kFAAkF;IAClF,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qEAAqE;IACrE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iHAAiH;IACjH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAMD,MAAM,WAAW,eAAe;IAC9B,yDAAyD;IACzD,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAChC,gFAAgF;IAChF,QAAQ,CAAC,EAAE,cAAc,GAAG,OAAO,CAAC;IACpC,8FAA8F;IAC9F,QAAQ,CAAC,EAAE,cAAc,GAAG,OAAO,CAAC;IACpC,uFAAuF;IACvF,MAAM,CAAC,EAAE,YAAY,GAAG,OAAO,CAAC;IAChC,4FAA4F;IAC5F,IAAI,CAAC,EAAE,aAAa,GAAG,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB;IACzD,gDAAgD;IAChD,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,gFAAgF;IAChF,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAQD;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,SAAS,EAAE,eAAe;;iDAsLW,gBAAgB;;;cA2B5D,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,UAAU,aAAa,CAAC,CAAC,CAAC,KAAG,aAAa,CAAC,CAAC,CAAC;wBAatE,eAAe;EAKzC"}
+{"version":3,"file":"CreateApp.d.ts","sourceRoot":"","sources":["../../src/app/CreateApp.tsx"],"names":[],"mappings":"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"}

package/types/app/TanstackDevtools.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TanstackDevtools.d.ts","sourceRoot":"","sources":["../../src/app/TanstackDevtools.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAsBlD,MAAM,WAAW,qBAAqB;IACpC,cAAc,EAAE,OAAO,GAAG,MAAM,CAAC;IACjC,cAAc,EAAE,cAAc,CAAC;CAChC;AAkED,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,cAAc,EACd,cAAc,GACf,EAAE,qBAAqB,2CA0CvB"}
+{"version":3,"file":"TanstackDevtools.d.ts","sourceRoot":"","sources":["../../src/app/TanstackDevtools.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAoClD,MAAM,WAAW,qBAAqB;IACpC,cAAc,EAAE,OAAO,GAAG,MAAM,CAAC;IACjC,cAAc,EAAE,cAAc,CAAC;CAChC;AAkED,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,cAAc,EACd,cAAc,GACf,EAAE,qBAAqB,2CAiEvB"}

package/types/app/devtoolsTrigger.d.ts

@@ -0,0 +1,155 @@
+/**
+ * Keyboard shortcut that toggles the devtools shell (Ctrl+` / Cmd+`).
+ * Handled inside `@tanstack/react-devtools`, which skips editable targets
+ * (inputs, textareas, contentEditable), so it cannot collide with app
+ * typing. Exported so tests pin the binding.
+ */
+export declare const devtoolsOpenHotkey: readonly ["CtrlOrMeta", "`"];
+/**
+ * Plugin id of the TanStack Devtools shell's internal event client
+ * (`devtoolsEventClient` in `@tanstack/devtools-client`). The shell
+ * subscribes to `<pluginId>:trigger-toggled` and opens/closes on the
+ * payload's `isOpen`. The spec asserts both strings
+ * against the installed packages so an upstream rename fails the build
+ * instead of silently breaking shake-to-open.
+ */
+export declare const devtoolsShellPluginId = "tanstack-devtools-core";
+/** Event suffix the shell listens on for open/close state changes. */
+export declare const devtoolsTriggerToggledEvent = "trigger-toggled";
+/**
+ * Open the TanStack Devtools shell programmatically by emitting the same
+ * bus event the shell's own (hidden) trigger button uses. Open-only by
+ * design: a continued shake must not immediately re-close the panel —
+ * closing stays on the close button / Escape / the keyboard shortcut.
+ * The event client queues emits until the bus connects, so an early shake
+ * racing the shell mount is still delivered.
+ */
+export declare function openDevtoolsShell(): void;
+/** Defaults: deliberate shakes peak 15–25 m/s²; walking/bumps stay under ~8. */
+export declare const shakeDefaults: {
+    /** m/s² a sample must exceed to count as a shake peak. */
+    readonly threshold: 12;
+    /** Minimum ms between counted peaks (one swing = one peak, not many samples). */
+    readonly minPeakGapMs: 80;
+    /** Peaks required inside the rolling window to fire. */
+    readonly peakCount: 3;
+    /** Rolling window (ms) the peaks must land in. */
+    readonly windowMs: 1000;
+    /** Dead time (ms) after firing before the detector re-arms. */
+    readonly cooldownMs: 2000;
+};
+interface MotionAxes {
+    x?: number | null;
+    y?: number | null;
+    z?: number | null;
+}
+/** Structural subset of DeviceMotionEvent the detector needs (testable in node). */
+export interface MotionEventLike {
+    acceleration?: MotionAxes | null;
+    accelerationIncludingGravity?: MotionAxes | null;
+}
+/**
+ * Acceleration magnitude (m/s²) of a devicemotion sample. Prefers the
+ * gravity-excluded reading; falls back to the including-gravity reading
+ * minus standard gravity. Returns null when the event carries no data
+ * (some desktop browsers fire devicemotion with all-null axes).
+ */
+export declare function motionMagnitude(event: MotionEventLike): number | null;
+export interface ShakeDetectorOptions {
+    onShake: () => void;
+    threshold?: number;
+    minPeakGapMs?: number;
+    peakCount?: number;
+    windowMs?: number;
+    cooldownMs?: number;
+}
+export interface ShakeDetector {
+    /** Feed a devicemotion sample. `now` is injectable for tests. */
+    handleMotion: (event: MotionEventLike, now?: number) => void;
+    /** Drop all peaks and cooldown state. */
+    reset: () => void;
+}
+/**
+ * Debounced shake detector: fires `onShake` when `peakCount` peaks above
+ * `threshold` (each at least `minPeakGapMs` apart) land inside a rolling
+ * `windowMs`, then goes dead for `cooldownMs` before re-arming.
+ */
+export declare function createShakeDetector({ onShake, threshold, minPeakGapMs, peakCount, windowMs, cooldownMs, }: ShakeDetectorOptions): ShakeDetector;
+export type MotionPermissionState = "granted" | "awaiting-gesture" | "requesting" | "denied";
+export interface MotionPermissionFlow {
+    readonly state: MotionPermissionState;
+    /**
+     * Call from a user gesture (pointerup/click). Resolves once the
+     * permission settles; no-ops unless state is "awaiting-gesture".
+     */
+    handleGesture: () => Promise<void>;
+}
+/**
+ * Permission state machine. Platforms without
+ * `DeviceMotionEvent.requestPermission` (Android, desktop) grant
+ * immediately; iOS WebKit waits for a user gesture, asks once, and lands
+ * on granted or denied. A denial is terminal for this page load — Safari
+ * remembers the answer per site, so later loads resolve silently.
+ */
+export declare function createMotionPermissionFlow({ requestPermission, onGranted, onDenied, }: {
+    requestPermission?: () => Promise<string>;
+    onGranted: () => void;
+    onDenied?: () => void;
+}): MotionPermissionFlow;
+/**
+ * True only on the platform that gates devicemotion behind a user-gesture
+ * grant: iOS 13+ WebKit exposes `DeviceMotionEvent.requestPermission`.
+ * Android and desktop return false — they deliver motion events without a
+ * prompt, so shake-to-open arms itself there and no trigger UI is needed.
+ */
+export declare function isMotionPermissionRequired(): boolean;
+/**
+ * The window event an app dispatches from a DELIBERATE user gesture to arm
+ * shake-to-open on iOS (e.g. the SHC console's triple-tap on the build
+ * number in Settings › Estate). It is a window CustomEvent rather than an
+ * imported function on purpose: the trigger lives in a feature package that
+ * does not — and must not — depend on this core build. `dispatchEvent` is
+ * synchronous, so the `requestPermission()` this fires runs INSIDE the
+ * originating gesture's call stack, which is the whole reason iOS accepts
+ * it. `armDevtoolsMotion()` dispatches it for callers that CAN import core.
+ */
+export declare const devtoolsArmMotionEvent = "mpo:devtools-arm-motion";
+/**
+ * The window event core dispatches back once an arm attempt settles, so a
+ * trigger UI can report the honest outcome. `detail.granted` is true only
+ * when motion is now live.
+ */
+export declare const devtoolsMotionArmedEvent = "mpo:devtools-motion-armed";
+/** Test seam: forget the grant and drop attachers between cases. */
+export declare function __resetMotionArming(): void;
+/**
+ * Request motion permission from within a user gesture and, on grant,
+ * attach every waiting shake listener. Idempotent once granted. Resolves
+ * to the settled permission state; a denial is terminal for this page load
+ * (Safari remembers it per site). Broadcast the outcome on
+ * `devtoolsMotionArmedEvent` so a trigger UI can report it.
+ */
+export declare function requestMotionPermissionFromGesture(): Promise<MotionPermissionState>;
+/**
+ * Arm shake-to-open programmatically. For callers that CAN import core
+ * (the app layer); a feature package instead dispatches
+ * `devtoolsArmMotionEvent` directly. Must be called from a user gesture on
+ * iOS. No-op on the server.
+ */
+export declare function armDevtoolsMotion(): void;
+/**
+ * Shake-to-open for the devtools shell. Attaches a `devicemotion` listener
+ * and opens the shell on a detected shake. Desktop browsers deliver no
+ * devicemotion events, so the listener is inert there — the keyboard
+ * shortcut is the desktop path.
+ *
+ * iOS 13+ gates devicemotion behind a permission prompt that can ONLY be
+ * requested from a user gesture, and the first shake cannot self-grant. So
+ * on iOS the listener attaches only after the app arms it — by dispatching
+ * `devtoolsArmMotionEvent` from a deliberate gesture (the console wires the
+ * build-number triple-tap). Android/desktop attach immediately. SSR-safe;
+ * every listener is torn down on unmount.
+ */
+export declare function useShakeToOpen(enabled: boolean, onShake?: () => void): void;
+export {};
+//# sourceMappingURL=devtoolsTrigger.d.ts.map

package/types/app/devtoolsTrigger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtoolsTrigger.d.ts","sourceRoot":"","sources":["../../src/app/devtoolsTrigger.ts"],"names":[],"mappings":"AAOA;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,8BAA+B,CAAC;AAM/D;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,2BAA2B,CAAC;AAE9D,sEAAsE;AACtE,eAAO,MAAM,2BAA2B,oBAAoB,CAAC;AAQ7D;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,SAKhC;AAQD,gFAAgF;AAChF,eAAO,MAAM,aAAa;IACxB,0DAA0D;;IAE1D,iFAAiF;;IAEjF,wDAAwD;;IAExD,kDAAkD;;IAElD,+DAA+D;;CAEvD,CAAC;AAEX,UAAU,UAAU;IAClB,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClB,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClB,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACnB;AAED,oFAAoF;AACpF,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IACjC,4BAA4B,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;CAClD;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,GAAG,MAAM,GAAG,IAAI,CAUrE;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC5B,iEAAiE;IACjE,YAAY,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,GAAG,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7D,yCAAyC;IACzC,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,SAAmC,EACnC,YAAyC,EACzC,SAAmC,EACnC,QAAiC,EACjC,UAAqC,GACtC,EAAE,oBAAoB,GAAG,aAAa,CA2BtC;AAMD,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,kBAAkB,GAAG,YAAY,GAAG,QAAQ,CAAC;AAE7F,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,KAAK,EAAE,qBAAqB,CAAC;IACtC;;;OAGG;IACH,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACpC;AAED;;;;;;GAMG;AACH,wBAAgB,0BAA0B,CAAC,EACzC,iBAAiB,EACjB,SAAS,EACT,QAAQ,GACT,EAAE;IACD,iBAAiB,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC;IAC1C,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,GAAG,oBAAoB,CA8BvB;AAcD;;;;;GAKG;AACH,wBAAgB,0BAA0B,IAAI,OAAO,CAEpD;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,sBAAsB,4BAA4B,CAAC;AAEhE;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,8BAA8B,CAAC;AA4BpE,oEAAoE;AACpE,wBAAgB,mBAAmB,SAGlC;AAED;;;;;;GAMG;AACH,wBAAsB,kCAAkC,IAAI,OAAO,CAAC,qBAAqB,CAAC,CAqBzF;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,IAAI,IAAI,CAGxC;AAMD;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,GAAE,MAAM,IAAwB,QA+BvF"}