@novility/react-converter-core 1.0.0

package/README.md

@@ -0,0 +1,76 @@
+# @novility/react-converter-core
+
+The core conversion engine for `react-converter`. This library provides the logic for parsing JSX, transforming ASTs, and generating framework-free vanilla JavaScript components.
+
+## Features
+
+- **JSX Parsing**: Uses Babel to parse JSX and TypeScript.
+- **AST Transformations**: Converts React-style JSX into DOM-manipulation logic.
+- **TailwindCSS Integration**: Automatically extracts Tailwind classes and builds a minimal CSS bundle.
+- **Web Component Support**: Can wrap components into native Web Components with Shadow DOM.
+- **Hooks Runtime**: Provides a lightweight runtime for `useState`, `useEffect`, and `useRef`.
+
+## Installation
+
+```bash
+npm install @novility/react-converter-core
+```
+
+## API Usage
+
+### `convert(code, options)`
+
+The main function to transform React code into vanilla JS.
+
+```javascript
+import { convert } from '@novility/react-converter-core';
+
+const code = `
+  function Greeting({ name }) {
+    return <h1 className="text-blue-500">Hello {name}</h1>;
+  }
+`;
+
+const result = await convert(code, {
+  fileName: 'Greeting.jsx',
+  tailwindConfig: './tailwind.config.js',
+  webComponent: true,
+  webComponentTag: 'my-greeting'
+});
+
+console.log(result.code);
+// Output: Vanilla JS code implementing the component
+```
+
+#### Options
+| Option | Type | Default | Description |
+| --- | --- | --- | --- |
+| `fileName` | `string` | `'component.jsx'` | Used for identifying the component and naming. |
+| `tailwindConfig` | `string` | `null` | Path to your tailwind.config.js file. |
+| `webComponent` | `boolean` | `false` | Whether to emit a Web Component. |
+| `webComponentTag` | `string` | `null` | Custom tag name for the Web Component. |
+| `usePlaceholders` | `boolean` | `false` | Use $prefix for props as placeholders. |
+
+### Advanced Exports
+
+The core also exports individual modules for more granular control:
+
+- `parseFile(code)`: Parses code into a Babel AST.
+- `transform(ast, options)`: Transforms the AST into an intermediate representation.
+- `generateCode(components, fileName, options)`: Generates final JS code.
+- `buildTailwindCSS({ configPath, content })`: Compiles Tailwind CSS.
+- `findTailwindConfig(inputDir)`: Helper to locate tailwind.config.js.
+
+## Architecture
+
+The core is divided into several modules:
+
+1. **Parser**: Babel-based parser for modern JS/TS/JSX.
+2. **Transformer**: Traverses the AST to extract component logic and prepare it for generation.
+3. **Generator**: Takes the transformed data and produces the final string output.
+4. **Tailwind**: Handles class extraction and CSS compilation using PostCSS.
+5. **Runtime**: Minimalistic JS snippets for DOM manipulation and hooks support, which are embedded into the output.
+
+## License
+
+Proprietary. See main repository for details.