@rettangoli/fe 0.0.8 → 0.0.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rettangoli/fe",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Frontend framework for building reactive web components",
   "type": "module",
   "main": "./src/index.js",

package/src/cli/watch.js

@@ -7,6 +7,10 @@ import { writeViewFile } from './build.js';
 import buildRettangoliFrontend from './build.js';
 import { extractCategoryAndComponent } from '../common.js';
 
+// Debounce mechanism to prevent excessive rebuilds
+let rebuildTimeout = null;
+const DEBOUNCE_DELAY = 200; // 200ms delay
+
 
 const setupWatcher = (directory, options) => {
   watch(
@@ -21,7 +25,17 @@ const setupWatcher = (directory, options) => {
             const { category, component } = extractCategoryAndComponent(filename);
             await writeViewFile(view, category, component);
           }
-          await buildRettangoliFrontend(options);
+
+          // Debounce the rebuild
+          if (rebuildTimeout) {
+            clearTimeout(rebuildTimeout);
+          }
+
+          rebuildTimeout = setTimeout(async () => {
+            console.log('Triggering rebuild...');
+            await buildRettangoliFrontend(options);
+          }, DEBOUNCE_DELAY);
+
         } catch (error) {
           console.error(`Error processing ${filename}:`, error);
           // Keep the watcher running

package/src/createComponent.js

@@ -309,17 +309,18 @@ class BaseComponent extends HTMLElement {
       dispatchEvent: this.dispatchEvent.bind(this),
     };
 
-
     this.transformedHandlers = {
-      handleCallStoreAction: (event, payload) => {
+      handleCallStoreAction: (payload) => {
         const { render, store } = deps;
+        const { _event, _action } = payload;
         const context = parseAndRender(payload, {
-          event: {
-            target: event.target,
-            detail: event.detail
-          }
+          event: _event
         })
-        store[payload.action](context);
+        console.log('context', context)
+        if (!store[_action]) {
+          throw new Error(`store action store.${store._action} is not defined`)
+        }
+        store[_action](context);
         render();
       }
     };

package/src/parser.js

@@ -332,13 +332,22 @@ export const createVirtualDom = ({
                   }
 
                   if (eventConfig.action) {
-                    handlers.handleCallStoreAction(event, eventConfig.payload)
+                    eventHandlers[eventType] = (event) => {
+                      handlers.handleCallStoreAction({
+                        ...eventConfig.payload,
+                        _event: event,
+                        _action: eventConfig.action,
+                      })
+                    }
                     return;
                   }
 
                   if (eventConfig.handler && handlers[eventConfig.handler]) {
                     eventHandlers[eventType] = (event) => {
-                      handlers[eventConfig.handler](event, eventConfig.payload);
+                      handlers[eventConfig.handler]({
+                        ...eventConfig.payload,
+                        _event: event,
+                      });
                     };
                   } else if (eventConfig.handler) {
                     // Keep this warning for missing handlers