webhanger 1.0.0 → 1.0.4

package/helper/converter.js

@@ -0,0 +1,190 @@
+import fs from "fs-extra";
+import path from "path";
+
+/**
+ * Reads html/css/js from a component folder.
+ */
+async function readComponent(componentDir) {
+    const files = await fs.readdir(componentDir);
+    let html = "", css = "", js = "";
+
+    for (const file of files) {
+        const ext = path.extname(file).toLowerCase();
+        const content = await fs.readFile(path.join(componentDir, file), "utf-8");
+        if (ext === ".html") html = content.trim();
+        else if (ext === ".css") css = content.trim();
+        else if (ext === ".js") js = content.trim();
+    }
+
+    return { html, css, js };
+}
+
+// ─── Converters ───────────────────────────────────────────────────────────────
+
+function toReact(name, html, css, js) {
+    const componentName = name.charAt(0).toUpperCase() + name.slice(1);
+    // Convert class= to className= for JSX
+    const jsx = html.replace(/\bclass=/g, "className=");
+
+    return `import React, { useEffect } from 'react';
+
+const styles = \`
+${css}
+\`;
+
+export default function ${componentName}() {
+  useEffect(() => {
+    // Injected from original script.js
+    ${js || "// no script"}
+  }, []);
+
+  return (
+    <>
+      <style>{\`\${styles}\`}</style>
+      <div dangerouslySetInnerHTML={{ __html: \`${jsx.replace(/`/g, "\\`")}\` }} />
+    </>
+  );
+}
+`;
+}
+
+function toVue(name, html, css, js) {
+    return `<template>
+  <div v-html="markup" />
+</template>
+
+<script setup>
+import { onMounted } from 'vue';
+
+const markup = \`${html.replace(/`/g, "\\`")}\`;
+
+onMounted(() => {
+  ${js || "// no script"}
+});
+</script>
+
+<style scoped>
+${css}
+</style>
+`;
+}
+
+function toSvelte(name, html, css, js) {
+    return `<script>
+  import { onMount } from 'svelte';
+
+  onMount(() => {
+    ${js || "// no script"}
+  });
+</script>
+
+${html}
+
+<style>
+${css}
+</style>
+`;
+}
+
+function toNext(name, html, css, js) {
+    const componentName = name.charAt(0).toUpperCase() + name.slice(1);
+    const jsx = html.replace(/\bclass=/g, "className=");
+
+    return `'use client';
+import { useEffect } from 'react';
+
+const styles = \`
+${css}
+\`;
+
+export default function ${componentName}() {
+  useEffect(() => {
+    ${js || "// no script"}
+  }, []);
+
+  return (
+    <>
+      <style>{\`\${styles}\`}</style>
+      <div dangerouslySetInnerHTML={{ __html: \`${jsx.replace(/`/g, "\\`")}\` }} />
+    </>
+  );
+}
+`;
+}
+
+function toAngular(name, html, css, js) {
+    const componentName = name.charAt(0).toUpperCase() + name.slice(1);
+    const selector = `wh-${name.toLowerCase()}`;
+
+    return `import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: '${selector}',
+  template: \`${html.replace(/`/g, "\\`")}\`,
+  styles: [\`
+${css}
+  \`]
+})
+export class ${componentName}Component implements OnInit {
+  ngOnInit(): void {
+    ${js || "// no script"}
+  }
+}
+`;
+}
+
+function toAstro(name, html, css, js) {
+    return `---
+// ${name} component — converted by WebHanger
+${js ? `
+// Script logic moved to client-side
+` : ""}
+---
+
+${html}
+
+<style>
+${css}
+</style>
+
+${js ? `<script>
+${js}
+</script>` : ""}
+`;
+}
+
+// ─── Extension map ────────────────────────────────────────────────────────────
+
+const CONVERTERS = {
+    react:   { fn: toReact,   ext: ".jsx" },
+    next:    { fn: toNext,    ext: ".jsx" },
+    vue:     { fn: toVue,     ext: ".vue" },
+    svelte:  { fn: toSvelte,  ext: ".svelte" },
+    angular: { fn: toAngular, ext: ".component.ts" },
+    astro:   { fn: toAstro,   ext: ".astro" },
+};
+
+/**
+ * Converts a vanilla html/css/js component to a target framework component.
+ *
+ * @param {string} componentDir  - source folder with html/css/js
+ * @param {string} name          - component name e.g. "navbar"
+ * @param {string} target        - "react" | "vue" | "svelte" | "next" | "angular" | "astro"
+ * @param {string} outputDir     - where to write the converted file
+ */
+export async function convert(componentDir, name, target, outputDir = "./converted") {
+    const converter = CONVERTERS[target.toLowerCase()];
+    if (!converter) {
+        throw new Error(`Unknown target: "${target}". Supported: ${Object.keys(CONVERTERS).join(", ")}`);
+    }
+
+    const { html, css, js } = await readComponent(componentDir);
+    const code = converter.fn(name, html, css, js);
+    const fileName = `${name}${converter.ext}`;
+    const outPath = path.join(outputDir, fileName);
+
+    await fs.ensureDir(outputDir);
+    await fs.writeFile(outPath, code, "utf-8");
+
+    return { outPath, fileName, target, code };
+}

package/helper/crypto.js

@@ -0,0 +1,39 @@
+import crypto from "crypto";
+
+const ALGO = "aes-256-gcm";
+const KEY_LEN = 32;
+const IV_LEN = 12;
+
+/**
+ * Derives a 256-bit AES key from SHA-256(projectId + salt)
+ * Simple, fast, consistent between Node and browser.
+ */
+function deriveKey(projectId, salt) {
+    return crypto.createHash("sha256").update(projectId + salt).digest();
+}
+
+export function encrypt(plaintext, projectId, salt = "::wh") {
+    if (!plaintext) return "";
+    const key = deriveKey(projectId, salt);
+    const iv = crypto.randomBytes(IV_LEN);
+    const cipher = crypto.createCipheriv(ALGO, key, iv);
+    const encrypted = Buffer.concat([cipher.update(plaintext, "utf-8"), cipher.final()]);
+    const tag = cipher.getAuthTag();
+    return `${iv.toString("base64")}:${tag.toString("base64")}:${encrypted.toString("base64")}`;
+}
+
+export function decrypt(encoded, projectId, salt = "::wh") {
+    if (!encoded) return "";
+    const [ivB64, tagB64, dataB64] = encoded.split(":");
+    const key = deriveKey(projectId, salt);
+    const iv = Buffer.from(ivB64, "base64");
+    const tag = Buffer.from(tagB64, "base64");
+    const data = Buffer.from(dataB64, "base64");
+    const decipher = crypto.createDecipheriv(ALGO, key, iv);
+    decipher.setAuthTag(tag);
+    return Buffer.concat([decipher.update(data), decipher.final()]).toString("utf-8");
+}
+
+export function integrityHash(content) {
+    return crypto.createHash("sha256").update(content).digest("hex");
+}

package/helper/dbHandler.js

@@ -1,5 +1,6 @@
 import admin from "firebase-admin";
 import fs from "fs-extra";
+import path from "path";
 
 // ─── Firebase ─────────────────────────────────────────────────────────────────
 
@@ -7,7 +8,20 @@ let firebaseDb = null;
 
 function getFirestore(serviceAccountPath) {
     if (firebaseDb) return firebaseDb;
-    const serviceAccount = fs.readJsonSync(serviceAccountPath);
+    // Resolve path relative to cwd first, then walk up to find it
+    let resolvedPath = path.resolve(process.cwd(), serviceAccountPath);
+    if (!fs.existsSync(resolvedPath)) {
+        // Try resolving from parent directories
+        let dir = process.cwd();
+        for (let i = 0; i < 5; i++) {
+            const candidate = path.join(dir, path.basename(serviceAccountPath));
+            if (fs.existsSync(candidate)) { resolvedPath = candidate; break; }
+            const parent = path.dirname(dir);
+            if (parent === dir) break;
+            dir = parent;
+        }
+    }
+    const serviceAccount = fs.readJsonSync(resolvedPath);
     if (!admin.apps.length) {
         admin.initializeApp({ credential: admin.credential.cert(serviceAccount) });
     }

package/helper/loadConfig.js

@@ -1,19 +1,34 @@
 import fs from "fs";
 import path from "path";
 
-export default function loadConfig() {
-    const configPath = path.join(process.cwd(), "webhanger.config.json");
+export default function loadConfig(configPath = null) {
+    // 1. Explicit path passed in
+    // 2. WEBHANGER_CONFIG env var
+    // 3. Walk up from cwd until found
+    const candidates = [];
 
-    if (!fs.existsSync(configPath)) {
-        throw new Error("webhanger.config.json not found. Run `wh init` first.");
-    }
+    if (configPath) candidates.push(path.resolve(configPath));
+    if (process.env.WEBHANGER_CONFIG) candidates.push(path.resolve(process.env.WEBHANGER_CONFIG));
 
-    const raw = fs.readFileSync(configPath, "utf-8");
-    const config = JSON.parse(raw);
+    // Walk up directory tree from cwd
+    let dir = process.cwd();
+    for (let i = 0; i < 5; i++) {
+        candidates.push(path.join(dir, "webhanger.config.json"));
+        const parent = path.dirname(dir);
+        if (parent === dir) break;
+        dir = parent;
+    }
 
-    if (!config.projectId || !config.secretKey) {
-        throw new Error("Invalid config: missing projectId or secretKey.");
+    for (const candidate of candidates) {
+        if (fs.existsSync(candidate)) {
+            const raw = fs.readFileSync(candidate, "utf-8");
+            const config = JSON.parse(raw);
+            if (!config.projectId || !config.secretKey) {
+                throw new Error(`Invalid config at ${candidate}: missing projectId or secretKey.`);
+            }
+            return config;
+        }
     }
 
-    return config;
+    throw new Error("webhanger.config.json not found. Run `wh init` first.");
 }

package/index.js

@@ -149,4 +149,9 @@ export { upload, remove } from "./helper/bucketHandler.js";
 export { registerComponent, getComponent } from "./helper/dbHandler.js";
 export { provisionBucket, provisionCloudFront } from "./helper/awsProvisioner.js";
 export { deploy } from "./core/registry.js";
+export { resolve as resolveGraph } from "./core/resolver.js";
 export { default as loadConfig } from "./helper/loadConfig.js";
+export { analyzeComponent, autoGenerateComponentMeta } from "./helper/analyzer.js";
+export { convert } from "./helper/converter.js";
+export { build } from "./core/builder.js";
+export { grantAccess, revokeAccess, checkPermission, listAccess, generateApiKey } from "./helper/accessControl.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webhanger",
-  "version": "1.0.0",
+  "version": "1.0.4",
   "description": "Component-as-a-Service platform — bundle, sign, and deliver UI components via edge CDN",
   "type": "module",
   "main": "index.js",
@@ -18,16 +18,26 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "keywords": ["cdn", "components", "caas", "edge", "ui"],
+  "keywords": [
+    "cdn",
+    "components",
+    "caas",
+    "edge",
+    "ui"
+  ],
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@aws-sdk/client-s3": "^3.0.0",
     "@aws-sdk/client-cloudfront": "^3.0.0",
+    "@aws-sdk/client-s3": "^3.0.0",
     "@aws-sdk/s3-request-presigner": "^3.0.0",
+    "archiver": "^7.0.1",
     "chalk": "^5.6.2",
     "firebase-admin": "^12.0.0",
     "fs-extra": "^11.3.4",
     "inquirer": "^13.4.1"
+  },
+  "devDependencies": {
+    "terser": "^5.46.1"
   }
 }