frontend-hamroun 1.1.10 → 1.1.12

package/README.md

@@ -8,6 +8,23 @@ A lightweight Virtual DOM and hooks implementation with JSX support.
 npm install your-package-name
 ```
 
+## Quick Start
+
+Create a new project using:
+
+```bash
+npx create-frontend-app my-app
+# or
+npm create frontend-app@latest my-app
+```
+Then:
+
+```bash
+cd my-app
+npm install
+npm run dev
+```
+
 ## Usage
 
 ```jsx
@@ -220,4 +237,4 @@ MIT License - feel free to use in any project.
 ## Contributing
 
 Contributions are welcome! Please read our contributing guidelines and submit pull requests.
-````
+`````

package/bin/cli.js

@@ -69,44 +69,50 @@ async function createProject(projectName, options) {
 }
 
 program
-  .name('frontend-hamroun')
-  .description('CLI for Frontend Hamroun Framework')
-  .version('1.0.0');
+  .name('create-frontend-app')
+  .description('Create a new Frontend Hamroun application')
+  .argument('[name]', 'Project name')
+  .action(async (name) => {
+    let projectName = name;
+    
+    if (!projectName) {
+      const response = await inquirer.prompt([{
+        type: 'input',
+        name: 'projectName',
+        message: 'What is your project named?',
+        default: 'my-frontend-app'
+      }]);
+      projectName = response.projectName;
+    }
 
-program
-  .command('create <project-name>')
-  .description('Create a new project')
-  .action(async (projectName) => {
-    const answers = await inquirer.prompt([
-      {
-        type: 'list',
-        name: 'template',
-        message: 'What type of project do you want to create?',
-        choices: Object.values(CHOICES)
-      }
-    ]);
-
-    await createProject(projectName, {
-      template: answers.template === CHOICES.SPA ? 'spa' : 'component'
-    });
-  });
+    const spinner = createSpinner('Creating project...').start();
 
-program
-  .command('dev')
-  .description('Start development server')
-  .action(() => {
-    const spinner = createSpinner('Starting development server...').start();
-    // Add dev server logic here
-    spinner.success({ text: 'Development server started on http://localhost:3000' });
-  });
+    try {
+      // Copy template
+      const templateDir = path.join(__dirname, '..', 'templates', 'basic-app');
+      const targetDir = path.join(process.cwd(), projectName);
 
-program
-  .command('build')
-  .description('Build for production')
-  .action(() => {
-    const spinner = createSpinner('Building for production...').start();
-    // Add build logic here
-    spinner.success({ text: 'Build complete!' });
+      await fs.ensureDir(targetDir);
+      await fs.copy(templateDir, targetDir);
+
+      // Update package.json
+      const pkgJsonPath = path.join(targetDir, 'package.json');
+      const pkgJson = await fs.readJson(pkgJsonPath);
+      pkgJson.name = projectName;
+      await fs.writeJson(pkgJsonPath, pkgJson, { spaces: 2 });
+
+      spinner.success({ text: chalk.green(`Project ${projectName} created successfully!`) });
+      
+      console.log('\nNext steps:');
+      console.log(chalk.cyan(`  cd ${projectName}`));
+      console.log(chalk.cyan('  npm install'));
+      console.log(chalk.cyan('  npm run dev'));
+
+    } catch (error) {
+      spinner.error({ text: chalk.red('Failed to create project') });
+      console.error(error);
+      process.exit(1);
+    }
   });
 
-program.parse(process.argv);
+program.parse();

package/dist/batch.d.ts

@@ -1,4 +1,3 @@
-type BatchCallback = () => void;
-export declare function batchUpdates(callback: BatchCallback): void;
-export declare function isBatching(): boolean;
-export {};
+export declare let isBatching: boolean;
+export declare function batchUpdates(fn: Function): void;
+export declare function getIsBatching(): boolean;

package/dist/context.d.ts

@@ -10,4 +10,4 @@ export interface Context<T> {
     useSelector: <S>(selector: (state: T) => S) => S;
 }
 export declare function createContext<T>(defaultValue: T): Context<T>;
-export declare function useContext<T>(context: Context<T>): T;
+export declare function useContext<T>(context: any): T;

package/dist/frontend-hamroun.js

@@ -1,192 +1,182 @@
-async function m(t) {
+async function d(t) {
   var e;
   if (console.log("Creating element from:", t), t == null || typeof t == "boolean")
     return document.createTextNode("");
   if (typeof t == "number" || typeof t == "string")
     return document.createTextNode(String(t));
   if (Array.isArray(t)) {
-    const r = document.createDocumentFragment();
+    const n = document.createDocumentFragment();
     for (const s of t) {
-      const n = await m(s);
-      r.appendChild(n);
+      const o = await d(s);
+      n.appendChild(o);
     }
-    return r;
+    return n;
   }
   if ("type" in t && t.props !== void 0) {
-    const { type: r, props: s } = t;
-    if (typeof r == "function")
+    const { type: n, props: s } = t;
+    if (typeof n == "function")
       try {
-        const c = await r(s || {}), a = await m(c);
-        return a instanceof Element && a.setAttribute("data-component-id", r.name || r.toString()), a;
+        const c = await n(s || {}), a = await d(c);
+        return a instanceof Element && a.setAttribute("data-component-id", n.name || n.toString()), a;
       } catch (c) {
         return console.error("Error rendering component:", c), document.createTextNode("");
       }
-    const n = document.createElement(r);
+    const o = document.createElement(n);
     for (const [c, a] of Object.entries(s || {}))
       if (c !== "children")
         if (c.startsWith("on") && typeof a == "function") {
-          const f = c.toLowerCase().slice(2), S = (e = n.__events) == null ? void 0 : e[f];
-          S && n.removeEventListener(f, S), n.addEventListener(f, a), n.__events || (n.__events = {}), n.__events[f] = a;
+          const f = c.toLowerCase().slice(2), C = (e = o.__events) == null ? void 0 : e[f];
+          C && o.removeEventListener(f, C), o.addEventListener(f, a), o.__events || (o.__events = {}), o.__events[f] = a;
         } else
-          c === "style" && typeof a == "object" ? Object.assign(n.style, a) : c === "className" ? n.setAttribute("class", String(a)) : c !== "key" && c !== "ref" && n.setAttribute(c, String(a));
+          c === "style" && typeof a == "object" ? Object.assign(o.style, a) : c === "className" ? o.setAttribute("class", String(a)) : c !== "key" && c !== "ref" && o.setAttribute(c, String(a));
     const i = s == null ? void 0 : s.children;
     if (i != null) {
       const c = Array.isArray(i) ? i.flat() : [i];
       for (const a of c) {
-        const f = await m(a);
-        n.appendChild(f);
+        const f = await d(a);
+        o.appendChild(f);
       }
     }
-    return n;
+    return o;
   }
   return document.createTextNode(String(t));
 }
-let h = [], p = !1;
-function _(t) {
-  if (p) {
+let m = !1;
+const h = [];
+function S(t) {
+  if (m) {
     h.push(t);
     return;
   }
-  p = !0;
+  m = !0;
   try {
     for (t(); h.length > 0; ) {
       const e = h.shift();
       e == null || e();
     }
   } finally {
-    p = !1;
+    m = !1;
   }
 }
 function R() {
-  return p;
+  return m;
 }
-let o = 0;
-const g = /* @__PURE__ */ new Map(), u = /* @__PURE__ */ new Map(), d = /* @__PURE__ */ new Map(), y = /* @__PURE__ */ new Map(), w = /* @__PURE__ */ new Map();
-let b = null, E = null, x = null;
-function A(t, e, r) {
-  b = t, E = r, x = e;
+let r = 0;
+const p = /* @__PURE__ */ new Map(), u = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), y = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map();
+let w = null, b = null, E = null;
+function _(t, e, n) {
+  w = t, b = n, E = e;
 }
-function T() {
-  return o++, u.set(o, 0), o;
+function A() {
+  return r++, u.set(r, 0), r;
 }
-function j() {
-  o = 0;
+function T() {
+  r = 0;
 }
-function v(t) {
-  if (!o)
+function k(t) {
+  if (!r)
     throw new Error("useState must be called within a render");
-  g.has(o) || g.set(o, []);
-  const e = g.get(o), r = u.get(o);
-  r >= e.length && e.push(t);
-  const s = e[r], n = (i) => {
-    const c = typeof i == "function" ? i(e[r]) : i;
-    e[r] !== c && (e[r] = c, R() ? _(() => C(o)) : C(o));
+  p.has(r) || p.set(r, []);
+  const e = p.get(r), n = u.get(r);
+  n >= e.length && e.push(t);
+  const s = e[n], o = (i) => {
+    const c = typeof i == "function" ? i(e[n]) : i;
+    e[n] !== c && (e[n] = c, R() ? S(() => M(r)) : M(r));
   };
-  return u.set(o, r + 1), [s, n];
+  return u.set(r, n + 1), [s, o];
 }
-function L(t, e) {
-  if (!o)
+function I(t, e) {
+  if (!r)
     throw new Error("useEffect must be called within a render");
-  const r = u.get(o);
-  d.has(o) || d.set(o, []);
-  const s = d.get(o), n = s[r];
-  (!n || !e || !n.deps || e.some((i, c) => i !== n.deps[c])) && (n != null && n.cleanup && n.cleanup(), queueMicrotask(() => {
+  const n = u.get(r);
+  l.has(r) || l.set(r, []);
+  const s = l.get(r), o = s[n];
+  (!o || !e || !o.deps || e.some((i, c) => i !== o.deps[c])) && (o != null && o.cleanup && o.cleanup(), queueMicrotask(() => {
     const i = t() || void 0;
-    s[r] = { cleanup: i, deps: e };
-  })), u.set(o, r + 1);
+    s[n] = { cleanup: i, deps: e };
+  })), u.set(r, n + 1);
 }
-function I(t, e) {
-  if (!o)
+function j(t, e) {
+  if (!r)
     throw new Error("useMemo must be called within a render");
-  const r = u.get(o);
-  y.has(o) || y.set(o, []);
-  const s = y.get(o), n = s[r];
-  if (!n || e && e.some((i, c) => !Object.is(i, n.deps[c]))) {
+  const n = u.get(r);
+  y.has(r) || y.set(r, []);
+  const s = y.get(r), o = s[n];
+  if (!o || e && e.some((i, c) => !Object.is(i, o.deps[c]))) {
     const i = t();
-    return s[r] = { value: i, deps: e }, u.set(o, r + 1), i;
+    return s[n] = { value: i, deps: e }, u.set(r, n + 1), i;
   }
-  return u.set(o, r + 1), n.value;
+  return u.set(r, n + 1), o.value;
 }
-function O(t) {
-  if (!o)
+function v(t) {
+  if (!r)
     throw new Error("useRef must be called within a render");
-  const e = u.get(o);
-  w.has(o) || w.set(o, []);
-  const r = w.get(o);
-  if (e >= r.length) {
-    const n = { current: t };
-    return r.push(n), u.set(o, e + 1), n;
+  const e = u.get(r);
+  g.has(r) || g.set(r, []);
+  const n = g.get(r);
+  if (e >= n.length) {
+    const o = { current: t };
+    return n.push(o), u.set(r, e + 1), o;
   }
-  const s = r[e];
-  return u.set(o, e + 1), s;
+  const s = n[e];
+  return u.set(r, e + 1), s;
 }
-async function C(t) {
+async function M(t) {
   try {
-    const e = d.get(t);
-    e && (e.forEach((r) => {
-      r.cleanup && r.cleanup();
-    }), d.set(t, [])), b && E && x && await b(x, E);
+    const e = l.get(t);
+    e && (e.forEach((n) => {
+      n.cleanup && n.cleanup();
+    }), l.set(t, [])), w && b && E && await w(E, b);
   } catch (e) {
     console.error("Error during rerender:", e);
   }
 }
-function k() {
-  const [t, e] = v(null);
+function L() {
+  const [t, e] = k(null);
   return [t, () => e(null)];
 }
-const l = /* @__PURE__ */ new Map();
 function B(t) {
-  const e = Symbol();
-  return l.set(e, t), {
-    Provider: ({ value: s, children: n }) => {
-      const i = l.get(e);
-      return Object.is(i, s) || l.set(e, s), n;
-    },
-    Consumer: ({ children: s }) => {
-      const n = l.get(e);
-      return s(n);
-    },
-    useSelector: (s) => {
-      const n = l.get(e);
-      return I(() => s(n), [n]);
-    },
-    _id: e
+  return {
+    Provider: ({ value: n, children: s }) => s,
+    Consumer: ({ children: n }) => n(t),
+    _id: Symbol(),
+    useSelector: (n) => n(t)
   };
 }
 function H(t) {
-  return l.get(t._id);
+  return t;
 }
-let M = !1;
-async function U(t, e) {
-  M = !0;
+let x = !1;
+async function O(t, e) {
+  x = !0;
   try {
     await N(t, e);
   } finally {
-    M = !1;
+    x = !1;
   }
 }
 async function N(t, e) {
-  console.log("Rendering to:", e.id), _(async () => {
-    const r = T();
+  console.log("Rendering to:", e.id), S(async () => {
+    const n = A();
     try {
-      A(N, t, e);
-      const s = await m(t);
-      M || (e.innerHTML = ""), e.appendChild(s);
+      _(N, t, e);
+      const s = await d(t);
+      x || (e.innerHTML = ""), e.appendChild(s);
     } finally {
-      j();
+      T();
     }
   });
 }
 export {
-  _ as batchUpdates,
+  S as batchUpdates,
   B as createContext,
-  U as hydrate,
+  O as hydrate,
   N as render,
   H as useContext,
-  L as useEffect,
-  k as useErrorBoundary,
-  I as useMemo,
-  O as useRef,
-  v as useState
+  I as useEffect,
+  L as useErrorBoundary,
+  j as useMemo,
+  v as useRef,
+  k as useState
 };
 //# sourceMappingURL=frontend-hamroun.js.map

package/dist/frontend-hamroun.js.map

@@ -1 +1 @@
-{"version":3,"file":"frontend-hamroun.js","sources":["../src/jsx-runtime.ts","../src/batch.ts","../src/hooks.ts","../src/context.ts","../src/index.ts"],"sourcesContent":["import type { Component } from './component';\r\n\r\ninterface VNode {\r\n  type: string | Function;\r\n  props: Record<string, any>;\r\n}\r\n\r\nexport function jsx(type: string | Function, props: any): VNode {\r\n  console.log('JSX Transform:', { type, props });\r\n  const processedProps = { ...props };\r\n  \r\n  // Handle children properly\r\n  if (arguments.length > 2) {\r\n    processedProps.children = Array.prototype.slice.call(arguments, 2);\r\n  }\r\n  \r\n  return { type, props: processedProps };\r\n}\r\n\r\nexport { jsx as jsxs, jsx as jsxDEV };\r\nexport const Fragment = ({ children }: { children: any }) => children;\r\n\r\nexport async function createElement(vnode: VNode | any): Promise<Node> {\r\n  console.log('Creating element from:', vnode);\r\n\r\n  // Handle primitives and null\r\n  if (vnode == null) {\r\n    return document.createTextNode('');\r\n  }\r\n  \r\n  if (typeof vnode === 'boolean') {\r\n    return document.createTextNode('');\r\n  }\r\n\r\n  if (typeof vnode === 'number' || typeof vnode === 'string') {\r\n    return document.createTextNode(String(vnode));\r\n  }\r\n\r\n  // Handle arrays\r\n  if (Array.isArray(vnode)) {\r\n    const fragment = document.createDocumentFragment();\r\n    for (const child of vnode) {\r\n      const node = await createElement(child);\r\n      fragment.appendChild(node);\r\n    }\r\n    return fragment;\r\n  }\r\n\r\n  // Handle VNode\r\n  if ('type' in vnode && vnode.props !== undefined) {\r\n    const { type, props } = vnode;\r\n    \r\n    // Handle function components\r\n    if (typeof type === 'function') {\r\n      try {\r\n        const result = await type(props || {});\r\n        const node = await createElement(result);\r\n        if (node instanceof Element) {\r\n          node.setAttribute('data-component-id', type.name || type.toString());\r\n        }\r\n        return node;\r\n      } catch (error) {\r\n        console.error('Error rendering component:', error);\r\n        return document.createTextNode('');\r\n      }\r\n    }\r\n\r\n    // Create DOM element\r\n    const element = document.createElement(type as string);\r\n    \r\n    // Handle props\r\n    for (const [key, value] of Object.entries(props || {})) {\r\n      if (key === 'children') continue;\r\n      if (key.startsWith('on') && typeof value === 'function') {\r\n        const eventName = key.toLowerCase().slice(2);\r\n        // Remove existing event listener if any\r\n        const existingHandler = (element as any).__events?.[eventName];\r\n        if (existingHandler) {\r\n          element.removeEventListener(eventName, existingHandler);\r\n        }\r\n        \r\n        // Add new event listener\r\n        element.addEventListener(eventName, value as EventListener);\r\n        if (!(element as any).__events) {\r\n          (element as any).__events = {};\r\n        }\r\n        (element as any).__events[eventName] = value;\r\n      } else if (key === 'style' && typeof value === 'object') {\r\n        Object.assign(element.style, value);\r\n      } else if (key === 'className') {\r\n        element.setAttribute('class', String(value));\r\n      } else if (key !== 'key' && key !== 'ref') {\r\n        element.setAttribute(key, String(value));\r\n      }\r\n    }\r\n\r\n    // Handle children\r\n    const children = props?.children;\r\n    if (children != null) {\r\n      const childArray = Array.isArray(children) ? children.flat() : [children];\r\n      for (const child of childArray) {\r\n        const childNode = await createElement(child);\r\n        element.appendChild(childNode);\r\n      }\r\n    }\r\n\r\n    return element;\r\n  }\r\n\r\n  // Handle other objects by converting to string\r\n  return document.createTextNode(String(vnode));\r\n}\r\n","type BatchCallback = () => void;\r\nlet batchQueue: BatchCallback[] = [];\r\nlet isBatchingUpdates = false;\r\n\r\nexport function batchUpdates(callback: BatchCallback) {\r\n  if (isBatchingUpdates) {\r\n    batchQueue.push(callback);\r\n    return;\r\n  }\r\n\r\n  isBatchingUpdates = true;\r\n  try {\r\n    callback();\r\n    while (batchQueue.length > 0) {\r\n      const queuedCallback = batchQueue.shift();\r\n      queuedCallback?.();\r\n    }\r\n  } finally {\r\n    isBatchingUpdates = false;\r\n  }\r\n}\r\n\r\nexport function isBatching() {\r\n  return isBatchingUpdates;\r\n}\r\n","import { createElement } from './jsx-runtime';\r\nimport { batchUpdates, isBatching } from './batch';\r\nimport { diff } from './vdom';\r\n\r\nlet currentRender: number = 0;\r\nconst states = new Map<number, any[]>();\r\nconst stateIndices = new Map<number, number>();\r\nconst effects = new Map<number, Effect[]>();\r\nconst memos = new Map<number, { value: any; deps: any[] }[]>();\r\nconst refs = new Map<number, any[]>();\r\n\r\ninterface Effect {\r\n  cleanup?: () => void;\r\n  deps?: any[];\r\n}\r\n\r\n// Add at the top with other declarations\r\nlet globalRenderCallback: ((element: any, container: HTMLElement) => void) | null = null;\r\nlet globalContainer: HTMLElement | null = null;\r\nlet currentElement: any = null;\r\n\r\nexport function setRenderCallback(\r\n  callback: (element: any, container: HTMLElement) => void,\r\n  element: any,\r\n  container: HTMLElement\r\n) {\r\n  globalRenderCallback = callback;\r\n  globalContainer = container;\r\n  currentElement = element;\r\n}\r\n\r\nexport function prepareRender() {\r\n  currentRender++;\r\n  stateIndices.set(currentRender, 0);\r\n  return currentRender;\r\n}\r\n\r\nexport function finishRender() {\r\n  currentRender = 0;\r\n}\r\n\r\nexport function useState<T>(initial: T): [T, (value: T | ((prev: T) => T)) => void] {\r\n  if (!currentRender) {\r\n    throw new Error('useState must be called within a render');\r\n  }\r\n\r\n  if (!states.has(currentRender)) {\r\n    states.set(currentRender, []);\r\n  }\r\n\r\n  const componentStates = states.get(currentRender)!;\r\n  const index = stateIndices.get(currentRender)!;\r\n  \r\n  if (index >= componentStates.length) {\r\n    componentStates.push(initial);\r\n  }\r\n\r\n  const state = componentStates[index];\r\n  const setState = (newValue: T | ((prev: T) => T)) => {\r\n    const nextValue = typeof newValue === 'function' \r\n      ? (newValue as Function)(componentStates[index])\r\n      : newValue;\r\n\r\n    if (componentStates[index] === nextValue) return; // Skip if value hasn't changed\r\n    \r\n    componentStates[index] = nextValue;\r\n    \r\n    if (isBatching()) {\r\n      batchUpdates(() => rerender(currentRender));\r\n    } else {\r\n      rerender(currentRender);\r\n    }\r\n  };\r\n\r\n  stateIndices.set(currentRender, index + 1);\r\n  return [state, setState];\r\n}\r\n\r\nexport function useEffect(callback: () => (() => void) | void, deps?: any[]) {\r\n  if (!currentRender) throw new Error('useEffect must be called within a render');\r\n  \r\n  const effectIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!effects.has(currentRender)) {\r\n    effects.set(currentRender, []);\r\n  }\r\n\r\n  const componentEffects = effects.get(currentRender)!;\r\n  const prevEffect = componentEffects[effectIndex];\r\n  \r\n  // Run effect if deps changed\r\n  if (!prevEffect || !deps || !prevEffect.deps || \r\n      deps.some((dep, i) => dep !== prevEffect.deps![i])) {\r\n    \r\n    // Cleanup previous effect\r\n    if (prevEffect?.cleanup) {\r\n      prevEffect.cleanup();\r\n    }\r\n\r\n    // Schedule new effect\r\n    queueMicrotask(() => {\r\n      const cleanup = callback() || undefined;\r\n      componentEffects[effectIndex] = { cleanup: cleanup, deps };\r\n    });\r\n  }\r\n  \r\n  stateIndices.set(currentRender, effectIndex + 1);\r\n}\r\n\r\nexport function useMemo<T>(factory: () => T, deps: any[]): T {\r\n  if (!currentRender) throw new Error('useMemo must be called within a render');\r\n  \r\n  const memoIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!memos.has(currentRender)) {\r\n    memos.set(currentRender, []);\r\n  }\r\n\r\n  const componentMemos = memos.get(currentRender)!;\r\n  const prevMemo = componentMemos[memoIndex];\r\n  \r\n  if (!prevMemo || (deps && deps.some((dep, i) => !Object.is(dep, prevMemo.deps[i])))) {\r\n    const value = factory();\r\n    componentMemos[memoIndex] = { value, deps };\r\n    stateIndices.set(currentRender, memoIndex + 1);\r\n    return value;\r\n  }\r\n\r\n  stateIndices.set(currentRender, memoIndex + 1);\r\n  return prevMemo.value;\r\n}\r\n\r\nexport function useRef<T>(initial: T) {\r\n  if (!currentRender) throw new Error('useRef must be called within a render');\r\n  \r\n  const refIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!refs.has(currentRender)) {\r\n    refs.set(currentRender, []);\r\n  }\r\n\r\n  const componentRefs = refs.get(currentRender)!;\r\n  if (refIndex >= componentRefs.length) {\r\n    // Initialize with an object that has a current property\r\n    const ref = { current: initial };\r\n    componentRefs.push(ref);\r\n    stateIndices.set(currentRender, refIndex + 1);\r\n    return ref;\r\n  }\r\n\r\n  const ref = componentRefs[refIndex];\r\n  stateIndices.set(currentRender, refIndex + 1);\r\n  return ref;\r\n}\r\n\r\n// Add a map to track component DOM nodes\r\nconst componentNodes = new Map<Function, Node>();\r\n\r\nasync function rerender(rendererId: number) {\r\n  try {\r\n    // Clean up effects\r\n    const componentEffects = effects.get(rendererId);\r\n    if (componentEffects) {\r\n      componentEffects.forEach(effect => {\r\n        if (effect.cleanup) effect.cleanup();\r\n      });\r\n      effects.set(rendererId, []);\r\n    }\r\n\r\n    if (globalRenderCallback && globalContainer && currentElement) {\r\n      await globalRenderCallback(currentElement, globalContainer);\r\n    }\r\n  } catch (error) {\r\n    console.error('Error during rerender:', error);\r\n  }\r\n}\r\n\r\n// Add new hook for error boundaries\r\nexport function useErrorBoundary(): [Error | null, () => void] {\r\n  const [error, setError] = useState<Error | null>(null);\r\n  return [error, () => setError(null)];\r\n}\r\n\r\n// Remove withHooks export\r\n","import { useMemo } from \"./hooks\";\r\n\r\nconst contexts = new Map<symbol, any>();\r\nlet currentRender: Function | null = null;\r\n\r\nexport interface Context<T> {\r\n  Provider: (props: { value: T; children?: any }) => any;\r\n  Consumer: (props: { children: (value: T) => any }) => any;\r\n  _id: symbol;\r\n  useSelector: <S>(selector: (state: T) => S) => S;\r\n}\r\n\r\nexport function createContext<T>(defaultValue: T): Context<T> {\r\n  const id = Symbol();\r\n  contexts.set(id, defaultValue);\r\n  \r\n  const useSelector = <S>(selector: (state: T) => S): S => {\r\n    const value = contexts.get(id);\r\n    return useMemo(() => selector(value), [value]);\r\n  };\r\n\r\n  return {\r\n    Provider: ({ value, children }) => {\r\n      const prevValue = contexts.get(id);\r\n      if (!Object.is(prevValue, value)) {\r\n        contexts.set(id, value);\r\n      }\r\n      return children;\r\n    },\r\n    Consumer: ({ children }) => {\r\n      const value = contexts.get(id);\r\n      return children(value);\r\n    },\r\n    useSelector,\r\n    _id: id\r\n  };\r\n}\r\n\r\nexport function useContext<T>(context: Context<T>): T {\r\n  return contexts.get(context._id);\r\n}\r\n","import { createElement } from './jsx-runtime';\r\nimport { prepareRender, finishRender, setRenderCallback } from './hooks';\r\nimport { batchUpdates } from './batch';\r\n\r\nexport { \r\n  useState, \r\n  useEffect, \r\n  useMemo, \r\n  useRef,\r\n  useErrorBoundary \r\n} from './hooks';\r\n\r\nexport { createContext, useContext } from './context';\r\nexport { batchUpdates } from './batch';\r\n\r\nlet isHydrating = false;\r\n\r\nexport async function hydrate(element: any, container: HTMLElement) {\r\n  isHydrating = true;\r\n  try {\r\n    await render(element, container);\r\n  } finally {\r\n    isHydrating = false;\r\n  }\r\n}\r\n\r\nexport async function render(element: any, container: HTMLElement) {\r\n  console.log('Rendering to:', container.id);\r\n  \r\n  batchUpdates(async () => {\r\n    const rendererId = prepareRender();\r\n    try {\r\n      setRenderCallback(render, element, container);\r\n      const domNode = await createElement(element);\r\n      \r\n      if (!isHydrating) {\r\n        container.innerHTML = '';\r\n      }\r\n      container.appendChild(domNode);\r\n      \r\n    } finally {\r\n      finishRender();\r\n    }\r\n  });\r\n}\r\n\r\n"],"names":["createElement","vnode","_a","fragment","child","node","type","props","result","error","element","key","value","eventName","existingHandler","children","childArray","childNode","batchQueue","isBatchingUpdates","batchUpdates","callback","queuedCallback","isBatching","currentRender","states","stateIndices","effects","memos","refs","globalRenderCallback","globalContainer","currentElement","setRenderCallback","container","prepareRender","finishRender","useState","initial","componentStates","index","state","setState","newValue","nextValue","rerender","useEffect","deps","effectIndex","componentEffects","prevEffect","dep","i","cleanup","useMemo","factory","memoIndex","componentMemos","prevMemo","useRef","refIndex","componentRefs","ref","rendererId","effect","useErrorBoundary","setError","contexts","createContext","defaultValue","id","prevValue","selector","useContext","context","isHydrating","hydrate","render","domNode"],"mappings":"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"}
+{"version":3,"file":"frontend-hamroun.js","sources":["../src/jsx-runtime.ts","../src/batch.ts","../src/hooks.ts","../src/context.ts","../src/index.ts"],"sourcesContent":["import type { Component } from './component';\r\n\r\ninterface VNode {\r\n  type: string | Function;\r\n  props: Record<string, any>;\r\n}\r\n\r\nexport function jsx(type: string | Function, props: any): VNode {\r\n  console.log('JSX Transform:', { type, props });\r\n  const processedProps = { ...props };\r\n  \r\n  // Handle children properly\r\n  if (arguments.length > 2) {\r\n    processedProps.children = Array.prototype.slice.call(arguments, 2);\r\n  }\r\n  \r\n  return { type, props: processedProps };\r\n}\r\n\r\nexport { jsx as jsxs, jsx as jsxDEV };\r\nexport const Fragment = ({ children }: { children: any }) => children;\r\n\r\nexport async function createElement(vnode: VNode | any): Promise<Node> {\r\n  console.log('Creating element from:', vnode);\r\n\r\n  // Handle primitives and null\r\n  if (vnode == null) {\r\n    return document.createTextNode('');\r\n  }\r\n  \r\n  if (typeof vnode === 'boolean') {\r\n    return document.createTextNode('');\r\n  }\r\n\r\n  if (typeof vnode === 'number' || typeof vnode === 'string') {\r\n    return document.createTextNode(String(vnode));\r\n  }\r\n\r\n  // Handle arrays\r\n  if (Array.isArray(vnode)) {\r\n    const fragment = document.createDocumentFragment();\r\n    for (const child of vnode) {\r\n      const node = await createElement(child);\r\n      fragment.appendChild(node);\r\n    }\r\n    return fragment;\r\n  }\r\n\r\n  // Handle VNode\r\n  if ('type' in vnode && vnode.props !== undefined) {\r\n    const { type, props } = vnode;\r\n    \r\n    // Handle function components\r\n    if (typeof type === 'function') {\r\n      try {\r\n        const result = await type(props || {});\r\n        const node = await createElement(result);\r\n        if (node instanceof Element) {\r\n          node.setAttribute('data-component-id', type.name || type.toString());\r\n        }\r\n        return node;\r\n      } catch (error) {\r\n        console.error('Error rendering component:', error);\r\n        return document.createTextNode('');\r\n      }\r\n    }\r\n\r\n    // Create DOM element\r\n    const element = document.createElement(type as string);\r\n    \r\n    // Handle props\r\n    for (const [key, value] of Object.entries(props || {})) {\r\n      if (key === 'children') continue;\r\n      if (key.startsWith('on') && typeof value === 'function') {\r\n        const eventName = key.toLowerCase().slice(2);\r\n        // Remove existing event listener if any\r\n        const existingHandler = (element as any).__events?.[eventName];\r\n        if (existingHandler) {\r\n          element.removeEventListener(eventName, existingHandler);\r\n        }\r\n        \r\n        // Add new event listener\r\n        element.addEventListener(eventName, value as EventListener);\r\n        if (!(element as any).__events) {\r\n          (element as any).__events = {};\r\n        }\r\n        (element as any).__events[eventName] = value;\r\n      } else if (key === 'style' && typeof value === 'object') {\r\n        Object.assign(element.style, value);\r\n      } else if (key === 'className') {\r\n        element.setAttribute('class', String(value));\r\n      } else if (key !== 'key' && key !== 'ref') {\r\n        element.setAttribute(key, String(value));\r\n      }\r\n    }\r\n\r\n    // Handle children\r\n    const children = props?.children;\r\n    if (children != null) {\r\n      const childArray = Array.isArray(children) ? children.flat() : [children];\r\n      for (const child of childArray) {\r\n        const childNode = await createElement(child);\r\n        element.appendChild(childNode);\r\n      }\r\n    }\r\n\r\n    return element;\r\n  }\r\n\r\n  // Handle other objects by converting to string\r\n  return document.createTextNode(String(vnode));\r\n}\r\n","export let isBatching = false;\r\nconst queue: Function[] = [];\r\n\r\nexport function batchUpdates(fn: Function) {\r\n  if (isBatching) {\r\n    queue.push(fn);\r\n    return;\r\n  }\r\n\r\n  isBatching = true;\r\n  try {\r\n    fn();\r\n    while (queue.length > 0) {\r\n      const nextFn = queue.shift();\r\n      nextFn?.();\r\n    }\r\n  } finally {\r\n    isBatching = false;\r\n  }\r\n}\r\n\r\nexport function getIsBatching() {\r\n  return isBatching;\r\n}\r\n","import { createElement } from './jsx-runtime';\r\nimport { batchUpdates, getIsBatching, isBatching } from './batch';\r\nimport { diff } from './vdom';\r\n\r\nlet currentRender: number = 0;\r\nconst states = new Map<number, any[]>();\r\nconst stateIndices = new Map<number, number>();\r\nconst effects = new Map<number, Effect[]>();\r\nconst memos = new Map<number, { value: any; deps: any[] }[]>();\r\nconst refs = new Map<number, any[]>();\r\n\r\ninterface Effect {\r\n  cleanup?: () => void;\r\n  deps?: any[];\r\n}\r\n\r\n// Add at the top with other declarations\r\nlet globalRenderCallback: ((element: any, container: HTMLElement) => void) | null = null;\r\nlet globalContainer: HTMLElement | null = null;\r\nlet currentElement: any = null;\r\n\r\nexport function setRenderCallback(\r\n  callback: (element: any, container: HTMLElement) => void,\r\n  element: any,\r\n  container: HTMLElement\r\n) {\r\n  globalRenderCallback = callback;\r\n  globalContainer = container;\r\n  currentElement = element;\r\n}\r\n\r\nexport function prepareRender() {\r\n  currentRender++;\r\n  stateIndices.set(currentRender, 0);\r\n  return currentRender;\r\n}\r\n\r\nexport function finishRender() {\r\n  currentRender = 0;\r\n}\r\n\r\nexport function useState<T>(initial: T): [T, (value: T | ((prev: T) => T)) => void] {\r\n  if (!currentRender) {\r\n    throw new Error('useState must be called within a render');\r\n  }\r\n\r\n  if (!states.has(currentRender)) {\r\n    states.set(currentRender, []);\r\n  }\r\n\r\n  const componentStates = states.get(currentRender)!;\r\n  const index = stateIndices.get(currentRender)!;\r\n  \r\n  if (index >= componentStates.length) {\r\n    componentStates.push(initial);\r\n  }\r\n\r\n  const state = componentStates[index];\r\n  const setState = (newValue: T | ((prev: T) => T)) => {\r\n    const nextValue = typeof newValue === 'function' \r\n      ? (newValue as Function)(componentStates[index])\r\n      : newValue;\r\n\r\n    if (componentStates[index] === nextValue) return; // Skip if value hasn't changed\r\n    \r\n    componentStates[index] = nextValue;\r\n    \r\n    if (getIsBatching()) {\r\n      batchUpdates(() => rerender(currentRender));\r\n    } else {\r\n      rerender(currentRender);\r\n    }\r\n  };\r\n\r\n  stateIndices.set(currentRender, index + 1);\r\n  return [state, setState];\r\n}\r\n\r\nexport function useEffect(callback: () => (() => void) | void, deps?: any[]) {\r\n  if (!currentRender) throw new Error('useEffect must be called within a render');\r\n  \r\n  const effectIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!effects.has(currentRender)) {\r\n    effects.set(currentRender, []);\r\n  }\r\n\r\n  const componentEffects = effects.get(currentRender)!;\r\n  const prevEffect = componentEffects[effectIndex];\r\n  \r\n  // Run effect if deps changed\r\n  if (!prevEffect || !deps || !prevEffect.deps || \r\n      deps.some((dep, i) => dep !== prevEffect.deps![i])) {\r\n    \r\n    // Cleanup previous effect\r\n    if (prevEffect?.cleanup) {\r\n      prevEffect.cleanup();\r\n    }\r\n\r\n    // Schedule new effect\r\n    queueMicrotask(() => {\r\n      const cleanup = callback() || undefined;\r\n      componentEffects[effectIndex] = { cleanup: cleanup, deps };\r\n    });\r\n  }\r\n  \r\n  stateIndices.set(currentRender, effectIndex + 1);\r\n}\r\n\r\nexport function useMemo<T>(factory: () => T, deps: any[]): T {\r\n  if (!currentRender) throw new Error('useMemo must be called within a render');\r\n  \r\n  const memoIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!memos.has(currentRender)) {\r\n    memos.set(currentRender, []);\r\n  }\r\n\r\n  const componentMemos = memos.get(currentRender)!;\r\n  const prevMemo = componentMemos[memoIndex];\r\n  \r\n  if (!prevMemo || (deps && deps.some((dep, i) => !Object.is(dep, prevMemo.deps[i])))) {\r\n    const value = factory();\r\n    componentMemos[memoIndex] = { value, deps };\r\n    stateIndices.set(currentRender, memoIndex + 1);\r\n    return value;\r\n  }\r\n\r\n  stateIndices.set(currentRender, memoIndex + 1);\r\n  return prevMemo.value;\r\n}\r\n\r\nexport function useRef<T>(initial: T) {\r\n  if (!currentRender) throw new Error('useRef must be called within a render');\r\n  \r\n  const refIndex = stateIndices.get(currentRender)!;\r\n  \r\n  if (!refs.has(currentRender)) {\r\n    refs.set(currentRender, []);\r\n  }\r\n\r\n  const componentRefs = refs.get(currentRender)!;\r\n  if (refIndex >= componentRefs.length) {\r\n    // Initialize with an object that has a current property\r\n    const ref = { current: initial };\r\n    componentRefs.push(ref);\r\n    stateIndices.set(currentRender, refIndex + 1);\r\n    return ref;\r\n  }\r\n\r\n  const ref = componentRefs[refIndex];\r\n  stateIndices.set(currentRender, refIndex + 1);\r\n  return ref;\r\n}\r\n\r\n// Add a map to track component DOM nodes\r\nconst componentNodes = new Map<Function, Node>();\r\n\r\nasync function rerender(rendererId: number) {\r\n  try {\r\n    // Clean up effects\r\n    const componentEffects = effects.get(rendererId);\r\n    if (componentEffects) {\r\n      componentEffects.forEach(effect => {\r\n        if (effect.cleanup) effect.cleanup();\r\n      });\r\n      effects.set(rendererId, []);\r\n    }\r\n\r\n    if (globalRenderCallback && globalContainer && currentElement) {\r\n      await globalRenderCallback(currentElement, globalContainer);\r\n    }\r\n  } catch (error) {\r\n    console.error('Error during rerender:', error);\r\n  }\r\n}\r\n\r\n// Add new hook for error boundaries\r\nexport function useErrorBoundary(): [Error | null, () => void] {\r\n  const [error, setError] = useState<Error | null>(null);\r\n  return [error, () => setError(null)];\r\n}\r\n\r\n// Remove withHooks export\r\n","\r\n\r\nconst contexts = new Map<symbol, any>();\r\nlet currentRender: Function | null = null;\r\n\r\nexport interface Context<T> {\r\n  Provider: (props: { value: T; children?: any }) => any;\r\n  Consumer: (props: { children: (value: T) => any }) => any;\r\n  _id: symbol;\r\n  useSelector: <S>(selector: (state: T) => S) => S;\r\n}\r\n\r\nexport function createContext<T>(defaultValue: T): Context<T> {\r\n  const context = {\r\n    Provider: ({ value, children }: { value: T, children?: any }) => {\r\n      return children;\r\n    },\r\n    Consumer: ({ children }: { children: (value: T) => any }) => {\r\n      return children(defaultValue);\r\n    },\r\n    _id: Symbol(),\r\n    useSelector: <S>(selector: (state: T) => S) => {\r\n      return selector(defaultValue);\r\n    }\r\n  };\r\n\r\n  return context;\r\n}\r\n\r\nexport function useContext<T>(context: any): T {\r\n  return context;\r\n}\r\n","import { createElement } from './jsx-runtime';\r\nimport { prepareRender, finishRender, setRenderCallback } from './hooks';\r\nimport { batchUpdates } from './batch';\r\n\r\nexport { \r\n  useState, \r\n  useEffect, \r\n  useMemo, \r\n  useRef,\r\n  useErrorBoundary \r\n} from './hooks';\r\n\r\nexport { createContext, useContext } from './context';\r\nexport { batchUpdates } from './batch';\r\n\r\nlet isHydrating = false;\r\n\r\nexport async function hydrate(element: any, container: HTMLElement) {\r\n  isHydrating = true;\r\n  try {\r\n    await render(element, container);\r\n  } finally {\r\n    isHydrating = false;\r\n  }\r\n}\r\n\r\nexport async function render(element: any, container: HTMLElement) {\r\n  console.log('Rendering to:', container.id);\r\n  \r\n  batchUpdates(async () => {\r\n    const rendererId = prepareRender();\r\n    try {\r\n      setRenderCallback(render, element, container);\r\n      const domNode = await createElement(element);\r\n      \r\n      if (!isHydrating) {\r\n        container.innerHTML = '';\r\n      }\r\n      container.appendChild(domNode);\r\n      \r\n    } finally {\r\n      finishRender();\r\n    }\r\n  });\r\n}\r\n\r\n"],"names":["createElement","vnode","_a","fragment","child","node","type","props","result","error","element","key","value","eventName","existingHandler","children","childArray","childNode","isBatching","queue","batchUpdates","fn","nextFn","getIsBatching","currentRender","states","stateIndices","effects","memos","refs","globalRenderCallback","globalContainer","currentElement","setRenderCallback","callback","container","prepareRender","finishRender","useState","initial","componentStates","index","state","setState","newValue","nextValue","rerender","useEffect","deps","effectIndex","componentEffects","prevEffect","dep","i","cleanup","useMemo","factory","memoIndex","componentMemos","prevMemo","useRef","refIndex","componentRefs","ref","rendererId","effect","useErrorBoundary","setError","createContext","defaultValue","selector","useContext","context","isHydrating","hydrate","render","domNode"],"mappings":"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"}

package/dist/jsx-runtime/jsx-runtime.d.ts

@@ -0,0 +1,4 @@
+export declare function jsx(type: string | Function, props: any, key?: string): any;
+export declare function jsxs(type: string | Function, props: any, key?: string): any;
+export declare function createElement(vnode: any): HTMLElement | Text;
+export declare const Fragment: unique symbol;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "frontend-hamroun",
-  "version": "1.1.10",
+  "version": "1.1.12",
   "description": "A lightweight frontend framework with hooks and virtual DOM",
   "type": "module",
   "main": "./dist/index.js",

package/templates/basic-app/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>My Frontend App</title>
+</head>
+<body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+</body>
+</html>

package/templates/basic-app/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "my-app",
+  "version": "1.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "frontend-hamroun": "^1.1.11"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.0",
+    "vite": "^4.4.9"
+  }
+}

package/templates/basic-app/src/components/Counter.tsx

@@ -0,0 +1,18 @@
+import { useState, useEffect } from 'frontend-hamroun';
+
+export function Counter({ initial = 0 }) {
+  const [count, setCount] = useState(initial);
+  
+  useEffect(() => {
+    document.title = `Count: ${count}`;
+  }, [count]);
+
+  return (
+    <div>
+      <h2>Counter Component</h2>
+      <button onClick={() => setCount(count - 1)}>-</button>
+      <span style={{ margin: '0 10px' }}>{count}</span>
+      <button onClick={() => setCount(count + 1)}>+</button>
+    </div>
+  );
+}

package/templates/basic-app/src/main.tsx

@@ -0,0 +1,18 @@
+import { render, useState } from 'frontend-hamroun';
+
+function App() {
+  const [count, setCount] = useState(0);
+
+  return (
+    <div>
+      <h1>Welcome to Frontend Hamroun</h1>
+      <div>
+        <button onClick={() => setCount(count - 1)}>-</button>
+        <span style={{ margin: '0 10px' }}>{count}</span>
+        <button onClick={() => setCount(count + 1)}>+</button>
+      </div>
+    </div>
+  );
+}
+
+render(<App />, document.getElementById('root')!);

package/templates/basic-app/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "jsx": "preserve",
+    "moduleResolution": "bundler",
+    "esModuleInterop": true,
+    "strict": true,
+    "skipLibCheck": true
+  },
+  "include": ["src"]
+}

package/templates/basic-app/vite.config.ts

@@ -0,0 +1,8 @@
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  esbuild: {
+    jsxFactory: 'jsx',
+    jsxFragment: 'Fragment'
+  }
+});