jpsx 0.1.16 → 0.1.19

package/README.md

@@ -1,242 +1,143 @@
-# JPS (Just Python Script)
-
-A Python-like language that compiles to JavaScript, designed to integrate seamlessly with **any frontend framework**.
-
-[![npm version](https://img.shields.io/npm/v/jps.svg)](https://www.npmjs.com/package/jps)
-[![License: ISC](https://img.shields.io/badge/License-ISC-blue.svg)](LICENSE)
-
-## ✨ Features
-
-- 🐍 **Python-like syntax** that compiles to clean JavaScript
-- ⚡ **Standalone file integration** - Import `.jps` files like `.jsx/.tsx` files!
-- 🔥 **Hot Module Replacement (HMR)** - Instant feedback during development
-- ⚡ **Zero-config integration** with React, Vue, Svelte, Angular, and more
-- 📦 **Multiple output formats**: ESM, CommonJS, IIFE, UMD
-- 🔌 **Flexible runtime modes**: Inline, external, CDN, or custom
-- 🛠️ **Build tool plugins** for Vite, Webpack, Rollup, esbuild
-- 🌐 **Browser-ready**: Works without any build step
-- 📝 **TypeScript support** with auto-generated declarations
-
-## 🚀 Quick Start
-
-### Standalone File Integration (⚡ Recommended)
-
-Import `.jps` files directly in your code - just like `.tsx` files!
-
-```python
-# math.jps - a real file!
-def add(a, b):
-    return a + b
-
-class Calculator:
-    def __init__(self):
-        self.value = 0
-```
-
-```typescript
-// App.tsx - just import and use!
-import { add, Calculator } from './math.jps';
-
-const sum = add(10, 20);
-const calc = new Calculator();
-```
-
-**[See full example →](examples/react-vite-standalone/)**
-
----
-
-### As a CLI Tool
-
-```bash
-# Install globally
-npm install -g jps
-
-# Create a new project
-jps init my-project
-cd my-project
-jps run main.jps
-```
-
-### As a Library (Runtime Compilation)
-
-```bash
-# Install in your project
-npm install jps
-```
-
-#### React
-
-```javascript
-import { compile } from 'jps';
-
-function App() {
-  const jpsCode = `
-def greet(name):
-    return "Hello, " + name
-
-print(greet("React"))
-  `;
-
-  const result = compile(jpsCode, {
-    format: 'iife',
-    runtimeMode: 'inline'
-  });
-
-  eval(result.code); // Outputs: Hello, React
-}
-```
-
-#### Vue
-
-```vue
-<script setup>
-import { compile } from 'jps';
-const result = compile('print("Hello Vue!")', {
-  format: 'iife',
-  runtimeMode: 'inline'
-});
-eval(result.code);
-</script>
-```
-
-#### Browser (No Build Step)
-
-```html
-<script type="module">
-  import { compile } from 'https://cdn.jsdelivr.net/npm/jps@latest/dist/api/index.js';
-  const result = compile('print("Hello Browser!")', {
-    format: 'iife',
-    runtimeMode: 'inline'
-  });
-  eval(result.code);
-</script>
-```
-
-## 📖 Documentation
-
-- **[Standalone File Integration](docs/STANDALONE_INTEGRATION.md)** - ⚡ Import .jps like .tsx (recommended!)
-- **[Integration Guide](docs/INTEGRATION.md)** - Complete guide for all frameworks
-- **[Quick Start](docs/QUICKSTART.md)** - 30-second integration examples
-- **[Syntax Guide](docs/syntax.md)** - JPS language syntax
-- **[Standard Library](docs/stdlib.md)** - Built-in functions
-- **[API Reference](docs/API.md)** - Programmatic API
-
-## 🎯 Use Cases
-
-- **Code Playgrounds**: Build interactive Python-like editors
-- **Educational Tools**: Teach Python concepts in the browser
-- **Scripting**: Add Python-like scripting to your JavaScript app
-- **DSL**: Create domain-specific languages with Python syntax
-- **Prototyping**: Rapid development with Python-like syntax
-
-## 📦 CLI Commands
-
-- `jps build <file>` - Compile JPS to JavaScript
-- `jps run <file>` - Compile and execute
-- `jps watch <file>` - Watch for changes and recompile
-- `jps init [name]` - Initialize a new JPS project
-- `jps doctor` - Verify environment setup
-
-## 🔧 Programmatic API
-
-```javascript
-import { compile, compileToJS, getRuntime } from 'jps';
-
-// Full API with metadata
-const result = compile(source, {
-  format: 'esm',           // Output format: 'esm' | 'cjs' | 'iife' | 'umd'
-  runtimeMode: 'inline',   // Runtime: 'inline' | 'external' | 'cdn' | 'none'
-  moduleName: 'MyApp',     // For IIFE/UMD
-  sourceMap: true,         // Include source maps
-  standalone: false        // Bundle everything
-});
-
-// Simple API (just returns code)
-const jsCode = compileToJS(source);
-
-// Get runtime library code
-const runtime = getRuntime();
-```
-
-## 🎨 Framework Examples
-
-Check out the [examples/](examples/) directory for complete working examples:
-
-- **React** - Vite plugin, Webpack loader, runtime compilation
-- **Vue 3** - Composition API integration
-- **Svelte** - Component integration
-- **Angular** - Service integration
-- **Next.js** - App Router and Pages Router
-- **Vanilla Browser** - No build step required
-
-## 🛠️ Build Tool Plugins
-
-### Vite
-
-```javascript
-// vite.config.js
-import { jpsPlugin } from './vite-plugin-jps';
-
-export default {
-  plugins: [jpsPlugin()]
-};
-```
-
-### Webpack
-
-```javascript
-// webpack.config.js
-module.exports = {
-  module: {
-    rules: [
-      { test: /\.jps$/, use: 'jps-loader' }
-    ]
-  }
-};
-```
-
-See [INTEGRATION.md](docs/INTEGRATION.md) for Rollup, esbuild, and more.
-
-## 🌟 Why JPS?
-
-1. **Framework Agnostic**: Works with React, Vue, Svelte, Angular, and vanilla JS
-2. **Flexible Output**: Choose the format that fits your needs
-3. **Modern & Production-Ready**: Built with TypeScript, full test coverage
-4. **Developer Friendly**: Simple API, great error messages, comprehensive docs
-5. **Lightweight**: Minimal dependencies, tree-shakeable
-
-## 🏗️ Development
-
-Prerequisites: Node.js 18+
-
-```bash
-# Clone the repository
-git clone https://github.com/your-repo/jps.git
-cd jps
-
-# Install dependencies
-npm install
-
-# Build the project
-npm run build
-
-# Run tests
-npm test
-```
-
-## 📄 License
-
-ISC - See [LICENSE](LICENSE) file for details
-
-## 🤝 Contributing
-
-Contributions are welcome! Please read our contributing guidelines first.
-
-## 📮 Support
-
-- **Issues**: [GitHub Issues](https://github.com/your-repo/jps/issues)
-- **Discussions**: [GitHub Discussions](https://github.com/your-repo/jps/discussions)
-
----
-
-**Made with ❤️ by Loaii abdalslam**
+# JPS (Just Python Script)
+![unnamed (8)](https://github.com/user-attachments/assets/bb92dc31-d62f-4560-8cf0-6935de1ed70a)
+
+A Python-like language that compiles to JavaScript, designed to integrate seamlessly with **any frontend framework**.
+
+[![npm version](https://img.shields.io/npm/v/jpsx.svg)](https://www.npmjs.com/package/jpsx)
+[![License: ISC](https://img.shields.io/badge/License-ISC-blue.svg)](LICENSE)
+<a href="https://www.producthunt.com/products/jps?embed=true&utm_source=badge-featured&utm_medium=badge&utm_campaign=badge-jps" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=1067365&theme=light" alt="JPS - New Programming Language | Write Python-like in Javascript | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
+
+---
+
+## 🚀 Quick Start
+
+### Installation
+
+```bash
+# Install as a library in your project
+npm install jpsx
+
+# Or install globally as a CLI tool
+npm install -g jpsx
+```
+
+### ⚡ Standalone File Integration (Recommended)
+
+Import `.jps` files directly in your code - just like `.tsx` files!
+
+**math.jps**
+```python
+def add(a, b):
+    return a + b
+
+class Calculator:
+    def __init__(self):
+        self.value = 0
+```
+
+**App.tsx**
+```typescript
+import { add, Calculator } from './math.jps';
+
+const sum = add(10, 20);
+const calc = new Calculator();
+```
+
+---
+
+## ✨ Features
+
+- 🐍 **Python-like syntax** that compiles to clean JavaScript
+- ⚡ **Standalone file integration** - Import `.jps` files like `.jsx/.tsx` files!
+- 🔥 **Hot Module Replacement (HMR)** - Instant feedback during development
+- ⚡ **Zero-config integration** with React, Vue, Svelte, Angular, and more
+- 📦 **Multiple output formats**: ESM, CommonJS, IIFE, UMD
+- 🔌 **Flexible runtime modes**: Inline, external, CDN, or custom
+- 🛠️ **Build tool plugins** for Vite, Webpack, Rollup, esbuild
+- 🌐 **Browser-ready**: Works without any build step
+- 📝 **TypeScript support** with auto-generated declarations
+
+---
+
+## 📖 Documentation & Guidelines
+
+### 1. Language Syntax
+JPS supports core Python syntax tailored for the JavaScript ecosystem.
+
+| Feature | JPS Syntax | Compiles to JS |
+|---------|------------|----------------|
+| **Function** | `def foo(a): return a` | `function foo(a) { return a; }` |
+| **Class** | `class User: ...` | `class User { ... }` |
+| **Loop** | `for i in range(5): ...` | `for (let i = 0; i < 5; i++) ...` |
+| **List Comp** | `[x*2 for x in nums]` | `nums.map(x => x * 2)` |
+
+### 2. Runtime Functions
+Built-in Python-like functions available globally:
+- `print(args)`
+- `len(obj)`
+- `range(start, stop, step)`
+- `sum(iterable)`
+- `min() / max()`
+- `sorted(iterable)`
+
+### 3. CLI Usage
+
+```bash
+# Initialize a new JPS project
+jps init my-project
+cd my-project
+
+# Run a JPS file directly
+jps run main.jps
+
+# Build for production
+jps build main.jps --format esm
+```
+
+### 4. Integration Guide
+
+**Vite Plugin**
+```javascript
+// vite.config.js
+import { jpsPlugin } from 'vite-plugin-jpsx';
+
+export default {
+  plugins: [jpsPlugin()]
+};
+```
+
+**Webpack Loader**
+```javascript
+// webpack.config.js
+module.exports = {
+  module: {
+    rules: [
+      { test: /\.jps$/, use: 'jpsx-loader' }
+    ]
+  }
+};
+```
+
+---
+
+## 🌟 Support Us
+
+We are live on Product Hunt! If you like JPS, please support us:
+
+<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; border: 1px solid rgb(224, 224, 224); border-radius: 12px; padding: 20px; max-width: 500px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 8px;">
+  <div style="display: flex; align-items: center; gap: 12px; margin-bottom: 12px;">
+    <img alt="JPS" src="https://ph-files.imgix.net/99b42643-283d-47de-970f-27ae2be5a99a.jpeg?auto=format&fit=crop&w=80&h=80" style="width: 64px; height: 64px; border-radius: 8px; object-fit: cover; flex-shrink: 0;">
+    <div style="flex: 1 1 0%; min-width: 0px;">
+      <h3 style="margin: 0px; font-size: 18px; font-weight: 600; color: rgb(26, 26, 26); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">JPS</h3>
+      <p style="margin: 4px 0px 0px; font-size: 14px; color: rgb(102, 102, 102); line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;">New Programming Language | Write Python-like in Javascript</p>
+    </div>
+  </div>
+  <a href="https://www.producthunt.com/products/jps?embed=true&utm_source=embed&utm_medium=post_embed" target="_blank" rel="noopener" style="display: inline-flex; align-items: center; gap: 4px; margin-top: 12px; padding: 8px 16px; background: rgb(255, 97, 84); color: rgb(255, 255, 255); text-decoration: none; border-radius: 8px; font-size: 14px; font-weight: 600;">Check it out on Product Hunt →</a>
+</div>
+
+---
+
+## 📄 License
+ISC - See [LICENSE](LICENSE)
+
+**Made with ❤️ by Loaii abdalslam**

package/dist/api/__tests__/compile.test.js

@@ -75,11 +75,11 @@ describe("compile() - Runtime Modes", () => {
     const source = 'print("test")';
     test("should use external runtime by default", () => {
         const result = compile(source);
-        expect(result.code).toContain("./jps_runtime.js");
+        expect(result.code).toContain("jps/runtime");
     });
     test("should use external runtime mode", () => {
         const result = compile(source, { runtimeMode: "external" });
-        expect(result.code).toContain("jps_runtime");
+        expect(result.code).toContain("jps/runtime");
     });
     test("should inline runtime code", () => {
         const result = compile(source, { runtimeMode: "inline" });