pawajs 1.4.35 → 1.4.37

package/index.js

@@ -295,7 +295,10 @@ export const createIntersectionObserver = (element, observeBy) => {
                     while (instances.length > 0) {
                         const { element: el, func } = instances.shift();
                         if (el) {
-                            if (el._component) el._component.component = compoFunc;
+                            if (el._component){
+                              el._component.component = compoFunc;
+                              el._component.validPropRule=compoFunc?.validateProps || {}
+                            } 
                             
                             keepContext(el._stateContext);
                             el._stateContext._hasRun = false;
@@ -320,6 +323,7 @@ RegisterComponent.lazy=async(...args)=>{
             if (components.has(name.toUpperCase())) return
             if (typeof name === 'string' && typeof component === 'function') {
                 if (isServer()) {
+                    lazyComponents.set(name.toUpperCase(), {name,component});
                    const compo=await component()
                    if (compo[name]) {
                        components.set(name.toUpperCase(),compo[name]) 
@@ -602,6 +606,20 @@ export const useInsert = (obj = {}) => {
     }
 }
 const createDeepProxy = (target, callback) => {
+    // Skip proxies for DOM objects and native objects that don't work well with proxies
+    if (target instanceof FileList) return target
+    if (target instanceof File) return target
+    if (target instanceof Blob) return target
+    if (target instanceof FormData) return target
+    if (target instanceof Date) return target
+    if (target instanceof RegExp) return target
+    
+    // Also skip if it's already a proxy
+    if (target && target._isPawaProxy) return target
+    
+    // Also skip if it's a DOM element
+    if (target && target.nodeType && typeof target === 'object') return target
+    
     return new Proxy(target, {
         get(target, property) {
             const value = target[property];
@@ -906,8 +924,9 @@ const component = (el, resume = false, attr, notRender, stopResume) => {
               if (!lazyComponentElement.has(name)) {
                 createInsectObserver(trackElement,el)
               }
+            }else{
+                resumer.resume_component?.(el, attr, setStateContext, mapsPlugins, formerStateContext, pawaContext, stateWatch, { comment, endComment, name, serialized, id, children })
             }
-        resumer.resume_component?.(el, attr, setStateContext, mapsPlugins, formerStateContext, pawaContext, stateWatch, { comment, endComment, name, serialized, id, children })
     }
 }
 
@@ -1067,7 +1086,7 @@ const directives = {
     'for-each': For,
     else:(el)=>{el._running =true},
     case:(el)=>{el._running =true},
-    default:(el)=>{el._running =true},
+    "s-default":(el)=>{el._running =true},
     'else-if':(el)=>{el._running =true},
     mount: mountElement,
     unmount: unMountElement,

package/merger/switch.js

@@ -52,7 +52,7 @@ export const merger_switch=(el,attr,stateContext,resume=false,{comment,endCommen
                 }
             }
             const setElement=(newElement,exp)=>{
-                newElement.removeAttribute(exp)
+                newElement.removeAttribute(exp === 'default'?'s-default':exp)
                 if (stateContext._hasRun) {
                     stateContext._hasRun = false
                     keepContext(stateContext)

package/normal/component.js

@@ -153,13 +153,15 @@ export const normal_component=(el,stateContext,setStateContext,mapsPlugin,former
     }
     const context=el._context
        const propsSetter=()=>{   
+         const findElement=div.querySelector('[--]') || div.querySelector('[rest]')
+         if (findElement) {
+        findElement.removeAttribute('--')
+        findElement.removeAttribute('rest')
+        }
     if(Object.entries(el._restProps).length > 0){
-      const findElement=div.querySelector('[--]') || div.querySelector('[rest]')
       if (findElement) {
         for (const [key,value] of Object.entries(el._restProps)) {
             findElement.setAttribute(value.name,value.value)
-            findElement.removeAttribute('--')
-            findElement.removeAttribute('rest')
           }
         }
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pawajs",
-  "version": "1.4.35",
+  "version": "1.4.37",
   "type":"module",
   "description": "pawajs library (reactive web runtime) for easily building web ui, enhancing html element, micro frontend etc ",
   "main": "index.js",

package/pawaElement.js

@@ -1,5 +1,5 @@
 import {components,lazyComponents ,escapePawaAttribute,getPawaAttributes,getDependentAttribute,getPrimaryDirectives } from './index.js';
-import {splitAndAdd,replaceTemplateOperators,setPawaDevError,getEvalValues} from './utils.js';
+import {splitAndAdd,replaceTemplateOperators,setPawaDevError,getEvalValues, checkKeywordsExistence} from './utils.js';
 import PawaComponent from './pawaComponent.js';
 import { createIntersectionObserver } from './index.js';
 import { addLazyComponentElement } from './index.js';
@@ -51,9 +51,9 @@ export class PawaElement {
     return Array.from(this._el.children)
   }
   checkLazy(){
-    if (lazyComponents.has(this._el.tagName)) {
+    if (lazyComponents.has(splitAndAdd(this._el.tagName))) {
       this._lazy=true
-      if (!lazyComponentElement.has(this._el.tagName)) {
+      if (!lazyComponentElement.has(splitAndAdd(this._el.tagName))) {
         createIntersectionObserver(this._el)
       }
     }
@@ -293,14 +293,49 @@ export class PawaElement {
       const pawaAttribute=getPawaAttributes()
       const dependAttribute=getDependentAttribute()
       this._attributes.forEach((attr) => {
+        
         if (!attr.name.startsWith(':') && !pawaAttribute.has(attr.name) && !dependAttribute.has(attr.name)) {
           let name=''
-                if (attr.name.startsWith('-')) {
-                  name=attr.name.slice(1)
-                } else {
-                  name=attr.name
+          if (attr.name.startsWith('-')) {
+            name=attr.name.slice(1)
+          } else {
+            name=attr.name
+          }
+          const context=this._context
+                const setProps=()=>{
+                 delete this._restProps[name]
+                 let value=attr.value
+                 if (value.includes('@{')) {
+                   const regex = /@{([^}]*)}/g;
+                 value = value.replace(regex, (match, expression) => {
+                     if (checkKeywordsExistence(this._staticContext, expression)) {
+                         return value
+                     } else {
+                         const res = this.safeEval(context, expression, 'props', true)
+                         return res
+                     }
+                 });
+                 return value
+                 }else if( attr.name.startsWith('on-') || attr.name.startsWith('out-')){
+                  const res=this.safeEval(context,`(e)=>{
+                    ${attr.value}
+                  }`, 'props',true)
+                  return res
+                 }
+                 return attr.value
+                }
+                
+                if (this._props[name] || name === 'class' && this._props['className'] || name === 'defaultValue' && this._props['defaultValue']) return
+                name=name.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
+                if (name === 'class') {
+                  this._props['className']=setProps
+                }else if(name === 'default'){
+                  this._props['defaultValue']=setProps
+                }else{
+                  this._props[name]=setProps
                 }
-                this._restProps[name]={name:name,value:attr.value}    
+                
+                this._restProps[name]={name:name,value:attr.value} 
        }else if(!pawaAttribute.has(attr.name) && attr.name.startsWith(':')){
         
         const propsName=attr.name.slice(1) 

package/power.js

@@ -222,7 +222,7 @@ export const Switch = (el, attr, stateContext,resume=false,notRender,stopResume)
                                 chainMap.set(nextSibling.getAttribute('case'),{condition:'case',element:nextSibling})
                                 getChained(nextSibling.nextElementSibling)
                                 nextSibling.remove()
-                            }else if (nextSibling.getAttribute('default') === '') {
+                            }else if (nextSibling.getAttribute('s-default') === '') {
                                 chained.push({
                                     exp:'false',
                                     condition:'default',

package/utils.js

@@ -176,7 +176,12 @@ export const sanitizeTemplate = (temp) => {
 };
 
 export const ComponentProps=(somes,message,name,key)=>{
-let some=somes?.() || somes
+let some
+  if (typeof somes === 'function') {
+    some=somes()
+  }else{
+    some=somes
+  }
     return({
     Array:()=>{