neutronium 0.0.0 → 1.0.0

package/.babelrc

@@ -0,0 +1,11 @@
+{
+  "plugins": [
+    [
+      "@babel/plugin-transform-react-jsx",
+      {
+        "pragma": "h",
+        "pragmaFrag": "Fragment"
+      }
+    ]
+  ]
+}

package/README.md

@@ -1 +1,177 @@
-## just claiming the package name
+# Neutronium
+
+> Ultra-dense JavaScript framework - maximum performance, minimal overhead
+
+Neutronium is a lightweight, efficient JavaScript framework designed for building modern web applications with the density and stability of neutron star matter.
+
+## Features
+
+- 🚀 **Ultra-fast** - Optimized for performance
+- 📦 **Minimal bundle size** - Dense with features, light on complexity
+- 🎯 **Simple API** - Easy to learn and use
+- 🔧 **Flexible** - Adaptable to your project needs
+- 🌟 **Modern** - Built with current JavaScript standards
+
+## Installation
+
+```bash
+npm install neutronium
+```
+
+## Quick Start
+
+```javascript
+import { createComponent, render } from 'neutronium';
+
+// Create a simple component
+const HelloWorld = createComponent({
+  template: '<h1>Hello, {{name}}!</h1>',
+  props: { name: 'World' }
+});
+
+// Render to DOM
+render(HelloWorld, document.getElementById('app'));
+```
+
+## API Reference
+
+### `createComponent(options)`
+
+Creates a new component with the specified options.
+
+**Parameters:**
+- `options` (Object): Component configuration
+  - `template` (String): HTML template
+  - `props` (Object): Component properties
+  - `methods` (Object): Component methods
+
+**Returns:** Component instance
+
+### `render(component, target)`
+
+Renders a component to the specified DOM element.
+
+**Parameters:**
+- `component`: Component instance
+- `target`: DOM element to render into
+
+## Examples
+
+### Basic Component
+
+```javascript
+import { createComponent, render } from 'neutronium';
+
+const Counter = createComponent({
+  template: `
+    <div>
+      <h2>Count: {{count}}</h2>
+      <button onclick="increment()">+</button>
+      <button onclick="decrement()">-</button>
+    </div>
+  `,
+  props: {
+    count: 0
+  },
+  methods: {
+    increment() {
+      this.props.count++;
+    },
+    decrement() {
+      this.props.count--;
+    }
+  }
+});
+
+render(Counter, document.getElementById('app'));
+```
+
+### Component with State
+
+```javascript
+import { createComponent, render } from 'neutronium';
+
+const TodoList = createComponent({
+  template: `
+    <div>
+      <input type="text" placeholder="Add todo..." />
+      <button onclick="addTodo()">Add</button>
+      <ul>
+        {{#each todos}}
+          <li>{{this}}</li>
+        {{/each}}
+      </ul>
+    </div>
+  `,
+  props: {
+    todos: []
+  },
+  methods: {
+    addTodo() {
+      const input = this.element.querySelector('input');
+      if (input.value.trim()) {
+        this.props.todos.push(input.value);
+        input.value = '';
+      }
+    }
+  }
+});
+
+render(TodoList, document.getElementById('app'));
+```
+
+## Browser Support
+
+- Chrome 60+
+- Firefox 60+
+- Safari 12+
+- Edge 79+
+
+## Development
+
+```bash
+# Clone the repository
+git clone https://github.com/yourusername/neutronium.git
+
+# Install dependencies
+npm install
+
+# Run tests
+npm test
+
+# Build for production
+npm run build
+```
+
+## Contributing
+
+We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.
+
+1. Fork the repository
+2. Create your feature branch (`git checkout -b feature/amazing-feature`)
+3. Commit your changes (`git commit -m 'Add amazing feature'`)
+4. Push to the branch (`git push origin feature/amazing-feature`)
+5. Open a Pull Request
+
+## License
+
+MIT License - see the [LICENSE](LICENSE) file for details.
+
+## Roadmap
+
+- [ ] Server-side rendering support
+- [ ] TypeScript definitions
+- [ ] Developer tools integration
+- [ ] Plugin system
+- [ ] Performance optimizations
+- [ ] Advanced component lifecycle methods
+
+## Why Neutronium?
+
+Just like neutronium is the densest stable matter in the universe, Neutronium framework packs maximum functionality into minimal code. It's designed for developers who want powerful features without the bloat.
+
+---
+
+**Built with ⚛️ by [Your Name]**
+
+*"Dense with features, light on complexity"*

package/cli/index.js

@@ -0,0 +1,123 @@
+#!/usr/bin/env node
+const { default: inquirer } = require('inquirer');
+const fs = require('fs');
+const path = require('path');
+const { execSync } = require('child_process');
+const babel = require('@babel/core');
+
+const [, , command, ...args] = process.argv;
+
+// App.js with JSX
+const AppJs = `
+import { h, createApp } from 'neutronium';
+
+function App() {
+    return (
+        <div class="container">
+            <h1>Hello from Neutronium!</h1>
+            <p>Start building your app in JSX!</p>
+        </div>
+    );
+}
+
+createApp(App).mount('#app');
+`;
+
+// HTML template with __SCRIPT__ placeholder
+const htmlTemplate = `
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8" />
+  <title>${appName}</title>
+</head>
+<body>
+  <div id="app"></div>
+  <script type="module">
+  __SCRIPT__
+  </script>
+</body>
+</html>
+`;
+
+async function init() {
+  let targetPath = process.cwd();
+  let createdFolder = false;
+
+  const { confirmInit } = await inquirer.prompt([
+    {
+      type: 'confirm',
+      name: 'confirmInit',
+      message: 'Initialize a Neutronium app in this folder?',
+      default: true
+    }
+  ]);
+
+  if (!confirmInit) {
+    const { projectName } = await inquirer.prompt([
+      {
+        type: 'input',
+        name: 'projectName',
+        message: 'Please enter your project name:',
+        default: 'neutronium-app'
+      }
+    ]);
+    targetPath = path.resolve(process.cwd(), projectName);
+    createdFolder = true;
+    if (!fs.existsSync(targetPath)) fs.mkdirSync(targetPath);
+    else console.log('⚠️ Folder already exists. Using it anyway.');
+  }
+
+  // Write App.js
+  const appPath = path.join(targetPath, 'App.js');
+  fs.writeFileSync(appPath, AppJs.trim());
+
+  // Init package.json
+  execSync('npm init -y', { cwd: targetPath, stdio: 'inherit' });
+
+  // Install neutronium
+  execSync('npm install neutronium', { cwd: targetPath, stdio: 'inherit' });
+
+  // Install Babel for JSX support
+  execSync('npm install --save-dev @babel/core @babel/cli @babel/plugin-transform-react-jsx', {
+    cwd: targetPath,
+    stdio: 'inherit'
+  });
+
+  // Compile App.js to script string
+  const appJsCode = fs.readFileSync(appPath, 'utf-8');
+  const result = babel.transformSync(appJsCode, {
+    filename: 'App.js',
+    plugins: [['@babel/plugin-transform-react-jsx', { pragma: 'h' }]]
+  });
+
+  // Inject into HTML
+  const finalHtml = htmlTemplate.replace('__SCRIPT__', result.code);
+
+  const distPath = path.join(targetPath, 'dist');
+  if (!fs.existsSync(distPath)) fs.mkdirSync(distPath);
+  fs.writeFileSync(path.join(distPath, 'index.html'), finalHtml);
+
+  const folder = createdFolder ? `cd ${path.basename(targetPath)}` : '';
+  console.log('\n✅ Neutronium app is ready!');
+  console.log(`➡️  Run the following to get started:\n\n   ${folder}\n   npx serve dist\n`);
+}
+
+const { compileProject, compileProjectWatch } = require('../compiler/compiler');
+
+switch (command) {
+  case 'init':
+  case 'create-app':
+  case 'create-neutronium-app':
+    init();
+    break;
+  case 'start':
+        if (args[0] == "--watch") {
+          compileProjectWatch(); // Will read App.js and output dist/index.html
+        } else {
+          compileProject()
+        }
+  default:
+    console.log('❌ Unknown command.');
+    console.log('Usage: neu-cli init');
+}

package/compiler/compiler.js

@@ -0,0 +1,104 @@
+const babel = require('@babel/core');
+const path = require('path');
+const fs = require('fs');
+const { baseHtml } = require('./template');
+const { log, writeFile, ensureDir } = require('./utils');
+const chokidar = require('chokidar');
+const http = require('http');
+const { default: Mime } = require('mime');
+const WebSocket = require('ws');
+const { default: open } = require('open');
+
+function compileProject(projectDir = process.cwd()) {
+  const appJsPath = path.join(projectDir, 'App.js');
+  const distDir = path.join(projectDir, 'dist');
+  const outHtmlPath = path.join(distDir, 'index.html');
+  const outJsPath = path.join(distDir, 'App.compiled.js');
+  const srcIndexPath = path.relative(distDir, path.join(projectDir, 'src/index.js')).replace(/\\/g, '/');
+
+  try {
+    log('📖 Reading App.js...');
+    const sourceCode = fs.readFileSync(appJsPath, 'utf-8');
+
+    log('⚙️ Compiling JSX with Babel...');
+    const { code: transpiled } = babel.transformSync(sourceCode, {
+      filename: 'App.js',
+      presets: [['@babel/preset-env', { targets: { esmodules: true } }]],
+      plugins: [['@babel/plugin-transform-react-jsx', { pragma: 'h' }]],
+    });
+
+    // Inject framework import + mount call
+    const finalJsCode = `
+import { h, createApp } from '${srcIndexPath}';
+
+${transpiled}
+
+createApp(App).mount('#app');
+`.trim();
+
+    ensureDir(distDir);
+    writeFile(outJsPath, finalJsCode);
+
+    log('🛠️ Generating index.html...');
+    const finalHtml = baseHtml(`<div id="app"></div>`, 'App.compiled.js');
+    writeFile(outHtmlPath, finalHtml);
+
+    log('✅ Compilation complete!');
+    log(`➡️ Output: ${outHtmlPath}`);
+  } catch (e) {
+    console.error('❌ Compilation failed:', e.message);
+  }
+}
+
+function compileProjectWatch(projectDir = process.cwd(), port = 3000) {
+  const appJsPath = path.join(projectDir, 'App.js');
+
+  const server = serveProject(projectDir, port);
+  compileProject(projectDir);
+
+  log('👀 Watching App.js for changes...');
+  chokidar.watch(appJsPath).on('change', () => {
+    console.clear();
+    log('🔁 Detected change in App.js...');
+    compileProject(projectDir);
+    if (server.broadcastReload) {
+      server.broadcastReload();
+    }
+  });
+}
+
+function serveProject(projectDir = process.cwd(), port = 3000) {
+  const distDir = path.join(projectDir, 'dist');
+  const server = http.createServer((req, res) => {
+    let reqPath = req.url === '/' ? '/index.html' : req.url;
+    const filePath = path.join(distDir, reqPath);
+
+    if (!fs.existsSync(filePath)) {
+      res.writeHead(404);
+      return res.end('404 Not Found');
+    }
+
+    const content = fs.readFileSync(filePath);
+    res.writeHead(200, { 'Content-Type': Mime.getType(filePath) });
+    res.end(content);
+  });
+
+  const wss = new WebSocket.Server({ server });
+
+  server.broadcastReload = () => {
+    wss.clients.forEach(client => {
+      if (client.readyState === WebSocket.OPEN) {
+        client.send('reload');
+      }
+    });
+  };
+
+  server.listen(port, () => {
+    log(`🚀 Server running at http://localhost:${port}`);
+    open(`http://localhost:${port}`);
+  });
+
+  return server;
+}
+
+module.exports = { compileProject, compileProjectWatch };

package/compiler/template.js

@@ -0,0 +1,26 @@
+function baseHtml(bodyHtml, scriptFile = 'App.compiled.js') {
+  return `
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8" />
+  <title>Neutronium App</title>
+</head>
+<body>
+  ${bodyHtml}
+  <script type="module" src="./${scriptFile}"></script>
+  <script>
+    const ws = new WebSocket('ws://' + location.host);
+    ws.onmessage = (msg) => {
+      if (msg.data === 'reload') {
+        console.log('[Neutronium] Reloading...');
+        location.reload();
+      }
+    };
+  </script>
+</body>
+</html>
+`.trim();
+}
+
+module.exports = { baseHtml };

package/compiler/utils.js

@@ -0,0 +1,22 @@
+// compiler/utils.js
+
+const fs = require('fs');
+const path = require('path');
+
+function writeFile(filePath, content) {
+    fs.writeFileSync(filePath, content, 'utf-8');
+}
+
+function readFile(filePath) {
+    return fs.readFileSync(filePath, 'utf-8');
+}
+
+function ensureDir(dir) {
+    if (!fs.existsSync(dir)) fs.mkdirSync(dir);
+}
+
+function log(msg) {
+    console.log(`🔹 ${msg}`);
+}
+
+module.exports = { writeFile, readFile, ensureDir, log };

package/package.json

@@ -1,13 +1,44 @@
 {
   "name": "neutronium",
-  "version": "0.0.0",
-  "description": "",
-  "main": "index.js",
+  "version": "1.0.0",
+  "description": "A dense, efficient JavaScript framework for building modern web applications",
+  "main": "src/index.js",
+  "type": "commonjs",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "start": "node test/App.js"
   },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
-  "type": "commonjs"
+  "export": {
+    ".": "src/index.js"
+  },
+  "bin": {
+    "neu-cli": "./cli/index.js",
+    "neu": "src/index.js"
+  },
+  "exports": {
+    ".": "./src/index.js"
+  },
+  "keywords": [
+    "framework",
+    "javascript",
+    "frontend",
+    "ui",
+    "components"
+  ],
+  "author": "PFMCODES",
+  "license": "MIT",
+  "dependencies": {
+    "chokidar": "^4.0.3",
+    "inquirer": "^12.7.0",
+    "jsdom": "^26.1.0",
+    "mime": "^4.0.7",
+    "open": "^10.1.2",
+    "ws": "^8.18.3"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.28.0",
+    "@babel/core": "^7.28.0",
+    "@babel/plugin-transform-react-jsx": "^7.27.1",
+    "@babel/preset-env": "^7.28.0",
+    "@babel/preset-react": "^7.27.1"
+  }
 }

package/src/index.js

@@ -0,0 +1,41 @@
+// src/index.js
+
+function h(type, props = {}, ...children) {
+  const el = document.createElement(type);
+
+  for (const [key, value] of Object.entries(props || {})) {
+    if (key.startsWith('on') && typeof value === 'function') {
+      el.addEventListener(key.slice(2).toLowerCase(), value);
+    } else {
+      el.setAttribute(key, value);
+    }
+  }
+
+  children.flat().forEach(child => {
+    if (typeof child === 'string' || typeof child === 'number') {
+      el.appendChild(document.createTextNode(child));
+    } else if (child instanceof Node) {
+      el.appendChild(child);
+    }
+  });
+
+  return el;
+}
+
+function createApp(component) {
+  return {
+    mount(selector) {
+      const root = document.querySelector(selector);
+      if (!root) {
+        console.error(`❌ Root element '${selector}' not found`);
+        return;
+      }
+
+      const vnode = component();
+      root.innerHTML = '';
+      root.appendChild(vnode);
+    }
+  };
+}
+
+module.exports = { h, createApp };

package/test-open.js

@@ -0,0 +1,6 @@
+
+const { default:open } = require('open');
+
+open('http://localhost:3000').catch(err => {
+  console.error('❌ Failed to open browser:', err);
+});