@react-devtools-plus/scan 0.2.0

package/.turbo/turbo-build.log

@@ -0,0 +1,23 @@
+
+
+> @react-devtools-plus/scan@0.2.0 build /Users/wangzhichao/办公/code/github/react-devtools/packages/react-devtools-scan
+> tsup
+
+CLI Building entry: {"index":"src/index.ts"}
+CLI Using tsconfig: tsconfig.json
+CLI tsup v8.5.1
+CLI Using tsup config: /Users/wangzhichao/办公/code/github/react-devtools/packages/react-devtools-scan/tsup.config.ts
+CLI Target: es2017
+CLI Cleaning output folder
+ESM Build start
+CJS Build start
+ESM dist/index.js     701.46 KB
+ESM dist/index.js.map 1.25 MB
+ESM ⚡️ Build success in 101ms
+CJS dist/index.cjs     703.26 KB
+CJS dist/index.cjs.map 1.25 MB
+CJS ⚡️ Build success in 102ms
+DTS Build start
+DTS ⚡️ Build success in 990ms
+DTS dist/index.d.ts  7.19 KB
+DTS dist/index.d.cts 7.19 KB

package/.turbo/turbo-prepare$colon$type.log

@@ -0,0 +1,6 @@
+
+
+> @react-devtools-plus/scan@0.0.1 prepare:type /Users/wangzhichao/办公/code/github/react-devtools/packages/react-devtools-scan
+> tsc --declaration --emitDeclarationOnly --outDir dist
+
+ ELIFECYCLE  Command failed with exit code 129.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 webfansplz
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,172 @@
+# @react-devtools-plus/scan
+
+React Scan integration layer for React DevTools.
+
+## Overview
+
+This package provides a seamless integration between [react-scan](https://github.com/aidenybai/react-scan) and React DevTools, making it easy to add powerful performance analysis capabilities to your React applications.
+
+## Features
+
+- 🚀 **Easy Setup**: Single function call to enable React Scan
+- 🎨 **Flexible Integration**: Choose between overlay, panel, or both modes
+- ⚙️ **Full Configuration**: Access to all react-scan options
+- 🔧 **Runtime Control**: Start, stop, and configure scan at runtime
+- 📦 **Type Safe**: Full TypeScript support
+
+## Installation
+
+```bash
+pnpm add @react-devtools-plus/scan
+```
+
+## Quick Start
+
+### Basic Usage
+
+```typescript
+import { initScan } from '@react-devtools-plus/scan';
+
+// Initialize with defaults (development only)
+initScan();
+```
+
+### Custom Configuration
+
+```typescript
+import { initScan } from '@react-devtools-plus/scan';
+
+const scanInstance = initScan({
+  enabled: true,
+  showToolbar: true,
+  animationSpeed: 'fast',
+  trackUnnecessaryRenders: true,
+  integrationMode: 'overlay',
+});
+
+// Control at runtime
+scanInstance.stop();
+scanInstance.start();
+```
+
+### With React DevTools Plugin
+
+```typescript
+// vite.config.ts
+import { defineConfig } from 'vite';
+import { reactDevtools } from 'react-devtools/vite';
+
+export default defineConfig({
+  plugins: [
+    reactDevtools({
+      scan: {
+        enabled: true,
+        showToolbar: true,
+      },
+    }),
+  ],
+});
+```
+
+## API
+
+### `initScan(options?)`
+
+Initialize React Scan with optional configuration.
+
+**Parameters:**
+
+- `options` (optional): `ReactDevtoolsScanOptions`
+
+**Returns:** `ScanInstance`
+
+### `getScan()`
+
+Get the current scan instance.
+
+**Returns:** `ScanInstance | null`
+
+### `ScanInstance` Methods
+
+- `getOptions()`: Get current scan options
+- `setOptions(options)`: Update scan options at runtime
+- `start()`: Start scanning
+- `stop()`: Stop scanning
+- `isActive()`: Check if scanning is active
+
+## Configuration Options
+
+All [react-scan options](https://github.com/aidenybai/react-scan#options) are supported, plus:
+
+```typescript
+interface ReactDevtoolsScanOptions {
+  // ... all react-scan options
+
+  /**
+   * Integration mode
+   * @default 'overlay'
+   */
+  integrationMode?: 'overlay' | 'panel' | 'both';
+
+  /**
+   * Sync state with DevTools panel
+   * @default true
+   */
+  syncWithDevtools?: boolean;
+}
+```
+
+## Examples
+
+### Conditional Enabling
+
+```typescript
+import { initScan } from '@react-devtools-plus/scan';
+
+if (process.env.NODE_ENV === 'development') {
+  initScan({
+    enabled: true,
+    log: false,
+  });
+}
+```
+
+### Runtime Control
+
+```typescript
+import { getScan } from '@react-devtools-plus/scan';
+
+// Later in your code...
+const scan = getScan();
+
+if (scan?.isActive()) {
+  // Temporarily disable for screenshot
+  scan.stop();
+  takeScreenshot();
+  scan.start();
+}
+```
+
+### Custom Animation Speed
+
+```typescript
+import { initScan } from '@react-devtools-plus/scan';
+
+initScan({
+  animationSpeed: 'slow', // 'slow' | 'fast' | 'off'
+});
+```
+
+## Integration with React DevTools
+
+This package is designed to work seamlessly with the React DevTools plugin system. When used together, you get:
+
+- Unified configuration through the DevTools plugin
+- Automatic injection in development builds
+- Coordinated UI between DevTools panel and Scan overlay
+
+See [React DevTools Scan Integration Guide](../../REACT_SCAN_INTEGRATION.md) for more details.
+
+## License
+
+MIT