zova-jsx 1.1.25 → 1.1.27

package/dist/index.js

@@ -3,7 +3,7 @@ import { celEnvBase, getProperty, evaluateExpressions, isEmptyObject, isNil, isP
 import { toUpperCaseFirstChar } from '@cabloy/word-utils';
 import { classes } from 'typestyle';
 import { h, createTextVNode } from 'vue';
-import { BeanSimple, objectAssignReactive, cast, beanFullNameFromOnionName } from 'zova-core';
+import { BeanSimple, objectAssignReactive, cast } from 'zova-core';
 
 const renderFieldJsxPropsSystem = ['children', 'v-slot', 'v-slot-scope', 'v-if', 'v-for', 'v-each', 'key'];
 
@@ -20,10 +20,10 @@ function isLegacyComponent(Component) {
   return typeof Component === 'string' && !Component.includes(':') && Component.charAt(0) >= 'A' && Component.charAt(0) <= 'Y';
 }
 function isJsxComponent(Component) {
-  return typeof Component === 'object' && Component.$$typeof === 'zova-jsx:component';
+  return typeof Component === 'object' && Component?.$$typeof === 'zova-jsx:component';
 }
 function isJsxEvent(Component) {
-  return typeof Component === 'object' && Component.$$typeof === 'zova-jsx:event';
+  return typeof Component === 'object' && Component?.$$typeof === 'zova-jsx:event';
 }
 function invokeProp(prop) {
   if (typeof prop === 'function') return prop();
@@ -34,14 +34,12 @@ function normalizePropName(name) {
 }
 
 class ZovaJsx extends BeanSimple {
-  constructor(components, actions, celEnv) {
+  constructor(components, celEnv) {
     super();
     this._components = void 0;
-    this._actions = void 0;
     this._celEnv = void 0;
     this._transientObject = void 0;
     this._components = components;
-    this._actions = actions;
     this._celEnv = this._prepareCelEnv(celEnv ?? celEnvBase);
   }
   _prepareCelEnv(celEnv) {
@@ -72,26 +70,23 @@ class ZovaJsx extends BeanSimple {
   get components() {
     return this._components;
   }
-  get actions() {
-    return this._actions;
-  }
   get celEnv() {
     return this._celEnv;
   }
   evaluateExpression(expression, celScope) {
     return evaluateExpressions(expression, celScope, this.celEnv);
   }
-  renderJsxOrCel(componentOptions, props, celScope, renderContext) {
+  renderJsxOrCel(componentJsx, props, celScope, renderContext) {
     // component
-    if (isJsxComponent(componentOptions)) {
+    if (isJsxComponent(componentJsx)) {
       const transientObject = this.transientObject;
       return () => {
         return this.setTransientObject(transientObject, () => {
-          return this.render(componentOptions, props, celScope, renderContext);
+          return this.render(componentJsx, props, celScope, renderContext);
         });
       };
     }
-    if (isJsxEvent(componentOptions)) {
+    if (isJsxEvent(componentJsx)) {
       let transientObject = this.transientObject;
       return event => {
         transientObject = {
@@ -99,17 +94,17 @@ class ZovaJsx extends BeanSimple {
           eventObject: event
         };
         return this.setTransientObject(transientObject, () => {
-          return this.renderEvent(event, componentOptions, celScope, renderContext);
+          return this.renderEvent(event, componentJsx, celScope, renderContext);
         });
       };
     }
     // normal
-    return this.evaluateExpression(componentOptions, celScope);
+    return this.evaluateExpression(componentJsx, celScope);
   }
-  renderEvent(event, componentOptions, celScope, renderContext) {
+  renderEvent(event, componentJsx, celScope, renderContext) {
     // props
     if (event && event instanceof Event) {
-      const props = this.renderJsxProps(componentOptions.props, {}, celScope, renderContext);
+      const props = this.renderJsxProps(componentJsx.props, {}, celScope, renderContext);
       if (props.stop) event.stopPropagation();
       if (props.prevent) event.preventDefault();
     }
@@ -118,10 +113,10 @@ class ZovaJsx extends BeanSimple {
     celScope = objectAssignReactive({}, celScope, {
       res: eventRes
     });
-    return this.renderEventDirect(componentOptions, celScope, renderContext, eventRes);
+    return this.renderEventDirect(componentJsx, celScope, renderContext, eventRes);
   }
-  renderEventDirect(componentOptions, celScope, renderContext, eventRes, next) {
-    const actions = this._collectEventActions(componentOptions, celScope, renderContext, eventRes);
+  renderEventDirect(componentJsx, celScope, renderContext, eventRes, next) {
+    const actions = this._collectEventActions(componentJsx, celScope, renderContext, eventRes);
     if (!actions || actions.length === 0) return next ? next(undefined) : undefined;
     const transientObject = this.transientObject;
     return compose(actions)(undefined, actionRes => {
@@ -131,8 +126,8 @@ class ZovaJsx extends BeanSimple {
       });
     });
   }
-  _collectEventActions(componentOptions, celScope, renderContext, eventRes) {
-    let actionChildren = componentOptions.props?.children;
+  _collectEventActions(componentJsx, celScope, renderContext, eventRes) {
+    let actionChildren = componentJsx.props?.children;
     if (!actionChildren) return;
     if (!Array.isArray(actionChildren)) actionChildren = [actionChildren];
     const actions = [];
@@ -169,14 +164,7 @@ class ZovaJsx extends BeanSimple {
       const vIf = this.evaluateExpression(actionChild.props?.['v-if'], celScope);
       if (vIf === false) return next(undefined);
       // action
-      if (actionChild.type === 'actionVar') {
-        const props = this.renderJsxProps(actionChild.props, {}, celScope, renderContext);
-        celScope[cast(props).name] = cast(props).value;
-        return next(undefined);
-      } else if (actionChild.type === 'actionExpr') {
-        const expression = this.evaluateExpression(cast(actionChild.props)?.expression, celScope);
-        return next(expression);
-      } else if (isJsxEvent(actionChild)) {
+      if (actionChild.type === 'ActionActions') {
         // nested action
         eventRes[index] = [];
         return this.renderEventDirect(actionChild, objectAssignReactive({}, celScope), renderContext, eventRes[index], next);
@@ -188,8 +176,7 @@ class ZovaJsx extends BeanSimple {
   }
   _renderEventActionNormal(actionChild, celScope, renderContext, next) {
     // action
-    const actionName = this.normalizeAction(actionChild.type);
-    const beanFullName = beanFullNameFromOnionName(actionName, 'action');
+    const beanFullName = actionChild.type;
     const beanInstance = this.sys.bean._getBeanSyncOnly(beanFullName);
     if (beanInstance) {
       // sync
@@ -206,7 +193,7 @@ class ZovaJsx extends BeanSimple {
   _renderEventActionNormal_inner(beanInstance, actionChild, celScope, renderContext, next) {
     const onionOptions = beanInstance.$onionOptions;
     // props
-    let props = this.renderJsxProps(actionChild.props, {}, celScope, renderContext);
+    let props = this.renderJsxProps(cast(actionChild.props).options, {}, celScope, renderContext);
     if (!isEmptyObject(onionOptions)) {
       // not use deepExtend, maybe: Maximum call stack size exceeded
       props = Object.assign({}, onionOptions, props);
@@ -214,24 +201,25 @@ class ZovaJsx extends BeanSimple {
     if (!renderContext) throw new Error('should provide renderContext');
     return beanInstance.execute(props, renderContext, next);
   }
-  render(componentOptions, props, celScope, renderContext) {
-    if (!componentOptions) {
-      throw new Error(`render component should not ${componentOptions}`);
+  render(componentJsx, propsInit, celScope, renderContext) {
+    if (!componentJsx) {
+      throw new Error(`render component should not ${componentJsx}`);
     }
-    props = props ?? {};
-    componentOptions = this.normalizeComponenOptions(componentOptions);
+    componentJsx = this.normalizeComponenJsx(componentJsx, propsInit);
+    const componentProps = componentJsx.props;
+    const props = {}; // new one
     // vIf
-    const vIf = this.evaluateExpression(componentOptions.props?.['v-if'], celScope);
+    const vIf = this.evaluateExpression(componentProps?.['v-if'], celScope);
     if (vIf === false) return;
     // component
-    const Component = this.normalizeComponent(componentOptions.type);
+    const Component = this.normalizeComponent(componentJsx.type);
     // vFor
-    const vFor = this.evaluateExpression(componentOptions.props?.['v-for'], celScope);
-    if (!vFor) return this._renderJsxSingle(Component, componentOptions, props, celScope, renderContext);
+    const vFor = this.evaluateExpression(componentProps?.['v-for'], celScope);
+    if (!vFor) return this._renderJsxSingle(Component, componentJsx, props, celScope, renderContext);
     const children = [];
     for (let index = 0; index < vFor.length; index++) {
       const each = vFor[index];
-      const eachName = this.evaluateExpression(componentOptions.props?.['v-each'], celScope) ?? 'each';
+      const eachName = this.evaluateExpression(componentJsx.props?.['v-each'], celScope) ?? 'each';
       const celScopeEach = objectAssignReactive({}, celScope, {
         [eachName]: each,
         [`${eachName}Index`]: index
@@ -239,22 +227,29 @@ class ZovaJsx extends BeanSimple {
       const propsEach = {
         ...props
       };
-      const child = this._renderJsxSingle(Component, componentOptions, propsEach, celScopeEach, renderContext);
+      const child = this._renderJsxSingle(Component, componentJsx, propsEach, celScopeEach, renderContext);
       if (child) {
         children.push(child);
       }
     }
     return children;
   }
-  normalizeComponenOptions(componentOptions) {
-    if (typeof componentOptions === 'object') return componentOptions;
+  normalizeComponenJsx(componentJsx, propsInit) {
+    if (typeof componentJsx === 'object') {
+      return Object.assign({}, componentJsx, {
+        key: cast(propsInit)?.key ?? componentJsx.key,
+        props: Object.assign({}, componentJsx.props, propsInit)
+      });
+    }
     return {
-      type: componentOptions
+      type: componentJsx,
+      props: propsInit
     };
   }
   normalizeComponent(type) {
     if (typeof type === 'function') return type;
-    if (typeof type === 'string') {
+    // if type is native element, for example: 'div/input'
+    if (typeof type === 'string' && !isNativeElement(type)) {
       type = this.components?.[type] ?? type;
     }
     if (typeof type === 'string' && ['script', 'style', 'link'].includes(type)) {
@@ -263,27 +258,24 @@ class ZovaJsx extends BeanSimple {
     // div/QInput/Zova Component
     return type;
   }
-  normalizeAction(type) {
-    return this.actions?.[type] ?? type;
-  }
-  _renderJsxSingle(Component, componentOptions, props, celScope, renderContext) {
+  _renderJsxSingle(Component, componentJsx, props, celScope, renderContext) {
     const _isZovaComponent = isZovaComponent(Component);
     // key
-    if (!cast(props).key && componentOptions.key) {
-      cast(props).key = this.evaluateExpression(componentOptions.key, celScope);
+    if (!isNil(componentJsx.key)) {
+      cast(props).key = this.evaluateExpression(componentJsx.key, celScope);
     }
     // props
-    this.renderJsxProps(componentOptions.props, props, celScope, renderContext);
+    this.renderJsxProps(componentJsx.props, props, celScope, renderContext);
     // children
     let children;
-    const propsChildren = componentOptions.props?.children;
+    const propsChildren = componentJsx.props?.children;
     if (!propsChildren) {
       children = undefined;
     } else {
       if (isNativeElement(Component)) {
-        children = this.renderJsxChildrenDirect(componentOptions.props.children, celScope, renderContext);
+        children = this.renderJsxChildrenDirect(componentJsx.props.children, celScope, renderContext);
       } else {
-        const childrenCollect = this._renderJsxChildrenCollect(componentOptions.props.children, celScope, renderContext);
+        const childrenCollect = this._renderJsxChildrenCollect(componentJsx.props.children, celScope, renderContext);
         if (_isZovaComponent) {
           for (const key in childrenCollect) {
             const slot = childrenCollect[key];

package/dist/lib/zovaJsx.d.ts

@@ -1,41 +1,34 @@
 import type { VNode } from 'vue';
 import { celEnvBase } from '@cabloy/utils';
 import { BeanSimple } from 'zova-core';
-import type { IFormProviderComponents, TypeRenderComponent, TypeRenderComponentJsx, TypeRenderComponentJsxProps } from '../types/rest.ts';
+import type { TypeRenderComponent, TypeRenderComponentJsx, TypeRenderComponentJsxProps } from '../types/rest.ts';
 type CelEnv = typeof celEnvBase;
 export declare class ZovaJsx extends BeanSimple {
     private _components;
-    private _actions;
     private _celEnv;
     private _transientObject;
-    constructor(components?: IFormProviderComponents, actions?: Record<string, string>, celEnv?: CelEnv);
+    constructor(components?: {}, celEnv?: CelEnv);
     private _prepareCelEnv;
     setTransientObject<T>(transientObject: {} | undefined, fnMethod: () => T): T;
     get transientObject(): any;
     get event(): Event | undefined;
-    get components(): IFormProviderComponents | undefined;
-    get actions(): Record<string, string> | undefined;
+    get components(): {} | undefined;
     get celEnv(): CelEnv;
     evaluateExpression(expression: any, celScope?: {}): any;
-    renderJsxOrCel(componentOptions: TypeRenderComponent | any, props: {} | undefined, celScope: {}, renderContext: {}): any;
-    renderEvent(event: Event, componentOptions: TypeRenderComponentJsx, celScope: {}, renderContext: {}): any;
-    renderEventDirect(componentOptions: TypeRenderComponentJsx, celScope: {}, renderContext: {}, eventRes: any[], next?: Function): any;
+    renderJsxOrCel(componentJsx: TypeRenderComponent | any, props: {} | undefined, celScope?: {}, renderContext?: {}): any;
+    renderEvent(event: Event, componentJsx: TypeRenderComponentJsx, celScope?: {}, renderContext?: {}): any;
+    renderEventDirect(componentJsx: TypeRenderComponentJsx, celScope: {}, renderContext: {} | undefined, eventRes: any[], next?: Function): any;
     private _collectEventActions;
     private _actionHandler;
     private _renderEventActionNormal;
     private _renderEventActionNormal_inner;
-    render(componentOptions: TypeRenderComponent, props: {} | undefined, celScope: {}, renderContext: {}): VNode<import("vue").RendererNode, import("vue").RendererElement, {
-        [key: string]: any;
-    }> | VNode<import("vue").RendererNode, import("vue").RendererElement, {
-        [key: string]: any;
-    }>[] | undefined;
-    normalizeComponenOptions(componentOptions: TypeRenderComponent): TypeRenderComponentJsx;
+    render(componentJsx: TypeRenderComponent, propsInit: {} | undefined, celScope?: {}, renderContext?: {}): VNode | VNode[] | undefined;
+    normalizeComponenJsx(componentJsx: TypeRenderComponent, propsInit?: {}): TypeRenderComponentJsx;
     normalizeComponent(type: TypeRenderComponent): TypeRenderComponent;
-    normalizeAction(type: string): string;
     private _renderJsxSingle;
-    renderJsxProps(jsxProps: TypeRenderComponentJsxProps | undefined, props: {}, celScope: {}, renderContext: {}): {};
+    renderJsxProps(jsxProps: TypeRenderComponentJsxProps | undefined, props: {}, celScope?: {}, renderContext?: {}): {};
     private _renderJsxChildrenCollect;
-    renderJsxChildrenDirect(jsxChildren: TypeRenderComponentJsx | TypeRenderComponentJsx[], celScope: {}, renderContext: {}): VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    renderJsxChildrenDirect(jsxChildren: TypeRenderComponentJsx | TypeRenderComponentJsx[], celScope?: {}, renderContext?: {}): VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>[];
 }

package/dist/types/rest.d.ts

@@ -19,5 +19,3 @@ export interface TypeRenderComponentJsx {
 }
 export type TypeRenderComponentNormal = Constructable<ComponentPublicInstance> | string;
 export type TypeRenderComponent = TypeRenderComponentNormal | TypeRenderComponentJsx;
-export interface IFormProviderComponents {
-}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "zova-jsx",
-  "version": "1.1.25",
-  "gitHead": "31f5f5712ea26eaebb2eae9990e6a089c1f087ca",
+  "version": "1.1.27",
+  "gitHead": "da650d644d8851a92a8da4babaebfef74c9e8a5d",
   "description": "Zova JSX",
   "keywords": [
     "ioc",
@@ -41,10 +41,10 @@
   },
   "dependencies": {
     "@cabloy/compose": "^2.1.4",
-    "@cabloy/utils": "^2.1.9",
-    "@cabloy/word-utils": "^2.1.8",
+    "@cabloy/utils": "^2.1.15",
+    "@cabloy/word-utils": "^2.1.9",
     "typestyle": "^2.4.0",
     "vue": "^3.5.32",
-    "zova-core": "^5.1.23"
+    "zova-core": "^5.1.24"
   }
 }