@oinone/kunlun-vue-widget 6.4.9 → 7.2.0

package/dist/types/src/util/install.d.ts

@@ -1,4 +1,4 @@
-import { Component, Directive, Plugin } from 'vue';
-export declare function componentInstall(component: Component, name?: string | string[]): void;
-export declare function directiveInstall(directive: Directive, name: string): void;
-export declare function pluginInstall(plugin: Plugin, ...options: unknown[]): void;
+import type { Component, Directive, Plugin } from 'vue';
+export declare function componentInstall(component: Component, name?: string | string[]): void;
+export declare function directiveInstall(directive: Directive, name: string): void;
+export declare function pluginInstall(plugin: Plugin, ...options: unknown[]): void;

package/dist/types/src/util/render.d.ts

@@ -1,7 +1,7 @@
-import { Slots, VNode } from 'vue';
-import { VueWidget } from '../basic';
-export declare function renderWidgets(widgets: VueWidget[], ctx: Record<string, unknown>, slots?: Slots): VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}> | VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>[] | undefined;
+import type { Slots, VNode } from 'vue';
+import { VueWidget } from '../basic';
+export declare function renderWidgets(widgets: VueWidget[], ctx: Record<string, unknown>, slots?: Slots): VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | undefined;

package/dist/types/src/util/widget-manager.d.ts

@@ -1,4 +1,4 @@
-import { VueWidget } from '../basic';
-export declare function newVueWidget(): VueWidget;
-export declare function getWidget(handler: string): VueWidget | undefined;
-export declare function getWidgetNotNull(handle: string): VueWidget;
+import { VueWidget } from '../basic';
+export declare function newVueWidget(): VueWidget;
+export declare function getWidget(handler: string): VueWidget | undefined;
+export declare function getWidgetNotNull(handle: string): VueWidget;

package/dist/types/src/view/index.d.ts

@@ -1,161 +1,161 @@
-import { EntityBody, IViewProps, ListVM, ObjectVM, RuntimeModel } from '@oinone/kunlun-engine';
-import { LifeCycleTypes, ViewEventName } from '@oinone/kunlun-event';
-import { Entity, IDslNode, IModel, IView, ViewElement, ViewId, ViewType } from '@oinone/kunlun-meta';
-import { Matched } from '@oinone/kunlun-router';
-import { Constructor } from '@oinone/kunlun-shared';
-import { SPIOptions, SPISingleSelector, SPITokenFactory } from '@oinone/kunlun-spi';
-import { DslNodeWidget } from '../dsl/DslNodeWidget';
-export interface IViewFilterOptions extends SPIOptions {
-    id?: ViewId[] | ViewId;
-    name?: string[] | string;
-    type?: ViewType[] | ViewType;
-    model?: string[] | string;
-    widget?: string[] | string;
-    tagName?: string[] | string;
-}
-declare type WatchCb<T> = (value: T, oldValue: T) => void;
-export declare abstract class ViewWidget<ViewData = any, VP extends IViewProps = any, VM extends ListVM | ObjectVM = any> extends DslNodeWidget<VP> {
-    static Token: SPITokenFactory<IViewFilterOptions>;
-    static Selector: SPISingleSelector<IViewFilterOptions, Constructor<ViewWidget>>;
-    protected loading: boolean;
-    protected currentRoute: Matched;
-    rootData: EntityBody;
-    private subjectRoute$;
-    private $$vm;
-    getVM(): VM;
-    setVM($$vm: VM): void;
-    /**
-     * 设置loading
-     */
-    setBusy(busy: boolean): void;
-    /**
-     * 获取url参数
-     *
-     * @returns {Record<string, string>}
-     */
-    getUrlParams(): any;
-    /**
-     * 获取当前是否处于loading状态
-     */
-    getBusy(): boolean;
-    initialize(props: VP): this;
-    protected domain: string;
-    private filter;
-    private parentRootHandlerStr;
-    private currentRootHandlerStr;
-    private get rootHandleStr();
-    isRootView: boolean;
-    /**
-     * 监听视图的事件
-     * @param  event 事件名 / 事件对象
-     * @param  handler? 回调函数
-     *
-     * @example
-     *
-     * 单个事件监听
-     * viewWidget.on('change', (fieldInstance) => {})
-     * viewWidget.on('blur', (fieldInstance) => {})
-     */
-    on<V = ViewWidget>(event: {
-        [key in ViewEventName]?: (view: V) => void;
-    }): void;
-    /**
-     * 多个事件监听
-     *
-     * @example
-     *
-     * viewWidget.on({
-     *  change(fieldInstance) => {},
-     *  blur(fieldInstance) => {},
-     * })
-     */
-    on<V = ViewWidget>(event: ViewEventName, handler: (view: V) => void): void;
-    /**
-     * 用来监听视图数据的的变化
-     *
-     * @param {(value, oldValue):void} cb 监听数据发生变化的回调函数
-     * @param {object} options 可配置选项
-     *         watchKey -> 当key对应的value发生变化后，才会触发回调用函数
-     *                      "如果要监听的数据是对象，那么该参数不会生效"
-     *         distinct -> 是否去重（当上一个值跟当前的值相当的时候，就不会处理）
-     *
-     * @example
-     * const widget = this.createWidget(FormWidget, undefined, {....})
-     * widget.watch((value) => {....})
-     *
-     */
-    watch(cb: WatchCb<ViewData>): any;
-    watch(cb: WatchCb<ViewData>, options: {
-        watchKey?: string;
-        distinct?: boolean;
-    }): any;
-    watch(cb: WatchCb<ViewData>, options: {
-        watchKey?: string[];
-        distinct?: boolean;
-    }): any;
-    /**
-     * 如果没有key，就不做任何处理
-     * 如果key不是字符串类型，也不是数组类型，那么不做任何处理
-     */
-    protected filterWatchData(pre: ViewData, next: ViewData, key: string | string[]): boolean;
-    isDialogView: boolean;
-    /**
-     * 当前的widget是不是更节点
-     */
-    get isRoot(): boolean;
-    get useConstruct(): boolean;
-    private selfHandleStr;
-    view: IView;
-    protected model: RuntimeModel | null;
-    protected type: 'FORM' | 'TABLE' | 'UNKNOWN';
-    /**
-     * 页面默认的参数, A页面跳转到B页面，期望能带入参数过去
-     */
-    protected initQueryParams: Record<string, string> | null;
-    get viewElement(): ViewElement | any;
-    protected resolveTemplate(): void;
-    fetchData(data?: Entity[], options?: any, variables?: Record<string, unknown>): unknown;
-    onRowsChange(data: any[]): void;
-    loadData(data: ViewData, reset?: boolean): unknown;
-    /**
-     * 加载`rootData` 数据
-     */
-    loadRootData(content: any): void;
-    setRootDataByKey(key: string, value: any): void;
-    submit(): unknown;
-    getData(): ViewData;
-    setData(content: ViewData): void;
-    validator(): Promise<any[]>;
-    /**
-     * 加载元数据，允许被重写
-     *
-     * @param  {IModel} model 模型
-     * @param  {IDslNode} dslNode? dslNode，如果不传入，会自动创建
-     * @param  {IView} view? 视图，如果不传入，会自动创建
-     * @param  {ViewType} viewType? 指定视图类型
-     */
-    loadMetadata(model: IModel, dslNode?: IDslNode, view?: IView, viewType?: ViewType): void;
-    getActiveRecords(): Entity[];
-    setDomain(domain: string): void;
-    getDomain(): string;
-    setFilter(f: string): void;
-    getFilter(): string;
-    getModel(): IModel;
-    getView(): IView;
-    path: string;
-    getPath(): string;
-    notify(type: LifeCycleTypes): void;
-    $$beforeCreated(): void;
-    $$created(): void;
-    $$beforeMount(): void;
-    $$mounted(): void;
-    $$beforeUpdate(): void;
-    $$updated(): void;
-    $$beforeUnmount(): void;
-    $$unmounted(): void;
-}
-/**
- * @deprecated 移动端未修改，必须移除该定义
- */
-export declare const ViewSubSymbol: unique symbol;
-export {};
+import { type EntityBody, type IViewProps, ListVM, ObjectVM, type RuntimeModel } from '@oinone/kunlun-engine';
+import { LifeCycleTypes, type ViewEventName } from '@oinone/kunlun-event';
+import { type Entity, type IDslNode, type IModel, type IView, ViewElement, type ViewId, ViewType } from '@oinone/kunlun-meta';
+import { type Matched } from '@oinone/kunlun-router';
+import type { Constructor } from '@oinone/kunlun-shared';
+import { type SPIOptions, type SPISingleSelector, type SPITokenFactory } from '@oinone/kunlun-spi';
+import { DslNodeWidget } from '../dsl/DslNodeWidget';
+export interface IViewFilterOptions extends SPIOptions {
+    id?: ViewId[] | ViewId;
+    name?: string[] | string;
+    type?: ViewType[] | ViewType;
+    model?: string[] | string;
+    widget?: string[] | string;
+    tagName?: string[] | string;
+}
+type WatchCb<T> = (value: T, oldValue: T) => void;
+export declare abstract class ViewWidget<ViewData = any, VP extends IViewProps = any, VM extends ListVM | ObjectVM = any> extends DslNodeWidget<VP> {
+    static Token: SPITokenFactory<IViewFilterOptions>;
+    static Selector: SPISingleSelector<IViewFilterOptions, Constructor<ViewWidget>>;
+    protected loading: boolean;
+    protected currentRoute: Matched;
+    rootData: EntityBody;
+    private subjectRoute$;
+    private $$vm;
+    getVM(): VM;
+    setVM($$vm: VM): void;
+    /**
+     * 设置loading
+     */
+    setBusy(busy: boolean): void;
+    /**
+     * 获取url参数
+     *
+     * @returns {Record<string, string>}
+     */
+    getUrlParams(): any;
+    /**
+     * 获取当前是否处于loading状态
+     */
+    getBusy(): boolean;
+    initialize(props: VP): this;
+    protected domain: string;
+    private filter;
+    private parentRootHandlerStr;
+    private currentRootHandlerStr;
+    private get rootHandleStr();
+    isRootView: boolean;
+    /**
+     * 监听视图的事件
+     * @param  event 事件名 / 事件对象
+     * @param  handler? 回调函数
+     *
+     * @example
+     *
+     * 单个事件监听
+     * viewWidget.on('change', (fieldInstance) => {})
+     * viewWidget.on('blur', (fieldInstance) => {})
+     */
+    on<V = ViewWidget>(event: {
+        [key in ViewEventName]?: (view: V) => void;
+    }): void;
+    /**
+     * 多个事件监听
+     *
+     * @example
+     *
+     * viewWidget.on({
+     *  change(fieldInstance) => {},
+     *  blur(fieldInstance) => {},
+     * })
+     */
+    on<V = ViewWidget>(event: ViewEventName, handler: (view: V) => void): void;
+    /**
+     * 用来监听视图数据的的变化
+     *
+     * @param {(value, oldValue):void} cb 监听数据发生变化的回调函数
+     * @param {object} options 可配置选项
+     *         watchKey -> 当key对应的value发生变化后，才会触发回调用函数
+     *                      "如果要监听的数据是对象，那么该参数不会生效"
+     *         distinct -> 是否去重（当上一个值跟当前的值相当的时候，就不会处理）
+     *
+     * @example
+     * const widget = this.createWidget(FormWidget, undefined, {....})
+     * widget.watch((value) => {....})
+     *
+     */
+    watch(cb: WatchCb<ViewData>): any;
+    watch(cb: WatchCb<ViewData>, options: {
+        watchKey?: string;
+        distinct?: boolean;
+    }): any;
+    watch(cb: WatchCb<ViewData>, options: {
+        watchKey?: string[];
+        distinct?: boolean;
+    }): any;
+    /**
+     * 如果没有key，就不做任何处理
+     * 如果key不是字符串类型，也不是数组类型，那么不做任何处理
+     */
+    protected filterWatchData(pre: ViewData, next: ViewData, key: string | string[]): boolean;
+    isDialogView: boolean;
+    /**
+     * 当前的widget是不是更节点
+     */
+    get isRoot(): boolean;
+    get useConstruct(): boolean;
+    private selfHandleStr;
+    view: IView;
+    protected model: RuntimeModel | null;
+    protected type: 'FORM' | 'TABLE' | 'UNKNOWN';
+    /**
+     * 页面默认的参数, A页面跳转到B页面，期望能带入参数过去
+     */
+    protected initQueryParams: Record<string, string> | null;
+    get viewElement(): ViewElement | any;
+    protected resolveTemplate(): void;
+    fetchData(data?: Entity[], options?: any, variables?: Record<string, unknown>): unknown;
+    onRowsChange(data: any[]): void;
+    loadData(data: ViewData, reset?: boolean): unknown;
+    /**
+     * 加载`rootData` 数据
+     */
+    loadRootData(content: any): void;
+    setRootDataByKey(key: string, value: any): void;
+    submit(): unknown;
+    getData(): ViewData;
+    setData(content: ViewData): void;
+    validator(): Promise<any[]>;
+    /**
+     * 加载元数据，允许被重写
+     *
+     * @param  {IModel} model 模型
+     * @param  {IDslNode} dslNode? dslNode，如果不传入，会自动创建
+     * @param  {IView} view? 视图，如果不传入，会自动创建
+     * @param  {ViewType} viewType? 指定视图类型
+     */
+    loadMetadata(model: IModel, dslNode?: IDslNode, view?: IView, viewType?: ViewType): void;
+    getActiveRecords(): Entity[];
+    setDomain(domain: string): void;
+    getDomain(): string;
+    setFilter(f: string): void;
+    getFilter(): string;
+    getModel(): IModel;
+    getView(): IView;
+    path: string;
+    getPath(): string;
+    notify(type: LifeCycleTypes): void;
+    $$beforeCreated(): void;
+    $$created(): void;
+    $$beforeMount(): void;
+    $$mounted(): void;
+    $$beforeUpdate(): void;
+    $$updated(): void;
+    $$beforeUnmount(): void;
+    $$unmounted(): void;
+}
+/**
+ * @deprecated 移动端未修改，必须移除该定义
+ */
+export declare const ViewSubSymbol: unique symbol;
+export {};

package/package.json

@@ -1,35 +1,46 @@
 {
   "name": "@oinone/kunlun-vue-widget",
-  "version": "6.4.9",
-  "main": "index.ts",
+  "version": "7.2.0",
+  "type": "module",
+  "main": "dist/oinone-kunlun-vue-widget.esm.js",
   "scripts": {
     "prebuild": "rimraf dist",
     "build": "rollup -c",
     "dist": "npm run prepublishOnly",
     "index": "npm run postpublish",
-    "x-prepublishOnly": "node ../../scripts/prepublish-only.js",
-    "x-postpublish": "node ../../scripts/postpublish.js"
+    "format": "prettier --write --experimental-cli src/",
+    "test": "jest",
+    "prepublishOnly": "node ../../../../scripts/prepublish-only.cjs",
+    "deploy": "npm publish --exact",
+    "postpublish": "node ../../../../scripts/postpublish.cjs"
   },
   "dependencies": {
-    "@oinone/kunlun-vue-ui-common": "6.4.9"
+    "@oinone/kunlun-vue-ui-common": "7.2.0"
   },
   "devDependencies": {
-    "@oinone/kunlun-config": "~6.4.0",
-    "@oinone/kunlun-dsl": "~6.4.0",
-    "@oinone/kunlun-engine": "~6.4.0",
-    "@oinone/kunlun-event": "~6.4.0",
-    "@oinone/kunlun-meta": "~6.4.0",
-    "@oinone/kunlun-router": "~6.4.0",
-    "@oinone/kunlun-shared": "~6.4.0",
-    "@oinone/kunlun-spi": "~6.4.0",
-    "@oinone/kunlun-state": "~6.4.0",
-    "@types/lodash": "4.14.182",
+    "@oinone/kunlun-config": "~7.2.0",
+    "@oinone/kunlun-dsl": "~7.2.0",
+    "@oinone/kunlun-engine": "~7.2.0",
+    "@oinone/kunlun-event": "~7.2.0",
+    "@oinone/kunlun-meta": "~7.2.0",
+    "@oinone/kunlun-router": "~7.2.0",
+    "@oinone/kunlun-shared": "~7.2.0",
+    "@oinone/kunlun-spi": "~7.2.0",
+    "@oinone/kunlun-state": "~7.2.0",
+    "@types/lodash": "4.17.21",
     "@types/lodash-es": "4.17.6",
     "lodash": "4.17.21",
     "lodash-es": "4.17.21"
   },
   "peerDependencies": {
-    "vue": ">=3.2.40"
+    "vue": ">=3.5.26"
   },
-  "gitHead": "2b4c0c7911626c105ca71c2d41e54af470e2e079"
-}
+  "gitHead": "2b4c0c7911626c105ca71c2d41e54af470e2e079",
+  "module": "dist/oinone-kunlun-vue-widget.esm.js",
+  "typings": "dist/types/index.d.ts",
+  "files": [
+    "dist",
+    "index.ts",
+    "src"
+  ]
+}

package/src/basic/AsyncVueWidget.ts

@@ -1,5 +1,5 @@
-import { h, Suspense, VNode, SetupContext } from 'vue';
-import { SetupHook, VueWidget } from './VueWidget';
+import { h, Suspense, type VNode, type SetupContext } from 'vue';
+import { type SetupHook, VueWidget } from './VueWidget';
 
 export class AsyncVueWidget extends VueWidget {
   public setup(setupHook?: SetupHook) {

package/src/basic/VueWidget.ts

@@ -1,25 +1,27 @@
-import { genStaticPath, translateValueByKey, WidgetConstructor, WidgetProps } from '@oinone/kunlun-engine';
+import { genStaticPath, translateValueByKey, type WidgetConstructor, type WidgetProps } from '@oinone/kunlun-engine';
 import { uniqueKeyGenerator } from '@oinone/kunlun-shared';
-import { ComponentPublicInstance } from '@vue/runtime-core';
 import {
-  Component,
-  ComponentOptions,
+  type Component,
+  type ComponentOptions,
+  type ComponentPublicInstance,
   computed,
   createVNode,
   defineComponent,
-  DefineComponent,
-  EffectScope,
+  type DefineComponent,
+  type EffectScope,
   effectScope,
   isRef,
   nextTick,
   ref,
-  Ref,
-  Slot,
-  Slots,
+  type Ref,
+  type Slot,
+  type Slots,
   toRaw,
-  VNode,
-  watch
+  type VNode,
+  watch,
+  withCtx
 } from 'vue';
+import { useInjectMetaContext, useProviderMetaContext } from '../state';
 import VueFragment from './VueFragment.vue';
 import { Widget } from './Widget';
 
@@ -70,7 +72,7 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
   /**
    * vue实例内属性（props、computed、data）的集合
    */
-  private res?: {};
+  private res?: object;
 
   public revolveNodeCode() {
     return uniqueKeyGenerator();
@@ -100,14 +102,14 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
           if (compute) {
             if (compute.get) {
               if (!compute.set) {
-                Reflect.set(result, displayName, computed(compute.get!.bind(opt)));
+                Reflect.set(result, displayName, computed(compute.get.bind(opt)));
               } else {
                 Reflect.set(
                   result,
                   displayName,
                   computed({
-                    get: compute.get!.bind(opt),
-                    set: compute.set!.bind(opt)
+                    get: compute.get.bind(opt),
+                    set: compute.set.bind(opt)
                   })
                 );
               }
@@ -290,7 +292,7 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
     ) => {
       const afterHosts = VueWidget.afterHooks.get(target.constructor.name) || new Map();
       const afterHooks = afterHosts.get(host) || [];
-      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+
       afterHooks.push(description.value!);
       afterHosts.set(host, afterHooks);
       VueWidget.afterHooks.set(target.constructor.name, afterHosts);
@@ -464,7 +466,7 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
 
     const hosts = VueWidget.getHookHosts(this);
     hosts.forEach((hookName) => {
-      const host = Reflect.get(this, hookName);
+      const host = Reflect.get(this, hookName) as Function;
       Reflect.set(this, hookName, (...args: unknown[]) => {
         if (hookName === 'render') {
           return host.apply(operator, args);
@@ -587,6 +589,7 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
         this.behaviorGroup[BehaviorName.mounted]?.();
         this.$$mounted.call(opt);
         this.mounted.call(opt);
+        this.$$mountedAfterProperties.call(opt);
       },
       beforeUpdate: () => {
         this.behaviorGroup[BehaviorName.beforeUpdate]?.();
@@ -624,7 +627,10 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
         const { $slots } = ctx;
         const componentProps = this.resolveProps(component, props);
 
-        const children = $slots && Object.keys($slots).length ? $slots : this.resolveChildren();
+        const children = {
+          ...this.resolveChildren(),
+          ...$slots
+        };
 
         const expandCom = this.renderExpandComponent() as VNode;
         const expandSlot = {} as Record<string, any>;
@@ -721,20 +727,33 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
    * @protected
    */
   protected resolveChildren(): Record<string, Slot> {
-    const result = {};
-    const slots: string[] = [];
-    const children = this.getChildren();
-    children.forEach((c) => {
-      if (!slots.includes(c.getName())) {
-        slots.push(c.getName());
+    const slotWidgets: Record<string, Widget[]> = {};
+    const children: Widget[] = this.getChildren();
+    for (const child of children) {
+      const slotName = child.getName();
+      let widgets: Widget[] | undefined = slotWidgets[slotName];
+      if (!widgets) {
+        widgets = [];
+        slotWidgets[slotName] = widgets;
       }
-    });
-    slots.forEach((s) => {
-      Reflect.set(result, s, (...args: unknown[]) =>
-        children.filter((c) => c.getName() === s).map((c) => c.render(...args))
-      );
-    });
-    return result;
+      widgets.push(child);
+    }
+    const slots: Record<string, Slot> = {};
+    for (const [slotName, widgets] of Object.entries(slotWidgets)) {
+      slots[slotName] = withCtx((context: Record<string, unknown>) => {
+        const vNodes: VNode[] = [];
+        for (const widget of widgets) {
+          const result = widget.render(context) as VNode | VNode[];
+          if (Array.isArray(result)) {
+            vNodes.push(...result);
+          } else {
+            vNodes.push(result);
+          }
+        }
+        return vNodes;
+      }) as Slot;
+    }
+    return slots;
   }
 
   /**
@@ -749,6 +768,7 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
     this.$$beforeCreated();
     this.beforeCreated();
     this.behaviorGroup[BehaviorName.created]?.();
+    this.$$metaContextProvide();
     this.$$created();
     this.created();
     return {};
@@ -857,6 +877,17 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
    */
   protected created() {}
 
+  /**
+   * @internal
+   */
+  protected $$metaContextProvide() {
+    const metaContext = useInjectMetaContext();
+    useProviderMetaContext({
+      ...metaContext,
+      parentHandle: computed(() => this.getHandle())
+    });
+  }
+
   /**
    * @internal
    */
@@ -884,6 +915,11 @@ export class VueWidget<Props extends WidgetProps = WidgetProps> extends Widget<P
    */
   protected $$mounted() {}
 
+  /**
+   * @internal
+   */
+  protected $$mountedAfterProperties() {}
+
   /**
    * Vue钩子
    * @protected