@mushi-mushi/react-native 0.11.0 → 0.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +59 -36
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -1,12 +1,16 @@
1
1
  # @mushi-mushi/react-native
2
2
 
3
- React Native SDK for Mushi Mushi — built-in bottom-sheet widget, floating bug button, offline queue.
3
+ 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.
4
4
 
5
- > **One-command setup:** `npx mushi-mushi` auto-detects React Native / Expo and installs this package.
5
+ > **One-command setup:** `npx mushi-mushi` auto-detects React Native / Expo and installs this package with the right env vars.
6
6
  >
7
- > **Other frameworks:** [`@mushi-mushi/react`](https://npmjs.com/package/@mushi-mushi/react) · [`@mushi-mushi/vue`](https://npmjs.com/package/@mushi-mushi/vue) · [`@mushi-mushi/svelte`](https://npmjs.com/package/@mushi-mushi/svelte) · [`@mushi-mushi/angular`](https://npmjs.com/package/@mushi-mushi/angular) · [`@mushi-mushi/capacitor`](https://npmjs.com/package/@mushi-mushi/capacitor) (Ionic) · [`@mushi-mushi/web`](https://npmjs.com/package/@mushi-mushi/web) (vanilla JS)
7
+ > **Other frameworks:** [`@mushi-mushi/react`](https://npmjs.com/package/@mushi-mushi/react) · [`@mushi-mushi/vue`](https://npmjs.com/package/@mushi-mushi/vue) · [`@mushi-mushi/svelte`](https://npmjs.com/package/@mushi-mushi/svelte) · [`@mushi-mushi/angular`](https://npmjs.com/package/@mushi-mushi/angular) · [`@mushi-mushi/capacitor`](https://npmjs.com/package/@mushi-mushi/capacitor) · [`@mushi-mushi/web`](https://npmjs.com/package/@mushi-mushi/web)
8
8
 
9
- ## Usage
9
+ ## What this package adds on mobile
10
+
11
+ Every bug your users feel — a button that won't tap, a screen that freezes, a layout that folds on their device — gets captured, classified by AI, and fed into a lesson library that prevents the same class of mistake in the next PR review and the next AI agent run. That's the closed loop the main [`mushi-mushi`](https://www.npmjs.com/package/mushi-mushi) README describes. This package is the mobile entry point.
12
+
13
+ ## Quick start
10
14
 
11
15
  ```tsx
12
16
  import { MushiProvider } from '@mushi-mushi/react-native'
@@ -20,74 +24,93 @@ export default function App() {
20
24
  }
21
25
  ```
22
26
 
23
- The provider renders a floating 🐛 button and a slide-up bottom sheet by default. Control behavior via `widget.trigger`:
27
+ That renders a floating 🐛 button and a slide-up bottom-sheet report form. The button stays out of the way until tapped. Report data — screenshot, route, device context, last 5 seconds of console and network — flows to your admin console and is classified within seconds.
24
28
 
25
- | Value | Behavior |
26
- |-------|----------|
27
- | `'button'` (default) | Shows floating action button |
28
- | `'shake'` | Installs a shake-to-report listener (no visible UI) |
29
- | `'both'` | Floating button + shake listener |
30
- | `'manual'` / `'hidden'` / `'none'` | No auto-UI — call `open()` programmatically |
31
- | `'attach'` | Hides the default UI; the host renders its own button and calls `attachTo()` |
29
+ ## Widget trigger modes
32
30
 
33
- Shake detection requires the optional `expo-sensors` peer dependency. Install
34
- it once with `expo install expo-sensors` (or `npm install expo-sensors`); the
35
- listener is wired lazily so apps that ship `'button'` only never pay the cost.
31
+ Control how users open the report form:
36
32
 
37
- `widget.inset` (and the `MushiFloatingButton` `inset` prop) accepts
38
- `{ top?, right?, bottom?, left? }` in points so the trigger can clear tab
39
- bars and host CTAs.
33
+ | Value | Behavior |
34
+ |---|---|
35
+ | `'button'` (default) | Floating action button — safe on all Hermes builds |
36
+ | `'shake'` | Shake-to-report listener (requires optional `expo-sensors` peer) |
37
+ | `'both'` | Floating button + shake |
38
+ | `'manual'` / `'hidden'` / `'none'` | No auto UI — call `open()` programmatically |
39
+ | `'attach'` | Hides default UI; host renders its own button and calls `attachTo()` |
40
+
41
+ > **Note on shake + Hermes:** `expo-sensors` is loaded lazily via `require()` so apps that ship `trigger: 'button'` never pay the shake-sensor cost. Both triggers are fully Hermes-compatible as of v0.11.0.
40
42
 
41
43
  ```tsx
42
44
  <MushiProvider
43
45
  projectId="proj_xxx"
44
46
  apiKey="mushi_xxx"
45
47
  config={{
46
- widget: { trigger: 'both', inset: { bottom: 96, right: 16 } },
48
+ widget: {
49
+ trigger: 'both',
50
+ buttonPosition: 'bottom-right',
51
+ inset: { bottom: 96, right: 16 }, // clear your tab bar
52
+ },
47
53
  }}
48
54
  >
49
55
  <Navigation />
50
56
  </MushiProvider>
51
57
  ```
52
58
 
53
- ### Hooks
59
+ ## Hooks
54
60
 
55
61
  ```ts
56
62
  import { useMushi, useMushiReport, useMushiWidget } from '@mushi-mushi/react-native'
57
63
 
58
64
  const { submitReport } = useMushiReport()
59
65
  const { open, close } = useMushiWidget()
66
+ const mushi = useMushi() // full SDK instance: show(), hide(), setTrigger(), attachTo()
60
67
  ```
61
68
 
62
- The provider's `useMushi()` instance also exposes the cross-platform trigger
63
- controls — `show()`, `hide()`, `attachTo(elementRefOrId)`, and
64
- `setTrigger(mode)` — so a host app can toggle the launcher per screen.
69
+ ## Headless / bring your own button
70
+
71
+ ```tsx
72
+ import { MushiTrigger } from '@mushi-mushi/react-native'
73
+
74
+ <MushiTrigger>
75
+ <Pressable style={styles.btn}>
76
+ <Text>Report a bug</Text>
77
+ </Pressable>
78
+ </MushiTrigger>
79
+ ```
65
80
 
66
- ### Standalone Components
81
+ `MushiTrigger` wraps any child with `cloneElement` — the child's `onPress` chain is preserved.
67
82
 
68
- Use the widget components directly if you need custom integration:
83
+ ## Standalone components
69
84
 
70
85
  ```tsx
71
86
  import { MushiBottomSheet, MushiFloatingButton } from '@mushi-mushi/react-native'
72
87
  ```
73
88
 
74
- - `MushiBottomSheet` — Conversational bug report modal (category → description → submit). Supports dark/light theme, drag-to-dismiss.
75
- - `MushiFloatingButton` — Positioned FAB with spring animation. Configurable via `buttonPosition`.
89
+ - `MushiBottomSheet` — Conversational report modal with category → description → submit flow. Dark/light theme, drag-to-dismiss.
90
+ - `MushiFloatingButton` — Positioned FAB with spring animation. Configurable via `buttonPosition` and `inset`.
76
91
 
77
- ### Captures
92
+ ## What gets captured
78
93
 
79
- - Device info (platform, OS, screen dimensions)
80
- - Console logs (monkey-patched)
81
- - Network requests (fetch interceptor)
82
- - Navigation events (React Navigation, optional)
83
- - Offline queue via AsyncStorage
94
+ - Device info (platform, OS version, screen dimensions)
95
+ - Console logs (monkey-patched `console.*`)
96
+ - Network requests (fetch interceptor, headers redacted)
97
+ - Navigation events (React Navigation integration, optional)
98
+ - Offline queue via `@react-native-async-storage/async-storage` — reports survive force-close
84
99
 
85
- ## Peer Dependencies
100
+ ## Peer dependencies
86
101
 
87
102
  - `react` >= 18
88
103
  - `react-native` >= 0.72
89
- - `@react-navigation/native` >= 6 (optional)
90
- - `@react-native-async-storage/async-storage` >= 1.19 (optional)
104
+ - `@react-navigation/native` >= 6 (optional — navigation capture)
105
+ - `@react-native-async-storage/async-storage` >= 1.19 (optional — offline queue)
106
+ - `expo-sensors` (optional — shake trigger only)
107
+
108
+ ## Changelog highlights
109
+
110
+ - **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.
111
+ - **v0.8.x** — Shake-to-report listener, offline queue, navigation capture.
112
+
113
+ See the full [CHANGELOG](https://github.com/kensaurus/mushi-mushi/blob/master/packages/react-native/CHANGELOG.md).
91
114
 
92
115
  ## License
93
116
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mushi-mushi/react-native",
3
- "version": "0.11.0",
3
+ "version": "0.12.0",
4
4
  "license": "MIT",
5
5
  "description": "React Native SDK for Mushi Mushi — shake-to-report, bottom sheet widget, full context capture",
6
6
  "main": "./dist/index.js",
@@ -29,7 +29,7 @@
29
29
  }
30
30
  },
31
31
  "dependencies": {
32
- "@mushi-mushi/core": "^1.1.0"
32
+ "@mushi-mushi/core": "^1.2.0"
33
33
  },
34
34
  "devDependencies": {
35
35
  "@types/react": "^19.2.14",