@mushi-mushi/react-native 0.16.0 → 0.18.1

package/CONTRIBUTING.md

@@ -58,12 +58,12 @@ packages/
   react-native/  React Native SDK (MIT)
   cli/           CLI tool (MIT)
   mcp/           MCP server for coding agents (MIT)
-  server/        Supabase Edge Functions (BSL)
-  agents/        Agentic fix pipeline (BSL)
-  verify/        Fix verification (BSL)
+  server/        Supabase Edge Functions (AGPLv3)
+  agents/        Agentic fix pipeline (AGPLv3)
+  verify/        Fix verification (AGPLv3)
 apps/
   admin/         Admin dashboard (React + Tailwind)
-  docs/          Documentation site (planned)
+  docs/          Documentation site (Nextra — apps/docs)
 tooling/
   eslint-config/ Shared ESLint flat config
   tsconfig/      Shared TypeScript configs
@@ -81,6 +81,30 @@ tooling/
    ```
 6. Open a pull request
 
+### Documentation (docs-as-code)
+
+If your PR changes **user-visible SDK or CLI behavior**, update docs in the **same PR**:
+
+| Surface | When to update |
+| --- | --- |
+| `packages/*/README.md` | npm-facing install/API/config changes for that package |
+| `apps/docs/content/**/*.mdx` | Long-form guides, quickstarts, admin console docs |
+| Root `README.md` | Marketing stats only when counts change — run `pnpm check:docs-stats` |
+
+Guardrails (run locally before pushing):
+
+```bash
+pnpm check:docs-stats          # root README stat badges
+pnpm check:sdk-version-matrix  # apps/docs/content/sdks/index.mdx versions
+pnpm check:internal-doc-links  # dead /foo links in MDX
+pnpm check:onboarding-drift    # phantom MCP env vars / stale tool names
+pnpm check:bundle-docs         # @mushi-mushi/web size-limit vs README
+pnpm gen:llms-txt              # regenerate apps/docs/public/llms.txt after nav changes
+pnpm gen:mcp-tools-doc         # regenerate sdks/mcp-tools.generated.mdx from catalog.ts
+```
+
+README changes on npm packages only appear on [npmjs.com](https://www.npmjs.com) after the next **Changesets publish**.
+
 ## Changesets
 
 We use [Changesets](https://github.com/changesets/changesets) for versioning. If your PR modifies a published package (`core`, `web`, `react`, `vue`, `svelte`, `angular`, `react-native`, `cli`, `mcp`), add a changeset:
@@ -93,13 +117,30 @@ Select the affected packages, the semver bump type, and write a summary. The cha
 
 ## Release flow
 
-Releases are fully automated. Maintainers don't run `npm publish` by hand.
+Releases are fully automated once the version PR is merged. Maintainers don't run
+`npm publish` by hand for routine bumps. See **[`docs/DEPLOYMENT.md`](docs/DEPLOYMENT.md)**
+for the full production runbook (edge functions, admin SPA, docs site, migrations).
 
 1. PRs land on `master` with one or more changeset files in `.changeset/`.
-2. `release.yml` runs on every push to `master`. It opens (or updates) a `chore: version packages` PR that bumps every affected `package.json`, rolls up the changelogs, and deletes the consumed changesets.
-3. Merging that "Version Packages" PR re-fires `release.yml`. The publish step authenticates to npm via **OpenID Connect (OIDC) Trusted Publishers** — no long-lived `NPM_TOKEN` is exchanged — and every tarball ships with a **Sigstore provenance attestation** uploaded to the public transparency log.
+   Orphaned changesets (only ignored packages) fail `pnpm check:changeset-orphans`.
+2. `release.yml` runs on every push to `master`. It opens (or updates) a
+   **`chore: version packages`** PR on `changeset-release/master` that bumps
+   affected `package.json` files, rolls up changelogs, and deletes consumed
+   changesets.
+3. **Wait for CI on the version PR.** If checks don't appear (bot-branch
+   suppression), push an empty commit to `changeset-release/master`. If
+   `check:sdk-version-matrix` fails, run `pnpm gen:sdk-version-matrix` on that
+   branch and commit `apps/docs/content/sdks/index.mdx`.
+4. Merge the version PR. The publish step uses **OIDC Trusted Publishers** +
+   Sigstore provenance (with `NPM_TOKEN` only for brand-new package bootstrap).
+5. **Manually dispatch Release** unless a run starts within ~2 minutes:
+   **Actions → Release → Run workflow → `master`**. Squash-merges attributed to
+   `github-actions[bot]` usually suppress the auto `push` trigger — manual
+   dispatch is the normal path, not a fallback of last resort.
 
-If GitHub's anti-loop protection suppresses the auto re-fire (the squash merge can be attributed to `github-actions[bot]`), trigger the workflow manually: **Actions → release → Run workflow → master**.
+```bash
+gh workflow run release.yml --ref master
+```
 
 ### Adding a brand-new publishable package
 
@@ -146,7 +187,7 @@ chore: bump dependencies
 ## License
 
 - SDK packages are MIT — your contributions will be MIT-licensed
-- Server/agents/verify are BSL 1.1 — contributions to those packages fall under BSL
+- Server/agents/verify are AGPLv3 — contributions to those packages fall under AGPLv3
 
 ## Questions?
 

package/README.md

@@ -1,5 +1,8 @@
 # @mushi-mushi/react-native
 
+> **Your AI wrote it. Mushi tells you why it broke.**
+> Plain-English diagnosis + a paste-ready fix, right inside Cursor. MIT-licensed SDKs · self-hostable · no second LLM key.
+
 React Native SDK for [Mushi Mushi](https://www.npmjs.com/package/mushi-mushi) — shake-to-report widget, offline queue, and the closed-loop lesson layer for iOS + Android.
 
 > **One-command setup:** `npx mushi-mushi` auto-detects React Native / Expo and installs this package with the right env vars.
@@ -91,27 +94,59 @@ import { MushiBottomSheet, MushiFloatingButton } from '@mushi-mushi/react-native
 
 ## What gets captured
 
-- Device info (platform, OS version, screen dimensions)
+- Device info (platform, OS version, screen dimensions) + a stable device `fingerprintHash`
+- A per-launch `sessionId` so every report from the same run is grouped
+- `sdkPackage` / `sdkVersion` / `appVersion` so the console can flag outdated installs
 - Console logs (monkey-patched `console.*`)
 - Network requests (fetch interceptor, headers redacted)
 - Navigation events (React Navigation integration, optional)
+- A 50-entry breadcrumb ring buffer → sent as `breadcrumbs` + a derived repro `timeline` (SDK lifecycle, screen changes via `setScreen`, and host crumbs via `addBreadcrumb`)
+- Screenshot of the current screen (optional — see below)
 - Offline queue via `@react-native-async-storage/async-storage` — reports survive force-close
 
+## Screenshots
+
+When `react-native-view-shot` is installed, the SDK captures the current screen **before** the report sheet overlays it, and shows the user a thumbnail they can remove before submitting. Enabled by default; turn off with `capture: { screenshot: false }`.
+
+```bash
+npx expo install react-native-view-shot   # v4+ on Expo SDK 55; v5+ for Fabric / New Architecture
+```
+
+> **Masking sensitive screens.** `captureScreen()` grabs whatever is on screen, which on a finance/health app can include balances or PII. The user always reviews and can remove the thumbnail before submit, but for screens that should never be captured, set `capture: { screenshot: false }` while they're focused, or use `expo-screen-capture` to mark the view secure. Field-level masking is on the roadmap.
+
+## Identifying the reporter
+
+Call `identify()` / `setUser()` whenever auth state changes so reports show a human name instead of an anonymous token in the console:
+
+```tsx
+const mushi = useMushi()
+mushi.identify(user.id, { email: user.email, name: user.displayName, provider: 'supabase' })
+// or, web-SDK style:
+mushi.setUser({ id: user.id, email: user.email, name: user.displayName, provider: 'supabase' })
+```
+
+Mushi stores only a SHA-256 hash of the email (the host app owns the raw PII) and shows the `name` as the reporter's display name.
+
 ## Peer dependencies
 
 - `react` >= 18
 - `react-native` >= 0.72
 - `@react-navigation/native` >= 6 (optional — navigation capture)
 - `@react-native-async-storage/async-storage` >= 1.19 (optional — offline queue)
+- `react-native-view-shot` >= 3.8 (optional — screenshot capture; v5+ for New Architecture / Fabric)
 - `expo-sensors` (optional — shake trigger only)
 
 ## Changelog highlights
 
+- **v0.17.0** — Report payload parity with the web SDK: nested `metadata.user` identity (fixes the anonymous-token reporter on the server), `setUser()` alias, per-launch `sessionId`, `sdkPackage`/`sdkVersion`/`appVersion`, device `fingerprintHash`, and a breadcrumb ring buffer → `breadcrumbs` + repro `timeline`. `capture.screenshot` toggle + `addBreadcrumb()`. Bottom sheet restyled to match the web widget.
 - **v0.11.0** — Hermes compatibility fix: replaced `new Function()` dynamic imports with lazy `require()` for `@react-native-community/netinfo` and `expo-sensors`. Enables `trigger: 'button'` safely on all RN 0.84+ Hermes/AOT builds. Adds `MushiTrigger` headless component.
 - **v0.8.x** — Shake-to-report listener, offline queue, navigation capture.
 
 See the full [CHANGELOG](https://github.com/kensaurus/mushi-mushi/blob/master/packages/react-native/CHANGELOG.md).
 
+Maintainers: report ingest contract and empty-state semantics are documented in
+[`docs/report-ingest-contract.md`](../../docs/report-ingest-contract.md).
+
 ## License
 
 MIT

package/dist/index.cjs

@@ -47,7 +47,7 @@ module.exports = __toCommonJS(index_exports);
 
 // src/provider.tsx
 var import_react3 = require("react");
-var import_core = require("@mushi-mushi/core");
+var import_core3 = require("@mushi-mushi/core");
 
 // src/capture/console-capture.ts
 function setupConsoleCapture(maxEntries = 100) {
@@ -164,6 +164,30 @@ function getDeviceInfo() {
   };
 }
 
+// src/capture/fingerprint.ts
+function nonCryptoHashHex(input) {
+  let hash = 0;
+  for (let i = 0; i < input.length; i++) {
+    hash = (hash << 5) - hash + input.charCodeAt(i);
+    hash |= 0;
+  }
+  return `rnfp_${(hash >>> 0).toString(16).padStart(8, "0")}`;
+}
+function getDeviceFingerprintHash(device) {
+  const inputs = {
+    platform: device.platform,
+    osVersion: String(device.osVersion ?? ""),
+    screenWidth: device.screenWidth,
+    screenHeight: device.screenHeight,
+    pixelRatio: device.pixelRatio,
+    locale: device.locale ?? "",
+    timezone: device.timezone ?? ""
+  };
+  const serialised = JSON.stringify(inputs);
+  if (!device.platform && !device.screenWidth) return null;
+  return nonCryptoHashHex(serialised);
+}
+
 // src/storage/async-storage-queue.ts
 var QUEUE_KEY = "@mushi:offline_queue";
 var AsyncStorageQueue = class {
@@ -317,10 +341,17 @@ function sleep(ms) {
 // src/components/MushiBottomSheet.tsx
 var import_react = require("react");
 var import_react_native2 = require("react-native");
+var import_core = require("@mushi-mushi/core");
 var import_jsx_runtime = require("react/jsx-runtime");
 var { height: SCREEN_HEIGHT } = import_react_native2.Dimensions.get("window");
 var SHEET_HEIGHT = SCREEN_HEIGHT * 0.55;
 var DISMISS_THRESHOLD = 80;
+var NEON = {
+  accent: "#0FFF50",
+  accentHover: "#00E646",
+  ink: "#0a1a0a",
+  border: "#00C43A"
+};
 var CATEGORIES = [
   { key: "bug", emoji: "\u{1F41B}", label: "Bug" },
   { key: "slow", emoji: "\u{1F422}", label: "Slow" },
@@ -467,7 +498,8 @@ var MushiBottomSheet = ({
     }
   };
   const activeScreenshot = screenshotDataUrl && screenshotAttached ? screenshotDataUrl : null;
-  const colors = dark ? { bg: "#1c1c1e", text: "#f2f2f7", sub: "#8e8e93", card: "#2c2c2e", accent: "#0a84ff", border: "#38383a", backdrop: "rgba(0,0,0,0.6)", disabled: "#3a3a3c", disabledText: "#636366" } : { bg: "#ffffff", text: "#1c1c1e", sub: "#8e8e93", card: "#f2f2f7", accent: "#007aff", border: "#e5e5ea", backdrop: "rgba(0,0,0,0.35)", disabled: "#d1d1d6", disabledText: "#8e8e93" };
+  const pal = (0, import_core.mushiPalette)(dark ? "dark" : "light");
+  const colors = dark ? { bg: pal.paper, text: pal.ink, sub: pal.inkMuted, card: pal.paperRaised, accent: NEON.accent, accentInk: NEON.ink, border: pal.ruleStrong, backdrop: "rgba(0,0,0,0.6)", disabled: "#3a3a3c", disabledText: pal.inkFaint } : { bg: pal.paperRaised, text: pal.ink, sub: pal.inkMuted, card: pal.paper, accent: NEON.accent, accentInk: NEON.ink, border: pal.ruleStrong, backdrop: "rgba(0,0,0,0.35)", disabled: "#d1d1d6", disabledText: pal.inkFaint };
   const canSubmit = !!category && description.trim().length > 0 && phase === "form";
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Modal, { visible, transparent: true, animationType: "none", statusBarTranslucent: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_react_native2.KeyboardAvoidingView,
@@ -492,6 +524,10 @@ var MushiBottomSheet = ({
             ],
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.View, { ...panResponder.panHandlers, style: s.handleArea, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.View, { style: [s.handle, { backgroundColor: colors.sub }] }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native2.View, { style: [s.brandHeader, { backgroundColor: NEON.accent, borderBottomColor: NEON.border }], children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.brandEyebrow, { color: NEON.ink }], children: "MUSHI \xB7 BETA" }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.brandTitle, { color: NEON.ink }], children: sheetTab === "inbox" ? "Your reports" : sheetTab === "community" ? "Community" : "Report an issue" })
+              ] }),
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.View, { style: s.tabRow, children: ["report", "inbox", "community"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_react_native2.TouchableOpacity,
                 {
@@ -501,7 +537,7 @@ var MushiBottomSheet = ({
                     else setSelectedReportId(null);
                   },
                   style: [s.tabBtn, sheetTab === tab && { borderBottomColor: colors.accent }],
-                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.tabLabel, { color: sheetTab === tab ? colors.accent : colors.sub }], children: tab === "report" ? "Report" : tab === "inbox" ? "Inbox" : "\u{1F310}" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.tabLabel, { color: sheetTab === tab ? colors.text : colors.sub }], children: tab === "report" ? "Report" : tab === "inbox" ? "Your reports" : "Community" })
                 },
                 tab
               )) }),
@@ -514,7 +550,7 @@ var MushiBottomSheet = ({
                 VERIFIABLE_STATUSES.has(
                   inboxReports.find((r) => r.id === selectedReportId)?.status ?? ""
                 ) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native2.View, { style: s.verifyRow, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.verifyBtn, { backgroundColor: colors.accent }], onPress: () => submitFeedback("confirms"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: s.submitText, children: "Yes, fixed" }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.verifyBtn, { backgroundColor: colors.accent }], onPress: () => submitFeedback("confirms"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, { color: colors.accentInk }], children: "Yes, fixed" }) }),
                   /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.verifyBtn, { backgroundColor: colors.border }], onPress: () => submitFeedback("not_fixed"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, { color: colors.text }], children: "Not fixed" }) })
                 ] }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -527,12 +563,11 @@ var MushiBottomSheet = ({
                     onChangeText: setReplyText
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.submitBtn, { backgroundColor: colors.accent }], onPress: sendReply, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: s.submitText, children: "Send" }) })
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.submitBtn, { backgroundColor: colors.accent }], onPress: sendReply, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, { color: colors.accentInk }], children: "Send" }) })
               ] }) : inboxReports.map((r) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native2.TouchableOpacity, { style: [s.inboxRow, { borderColor: colors.border }], onPress: () => openThread(r.id), children: [
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: { color: colors.text, fontWeight: "600" }, numberOfLines: 1, children: (r.summary ?? r.description ?? "Report").slice(0, 60) }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: { color: colors.sub, fontSize: 11 }, children: r.status })
               ] }, r.id)) }) : sheetTab === "community" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native2.ScrollView, { style: s.body, keyboardShouldPersistTaps: "handled", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.title, { color: colors.text }], children: "\u{1F310} Mushi Community" }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: { color: colors.sub, fontSize: 13, marginBottom: 16, lineHeight: 18 }, children: "Sign in to track your reports across apps and see the global leaderboard. No password needed." }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                   import_react_native2.TextInput,
@@ -546,7 +581,7 @@ var MushiBottomSheet = ({
                     textContentType: "emailAddress"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.submitBtn, { backgroundColor: colors.accent }], children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: s.submitText, children: "Send sign-in link \u2192" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.TouchableOpacity, { style: [s.submitBtn, { backgroundColor: colors.accent }], children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, { color: colors.accentInk }], children: "Send sign-in link \u2192" }) }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: { color: colors.sub, fontSize: 11, textAlign: "center", marginTop: 12 }, children: "We'll email you a one-tap sign-in link. No password, ever." })
               ] }) : phase === "sent" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native2.View, { style: s.sentWrap, children: [
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.sentEmoji], children: "\u2705" }),
@@ -558,7 +593,7 @@ var MushiBottomSheet = ({
                   keyboardShouldPersistTaps: "handled",
                   contentContainerStyle: { paddingBottom: 24 },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.title, { color: colors.text }], children: "Report an issue" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.stepLabel, { color: colors.sub }], children: "What kind of issue?" }),
                     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.View, { style: s.catRow, children: CATEGORIES.map((c) => {
                       const active = category === c.key;
                       return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
@@ -580,7 +615,7 @@ var MushiBottomSheet = ({
                               {
                                 style: [
                                   s.catLabel,
-                                  { color: active ? "#fff" : colors.text }
+                                  { color: active ? colors.accentInk : colors.text }
                                 ],
                                 children: c.label
                               }
@@ -646,7 +681,7 @@ var MushiBottomSheet = ({
                           s.submitBtn,
                           { backgroundColor: canSubmit ? colors.accent : colors.disabled }
                         ],
-                        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, !canSubmit && { color: colors.disabledText }], children: phase === "sending" ? "Sending\u2026" : "Submit" })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.Text, { style: [s.submitText, { color: canSubmit ? colors.accentInk : colors.disabledText }], children: phase === "sending" ? "Sending\u2026" : "Submit report" })
                       }
                     )
                   ]
@@ -662,7 +697,13 @@ var MushiBottomSheet = ({
 var s = import_react_native2.StyleSheet.create({
   flex: { flex: 1 },
   backdrop: {
-    ...import_react_native2.StyleSheet.absoluteFillObject
+    // Inlined StyleSheet.absoluteFillObject — RN 0.86 dropped it from the
+    // StyleSheet TS types; the literal is equivalent and works on all RN >=0.72.
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
   },
   sheet: {
     position: "absolute",
@@ -689,6 +730,24 @@ var s = import_react_native2.StyleSheet.create({
     borderRadius: 3,
     opacity: 0.5
   },
+  brandHeader: {
+    paddingHorizontal: 20,
+    paddingTop: 10,
+    paddingBottom: 12,
+    borderBottomWidth: 1.5
+  },
+  brandEyebrow: {
+    fontSize: 10,
+    fontWeight: "700",
+    letterSpacing: 1.2,
+    marginBottom: 2,
+    opacity: 0.7
+  },
+  brandTitle: {
+    fontSize: 18,
+    fontWeight: "800",
+    letterSpacing: -0.2
+  },
   body: {
     paddingHorizontal: 20,
     paddingTop: 4
@@ -698,6 +757,14 @@ var s = import_react_native2.StyleSheet.create({
     fontWeight: "700",
     marginBottom: 16
   },
+  stepLabel: {
+    fontSize: 12,
+    fontWeight: "600",
+    letterSpacing: 0.2,
+    marginTop: 8,
+    marginBottom: 10,
+    textTransform: "uppercase"
+  },
   catRow: {
     flexDirection: "row",
     justifyContent: "space-between",
@@ -826,6 +893,7 @@ var s = import_react_native2.StyleSheet.create({
 // src/components/MushiFloatingButton.tsx
 var import_react2 = require("react");
 var import_react_native3 = require("react-native");
+var import_core2 = require("@mushi-mushi/core");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var FAB_SIZE = 56;
 var EDGE_PADDING = 12;
@@ -877,7 +945,7 @@ var MushiFloatingButton = ({
   const currentX = (0, import_react2.useRef)(baseX);
   const currentY = (0, import_react2.useRef)(0);
   const isDragging = (0, import_react2.useRef)(false);
-  const accentColor = accent ?? (dark ? "#0a84ff" : "#007aff");
+  const accentColor = accent ?? (0, import_core2.mushiPalette)(dark ? "dark" : "light").accent;
   (0, import_react2.useEffect)(() => {
     if (!persist) return;
     void loadStoredPos().then((pos) => {
@@ -987,7 +1055,7 @@ var MushiFloatingButton = ({
       onStartShouldSetResponder: () => !draggable,
       onResponderGrant: handlePressIn,
       onResponderRelease: handlePressOut,
-      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native3.Animated.Text, { style: s2.emoji, children: "\u{1F41B}" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native3.Animated.Text, { style: s2.emoji, children: import_core2.MUSHI_COPY.triggerText })
     }
   );
 };
@@ -1010,14 +1078,53 @@ var s2 = import_react_native3.StyleSheet.create({
   }
 });
 
+// src/version.ts
+var MUSHI_SDK_PACKAGE = "@mushi-mushi/react-native";
+var MUSHI_SDK_VERSION = "0.18.1" ? "0.18.1" : "0.17.0";
+
 // src/provider.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var MushiContext = (0, import_react3.createContext)(null);
-function MushiProvider({ children, ...config }) {
+function breadcrumbToTimelineKind(category) {
+  switch (category) {
+    case "navigation":
+      return "route";
+    case "ui.click":
+    case "ui.tap":
+      return "click";
+    case "xhr":
+    case "fetch":
+    case "network":
+      return "request";
+    default:
+      return "log";
+  }
+}
+function MushiProvider({ children, config: configProp, ...barePropConfig }) {
+  const proc = globalThis.process;
+  const envProjectId = proc?.env?.MUSHI_PROJECT_ID || proc?.env?.EXPO_PUBLIC_MUSHI_PROJECT_ID;
+  const envApiKey = proc?.env?.MUSHI_API_KEY || proc?.env?.EXPO_PUBLIC_MUSHI_API_KEY;
+  const config = {
+    ...envProjectId ? { projectId: envProjectId } : {},
+    ...envApiKey ? { apiKey: envApiKey } : {},
+    ...configProp,
+    ...barePropConfig
+  };
+  if (typeof __DEV__ !== "undefined" && __DEV__) {
+    if (!config.projectId || !config.apiKey) {
+      console.warn(
+        "[MushiProvider] Missing projectId or apiKey \u2014 set MUSHI_PROJECT_ID / MUSHI_API_KEY (or EXPO_PUBLIC_* equivalents) or pass them as props."
+      );
+    }
+  }
   const consoleRef = (0, import_react3.useRef)(null);
   const networkRef = (0, import_react3.useRef)(null);
   const queueRef = (0, import_react3.useRef)(null);
   const apiClientRef = (0, import_react3.useRef)(null);
+  const sessionIdRef = (0, import_react3.useRef)(`sess_${(0, import_core3.newUuid)()}`);
+  const breadcrumbsRef = (0, import_react3.useRef)(
+    (0, import_core3.createBreadcrumbBuffer)({ max: config.capture?.maxBreadcrumbs ?? 50 })
+  );
   const [sheetVisible, setSheetVisible] = (0, import_react3.useState)(false);
   const [sheetScreenshot, setSheetScreenshot] = (0, import_react3.useState)(null);
   const reporterTokenRef = (0, import_react3.useRef)(`rn-${config.projectId}-anon`);
@@ -1028,6 +1135,8 @@ function MushiProvider({ children, ...config }) {
       resolveReporterTokenReady = resolve;
     })
   );
+  const userTokenRef = (0, import_react3.useRef)(null);
+  const pageContextRef = (0, import_react3.useRef)(null);
   const rawEndpoint = config.apiEndpoint ?? config.endpoint;
   if (rawEndpoint !== void 0 && rawEndpoint.trim() === "") {
     throw new Error(
@@ -1037,7 +1146,7 @@ function MushiProvider({ children, ...config }) {
   if (config.endpoint && !config.apiEndpoint && __DEV__) {
     console.warn("[MushiProvider] `endpoint` is deprecated \u2014 use `apiEndpoint` instead.");
   }
-  const apiEndpoint = rawEndpoint ?? import_core.DEFAULT_API_ENDPOINT;
+  const apiEndpoint = rawEndpoint ?? import_core3.DEFAULT_API_ENDPOINT;
   (0, import_react3.useEffect)(() => {
     if (config.capture?.console !== false) {
       consoleRef.current = setupConsoleCapture(config.capture?.maxConsoleEntries);
@@ -1045,10 +1154,13 @@ function MushiProvider({ children, ...config }) {
     if (config.capture?.network !== false) {
       networkRef.current = setupNetworkCapture(config.capture?.maxNetworkEntries, apiEndpoint);
     }
-    apiClientRef.current = (0, import_core.createApiClient)({
+    apiClientRef.current = (0, import_core3.createApiClient)({
       projectId: config.projectId,
       apiKey: config.apiKey,
-      apiEndpoint
+      apiEndpoint,
+      getUserToken: () => userTokenRef.current,
+      sdkPackage: MUSHI_SDK_PACKAGE,
+      sdkVersion: MUSHI_SDK_VERSION
     });
     queueRef.current = new AsyncStorageQueue({
       maxSize: config.storage?.maxQueueSize,
@@ -1061,6 +1173,12 @@ function MushiProvider({ children, ...config }) {
     });
     queueRef.current.flush().catch(() => {
     });
+    breadcrumbsRef.current.add({
+      category: "lifecycle",
+      level: "info",
+      message: "Mushi SDK initialised",
+      data: { sdk: MUSHI_SDK_PACKAGE, version: MUSHI_SDK_VERSION }
+    });
     (async () => {
       const TOKEN_KEY = "@mushi:reporter_token";
       try {
@@ -1069,14 +1187,14 @@ function MushiProvider({ children, ...config }) {
         if (existing && existing.startsWith("mushi_")) {
           reporterTokenRef.current = existing;
         } else {
-          const fresh = `mushi_${(0, import_core.newUuid)()}`;
+          const fresh = `mushi_${(0, import_core3.newUuid)()}`;
           reporterTokenRef.current = fresh;
           await AsyncStorage.setItem(TOKEN_KEY, fresh);
         }
         resolveReporterTokenReady();
       } catch {
         if (reporterTokenRef.current === `rn-${config.projectId}-anon`) {
-          reporterTokenRef.current = `mushi_${(0, import_core.newUuid)()}`;
+          reporterTokenRef.current = `mushi_${(0, import_core3.newUuid)()}`;
         }
         resolveReporterTokenReady();
       }
@@ -1102,6 +1220,17 @@ function MushiProvider({ children, ...config }) {
     return () => unsubscribe?.();
   }, []);
   const open = (0, import_react3.useCallback)(() => {
+    breadcrumbsRef.current.add({
+      category: "lifecycle",
+      level: "info",
+      message: "Widget opened",
+      ...screenRef.current?.name ? { data: { screen: screenRef.current.name } } : {}
+    });
+    if (config.capture?.screenshot === false) {
+      setSheetScreenshot(null);
+      setSheetVisible(true);
+      return;
+    }
     let vshot = null;
     try {
       vshot = require("react-native-view-shot");
@@ -1119,7 +1248,7 @@ function MushiProvider({ children, ...config }) {
     }).finally(() => {
       setSheetVisible(true);
     });
-  }, []);
+  }, [config.capture?.screenshot]);
   const close = (0, import_react3.useCallback)(() => setSheetVisible(false), []);
   const attachTo = (0, import_react3.useCallback)(() => ({ onPress: open }), [open]);
   (0, import_react3.useEffect)(() => {
@@ -1153,16 +1282,37 @@ function MushiProvider({ children, ...config }) {
   const submitReport = (0, import_react3.useCallback)(
     async (data) => {
       const deviceInfo = getDeviceInfo();
+      breadcrumbsRef.current.add({
+        category: "lifecycle",
+        level: "info",
+        message: "Report submitted",
+        data: { category: data.category }
+      });
       const contextMeta = {};
-      if (userRef.current?.id) contextMeta.userId = userRef.current.id;
+      if (userRef.current?.id) {
+        contextMeta.user = {
+          id: userRef.current.id,
+          ...userRef.current.email ? { email: userRef.current.email } : {},
+          ...userRef.current.name ? { name: userRef.current.name } : {},
+          ...userRef.current.provider ? { provider: userRef.current.provider } : {}
+        };
+        contextMeta.userId = userRef.current.id;
+      }
       if (userRef.current?.email) contextMeta.userEmail = userRef.current.email;
       if (userRef.current?.name) contextMeta.userName = userRef.current.name;
       if (screenRef.current?.name) contextMeta.screenName = screenRef.current.name;
       if (screenRef.current?.route) contextMeta.screenRoute = screenRef.current.route;
       if (screenRef.current?.feature) contextMeta.screenFeature = screenRef.current.feature;
       const merged = Object.keys(metadataRef.current).length > 0 ? { ...contextMeta, ...metadataRef.current } : Object.keys(contextMeta).length > 0 ? contextMeta : void 0;
+      const breadcrumbs = breadcrumbsRef.current.getAll();
+      const timeline = breadcrumbs.map((c) => ({
+        ts: c.timestamp,
+        kind: breadcrumbToTimelineKind(c.category),
+        payload: { message: c.message, level: c.level, ...c.data ?? {} }
+      }));
+      const fingerprintHash = getDeviceFingerprintHash(deviceInfo);
       const report = {
-        id: (0, import_core.newUuid)(),
+        id: (0, import_core3.newUuid)(),
         projectId: config.projectId,
         category: data.category,
         description: data.description,
@@ -1183,7 +1333,14 @@ function MushiProvider({ children, ...config }) {
         })) ?? [],
         screenshotDataUrl: data.screenshotDataUrl,
         metadata: merged,
+        sessionId: sessionIdRef.current,
         reporterToken: reporterTokenRef.current,
+        ...fingerprintHash ? { fingerprintHash } : {},
+        ...deviceInfo.appVersion ? { appVersion: deviceInfo.appVersion } : {},
+        sdkPackage: MUSHI_SDK_PACKAGE,
+        sdkVersion: MUSHI_SDK_VERSION,
+        ...breadcrumbs.length > 0 ? { breadcrumbs } : {},
+        ...timeline.length > 0 ? { timeline } : {},
         createdAt: (/* @__PURE__ */ new Date()).toISOString()
       };
       const client = apiClientRef.current;
@@ -1241,11 +1398,53 @@ function MushiProvider({ children, ...config }) {
           provider: traits?.provider
         };
       },
+      setUser(user) {
+        userRef.current = {
+          id: user.id,
+          email: user.email,
+          name: user.name,
+          provider: user.provider
+        };
+      },
+      identifyWithToken(token) {
+        userTokenRef.current = token && typeof token === "string" ? token : null;
+        if (userTokenRef.current) {
+          const claims = (0, import_core3.parseIdentityToken)(userTokenRef.current);
+          if (claims?.sub) {
+            userRef.current = {
+              id: claims.sub,
+              ...claims.email ? { email: claims.email } : {},
+              ...claims.name ? { name: claims.name } : {}
+            };
+          }
+        }
+      },
+      publishPageContext(context) {
+        pageContextRef.current = context && context.route ? context : null;
+      },
       setMetadata(key, value) {
         metadataRef.current[key] = value;
       },
       setScreen(screen) {
+        const prev = screenRef.current?.name;
         screenRef.current = screen;
+        if (screen.name && screen.name !== prev) {
+          breadcrumbsRef.current.add({
+            category: "navigation",
+            level: "info",
+            message: `Navigated to ${screen.name}`,
+            // Always include `route` (fallback to the screen name) so the
+            // admin repro-timeline renders the destination instead of
+            // "unknown route" when the host only set a screen name.
+            data: {
+              route: screen.route ?? screen.name,
+              ...screen.feature ? { feature: screen.feature } : {}
+            }
+          });
+        }
+      },
+      addBreadcrumb(crumb) {
+        breadcrumbsRef.current.add(crumb);
       },
       // Reporter API — scoped to the device's persistent reporter token
       async listMyReports() {