npm package: @react-lib-tech/react-text-extractor
Description: A tiny React component library (JS)
Author: Abhishek Kumar Singh
Latest version: 1.0.32

# @react-lib-tech/react-text-extractor

A tiny React component library + CLI utility to **extract all visible text from your React project** (JS/JSX) and optionally **transform it using OpenAI** (translation, summarization, i18n, etc.).

---

## ✨ Features

- 🔍 Extracts **text content** from React components:
  - Static JSX text
  - Attributes (`placeholder`, `title`, `alt`, `aria-label`)
- 🛑 Ignores:
  - HTML tags, numbers, hex colors, and special characters
- ⚡ Works with:
  - Direct React rendering (`renderToString` + JSDOM)
  - Fallback parsing (`@babel/parser` via `extractTextFromAst.js`)
- 🤖 Optional **AI-powered text transformation** with OpenAI:
  - Translate
  - Summarize
  - Rewrite
  - Convert into i18n keys

---

## 📦 Installation

```bash
npm install @react-lib-tech/react-text-extractor
```

---

## 🚀 Usage

### 1. Basic Extraction

```js
import { ReactTextExtractor } from "@react-lib-tech/react-text-extractor";

(async () => {
  const result = await ReactTextExtractor({
    rootPath: "./src", // path to your React project
    returnBoth: true,  // get both raw + filtered
  });

  console.log("Raw:", result.raw);
  console.log("Filtered:", result.filtered);
})();
```

---

### 2. With OpenAI Transformation

```js
import { ReactTextExtractor } from "@react-lib-tech/react-text-extractor";
import fetch from "node-fetch";
(async () => {
  const result = await ReactTextExtractor({
    rootPath: "./src",
    returnBoth: true,
    fetchImpl : fetch,
    prompt: "Translate everything into Hindi", // 👈 AI prompt
    aiModel: "gpt-4o-mini",                    // default: gpt-4o-mini
    aiTemperature: 0.2,                        // creativity (0 = deterministic)
    aiSystemPrompt: "You are a professional translator.",
    openaiApiKey: process.env.OPENAI_API_KEY,  // 👈 user-supplied key
  });

  console.log("✅ AI Transformed:", result.filtered);
})();
```

---

### 3. Example Output

```json
{
  "raw": [
    "Hello world",
    "Submit",
    "Enter your name"
  ],
  "filtered": [
    "नमस्ते दुनिया",
    "जमा करें",
    "अपना नाम दर्ज करें"
  ]
}
```

---

## ⚙️ Options

| Option            | Type      | Default | Description |
|-------------------|----------|---------|-------------|
| `rootPath`        | `string` | `"./src"` | Folder to scan recursively |
| `skipWord`        | `string[]` | `[]` | Extra words/tags to skip |
| `returnBoth`      | `boolean` | `true` | Return `{ raw, filtered }` |
| `applyFilter`     | `boolean` | `true` | If `false`, returns raw only |
| `fetchImpl`       | `fetch`  | `null`  | import fetch from "node-fetch"; |
| `prompt`          | `string` | `null` | AI instruction (e.g., "Translate to French") |
| `aiModel`         | `string` | `"gpt-4o-mini"` | OpenAI model |
| `aiTemperature`   | `number` | `0.3` | Randomness/creativity |
| `aiSystemPrompt`  | `string` | `"You are a text transformation assistant."` | AI system role |
| `openaiApiKey`    | `string` | `process.env.OPENAI_API_KEY` | API key |

---

## 🔑 OpenAI Integration

Make sure to set your key either:
- In environment:
  ```bash
  export OPENAI_API_KEY="sk-xxxxx"
  ```
- Or pass explicitly:
  ```js
  openaiApiKey: "sk-xxxxx"
  ```
---

## 🤝 Contributing

1. Fork & clone the repo  
2. Run `npm install`  
3. Build with `npm run build`  
4. Test with a sample React project  

---

## 📜 License

MIT © 2025 Abhishek Kumar Singh