webhanger 1.0.1 → 1.0.5

package/core/resolver.js

@@ -0,0 +1,63 @@
+import { getComponent } from "../helper/dbHandler.js";
+
+/**
+ * Resolves a full dependency graph for a component.
+ * Returns a flat ordered array of components to load — deps first, then the component.
+ * Detects circular dependencies and throws.
+ *
+ * @param {object} dbConfig
+ * @param {string} projectId
+ * @param {string} name
+ * @param {string} version
+ * @returns {Array<{name, version, cdnUrl, token, expires}>}
+ */
+export async function resolve(dbConfig, projectId, name, version) {
+    const visited = new Set();
+    const order = [];
+
+    async function walk(n, v, chain = []) {
+        const key = `${n}@${v}`;
+
+        // Circular dependency check
+        if (chain.includes(key)) {
+            throw new Error(`Circular dependency detected: ${[...chain, key].join(" → ")}`);
+        }
+
+        // Already resolved
+        if (visited.has(key)) return;
+        visited.add(key);
+
+        const meta = await getComponent(dbConfig, projectId, n, v);
+        if (!meta) throw new Error(`Component ${key} not found in registry.`);
+
+        // Walk dependencies first (depth-first)
+        if (meta.dependencies && meta.dependencies.length) {
+            for (const dep of meta.dependencies) {
+                const [depName, depVersion] = parseDep(dep);
+                await walk(depName, depVersion, [...chain, key]);
+            }
+        }
+
+        order.push({
+            name: n,
+            version: v,
+            cdnUrl: meta.cdnUrl,
+            token: meta.token,
+            expires: meta.expires,
+            assets: meta.assets || []
+        });
+    }
+
+    await walk(name, version);
+    return order;
+}
+
+/**
+ * Parses "navbar@1.2.0" → ["navbar", "1.2.0"]
+ * Parses "navbar" → ["navbar", "latest"]
+ */
+export function parseDep(dep) {
+    const atIndex = dep.lastIndexOf("@");
+    if (atIndex <= 0) return [dep, "latest"];
+    return [dep.slice(0, atIndex), dep.slice(atIndex + 1)];
+}

package/helper/accessControl.js

@@ -0,0 +1,112 @@
+/**
+ * WebHanger Access Control
+ * Role-based permissions stored in DB per project.
+ *
+ * Roles:    owner | admin | deployer | viewer
+ * Actions:  deploy | read | delete | manage_access
+ *
+ * Storage: projects/{projectId}/access/{apiKey}
+ * {
+ *   role: "deployer",
+ *   permissions: ["deploy", "read"],
+ *   createdAt: ...,
+ *   label: "CI/CD key"
+ * }
+ */
+
+import crypto from "crypto";
+
+// ─── Permission matrix ────────────────────────────────────────────────────────
+
+const ROLE_PERMISSIONS = {
+    owner:    ["deploy", "read", "delete", "manage_access"],
+    admin:    ["deploy", "read", "delete", "manage_access"],
+    deployer: ["deploy", "read"],
+    viewer:   ["read"]
+};
+
+// ─── Key generation ───────────────────────────────────────────────────────────
+
+export function generateApiKey() {
+    return `wh_key_${crypto.randomBytes(24).toString("hex")}`;
+}
+
+// ─── Firebase RBAC ───────────────────────────────────────────────────────────
+
+async function getFirestore(serviceAccountPath) {
+    const admin = (await import("firebase-admin")).default;
+    const fs = (await import("fs-extra")).default;
+    const serviceAccount = fs.readJsonSync(serviceAccountPath);
+    if (!admin.apps.length) {
+        admin.initializeApp({ credential: admin.credential.cert(serviceAccount) });
+    }
+    return admin.firestore();
+}
+
+/**
+ * Grant a role to an API key for a project.
+ */
+export async function grantAccess(dbConfig, projectId, apiKey, role, label = "") {
+    if (!ROLE_PERMISSIONS[role]) throw new Error(`Unknown role: ${role}. Valid: ${Object.keys(ROLE_PERMISSIONS).join(", ")}`);
+
+    if (dbConfig.provider === "firebase") {
+        const db = await getFirestore(dbConfig.serviceAccountPath);
+        await db.collection("projects").doc(projectId)
+            .collection("access").doc(apiKey)
+            .set({
+                role,
+                permissions: ROLE_PERMISSIONS[role],
+                label,
+                createdAt: new Date().toISOString()
+            });
+        return { apiKey, role, permissions: ROLE_PERMISSIONS[role] };
+    }
+    throw new Error(`Access control not yet supported for provider: ${dbConfig.provider}`);
+}
+
+/**
+ * Revoke access for an API key.
+ */
+export async function revokeAccess(dbConfig, projectId, apiKey) {
+    if (dbConfig.provider === "firebase") {
+        const db = await getFirestore(dbConfig.serviceAccountPath);
+        await db.collection("projects").doc(projectId)
+            .collection("access").doc(apiKey).delete();
+        return true;
+    }
+    throw new Error(`Access control not yet supported for provider: ${dbConfig.provider}`);
+}
+
+/**
+ * Check if an API key has permission to perform an action.
+ * Returns the access record or throws if unauthorized.
+ */
+export async function checkPermission(dbConfig, projectId, apiKey, action) {
+    if (dbConfig.provider === "firebase") {
+        const db = await getFirestore(dbConfig.serviceAccountPath);
+        const snap = await db.collection("projects").doc(projectId)
+            .collection("access").doc(apiKey).get();
+
+        if (!snap.exists) throw new Error("Unauthorized: API key not found.");
+
+        const access = snap.data();
+        if (!access.permissions.includes(action)) {
+            throw new Error(`Forbidden: role "${access.role}" cannot perform "${action}".`);
+        }
+        return access;
+    }
+    throw new Error(`Access control not yet supported for provider: ${dbConfig.provider}`);
+}
+
+/**
+ * List all access entries for a project.
+ */
+export async function listAccess(dbConfig, projectId) {
+    if (dbConfig.provider === "firebase") {
+        const db = await getFirestore(dbConfig.serviceAccountPath);
+        const snap = await db.collection("projects").doc(projectId)
+            .collection("access").get();
+        return snap.docs.map(d => ({ apiKey: d.id, ...d.data() }));
+    }
+    throw new Error(`Access control not yet supported for provider: ${dbConfig.provider}`);
+}

package/helper/breakdown.js

@@ -0,0 +1,63 @@
+import fs from "fs-extra";
+import path from "path";
+
+/**
+ * Breakdown Engine
+ * Detects a single HTML file with embedded <style> and <script> tags.
+ * Extracts them into separate index.html, style.css, script.js files.
+ * Works on component folders OR standalone HTML files.
+ */
+export async function breakdown(componentDir) {
+    const files = await fs.readdir(componentDir);
+    const htmlFiles = files.filter(f => f.endsWith(".html"));
+    const hasCSS = files.some(f => f.endsWith(".css"));
+    const hasJS  = files.some(f => f.endsWith(".js") && f !== "webhanger.component.json");
+
+    // Only run if there's exactly one HTML file and no separate css/js yet
+    if (htmlFiles.length !== 1 || (hasCSS && hasJS)) return false;
+
+    const htmlPath = path.join(componentDir, htmlFiles[0]);
+    const raw = await fs.readFile(htmlPath, "utf-8");
+
+    // Extract all <style> blocks
+    const styleMatches = [...raw.matchAll(/<style[^>]*>([\s\S]*?)<\/style>/gi)];
+    const css = styleMatches.map(m => m[1].trim()).join("\n\n");
+
+    // Extract all <script> blocks (non-src)
+    const scriptMatches = [...raw.matchAll(/<script(?![^>]*src)[^>]*>([\s\S]*?)<\/script>/gi)];
+    const js = scriptMatches.map(m => m[1].trim()).join("\n\n");
+
+    // Strip <style> and <script> from HTML, clean up blank lines
+    let html = raw
+        .replace(/<style[^>]*>[\s\S]*?<\/style>/gi, "")
+        .replace(/<script(?![^>]*src)[^>]*>[\s\S]*?<\/script>/gi, "")
+        .replace(/\n{3,}/g, "\n\n")
+        .trim();
+
+    // Strip outer <html><head><body> wrapper if present — keep inner content only
+    const bodyMatch = html.match(/<body[^>]*>([\s\S]*?)<\/body>/i);
+    if (bodyMatch) html = bodyMatch[1].trim();
+
+    const changed = css || js;
+    if (!changed) return false;
+
+    // Write extracted files
+    await fs.writeFile(path.join(componentDir, "index.html"), html, "utf-8");
+    if (css) await fs.writeFile(path.join(componentDir, "style.css"), css, "utf-8");
+    if (js)  await fs.writeFile(path.join(componentDir, "script.js"), js, "utf-8");
+
+    // Rename original if it wasn't index.html
+    if (htmlFiles[0] !== "index.html") {
+        await fs.remove(htmlPath);
+    }
+
+    return {
+        extracted: {
+            html: !!html,
+            css: !!css,
+            js: !!js
+        },
+        cssLines: css.split("\n").length,
+        jsLines:  js.split("\n").length
+    };
+}

package/helper/bundler.js

@@ -1,14 +1,9 @@
 import fs from "fs-extra";
 import path from "path";
 import { autoGenerateComponentMeta } from "./analyzer.js";
+import { encrypt, integrityHash } from "./crypto.js";
+import { breakdown } from "./breakdown.js";
 
-function xorEncode(str, key) {
-    let out = "";
-    for (let i = 0; i < str.length; i++) {
-        out += String.fromCharCode(str.charCodeAt(i) ^ key.charCodeAt(i % key.length));
-    }
-    return out;
-}
 
 /**
  * Bundles html+css+js into an encrypted JSON payload.
@@ -16,6 +11,12 @@ function xorEncode(str, key) {
  * Each chunk is XOR-encoded with projectId + chunk-type salt, then base64.
  */
 export async function bundle(componentDir, projectId) {
+    // Auto-breakdown: extract <style>/<script> from single HTML file if needed
+    const broke = await breakdown(componentDir);
+    if (broke) {
+        console.log(`  ✓ Breakdown: extracted CSS (${broke.cssLines} lines) + JS (${broke.jsLines} lines) from single file`);
+    }
+
     // Auto-detect + generate webhanger.component.json before bundling
     const { analysis } = await autoGenerateComponentMeta(componentDir);
     console.log(`  ✓ Framework detected: ${analysis.framework}`);
@@ -44,26 +45,17 @@ export async function bundle(componentDir, projectId) {
         throw new Error("Component must have at least an .html or .js file.");
     }
 
-    // UTF-8 safe XOR — operate on bytes not char codes
-    // Fixes special chars (©, accents, emoji) breaking atob in browser
-    const encrypt = (content, salt) => {
-        if (!content) return "";
-        const key = projectId + salt;
-        const bytes = Buffer.from(content, "utf-8");
-        const keyBytes = Buffer.from(key, "utf-8");
-        const out = Buffer.alloc(bytes.length);
-        for (let i = 0; i < bytes.length; i++) {
-            out[i] = bytes[i] ^ keyBytes[i % keyBytes.length];
-        }
-        return out.toString("base64");
-    };
+    // AES-256-GCM encrypt each chunk with per-chunk salt
+    const encryptChunk = (content, salt) => encrypt(content, projectId, salt);
 
     const payload = {
-        v: 1,
-        h: encrypt(html, "::html"),
-        c: encrypt(css,  "::css"),
-        j: encrypt(js,   "::js"),
-        assets: meta.assets || []  // CDN assets passed in plaintext — they're public URLs
+        v: 2,                                    // version 2 = AES encrypted
+        h: encryptChunk(html, "::html"),
+        c: encryptChunk(css,  "::css"),
+        j: encryptChunk(js,   "::js"),
+        assets: meta.assets || [],
+        dependencies: meta.dependencies || [],
+        integrity: integrityHash(html + css + js) // tamper detection
     };
 
     return JSON.stringify(payload);

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/index.js

@@ -149,6 +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.1",
+  "version": "1.0.5",
   "description": "Component-as-a-Service platform — bundle, sign, and deliver UI components via edge CDN",
   "type": "module",
   "main": "index.js",
@@ -28,12 +28,16 @@
   "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"
   }
 }