feat: fix designer:entry ts errors

docs/docs/specs/material-spec.md

@@ -833,11 +833,11 @@ props 数组下对象字段描述：
 | name       | 属性名                                                                                 | String            | type = 'field' 生效 |
 | defaultValue | 默认值 | Any(视字段类型而定) | type = 'field' 生效 |
 | supportVariable | 是否支持配置变量 | Boolean | type = 'field' 生效 |
-| condition | 配置当前 prop 是否展示 | (target: SettingTarget) => boolean; | - |
+| condition | 配置当前 prop 是否展示 | (target: IPublicModelSettingField) => boolean; | - |
 | setter     | 单个控件 (setter) 描述，搭建基础协议组件的描述对象，支持 JSExpression / JSFunction / JSSlot | `String\|Object\|Function` | type = 'field' 生效 |
 | extraProps | 其他配置属性（不做流通要求）                                                           | Object            | 其他配置            |
-| extraProps.getValue | setter 渲染时被调用，setter 会根据该函数的返回值设置 setter 当前值 | Function            | (target: SettingTarget, value: any) => any;            |
-| extraProps.setValue | setter 内容修改时调用，开发者可在该函数内部修改节点 schema 或者进行其他操作 | Function            | (target: SettingTarget, value: any) => void;            |
+| extraProps.getValue | setter 渲染时被调用，setter 会根据该函数的返回值设置 setter 当前值 | Function            | (target: IPublicModelSettingField, value: any) => any;            |
+| extraProps.setValue | setter 内容修改时调用，开发者可在该函数内部修改节点 schema 或者进行其他操作 | Function            | (target: IPublicModelSettingField, value: any) => void;            |
 
 
 根据属性值类型 propType，确定对应控件类型 (setter) 。
@@ -922,7 +922,7 @@ props 数组下对象字段描述：
 
 | 字段 | 用途 | 类型 | 备注 |
 | ------------------------------- | --------------------------------------------------------------------------------------------------- | ------- | --- |
-|initialChildren	| 组件拖入“设计器”时根据此配置自动生成 children 节点 schema |NodeData[]/Function	NodeData[] | ((target: SettingTarget) => NodeData[]);|
+|initialChildren	| 组件拖入“设计器”时根据此配置自动生成 children 节点 schema |NodeData[]/Function	NodeData[] | ((target: IPublicModelSettingField) => NodeData[]);|
 |getResizingHandlers|	用于配置设计器中组件 resize 操作工具的样式和内容 |	Function|	(currentNode: any) => Array<{ type: 'N' | 'W' | 'S' | 'E' | 'NW' | 'NE' | 'SE' | 'SW'; content?: ReactElement; propTarget?: string; appearOn?: 'mouse-enter' | 'mouse-hover' | 'selected' | 'always'; }> / ReactElement[];
 |callbacks|	配置 callbacks 可捕获引擎抛出的一些事件，例如 onNodeAdd、onResize 等 |	Callback|	-
 |callbacks.onNodeAdd|	在容器中拖入组件时触发的事件回调 |	Function|	(e: MouseEvent, currentNode: any) => any
@@ -1098,7 +1098,7 @@ export interface Advanced {
   /**
    * 拖入容器时，自动带入 children 列表
    */
-  initialChildren?: NodeData[] | ((target: SettingTarget) => NodeData[]);
+  initialChildren?: NodeData[] | ((target: IPublicModelSettingField) => NodeData[]);
   /**
    * @todo 待补充文档
    */

packages/designer/src/component-meta.ts

@@ -8,10 +8,11 @@ import {
   IPublicTypeTransformedComponentMetadata,
   IPublicTypeNestingFilter,
   IPublicTypeI18nData,
-  IPublicTypePluginConfig,
   IPublicTypeFieldConfig,
   IPublicModelComponentMeta,
   IPublicTypeAdvanced,
+  IPublicTypeDisposable,
+  IPublicTypeLiveTextEditingConfig,
 } from '@alilc/lowcode-types';
 import { deprecate, isRegExp, isTitleConfig, isNode } from '@alilc/lowcode-utils';
 import { computed, createModuleEventBus, IEventBus } from '@alilc/lowcode-editor-core';
@@ -59,9 +60,11 @@ export function buildFilter(rule?: string | string[] | RegExp | IPublicTypeNesti
 export interface IComponentMeta extends IPublicModelComponentMeta<INode> {
   prototype?: any;
 
+  get rootSelector(): string | undefined;
+
   setMetadata(metadata: IPublicTypeComponentMetadata): void;
 
-  get rootSelector(): string | undefined;
+  onMetadataChange(fn: (args: any) => void): IPublicTypeDisposable;
 }
 
 export class ComponentMeta implements IComponentMeta {
@@ -120,7 +123,7 @@ export class ComponentMeta implements IComponentMeta {
     return config?.combined || config?.props || [];
   }
 
-  private _liveTextEditing?: IPublicTypePluginConfig[];
+  private _liveTextEditing?: IPublicTypeLiveTextEditingConfig[];
 
   get liveTextEditing() {
     return this._liveTextEditing;
@@ -357,7 +360,7 @@ export class ComponentMeta implements IComponentMeta {
     return true;
   }
 
-  onMetadataChange(fn: (args: any) => void): () => void {
+  onMetadataChange(fn: (args: any) => void): IPublicTypeDisposable {
     this.emitter.on('metadata_change', fn);
     return () => {
       this.emitter.removeListener('metadata_change', fn);

packages/designer/src/designer/designer.ts

@@ -140,7 +140,7 @@ export class Designer implements IDesigner {
 
   @obx.ref private _simulatorComponent?: ComponentType<any>;
 
-  @obx.ref private _simulatorProps?: object | ((project: Project) => object);
+  @obx.ref private _simulatorProps?: Record<string, any> | ((project: Project) => object);
 
   @obx.ref private _suspensed = false;
 

packages/designer/src/designer/setting/index.ts

@@ -1,3 +1,4 @@
 export * from './setting-field';
 export * from './setting-top-entry';
-export * from './setting-entry';
+export * from './setting-entry-type';
+export * from './setting-prop-entry';

packages/designer/src/designer/setting/setting-entry-type.ts

@@ -0,0 +1,45 @@
+import { IPublicApiSetters, IPublicModelEditor } from '@alilc/lowcode-types';
+import { IDesigner } from '../designer';
+import { INode } from '../../document';
+import { ISettingField } from './setting-field';
+
+export interface ISettingEntry {
+  readonly designer: IDesigner | undefined;
+
+  readonly id: string;
+
+  /**
+   * 同样类型的节点
+   */
+  readonly isSameComponent: boolean;
+
+  /**
+   * 一个
+   */
+  readonly isSingle: boolean;
+
+  /**
+   * 多个
+   */
+  readonly isMultiple: boolean;
+
+  /**
+   * 编辑器引用
+   */
+  readonly editor: IPublicModelEditor;
+
+  readonly setters: IPublicApiSetters;
+
+  /**
+   * 取得子项
+   */
+  get: (propName: string | number) => ISettingField | null;
+
+  readonly nodes: INode[];
+
+  // @todo 补充 node 定义
+  /**
+   * 获取 node 中的第一项
+   */
+  getNode: () => any;
+}

packages/designer/src/designer/setting/setting-field.ts

@@ -7,14 +7,18 @@ import {
   IPublicTypeFieldConfig,
   IPublicTypeCustomView,
   IPublicTypeSetValueOptions,
+  IPublicTypeDisposable,
+  IPublicModelSettingField,
+  IBaseModelSettingField,
 } from '@alilc/lowcode-types';
 import { Transducer } from './utils';
-import { SettingPropEntry } from './setting-prop-entry';
-import { ISettingEntry } from './setting-entry';
+import { ISettingPropEntry, SettingPropEntry } from './setting-prop-entry';
 import { computed, obx, makeObservable, action, untracked, intl } from '@alilc/lowcode-editor-core';
 import { cloneDeep, isCustomView, isDynamicSetter } from '@alilc/lowcode-utils';
+import { ISettingTopEntry } from './setting-top-entry';
+import { IComponentMeta, INode } from '@alilc/lowcode-designer';
 
-function getSettingFieldCollectorKey(parent: ISettingEntry, config: IPublicTypeFieldConfig) {
+function getSettingFieldCollectorKey(parent: ISettingTopEntry | ISettingField, config: IPublicTypeFieldConfig) {
   let cur = parent;
   const path = [config.name];
   while (cur !== parent.top) {
@@ -26,11 +30,18 @@ function getSettingFieldCollectorKey(parent: ISettingEntry, config: IPublicTypeF
   return path.join('.');
 }
 
-export interface ISettingField extends Omit<ISettingEntry, 'setValue'> {
+export interface ISettingField extends ISettingPropEntry, Omit<IBaseModelSettingField<
+ISettingTopEntry,
+ISettingField,
+IComponentMeta,
+INode
+>, 'setValue' | 'key' | 'node'> {
   get items(): Array<ISettingField | IPublicTypeCustomView>;
 
   get title(): string | ReactNode | undefined;
 
+  readonly isSettingField: true;
+
   purge(): void;
 
   extraProps: IPublicTypeFieldExtraProps;
@@ -41,6 +52,10 @@ export interface ISettingField extends Omit<ISettingEntry, 'setValue'> {
 
   readonly isRequired: boolean;
 
+  readonly isGroup: boolean;
+
+  get valueState(): number;
+
   setExpanded(value: boolean): void;
 
   setValue(
@@ -49,6 +64,16 @@ export interface ISettingField extends Omit<ISettingEntry, 'setValue'> {
     force?: boolean,
     extraOptions?: IPublicTypeSetValueOptions,
   ): void;
+
+  clearValue(): void;
+
+  valueChange(options: IPublicTypeSetValueOptions): void;
+
+  createField(config: IPublicTypeFieldConfig): ISettingField;
+
+  onEffect(action: () => void): IPublicTypeDisposable;
+
+  internalToShell(): IPublicModelSettingField;
 }
 
 export class SettingField extends SettingPropEntry implements ISettingField {
@@ -62,7 +87,7 @@ export class SettingField extends SettingPropEntry implements ISettingField {
 
   private hotValue: any;
 
-  parent: ISettingEntry;
+  parent: ISettingTopEntry | ISettingField;
 
   extraProps: IPublicTypeFieldExtraProps;
 
@@ -82,7 +107,7 @@ export class SettingField extends SettingPropEntry implements ISettingField {
   private _items: Array<ISettingField | IPublicTypeCustomView> = [];
 
   constructor(
-    parent: ISettingEntry,
+    parent: ISettingTopEntry | ISettingField,
     config: IPublicTypeFieldConfig,
     private settingFieldCollector?: (name: string | number, field: ISettingField) => void,
   ) {
@@ -118,8 +143,8 @@ export class SettingField extends SettingPropEntry implements ISettingField {
     }
     if (isDynamicSetter(this._setter)) {
       return untracked(() => {
-        const shellThis = this.internalToShellPropEntry();
-        return (this._setter as IPublicTypeDynamicSetter)?.call(shellThis, shellThis);
+        const shellThis = this.internalToShell();
+        return (this._setter as IPublicTypeDynamicSetter)?.call(shellThis, shellThis!);
       });
     }
     return this._setter;
@@ -266,8 +291,13 @@ export class SettingField extends SettingPropEntry implements ISettingField {
     this.valueChange(options);
   }
 
-  onEffect(action: () => void): () => void {
-    return this.designer.autorun(action, true);
+  onEffect(action: () => void): IPublicTypeDisposable {
+    return this.designer!.autorun(action, true);
+  }
+
+
+  internalToShell() {
+    return this.designer!.shellModelFactory.createSettingField(this);
   }
 }
 

packages/designer/src/designer/setting/setting-prop-entry.ts

@@ -1,13 +1,44 @@
 import { obx, computed, makeObservable, runInAction, IEventBus, createModuleEventBus } from '@alilc/lowcode-editor-core';
-import { GlobalEvent, IPublicApiSetters, IPublicModelEditor, IPublicTypeSetValueOptions } from '@alilc/lowcode-types';
-import { uniqueId, isJSExpression, isSettingField } from '@alilc/lowcode-utils';
-import { ISettingEntry } from './setting-entry';
+import { GlobalEvent, IPublicApiSetters, IPublicModelEditor, IPublicModelSettingField, IPublicTypeFieldExtraProps, IPublicTypeSetValueOptions } from '@alilc/lowcode-types';
+import { uniqueId, isJSExpression } from '@alilc/lowcode-utils';
+import { ISettingEntry } from './setting-entry-type';
 import { INode } from '../../document';
 import { IComponentMeta } from '../../component-meta';
 import { IDesigner } from '../designer';
-import { ISettingField } from './setting-field';
+import { ISettingTopEntry } from './setting-top-entry';
+import { ISettingField, isSettingField } from './setting-field';
 
-export class SettingPropEntry implements ISettingEntry {
+export interface ISettingPropEntry extends ISettingEntry {
+  get props(): ISettingTopEntry;
+
+  readonly isGroup: boolean;
+
+  get name(): string | number | undefined;
+
+  valueChange(options: IPublicTypeSetValueOptions): void;
+
+  getKey(): string | number | undefined;
+
+  setKey(key: string | number): void;
+
+  getDefaultValue(): any;
+
+  setUseVariable(flag: boolean): void;
+
+  getProps(): ISettingTopEntry;
+
+  isUseVariable(): boolean;
+
+  getMockOrValue(): any;
+
+  remove(): void;
+
+  setValue(val: any, isHotValue?: boolean, force?: boolean, extraOptions?: IPublicTypeSetValueOptions): void;
+
+  internalToShell(): IPublicModelSettingField;
+}
+
+export class SettingPropEntry implements ISettingPropEntry {
   // === static properties ===
   readonly editor: IPublicModelEditor;
 
@@ -23,9 +54,9 @@ export class SettingPropEntry implements ISettingEntry {
 
   readonly componentMeta: IComponentMeta | null;
 
-  readonly designer: IDesigner;
+  readonly designer: IDesigner | undefined;
 
-  readonly top: ISettingEntry;
+  readonly top: ISettingTopEntry;
 
   readonly isGroup: boolean;
 
@@ -50,9 +81,9 @@ export class SettingPropEntry implements ISettingEntry {
     return path;
   }
 
-  extraProps: any = {};
+  extraProps: IPublicTypeFieldExtraProps = {};
 
-  constructor(readonly parent: ISettingEntry | ISettingField, name: string | number | undefined, type?: 'field' | 'group') {
+  constructor(readonly parent: ISettingTopEntry | ISettingField, name: string | number | undefined, type?: 'field' | 'group') {
     makeObservable(this);
     if (type == null) {
       const c = typeof name === 'string' ? name.slice(0, 1) : '';
@@ -126,7 +157,7 @@ export class SettingPropEntry implements ISettingEntry {
       if (this.type !== 'field') {
         const { getValue } = this.extraProps;
         return getValue
-          ? getValue(this.internalToShellPropEntry(), undefined) === undefined
+          ? getValue(this.internalToShell()!, undefined) === undefined
             ? 0
             : 1
           : 0;
@@ -165,7 +196,7 @@ export class SettingPropEntry implements ISettingEntry {
     }
     const { getValue } = this.extraProps;
     try {
-      return getValue ? getValue(this.internalToShellPropEntry(), val) : val;
+      return getValue ? getValue(this.internalToShell()!, val) : val;
     } catch (e) {
       console.warn(e);
       return val;
@@ -184,7 +215,7 @@ export class SettingPropEntry implements ISettingEntry {
     const { setValue } = this.extraProps;
     if (setValue && !extraOptions?.disableMutator) {
       try {
-        setValue(this.internalToShellPropEntry(), val);
+        setValue(this.internalToShell()!, val);
       } catch (e) {
         /* istanbul ignore next */
         console.warn(e);
@@ -207,7 +238,7 @@ export class SettingPropEntry implements ISettingEntry {
     const { setValue } = this.extraProps;
     if (setValue) {
       try {
-        setValue(this.internalToShellPropEntry(), undefined);
+        setValue(this.internalToShell()!, undefined);
       } catch (e) {
         /* istanbul ignore next */
         console.warn(e);
@@ -363,7 +394,7 @@ export class SettingPropEntry implements ISettingEntry {
     return v;
   }
 
-  internalToShellPropEntry() {
-    return this.designer.shellModelFactory.createSettingPropEntry(this);
+  internalToShell(): IPublicModelSettingField {
+    return this.designer!.shellModelFactory.createSettingField(this);;
   }
 }