@bworlds/launchkit 0.1.4 → 0.2.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 (21) hide show
  1. package/README.md +33 -142
  2. package/dist/error-capture.d.ts +2 -0
  3. package/dist/heartbeat.d.ts +8 -0
  4. package/dist/index.d.ts +8 -62
  5. package/dist/launchkit.cjs +1 -440
  6. package/dist/launchkit.cjs.map +1 -1
  7. package/dist/launchkit.js +56 -9956
  8. package/dist/launchkit.js.map +1 -1
  9. package/dist/launchkit.umd.js +1 -440
  10. package/dist/launchkit.umd.js.map +1 -1
  11. package/dist/telemetry-sender.d.ts +7 -0
  12. package/dist/types.d.ts +12 -94
  13. package/package.json +9 -21
  14. package/dist/events.d.ts +0 -57
  15. package/dist/privacy.d.ts +0 -41
  16. package/dist/recorder.d.ts +0 -72
  17. package/dist/screenshot.d.ts +0 -40
  18. package/dist/ui/InviteDialog.d.ts +0 -41
  19. package/dist/ui/Toolbar.d.ts +0 -64
  20. package/dist/ui/injectStyles.d.ts +0 -6
  21. package/dist/uploader.d.ts +0 -36
package/README.md CHANGED
@@ -1,171 +1,62 @@
1
1
  # @bworlds/launchkit
2
2
 
3
- Launch kit for builders - demo recording, feedback tools, and more for BWorlds.
3
+ Monitoring SDK for AI-built apps. One line of code, two readiness checks pass.
4
4
 
5
- ## Features
6
-
7
- - **Session Recording** - Captures user interactions using rrweb
8
- - **Automatic Screenshots** - Takes snapshots on page load, navigation, form submit, modal open, and scroll
9
- - **Privacy-First** - Automatically masks passwords and credit card inputs
10
- - **Lightweight UI** - Minimal toolbar (~3KB) with start/pause/stop controls
11
- - **Auto-Stop** - Recordings automatically stop after 15 minutes
12
- - **Zero Config** - Just add the URL parameter to start recording
13
-
14
- ## Installation
5
+ ## Install
15
6
 
16
7
  ```bash
17
8
  npm install @bworlds/launchkit
18
- # or
19
- pnpm add @bworlds/launchkit
20
- # or
21
- yarn add @bworlds/launchkit
22
9
  ```
23
10
 
24
- ## Usage
25
-
26
- ### Auto-Activation (Recommended)
11
+ ## Quick Start
27
12
 
28
- Import the package anywhere in your app - it auto-activates when the URL contains `?_bw_record=<api_key>`:
13
+ ```js
14
+ import { init } from '@bworlds/launchkit';
29
15
 
30
- ```typescript
31
- // In your app entry point or layout
32
- import '@bworlds/launchkit';
16
+ init({ buildSlug: 'my-app' });
33
17
  ```
34
18
 
35
- Then visit your app with the recording parameter:
36
-
37
- ```
38
- https://yourapp.com?_bw_record=your_api_key
39
- ```
40
-
41
- A toolbar will appear in the bottom-right corner.
42
-
43
- ### Manual Control
44
-
45
- For programmatic control over recording:
19
+ That's it. The SDK will:
20
+ - Send heartbeats every 5 minutes to confirm your app is alive
21
+ - Capture uncaught JS errors and report them
46
22
 
47
- ```typescript
48
- import { DemoRecorder } from '@bworlds/launchkit';
23
+ ## Lovable / Bolt
49
24
 
50
- const recorder = new DemoRecorder({
51
- apiKey: 'your_api_key',
52
- maxDuration: 10 * 60 * 1000, // 10 minutes (default: 15)
53
- maskInputs: true, // default: true
54
- toolbar: {
55
- position: 'bottom-right', // or 'bottom-left', 'top-right', 'top-left'
56
- enabled: true,
57
- },
58
- onComplete: (result) => {
59
- console.log('Recording URL:', result.playbackUrl);
60
- },
61
- });
62
-
63
- // Initialize toolbar
64
- recorder.init();
25
+ Paste this prompt into your AI builder:
65
26
 
66
- // Control recording programmatically
67
- await recorder.start();
68
- recorder.pause();
69
- recorder.resume();
70
- await recorder.stop();
27
+ > Install @bworlds/launchkit and add `import { init } from '@bworlds/launchkit'; init({ buildSlug: 'my-app' });` to the app entry point.
71
28
 
72
- // Take manual screenshot
73
- await recorder.screenshot();
74
- ```
29
+ Replace `my-app` with your build slug from the BWORLDS dashboard.
75
30
 
76
- ### Script Tag (CDN)
77
-
78
- For non-bundled applications:
31
+ ## CDN (no bundler)
79
32
 
80
33
  ```html
81
- <script src="https://cdn.bworlds.com/recorder.umd.js"></script>
82
- ```
83
-
84
- Then visit with `?_bw_record=your_api_key` to activate.
85
-
86
- ## Next.js / React Setup
87
-
88
- Create a client component:
89
-
90
- ```tsx
91
- // components/DemoRecorder.tsx
92
- 'use client';
93
-
94
- import { useEffect } from 'react';
95
-
96
- export function DemoRecorder() {
97
- useEffect(() => {
98
- import('@bworlds/launchkit');
99
- }, []);
100
-
101
- return null;
102
- }
103
- ```
104
-
105
- Add to your layout:
106
-
107
- ```tsx
108
- // app/layout.tsx
109
- import { DemoRecorder } from '@/components/DemoRecorder';
110
-
111
- export default function RootLayout({ children }) {
112
- return (
113
- <html>
114
- <body>
115
- <DemoRecorder />
116
- {children}
117
- </body>
118
- </html>
119
- );
120
- }
34
+ <script src="https://unpkg.com/@bworlds/launchkit"></script>
35
+ <script>
36
+ BWorldsLaunchKit.init({ buildSlug: 'my-app' });
37
+ </script>
121
38
  ```
122
39
 
123
40
  ## Configuration
124
41
 
125
- | Option | Type | Default | Description |
126
- |--------|------|---------|-------------|
127
- | `apiKey` | `string` | required | Your BWorlds API key |
128
- | `apiEndpoint` | `string` | `https://api.bworlds.com` | API endpoint URL |
129
- | `maxDuration` | `number` | `900000` (15 min) | Max recording duration in ms |
130
- | `maskInputs` | `boolean` | `true` | Mask sensitive inputs |
131
- | `toolbar.position` | `string` | `bottom-right` | Toolbar position |
132
- | `toolbar.enabled` | `boolean` | `true` | Show/hide toolbar |
133
- | `onComplete` | `function` | - | Called when recording finishes |
134
- | `onStateChange` | `function` | - | Called on state changes |
135
- | `onError` | `function` | - | Called on errors |
136
-
137
- ## Automatic Screenshots
138
-
139
- Screenshots are captured automatically on:
140
-
141
- - **Page Load** - After initial render
142
- - **Navigation** - On route changes (SPA or browser)
143
- - **Form Submit** - Before form submission
144
- - **Modal Open** - When dialogs/modals appear
145
- - **Scroll** - After scrolling >50% of viewport
146
-
147
- You can also take manual screenshots via the camera button or `recorder.screenshot()`.
148
-
149
- ## Privacy
150
-
151
- The SDK automatically masks:
152
-
153
- - Password inputs (`type="password"`)
154
- - Credit card fields (`autocomplete="cc-*"`)
155
- - Fields with `data-private` or `data-sensitive` attributes
156
-
157
- To exclude an element from recording entirely:
158
-
159
- ```html
160
- <div data-recorder-block>This won't be recorded</div>
42
+ ```js
43
+ init({
44
+ buildSlug: 'my-app', // Required: your build slug
45
+ apiEndpoint: 'https://...', // Optional: custom API endpoint
46
+ heartbeatInterval: 300000, // Optional: heartbeat interval in ms (default: 5 min)
47
+ enableErrorCapture: true, // Optional: enable error capture (default: true)
48
+ enableHeartbeat: true, // Optional: enable heartbeat (default: true)
49
+ });
161
50
  ```
162
51
 
163
- ## Browser Support
52
+ ## What it does
53
+
54
+ | Feature | How it works |
55
+ |---------|-------------|
56
+ | Heartbeat | Sends `POST /api/telemetry/heartbeat` every 5 min |
57
+ | Error capture | `window.onerror` + `unhandledrejection` batched and sent to `POST /api/telemetry/errors` |
164
58
 
165
- - Chrome 80+
166
- - Firefox 75+
167
- - Safari 13+
168
- - Edge 80+
59
+ All requests are identified by `buildSlug`. No API key required. Write-only.
169
60
 
170
61
  ## License
171
62
 
package/dist/error-capture.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export declare function startErrorCapture(buildSlug: string): void;
2
+ export declare function stopErrorCapture(): void;
package/dist/heartbeat.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Heartbeat module: sends periodic pings to the BWORLDS API
3
+ * proving the app is alive and reachable.
4
+ *
5
+ * Default interval: 5 minutes (300000ms).
6
+ */
7
+ export declare function startHeartbeat(buildSlug: string, intervalMs?: number): void;
8
+ export declare function stopHeartbeat(): void;
package/dist/index.d.ts CHANGED
@@ -1,66 +1,12 @@
1
- import { InviteDialogController } from './ui/InviteDialog';
2
- import type { RecorderConfig, RecorderState, RecordingResult } from './types';
3
- export { InviteDialogController };
4
- export type { RecorderConfig, RecorderState, RecordingResult, ToolbarPosition, ScreenshotMarker, ScreenshotEventType, } from './types';
1
+ import type { LaunchKitConfig } from './types';
2
+ export type { LaunchKitConfig } from './types';
5
3
  /**
6
- * Main DemoRecorder class - orchestrates all components
4
+ * Initialize LaunchKit monitoring (heartbeat + error capture).
5
+ *
6
+ * init({ buildSlug: 'my-app' })
7
7
  */
8
- export declare class DemoRecorder {
9
- private config;
10
- private recorder;
11
- private screenshotMarker;
12
- private eventDetector;
13
- private toolbar;
14
- private isInitialized;
15
- constructor(config: RecorderConfig);
16
- /**
17
- * Initialize the recorder (mount toolbar)
18
- */
19
- init(): void;
20
- /**
21
- * Start recording
22
- */
23
- start(): Promise<void>;
24
- /**
25
- * Pause recording
26
- */
27
- pause(): void;
28
- /**
29
- * Resume recording
30
- */
31
- resume(): void;
32
- /**
33
- * Stop recording
34
- */
35
- stop(): Promise<RecordingResult | undefined>;
36
- /**
37
- * Add a manual screenshot marker
38
- */
39
- screenshot(): void;
40
- /**
41
- * Restart - reset everything for a new recording
42
- */
43
- restart(): void;
44
- /**
45
- * Get current state
46
- */
47
- getState(): RecorderState;
48
- /**
49
- * Get elapsed time
50
- */
51
- getElapsedTime(): number;
52
- /**
53
- * Destroy the recorder
54
- */
55
- destroy(): void;
56
- /**
57
- * Handle state changes
58
- */
59
- private handleStateChange;
60
- }
8
+ export declare function init(config: LaunchKitConfig): void;
61
9
  /**
62
- * Initialize the LaunchKit - call this once in your app
63
- * Checks URL params and shows invite dialog or recorder as needed
10
+ * Stop all monitoring. Call on cleanup/unmount if needed.
64
11
  */
65
- export declare function init(): void;
66
- export default DemoRecorder;
12
+ export declare function stop(): void;