@servlyadmin/runtime-core 0.1.5 → 0.1.7

package/dist/index.cjs

@@ -1491,7 +1491,7 @@ function resolveFunctionBinding(binding, context) {
   }
   return void 0;
 }
-function attachEventHandlers(domElement, element, eventHandlers, context, elementState) {
+function attachEventHandlers(domElement, element, eventHandlers, context, elementState, isRootElement = false) {
   const elementId = element.i;
   if (eventHandlers && eventHandlers[elementId]) {
     const handlers = eventHandlers[elementId];
@@ -1516,6 +1516,18 @@ function attachEventHandlers(domElement, element, eventHandlers, context, elemen
       }
     }
   }
+  if (isRootElement && context.props) {
+    for (const [propName, value] of Object.entries(context.props)) {
+      if (propName.startsWith("on") && propName.length > 2 && typeof value === "function") {
+        const domEventName = propName.slice(2).toLowerCase();
+        if (!elementState.eventListeners.has(domEventName)) {
+          const handler = value;
+          elementState.eventListeners.set(domEventName, handler);
+          domElement.addEventListener(domEventName, handler);
+        }
+      }
+    }
+  }
 }
 function detachEventHandlers(elementState) {
   for (const [eventName, handler] of elementState.eventListeners) {
@@ -1523,7 +1535,7 @@ function detachEventHandlers(elementState) {
   }
   elementState.eventListeners.clear();
 }
-function createElement(element, context, eventHandlers) {
+function createElement(element, context, eventHandlers, isRootElement = false) {
   const tag = getElementTag(element);
   const domElement = document.createElement(tag);
   domElement.setAttribute("data-servly-id", element.i);
@@ -1549,7 +1561,7 @@ function createElement(element, context, eventHandlers) {
     textContent,
     eventListeners: /* @__PURE__ */ new Map()
   };
-  attachEventHandlers(domElement, element, eventHandlers, context, elementState);
+  attachEventHandlers(domElement, element, eventHandlers, context, elementState, isRootElement);
   return elementState;
 }
 var globalRenderingStack = /* @__PURE__ */ new Set();
@@ -1610,8 +1622,8 @@ function renderComponentRef(element, container, context, state) {
     globalRenderingStack.delete(refId);
   }
 }
-function renderElement(element, tree, context, eventHandlers, elementStates, state) {
-  const elementState = createElement(element, context, eventHandlers);
+function renderElement(element, tree, context, eventHandlers, elementStates, state, isRootElement = false) {
+  const elementState = createElement(element, context, eventHandlers, isRootElement);
   elementStates.set(element.i, elementState);
   const config = element.configuration;
   if (config?.componentViewRef) {
@@ -1623,7 +1635,7 @@ function renderElement(element, tree, context, eventHandlers, elementStates, sta
   }
   const children = tree.get(element.i) || [];
   for (const child of children) {
-    const childElement = renderElement(child, tree, context, eventHandlers, elementStates, state);
+    const childElement = renderElement(child, tree, context, eventHandlers, elementStates, state, false);
     elementState.domElement.appendChild(childElement);
   }
   return elementState.domElement;
@@ -1672,14 +1684,16 @@ function render(options) {
         context,
         eventHandlers,
         state.elementStates,
-        state
+        state,
+        true
+        // isRootElement
       );
       container.appendChild(state.rootElement);
     } else {
       const wrapper = document.createElement("div");
       wrapper.setAttribute("data-servly-wrapper", "true");
       for (const root of rootElements) {
-        const rootElement = renderElement(root, tree, context, eventHandlers, state.elementStates, state);
+        const rootElement = renderElement(root, tree, context, eventHandlers, state.elementStates, state, true);
         wrapper.appendChild(rootElement);
       }
       state.rootElement = wrapper;

package/dist/index.js

@@ -1218,7 +1218,7 @@ function resolveFunctionBinding(binding, context) {
   }
   return void 0;
 }
-function attachEventHandlers(domElement, element, eventHandlers, context, elementState) {
+function attachEventHandlers(domElement, element, eventHandlers, context, elementState, isRootElement = false) {
   const elementId = element.i;
   if (eventHandlers && eventHandlers[elementId]) {
     const handlers = eventHandlers[elementId];
@@ -1243,6 +1243,18 @@ function attachEventHandlers(domElement, element, eventHandlers, context, elemen
       }
     }
   }
+  if (isRootElement && context.props) {
+    for (const [propName, value] of Object.entries(context.props)) {
+      if (propName.startsWith("on") && propName.length > 2 && typeof value === "function") {
+        const domEventName = propName.slice(2).toLowerCase();
+        if (!elementState.eventListeners.has(domEventName)) {
+          const handler = value;
+          elementState.eventListeners.set(domEventName, handler);
+          domElement.addEventListener(domEventName, handler);
+        }
+      }
+    }
+  }
 }
 function detachEventHandlers(elementState) {
   for (const [eventName, handler] of elementState.eventListeners) {
@@ -1250,7 +1262,7 @@ function detachEventHandlers(elementState) {
   }
   elementState.eventListeners.clear();
 }
-function createElement(element, context, eventHandlers) {
+function createElement(element, context, eventHandlers, isRootElement = false) {
   const tag = getElementTag(element);
   const domElement = document.createElement(tag);
   domElement.setAttribute("data-servly-id", element.i);
@@ -1276,7 +1288,7 @@ function createElement(element, context, eventHandlers) {
     textContent,
     eventListeners: /* @__PURE__ */ new Map()
   };
-  attachEventHandlers(domElement, element, eventHandlers, context, elementState);
+  attachEventHandlers(domElement, element, eventHandlers, context, elementState, isRootElement);
   return elementState;
 }
 var globalRenderingStack = /* @__PURE__ */ new Set();
@@ -1337,8 +1349,8 @@ function renderComponentRef(element, container, context, state) {
     globalRenderingStack.delete(refId);
   }
 }
-function renderElement(element, tree, context, eventHandlers, elementStates, state) {
-  const elementState = createElement(element, context, eventHandlers);
+function renderElement(element, tree, context, eventHandlers, elementStates, state, isRootElement = false) {
+  const elementState = createElement(element, context, eventHandlers, isRootElement);
   elementStates.set(element.i, elementState);
   const config = element.configuration;
   if (config?.componentViewRef) {
@@ -1350,7 +1362,7 @@ function renderElement(element, tree, context, eventHandlers, elementStates, sta
   }
   const children = tree.get(element.i) || [];
   for (const child of children) {
-    const childElement = renderElement(child, tree, context, eventHandlers, elementStates, state);
+    const childElement = renderElement(child, tree, context, eventHandlers, elementStates, state, false);
     elementState.domElement.appendChild(childElement);
   }
   return elementState.domElement;
@@ -1399,14 +1411,16 @@ function render(options) {
         context,
         eventHandlers,
         state.elementStates,
-        state
+        state,
+        true
+        // isRootElement
       );
       container.appendChild(state.rootElement);
     } else {
       const wrapper = document.createElement("div");
       wrapper.setAttribute("data-servly-wrapper", "true");
       for (const root of rootElements) {
-        const rootElement = renderElement(root, tree, context, eventHandlers, state.elementStates, state);
+        const rootElement = renderElement(root, tree, context, eventHandlers, state.elementStates, state, true);
         wrapper.appendChild(rootElement);
       }
       state.rootElement = wrapper;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servlyadmin/runtime-core",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "Framework-agnostic core renderer for Servly components",
   "type": "module",
   "main": "./dist/index.cjs",