@tracewayapp/react 0.2.0 → 0.3.0

package/README.md

@@ -2,63 +2,84 @@
 
 React integration for Traceway. Provides a context provider, error boundary, and hook.
 
+## Installation
+
+```bash
+npm install @tracewayapp/react
+```
+
 ## Setup
 
+Wrap your application with `TracewayProvider`:
+
 ```tsx
 import { TracewayProvider } from "@tracewayapp/react";
 
 function App() {
   return (
-    <TracewayProvider connectionString="your-token@https://your-server.com/api/report">
-      <MyApp />
+    <TracewayProvider connectionString="your-token@https://traceway.example.com/api/report">
+      <YourApp />
     </TracewayProvider>
   );
 }
+
+export default App;
 ```
 
 ## Error Boundary
 
-Catches React render errors and reports them to Traceway.
+Wrap components that might throw errors:
 
 ```tsx
-import { TracewayErrorBoundary } from "@tracewayapp/react";
+import { TracewayProvider, TracewayErrorBoundary } from "@tracewayapp/react";
 
 function App() {
   return (
-    <TracewayErrorBoundary
-      fallback={<div>Something went wrong</div>}
-      onError={(error, errorInfo) => {
-        console.log("Caught:", error.message);
-      }}
-    >
-      <MyPage />
-    </TracewayErrorBoundary>
+    <TracewayProvider connectionString="your-token@https://traceway.example.com/api/report">
+      <TracewayErrorBoundary fallback={<ErrorPage />}>
+        <YourApp />
+      </TracewayErrorBoundary>
+    </TracewayProvider>
   );
 }
 ```
 
 ## useTraceway Hook
 
-Access capture methods from any component inside the provider.
+Use the `useTraceway` hook to capture errors manually:
 
 ```tsx
 import { useTraceway } from "@tracewayapp/react";
 
 function MyComponent() {
-  const { captureException, captureMessage } = useTraceway();
+  const { captureException } = useTraceway();
 
-  function handleClick() {
+  async function handleSubmit() {
     try {
-      doSomething();
-    } catch (err) {
-      captureException(err as Error);
+      await submitForm();
+    } catch (error) {
+      captureException(error);
     }
   }
 
-  return <button onClick={handleClick}>Do Something</button>;
+  return <button onClick={handleSubmit}>Submit</button>;
 }
 ```
 
+## With Options
+
+```tsx
+<TracewayProvider
+  connectionString="your-token@https://traceway.example.com/api/report"
+  options={{
+    debug: true,
+    version: "1.0.0",
+  }}
+>
+  <YourApp />
+</TracewayProvider>
+```
+
 ## API
 
 ### TracewayProvider

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@tracewayapp/react",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Traceway React integration with ErrorBoundary and hooks",
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     }
   },
   "files": [
@@ -23,7 +23,7 @@
     "dev": "tsup --watch"
   },
   "dependencies": {
-    "@tracewayapp/frontend": "0.2.0"
+    "@tracewayapp/frontend": "0.3.0"
   },
   "peerDependencies": {
     "react": ">=18.0.0",