From 55c3fc9e58d566edeabd1daa489ac83ba6b787d1 Mon Sep 17 00:00:00 2001 From: JackLian Date: Tue, 6 Dec 2022 10:09:25 +0800 Subject: [PATCH] feat: add types for shell, and move functions in types to utils --- docs/docs/api/project.md | 2 +- .../src/plugins/component/rax/jsx.ts | 2 +- .../bem-tools/border-container.tsx | 3 +- .../bem-tools/border-selecting.tsx | 6 +- .../designer/src/builtin-simulator/host.ts | 4 +- packages/designer/src/component-meta.ts | 26 +- packages/designer/src/designer/designer.ts | 19 +- packages/designer/src/designer/dragon.ts | 27 +- .../src/designer/setting/setting-field.ts | 5 +- .../designer/setting/setting-prop-entry.ts | 5 +- .../src/designer/setting/setting-top-entry.ts | 3 +- .../designer/src/designer/setting/utils.ts | 3 +- .../designer/src/document/document-model.ts | 6 +- .../src/document/node/node-children.ts | 10 +- packages/designer/src/document/node/node.ts | 6 +- .../designer/src/document/node/props/prop.ts | 4 +- packages/designer/src/plugin/plugin-types.ts | 3 +- packages/designer/src/project/project.ts | 3 +- packages/designer/src/types/index.ts | 22 +- .../tests/bugs/prop-variable-jse.test.ts | 4 +- .../tests/builtin-simulator/host.test.ts | 18 +- .../designer/tests/designer/designer.test.ts | 3 +- .../designer/tests/designer/dragon.test.ts | 2 +- .../designer/tests/designer/scroller.test.ts | 22 -- packages/editor-core/src/di/setter.ts | 21 +- packages/editor-core/src/hotkey.ts | 3 +- packages/editor-core/src/intl/index.ts | 2 +- .../editor-core/src/widgets/title/index.tsx | 4 +- .../src/components/settings/settings-pane.tsx | 5 +- .../src/components/stage-box/stage.tsx | 2 +- packages/editor-skeleton/src/skeleton.ts | 9 +- .../src/transducers/parse-func.ts | 8 +- packages/editor-skeleton/src/types.ts | 37 +- packages/editor-skeleton/src/widget/utils.ts | 3 +- packages/engine/src/engine-core.ts | 1 - packages/engine/src/modules/designer-types.ts | 5 +- packages/engine/src/modules/editor-types.ts | 3 - packages/engine/src/modules/live-editing.ts | 5 +- packages/plugin-outline-pane/src/tree-node.ts | 3 +- .../plugin-outline-pane/src/views/tree.tsx | 3 +- .../rax-simulator-renderer/src/renderer.ts | 4 +- packages/renderer-core/src/renderer/base.tsx | 5 +- packages/renderer-core/src/utils/common.ts | 3 +- .../renderer-core/src/utils/data-helper.ts | 2 +- .../renderer-core/src/utils/is-use-loop.ts | 3 +- packages/shell/src/canvas.ts | 9 +- packages/shell/src/common.tsx | 16 +- packages/shell/src/component-meta.ts | 38 ++- packages/shell/src/detecting.ts | 3 +- packages/shell/src/document-model.ts | 131 ++++---- packages/shell/src/drag-object.ts | 20 +- packages/shell/src/dragon.ts | 27 +- packages/shell/src/drop-location.ts | 9 +- packages/shell/src/event.ts | 5 +- packages/shell/src/history.ts | 21 +- packages/shell/src/hotkey.ts | 6 +- packages/shell/src/locate-event.ts | 25 +- packages/shell/src/material.ts | 20 +- packages/shell/src/modal-nodes-manager.ts | 24 +- packages/shell/src/node-children.ts | 64 ++-- packages/shell/src/node.ts | 164 +++++---- packages/shell/src/project.ts | 41 ++- packages/shell/src/prop.ts | 30 +- packages/shell/src/props.ts | 32 +- packages/shell/src/selection.ts | 28 +- packages/shell/src/setters.ts | 12 +- packages/shell/src/setting-prop-entry.ts | 84 +++-- packages/shell/src/setting-top-entry.ts | 13 +- packages/shell/src/simulator-host.ts | 21 +- packages/shell/src/skeleton.ts | 13 +- packages/types/src/deprecated/index.ts | 18 + .../src/deprecated/isActionContentObject.ts | 8 + packages/types/src/deprecated/isCustomView.ts | 10 + packages/types/src/deprecated/isDOMText.ts | 8 + .../types/src/deprecated/isDynamicSetter.ts | 9 + packages/types/src/deprecated/isI18nData.ts | 8 + packages/types/src/deprecated/isJSBlock.ts | 8 + .../types/src/deprecated/isJSExpression.ts | 8 + packages/types/src/deprecated/isJSFunction.ts | 8 + packages/types/src/deprecated/isJSSlot.ts | 8 + .../src/deprecated/isLowCodeComponentType.ts | 9 + packages/types/src/deprecated/isNodeSchema.ts | 8 + .../types/src/deprecated/isPlainObject.ts | 10 + .../src/deprecated/isProCodeComponentType.ts | 8 + .../types/src/deprecated/isProjectSchema.ts | 8 + packages/types/src/deprecated/isReactClass.ts | 8 + .../types/src/deprecated/isReactComponent.ts | 9 + .../types/src/deprecated/isSetterConfig.ts | 9 + .../types/src/deprecated/isTitleConfig.ts | 10 + packages/types/src/designer.ts | 23 ++ packages/types/src/dragon.ts | 29 ++ packages/types/src/editor-skeleton.ts | 27 ++ packages/types/src/editor.ts | 21 ++ packages/types/src/i18n.ts | 5 - packages/types/src/index.ts | 7 + packages/types/src/metadata.ts | 18 +- packages/types/src/npm.ts | 10 +- packages/types/src/props-transducer.ts | 12 + packages/types/src/schema.ts | 15 +- packages/types/src/setter-config.ts | 27 +- packages/types/src/shell/api/common.ts | 50 +++ packages/types/src/shell/api/event.ts | 26 ++ packages/types/src/shell/api/hotkey.ts | 16 + packages/types/src/shell/api/index.ts | 8 + packages/types/src/shell/api/material.ts | 90 +++++ packages/types/src/shell/api/project.ts | 115 +++++++ packages/types/src/shell/api/setters.ts | 31 ++ .../types/src/shell/api/simulator-host.ts | 41 +++ packages/types/src/shell/api/skeleton.ts | 95 ++++++ packages/types/src/shell/index.ts | 13 + packages/types/src/shell/model/canvas.ts | 4 + .../types/src/shell/model/component-meta.ts | 85 +++++ packages/types/src/shell/model/detecting.ts | 23 ++ .../types/src/shell/model/document-model.ts | 155 +++++++++ packages/types/src/shell/model/drag-object.ts | 8 + packages/types/src/shell/model/dragon.ts | 39 +++ .../types/src/shell/model/drop-location.ts | 3 + packages/types/src/shell/model/history.ts | 49 +++ packages/types/src/shell/model/index.ts | 17 + .../types/src/shell/model/locate-event.ts | 20 ++ .../src/shell/model/modal-nodes-manager.ts | 37 ++ .../types/src/shell/model/node-children.ts | 128 +++++++ packages/types/src/shell/model/node.ts | 316 ++++++++++++++++++ packages/types/src/shell/model/prop.ts | 59 ++++ packages/types/src/shell/model/props.ts | 82 +++++ packages/types/src/shell/model/selection.ts | 65 ++++ .../src/shell/model/setting-prop-entry.ts | 188 +++++++++++ .../src/shell/model/setting-top-entry.ts | 30 ++ packages/types/src/title.ts | 16 +- packages/types/src/value-type.ts | 28 +- packages/utils/src/check-types/index.ts | 16 + .../check-types/is-action-content-object.ts | 6 + .../utils/src/check-types/is-custom-view.ts | 8 + packages/utils/src/check-types/is-dom-text.ts | 5 + .../src/check-types/is-dynamic-setter.ts | 7 + .../utils/src/check-types/is-i18n-data.ts | 7 + .../utils/src/check-types/is-isfunction.ts | 5 + packages/utils/src/check-types/is-jsblock.ts | 5 + .../utils/src/check-types/is-jsexpression.ts | 15 + packages/utils/src/check-types/is-jsslot.ts | 5 + .../check-types/is-lowcode-component-type.ts | 7 + .../utils/src/check-types/is-node-schema.ts | 5 + .../check-types/is-procode-component-type.ts | 6 + .../src/check-types/is-project-schema.ts | 5 + .../utils/src/check-types/is-setter-config.ts | 7 + .../utils/src/check-types/is-title-config.ts | 8 + packages/utils/src/index.ts | 1 + packages/utils/src/schema.ts | 3 +- 148 files changed, 2808 insertions(+), 711 deletions(-) delete mode 100644 packages/engine/src/modules/editor-types.ts create mode 100644 packages/types/src/deprecated/index.ts create mode 100644 packages/types/src/deprecated/isActionContentObject.ts create mode 100644 packages/types/src/deprecated/isCustomView.ts create mode 100644 packages/types/src/deprecated/isDOMText.ts create mode 100644 packages/types/src/deprecated/isDynamicSetter.ts create mode 100644 packages/types/src/deprecated/isI18nData.ts create mode 100644 packages/types/src/deprecated/isJSBlock.ts create mode 100644 packages/types/src/deprecated/isJSExpression.ts create mode 100644 packages/types/src/deprecated/isJSFunction.ts create mode 100644 packages/types/src/deprecated/isJSSlot.ts create mode 100644 packages/types/src/deprecated/isLowCodeComponentType.ts create mode 100644 packages/types/src/deprecated/isNodeSchema.ts create mode 100644 packages/types/src/deprecated/isPlainObject.ts create mode 100644 packages/types/src/deprecated/isProCodeComponentType.ts create mode 100644 packages/types/src/deprecated/isProjectSchema.ts create mode 100644 packages/types/src/deprecated/isReactClass.ts create mode 100644 packages/types/src/deprecated/isReactComponent.ts create mode 100644 packages/types/src/deprecated/isSetterConfig.ts create mode 100644 packages/types/src/deprecated/isTitleConfig.ts create mode 100644 packages/types/src/designer.ts create mode 100644 packages/types/src/dragon.ts create mode 100644 packages/types/src/editor-skeleton.ts create mode 100644 packages/types/src/props-transducer.ts create mode 100644 packages/types/src/shell/api/common.ts create mode 100644 packages/types/src/shell/api/event.ts create mode 100644 packages/types/src/shell/api/hotkey.ts create mode 100644 packages/types/src/shell/api/index.ts create mode 100644 packages/types/src/shell/api/material.ts create mode 100644 packages/types/src/shell/api/project.ts create mode 100644 packages/types/src/shell/api/setters.ts create mode 100644 packages/types/src/shell/api/simulator-host.ts create mode 100644 packages/types/src/shell/api/skeleton.ts create mode 100644 packages/types/src/shell/index.ts create mode 100644 packages/types/src/shell/model/canvas.ts create mode 100644 packages/types/src/shell/model/component-meta.ts create mode 100644 packages/types/src/shell/model/detecting.ts create mode 100644 packages/types/src/shell/model/document-model.ts create mode 100644 packages/types/src/shell/model/drag-object.ts create mode 100644 packages/types/src/shell/model/dragon.ts create mode 100644 packages/types/src/shell/model/drop-location.ts create mode 100644 packages/types/src/shell/model/history.ts create mode 100644 packages/types/src/shell/model/index.ts create mode 100644 packages/types/src/shell/model/locate-event.ts create mode 100644 packages/types/src/shell/model/modal-nodes-manager.ts create mode 100644 packages/types/src/shell/model/node-children.ts create mode 100644 packages/types/src/shell/model/node.ts create mode 100644 packages/types/src/shell/model/prop.ts create mode 100644 packages/types/src/shell/model/props.ts create mode 100644 packages/types/src/shell/model/selection.ts create mode 100644 packages/types/src/shell/model/setting-prop-entry.ts create mode 100644 packages/types/src/shell/model/setting-top-entry.ts create mode 100644 packages/utils/src/check-types/index.ts create mode 100644 packages/utils/src/check-types/is-action-content-object.ts create mode 100644 packages/utils/src/check-types/is-custom-view.ts create mode 100644 packages/utils/src/check-types/is-dom-text.ts create mode 100644 packages/utils/src/check-types/is-dynamic-setter.ts create mode 100644 packages/utils/src/check-types/is-i18n-data.ts create mode 100644 packages/utils/src/check-types/is-isfunction.ts create mode 100644 packages/utils/src/check-types/is-jsblock.ts create mode 100644 packages/utils/src/check-types/is-jsexpression.ts create mode 100644 packages/utils/src/check-types/is-jsslot.ts create mode 100644 packages/utils/src/check-types/is-lowcode-component-type.ts create mode 100644 packages/utils/src/check-types/is-node-schema.ts create mode 100644 packages/utils/src/check-types/is-procode-component-type.ts create mode 100644 packages/utils/src/check-types/is-project-schema.ts create mode 100644 packages/utils/src/check-types/is-setter-config.ts create mode 100644 packages/utils/src/check-types/is-title-config.ts diff --git a/docs/docs/api/project.md b/docs/docs/api/project.md index 269184b53..b7dda45b2 100644 --- a/docs/docs/api/project.md +++ b/docs/docs/api/project.md @@ -248,7 +248,7 @@ onChangeNodeVisible(fn: (node: Node, visible: boolean) => void) ### onChangeNodeChildren -onChangeNodeChildren(fn: (info?: IOnChangeOptions) => void) +onChangeNodeChildren(fn: (info?: IPublicOnChangeOptions) => void) 当前 document 的节点 children 变更事件 diff --git a/modules/code-generator/src/plugins/component/rax/jsx.ts b/modules/code-generator/src/plugins/component/rax/jsx.ts index ebc72104f..e0c6dd01f 100644 --- a/modules/code-generator/src/plugins/component/rax/jsx.ts +++ b/modules/code-generator/src/plugins/component/rax/jsx.ts @@ -147,7 +147,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => function __$$eval(expr) { try { return expr(); - } catch (error) { + } catch (error) { ${evalErrorsHandler} } } diff --git a/packages/designer/src/builtin-simulator/bem-tools/border-container.tsx b/packages/designer/src/builtin-simulator/bem-tools/border-container.tsx index 63874b4ca..05a164c98 100644 --- a/packages/designer/src/builtin-simulator/bem-tools/border-container.tsx +++ b/packages/designer/src/builtin-simulator/bem-tools/border-container.tsx @@ -2,7 +2,8 @@ import * as React from 'react'; import { Component, Fragment, ReactElement, PureComponent } from 'react'; import classNames from 'classnames'; import { computed, observer, Title, globalLocale } from '@alilc/lowcode-editor-core'; -import { I18nData, isI18nData, TitleContent } from '@alilc/lowcode-types'; +import { I18nData, TitleContent } from '@alilc/lowcode-types'; +import { isI18nData } from '@alilc/lowcode-utils'; import { DropLocation } from '../../designer'; import { BuiltinSimulatorHost } from '../../builtin-simulator/host'; import { ParentalNode } from '../../document/node'; diff --git a/packages/designer/src/builtin-simulator/bem-tools/border-selecting.tsx b/packages/designer/src/builtin-simulator/bem-tools/border-selecting.tsx index b990e045a..e5c8ad98a 100644 --- a/packages/designer/src/builtin-simulator/bem-tools/border-selecting.tsx +++ b/packages/designer/src/builtin-simulator/bem-tools/border-selecting.tsx @@ -9,9 +9,9 @@ import { ComponentType, } from 'react'; import classNames from 'classnames'; -import { observer, computed, Tip, globalContext, makeObservable } from '@alilc/lowcode-editor-core'; -import { createIcon, isReactComponent } from '@alilc/lowcode-utils'; -import { ActionContentObject, isActionContentObject } from '@alilc/lowcode-types'; +import { observer, computed, Tip, globalContext } from '@alilc/lowcode-editor-core'; +import { createIcon, isReactComponent, isActionContentObject } from '@alilc/lowcode-utils'; +import { ActionContentObject } from '@alilc/lowcode-types'; import { BuiltinSimulatorHost } from '../host'; import { OffsetObserver } from '../../designer'; import { Node } from '../../document'; diff --git a/packages/designer/src/builtin-simulator/host.ts b/packages/designer/src/builtin-simulator/host.ts index 5129c9163..429755fb2 100644 --- a/packages/designer/src/builtin-simulator/host.ts +++ b/packages/designer/src/builtin-simulator/host.ts @@ -39,8 +39,6 @@ import { transactionManager, } from '@alilc/lowcode-utils'; import { - DragObjectType, - DragNodeObject, isShaken, LocateEvent, isDragAnyObject, @@ -62,6 +60,8 @@ import { ComponentSchema, Package, TransitionType, + DragObjectType, + DragNodeObject, } from '@alilc/lowcode-types'; import { BuiltinSimulatorRenderer } from './renderer'; import clipboard from '../designer/clipboard'; diff --git a/packages/designer/src/component-meta.ts b/packages/designer/src/component-meta.ts index 4e1a74c77..95b974890 100644 --- a/packages/designer/src/component-meta.ts +++ b/packages/designer/src/component-meta.ts @@ -8,12 +8,12 @@ import { TitleContent, TransformedComponentMetadata, NestingFilter, - isTitleConfig, I18nData, LiveTextEditingConfig, FieldConfig, + MetadataTransducer, } from '@alilc/lowcode-types'; -import { deprecate, isRegExp } from '@alilc/lowcode-utils'; +import { deprecate, isRegExp, isTitleConfig } from '@alilc/lowcode-utils'; import { computed, engineConfig } from '@alilc/lowcode-editor-core'; import EventEmitter from 'events'; import { componentDefaults, legacyIssues } from './transducers'; @@ -128,8 +128,8 @@ export class ComponentMeta { private _isTopFixed?: boolean; - get isTopFixed() { - return this._isTopFixed; + get isTopFixed(): boolean { + return !!(this._isTopFixed); } private parentWhitelist?: NestingFilter | null; @@ -279,7 +279,7 @@ export class ComponentMeta { return result as any; } - isRootComponent(includeBlock = true) { + isRootComponent(includeBlock = true): boolean { return ( this.componentName === 'Page' || this.componentName === 'Component' || @@ -326,7 +326,7 @@ export class ComponentMeta { return true; } - checkNestingDown(my: Node, target: Node | NodeSchema | NodeSchema[]) { + checkNestingDown(my: Node, target: Node | NodeSchema | NodeSchema[]): boolean { // 检查父子关系，直接约束型，在画布中拖拽直接掠过目标容器 if (this.childWhitelist) { const _target: any = !Array.isArray(target) ? [target] : target; @@ -375,19 +375,7 @@ function preprocessMetadata(metadata: ComponentMetadata): TransformedComponentMe }; } -export interface MetadataTransducer { - (prev: TransformedComponentMetadata): TransformedComponentMetadata; - /** - * 0 - 9 system - * 10 - 99 builtin-plugin - * 100 - app & plugin - */ - level?: number; - /** - * use to replace TODO - */ - id?: string; -} + const metadataTransducers: MetadataTransducer[] = []; export function registerMetadataTransducer( diff --git a/packages/designer/src/designer/designer.ts b/packages/designer/src/designer/designer.ts index 9663574db..dcb361fa2 100644 --- a/packages/designer/src/designer/designer.ts +++ b/packages/designer/src/designer/designer.ts @@ -8,10 +8,10 @@ import { IEditor, CompositeObject, PropsList, - isNodeSchema, NodeSchema, + PropsTransducer, } from '@alilc/lowcode-types'; -import { megreAssets, AssetsJson } from '@alilc/lowcode-utils'; +import { megreAssets, AssetsJson, isNodeSchema } from '@alilc/lowcode-utils'; import { Project } from '../project'; import { Node, DocumentModel, insertChildren, ParentalNode, TransformStage } from '../document'; import { ComponentMeta } from '../component-meta'; @@ -494,7 +494,7 @@ export class Designer { getComponentMeta( componentName: string, generateMetadata?: () => ComponentMetadata | null, - ): ComponentMeta { + ) { if (this._componentMetasMap.has(componentName)) { return this._componentMetasMap.get(componentName)!; } @@ -536,7 +536,7 @@ export class Designer { return maps; } - private propsReducers = new Map(); + private propsReducers = new Map(); transformProps(props: CompositeObject | PropsList, node: Node, stage: TransformStage) { if (Array.isArray(props)) { @@ -560,7 +560,7 @@ export class Designer { }, props); } - addPropsReducer(reducer: PropsReducer, stage: TransformStage) { + addPropsReducer(reducer: PropsTransducer, stage: TransformStage) { const reducers = this.propsReducers.get(stage); if (reducers) { reducers.push(reducer); @@ -576,11 +576,4 @@ export class Designer { purge() { // TODO: } -} - -export type PropsReducerContext = { stage: TransformStage }; -export type PropsReducer = ( - props: CompositeObject, - node: Node, - ctx?: PropsReducerContext, -) => CompositeObject; +} \ No newline at end of file diff --git a/packages/designer/src/designer/dragon.ts b/packages/designer/src/designer/dragon.ts index d45d05c3c..2e80b5dd4 100644 --- a/packages/designer/src/designer/dragon.ts +++ b/packages/designer/src/designer/dragon.ts @@ -1,6 +1,6 @@ import { EventEmitter } from 'events'; import { obx, makeObservable } from '@alilc/lowcode-editor-core'; -import { NodeSchema } from '@alilc/lowcode-types'; +import { DragNodeObject, DragAnyObject, DragObjectType, DragNodeDataObject, DragObject } from '@alilc/lowcode-types'; import { Node as ShellNode } from '@alilc/lowcode-shell'; import { setNativeSelection, cursor } from '@alilc/lowcode-utils'; import { DropLocation } from './location'; @@ -80,31 +80,6 @@ export interface ISensor { getNodeInstanceFromElement(e: Element | null): NodeInstance | null; } -export type DragObject = DragNodeObject | DragNodeDataObject | DragAnyObject; - -export enum DragObjectType { - // eslint-disable-next-line no-shadow - Node = 'node', - NodeData = 'nodedata', -} - -export interface DragNodeObject { - type: DragObjectType.Node; - nodes: (Node | ShellNode)[]; -} -export interface DragNodeDataObject { - type: DragObjectType.NodeData; - data: NodeSchema | NodeSchema[]; - thumbnail?: string; - description?: string; - [extra: string]: any; -} - -export interface DragAnyObject { - type: string; - [key: string]: any; -} - export function isDragNodeObject(obj: any): obj is DragNodeObject { return obj && obj.type === DragObjectType.Node; } diff --git a/packages/designer/src/designer/setting/setting-field.ts b/packages/designer/src/designer/setting/setting-field.ts index a38c1323d..9b766519c 100644 --- a/packages/designer/src/designer/setting/setting-field.ts +++ b/packages/designer/src/designer/setting/setting-field.ts @@ -1,10 +1,9 @@ -import { TitleContent, isDynamicSetter, SetterType, DynamicSetter, FieldExtraProps, FieldConfig, CustomView, isCustomView } from '@alilc/lowcode-types'; +import { TitleContent, SetterType, DynamicSetter, FieldExtraProps, FieldConfig, CustomView, ISetValueOptions } from '@alilc/lowcode-types'; import { Transducer } from './utils'; import { SettingPropEntry } from './setting-prop-entry'; import { SettingEntry } from './setting-entry'; import { computed, obx, makeObservable, action } from '@alilc/lowcode-editor-core'; -import { cloneDeep } from '@alilc/lowcode-utils'; -import type { ISetValueOptions } from '../../types'; +import { cloneDeep, isCustomView, isDynamicSetter } from '@alilc/lowcode-utils'; function getSettingFieldCollectorKey(parent: SettingEntry, config: FieldConfig) { let cur = parent; diff --git a/packages/designer/src/designer/setting/setting-prop-entry.ts b/packages/designer/src/designer/setting/setting-prop-entry.ts index cfd603ea4..6eb5680a1 100644 --- a/packages/designer/src/designer/setting/setting-prop-entry.ts +++ b/packages/designer/src/designer/setting/setting-prop-entry.ts @@ -1,13 +1,12 @@ import { obx, computed, makeObservable, runInAction } from '@alilc/lowcode-editor-core'; -import { GlobalEvent, IEditor, isJSExpression } from '@alilc/lowcode-types'; -import { uniqueId } from '@alilc/lowcode-utils'; +import { GlobalEvent, IEditor, ISetValueOptions } from '@alilc/lowcode-types'; +import { uniqueId, isJSExpression } from '@alilc/lowcode-utils'; import { SettingPropEntry as ShellSettingPropEntry } from '@alilc/lowcode-shell'; import { SettingEntry } from './setting-entry'; import { Node } from '../../document'; import { ComponentMeta } from '../../component-meta'; import { Designer } from '../designer'; import { EventEmitter } from 'events'; -import { ISetValueOptions } from '../../types'; import { isSettingField } from './setting-field'; export class SettingPropEntry implements SettingEntry { diff --git a/packages/designer/src/designer/setting/setting-top-entry.ts b/packages/designer/src/designer/setting/setting-top-entry.ts index e51f76209..144493524 100644 --- a/packages/designer/src/designer/setting/setting-top-entry.ts +++ b/packages/designer/src/designer/setting/setting-top-entry.ts @@ -1,5 +1,6 @@ import { EventEmitter } from 'events'; -import { CustomView, isCustomView, IEditor } from '@alilc/lowcode-types'; +import { CustomView, IEditor } from '@alilc/lowcode-types'; +import { isCustomView } from '@alilc/lowcode-utils'; import { computed } from '@alilc/lowcode-editor-core'; import { SettingEntry } from './setting-entry'; import { SettingField } from './setting-field'; diff --git a/packages/designer/src/designer/setting/utils.ts b/packages/designer/src/designer/setting/utils.ts index 0958b7a78..319c3af8d 100644 --- a/packages/designer/src/designer/setting/utils.ts +++ b/packages/designer/src/designer/setting/utils.ts @@ -1,6 +1,7 @@ // all this file for polyfill vision logic import { isValidElement } from 'react'; -import { isSetterConfig, isDynamicSetter, FieldConfig, SetterConfig } from '@alilc/lowcode-types'; +import { FieldConfig, SetterConfig } from '@alilc/lowcode-types'; +import { isSetterConfig, isDynamicSetter } from '@alilc/lowcode-utils'; import { getSetter } from '@alilc/lowcode-editor-core'; import { SettingField } from './setting-field'; diff --git a/packages/designer/src/document/document-model.ts b/packages/designer/src/document/document-model.ts index 08d67d238..a4ba37a68 100644 --- a/packages/designer/src/document/document-model.ts +++ b/packages/designer/src/document/document-model.ts @@ -1,15 +1,15 @@ import { makeObservable, obx, engineConfig, action, runWithGlobalEventOff, wrapWithEventSwitch } from '@alilc/lowcode-editor-core'; -import { NodeData, isJSExpression, isDOMText, NodeSchema, isNodeSchema, RootSchema, PageSchema, ComponentsMap } from '@alilc/lowcode-types'; +import { NodeData, NodeSchema, RootSchema, PageSchema, ComponentsMap, DragNodeObject, DragNodeDataObject } from '@alilc/lowcode-types'; import { EventEmitter } from 'events'; import { Project } from '../project'; import { ISimulatorHost } from '../simulator'; import { ComponentMeta } from '../component-meta'; -import { isDragNodeDataObject, DragNodeObject, DragNodeDataObject, DropLocation, Designer, isDragNodeObject } from '../designer'; +import { isDragNodeDataObject, DropLocation, Designer, isDragNodeObject } from '../designer'; import { Node, insertChildren, insertChild, isNode, RootNode, ParentalNode } from './node/node'; import { Selection } from './selection'; import { History } from './history'; import { TransformStage, ModalNodesManager } from './node'; -import { uniqueId, isPlainObject, compatStage } from '@alilc/lowcode-utils'; +import { uniqueId, isPlainObject, compatStage, isJSExpression, isDOMText, isNodeSchema } from '@alilc/lowcode-utils'; export type GetDataType = T extends undefined ? NodeType extends { diff --git a/packages/designer/src/document/node/node-children.ts b/packages/designer/src/document/node/node-children.ts index 728df7cb8..6c7d1c835 100644 --- a/packages/designer/src/document/node/node-children.ts +++ b/packages/designer/src/document/node/node-children.ts @@ -1,17 +1,15 @@ import { obx, computed, globalContext, makeObservable } from '@alilc/lowcode-editor-core'; import { Node, ParentalNode } from './node'; import { TransformStage } from './transform-stage'; -import { NodeData, isNodeSchema } from '@alilc/lowcode-types'; -import { shallowEqual, compatStage } from '@alilc/lowcode-utils'; +import { NodeData } from '@alilc/lowcode-types'; +import { shallowEqual, compatStage, isNodeSchema } from '@alilc/lowcode-utils'; import { EventEmitter } from 'events'; import { foreachReverse } from '../../utils/tree'; import { NodeRemoveOptions } from '../../types'; - export interface IOnChangeOptions { type: string; node: Node; } - export class NodeChildren { @obx.shallow private children: Node[]; @@ -350,7 +348,7 @@ export class NodeChildren { return this.children.find(fn); } - reduce(fn: (acc: any, cur: Node) => any, initialValue: any) { + reduce(fn: (acc: any, cur: Node) => any, initialValue: any): void { return this.children.reduce(fn, initialValue); } @@ -358,7 +356,7 @@ export class NodeChildren { remover: (node: Node, idx: number) => boolean, adder: (children: Node[]) => NodeData[] | null, sorter: (firstNode: Node, secondNode: Node) => number, - ) { + ): any { let changed = false; if (remover) { const willRemove = this.children.filter(remover); diff --git a/packages/designer/src/document/node/node.ts b/packages/designer/src/document/node/node.ts index 9fe98e473..a20173a96 100644 --- a/packages/designer/src/document/node/node.ts +++ b/packages/designer/src/document/node/node.ts @@ -2,8 +2,6 @@ import { ReactElement } from 'react'; import { EventEmitter } from 'events'; import { obx, computed, autorun, makeObservable, runInAction, wrapWithEventSwitch, action } from '@alilc/lowcode-editor-core'; import { - isDOMText, - isJSExpression, NodeSchema, PropsMap, PropsList, @@ -17,7 +15,7 @@ import { GlobalEvent, ComponentAction, } from '@alilc/lowcode-types'; -import { compatStage } from '@alilc/lowcode-utils'; +import { compatStage, isDOMText, isJSExpression } from '@alilc/lowcode-utils'; import { SettingTopEntry } from '@alilc/lowcode-designer'; import { Node as ShellNode } from '@alilc/lowcode-shell'; import { Props, getConvertedExtraKey } from './props/props'; @@ -94,7 +92,7 @@ export class Node { /** * 节点组件类型 - * 特殊节点: + * 特殊节点： * * Page 页面 * * Block 区块 * * Component 组件/元件 diff --git a/packages/designer/src/document/node/props/prop.ts b/packages/designer/src/document/node/props/prop.ts index 78349154f..634a6b14b 100644 --- a/packages/designer/src/document/node/props/prop.ts +++ b/packages/designer/src/document/node/props/prop.ts @@ -1,6 +1,6 @@ import { untracked, computed, obx, engineConfig, action, makeObservable, mobx, runInAction } from '@alilc/lowcode-editor-core'; -import { CompositeValue, GlobalEvent, isJSExpression, isJSSlot, JSSlot, SlotSchema } from '@alilc/lowcode-types'; -import { uniqueId, isPlainObject, hasOwnProperty, compatStage } from '@alilc/lowcode-utils'; +import { CompositeValue, GlobalEvent, JSSlot, SlotSchema } from '@alilc/lowcode-types'; +import { uniqueId, isPlainObject, hasOwnProperty, compatStage, isJSExpression, isJSSlot } from '@alilc/lowcode-utils'; import { valueToSource } from './value-to-source'; import { Props } from './props'; import { SlotNode, Node } from '../node'; diff --git a/packages/designer/src/plugin/plugin-types.ts b/packages/designer/src/plugin/plugin-types.ts index 732803542..2317b11ac 100644 --- a/packages/designer/src/plugin/plugin-types.ts +++ b/packages/designer/src/plugin/plugin-types.ts @@ -1,8 +1,7 @@ -import { CompositeObject, ComponentAction } from '@alilc/lowcode-types'; +import { CompositeObject, ComponentAction, MetadataTransducer } from '@alilc/lowcode-types'; import Logger from 'zen-logger'; import { Hotkey, Skeleton, Project, Event, Material, Common } from '@alilc/lowcode-shell'; import { EngineConfig } from '@alilc/lowcode-editor-core'; -import { MetadataTransducer } from '@alilc/lowcode-designer'; import { Setters } from '../types'; export type PreferenceValueType = string | number | boolean; diff --git a/packages/designer/src/project/project.ts b/packages/designer/src/project/project.ts index 2442cc09d..470ac2e1c 100644 --- a/packages/designer/src/project/project.ts +++ b/packages/designer/src/project/project.ts @@ -7,9 +7,8 @@ import { RootSchema, ComponentsMap, TransformStage, - isLowCodeComponentType, - isProCodeComponentType, } from '@alilc/lowcode-types'; +import { isLowCodeComponentType, isProCodeComponentType } from '@alilc/lowcode-utils'; import { ISimulatorHost } from '../simulator'; export class Project { diff --git a/packages/designer/src/types/index.ts b/packages/designer/src/types/index.ts index 43b88bf28..c0fffcc50 100644 --- a/packages/designer/src/types/index.ts +++ b/packages/designer/src/types/index.ts @@ -1,6 +1,5 @@ import { getSetter, registerSetter, getSettersMap } from '@alilc/lowcode-editor-core'; -import { isFormEvent, compatibleLegaoSchema, getNodeSchemaById } from '@alilc/lowcode-utils'; -import { isNodeSchema } from '@alilc/lowcode-types'; +import { isFormEvent, compatibleLegaoSchema, getNodeSchemaById, isNodeSchema } from '@alilc/lowcode-utils'; export type Setters = { getSetter: typeof getSetter; @@ -18,21 +17,4 @@ export const utils = { compatibleLegaoSchema, getNodeSchemaById, }; -export type Utils = typeof utils; - -export enum PROP_VALUE_CHANGED_TYPE { - /** - * normal set value - */ - SET_VALUE = 'SET_VALUE', - /** - * value changed caused by sub-prop value change - */ - SUB_VALUE_CHANGE = 'SUB_VALUE_CHANGE', -} - -export interface ISetValueOptions { - disableMutator?: boolean; - type?: PROP_VALUE_CHANGED_TYPE; - fromSetHotValue?: boolean; -} \ No newline at end of file +export type Utils = typeof utils; \ No newline at end of file diff --git a/packages/designer/tests/bugs/prop-variable-jse.test.ts b/packages/designer/tests/bugs/prop-variable-jse.test.ts index b39b5b54e..648370191 100644 --- a/packages/designer/tests/bugs/prop-variable-jse.test.ts +++ b/packages/designer/tests/bugs/prop-variable-jse.test.ts @@ -1,7 +1,7 @@ // @ts-nocheck import { Editor } from '@alilc/lowcode-editor-core'; -import { isJSBlock, TransformStage } from '@alilc/lowcode-types'; -import { isPlainObject, isVariable } from '@alilc/lowcode-utils'; +import { TransformStage } from '@alilc/lowcode-types'; +import { isPlainObject, isVariable, isJSBlock } from '@alilc/lowcode-utils'; import '../fixtures/window'; import { Designer } from '../../src/designer/designer'; import { DocumentModel } from '../../src/document/document-model'; diff --git a/packages/designer/tests/builtin-simulator/host.test.ts b/packages/designer/tests/builtin-simulator/host.test.ts index 746134c36..37713f330 100644 --- a/packages/designer/tests/builtin-simulator/host.test.ts +++ b/packages/designer/tests/builtin-simulator/host.test.ts @@ -1,30 +1,14 @@ // @ts-ignore -import React from 'react'; -import set from 'lodash/set'; -import cloneDeep from 'lodash/cloneDeep'; import '../fixtures/window'; import { Editor, globalContext } from '@alilc/lowcode-editor-core'; import { - AssetLevel, - Asset, - AssetList, - assetBundle, - assetItem, AssetType, } from '@alilc/lowcode-utils'; import { - Dragon, - isDragNodeObject, - isDragNodeDataObject, - isDragAnyObject, - isLocateEvent, DragObjectType, - isShaken, - setShaken, -} from '../../src/designer/dragon'; +} from '@alilc/lowcode-types'; import { Project } from '../../src/project/project'; import pageMetadata from '../fixtures/component-metadata/page'; -import { Node } from '../../src/document/node/node'; import { Designer } from '../../src/designer/designer'; import { DocumentModel } from '../../src/document/document-model'; import formSchema from '../fixtures/schema/form'; diff --git a/packages/designer/tests/designer/designer.test.ts b/packages/designer/tests/designer/designer.test.ts index 51fbabea7..3dd4749cd 100644 --- a/packages/designer/tests/designer/designer.test.ts +++ b/packages/designer/tests/designer/designer.test.ts @@ -3,7 +3,7 @@ import { Editor, globalContext } from '@alilc/lowcode-editor-core'; import { Project } from '../../src/project/project'; import { DocumentModel } from '../../src/document/document-model'; import { Designer } from '../../src/designer/designer'; -import { Dragon, DragObjectType } from '../../src/designer/dragon'; +import { Dragon } from '../../src/designer/dragon'; import { TransformStage } from '../../src/document/node/transform-stage'; import formSchema from '../fixtures/schema/form'; import buttonMetadata from '../fixtures/component-metadata/button'; @@ -11,6 +11,7 @@ import pageMetadata from '../fixtures/component-metadata/page'; import divMetadata from '../fixtures/component-metadata/div'; import { delayObxTick } from '../utils'; import { fireEvent } from '@testing-library/react'; +import { DragObjectType } from '@alilc/lowcode-types'; const mockNode = { internalToShellNode() { diff --git a/packages/designer/tests/designer/dragon.test.ts b/packages/designer/tests/designer/dragon.test.ts index eaa53bd5b..42216f06d 100644 --- a/packages/designer/tests/designer/dragon.test.ts +++ b/packages/designer/tests/designer/dragon.test.ts @@ -10,12 +10,12 @@ import { isDragNodeDataObject, isDragAnyObject, isLocateEvent, - DragObjectType, isShaken, setShaken, isInvalidPoint, isSameAs, } from '../../src/designer/dragon'; +import { DragObjectType } from '@alilc/lowcode-types'; import formSchema from '../fixtures/schema/form'; import { fireEvent } from '@testing-library/react'; diff --git a/packages/designer/tests/designer/scroller.test.ts b/packages/designer/tests/designer/scroller.test.ts index 00f0b86e8..5265596c6 100644 --- a/packages/designer/tests/designer/scroller.test.ts +++ b/packages/designer/tests/designer/scroller.test.ts @@ -1,35 +1,13 @@ import '../fixtures/window'; -import { set } from '../utils'; import { Editor, globalContext } from '@alilc/lowcode-editor-core'; import { Project } from '../../src/project/project'; import { DocumentModel } from '../../src/document/document-model'; import { ScrollTarget, Scroller } from '../../src/designer/scroller'; -import { - isRootNode, - isNode, - comparePosition, - contains, - insertChild, - insertChildren, - PositionNO, -} from '../../src/document/node/node'; import { Designer } from '../../src/designer/designer'; import { Dragon, - isDragNodeObject, - isDragNodeDataObject, - isDragAnyObject, - isLocateEvent, - DragObjectType, - isShaken, - setShaken, } from '../../src/designer/dragon'; import formSchema from '../fixtures/schema/form'; -import divMetadata from '../fixtures/component-metadata/div'; -import formMetadata from '../fixtures/component-metadata/form'; -import otherMeta from '../fixtures/component-metadata/other'; -import pageMetadata from '../fixtures/component-metadata/page'; -import { fireEvent } from '@testing-library/react'; describe('Scroller 测试', () => { let editor: Editor; diff --git a/packages/editor-core/src/di/setter.ts b/packages/editor-core/src/di/setter.ts index 2dd350deb..8220c7161 100644 --- a/packages/editor-core/src/di/setter.ts +++ b/packages/editor-core/src/di/setter.ts @@ -1,23 +1,8 @@ import { ReactNode } from 'react'; -import { CustomView, isCustomView, TitleContent } from '@alilc/lowcode-types'; -import { createContent } from '@alilc/lowcode-utils'; +import { CustomView, RegisteredSetter } from '@alilc/lowcode-types'; +import { createContent, isCustomView } from '@alilc/lowcode-utils'; + -export type RegisteredSetter = { - component: CustomView; - defaultProps?: object; - title?: TitleContent; - /** - * for MixedSetter to check this setter if available - */ - condition?: (field: any) => boolean; - /** - * for MixedSetter to manual change to this setter - */ - initialValue?: any | ((field: any) => any); - recommend?: boolean; - // 标识是否为动态setter，默认为true - isDynamic?: boolean; -}; const settersMap = new Map(); diff --git a/packages/editor-core/src/hotkey.ts b/packages/editor-core/src/hotkey.ts index 4375c9848..038438426 100644 --- a/packages/editor-core/src/hotkey.ts +++ b/packages/editor-core/src/hotkey.ts @@ -1,6 +1,7 @@ import { isEqual } from 'lodash'; import { globalContext } from './di'; import { Editor } from './editor'; +import { HotkeyCallback } from '@alilc/lowcode-types'; interface KeyMap { [key: number]: string; @@ -22,8 +23,6 @@ interface HotkeyDirectMap { [key: string]: HotkeyCallback; } -export type HotkeyCallback = (e: KeyboardEvent, combo?: string) => any | false; - interface HotkeyCallbackCfg { callback: HotkeyCallback; modifiers: string[]; diff --git a/packages/editor-core/src/intl/index.ts b/packages/editor-core/src/intl/index.ts index 1af991e69..6d9d840c3 100644 --- a/packages/editor-core/src/intl/index.ts +++ b/packages/editor-core/src/intl/index.ts @@ -1,7 +1,7 @@ import { ReactNode, Component, createElement } from 'react'; import { IntlMessageFormat } from 'intl-messageformat'; import { globalLocale } from './global-locale'; -import { isI18nData } from '@alilc/lowcode-types'; +import { isI18nData } from '@alilc/lowcode-utils'; import { observer } from '../utils'; function generateTryLocales(locale: string) { diff --git a/packages/editor-core/src/widgets/title/index.tsx b/packages/editor-core/src/widgets/title/index.tsx index bacfee9f1..735921389 100644 --- a/packages/editor-core/src/widgets/title/index.tsx +++ b/packages/editor-core/src/widgets/title/index.tsx @@ -1,7 +1,7 @@ import { Component, isValidElement, ReactNode } from 'react'; import classNames from 'classnames'; -import { createIcon } from '@alilc/lowcode-utils'; -import { TitleContent, isI18nData, I18nData } from '@alilc/lowcode-types'; +import { createIcon, isI18nData } from '@alilc/lowcode-utils'; +import { TitleContent, I18nData } from '@alilc/lowcode-types'; import { intl } from '../../intl'; import { Tip } from '../tip'; import './title.less'; diff --git a/packages/editor-skeleton/src/components/settings/settings-pane.tsx b/packages/editor-skeleton/src/components/settings/settings-pane.tsx index fc084628a..8043c7484 100644 --- a/packages/editor-skeleton/src/components/settings/settings-pane.tsx +++ b/packages/editor-skeleton/src/components/settings/settings-pane.tsx @@ -1,13 +1,12 @@ import { Component, MouseEvent, Fragment } from 'react'; import { shallowIntl, createSetterContent, observer, obx, engineConfig, runInAction, globalContext } from '@alilc/lowcode-editor-core'; -import { createContent } from '@alilc/lowcode-utils'; +import { createContent, isJSSlot, isSetterConfig } from '@alilc/lowcode-utils'; import { Skeleton } from '@alilc/lowcode-editor-skeleton'; -import { isSetterConfig, CustomView, isJSSlot } from '@alilc/lowcode-types'; +import { CustomView } from '@alilc/lowcode-types'; import { SettingField, isSettingField, SettingTopEntry, SettingEntry, ComponentMeta } from '@alilc/lowcode-designer'; import { createField } from '../field'; import PopupService, { PopupPipe } from '../popup'; import { SkeletonContext } from '../../context'; -// import { Icon } from '@alifd/next'; import { intl } from '../../locale'; function isStandardComponent(componentMeta: ComponentMeta | null) { diff --git a/packages/editor-skeleton/src/components/stage-box/stage.tsx b/packages/editor-skeleton/src/components/stage-box/stage.tsx index 64209fbd5..e4b0c0ef1 100644 --- a/packages/editor-skeleton/src/components/stage-box/stage.tsx +++ b/packages/editor-skeleton/src/components/stage-box/stage.tsx @@ -4,7 +4,7 @@ import classNames from 'classnames'; import { IconArrow } from '../../icons/arrow'; import { IconExit } from '../../icons/exit'; import { Stage as StageWidget } from '../../widget/stage'; -import { isTitleConfig } from '@alilc/lowcode-types'; +import { isTitleConfig } from '@alilc/lowcode-utils'; export const StageDefaultProps = { current: false, diff --git a/packages/editor-skeleton/src/skeleton.ts b/packages/editor-skeleton/src/skeleton.ts index bdca4e284..4b3f42809 100644 --- a/packages/editor-skeleton/src/skeleton.ts +++ b/packages/editor-skeleton/src/skeleton.ts @@ -3,7 +3,6 @@ import { DockConfig, PanelConfig, WidgetConfig, - IWidgetBaseConfig, PanelDockConfig, DialogDockConfig, isDockConfig, @@ -11,7 +10,6 @@ import { isPanelConfig, DividerConfig, isDividerConfig, - IWidgetConfigArea, } from './types'; import Panel, { isPanel } from './widget/panel'; import WidgetContainer from './widget/widget-container'; @@ -23,7 +21,12 @@ import { Stage, StageConfig } from './widget/stage'; import { isValidElement } from 'react'; import { isPlainObject, uniqueId } from '@alilc/lowcode-utils'; import { Divider } from '@alifd/next'; -import { EditorConfig, PluginClassSet } from '@alilc/lowcode-types'; +import { + EditorConfig, + PluginClassSet, + IWidgetBaseConfig, + IWidgetConfigArea, +} from '@alilc/lowcode-types'; export enum SkeletonEvents { PANEL_DOCK_ACTIVE = 'skeleton.panel-dock.active', diff --git a/packages/editor-skeleton/src/transducers/parse-func.ts b/packages/editor-skeleton/src/transducers/parse-func.ts index 8dc0a4cd8..b1caa3453 100644 --- a/packages/editor-skeleton/src/transducers/parse-func.ts +++ b/packages/editor-skeleton/src/transducers/parse-func.ts @@ -1,9 +1,5 @@ -import { - FieldConfig, - TransformedComponentMetadata, - isJSFunction, -} from '@alilc/lowcode-types'; -import { isPlainObject } from '@alilc/lowcode-utils'; +import { TransformedComponentMetadata } from '@alilc/lowcode-types'; +import { isPlainObject, isJSFunction } from '@alilc/lowcode-utils'; const leadingFnRe = /^function/; const leadingFnNameRe = /^\w+\s*\(/; diff --git a/packages/editor-skeleton/src/types.ts b/packages/editor-skeleton/src/types.ts index cefe86c92..ef6b43875 100644 --- a/packages/editor-skeleton/src/types.ts +++ b/packages/editor-skeleton/src/types.ts @@ -1,35 +1,14 @@ import { ReactElement, ComponentType } from 'react'; -import { TitleContent, IconType, I18nData, TipContent } from '@alilc/lowcode-types'; +import { + TitleContent, + IconType, + I18nData, + TipContent, + IWidgetConfigArea, + IWidgetBaseConfig, +} from '@alilc/lowcode-types'; import { IWidget } from './widget/widget'; -/** - * 所有可能的停靠位置 - */ -export type IWidgetConfigArea = - | 'leftArea' | 'left' | 'rightArea' - | 'right' | 'topArea' | 'top' - | 'toolbar' | 'mainArea' | 'main' - | 'center' | 'centerArea' | 'bottomArea' - | 'bottom' | 'leftFixedArea' - | 'leftFloatArea' | 'stages'; - -export interface IWidgetBaseConfig { - type: string; - name: string; - /** - * 停靠位置： - * - 当 type 为 'Panel' 时自动为 'leftFloatArea'； - * - 当 type 为 'Widget' 时自动为 'mainArea'； - * - 其他时候自动为 'leftArea'； - */ - area?: IWidgetConfigArea; - props?: Record; - content?: any; - contentProps?: Record; - // index?: number; - [extra: string]: any; -} - export interface WidgetConfig extends IWidgetBaseConfig { type: 'Widget'; props?: { diff --git a/packages/editor-skeleton/src/widget/utils.ts b/packages/editor-skeleton/src/widget/utils.ts index 73657d08f..556a8cb2a 100644 --- a/packages/editor-skeleton/src/widget/utils.ts +++ b/packages/editor-skeleton/src/widget/utils.ts @@ -1,4 +1,5 @@ -import { IconType, TitleContent, isI18nData, TipContent, isTitleConfig } from '@alilc/lowcode-types'; +import { IconType, TitleContent, TipContent } from '@alilc/lowcode-types'; +import { isI18nData, isTitleConfig } from '@alilc/lowcode-utils'; import { isValidElement } from 'react'; export function composeTitle(title?: TitleContent, icon?: IconType, tip?: TipContent, tipAsTitle?: boolean, noIcon?: boolean) { diff --git a/packages/engine/src/engine-core.ts b/packages/engine/src/engine-core.ts index 9b3c39328..55355f574 100644 --- a/packages/engine/src/engine-core.ts +++ b/packages/engine/src/engine-core.ts @@ -33,7 +33,6 @@ import './modules/live-editing'; import classes from './modules/classes'; import symbols from './modules/symbols'; -export * from './modules/editor-types'; export * from './modules/skeleton-types'; export * from './modules/designer-types'; export * from './modules/lowcode-types'; diff --git a/packages/engine/src/modules/designer-types.ts b/packages/engine/src/modules/designer-types.ts index e2023ef6f..9799f6b2c 100644 --- a/packages/engine/src/modules/designer-types.ts +++ b/packages/engine/src/modules/designer-types.ts @@ -13,7 +13,4 @@ export type ILowCodePluginConfig = designerCabin.ILowCodePluginConfig; export type ILowCodePluginManager = designerCabin.ILowCodePluginManager; export type ILowCodePluginContext = designerCabin.ILowCodePluginContext; export type IPluginConfigCreator = designerCabin.IPluginConfigCreator; -export type PluginPreference = designerCabin.PluginPreference; -export type PropsReducerContext = designerCabin.PropsReducerContext; -export type DragObjectType = designerCabin.DragObjectType; -export type DragNodeDataObject = designerCabin.DragNodeDataObject; \ No newline at end of file +export type PluginPreference = designerCabin.PluginPreference; \ No newline at end of file diff --git a/packages/engine/src/modules/editor-types.ts b/packages/engine/src/modules/editor-types.ts deleted file mode 100644 index 1306712a7..000000000 --- a/packages/engine/src/modules/editor-types.ts +++ /dev/null @@ -1,3 +0,0 @@ -import * as editorCabin from '@alilc/lowcode-editor-core'; - -export type RegisteredSetter = editorCabin.RegisteredSetter; diff --git a/packages/engine/src/modules/live-editing.ts b/packages/engine/src/modules/live-editing.ts index 620fef895..b6e110a1c 100644 --- a/packages/engine/src/modules/live-editing.ts +++ b/packages/engine/src/modules/live-editing.ts @@ -1,5 +1,5 @@ import { EditingTarget, Node as DocNode, SaveHandler, LiveEditing } from '@alilc/lowcode-designer'; -import { isJSExpression } from '@alilc/lowcode-types'; +import { isJSExpression } from '@alilc/lowcode-utils'; function getText(node: DocNode, prop: string) { const p = node.getProp(prop, false); @@ -53,8 +53,7 @@ function equalText(v: any, innerText: string) { export const liveEditingSaveHander: SaveHandler = { condition: (prop) => { - // const v = prop.getValue(); - return prop.type === 'expression'; // || isI18nData(v); + return prop.type === 'expression'; }, onSaveContent: (content, prop) => { const v = prop.getValue(); diff --git a/packages/plugin-outline-pane/src/tree-node.ts b/packages/plugin-outline-pane/src/tree-node.ts index 67efe5fba..54627de2c 100644 --- a/packages/plugin-outline-pane/src/tree-node.ts +++ b/packages/plugin-outline-pane/src/tree-node.ts @@ -1,4 +1,5 @@ -import { TitleContent, isI18nData } from '@alilc/lowcode-types'; +import { TitleContent } from '@alilc/lowcode-types'; +import { isI18nData } from '@alilc/lowcode-utils'; import { computed, obx, intl, makeObservable, action } from '@alilc/lowcode-editor-core'; import { Node, DocumentModel, isLocationChildrenDetail, LocationChildrenDetail, Designer } from '@alilc/lowcode-designer'; import { Tree } from './tree'; diff --git a/packages/plugin-outline-pane/src/views/tree.tsx b/packages/plugin-outline-pane/src/views/tree.tsx index 98cdd4233..af86ed88f 100644 --- a/packages/plugin-outline-pane/src/views/tree.tsx +++ b/packages/plugin-outline-pane/src/views/tree.tsx @@ -1,9 +1,10 @@ import { Component, MouseEvent as ReactMouseEvent } from 'react'; import { observer, Editor, globalContext } from '@alilc/lowcode-editor-core'; -import { Node, DragObjectType, isShaken } from '@alilc/lowcode-designer'; +import { Node, isShaken } from '@alilc/lowcode-designer'; import { isFormEvent, canClickNode } from '@alilc/lowcode-utils'; import { Tree } from '../tree'; import RootTreeNodeView from './root-tree-node'; +import { DragObjectType } from '@alilc/lowcode-types'; function getTreeNodeIdByEvent(e: ReactMouseEvent, stop: Element): null | string { let target: Element | null = e.target as Element; diff --git a/packages/rax-simulator-renderer/src/renderer.ts b/packages/rax-simulator-renderer/src/renderer.ts index a123dfc7e..cebeffbb1 100644 --- a/packages/rax-simulator-renderer/src/renderer.ts +++ b/packages/rax-simulator-renderer/src/renderer.ts @@ -1,8 +1,8 @@ import { BuiltinSimulatorRenderer, Component, DocumentModel, Node, NodeInstance } from '@alilc/lowcode-designer'; -import { ComponentSchema, NodeSchema, NpmInfo, RootSchema, TransformStage } from '@alilc/lowcode-types'; +import { ComponentSchema, NodeSchema, NpmInfo, TransformStage } from '@alilc/lowcode-types'; import { Asset, compatibleLegaoSchema, cursor, isElement, isESModule, isPlainObject, isReactComponent, setNativeSelection } from '@alilc/lowcode-utils'; import LowCodeRenderer from '@alilc/lowcode-rax-renderer'; -import { computed, observable as obx, untracked, makeObservable, configure } from 'mobx'; +import { computed, observable as obx, makeObservable, configure } from 'mobx'; import DriverUniversal from 'driver-universal'; import { EventEmitter } from 'events'; import { createMemoryHistory, MemoryHistory } from 'history'; diff --git a/packages/renderer-core/src/renderer/base.tsx b/packages/renderer-core/src/renderer/base.tsx index afa3938e7..718a5d9c0 100644 --- a/packages/renderer-core/src/renderer/base.tsx +++ b/packages/renderer-core/src/renderer/base.tsx @@ -3,7 +3,8 @@ /* eslint-disable react/prop-types */ import classnames from 'classnames'; import { create as createDataSourceEngine } from '@alilc/lowcode-datasource-engine/interpret'; -import { isI18nData, isJSExpression, isJSFunction, NodeSchema, NodeData, JSONValue, CompositeValue } from '@alilc/lowcode-types'; +import { NodeSchema, NodeData, JSONValue, CompositeValue } from '@alilc/lowcode-types'; +import { isI18nData, isJSExpression, isJSFunction } from '@alilc/lowcode-utils'; import adapter from '../adapter'; import divFactory from '../components/Div'; import visualDomFactory from '../components/VisualDom'; @@ -29,7 +30,7 @@ import { isVariable, isJSSlot, } from '../utils'; -import { IBaseRendererProps, INodeInfo, IBaseRenderComponent, IBaseRendererContext, IGeneralConstructor, IRendererAppHelper, DataSource } from '../types'; +import { IBaseRendererProps, INodeInfo, IBaseRenderComponent, IBaseRendererContext, IRendererAppHelper, DataSource } from '../types'; import { compWrapper } from '../hoc'; import { IComponentConstruct, leafWrapper } from '../hoc/leaf'; import logger from '../utils/logger'; diff --git a/packages/renderer-core/src/utils/common.ts b/packages/renderer-core/src/utils/common.ts index d064b5593..7f3deed43 100644 --- a/packages/renderer-core/src/utils/common.ts +++ b/packages/renderer-core/src/utils/common.ts @@ -1,7 +1,8 @@ /* eslint-disable no-console */ /* eslint-disable no-new-func */ import logger from './logger'; -import { isI18nData, RootSchema, NodeSchema, isJSExpression, JSSlot } from '@alilc/lowcode-types'; +import { RootSchema, NodeSchema, JSSlot } from '@alilc/lowcode-types'; +import { isI18nData, isJSExpression } from '@alilc/lowcode-utils'; import { isEmpty } from 'lodash'; import IntlMessageFormat from 'intl-messageformat'; import pkg from '../../package.json'; diff --git a/packages/renderer-core/src/utils/data-helper.ts b/packages/renderer-core/src/utils/data-helper.ts index 9eb152df9..d884c13c9 100644 --- a/packages/renderer-core/src/utils/data-helper.ts +++ b/packages/renderer-core/src/utils/data-helper.ts @@ -1,7 +1,7 @@ /* eslint-disable no-console */ /* eslint-disable max-len */ /* eslint-disable object-curly-newline */ -import { isJSFunction } from '@alilc/lowcode-types'; +import { isJSFunction } from '@alilc/lowcode-utils'; import { transformArrayToMap, transformStringToFunction } from './common'; import { jsonp, request, get, post } from './request'; import logger from './logger'; diff --git a/packages/renderer-core/src/utils/is-use-loop.ts b/packages/renderer-core/src/utils/is-use-loop.ts index 913480f63..59d356f5d 100644 --- a/packages/renderer-core/src/utils/is-use-loop.ts +++ b/packages/renderer-core/src/utils/is-use-loop.ts @@ -1,4 +1,5 @@ -import { isJSExpression, JSExpression } from '@alilc/lowcode-types'; +import { JSExpression } from '@alilc/lowcode-types'; +import { isJSExpression } from '@alilc/lowcode-utils'; // 1.渲染模式下，loop 是数组，则按照数组长度渲染组件 // 2.设计模式下，loop 需要长度大于 0，按照循环模式渲染，防止无法设计的情况 diff --git a/packages/shell/src/canvas.ts b/packages/shell/src/canvas.ts index 268dbc4a8..a927f63d8 100644 --- a/packages/shell/src/canvas.ts +++ b/packages/shell/src/canvas.ts @@ -1,16 +1,19 @@ import { Designer } from '@alilc/lowcode-designer'; import { designerSymbol } from './symbols'; import DropLocation from './drop-location'; +import { IPublicModelCanvas } from '@alilc/lowcode-types'; -export default class Canvas { +export default class Canvas implements IPublicModelCanvas { private readonly [designerSymbol]: Designer; constructor(designer: Designer) { this[designerSymbol] = designer; } - static create(designer: Designer) { - if (!designer) return null; + static create(designer: Designer): IPublicModelCanvas | null { + if (!designer) { + return null; + } return new Canvas(designer); } diff --git a/packages/shell/src/common.tsx b/packages/shell/src/common.tsx index dc25e4668..e5ef1ab37 100644 --- a/packages/shell/src/common.tsx +++ b/packages/shell/src/common.tsx @@ -4,12 +4,17 @@ import { compatibleLegaoSchema as innerCompatibleLegaoSchema, getNodeSchemaById as innerGetNodeSchemaById, transactionManager, + isNodeSchema as innerIsNodeSchema, } from '@alilc/lowcode-utils'; import { - isNodeSchema as innerIsNodeSchema, NodeSchema, TransitionType, TransformStage as InnerTransitionStage, + IPublicCommonDesignerCabin, + IPublicCommonSkeletonCabin, + IPublicCommonUtils, + IPublicApiCommon, + DragObjectType as InnerDragObjectType, } from '@alilc/lowcode-types'; import { SettingField as InnerSettingField, @@ -19,7 +24,6 @@ import { isDragNodeDataObject as innerIsDragNodeDataObject, isDragNodeObject as innerIsDragNodeObject, isDragAnyObject as innerIsDragAnyObject, - DragObjectType as InnerDragObjectType, isNode as innerIsNode, isShaken as innerIsShaken, contains as innerContains, @@ -56,7 +60,7 @@ import { import { ReactNode } from 'react'; -class DesignerCabin { +class DesignerCabin implements IPublicCommonDesignerCabin { private readonly [editorSymbol]: Editor; /** * @deprecated @@ -147,7 +151,7 @@ class DesignerCabin { } } -class SkeletonCabin { +class SkeletonCabin implements IPublicCommonSkeletonCabin { private readonly [skeletonSymbol]: InnerSkeleton; constructor(skeleton: InnerSkeleton) { @@ -181,7 +185,7 @@ class SkeletonCabin { } } -class Utils { +class Utils implements IPublicCommonUtils { isNodeSchema(data: any): data is NodeSchema { return innerIsNodeSchema(data); } @@ -314,7 +318,7 @@ class EditorCabin { } -export default class Common { +export default class Common implements IPublicApiCommon { private readonly __designerCabin: any; private readonly __skeletonCabin: any; private readonly __editorCabin: any; diff --git a/packages/shell/src/component-meta.ts b/packages/shell/src/component-meta.ts index e7752f685..6dec94562 100644 --- a/packages/shell/src/component-meta.ts +++ b/packages/shell/src/component-meta.ts @@ -2,19 +2,21 @@ import { ComponentMeta as InnerComponentMeta, ParentalNode, } from '@alilc/lowcode-designer'; -import Node from './node'; -import { NodeData, NodeSchema } from '@alilc/lowcode-types'; +import { NodeData, NodeSchema, IPublicModelComponentMeta, I18nData, IconType, NpmInfo, TransformedComponentMetadata, IPublicModelNode } from '@alilc/lowcode-types'; import { componentMetaSymbol, nodeSymbol } from './symbols'; +import { ReactElement } from 'react'; -export default class ComponentMeta { +export default class ComponentMeta implements IPublicModelComponentMeta { private readonly [componentMetaSymbol]: InnerComponentMeta; constructor(componentMeta: InnerComponentMeta) { this[componentMetaSymbol] = componentMeta; } - static create(componentMeta: InnerComponentMeta | null) { - if (!componentMeta) return null; + static create(componentMeta: InnerComponentMeta | null): IPublicModelComponentMeta | null { + if (!componentMeta) { + return null; + } return new ComponentMeta(componentMeta); } @@ -52,28 +54,28 @@ export default class ComponentMeta { /** * 元数据配置 */ - get configure() { + get configure(): any { return this[componentMetaSymbol].configure; } /** * 标题 */ - get title() { + get title(): string | I18nData | ReactElement { return this[componentMetaSymbol].title; } /** * 图标 */ - get icon() { + get icon(): IconType { return this[componentMetaSymbol].icon; } /** * 组件 npm 信息 */ - get npm() { + get npm(): NpmInfo { return this[componentMetaSymbol].npm; } @@ -84,7 +86,7 @@ export default class ComponentMeta { return this[componentMetaSymbol].prototype; } - get availableActions() { + get availableActions(): any { return this[componentMetaSymbol].availableActions; } @@ -92,7 +94,7 @@ export default class ComponentMeta { * 设置 npm 信息 * @param npm */ - setNpm(npm: any) { + setNpm(npm: NpmInfo): void { this[componentMetaSymbol].setNpm(npm); } @@ -100,7 +102,7 @@ export default class ComponentMeta { * 获取元数据 * @returns */ - getMetadata() { + getMetadata(): TransformedComponentMetadata { return this[componentMetaSymbol].getMetadata(); } @@ -110,8 +112,8 @@ export default class ComponentMeta { * @param parent * @returns */ - checkNestingUp(my: Node | NodeData, parent: ParentalNode) { - const curNode = my.isNode ? my[nodeSymbol] : my; + checkNestingUp(my: IPublicModelNode | NodeData, parent: ParentalNode): boolean { + const curNode = (my as any).isNode ? (my as any)[nodeSymbol] : my; return this[componentMetaSymbol].checkNestingUp(curNode as any, parent); } @@ -121,12 +123,12 @@ export default class ComponentMeta { * @param parent * @returns */ - checkNestingDown(my: Node | NodeData, target: NodeSchema | Node | NodeSchema[]) { - const curNode = my.isNode ? my[nodeSymbol] : my; - return this[componentMetaSymbol].checkNestingDown(curNode as any, target[nodeSymbol] || target); + checkNestingDown(my: IPublicModelNode | NodeData, target: NodeSchema | IPublicModelNode | NodeSchema[]) { + const curNode = (my as any)?.isNode ? (my as any)[nodeSymbol] : my; + return this[componentMetaSymbol].checkNestingDown(curNode as any, (target as any)[nodeSymbol] || target); } - refreshMetadata() { + refreshMetadata(): void { this[componentMetaSymbol].refreshMetadata(); } } diff --git a/packages/shell/src/detecting.ts b/packages/shell/src/detecting.ts index d8e6c7fbb..2baf02801 100644 --- a/packages/shell/src/detecting.ts +++ b/packages/shell/src/detecting.ts @@ -4,8 +4,9 @@ import { DocumentModel as InnerDocumentModel, } from '@alilc/lowcode-designer'; import { documentSymbol, detectingSymbol } from './symbols'; +import { IPublicModelDetecting } from '@alilc/lowcode-types'; -export default class Detecting { +export default class Detecting implements IPublicModelDetecting { private readonly [documentSymbol]: InnerDocumentModel; private readonly [detectingSymbol]: InnerDetecting; diff --git a/packages/shell/src/document-model.ts b/packages/shell/src/document-model.ts index 3f8f4e70e..82fd243d6 100644 --- a/packages/shell/src/document-model.ts +++ b/packages/shell/src/document-model.ts @@ -2,16 +2,26 @@ import { Editor } from '@alilc/lowcode-editor-core'; import { DocumentModel as InnerDocumentModel, Node as InnerNode, - IOnChangeOptions as InnerIOnChangeOptions, - DragObject as InnerDragObject, - DragNodeObject, - DragNodeDataObject, isDragNodeObject, + IOnChangeOptions as InnerOnChangeOptions, } from '@alilc/lowcode-designer'; import { TransformStage, RootSchema, GlobalEvent, + IPublicModelDocumentModel, + IPublicOnChangeOptions, + DragObject, + DragNodeObject, + DragNodeDataObject, + IPublicModelNode, + IPublicModelSelection, + IPublicModelDetecting, + IPublicModelHistory, + IPublicModelCanvas, + IPublicApiProject, + IPublicModelModalNodesManager, + PropChangeOptions, } from '@alilc/lowcode-types'; import Node from './node'; import Selection from './selection'; @@ -23,33 +33,20 @@ import Canvas from './canvas'; import ModalNodesManager from './modal-nodes-manager'; import { documentSymbol, editorSymbol, nodeSymbol } from './symbols'; -type IOnChangeOptions = { - type: string; - node: Node; -}; - -type PropChangeOptions = { - key?: string | number; - prop?: Prop; - node: Node; - newValue: any; - oldValue: any; -}; - const Events = { IMPORT_SCHEMA: 'shell.document.importSchema', }; const shellDocSymbol = Symbol('shellDocSymbol'); -export default class DocumentModel { +export default class DocumentModel implements IPublicModelDocumentModel { private readonly [documentSymbol]: InnerDocumentModel; private readonly [editorSymbol]: Editor; - private _focusNode: Node; - public selection: Selection; - public detecting: Detecting; - public history: History; - public canvas: Canvas; + private _focusNode: IPublicModelNode | null; + selection: IPublicModelSelection; + detecting: IPublicModelDetecting; + history: IPublicModelHistory; + canvas: IPublicModelCanvas; constructor(document: InnerDocumentModel) { this[documentSymbol] = document; @@ -62,10 +59,14 @@ export default class DocumentModel { this._focusNode = Node.create(this[documentSymbol].focusNode); } - static create(document: InnerDocumentModel | undefined | null) { - if (!document) return null; + static create(document: InnerDocumentModel | undefined | null): IPublicModelDocumentModel | null { + if (!document) { + return null; + } // @ts-ignore 直接返回已挂载的 shell doc 实例 - if (document[shellDocSymbol]) return document[shellDocSymbol]; + if (document[shellDocSymbol]) { + return (document as any)[shellDocSymbol]; + } const shellDoc = new DocumentModel(document); // @ts-ignore 直接返回已挂载的 shell doc 实例 document[shellDocSymbol] = shellDoc; @@ -75,7 +76,7 @@ export default class DocumentModel { /** * id */ - get id() { + get id(): string { return this[documentSymbol].id; } @@ -87,7 +88,7 @@ export default class DocumentModel { * 获取当前文档所属的 project * @returns */ - get project() { + get project(): IPublicApiProject | null { return Project.create(this[documentSymbol].project); } @@ -95,15 +96,15 @@ export default class DocumentModel { * 获取文档的根节点 * @returns */ - get root(): Node | null { + get root(): IPublicModelNode | null { return Node.create(this[documentSymbol].getRoot()); } - get focusNode(): Node { + get focusNode(): IPublicModelNode | null { return this._focusNode || this.root; } - set focusNode(node: Node) { + set focusNode(node: IPublicModelNode | null) { this._focusNode = node; } @@ -111,8 +112,8 @@ export default class DocumentModel { * 获取文档下所有节点 * @returns */ - get nodesMap() { - const map = new Map(); + get nodesMap(): any { + const map = new Map(); for (let id of this[documentSymbol].nodesMap.keys()) { map.set(id, this.getNodeById(id)!); } @@ -122,12 +123,15 @@ export default class DocumentModel { /** * 模态节点管理 */ - get modalNodesManager() { + get modalNodesManager(): IPublicModelModalNodesManager | null { return ModalNodesManager.create(this[documentSymbol].modalNodesManager); } - // @TODO: 不能直接暴露 - get dropLocation() { + /** + * @TODO: 不能直接暴露 + * @deprecated + */ + get dropLocation(): any { return this[documentSymbol].dropLocation; } @@ -136,7 +140,7 @@ export default class DocumentModel { * @param nodeId * @returns */ - getNodeById(nodeId: string) { + getNodeById(nodeId: string): IPublicModelNode | null { return Node.create(this[documentSymbol].getNode(nodeId)); } @@ -144,7 +148,7 @@ export default class DocumentModel { * 导入 schema * @param schema */ - importSchema(schema: RootSchema) { + importSchema(schema: RootSchema): void { this[documentSymbol].import(schema); this[editorSymbol].emit(Events.IMPORT_SCHEMA, schema); } @@ -154,7 +158,7 @@ export default class DocumentModel { * @param stage * @returns */ - exportSchema(stage: TransformStage = TransformStage.Render) { + exportSchema(stage: TransformStage = TransformStage.Render): any { return this[documentSymbol].export(stage); } @@ -167,14 +171,14 @@ export default class DocumentModel { * @returns */ insertNode( - parent: Node, - thing: Node, + parent: IPublicModelNode, + thing: IPublicModelNode, at?: number | null | undefined, copy?: boolean | undefined, - ) { + ): IPublicModelNode | null { const node = this[documentSymbol].insertNode( - parent[nodeSymbol] ? parent[nodeSymbol] : parent, - thing?.[nodeSymbol] ? thing[nodeSymbol] : thing, + (parent as any)[nodeSymbol] ? (parent as any)[nodeSymbol] : parent, + (thing as any)?.[nodeSymbol] ? (thing as any)[nodeSymbol] : thing, at, copy, ); @@ -186,7 +190,7 @@ export default class DocumentModel { * @param data * @returns */ - createNode(data: any) { + createNode(data: any): IPublicModelNode | null { return Node.create(this[documentSymbol].createNode(data)); } @@ -194,7 +198,7 @@ export default class DocumentModel { * 移除指定节点/节点id * @param idOrNode */ - removeNode(idOrNode: string | Node) { + removeNode(idOrNode: string | IPublicModelNode): void { this[documentSymbol].removeNode(idOrNode as any); } @@ -203,7 +207,7 @@ export default class DocumentModel { * @param extraComps * @returns */ - getComponentsMap(extraComps?: string[]) { + getComponentsMap(extraComps?: string[]): any { return this[documentSymbol].getComponentsMap(extraComps); } @@ -213,13 +217,16 @@ export default class DocumentModel { * @param dragObject 拖拽的对象 * @returns boolean 是否可以放置 */ - checkNesting(dropTarget: Node, dragObject: DragNodeObject | DragNodeDataObject): boolean { - let innerDragObject: InnerDragObject = dragObject; + checkNesting( + dropTarget: IPublicModelNode, + dragObject: DragNodeObject | DragNodeDataObject, + ): boolean { + let innerDragObject: DragObject = dragObject; if (isDragNodeObject(dragObject)) { innerDragObject.nodes = innerDragObject.nodes.map((node: Node) => (node[nodeSymbol] || node)); } return this[documentSymbol].checkNesting( - (dropTarget[nodeSymbol] || dropTarget) as any, + ((dropTarget as any)[nodeSymbol] || dropTarget) as any, innerDragObject as any, ); } @@ -227,7 +234,7 @@ export default class DocumentModel { /** * 当前 document 新增节点事件 */ - onAddNode(fn: (node: Node) => void) { + onAddNode(fn: (node: IPublicModelNode) => void): () => void { return this[documentSymbol].onNodeCreate((node: InnerNode) => { fn(Node.create(node)!); }); @@ -236,7 +243,7 @@ export default class DocumentModel { /** * 当前 document 新增节点事件，此时节点已经挂载到 document 上 */ - onMountNode(fn: (payload: { node: Node }) => void) { + onMountNode(fn: (payload: { node: IPublicModelNode }) => void): () => void { this[editorSymbol].on('node.add', fn as any); return () => { this[editorSymbol].off('node.add', fn as any); @@ -246,7 +253,7 @@ export default class DocumentModel { /** * 当前 document 删除节点事件 */ - onRemoveNode(fn: (node: Node) => void) { + onRemoveNode(fn: (node: IPublicModelNode) => void): () => void { return this[documentSymbol].onNodeDestroy((node: InnerNode) => { fn(Node.create(node)!); }); @@ -255,7 +262,7 @@ export default class DocumentModel { /** * 当前 document 的 hover 变更事件 */ - onChangeDetecting(fn: (node: Node) => void) { + onChangeDetecting(fn: (node: IPublicModelNode) => void): () => void { return this[documentSymbol].designer.detecting.onDetectingChange((node: InnerNode) => { fn(Node.create(node)!); }); @@ -264,7 +271,7 @@ export default class DocumentModel { /** * 当前 document 的选中变更事件 */ - onChangeSelection(fn: (ids: string[]) => void) { + onChangeSelection(fn: (ids: string[]) => void): () => void { return this[documentSymbol].selection.onSelectionChange((ids: string[]) => { fn(ids); }); @@ -274,9 +281,9 @@ export default class DocumentModel { * 当前 document 的节点显隐状态变更事件 * @param fn */ - onChangeNodeVisible(fn: (node: Node, visible: boolean) => void) { + onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): void { // TODO: history 变化时需要重新绑定 - this[documentSymbol].nodesMap.forEach((node) => { + this[documentSymbol].nodesMap?.forEach((node) => { node.onVisibleChange((flag: boolean) => { fn(Node.create(node)!, flag); }); @@ -287,10 +294,10 @@ export default class DocumentModel { * 当前 document 的节点 children 变更事件 * @param fn */ - onChangeNodeChildren(fn: (info?: IOnChangeOptions) => void) { + onChangeNodeChildren(fn: (info?: IPublicOnChangeOptions) => void): void { // TODO: history 变化时需要重新绑定 - this[documentSymbol].nodesMap.forEach((node) => { - node.onChildrenChange((info?: InnerIOnChangeOptions) => { + this[documentSymbol].nodesMap?.forEach((node) => { + node.onChildrenChange((info?: InnerOnChangeOptions) => { return info ? fn({ type: info.type, @@ -305,7 +312,7 @@ export default class DocumentModel { * 当前 document 节点属性修改事件 * @param fn */ - onChangeNodeProp(fn: (info: PropChangeOptions) => void) { + onChangeNodeProp(fn: (info: PropChangeOptions) => void): void { this[editorSymbol].on( GlobalEvent.Node.Prop.InnerChange, (info: GlobalEvent.Node.Prop.ChangeOptions) => { @@ -324,7 +331,7 @@ export default class DocumentModel { * import schema event * @param fn */ - onImportSchema(fn: (schema: RootSchema) => void) { + onImportSchema(fn: (schema: RootSchema) => void): void { this[editorSymbol].on(Events.IMPORT_SCHEMA, fn as any); } } diff --git a/packages/shell/src/drag-object.ts b/packages/shell/src/drag-object.ts index 1261b4d26..f09cedecb 100644 --- a/packages/shell/src/drag-object.ts +++ b/packages/shell/src/drag-object.ts @@ -1,30 +1,34 @@ -import { DragObject as InnerDragObject, DragNodeDataObject } from '@alilc/lowcode-designer'; import { dragObjectSymbol } from './symbols'; +import { IPublicModelDragObject, DragObject as InnerDragObject, DragNodeDataObject } from '@alilc/lowcode-types'; import Node from './node'; -export default class DragObject { +export default class DragObject implements IPublicModelDragObject { private readonly [dragObjectSymbol]: InnerDragObject; constructor(dragObject: InnerDragObject) { this[dragObjectSymbol] = dragObject; } - static create(dragObject: InnerDragObject) { - if (!dragObject) return null; + static create(dragObject: InnerDragObject): IPublicModelDragObject | null { + if (!dragObject) { + return null; + } return new DragObject(dragObject); } - get type() { + get type(): any { return this[dragObjectSymbol].type; } - get nodes() { + get nodes(): any { const { nodes } = this[dragObjectSymbol]; - if (!nodes) return null; + if (!nodes) { + return null; + } return nodes.map(Node.create); } - get data() { + get data(): any { return (this[dragObjectSymbol] as DragNodeDataObject).data; } } \ No newline at end of file diff --git a/packages/shell/src/dragon.ts b/packages/shell/src/dragon.ts index a1e4a4dab..9832c7439 100644 --- a/packages/shell/src/dragon.ts +++ b/packages/shell/src/dragon.ts @@ -1,29 +1,36 @@ import { Dragon as InnerDragon, - DragObject as InnerDragObject, - DragNodeDataObject, LocateEvent as InnerLocateEvent, } from '@alilc/lowcode-designer'; import { dragonSymbol } from './symbols'; import LocateEvent from './locate-event'; import DragObject from './drag-object'; +import { + IPublicModelDragon, + IPublicModelLocateEvent, + IPublicModelDragObject, + DragObject as InnerDragObject, + DragNodeDataObject, +} from '@alilc/lowcode-types'; -export default class Dragon { +export default class Dragon implements IPublicModelDragon { private readonly [dragonSymbol]: InnerDragon; constructor(dragon: InnerDragon) { this[dragonSymbol] = dragon; } - static create(dragon: InnerDragon | null) { - if (!dragon) return null; + static create(dragon: InnerDragon | null): IPublicModelDragon | null { + if (!dragon) { + return null; + } return new Dragon(dragon); } /** * is dragging or not */ - get dragging() { + get dragging(): boolean { return this[dragonSymbol].dragging; } @@ -32,7 +39,7 @@ export default class Dragon { * @param func * @returns */ - onDragstart(func: (e: LocateEvent) => any) { + onDragstart(func: (e: IPublicModelLocateEvent) => any): () => void { return this[dragonSymbol].onDragstart((e: InnerLocateEvent) => func(LocateEvent.create(e)!)); } @@ -41,7 +48,7 @@ export default class Dragon { * @param func * @returns */ - onDrag(func: (e: LocateEvent) => any) { + onDrag(func: (e: IPublicModelLocateEvent) => any): () => void { return this[dragonSymbol].onDrag((e: InnerLocateEvent) => func(LocateEvent.create(e)!)); } @@ -50,7 +57,7 @@ export default class Dragon { * @param func * @returns */ - onDragend(func: (o: { dragObject: DragObject; copy?: boolean }) => any) { + onDragend(func: (o: { dragObject: IPublicModelDragObject; copy?: boolean }) => any): () => void { return this[dragonSymbol].onDragend( (o: { dragObject: InnerDragObject; copy?: boolean }) => func({ dragObject: DragObject.create(o.dragObject)!, @@ -64,7 +71,7 @@ export default class Dragon { * @param shell 拖拽监听的区域 * @param boost 拖拽转换函数 */ - from(shell: Element, boost: (e: MouseEvent) => DragNodeDataObject | null) { + from(shell: Element, boost: (e: MouseEvent) => DragNodeDataObject | null): any { return this[dragonSymbol].from(shell, boost); } } diff --git a/packages/shell/src/drop-location.ts b/packages/shell/src/drop-location.ts index 14eff23ed..42e8a30df 100644 --- a/packages/shell/src/drop-location.ts +++ b/packages/shell/src/drop-location.ts @@ -3,16 +3,19 @@ import { } from '@alilc/lowcode-designer'; import { dropLocationSymbol } from './symbols'; import Node from './node'; +import { IPublicModelDropLocation } from '@alilc/lowcode-types'; -export default class DropLocation { +export default class DropLocation implements IPublicModelDropLocation { private readonly [dropLocationSymbol]: InnerDropLocation; constructor(dropLocation: InnerDropLocation) { this[dropLocationSymbol] = dropLocation; } - static create(dropLocation: InnerDropLocation | null) { - if (!dropLocation) return null; + static create(dropLocation: InnerDropLocation | null): DropLocation | null { + if (!dropLocation) { + return null; + } return new DropLocation(dropLocation); } diff --git a/packages/shell/src/event.ts b/packages/shell/src/event.ts index cb2242229..6d5a62829 100644 --- a/packages/shell/src/event.ts +++ b/packages/shell/src/event.ts @@ -1,6 +1,7 @@ -import { Editor as InnerEditor, globalContext } from '@alilc/lowcode-editor-core'; +import { Editor as InnerEditor } from '@alilc/lowcode-editor-core'; import { getLogger } from '@alilc/lowcode-utils'; import { editorSymbol } from './symbols'; +import { IPublicApiEvent } from '@alilc/lowcode-types'; const logger = getLogger({ level: 'warn', bizName: 'shell:event' }); @@ -8,7 +9,7 @@ type EventOptions = { prefix: string; }; -export default class Event { +export default class Event implements IPublicApiEvent { private readonly [editorSymbol]: InnerEditor; private readonly options: EventOptions; diff --git a/packages/shell/src/history.ts b/packages/shell/src/history.ts index 267c7fd99..06945a2d6 100644 --- a/packages/shell/src/history.ts +++ b/packages/shell/src/history.ts @@ -1,7 +1,8 @@ -import { History as InnerHistory, DocumentModel as InnerDocumentModel } from '@alilc/lowcode-designer'; +import { DocumentModel as InnerDocumentModel } from '@alilc/lowcode-designer'; import { historySymbol, documentSymbol } from './symbols'; +import { IPublicModelHistory } from '@alilc/lowcode-types'; -export default class History { +export default class History implements IPublicModelHistory { private readonly [documentSymbol]: InnerDocumentModel; private get [historySymbol]() { @@ -16,28 +17,28 @@ export default class History { * 历史记录跳转到指定位置 * @param cursor */ - go(cursor: number) { + go(cursor: number): void { this[historySymbol].go(cursor); } /** * 历史记录后退 */ - back() { + back(): void { this[historySymbol].back(); } /** * 历史记录前进 */ - forward() { + forward(): void { this[historySymbol].forward(); } /** * 保存当前状态 */ - savePoint() { + savePoint(): void { this[historySymbol].savePoint(); } @@ -45,7 +46,7 @@ export default class History { * 当前是否是「保存点」，即是否有状态变更但未保存 * @returns */ - isSavePoint() { + isSavePoint(): boolean { return this[historySymbol].isSavePoint(); } @@ -53,7 +54,7 @@ export default class History { * 获取 state，判断当前是否为「可回退」、「可前进」的状态 * @returns */ - getState() { + getState(): any { return this[historySymbol].getState(); } @@ -62,7 +63,7 @@ export default class History { * @param func * @returns */ - onChangeState(func: () => any) { + onChangeState(func: () => any): () => void { return this[historySymbol].onStateChange(func); } @@ -71,7 +72,7 @@ export default class History { * @param func * @returns */ - onChangeCursor(func: () => any) { + onChangeCursor(func: () => any): () => void { return this[historySymbol].onCursor(func); } } diff --git a/packages/shell/src/hotkey.ts b/packages/shell/src/hotkey.ts index a60be7dd9..728a8bcf0 100644 --- a/packages/shell/src/hotkey.ts +++ b/packages/shell/src/hotkey.ts @@ -1,7 +1,7 @@ -import { hotkey, HotkeyCallback } from '@alilc/lowcode-editor-core'; -import { Disposable } from '@alilc/lowcode-types'; +import { hotkey } from '@alilc/lowcode-editor-core'; +import { Disposable, HotkeyCallback, IPublicApiHotkey } from '@alilc/lowcode-types'; -export default class Hotkey { +export default class Hotkey implements IPublicApiHotkey { get callbacks() { return hotkey.callBacks; } diff --git a/packages/shell/src/locate-event.ts b/packages/shell/src/locate-event.ts index 01c97edae..d6ca596ee 100644 --- a/packages/shell/src/locate-event.ts +++ b/packages/shell/src/locate-event.ts @@ -1,48 +1,51 @@ import { LocateEvent as InnerLocateEvent } from '@alilc/lowcode-designer'; import { locateEventSymbol } from './symbols'; import DragObject from './drag-object'; +import { IPublicModelLocateEvent, IPublicModelDragObject } from '@alilc/lowcode-types'; -export default class LocateEvent { +export default class LocateEvent implements IPublicModelLocateEvent { private readonly [locateEventSymbol]: InnerLocateEvent; constructor(locateEvent: InnerLocateEvent) { this[locateEventSymbol] = locateEvent; } - static create(locateEvent: InnerLocateEvent) { - if (!locateEvent) return null; + static create(locateEvent: InnerLocateEvent): IPublicModelLocateEvent | null { + if (!locateEvent) { + return null; + } return new LocateEvent(locateEvent); } - get type() { + get type(): string { return this[locateEventSymbol].type; } - get globalX() { + get globalX(): number { return this[locateEventSymbol].globalX; } - get globalY() { + get globalY(): number { return this[locateEventSymbol].globalY; } - get originalEvent() { + get originalEvent(): MouseEvent | DragEvent { return this[locateEventSymbol].originalEvent; } - get target() { + get target(): Element | null | undefined { return this[locateEventSymbol].target; } - get canvasX() { + get canvasX(): number | undefined { return this[locateEventSymbol].canvasX; } - get canvasY() { + get canvasY(): number | undefined { return this[locateEventSymbol].canvasY; } - get dragObject() { + get dragObject(): IPublicModelDragObject | null { return DragObject.create(this[locateEventSymbol].dragObject); } } \ No newline at end of file diff --git a/packages/shell/src/material.ts b/packages/shell/src/material.ts index 46b25beab..7942065c7 100644 --- a/packages/shell/src/material.ts +++ b/packages/shell/src/material.ts @@ -2,7 +2,6 @@ import { Editor } from '@alilc/lowcode-editor-core'; import { Designer, registerMetadataTransducer, - MetadataTransducer, getRegisteredMetadataTransducers, addBuiltinComponentAction, removeBuiltinComponentAction, @@ -10,11 +9,17 @@ import { isComponentMeta, } from '@alilc/lowcode-designer'; import { AssetsJson } from '@alilc/lowcode-utils'; -import { ComponentAction, ComponentMetadata } from '@alilc/lowcode-types'; +import { + ComponentAction, + ComponentMetadata, + IPublicApiMaterial, + MetadataTransducer, + IPublicModelComponentMeta, +} from '@alilc/lowcode-types'; import { editorSymbol, designerSymbol } from './symbols'; import ComponentMeta from './component-meta'; -export default class Material { +export default class Material implements IPublicApiMaterial { private readonly [editorSymbol]: Editor; private readonly [designerSymbol]: Designer; @@ -83,8 +88,9 @@ export default class Material { * @param componentName * @returns */ - getComponentMeta(componentName: string) { - return ComponentMeta.create(this[designerSymbol].getComponentMeta(componentName)); + getComponentMeta(componentName: string): IPublicModelComponentMeta | null { + const innerMeta = this[designerSymbol].getComponentMeta(componentName); + return ComponentMeta.create(innerMeta); } /** @@ -109,8 +115,8 @@ export default class Material { * 获取所有已注册的物料元数据 * @returns */ - getComponentMetasMap() { - const map = new Map(); + getComponentMetasMap(): Map { + const map = new Map(); const originalMap = this[designerSymbol].getComponentMetasMap(); for (let componentName of originalMap.keys()) { map.set(componentName, this.getComponentMeta(componentName)!); diff --git a/packages/shell/src/modal-nodes-manager.ts b/packages/shell/src/modal-nodes-manager.ts index 739ca9406..4e556607a 100644 --- a/packages/shell/src/modal-nodes-manager.ts +++ b/packages/shell/src/modal-nodes-manager.ts @@ -1,24 +1,28 @@ import { ModalNodesManager as InnerModalNodesManager, Node as InnerNode } from '@alilc/lowcode-designer'; -import { NodeSchema, NodeData, TransformStage } from '@alilc/lowcode-types'; +import { IPublicModelModalNodesManager, IPublicModelNode } from '@alilc/lowcode-types'; import Node from './node'; import { nodeSymbol, modalNodesManagerSymbol } from './symbols'; -export default class ModalNodesManager { +export default class ModalNodesManager implements IPublicModelModalNodesManager { private readonly [modalNodesManagerSymbol]: InnerModalNodesManager; constructor(modalNodesManager: InnerModalNodesManager) { this[modalNodesManagerSymbol] = modalNodesManager; } - static create(modalNodesManager: InnerModalNodesManager | null) { - if (!modalNodesManager) return null; + static create( + modalNodesManager: InnerModalNodesManager | null, + ): IPublicModelModalNodesManager | null { + if (!modalNodesManager) { + return null; + } return new ModalNodesManager(modalNodesManager); } /** * 设置模态节点，触发内部事件 */ - setNodes() { + setNodes(): void { this[modalNodesManagerSymbol].setNodes(); } @@ -26,7 +30,7 @@ export default class ModalNodesManager { * 获取模态节点（们） * @returns */ - getModalNodes() { + getModalNodes(): any { return this[modalNodesManagerSymbol].getModalNodes().map((node) => Node.create(node)); } @@ -34,14 +38,14 @@ export default class ModalNodesManager { * 获取当前可见的模态节点 * @returns */ - getVisibleModalNode() { + getVisibleModalNode(): any { return Node.create(this[modalNodesManagerSymbol].getVisibleModalNode()); } /** * 隐藏模态节点（们） */ - hideModalNodes() { + hideModalNodes(): void { this[modalNodesManagerSymbol].hideModalNodes(); } @@ -49,7 +53,7 @@ export default class ModalNodesManager { * 设置指定节点为可见态 * @param node Node */ - setVisible(node: Node) { + setVisible(node: IPublicModelNode): void { this[modalNodesManagerSymbol].setVisible(node[nodeSymbol]); } @@ -57,7 +61,7 @@ export default class ModalNodesManager { * 设置指定节点为不可见态 * @param node Node */ - setInvisible(node: Node) { + setInvisible(node: IPublicModelNode): void { this[modalNodesManagerSymbol].setInvisible(node[nodeSymbol]); } } \ No newline at end of file diff --git a/packages/shell/src/node-children.ts b/packages/shell/src/node-children.ts index 2557e37ac..9ff2f93b6 100644 --- a/packages/shell/src/node-children.ts +++ b/packages/shell/src/node-children.ts @@ -1,31 +1,33 @@ import { NodeChildren as InnerNodeChildren, Node as InnerNode } from '@alilc/lowcode-designer'; -import { NodeSchema, NodeData, TransformStage } from '@alilc/lowcode-types'; +import { NodeSchema, NodeData, TransformStage, IPublicModelNodeChildren, IPublicModelNode } from '@alilc/lowcode-types'; import Node from './node'; import { nodeSymbol, nodeChildrenSymbol } from './symbols'; -export default class NodeChildren { +export default class NodeChildren implements IPublicModelNodeChildren { private readonly [nodeChildrenSymbol]: InnerNodeChildren; constructor(nodeChildren: InnerNodeChildren) { this[nodeChildrenSymbol] = nodeChildren; } - static create(nodeChldren: InnerNodeChildren | null) { - if (!nodeChldren) return null; + static create(nodeChldren: InnerNodeChildren | null): IPublicModelNodeChildren | null { + if (!nodeChldren) { + return null; + } return new NodeChildren(nodeChldren); } /** * 返回当前 children 实例所属的节点实例 */ - get owner(): Node | null { + get owner(): IPublicModelNode | null { return Node.create(this[nodeChildrenSymbol].owner); } /** * children 内的节点实例数 */ - get size() { + get size(): number { return this[nodeChildrenSymbol].size; } @@ -33,14 +35,14 @@ export default class NodeChildren { * 是否为空 * @returns */ - get isEmpty() { + get isEmpty(): boolean { return this[nodeChildrenSymbol].isEmpty(); } /** * judge if it is not empty */ - get notEmpty() { + get notEmpty(): boolean { return !this.isEmpty; } @@ -49,8 +51,8 @@ export default class NodeChildren { * @param node * @returns */ - delete(node: Node) { - return this[nodeChildrenSymbol].delete(node[nodeSymbol]); + delete(node: IPublicModelNode): boolean { + return this[nodeChildrenSymbol].delete((node as any)[nodeSymbol]); } /** @@ -59,8 +61,8 @@ export default class NodeChildren { * @param at 插入下标 * @returns */ - insert(node: Node, at?: number | null) { - return this[nodeChildrenSymbol].insert(node[nodeSymbol], at, true); + insert(node: IPublicModelNode, at?: number | null): void { + return this[nodeChildrenSymbol].insert((node as any)[nodeSymbol], at, true); } /** @@ -68,8 +70,8 @@ export default class NodeChildren { * @param node * @returns */ - indexOf(node: Node) { - return this[nodeChildrenSymbol].indexOf(node[nodeSymbol]); + indexOf(node: IPublicModelNode): number { + return this[nodeChildrenSymbol].indexOf((node as any)[nodeSymbol]); } /** @@ -78,8 +80,8 @@ export default class NodeChildren { * @param deleteCount * @param node */ - splice(start: number, deleteCount: number, node?: Node) { - this[nodeChildrenSymbol].splice(start, deleteCount, node?.[nodeSymbol]); + splice(start: number, deleteCount: number, node?: IPublicModelNode): any { + this[nodeChildrenSymbol].splice(start, deleteCount, (node as any)?.[nodeSymbol]); } /** @@ -87,7 +89,7 @@ export default class NodeChildren { * @param index * @returns */ - get(index: number) { + get(index: number): any { return Node.create(this[nodeChildrenSymbol].get(index)); } @@ -96,15 +98,15 @@ export default class NodeChildren { * @param node * @returns */ - has(node: Node) { - return this[nodeChildrenSymbol].has(node[nodeSymbol]); + has(node: IPublicModelNode): boolean { + return this[nodeChildrenSymbol].has((node as any)[nodeSymbol]); } /** * 类似数组的 forEach * @param fn */ - forEach(fn: (node: Node, index: number) => void) { + forEach(fn: (node: IPublicModelNode, index: number) => void): void { this[nodeChildrenSymbol].forEach((item: InnerNode, index: number) => { fn(Node.create(item)!, index); }); @@ -114,7 +116,7 @@ export default class NodeChildren { * 类似数组的 map * @param fn */ - map(fn: (node: Node, index: number) => T[]) { + map(fn: (node: IPublicModelNode, index: number) => T[]): any[] | null { return this[nodeChildrenSymbol].map((item: InnerNode, index: number) => { return fn(Node.create(item)!, index); }); @@ -124,7 +126,7 @@ export default class NodeChildren { * 类似数组的 every * @param fn */ - every(fn: (node: Node, index: number) => boolean) { + every(fn: (node: IPublicModelNode, index: number) => boolean): boolean { return this[nodeChildrenSymbol].every((item: InnerNode, index: number) => { return fn(Node.create(item)!, index); }); @@ -134,7 +136,7 @@ export default class NodeChildren { * 类似数组的 some * @param fn */ - some(fn: (node: Node, index: number) => boolean) { + some(fn: (node: IPublicModelNode, index: number) => boolean): boolean { return this[nodeChildrenSymbol].some((item: InnerNode, index: number) => { return fn(Node.create(item)!, index); }); @@ -144,7 +146,7 @@ export default class NodeChildren { * 类似数组的 filter * @param fn */ - filter(fn: (node: Node, index: number) => boolean) { + filter(fn: (node: IPublicModelNode, index: number) => boolean): any { return this[nodeChildrenSymbol] .filter((item: InnerNode, index: number) => { return fn(Node.create(item)!, index); @@ -156,7 +158,7 @@ export default class NodeChildren { * 类似数组的 find * @param fn */ - find(fn: (node: Node, index: number) => boolean) { + find(fn: (node: IPublicModelNode, index: number) => boolean): IPublicModelNode | null { return Node.create( this[nodeChildrenSymbol].find((item: InnerNode, index: number) => { return fn(Node.create(item)!, index); @@ -168,7 +170,7 @@ export default class NodeChildren { * 类似数组的 reduce * @param fn */ - reduce(fn: (acc: any, cur: Node) => any, initialValue: any) { + reduce(fn: (acc: any, cur: IPublicModelNode) => any, initialValue: any): void { return this[nodeChildrenSymbol].reduce((acc: any, cur: InnerNode) => { return fn(acc, Node.create(cur)!); }, initialValue); @@ -178,7 +180,7 @@ export default class NodeChildren { * 导入 schema * @param data */ - importSchema(data?: NodeData | NodeData[]) { + importSchema(data?: NodeData | NodeData[]): void { this[nodeChildrenSymbol].import(data); } @@ -187,7 +189,7 @@ export default class NodeChildren { * @param stage * @returns */ - exportSchema(stage: TransformStage = TransformStage.Render) { + exportSchema(stage: TransformStage = TransformStage.Render): any { return this[nodeChildrenSymbol].export(stage); } @@ -198,9 +200,9 @@ export default class NodeChildren { * @param sorter */ mergeChildren( - remover: (node: Node, idx: number) => boolean, - adder: (children: Node[]) => any, - sorter: (firstNode: Node, secondNode: Node) => number, + remover: (node: IPublicModelNode, idx: number) => boolean, + adder: (children: IPublicModelNode[]) => any, + sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number, ) { if (!sorter) { sorter = () => 0; diff --git a/packages/shell/src/node.ts b/packages/shell/src/node.ts index e12551b0c..34faf5f57 100644 --- a/packages/shell/src/node.ts +++ b/packages/shell/src/node.ts @@ -1,9 +1,23 @@ import { DocumentModel as InnerDocumentModel, Node as InnerNode, - getConvertedExtraKey, } from '@alilc/lowcode-designer'; -import { CompositeValue, NodeSchema, TransformStage } from '@alilc/lowcode-types'; +import { + CompositeValue, + NodeSchema, + TransformStage, + IPublicModelNode, + IconType, + I18nData, + IPublicModelComponentMeta, + IPublicModelDocumentModel, + IPublicModelNodeChildren, + IPublicModelProp, + IPublicModelProps, + PropsMap, + PropsList, + IPublicModelSettingTopEntry, +} from '@alilc/lowcode-types'; import Prop from './prop'; import Props from './props'; import DocumentModel from './document-model'; @@ -11,10 +25,11 @@ import NodeChildren from './node-children'; import ComponentMeta from './component-meta'; import SettingTopEntry from './setting-top-entry'; import { documentSymbol, nodeSymbol } from './symbols'; +import { ReactElement } from 'react'; const shellNodeSymbol = Symbol('shellNodeSymbol'); -export default class Node { +export default class Node implements IPublicModelNode { private readonly [documentSymbol]: InnerDocumentModel; private readonly [nodeSymbol]: InnerNode; @@ -27,10 +42,14 @@ export default class Node { this._id = this[nodeSymbol].id; } - static create(node: InnerNode | null | undefined) { - if (!node) return null; + static create(node: InnerNode | null | undefined): IPublicModelNode | null { + if (!node) { + return null; + } // @ts-ignore 直接返回已挂载的 shell node 实例 - if (node[shellNodeSymbol]) return node[shellNodeSymbol]; + if (node[shellNodeSymbol]) { + return (node as any)[shellNodeSymbol]; + } const shellNode = new Node(node); // @ts-ignore 挂载 shell node 实例 node[shellNodeSymbol] = shellNode; @@ -54,70 +73,70 @@ export default class Node { /** * 节点标题 */ - get title() { + get title(): string | I18nData | ReactElement { return this[nodeSymbol].title; } /** * 是否为「容器型」节点 */ - get isContainer() { + get isContainer(): boolean { return this[nodeSymbol].isContainer(); } /** * 是否为根节点 */ - get isRoot() { + get isRoot(): boolean { return this[nodeSymbol].isRoot(); } /** * 是否为空节点（无 children 或者 children 为空） */ - get isEmpty() { + get isEmpty(): boolean { return this[nodeSymbol].isEmpty(); } /** * 是否为 Page 节点 */ - get isPage() { + get isPage(): boolean { return this[nodeSymbol].isPage(); } /** * 是否为 Component 节点 */ - get isComponent() { + get isComponent(): boolean { return this[nodeSymbol].isComponent(); } /** * 是否为「模态框」节点 */ - get isModal() { + get isModal(): boolean { return this[nodeSymbol].isModal(); } /** * 是否为插槽节点 */ - get isSlot() { + get isSlot(): boolean { return this[nodeSymbol].isSlot(); } /** * 是否为父类/分支节点 */ - get isParental() { + get isParental(): boolean { return this[nodeSymbol].isParental(); } /** * 是否为叶子节点 */ - get isLeaf() { + get isLeaf(): boolean { return this[nodeSymbol].isLeaf(); } @@ -129,7 +148,7 @@ export default class Node { /** * 获取当前节点的锁定状态 */ - get isLocked() { + get isLocked(): boolean { return this[nodeSymbol].isLocked; } @@ -143,28 +162,28 @@ export default class Node { /** * 图标 */ - get icon() { + get icon(): IconType { return this[nodeSymbol].icon; } /** * 节点所在树的层级深度，根节点深度为 0 */ - get zLevel() { + get zLevel(): number { return this[nodeSymbol].zLevel; } /** * 节点 componentName */ - get componentName() { + get componentName(): string { return this[nodeSymbol].componentName; } /** * 节点的物料元数据 */ - get componentMeta() { + get componentMeta(): IPublicModelComponentMeta | null { return ComponentMeta.create(this[nodeSymbol].componentMeta); } @@ -172,7 +191,7 @@ export default class Node { * 获取节点所属的文档模型对象 * @returns */ - get document() { + get document(): IPublicModelDocumentModel | null { return DocumentModel.create(this[documentSymbol]); } @@ -180,7 +199,7 @@ export default class Node { * 获取当前节点的前一个兄弟节点 * @returns */ - get prevSibling(): Node | null { + get prevSibling(): IPublicModelNode | null { return Node.create(this[nodeSymbol].prevSibling); } @@ -188,7 +207,7 @@ export default class Node { * 获取当前节点的后一个兄弟节点 * @returns */ - get nextSibling(): Node | null { + get nextSibling(): IPublicModelNode | null { return Node.create(this[nodeSymbol].nextSibling); } @@ -196,7 +215,7 @@ export default class Node { * 获取当前节点的父亲节点 * @returns */ - get parent(): Node | null { + get parent(): IPublicModelNode | null { return Node.create(this[nodeSymbol].parent); } @@ -204,46 +223,46 @@ export default class Node { * 获取当前节点的孩子节点模型 * @returns */ - get children() { + get children(): IPublicModelNodeChildren | null { return NodeChildren.create(this[nodeSymbol].children); } /** * 节点上挂载的插槽节点们 */ - get slots(): Node[] { + get slots(): IPublicModelNode[] { return this[nodeSymbol].slots.map((node: InnerNode) => Node.create(node)!); } /** * 当前节点为插槽节点时，返回节点对应的属性实例 */ - get slotFor() { + get slotFor(): IPublicModelProp | null { return Prop.create(this[nodeSymbol].slotFor); } /** * 返回节点的属性集 */ - get props() { + get props(): IPublicModelProps | null { return Props.create(this[nodeSymbol].props); } /** * 返回节点的属性集 */ - get propsData() { + get propsData(): PropsMap | PropsList | null { return this[nodeSymbol].propsData; } /** - * 获取符合搭建协议-节点 schema 结构 + * 获取符合搭建协议 - 节点 schema 结构 */ - get schema(): any { + get schema(): NodeSchema { return this[nodeSymbol].schema; } - get settingEntry(): any { + get settingEntry(): IPublicModelSettingTopEntry { return SettingTopEntry.create(this[nodeSymbol].settingEntry as any); } @@ -256,6 +275,7 @@ export default class Node { /** * 获取节点实例对应的 dom 节点 + * @deprecated */ getDOMNode() { return this[nodeSymbol].getDOMNode(); @@ -268,10 +288,10 @@ export default class Node { * @param sorter */ mergeChildren( - remover: (node: Node, idx: number) => boolean, - adder: (children: Node[]) => any, - sorter: (firstNode: Node, secondNode: Node) => number, - ) { + remover: (node: IPublicModelNode, idx: number) => boolean, + adder: (children: IPublicModelNode[]) => any, + sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number, + ): any { return this.children?.mergeChildren(remover, adder, sorter); } @@ -279,7 +299,7 @@ export default class Node { * 返回节点的尺寸、位置信息 * @returns */ - getRect() { + getRect(): DOMRect | null { return this[nodeSymbol].getRect(); } @@ -287,7 +307,7 @@ export default class Node { * 是否有挂载插槽节点 * @returns */ - hasSlots() { + hasSlots(): boolean { return this[nodeSymbol].hasSlots(); } @@ -295,7 +315,7 @@ export default class Node { * 是否设定了渲染条件 * @returns */ - hasCondition() { + hasCondition(): boolean { return this[nodeSymbol].hasCondition(); } @@ -303,19 +323,19 @@ export default class Node { * 是否设定了循环数据 * @returns */ - hasLoop() { + hasLoop(): boolean { return this[nodeSymbol].hasLoop(); } - getVisible() { + getVisible(): boolean { return this[nodeSymbol].getVisible(); } - setVisible(flag: boolean) { + setVisible(flag: boolean): void { this[nodeSymbol].setVisible(flag); } - isConditionalVisible() { + isConditionalVisible(): boolean | undefined { return this[nodeSymbol].isConditionalVisible(); } @@ -323,7 +343,7 @@ export default class Node { * 设置节点锁定状态 * @param flag */ - lock(flag?: boolean) { + lock(flag?: boolean): void { this[nodeSymbol].lock(flag); } @@ -334,8 +354,8 @@ export default class Node { return this.props; } - contains(node: Node) { - return this[nodeSymbol].contains(node[nodeSymbol]); + contains(node: IPublicModelNode): boolean { + return this[nodeSymbol].contains((node as any)[nodeSymbol]); } /** @@ -343,7 +363,7 @@ export default class Node { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getProp(path: string, createIfNone = true): Prop | null { + getProp(path: string, createIfNone = true): IPublicModelProp | null { return Prop.create(this[nodeSymbol].getProp(path, createIfNone)); } @@ -363,7 +383,7 @@ export default class Node { * @param createIfNone 当没有属性的时候，是否创建一个属性 * @returns */ - getExtraProp(path: string, createIfNone?: boolean): Prop | null { + getExtraProp(path: string, createIfNone?: boolean): IPublicModelProp | null { return Prop.create(this[nodeSymbol].getExtraProp(path, createIfNone)); } @@ -373,7 +393,7 @@ export default class Node { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getExtraPropValue(path: string) { + getExtraPropValue(path: string): any { return this.getExtraProp(path)?.getValue(); } @@ -383,7 +403,7 @@ export default class Node { * @param value 值 * @returns */ - setPropValue(path: string, value: CompositeValue) { + setPropValue(path: string, value: CompositeValue): void { return this.getProp(path)?.setValue(value); } @@ -393,7 +413,7 @@ export default class Node { * @param value 值 * @returns */ - setExtraPropValue(path: string, value: CompositeValue) { + setExtraPropValue(path: string, value: CompositeValue): void { return this.getExtraProp(path)?.setValue(value); } @@ -401,7 +421,7 @@ export default class Node { * 导入节点数据 * @param data */ - importSchema(data: NodeSchema) { + importSchema(data: NodeSchema): void { this[nodeSymbol].import(data); } @@ -411,7 +431,7 @@ export default class Node { * @param options * @returns */ - exportSchema(stage: TransformStage = TransformStage.Render, options?: any) { + exportSchema(stage: TransformStage = TransformStage.Render, options?: any): NodeSchema { return this[nodeSymbol].export(stage, options); } @@ -421,8 +441,16 @@ export default class Node { * @param ref * @param useMutator */ - insertBefore(node: Node, ref?: Node | undefined, useMutator?: boolean) { - this[nodeSymbol].insertBefore(node[nodeSymbol] || node, ref?.[nodeSymbol], useMutator); + insertBefore( + node: IPublicModelNode, + ref?: IPublicModelNode | undefined, + useMutator?: boolean, + ): void { + this[nodeSymbol].insertBefore( + (node as any)[nodeSymbol] || node, + (ref as any)?.[nodeSymbol], + useMutator, + ); } /** @@ -431,8 +459,16 @@ export default class Node { * @param ref * @param useMutator */ - insertAfter(node: Node, ref?: Node | undefined, useMutator?: boolean) { - this[nodeSymbol].insertAfter(node[nodeSymbol] || node, ref?.[nodeSymbol], useMutator); + insertAfter( + node: IPublicModelNode, + ref?: IPublicModelNode | undefined, + useMutator?: boolean, + ): void { + this[nodeSymbol].insertAfter( + (node as any)[nodeSymbol] || node, + (ref as any)?.[nodeSymbol], + useMutator, + ); } /** @@ -441,22 +477,22 @@ export default class Node { * @param data 用作替换的节点对象或者节点描述 * @returns */ - replaceChild(node: Node, data: any) { - return Node.create(this[nodeSymbol].replaceChild(node[nodeSymbol], data)); + replaceChild(node: IPublicModelNode, data: any): IPublicModelNode | null { + return Node.create(this[nodeSymbol].replaceChild((node as any)[nodeSymbol], data)); } /** * 将当前节点替换成指定节点描述 * @param schema */ - replaceWith(schema: NodeSchema) { + replaceWith(schema: NodeSchema): any { this[nodeSymbol].replaceWith(schema); } /** * 选中当前节点实例 */ - select() { + select(): void { this[nodeSymbol].select(); } @@ -464,14 +500,14 @@ export default class Node { * 设置悬停态 * @param flag */ - hover(flag = true) { + hover(flag = true): void { this[nodeSymbol].hover(flag); } /** * 删除当前节点实例 */ - remove() { + remove(): void { this[nodeSymbol].remove(); } /** diff --git a/packages/shell/src/project.ts b/packages/shell/src/project.ts index 0bf555571..752518079 100644 --- a/packages/shell/src/project.ts +++ b/packages/shell/src/project.ts @@ -1,15 +1,22 @@ import { BuiltinSimulatorHost, Project as InnerProject, - PropsReducer as PropsTransducer, TransformStage, } from '@alilc/lowcode-designer'; -import { RootSchema, ProjectSchema, IEditor } from '@alilc/lowcode-types'; +import { + RootSchema, + ProjectSchema, + IEditor, + IPublicApiProject, + IPublicApiSimulatorHost, + IPublicModelDocumentModel, + PropsTransducer, +} from '@alilc/lowcode-types'; import DocumentModel from './document-model'; import SimulatorHost from './simulator-host'; import { editorSymbol, projectSymbol, simulatorHostSymbol, simulatorRendererSymbol, documentSymbol } from './symbols'; -export default class Project { +export default class Project implements IPublicApiProject { private readonly [projectSymbol]: InnerProject; private readonly [editorSymbol]: IEditor; private [simulatorHostSymbol]: BuiltinSimulatorHost; @@ -28,7 +35,7 @@ export default class Project { * 获取当前的 document * @returns */ - get currentDocument(): DocumentModel | null { + get currentDocument(): IPublicModelDocumentModel | null { return this.getCurrentDocument(); } @@ -36,14 +43,14 @@ export default class Project { * 获取当前 project 下所有 documents * @returns */ - get documents(): DocumentModel[] { + get documents(): IPublicModelDocumentModel[] { return this[projectSymbol].documents.map((doc) => DocumentModel.create(doc)!); } /** * 获取模拟器的 host */ - get simulatorHost() { + get simulatorHost(): IPublicApiSimulatorHost | null { return SimulatorHost.create(this[projectSymbol].simulator as any || this[simulatorHostSymbol]); } @@ -70,7 +77,7 @@ export default class Project { * @param data * @returns */ - createDocument(data?: RootSchema): DocumentModel | null { + createDocument(data?: RootSchema): IPublicModelDocumentModel | null { const doc = this[projectSymbol].createDocument(data); return DocumentModel.create(doc); } @@ -79,8 +86,8 @@ export default class Project { * 删除一个 document * @param doc */ - removeDocument(doc: DocumentModel) { - this[projectSymbol].removeDocument(doc[documentSymbol]); + removeDocument(doc: IPublicModelDocumentModel) { + this[projectSymbol].removeDocument((doc as any)[documentSymbol]); } /** @@ -88,7 +95,7 @@ export default class Project { * @param fileName * @returns */ - getDocumentByFileName(fileName: string): DocumentModel | null { + getDocumentByFileName(fileName: string): IPublicModelDocumentModel | null { return DocumentModel.create(this[projectSymbol].getDocumentByFileName(fileName)); } @@ -97,7 +104,7 @@ export default class Project { * @param id * @returns */ - getDocumentById(id: string): DocumentModel | null { + getDocumentById(id: string): IPublicModelDocumentModel | null { return DocumentModel.create(this[projectSymbol].getDocument(id)); } @@ -113,7 +120,7 @@ export default class Project { * 导入 project * @param schema 待导入的 project 数据 */ - importSchema(schema?: ProjectSchema) { + importSchema(schema?: ProjectSchema): void { this[projectSymbol].load(schema, true); } @@ -121,7 +128,7 @@ export default class Project { * 获取当前的 document * @returns */ - getCurrentDocument(): DocumentModel | null { + getCurrentDocument(): IPublicModelDocumentModel | null { return DocumentModel.create(this[projectSymbol].currentDocument); } @@ -130,7 +137,7 @@ export default class Project { * @param transducer * @param stage */ - addPropsTransducer(transducer: PropsTransducer, stage: TransformStage) { + addPropsTransducer(transducer: PropsTransducer, stage: TransformStage): void { this[projectSymbol].designer.addPropsReducer(transducer, stage); } @@ -139,14 +146,14 @@ export default class Project { * @param fn * @returns */ - onRemoveDocument(fn: (data: { id: string}) => void) { + onRemoveDocument(fn: (data: { id: string}) => void): any { return this[editorSymbol].on('designer.document.remove', (data: { id: string }) => fn(data)); } /** * 当前 project 内的 document 变更事件 */ - onChangeDocument(fn: (doc: DocumentModel) => void) { + onChangeDocument(fn: (doc: IPublicModelDocumentModel) => void) { const offFn = this[projectSymbol].onCurrentDocumentChange((originalDoc) => { fn(DocumentModel.create(originalDoc)!); }); @@ -159,7 +166,7 @@ export default class Project { /** * 当前 project 的模拟器 ready 事件 */ - onSimulatorHostReady(fn: (host: SimulatorHost) => void) { + onSimulatorHostReady(fn: (host: IPublicApiSimulatorHost) => void) { const offFn = this[projectSymbol].onSimulatorReady((simulator: BuiltinSimulatorHost) => { this[simulatorHostSymbol] = simulator; fn(SimulatorHost.create(simulator)!); diff --git a/packages/shell/src/prop.ts b/packages/shell/src/prop.ts index b386d0593..8cb6c9cda 100644 --- a/packages/shell/src/prop.ts +++ b/packages/shell/src/prop.ts @@ -1,65 +1,69 @@ import { Prop as InnerProp } from '@alilc/lowcode-designer'; -import { CompositeValue, TransformStage } from '@alilc/lowcode-types'; +import { CompositeValue, TransformStage, IPublicModelProp, IPublicModelNode } from '@alilc/lowcode-types'; import { propSymbol } from './symbols'; import Node from './node'; -export default class Prop { +export default class Prop implements IPublicModelProp { private readonly [propSymbol]: InnerProp; constructor(prop: InnerProp) { this[propSymbol] = prop; } - static create(prop: InnerProp | undefined | null) { - if (!prop) return null; + static create(prop: InnerProp | undefined | null): IPublicModelProp | null { + if (!prop) { + return null; + } return new Prop(prop); } /** * id */ - get id() { + get id(): string { return this[propSymbol].id; } /** * key 值 */ - get key() { + get key(): string | number | undefined { return this[propSymbol].key; } /** * 返回当前 prop 的路径 */ - get path() { + get path(): any[] { return this[propSymbol].path; } /** * 返回所属的节点实例 */ - get node(): Node | null { + get node(): IPublicModelNode | null { return Node.create(this[propSymbol].getNode()); } /** * return the slot node (only if the current prop represents a slot) */ - get slotNode(): Node | null { + get slotNode(): IPublicModelNode | null { return Node.create(this[propSymbol].slotNode); } /** * judge if it is a prop or not */ - get isProp() { return true; } + get isProp(): boolean { + return true; + } /** * 设置值 * @param val */ - setValue(val: CompositeValue) { + setValue(val: CompositeValue): void { this[propSymbol].setValue(val); } @@ -67,14 +71,14 @@ export default class Prop { * 获取值 * @returns */ - getValue() { + getValue(): any { return this[propSymbol].getValue(); } /** * 移除值 */ - remove() { + remove(): void { this[propSymbol].remove(); } diff --git a/packages/shell/src/props.ts b/packages/shell/src/props.ts index 293fa60df..10bcfaba2 100644 --- a/packages/shell/src/props.ts +++ b/packages/shell/src/props.ts @@ -1,39 +1,41 @@ import { Props as InnerProps, getConvertedExtraKey } from '@alilc/lowcode-designer'; -import { CompositeValue, TransformStage } from '@alilc/lowcode-types'; +import { CompositeValue, IPublicModelProps, IPublicModelNode, IPublicModelProp } from '@alilc/lowcode-types'; import { propsSymbol } from './symbols'; import Node from './node'; import Prop from './prop'; -export default class Props { +export default class Props implements IPublicModelProps { private readonly [propsSymbol]: InnerProps; constructor(props: InnerProps) { this[propsSymbol] = props; } - static create(props: InnerProps | undefined | null) { - if (!props) return null; + static create(props: InnerProps | undefined | null): IPublicModelProps | null { + if (!props) { + return null; + } return new Props(props); } /** * id */ - get id() { + get id(): string { return this[propsSymbol].id; } /** * 返回当前 props 的路径 */ - get path() { + get path(): any[] { return this[propsSymbol].path; } /** * 返回所属的 node 实例 */ - get node(): Node | null { + get node(): IPublicModelNode | null { return Node.create(this[propsSymbol].getNode()); } @@ -42,7 +44,7 @@ export default class Props { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getProp(path: string): Prop | null { + getProp(path: string): IPublicModelProp | null { return Prop.create(this[propsSymbol].getProp(path)); } @@ -51,7 +53,7 @@ export default class Props { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getPropValue(path: string) { + getPropValue(path: string): any { return this.getProp(path)?.getValue(); } @@ -61,7 +63,7 @@ export default class Props { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getExtraProp(path: string): Prop | null { + getExtraProp(path: string): IPublicModelProp | null { return Prop.create(this[propsSymbol].getProp(getConvertedExtraKey(path))); } @@ -71,7 +73,7 @@ export default class Props { * @param path 属性路径，支持 a / a.b / a.0 等格式 * @returns */ - getExtraPropValue(path: string) { + getExtraPropValue(path: string): any { return this.getExtraProp(path)?.getValue(); } @@ -81,7 +83,7 @@ export default class Props { * @param value 值 * @returns */ - setPropValue(path: string, value: CompositeValue) { + setPropValue(path: string, value: CompositeValue): void { return this.getProp(path)?.setValue(value); } @@ -91,7 +93,7 @@ export default class Props { * @param value 值 * @returns */ - setExtraPropValue(path: string, value: CompositeValue) { + setExtraPropValue(path: string, value: CompositeValue): void { return this.getExtraProp(path)?.setValue(value); } @@ -100,7 +102,7 @@ export default class Props { * @param key * @returns */ - has(key: string) { + has(key: string): boolean { return this[propsSymbol].has(key); } @@ -110,7 +112,7 @@ export default class Props { * @param key * @returns */ - add(value: CompositeValue, key?: string | number | undefined) { + add(value: CompositeValue, key?: string | number | undefined): any { return this[propsSymbol].add(value, key); } } \ No newline at end of file diff --git a/packages/shell/src/selection.ts b/packages/shell/src/selection.ts index b5b9e7a16..43d2c3ccc 100644 --- a/packages/shell/src/selection.ts +++ b/packages/shell/src/selection.ts @@ -4,14 +4,13 @@ import { Selection as InnerSelection, } from '@alilc/lowcode-designer'; import Node from './node'; -import { documentSymbol, selectionSymbol } from './symbols'; +import { selectionSymbol } from './symbols'; +import { IPublicModelSelection, IPublicModelNode } from '@alilc/lowcode-types'; -export default class Selection { - private readonly [documentSymbol]: InnerDocumentModel; +export default class Selection implements IPublicModelSelection { private readonly [selectionSymbol]: InnerSelection; constructor(document: InnerDocumentModel) { - this[documentSymbol] = document; this[selectionSymbol] = document.selection; } @@ -25,15 +24,16 @@ export default class Selection { /** * return selected Node instance */ - get node(): Node { - return this.getNodes()[0]; + get node(): IPublicModelNode | null { + const nodes = this.getNodes(); + return nodes && nodes.length > 0 ? nodes[0] : null; } /** * 选中指定节点（覆盖方式） * @param id */ - select(id: string) { + select(id: string): void { this[selectionSymbol].select(id); } @@ -41,7 +41,7 @@ export default class Selection { * 批量选中指定节点们 * @param ids */ - selectAll(ids: string[]) { + selectAll(ids: string[]): void { this[selectionSymbol].selectAll(ids); } @@ -49,14 +49,14 @@ export default class Selection { * 移除选中的指定节点 * @param id */ - remove(id: string) { + remove(id: string): void { this[selectionSymbol].remove(id); } /** * 清除所有选中节点 */ - clear() { + clear(): void { this[selectionSymbol].clear(); } @@ -65,7 +65,7 @@ export default class Selection { * @param id * @returns */ - has(id: string) { + has(id: string): boolean { return this[selectionSymbol].has(id); } @@ -73,7 +73,7 @@ export default class Selection { * 选中指定节点（增量方式） * @param id */ - add(id: string) { + add(id: string): void { this[selectionSymbol].add(id); } @@ -81,7 +81,7 @@ export default class Selection { * 获取选中的节点实例 * @returns */ - getNodes(): Node[] { + getNodes(): Array { return this[selectionSymbol].getNodes().map((node: InnerNode) => Node.create(node)); } @@ -92,7 +92,7 @@ export default class Selection { * getTopNodes() will return [A, B], subA will be removed * @returns */ - getTopNodes(): Node[] { + getTopNodes(): Array { return this[selectionSymbol].getTopNodes().map((node: InnerNode) => Node.create(node)); } } diff --git a/packages/shell/src/setters.ts b/packages/shell/src/setters.ts index 000213883..90290f457 100644 --- a/packages/shell/src/setters.ts +++ b/packages/shell/src/setters.ts @@ -1,13 +1,13 @@ -import { getSetter, registerSetter, getSettersMap, RegisteredSetter } from '@alilc/lowcode-editor-core'; -import { CustomView } from '@alilc/lowcode-types'; +import { getSetter, registerSetter, getSettersMap } from '@alilc/lowcode-editor-core'; +import { CustomView, IPublicApiSetters, RegisteredSetter } from '@alilc/lowcode-types'; -export default class Setters { +export default class Setters implements IPublicApiSetters { /** * 获取指定 setter * @param type * @returns */ - getSetter(type: string) { + getSetter(type: string): RegisteredSetter | null { return getSetter(type); } @@ -15,7 +15,9 @@ export default class Setters { * 获取已注册的所有 settersMap * @returns */ - getSettersMap() { + getSettersMap(): Map { return getSettersMap(); } diff --git a/packages/shell/src/setting-prop-entry.ts b/packages/shell/src/setting-prop-entry.ts index 2c2bb6ce6..ad07aa963 100644 --- a/packages/shell/src/setting-prop-entry.ts +++ b/packages/shell/src/setting-prop-entry.ts @@ -1,106 +1,118 @@ -import { SettingField, ISetValueOptions } from '@alilc/lowcode-designer'; -import { CompositeValue, FieldConfig, CustomView, isCustomView } from '@alilc/lowcode-types'; +import { SettingField, SettingEntry } from '@alilc/lowcode-designer'; +import { + CompositeValue, + FieldConfig, + CustomView, + IPublicModelSettingPropEntry, + SetterType, + FieldExtraProps, + IPublicModelSettingTopEntry, + IPublicModelNode, + IPublicModelComponentMeta, + ISetValueOptions, +} from '@alilc/lowcode-types'; import { settingPropEntrySymbol } from './symbols'; import Node from './node'; import SettingTopEntry from './setting-top-entry'; import ComponentMeta from './component-meta'; +import { isCustomView } from '@alilc/lowcode-utils'; -export default class SettingPropEntry { +export default class SettingPropEntry implements IPublicModelSettingPropEntry { private readonly [settingPropEntrySymbol]: SettingField; constructor(prop: SettingField) { this[settingPropEntrySymbol] = prop; } - static create(prop: SettingField) { + static create(prop: SettingField): IPublicModelSettingPropEntry { return new SettingPropEntry(prop); } /** * 获取设置属性的 isGroup */ - get isGroup() { + get isGroup(): boolean { return this[settingPropEntrySymbol].isGroup; } /** * 获取设置属性的 id */ - get id() { + get id(): string { return this[settingPropEntrySymbol].id; } /** * 获取设置属性的 name */ - get name() { + get name(): string | number { return this[settingPropEntrySymbol].name; } /** * 获取设置属性的 key */ - get key() { + get key(): string | number { return this[settingPropEntrySymbol].getKey(); } /** * 获取设置属性的 path */ - get path() { + get path(): any[] { return this[settingPropEntrySymbol].path; } /** * 获取设置属性的 title */ - get title() { + get title(): any { return this[settingPropEntrySymbol].title; } /** * 获取设置属性的 setter */ - get setter() { + get setter(): SetterType | null { return this[settingPropEntrySymbol].setter; } /** * 获取设置属性的 expanded */ - get expanded() { + get expanded(): boolean { return this[settingPropEntrySymbol].expanded; } /** * 获取设置属性的 extraProps */ - get extraProps() { + get extraProps(): FieldExtraProps { return this[settingPropEntrySymbol].extraProps; } - get props() { + get props(): IPublicModelSettingTopEntry { return SettingTopEntry.create(this[settingPropEntrySymbol].props); } /** * 获取设置属性对应的节点实例 */ - get node(): Node | null { + get node(): IPublicModelNode | null { return Node.create(this[settingPropEntrySymbol].getNode()); } /** * 获取设置属性的父设置属性 */ - get parent(): SettingPropEntry { + get parent(): IPublicModelSettingPropEntry { return SettingPropEntry.create(this[settingPropEntrySymbol].parent as any); } /** * 获取顶级设置属性 */ - get top(): SettingTopEntry { + get top(): IPublicModelSettingTopEntry { return SettingTopEntry.create(this[settingPropEntrySymbol].top); } @@ -114,14 +126,14 @@ export default class SettingPropEntry { /** * componentMeta */ - get componentMeta(): ComponentMeta | null { + get componentMeta(): IPublicModelComponentMeta | null { return ComponentMeta.create(this[settingPropEntrySymbol].componentMeta); } /** * 获取设置属性的 items */ - get items(): Array { + get items(): Array { return this[settingPropEntrySymbol].items?.map((item) => { if (isCustomView(item)) { return item; @@ -134,7 +146,7 @@ export default class SettingPropEntry { * 设置 key 值 * @param key */ - setKey(key: string | number) { + setKey(key: string | number): void { this[settingPropEntrySymbol].setKey(key); } @@ -156,7 +168,7 @@ export default class SettingPropEntry { * 设置值 * @param val 值 */ - setValue(val: CompositeValue, extraOptions?: ISetValueOptions) { + setValue(val: CompositeValue, extraOptions?: ISetValueOptions): void { this[settingPropEntrySymbol].setValue(val, false, false, extraOptions); } @@ -165,7 +177,7 @@ export default class SettingPropEntry { * @param propName 子属性名 * @param value 值 */ - setPropValue(propName: string | number, value: any) { + setPropValue(propName: string | number, value: any): void { this[settingPropEntrySymbol].setPropValue(propName, value); } @@ -173,7 +185,7 @@ export default class SettingPropEntry { * 清空指定属性值 * @param propName */ - clearPropValue(propName: string | number) { + clearPropValue(propName: string | number): void { this[settingPropEntrySymbol].clearPropValue(propName); } @@ -181,7 +193,7 @@ export default class SettingPropEntry { * 获取配置的默认值 * @returns */ - getDefaultValue() { + getDefaultValue(): any { return this[settingPropEntrySymbol].getDefaultValue(); } @@ -189,7 +201,7 @@ export default class SettingPropEntry { * 获取值 * @returns */ - getValue() { + getValue(): any { return this[settingPropEntrySymbol].getValue(); } @@ -198,21 +210,21 @@ export default class SettingPropEntry { * @param propName 子属性名 * @returns */ - getPropValue(propName: string | number) { + getPropValue(propName: string | number): any { return this[settingPropEntrySymbol].getPropValue(propName); } /** * 获取顶层附属属性值 */ - getExtraPropValue(propName: string) { + getExtraPropValue(propName: string): any { return this[settingPropEntrySymbol].getExtraPropValue(propName); } /** * 设置顶层附属属性值 */ - setExtraPropValue(propName: string, value: any) { + setExtraPropValue(propName: string, value: any): void { this[settingPropEntrySymbol].setExtraPropValue(propName, value); } @@ -220,7 +232,7 @@ export default class SettingPropEntry { * 获取设置属性集 * @returns */ - getProps() { + getProps(): IPublicModelSettingTopEntry { return SettingTopEntry.create(this[settingPropEntrySymbol].getProps() as SettingEntry) as any; } @@ -228,7 +240,7 @@ export default class SettingPropEntry { * 是否绑定了变量 * @returns */ - isUseVariable() { + isUseVariable(): boolean { return this[settingPropEntrySymbol].isUseVariable(); } @@ -236,7 +248,7 @@ export default class SettingPropEntry { * 设置绑定变量 * @param flag */ - setUseVariable(flag: boolean) { + setUseVariable(flag: boolean): void { this[settingPropEntrySymbol].setUseVariable(flag); } @@ -245,7 +257,7 @@ export default class SettingPropEntry { * @param config * @returns */ - createField(config: FieldConfig) { + createField(config: FieldConfig): IPublicModelSettingPropEntry { return SettingPropEntry.create(this[settingPropEntrySymbol].createField(config)); } @@ -253,21 +265,21 @@ export default class SettingPropEntry { * 获取值，当为变量时，返回 mock * @returns */ - getMockOrValue() { + getMockOrValue(): any { return this[settingPropEntrySymbol].getMockOrValue(); } /** * 销毁当前 field 实例 */ - purge() { + purge(): void { this[settingPropEntrySymbol].purge(); } /** * 移除当前 field 实例 */ - remove() { + remove(): void { this[settingPropEntrySymbol].remove(); } @@ -276,7 +288,7 @@ export default class SettingPropEntry { * @param action * @returns */ - onEffect(action: () => void) { + onEffect(action: () => void): () => void { return this[settingPropEntrySymbol].onEffect(action); } diff --git a/packages/shell/src/setting-top-entry.ts b/packages/shell/src/setting-top-entry.ts index 6f5d888d4..d7693799c 100644 --- a/packages/shell/src/setting-top-entry.ts +++ b/packages/shell/src/setting-top-entry.ts @@ -2,22 +2,23 @@ import { SettingEntry } from '@alilc/lowcode-designer'; import { settingTopEntrySymbol } from './symbols'; import Node from './node'; import SettingPropEntry from './setting-prop-entry'; +import { IPublicModelSettingTopEntry, IPublicModelNode, IPublicModelSettingPropEntry } from '@alilc/lowcode-types'; -export default class SettingTopEntry { +export default class SettingTopEntry implements IPublicModelSettingTopEntry { private readonly [settingTopEntrySymbol]: SettingEntry; constructor(prop: SettingEntry) { this[settingTopEntrySymbol] = prop; } - static create(prop: SettingEntry) { + static create(prop: SettingEntry): IPublicModelSettingTopEntry { return new SettingTopEntry(prop); } /** * 返回所属的节点实例 */ - get node(): Node | null { + get node(): IPublicModelNode | null { return Node.create(this[settingTopEntrySymbol].getNode()); } @@ -26,7 +27,7 @@ export default class SettingTopEntry { * @param propName * @returns */ - get(propName: string | number) { + get(propName: string | number): IPublicModelSettingPropEntry { return SettingPropEntry.create(this[settingTopEntrySymbol].get(propName) as any); } @@ -42,7 +43,7 @@ export default class SettingTopEntry { * @param propName * @returns */ - getPropValue(propName: string | number) { + getPropValue(propName: string | number): any { return this[settingTopEntrySymbol].getPropValue(propName); } @@ -51,7 +52,7 @@ export default class SettingTopEntry { * @param propName * @param value */ - setPropValue(propName: string | number, value: any) { + setPropValue(propName: string | number, value: any): void { this[settingTopEntrySymbol].setPropValue(propName, value); } } \ No newline at end of file diff --git a/packages/shell/src/simulator-host.ts b/packages/shell/src/simulator-host.ts index 077564550..f9ebc36b5 100644 --- a/packages/shell/src/simulator-host.ts +++ b/packages/shell/src/simulator-host.ts @@ -2,16 +2,17 @@ import { BuiltinSimulatorHost, } from '@alilc/lowcode-designer'; import { simulatorHostSymbol, nodeSymbol } from './symbols'; +import { IPublicApiSimulatorHost, IPublicModelNode } from '@alilc/lowcode-types'; import type Node from './node'; -export default class SimulatorHost { +export default class SimulatorHost implements IPublicApiSimulatorHost { private readonly [simulatorHostSymbol]: BuiltinSimulatorHost; constructor(simulator: BuiltinSimulatorHost) { this[simulatorHostSymbol] = simulator; } - static create(host: BuiltinSimulatorHost) { + static create(host: BuiltinSimulatorHost): IPublicApiSimulatorHost | null { if (!host) return null; return new SimulatorHost(host); } @@ -19,18 +20,18 @@ export default class SimulatorHost { /** * 获取 contentWindow */ - get contentWindow() { + get contentWindow(): Window | undefined { return this[simulatorHostSymbol].contentWindow; } /** * 获取 contentDocument */ - get contentDocument() { + get contentDocument(): Document | undefined { return this[simulatorHostSymbol].contentDocument; } - get renderer() { + get renderer(): any { return this[simulatorHostSymbol].renderer; } @@ -39,7 +40,7 @@ export default class SimulatorHost { * @param key * @param value */ - set(key: string, value: any) { + set(key: string, value: any): void { this[simulatorHostSymbol].set(key, value); } @@ -48,7 +49,7 @@ export default class SimulatorHost { * @param key * @returns */ - get(key: string) { + get(key: string): any { return this[simulatorHostSymbol].get(key); } @@ -56,14 +57,14 @@ export default class SimulatorHost { * scroll to specific node * @param node */ - scrollToNode(node: Node) { - this[simulatorHostSymbol].scrollToNode(node[nodeSymbol]); + scrollToNode(node: IPublicModelNode): void { + this[simulatorHostSymbol].scrollToNode((node as any)[nodeSymbol]); } /** * 刷新渲染画布 */ - rerender() { + rerender(): void { this[simulatorHostSymbol].rerender(); } } diff --git a/packages/shell/src/skeleton.ts b/packages/shell/src/skeleton.ts index 2c8b178d5..183ffde5a 100644 --- a/packages/shell/src/skeleton.ts +++ b/packages/shell/src/skeleton.ts @@ -1,12 +1,11 @@ import { Skeleton as InnerSkeleton, - IWidgetBaseConfig, - IWidgetConfigArea, SkeletonEvents, } from '@alilc/lowcode-editor-skeleton'; import { skeletonSymbol } from './symbols'; +import { IPublicApiSkeleton, IWidgetBaseConfig, IWidgetConfigArea } from '@alilc/lowcode-types'; -export default class Skeleton { +export default class Skeleton implements IPublicApiSkeleton { private readonly [skeletonSymbol]: InnerSkeleton; constructor(skeleton: InnerSkeleton) { @@ -28,11 +27,13 @@ export default class Skeleton { * @param config * @returns */ - remove(config: IWidgetBaseConfig) { + remove(config: IWidgetBaseConfig): number | undefined { const { area, name } = config; const skeleton = this[skeletonSymbol]; - if (!normalizeArea(area)) return; - skeleton[normalizeArea(area)!].container.remove(name); + if (!normalizeArea(area)) { + return; + } + skeleton[normalizeArea(area)!].container?.remove(name); } /** diff --git a/packages/types/src/deprecated/index.ts b/packages/types/src/deprecated/index.ts new file mode 100644 index 000000000..7e65173c0 --- /dev/null +++ b/packages/types/src/deprecated/index.ts @@ -0,0 +1,18 @@ +export * from './isActionContentObject'; +export * from './isCustomView'; +export * from './isDOMText'; +export * from './isDynamicSetter'; +export * from './isI18nData'; +export * from './isJSBlock'; +export * from './isJSExpression'; +export * from './isJSFunction'; +export * from './isJSSlot'; +export * from './isLowCodeComponentType'; +export * from './isNodeSchema'; +export * from './isPlainObject'; +export * from './isProCodeComponentType'; +export * from './isProjectSchema'; +export * from './isReactClass'; +export * from './isReactComponent'; +export * from './isSetterConfig'; +export * from './isTitleConfig'; \ No newline at end of file diff --git a/packages/types/src/deprecated/isActionContentObject.ts b/packages/types/src/deprecated/isActionContentObject.ts new file mode 100644 index 000000000..f56ec1128 --- /dev/null +++ b/packages/types/src/deprecated/isActionContentObject.ts @@ -0,0 +1,8 @@ +import { ActionContentObject } from '../metadata'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isActionContentObject(obj: any): obj is ActionContentObject { + return obj && typeof obj === 'object'; +} diff --git a/packages/types/src/deprecated/isCustomView.ts b/packages/types/src/deprecated/isCustomView.ts new file mode 100644 index 000000000..84ac84c93 --- /dev/null +++ b/packages/types/src/deprecated/isCustomView.ts @@ -0,0 +1,10 @@ +import { isValidElement } from 'react'; +import { isReactComponent } from './isReactComponent'; +import { CustomView } from '../setter-config'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isCustomView(obj: any): obj is CustomView { + return obj && (isValidElement(obj) || isReactComponent(obj)); +} diff --git a/packages/types/src/deprecated/isDOMText.ts b/packages/types/src/deprecated/isDOMText.ts new file mode 100644 index 000000000..d590d5aa3 --- /dev/null +++ b/packages/types/src/deprecated/isDOMText.ts @@ -0,0 +1,8 @@ +import { DOMText } from '../schema'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isDOMText(data: any): data is DOMText { + return typeof data === 'string'; +} diff --git a/packages/types/src/deprecated/isDynamicSetter.ts b/packages/types/src/deprecated/isDynamicSetter.ts new file mode 100644 index 000000000..7bfebd9a3 --- /dev/null +++ b/packages/types/src/deprecated/isDynamicSetter.ts @@ -0,0 +1,9 @@ +import { isReactClass } from './isReactClass'; +import { DynamicSetter } from '../setter-config'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isDynamicSetter(obj: any): obj is DynamicSetter { + return obj && typeof obj === 'function' && !isReactClass(obj); +} diff --git a/packages/types/src/deprecated/isI18nData.ts b/packages/types/src/deprecated/isI18nData.ts new file mode 100644 index 000000000..1194b338a --- /dev/null +++ b/packages/types/src/deprecated/isI18nData.ts @@ -0,0 +1,8 @@ +import { I18nData } from '../i18n'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isI18nData(obj: any): obj is I18nData { + return obj && obj.type === 'i18n'; +} diff --git a/packages/types/src/deprecated/isJSBlock.ts b/packages/types/src/deprecated/isJSBlock.ts new file mode 100644 index 000000000..28878eb6a --- /dev/null +++ b/packages/types/src/deprecated/isJSBlock.ts @@ -0,0 +1,8 @@ +import { JSBlock } from '../value-type'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isJSBlock(data: any): data is JSBlock { + return data && data.type === 'JSBlock'; +} diff --git a/packages/types/src/deprecated/isJSExpression.ts b/packages/types/src/deprecated/isJSExpression.ts new file mode 100644 index 000000000..1e58c6538 --- /dev/null +++ b/packages/types/src/deprecated/isJSExpression.ts @@ -0,0 +1,8 @@ +import { JSExpression } from '../value-type'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isJSExpression(data: any): data is JSExpression { + return data && data.type === 'JSExpression' && data.extType !== 'function'; +} diff --git a/packages/types/src/deprecated/isJSFunction.ts b/packages/types/src/deprecated/isJSFunction.ts new file mode 100644 index 000000000..8a98a8c5c --- /dev/null +++ b/packages/types/src/deprecated/isJSFunction.ts @@ -0,0 +1,8 @@ +import { JSFunction } from '../value-type'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isJSFunction(x: any): x is JSFunction { + return typeof x === 'object' && x && x.type === 'JSFunction'; +} diff --git a/packages/types/src/deprecated/isJSSlot.ts b/packages/types/src/deprecated/isJSSlot.ts new file mode 100644 index 000000000..e2096034a --- /dev/null +++ b/packages/types/src/deprecated/isJSSlot.ts @@ -0,0 +1,8 @@ +import { JSSlot } from '../value-type'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isJSSlot(data: any): data is JSSlot { + return data && data.type === 'JSSlot'; +} diff --git a/packages/types/src/deprecated/isLowCodeComponentType.ts b/packages/types/src/deprecated/isLowCodeComponentType.ts new file mode 100644 index 000000000..1ba2689ca --- /dev/null +++ b/packages/types/src/deprecated/isLowCodeComponentType.ts @@ -0,0 +1,9 @@ +import { isProCodeComponentType } from './isProCodeComponentType'; +import { ComponentMap, LowCodeComponentType } from '../npm'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isLowCodeComponentType(desc: ComponentMap): desc is LowCodeComponentType { + return !isProCodeComponentType(desc); +} diff --git a/packages/types/src/deprecated/isNodeSchema.ts b/packages/types/src/deprecated/isNodeSchema.ts new file mode 100644 index 000000000..b3daf4e46 --- /dev/null +++ b/packages/types/src/deprecated/isNodeSchema.ts @@ -0,0 +1,8 @@ +import { NodeSchema } from '../schema'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isNodeSchema(data: any): data is NodeSchema { + return data && data.componentName; +} diff --git a/packages/types/src/deprecated/isPlainObject.ts b/packages/types/src/deprecated/isPlainObject.ts new file mode 100644 index 000000000..549f49736 --- /dev/null +++ b/packages/types/src/deprecated/isPlainObject.ts @@ -0,0 +1,10 @@ +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isPlainObject(value: any): value is Record { + if (typeof value !== 'object') { + return false; + } + const proto = Object.getPrototypeOf(value); + return proto === Object.prototype || proto === null || Object.getPrototypeOf(proto) === null; +} diff --git a/packages/types/src/deprecated/isProCodeComponentType.ts b/packages/types/src/deprecated/isProCodeComponentType.ts new file mode 100644 index 000000000..071a9dc7e --- /dev/null +++ b/packages/types/src/deprecated/isProCodeComponentType.ts @@ -0,0 +1,8 @@ +import { ComponentMap, ProCodeComponentType } from '../npm'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isProCodeComponentType(desc: ComponentMap): desc is ProCodeComponentType { + return 'package' in desc; +} diff --git a/packages/types/src/deprecated/isProjectSchema.ts b/packages/types/src/deprecated/isProjectSchema.ts new file mode 100644 index 000000000..92e65041c --- /dev/null +++ b/packages/types/src/deprecated/isProjectSchema.ts @@ -0,0 +1,8 @@ +import { ProjectSchema } from '../schema'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isProjectSchema(data: any): data is ProjectSchema { + return data && data.componentsTree; +} diff --git a/packages/types/src/deprecated/isReactClass.ts b/packages/types/src/deprecated/isReactClass.ts new file mode 100644 index 000000000..846c522d7 --- /dev/null +++ b/packages/types/src/deprecated/isReactClass.ts @@ -0,0 +1,8 @@ +import { ComponentClass, Component } from 'react'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isReactClass(obj: any): obj is ComponentClass { + return obj && obj.prototype && (obj.prototype.isReactComponent || obj.prototype instanceof Component); +} diff --git a/packages/types/src/deprecated/isReactComponent.ts b/packages/types/src/deprecated/isReactComponent.ts new file mode 100644 index 000000000..1ed04427f --- /dev/null +++ b/packages/types/src/deprecated/isReactComponent.ts @@ -0,0 +1,9 @@ +import { ComponentType } from 'react'; +import { isReactClass } from './isReactClass'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isReactComponent(obj: any): obj is ComponentType { + return obj && (isReactClass(obj) || typeof obj === 'function'); +} diff --git a/packages/types/src/deprecated/isSetterConfig.ts b/packages/types/src/deprecated/isSetterConfig.ts new file mode 100644 index 000000000..38121c355 --- /dev/null +++ b/packages/types/src/deprecated/isSetterConfig.ts @@ -0,0 +1,9 @@ +import { SetterConfig } from '../setter-config'; +import { isCustomView } from './isCustomView'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isSetterConfig(obj: any): obj is SetterConfig { + return obj && typeof obj === 'object' && 'componentName' in obj && !isCustomView(obj); +} diff --git a/packages/types/src/deprecated/isTitleConfig.ts b/packages/types/src/deprecated/isTitleConfig.ts new file mode 100644 index 000000000..65f1403fc --- /dev/null +++ b/packages/types/src/deprecated/isTitleConfig.ts @@ -0,0 +1,10 @@ +import { isI18nData } from './isI18nData'; +import { isPlainObject } from './isPlainObject'; +import { TitleConfig } from '../title'; + +/** + * @deprecated use same function from '@alilc/lowcode-utils' instead + */ +export function isTitleConfig(obj: any): obj is TitleConfig { + return isPlainObject(obj) && !isI18nData(obj); +} diff --git a/packages/types/src/designer.ts b/packages/types/src/designer.ts new file mode 100644 index 000000000..0c6981578 --- /dev/null +++ b/packages/types/src/designer.ts @@ -0,0 +1,23 @@ +import { IPublicModelNode } from './shell'; + +export enum PROP_VALUE_CHANGED_TYPE { + /** + * normal set value + */ + SET_VALUE = 'SET_VALUE', + /** + * value changed caused by sub-prop value change + */ + SUB_VALUE_CHANGE = 'SUB_VALUE_CHANGE', +} + +export interface ISetValueOptions { + disableMutator?: boolean; + type?: PROP_VALUE_CHANGED_TYPE; + fromSetHotValue?: boolean; +} + +export interface IPublicOnChangeOptions { + type: string; + node: IPublicModelNode; +} diff --git a/packages/types/src/dragon.ts b/packages/types/src/dragon.ts new file mode 100644 index 000000000..5047b07c9 --- /dev/null +++ b/packages/types/src/dragon.ts @@ -0,0 +1,29 @@ +import { NodeSchema } from './schema'; +import { IPublicModelNode } from './shell'; + +export interface DragAnyObject { + type: string; + [key: string]: any; +} + +export interface DragNodeDataObject { + type: DragObjectType.NodeData; + data: NodeSchema | NodeSchema[]; + thumbnail?: string; + description?: string; + [extra: string]: any; +} + +export type DragObject = DragNodeObject | DragNodeDataObject | DragAnyObject; + +// eslint-disable-next-line no-shadow +export enum DragObjectType { + // eslint-disable-next-line no-shadow + Node = 'node', + NodeData = 'nodedata', +} + +export interface DragNodeObject { + type: DragObjectType.Node; + nodes: (Node | IPublicModelNode)[]; +} \ No newline at end of file diff --git a/packages/types/src/editor-skeleton.ts b/packages/types/src/editor-skeleton.ts new file mode 100644 index 000000000..e339c4c8a --- /dev/null +++ b/packages/types/src/editor-skeleton.ts @@ -0,0 +1,27 @@ +/** + * 所有可能的停靠位置 + */ + export type IWidgetConfigArea = + | 'leftArea' | 'left' | 'rightArea' + | 'right' | 'topArea' | 'top' + | 'toolbar' | 'mainArea' | 'main' + | 'center' | 'centerArea' | 'bottomArea' + | 'bottom' | 'leftFixedArea' + | 'leftFloatArea' | 'stages'; + +export interface IWidgetBaseConfig { + type: string; + name: string; + /** + * 停靠位置： + * - 当 type 为 'Panel' 时自动为 'leftFloatArea'； + * - 当 type 为 'Widget' 时自动为 'mainArea'； + * - 其他时候自动为 'leftArea'； + */ + area?: IWidgetConfigArea; + props?: Record; + content?: any; + contentProps?: Record; + // index?: number; + [extra: string]: any; +} diff --git a/packages/types/src/editor.ts b/packages/types/src/editor.ts index a11c7eaf7..cf5d3ae48 100644 --- a/packages/types/src/editor.ts +++ b/packages/types/src/editor.ts @@ -3,6 +3,8 @@ import StrictEventEmitter from 'strict-event-emitter-types'; import { ReactNode, ComponentType } from 'react'; import { NpmInfo } from './npm'; import * as GlobalEvent from './event'; +import { CustomView } from './setter-config'; +import { TitleContent } from './title'; export type KeyType = (new (...args: any[]) => any) | symbol | string; export type ClassType = new (...args: any[]) => any; @@ -197,3 +199,22 @@ export interface PluginStatus { export interface PluginStatusSet { [key: string]: PluginStatus; } + +export type HotkeyCallback = (e: KeyboardEvent, combo?: string) => any | false; + +export interface RegisteredSetter { + component: CustomView; + defaultProps?: object; + title?: TitleContent; + /** + * for MixedSetter to check this setter if available + */ + condition?: (field: any) => boolean; + /** + * for MixedSetter to manual change to this setter + */ + initialValue?: any | ((field: any) => any); + recommend?: boolean; + // 标识是否为动态 setter，默认为 true + isDynamic?: boolean; +} \ No newline at end of file diff --git a/packages/types/src/i18n.ts b/packages/types/src/i18n.ts index 44f8ef855..adcc72438 100644 --- a/packages/types/src/i18n.ts +++ b/packages/types/src/i18n.ts @@ -6,11 +6,6 @@ export interface I18nData { [key: string]: any; } -// type checks -export function isI18nData(obj: any): obj is I18nData { - return obj && obj.type === 'i18n'; -} - export interface I18nMap { [lang: string]: { [key: string]: string }; } diff --git a/packages/types/src/index.ts b/packages/types/src/index.ts index 9b540cc5f..708c34326 100644 --- a/packages/types/src/index.ts +++ b/packages/types/src/index.ts @@ -22,3 +22,10 @@ export * from './assets'; export * as GlobalEvent from './event'; export * from './disposable'; export * from './start-transaction'; +export * from './props-transducer'; +export * from './editor-skeleton'; +export * from './designer'; +export * from './dragon'; +export * from './shell'; +// TODO: remove this in future versions +export * from './deprecated'; diff --git a/packages/types/src/metadata.ts b/packages/types/src/metadata.ts index dd93aea00..394dd2909 100644 --- a/packages/types/src/metadata.ts +++ b/packages/types/src/metadata.ts @@ -336,10 +336,6 @@ export interface ComponentAction { important?: boolean; } -export function isActionContentObject(obj: any): obj is ActionContentObject { - return obj && typeof obj === 'object'; -} - /** * 组件 meta 配置 */ @@ -473,3 +469,17 @@ export interface Callbacks { currentNode: any, ) => void; } + +export interface MetadataTransducer { + (prev: TransformedComponentMetadata): TransformedComponentMetadata; + /** + * 0 - 9 system + * 10 - 99 builtin-plugin + * 100 - app & plugin + */ + level?: number; + /** + * use to replace TODO + */ + id?: string; +} \ No newline at end of file diff --git a/packages/types/src/npm.ts b/packages/types/src/npm.ts index 88449f435..f805158e5 100644 --- a/packages/types/src/npm.ts +++ b/packages/types/src/npm.ts @@ -1,3 +1,4 @@ + /** * npm 源引入完整描述对象 */ @@ -45,13 +46,4 @@ export interface LowCodeComponentType { export type ProCodeComponentType = NpmInfo; export type ComponentMap = ProCodeComponentType | LowCodeComponentType; - -export function isProCodeComponentType(desc: ComponentMap): desc is ProCodeComponentType { - return 'package' in desc; -} - -export function isLowCodeComponentType(desc: ComponentMap): desc is LowCodeComponentType { - return !isProCodeComponentType(desc); -} - export type ComponentsMap = ComponentMap[]; diff --git a/packages/types/src/props-transducer.ts b/packages/types/src/props-transducer.ts new file mode 100644 index 000000000..227247569 --- /dev/null +++ b/packages/types/src/props-transducer.ts @@ -0,0 +1,12 @@ +import { TransformStage } from './transform-stage'; +import { CompositeObject } from './value-type'; + +export type PropsReducerContext = { + stage: TransformStage; +}; + +export type PropsTransducer = ( + props: CompositeObject, + node: Node, + ctx?: PropsReducerContext, +) => CompositeObject; diff --git a/packages/types/src/schema.ts b/packages/types/src/schema.ts index 5d0fad444..e320d6b51 100644 --- a/packages/types/src/schema.ts +++ b/packages/types/src/schema.ts @@ -75,11 +75,6 @@ export type PropsList = Array<{ export type NodeData = NodeSchema | JSExpression | DOMText; export type NodeDataType = NodeData | NodeData[]; - -export function isDOMText(data: any): data is DOMText { - return typeof data === 'string'; -} - export type DOMText = string; /** @@ -217,12 +212,4 @@ export interface ProjectSchema { * 当前应用元数据信息 */ meta?: Record; -} - -export function isNodeSchema(data: any): data is NodeSchema { - return data && data.componentName; -} - -export function isProjectSchema(data: any): data is ProjectSchema { - return data && data.componentsTree; -} +} \ No newline at end of file diff --git a/packages/types/src/setter-config.ts b/packages/types/src/setter-config.ts index d579240ef..5138e3649 100644 --- a/packages/types/src/setter-config.ts +++ b/packages/types/src/setter-config.ts @@ -1,18 +1,9 @@ -import { ComponentClass, Component, ComponentType, ReactElement, isValidElement } from 'react'; +import { ComponentType, ReactElement } from 'react'; import { TitleContent } from './title'; import { SettingTarget } from './setting-target'; import { CompositeValue } from './value-type'; -function isReactClass(obj: any): obj is ComponentClass { - return obj && obj.prototype && (obj.prototype.isReactComponent || obj.prototype instanceof Component); -} - -function isReactComponent(obj: any): obj is ComponentType { - return obj && (isReactClass(obj) || typeof obj === 'function'); -} - export type CustomView = ReactElement | ComponentType; - export type DynamicProps = (target: SettingTarget) => Record; export type DynamicSetter = (target: SettingTarget) => string | SetterConfig | CustomView; @@ -63,21 +54,9 @@ export interface SetterConfig { * @todo 物料协议推进 */ valueType?: CompositeValue[]; - // 标识是否为动态setter，默认为true + // 标识是否为动态 setter，默认为 true isDynamic?: boolean; } // if *string* passed must be a registered Setter Name, future support blockSchema -export type SetterType = SetterConfig | SetterConfig[] | string | CustomView; - -export function isSetterConfig(obj: any): obj is SetterConfig { - return obj && typeof obj === 'object' && 'componentName' in obj && !isCustomView(obj); -} - -export function isCustomView(obj: any): obj is CustomView { - return obj && (isValidElement(obj) || isReactComponent(obj)); -} - -export function isDynamicSetter(obj: any): obj is DynamicSetter { - return obj && typeof obj === 'function' && !isReactClass(obj); -} +export type SetterType = SetterConfig | SetterConfig[] | string | CustomView; \ No newline at end of file diff --git a/packages/types/src/shell/api/common.ts b/packages/types/src/shell/api/common.ts new file mode 100644 index 000000000..0c59bbcad --- /dev/null +++ b/packages/types/src/shell/api/common.ts @@ -0,0 +1,50 @@ + +import { Component, ReactNode } from 'react'; +import { NodeSchema } from '../../schema'; +import { TransitionType } from '../../start-transaction'; + +export interface IPublicCommonUtils { + isNodeSchema(data: any): boolean; + + isFormEvent(e: KeyboardEvent | MouseEvent): boolean; + + compatibleLegaoSchema(props: any): any; + + getNodeSchemaById(schema: NodeSchema, nodeId: string): NodeSchema | undefined; + + getConvertedExtraKey(key: string): string; + + getOriginalExtraKey(key: string): string; + + executeTransaction(fn: () => void, type: TransitionType): void; + + createIntl(instance: string | object): { + intlNode(id: string, params?: object): ReactNode; + intl(id: string, params?: object): string; + getLocale(): string; + setLocale(locale: string): void; + }; +} +export interface IPublicCommonSkeletonCabin { + get Workbench(): Component; +} + +export interface IPublicCommonDesignerCabin { + /** + * 是否是 SettingField 实例 + * + * @param {*} obj + * @returns {obj is SettingField} + * @memberof DesignerCabin + */ + isSettingField(obj: any): boolean; +} + +export interface IPublicApiCommon { + + get utils(): IPublicCommonUtils; + + get designerCabin(): IPublicCommonDesignerCabin; + + get skeletonCabin(): IPublicCommonSkeletonCabin; +} diff --git a/packages/types/src/shell/api/event.ts b/packages/types/src/shell/api/event.ts new file mode 100644 index 000000000..c7f35ff58 --- /dev/null +++ b/packages/types/src/shell/api/event.ts @@ -0,0 +1,26 @@ + +export interface IPublicApiEvent { + + /** + * 监听事件 + * @param event 事件名称 + * @param listener 事件回调 + */ + on(event: string, listener: (...args: unknown[]) => void): void; + + + /** + * 取消监听事件 + * @param event 事件名称 + * @param listener 事件回调 + */ + off(event: string, listener: (...args: unknown[]) => void): void; + + /** + * 触发事件 + * @param event 事件名称 + * @param args 事件参数 + * @returns + */ + emit(event: string, ...args: unknown[]): void; +} diff --git a/packages/types/src/shell/api/hotkey.ts b/packages/types/src/shell/api/hotkey.ts new file mode 100644 index 000000000..983792f04 --- /dev/null +++ b/packages/types/src/shell/api/hotkey.ts @@ -0,0 +1,16 @@ +import { Disposable } from '../../disposable'; +import { HotkeyCallback } from '../../editor'; + + +export interface IPublicApiHotkey { + get callbacks(): any; + + /** + * 绑定快捷键 + * @param combos 快捷键，格式如：['command + s'] 、['ctrl + shift + s'] 等 + * @param callback 回调函数 + * @param action + * @returns + */ + bind(combos: string[] | string, callback: HotkeyCallback, action?: string): Disposable; +} diff --git a/packages/types/src/shell/api/index.ts b/packages/types/src/shell/api/index.ts new file mode 100644 index 000000000..9e5152b9e --- /dev/null +++ b/packages/types/src/shell/api/index.ts @@ -0,0 +1,8 @@ +export * from './common'; +export * from './event'; +export * from './hotkey'; +export * from './material'; +export * from './project'; +export * from './setters'; +export * from './simulator-host'; +export * from './skeleton'; \ No newline at end of file diff --git a/packages/types/src/shell/api/material.ts b/packages/types/src/shell/api/material.ts new file mode 100644 index 000000000..d46aa66bf --- /dev/null +++ b/packages/types/src/shell/api/material.ts @@ -0,0 +1,90 @@ +import { AssetsJson } from '../../assets'; +import { MetadataTransducer, ComponentAction } from '../../metadata'; +import { IPublicModelComponentMeta } from '../model/component-meta'; + + +export interface IPublicApiMaterial { + + /** + * 设置「资产包」结构 + * @param assets + * @returns + */ + setAssets(assets: AssetsJson): void; + + /** + * 获取「资产包」结构 + * @returns + */ + getAssets(): any; + + /** + * 加载增量的「资产包」结构，该增量包会与原有的合并 + * @param incrementalAssets + * @returns + */ + loadIncrementalAssets(incrementalAssets: AssetsJson): void; + + /** + * 注册物料元数据管道函数 + * @param transducer + * @param level + * @param id + */ + registerMetadataTransducer( + transducer: MetadataTransducer, + level?: number, + id?: string | undefined + ): void; + + /** + * 获取所有物料元数据管道函数 + * @returns + */ + getRegisteredMetadataTransducers(): MetadataTransducer[]; + + /** + * 获取指定名称的物料元数据 + * @param componentName + * @returns + */ + getComponentMeta(componentName: string): IPublicModelComponentMeta | null; + + /** + * test if the given object is a ComponentMeta instance or not + * @param obj + * @returns + */ + isComponentMeta(obj: any): boolean; + + /** + * 获取所有已注册的物料元数据 + * @returns + */ + getComponentMetasMap(): Map; + + /** + * 在设计器辅助层增加一个扩展 action + * @param action + */ + addBuiltinComponentAction(action: ComponentAction): void; + + /** + * 移除设计器辅助层的指定 action + * @param name + */ + removeBuiltinComponentAction(name: string): void; + + /** + * 修改已有的设计器辅助层的指定 action + * @param actionName + * @param handle + */ + modifyBuiltinComponentAction(actionName: string, handle: (action: ComponentAction) => void): void; + + /** + * 监听 assets 变化的事件 + * @param fn + */ + onChangeAssets(fn: () => void): void; +} diff --git a/packages/types/src/shell/api/project.ts b/packages/types/src/shell/api/project.ts new file mode 100644 index 000000000..398669c94 --- /dev/null +++ b/packages/types/src/shell/api/project.ts @@ -0,0 +1,115 @@ +import { RootSchema, ProjectSchema } from '../../schema'; +import { TransformStage } from '../../transform-stage'; +import { PropsTransducer } from '../../props-transducer'; +import { IPublicApiSimulatorHost } from './simulator-host'; +import { IPublicModelDocumentModel } from '../model'; + + +export interface IPublicApiProject { + /** + * 获取当前的 document + * @returns + */ + get currentDocument(): IPublicModelDocumentModel | null; + + /** + * 获取当前 project 下所有 documents + * @returns + */ + get documents(): IPublicModelDocumentModel[]; + + /** + * 获取模拟器的 host + */ + get simulatorHost(): IPublicApiSimulatorHost | null; + + /** + * 打开一个 document + * @param doc + * @returns + */ + openDocument(doc?: string | RootSchema | undefined): IPublicModelDocumentModel | null; + + /** + * 创建一个 document + * @param data + * @returns + */ + createDocument(data?: RootSchema): IPublicModelDocumentModel | null; + + + /** + * 删除一个 document + * @param doc + */ + removeDocument(doc: IPublicModelDocumentModel): void; + + /** + * 根据 fileName 获取 document + * @param fileName + * @returns + */ + getDocumentByFileName(fileName: string): IPublicModelDocumentModel | null; + + /** + * 根据 id 获取 document + * @param id + * @returns + */ + getDocumentById(id: string): IPublicModelDocumentModel | null; + + /** + * 导出 project + * @returns + */ + exportSchema(stage: TransformStage): ProjectSchema; + + /** + * 导入 project + * @param schema 待导入的 project 数据 + */ + importSchema(schema?: ProjectSchema): void; + + /** + * 获取当前的 document + * @returns + */ + getCurrentDocument(): IPublicModelDocumentModel | null; + + /** + * 增加一个属性的管道处理函数 + * @param transducer + * @param stage + */ + addPropsTransducer(transducer: PropsTransducer, stage: TransformStage): void; + + /** + * 绑定删除文档事件 + * @param fn + * @returns + */ + onRemoveDocument(fn: (data: { id: string }) => void): any; + + /** + * 当前 project 内的 document 变更事件 + */ + onChangeDocument(fn: (doc: IPublicModelDocumentModel) => void): () => void; + + /** + * 当前 project 的模拟器 ready 事件 + */ + onSimulatorHostReady(fn: (host: IPublicApiSimulatorHost) => void): () => void; + + /** + * 当前 project 的渲染器 ready 事件 + */ + onSimulatorRendererReady(fn: () => void): () => void; + + /** + * 设置多语言语料 + * 数据格式参考 https://github.com/alibaba/lowcode-engine/blob/main/specs/lowcode-spec.md#2434%E5%9B%BD%E9%99%85%E5%8C%96%E5%A4%9A%E8%AF%AD%E8%A8%80%E7%B1%BB%E5%9E%8Baa + * @param value object + * @returns + */ + setI18n(value: object): void; +} diff --git a/packages/types/src/shell/api/setters.ts b/packages/types/src/shell/api/setters.ts new file mode 100644 index 000000000..e133c29af --- /dev/null +++ b/packages/types/src/shell/api/setters.ts @@ -0,0 +1,31 @@ +import { RegisteredSetter } from '../../editor'; +import { CustomView } from '../../setter-config'; + + +export interface IPublicApiSetters { + /** + * 获取指定 setter + * @param type + * @returns + */ + getSetter(type: string): RegisteredSetter | null; + + /** + * 获取已注册的所有 settersMap + * @returns + */ + getSettersMap(): Map; + + /** + * 注册一个 setter + * @param typeOrMaps + * @param setter + * @returns + */ + registerSetter( + typeOrMaps: string | { [key: string]: CustomView | RegisteredSetter }, + setter?: CustomView | RegisteredSetter | undefined + ): void; +} diff --git a/packages/types/src/shell/api/simulator-host.ts b/packages/types/src/shell/api/simulator-host.ts new file mode 100644 index 000000000..971e78a83 --- /dev/null +++ b/packages/types/src/shell/api/simulator-host.ts @@ -0,0 +1,41 @@ +import { IPublicModelNode } from '../model'; + + +export interface IPublicApiSimulatorHost { + /** + * 获取 contentWindow + */ + get contentWindow(): Window | undefined; + + /** + * 获取 contentDocument + */ + get contentDocument(): Document | undefined; + + get renderer(): any; + + /** + * 设置 host 配置值 + * @param key + * @param value + */ + set(key: string, value: any): void; + + /** + * 获取 host 配置值 + * @param key + * @returns + */ + get(key: string): any; + + /** + * scroll to specific node + * @param node + */ + scrollToNode(node: IPublicModelNode): void; + + /** + * 刷新渲染画布 + */ + rerender(): void; +} diff --git a/packages/types/src/shell/api/skeleton.ts b/packages/types/src/shell/api/skeleton.ts new file mode 100644 index 000000000..5f81c6407 --- /dev/null +++ b/packages/types/src/shell/api/skeleton.ts @@ -0,0 +1,95 @@ +import { IWidgetBaseConfig } from '../../editor-skeleton'; + + +export interface IPublicApiSkeleton { + /** + * 增加一个面板实例 + * @param config + * @param extraConfig + * @returns + */ + add(config: IWidgetBaseConfig, extraConfig?: Record): any; + + /** + * 移除一个面板实例 + * @param config + * @returns + */ + remove(config: IWidgetBaseConfig): number | undefined; + + /** + * 显示面板 + * @param name + */ + showPanel(name: string): void; + + /** + * 隐藏面板 + * @param name + */ + hidePanel(name: string): void; + + /** + * 显示 widget + * @param name + */ + showWidget(name: string): void; + + /** + * enable widget + * @param name + */ + enableWidget(name: string): void; + + /** + * 隐藏 widget + * @param name + */ + hideWidget(name: string): void; + + /** + * disable widget，不可点击 + * @param name + */ + disableWidget(name: string): void; + + /** + * show area + * @param areaName name of area + */ + showArea(areaName: string): void; + + /** + * hide area + * @param areaName name of area + */ + hideArea(areaName: string): void; + + /** + * 监听 panel 显示事件 + * @param listener + * @returns + */ + onShowPanel(listener: (...args: unknown[]) => void): () => void; + + /** + * 监听 panel 隐藏事件 + * @param listener + * @returns + */ + onHidePanel(listener: (...args: unknown[]) => void): () => void; + + /** + * 监听 widget 显示事件 + * @param listener + * @returns + */ + onShowWidget(listener: (...args: unknown[]) => void): () => void; + + /** + * 监听 widget 隐藏事件 + * @param listener + * @returns + */ + onHideWidget(listener: (...args: unknown[]) => void): () => void; +} diff --git a/packages/types/src/shell/index.ts b/packages/types/src/shell/index.ts new file mode 100644 index 000000000..c0b2d5280 --- /dev/null +++ b/packages/types/src/shell/index.ts @@ -0,0 +1,13 @@ +import { IPublicModelNode } from './model/node'; +import { IPublicModelProp } from './model/prop'; + +export interface PropChangeOptions { + key?: string | number; + prop?: IPublicModelProp; + node: IPublicModelNode; + newValue: any; + oldValue: any; +} + +export * from './api'; +export * from './model'; \ No newline at end of file diff --git a/packages/types/src/shell/model/canvas.ts b/packages/types/src/shell/model/canvas.ts new file mode 100644 index 000000000..50c6d3905 --- /dev/null +++ b/packages/types/src/shell/model/canvas.ts @@ -0,0 +1,4 @@ + +export interface IPublicModelCanvas { + get dropLocation(): any; +} diff --git a/packages/types/src/shell/model/component-meta.ts b/packages/types/src/shell/model/component-meta.ts new file mode 100644 index 000000000..f50081f14 --- /dev/null +++ b/packages/types/src/shell/model/component-meta.ts @@ -0,0 +1,85 @@ +import { NodeSchema, NodeData } from '../../schema'; +import { IconType } from '../../icon'; +import { TransformedComponentMetadata } from '../../metadata'; +import { ReactElement } from 'react'; +import { I18nData } from '../../i18n'; +import { NpmInfo } from '../../npm'; +import { IPublicModelNode } from './node'; + +export interface IPublicModelComponentMeta { + /** + * 组件名 + */ + get componentName(): string; + + /** + * 是否是「容器型」组件 + */ + get isContainer(): boolean; + + /** + * 是否是最小渲染单元。 + * 当组件需要重新渲染时： + * 若为最小渲染单元，则只渲染当前组件， + * 若不为最小渲染单元，则寻找到上层最近的最小渲染单元进行重新渲染，直至根节点。 + */ + get isMinimalRenderUnit(): boolean; + + /** + * 是否为「模态框」组件 + */ + get isModal(): boolean; + + /** + * 元数据配置 + */ + get configure(): any; + + /** + * 标题 + */ + get title(): string | I18nData | ReactElement; + + /** + * 图标 + */ + get icon(): IconType; + + /** + * 组件 npm 信息 + */ + get npm(): NpmInfo; + + get availableActions(): any; + + /** + * 设置 npm 信息 + * @param npm + */ + setNpm(npm: NpmInfo): void; + + /** + * 获取元数据 + * @returns + */ + getMetadata(): TransformedComponentMetadata; + + /** + * check if the current node could be placed in parent node + * @param my + * @param parent + * @returns + */ + checkNestingUp(my: IPublicModelNode | NodeData, parent: any): boolean; + + /** + * check if the target node(s) could be placed in current node + * @param my + * @param parent + * @returns + */ + checkNestingDown(my: IPublicModelNode | NodeData, target: NodeSchema | IPublicModelNode | NodeSchema[]): boolean; + + + refreshMetadata(): void; +} diff --git a/packages/types/src/shell/model/detecting.ts b/packages/types/src/shell/model/detecting.ts new file mode 100644 index 000000000..a9a480b2e --- /dev/null +++ b/packages/types/src/shell/model/detecting.ts @@ -0,0 +1,23 @@ +export interface IPublicModelDetecting { + /** + * 当前 hover 的节点 + */ + get current(): any; + + /** + * hover 指定节点 + * @param id 节点 id + */ + capture(id: string): any; + + /** + * hover 离开指定节点 + * @param id 节点 id + */ + release(id: string): any; + + /** + * 清空 hover 态 + */ + leave(): any; +} diff --git a/packages/types/src/shell/model/document-model.ts b/packages/types/src/shell/model/document-model.ts new file mode 100644 index 000000000..2407cdab1 --- /dev/null +++ b/packages/types/src/shell/model/document-model.ts @@ -0,0 +1,155 @@ +import { RootSchema } from '../../schema'; +import { TransformStage } from '../../transform-stage'; +import { DragNodeDataObject, DragNodeObject } from '../../dragon'; +import { IPublicApiProject } from '../api'; +import { PropChangeOptions } from '../index'; +import { IPublicModelModalNodesManager } from './modal-nodes-manager'; +import { IPublicModelNode } from './node'; + + +export interface IPublicModelDocumentModel { + + /** + * id + */ + get id(): string; + + set id(id); + + /** + * 获取当前文档所属的 project + * @returns + */ + get project(): IPublicApiProject | null; + + /** + * 获取文档的根节点 + * @returns + */ + get root(): IPublicModelNode | null; + + get focusNode(): IPublicModelNode | null; + + set focusNode(node: IPublicModelNode | null); + + /** + * 获取文档下所有节点 + * @returns + */ + get nodesMap(): any; + + /** + * 模态节点管理 + */ + get modalNodesManager(): IPublicModelModalNodesManager | null; + + /** + * 根据 nodeId 返回 Node 实例 + * @param nodeId + * @returns + */ + getNodeById(nodeId: string): IPublicModelNode | null; + + /** + * 导入 schema + * @param schema + */ + importSchema(schema: RootSchema): void; + + /** + * 导出 schema + * @param stage + * @returns + */ + exportSchema(stage: TransformStage): any; + + /** + * 插入节点 + * @param parent + * @param thing + * @param at + * @param copy + * @returns + */ + insertNode( + parent: IPublicModelNode, + thing: IPublicModelNode, + at?: number | null | undefined, + copy?: boolean | undefined + ): IPublicModelNode | null; + + /** + * 创建一个节点 + * @param data + * @returns + */ + createNode(data: any): IPublicModelNode | null; + + /** + * 移除指定节点/节点id + * @param idOrNode + */ + removeNode(idOrNode: string | IPublicModelNode): void; + + /** + * componentsMap of documentModel + * @param extraComps + * @returns + */ + getComponentsMap(extraComps?: string[]): any; + + /** + * 检查拖拽放置的目标节点是否可以放置该拖拽对象 + * @param dropTarget 拖拽放置的目标节点 + * @param dragObject 拖拽的对象 + * @returns boolean 是否可以放置 + */ + checkNesting( + dropTarget: IPublicModelNode, + dragObject: DragNodeObject | DragNodeDataObject + ): boolean; + + /** + * 当前 document 新增节点事件 + */ + onAddNode(fn: (node: IPublicModelNode) => void): () => void; + + /** + * 当前 document 新增节点事件，此时节点已经挂载到 document 上 + */ + onMountNode(fn: (payload: { node: IPublicModelNode }) => void): () => void; + + /** + * 当前 document 删除节点事件 + */ + onRemoveNode(fn: (node: IPublicModelNode) => void): () => void; + + /** + * 当前 document 的 hover 变更事件 + */ + onChangeDetecting(fn: (node: IPublicModelNode) => void): () => void; + + /** + * 当前 document 的选中变更事件 + */ + onChangeSelection(fn: (ids: string[]) => void): () => void; + + /** + * 当前 document 的节点显隐状态变更事件 + * @param fn + */ + onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): void; + + + /** + * 当前 document 节点属性修改事件 + * @param fn + */ + onChangeNodeProp(fn: (info: PropChangeOptions) => void): void; + + /** + * import schema event + * @param fn + */ + onImportSchema(fn: (schema: RootSchema) => void): void; +} diff --git a/packages/types/src/shell/model/drag-object.ts b/packages/types/src/shell/model/drag-object.ts new file mode 100644 index 000000000..9169ea853 --- /dev/null +++ b/packages/types/src/shell/model/drag-object.ts @@ -0,0 +1,8 @@ +export interface IPublicModelDragObject { + + get type(): any; + + get nodes(): any; + + get data(): any; +} diff --git a/packages/types/src/shell/model/dragon.ts b/packages/types/src/shell/model/dragon.ts new file mode 100644 index 000000000..f6f97ac08 --- /dev/null +++ b/packages/types/src/shell/model/dragon.ts @@ -0,0 +1,39 @@ +import { DragNodeDataObject } from '../../dragon'; +import { IPublicModelDragObject } from './drag-object'; +import { IPublicModelLocateEvent } from './locate-event'; + +export interface IPublicModelDragon { + /** + * is dragging or not + */ + get dragging(): boolean; + + /** + * 绑定 dragstart 事件 + * @param func + * @returns + */ + onDragstart(func: (e: IPublicModelLocateEvent) => any): () => void; + + /** + * 绑定 drag 事件 + * @param func + * @returns + */ + onDrag(func: (e: IPublicModelLocateEvent) => any): () => void; + + /** + * 绑定 dragend 事件 + * @param func + * @returns + */ + onDragend(func: (o: { dragObject: IPublicModelDragObject; copy?: boolean }) => any): () => void; + + + /** + * 设置拖拽监听的区域 shell，以及自定义拖拽转换函数 boost + * @param shell 拖拽监听的区域 + * @param boost 拖拽转换函数 + */ + from(shell: Element, boost: (e: MouseEvent) => DragNodeDataObject | null): any; +} diff --git a/packages/types/src/shell/model/drop-location.ts b/packages/types/src/shell/model/drop-location.ts new file mode 100644 index 000000000..746850b1f --- /dev/null +++ b/packages/types/src/shell/model/drop-location.ts @@ -0,0 +1,3 @@ +export interface IPublicModelDropLocation { + get target(): any; +} diff --git a/packages/types/src/shell/model/history.ts b/packages/types/src/shell/model/history.ts new file mode 100644 index 000000000..1c0020de3 --- /dev/null +++ b/packages/types/src/shell/model/history.ts @@ -0,0 +1,49 @@ +export interface IPublicModelHistory { + + /** + * 历史记录跳转到指定位置 + * @param cursor + */ + go(cursor: number): void; + + /** + * 历史记录后退 + */ + back(): void; + + /** + * 历史记录前进 + */ + forward(): void; + + /** + * 保存当前状态 + */ + savePoint(): void; + + /** + * 当前是否是「保存点」，即是否有状态变更但未保存 + * @returns + */ + isSavePoint(): boolean; + + /** + * 获取 state，判断当前是否为「可回退」、「可前进」的状态 + * @returns + */ + getState(): any; + + /** + * 监听 state 变更事件 + * @param func + * @returns + */ + onChangeState(func: () => any): () => void; + + /** + * 监听历史记录游标位置变更事件 + * @param func + * @returns + */ + onChangeCursor(func: () => any): () => void; +} diff --git a/packages/types/src/shell/model/index.ts b/packages/types/src/shell/model/index.ts new file mode 100644 index 000000000..27d3fcbb6 --- /dev/null +++ b/packages/types/src/shell/model/index.ts @@ -0,0 +1,17 @@ +export * from './canvas'; +export * from './component-meta'; +export * from './detecting'; +export * from './document-model'; +export * from './drag-object'; +export * from './dragon'; +export * from './drop-location'; +export * from './history'; +export * from './locate-event'; +export * from './modal-nodes-manager'; +export * from './node-children'; +export * from './node'; +export * from './prop'; +export * from './props'; +export * from './selection'; +export * from './setting-prop-entry'; +export * from './setting-top-entry'; \ No newline at end of file diff --git a/packages/types/src/shell/model/locate-event.ts b/packages/types/src/shell/model/locate-event.ts new file mode 100644 index 000000000..bde101034 --- /dev/null +++ b/packages/types/src/shell/model/locate-event.ts @@ -0,0 +1,20 @@ +import { IPublicModelDragObject } from './drag-object'; + +export interface IPublicModelLocateEvent { + + get type(): string; + + get globalX(): number; + + get globalY(): number; + + get originalEvent(): MouseEvent | DragEvent; + + get target(): Element | null | undefined; + + get canvasX(): number | undefined; + + get canvasY(): number | undefined; + + get dragObject(): IPublicModelDragObject | null; +} diff --git a/packages/types/src/shell/model/modal-nodes-manager.ts b/packages/types/src/shell/model/modal-nodes-manager.ts new file mode 100644 index 000000000..07d598e2e --- /dev/null +++ b/packages/types/src/shell/model/modal-nodes-manager.ts @@ -0,0 +1,37 @@ +import { IPublicModelNode } from './node'; + +export interface IPublicModelModalNodesManager { + /** + * 设置模态节点，触发内部事件 + */ + setNodes(): void; + + /** + * 获取模态节点（们） + * @returns + */ + getModalNodes(): any; + + /** + * 获取当前可见的模态节点 + * @returns + */ + getVisibleModalNode(): any; + + /** + * 隐藏模态节点（们） + */ + hideModalNodes(): void; + + /** + * 设置指定节点为可见态 + * @param node Node + */ + setVisible(node: IPublicModelNode): void; + + /** + * 设置指定节点为不可见态 + * @param node Node + */ + setInvisible(node: IPublicModelNode): void; +} diff --git a/packages/types/src/shell/model/node-children.ts b/packages/types/src/shell/model/node-children.ts new file mode 100644 index 000000000..204405454 --- /dev/null +++ b/packages/types/src/shell/model/node-children.ts @@ -0,0 +1,128 @@ +import { NodeSchema, NodeData } from '../../schema'; +import { TransformStage } from '../../transform-stage'; +import { IPublicModelNode } from './node'; + +export interface IPublicModelNodeChildren { + /** + * 返回当前 children 实例所属的节点实例 + */ + get owner(): IPublicModelNode | null; + + /** + * children 内的节点实例数 + */ + get size(): number; + + /** + * 是否为空 + * @returns + */ + get isEmpty(): boolean; + + /** + * judge if it is not empty + */ + get notEmpty(): boolean; + + /** + * 删除指定节点 + * @param node + * @returns + */ + delete(node: IPublicModelNode): boolean; + + /** + * 插入一个节点 + * @param node 待插入节点 + * @param at 插入下标 + * @returns + */ + insert(node: IPublicModelNode, at?: number | null): void; + + /** + * 返回指定节点的下标 + * @param node + * @returns + */ + indexOf(node: IPublicModelNode): number; + + /** + * 类似数组 splice 操作 + * @param start + * @param deleteCount + * @param node + */ + splice(start: number, deleteCount: number, node?: IPublicModelNode): any; + + /** + * 返回指定下标的节点 + * @param index + * @returns + */ + get(index: number): any; + + /** + * 是否包含指定节点 + * @param node + * @returns + */ + has(node: IPublicModelNode): boolean; + + /** + * 类似数组的 forEach + * @param fn + */ + forEach(fn: (node: IPublicModelNode, index: number) => void): void; + + /** + * 类似数组的 map + * @param fn + */ + map(fn: (node: IPublicModelNode, index: number) => T[]): any[] | null; + + /** + * 类似数组的 every + * @param fn + */ + every(fn: (node: IPublicModelNode, index: number) => boolean): boolean; + + /** + * 类似数组的 some + * @param fn + */ + some(fn: (node: IPublicModelNode, index: number) => boolean): boolean; + + /** + * 类似数组的 filter + * @param fn + */ + filter(fn: (node: IPublicModelNode, index: number) => boolean): any; + + /** + * 类似数组的 find + * @param fn + */ + find(fn: (node: IPublicModelNode, index: number) => boolean): IPublicModelNode | null; + + reduce(fn: (acc: any, cur: IPublicModelNode) => any, initialValue: any): void; + + /** + * 导入 schema + * @param data + */ + importSchema(data?: NodeData | NodeData[]): void; + + /** + * 导出 schema + * @param stage + * @returns + */ + exportSchema(stage: TransformStage): NodeSchema; + + mergeChildren( + remover: (node: IPublicModelNode, idx: number) => boolean, + adder: (children: IPublicModelNode[]) => NodeData[] | null, + sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number + ): any; + +} diff --git a/packages/types/src/shell/model/node.ts b/packages/types/src/shell/model/node.ts new file mode 100644 index 000000000..f0aaf9506 --- /dev/null +++ b/packages/types/src/shell/model/node.ts @@ -0,0 +1,316 @@ +import { NodeSchema, PropsMap, PropsList } from '../../schema'; +import { TransformStage } from '../../transform-stage'; +import { IconType } from '../../icon'; +import { ReactElement } from 'react'; +import { I18nData } from '../../i18n'; +import { CompositeValue } from '../../value-type'; +import { IPublicModelDocumentModel } from './document-model'; +import { IPublicModelSettingTopEntry } from './setting-top-entry'; +import { IPublicModelProps } from './props'; +import { IPublicModelProp } from './prop'; +import { IPublicModelNodeChildren } from './node-children'; +import { IPublicModelComponentMeta } from './component-meta'; + +export interface IPublicModelNode { + + /** + * 节点 id + */ + id: string; + /** + * 节点标题 + */ + get title(): string | I18nData | ReactElement; + + /** + * 是否为「容器型」节点 + */ + get isContainer(): boolean; + + /** + * 是否为根节点 + */ + get isRoot(): boolean; + + /** + * 是否为空节点（无 children 或者 children 为空） + */ + get isEmpty(): boolean; + + /** + * 是否为 Page 节点 + */ + get isPage(): boolean; + + /** + * 是否为 Component 节点 + */ + get isComponent(): boolean; + + /** + * 是否为「模态框」节点 + */ + get isModal(): boolean; + + /** + * 是否为插槽节点 + */ + get isSlot(): boolean; + + /** + * 是否为父类/分支节点 + */ + get isParental(): boolean; + + /** + * 是否为叶子节点 + */ + get isLeaf(): boolean; + + /** + * 获取当前节点的锁定状态 + */ + get isLocked(): boolean; + + /** + * 下标 + */ + get index(): number; + + /** + * 图标 + */ + get icon(): IconType; + + /** + * 节点所在树的层级深度，根节点深度为 0 + */ + get zLevel(): number; + + /** + * 节点 componentName + */ + get componentName(): string; + + /** + * 节点的物料元数据 + */ + get componentMeta(): IPublicModelComponentMeta | null; + + /** + * 获取节点所属的文档模型对象 + * @returns + */ + get document(): IPublicModelDocumentModel | null; + + /** + * 获取当前节点的前一个兄弟节点 + * @returns + */ + get prevSibling(): IPublicModelNode | null; + + /** + * 获取当前节点的后一个兄弟节点 + * @returns + */ + get nextSibling(): IPublicModelNode | null; + + /** + * 获取当前节点的父亲节点 + * @returns + */ + get parent(): IPublicModelNode | null; + /** + * 获取当前节点的孩子节点模型 + * @returns + */ + get children(): IPublicModelNodeChildren | null; + + /** + * 节点上挂载的插槽节点们 + */ + get slots(): IPublicModelNode[]; + + /** + * 当前节点为插槽节点时，返回节点对应的属性实例 + */ + get slotFor(): IPublicModelProp | null; + + /** + * 返回节点的属性集 + */ + get props(): IPublicModelProps | null; + + /** + * 返回节点的属性集 + */ + get propsData(): PropsMap | PropsList | null; + + /** + * 获取符合搭建协议 - 节点 schema 结构 + */ + get schema(): NodeSchema; + + get settingEntry(): IPublicModelSettingTopEntry; + + /** + * 执行新增、删除、排序等操作 + * @param remover + * @param adder + * @param sorter + */ + mergeChildren( + remover: (node: IPublicModelNode, idx: number) => boolean, + adder: (children: IPublicModelNode[]) => any, + sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number + ): any; + + /** + * 返回节点的尺寸、位置信息 + * @returns + */ + getRect(): DOMRect | null; + + /** + * 是否有挂载插槽节点 + * @returns + */ + hasSlots(): boolean; + + /** + * 是否设定了渲染条件 + * @returns + */ + hasCondition(): boolean; + + /** + * 是否设定了循环数据 + * @returns + */ + hasLoop(): boolean; + + getVisible(): boolean; + + setVisible(flag: boolean): void; + + isConditionalVisible(): boolean | undefined; + + /** + * 设置节点锁定状态 + * @param flag + */ + lock(flag?: boolean): void; + + contains(node: IPublicModelNode): boolean; + + /** + * 获取指定 path 的属性模型实例 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getProp(path: string, createIfNone: boolean): IPublicModelProp | null; + + /** + * 获取指定 path 的属性模型实例， + * 注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @param createIfNone 当没有属性的时候，是否创建一个属性 + * @returns + */ + getExtraProp(path: string, createIfNone?: boolean): IPublicModelProp | null; + + /** + * 获取指定 path 的属性模型实例， + * 注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getExtraPropValue(path: string): any; + + /** + * 设置指定 path 的属性模型实例值 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @param value 值 + * @returns + */ + setPropValue(path: string, value: CompositeValue): void; + + /** + * 设置指定 path 的属性模型实例值 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @param value 值 + * @returns + */ + setExtraPropValue(path: string, value: CompositeValue): void; + + /** + * 导入节点数据 + * @param data + */ + importSchema(data: NodeSchema): void; + + /** + * 导出节点数据 + * @param stage + * @param options + * @returns + */ + exportSchema(stage: TransformStage, options?: any): NodeSchema; + + /** + * 在指定位置之前插入一个节点 + * @param node + * @param ref + * @param useMutator + */ + insertBefore(node: IPublicModelNode, ref?: IPublicModelNode | undefined, useMutator?: boolean): void; + + /** + * 在指定位置之后插入一个节点 + * @param node + * @param ref + * @param useMutator + */ + insertAfter(node: IPublicModelNode, ref?: IPublicModelNode | undefined, useMutator?: boolean): void; + + /** + * 替换指定节点 + * @param node 待替换的子节点 + * @param data 用作替换的节点对象或者节点描述 + * @returns + */ + replaceChild(node: IPublicModelNode, data: any): IPublicModelNode | null; + + /** + * 将当前节点替换成指定节点描述 + * @param schema + */ + replaceWith(schema: NodeSchema): any; + + /** + * 选中当前节点实例 + */ + select(): void; + + /** + * 设置悬停态 + * @param flag + */ + hover(flag: boolean): void; + + /** + * 删除当前节点实例 + */ + remove(): void; + + /** + * 设置为磁贴布局节点 + */ + set isRGLContainer(flag: boolean); + + /** + * 获取磁贴布局节点设置状态 + * @returns Boolean + */ + get isRGLContainer(); +} diff --git a/packages/types/src/shell/model/prop.ts b/packages/types/src/shell/model/prop.ts new file mode 100644 index 000000000..982d22650 --- /dev/null +++ b/packages/types/src/shell/model/prop.ts @@ -0,0 +1,59 @@ +import { TransformStage } from '../../transform-stage'; +import { CompositeValue } from '../../value-type'; +import { IPublicModelNode } from './node'; + +export interface IPublicModelProp { + /** + * id + */ + get id(): string; + + /** + * key 值 + */ + get key(): string | number | undefined; + + /** + * 返回当前 prop 的路径 + */ + get path(): any[]; + + /** + * 返回所属的节点实例 + */ + get node(): IPublicModelNode | null; + + /** + * return the slot node (only if the current prop represents a slot) + */ + get slotNode(): IPublicModelNode | null; + + /** + * judge if it is a prop or not + */ + get isProp(): boolean; + + /** + * 设置值 + * @param val + */ + setValue(val: CompositeValue): void; + + /** + * 获取值 + * @returns + */ + getValue(): any; + + /** + * 移除值 + */ + remove(): void; + + /** + * 导出值 + * @param stage + * @returns + */ + exportSchema(stage: TransformStage): CompositeValue; +} diff --git a/packages/types/src/shell/model/props.ts b/packages/types/src/shell/model/props.ts new file mode 100644 index 000000000..09a5ec4e2 --- /dev/null +++ b/packages/types/src/shell/model/props.ts @@ -0,0 +1,82 @@ +import { CompositeValue } from '../../value-type'; +import { IPublicModelNode } from './node'; +import { IPublicModelProp } from './prop'; + +export interface IPublicModelProps { + /** + * id + */ + get id(): string; + + /** + * 返回当前 props 的路径 + */ + get path(): any[]; + + /** + * 返回所属的 node 实例 + */ + get node(): IPublicModelNode | null; + + /** + * 获取指定 path 的属性模型实例 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getProp(path: string): IPublicModelProp | null; + + /** + * 获取指定 path 的属性模型实例值 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getPropValue(path: string): any; + + /** + * 获取指定 path 的属性模型实例， + * 注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getExtraProp(path: string): IPublicModelProp | null; + + /** + * 获取指定 path 的属性模型实例值 + * 注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @returns + */ + getExtraPropValue(path: string): any; + + /** + * 设置指定 path 的属性模型实例值 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @param value 值 + * @returns + */ + setPropValue(path: string, value: CompositeValue): void; + + /** + * 设置指定 path 的属性模型实例值 + * @param path 属性路径，支持 a / a.b / a.0 等格式 + * @param value 值 + * @returns + */ + setExtraPropValue(path: string, value: CompositeValue): void; + + /** + * test if the specified key is existing or not. + * @param key + * @returns + */ + has(key: string): boolean; + + /** + * add a key with given value + * @param value + * @param key + * @returns + */ + add(value: CompositeValue, key?: string | number | undefined): any; + +} diff --git a/packages/types/src/shell/model/selection.ts b/packages/types/src/shell/model/selection.ts new file mode 100644 index 000000000..43a5ee494 --- /dev/null +++ b/packages/types/src/shell/model/selection.ts @@ -0,0 +1,65 @@ +import { IPublicModelNode } from './node'; + +export interface IPublicModelSelection { + + /** + * 返回选中的节点 id + */ + get selected(): string[]; + + /** + * return selected Node instance + */ + get node(): IPublicModelNode | null; + + /** + * 选中指定节点（覆盖方式） + * @param id + */ + select(id: string): void; + + /** + * 批量选中指定节点们 + * @param ids + */ + selectAll(ids: string[]): void; + + /** + * 移除选中的指定节点 + * @param id + */ + remove(id: string): void; + + /** + * 清除所有选中节点 + */ + clear(): void; + + /** + * 判断是否选中了指定节点 + * @param id + * @returns + */ + has(id: string): boolean; + + /** + * 选中指定节点（增量方式） + * @param id + */ + add(id: string): void; + + /** + * 获取选中的节点实例 + * @returns + */ + getNodes(): Array; + + /** + * 获取选区的顶层节点 + * for example: + * getNodes() returns [A, subA, B], then + * getTopNodes() will return [A, B], subA will be removed + * @returns + */ + getTopNodes(): Array; +} diff --git a/packages/types/src/shell/model/setting-prop-entry.ts b/packages/types/src/shell/model/setting-prop-entry.ts new file mode 100644 index 000000000..90c75a444 --- /dev/null +++ b/packages/types/src/shell/model/setting-prop-entry.ts @@ -0,0 +1,188 @@ +import { CustomView, SetterType } from '../../setter-config'; +import { CompositeValue } from '../../value-type'; +import { FieldExtraProps, FieldConfig } from '../../field-config'; +import { ISetValueOptions } from '../../designer'; +import { IPublicModelNode } from './node'; +import { IPublicModelComponentMeta } from './component-meta'; +import { IPublicModelSettingTopEntry } from './setting-top-entry'; + +export interface IPublicModelSettingPropEntry { + /** + * 获取设置属性的 isGroup + */ + get isGroup(): boolean; + + /** + * 获取设置属性的 id + */ + get id(): string; + + /** + * 获取设置属性的 name + */ + get name(): string | number; + + /** + * 获取设置属性的 key + */ + get key(): string | number; + + /** + * 获取设置属性的 path + */ + get path(): any[]; + + /** + * 获取设置属性的 title + */ + get title(): any; + + /** + * 获取设置属性的 setter + */ + get setter(): SetterType | null; + + /** + * 获取设置属性的 expanded + */ + get expanded(): boolean; + + /** + * 获取设置属性的 extraProps + */ + get extraProps(): FieldExtraProps; + + get props(): IPublicModelSettingTopEntry; + + /** + * 获取设置属性对应的节点实例 + */ + get node(): IPublicModelNode | null; + + /** + * 获取设置属性的父设置属性 + */ + get parent(): IPublicModelSettingPropEntry; + + /** + * 获取顶级设置属性 + */ + get top(): IPublicModelSettingTopEntry; + + /** + * 是否是 SettingField 实例 + */ + get isSettingField(): boolean; + + /** + * componentMeta + */ + get componentMeta(): IPublicModelComponentMeta | null; + + /** + * 获取设置属性的 items + */ + get items(): Array; + + /** + * 设置 key 值 + * @param key + */ + setKey(key: string | number): void; + + /** + * 设置值 + * @param val 值 + */ + setValue(val: CompositeValue, extraOptions?: ISetValueOptions): void; + + /** + * 设置子级属性值 + * @param propName 子属性名 + * @param value 值 + */ + setPropValue(propName: string | number, value: any): void; + + /** + * 清空指定属性值 + * @param propName + */ + clearPropValue(propName: string | number): void; + + /** + * 获取配置的默认值 + * @returns + */ + getDefaultValue(): any; + + /** + * 获取值 + * @returns + */ + getValue(): any; + + /** + * 获取子级属性值 + * @param propName 子属性名 + * @returns + */ + getPropValue(propName: string | number): any; + + /** + * 获取顶层附属属性值 + */ + getExtraPropValue(propName: string): any; + + /** + * 设置顶层附属属性值 + */ + setExtraPropValue(propName: string, value: any): void; + + /** + * 获取设置属性集 + * @returns + */ + getProps(): IPublicModelSettingTopEntry; + + /** + * 是否绑定了变量 + * @returns + */ + isUseVariable(): boolean; + + /** + * 设置绑定变量 + * @param flag + */ + setUseVariable(flag: boolean): void; + + /** + * 创建一个设置 field 实例 + * @param config + * @returns + */ + createField(config: FieldConfig): IPublicModelSettingPropEntry; + + /** + * 获取值，当为变量时，返回 mock + * @returns + */ + getMockOrValue(): any; + + /** + * 销毁当前 field 实例 + */ + purge(): void; + + /** + * 移除当前 field 实例 + */ + remove(): void; + + /** + * 设置 autorun + * @param action + * @returns + */ + onEffect(action: () => void): () => void; +} diff --git a/packages/types/src/shell/model/setting-top-entry.ts b/packages/types/src/shell/model/setting-top-entry.ts new file mode 100644 index 000000000..5a7726346 --- /dev/null +++ b/packages/types/src/shell/model/setting-top-entry.ts @@ -0,0 +1,30 @@ +import { IPublicModelNode } from './node'; +import { IPublicModelSettingPropEntry } from './setting-prop-entry'; + +export interface IPublicModelSettingTopEntry { + /** + * 返回所属的节点实例 + */ + get node(): IPublicModelNode | null; + + /** + * 获取子级属性对象 + * @param propName + * @returns + */ + get(propName: string | number): IPublicModelSettingPropEntry; + + /** + * 获取指定 propName 的值 + * @param propName + * @returns + */ + getPropValue(propName: string | number): any; + + /** + * 设置指定 propName 的值 + * @param propName + * @param value + */ + setPropValue(propName: string | number, value: any): void; +} diff --git a/packages/types/src/title.ts b/packages/types/src/title.ts index a4ac36614..bba02c489 100644 --- a/packages/types/src/title.ts +++ b/packages/types/src/title.ts @@ -1,5 +1,5 @@ import { ReactElement, ReactNode } from 'react'; -import { I18nData, isI18nData } from './i18n'; +import { I18nData } from './i18n'; import { TipContent } from './tip'; import { IconType } from './icon'; @@ -29,16 +29,4 @@ export interface TitleConfig { className?: string; } -export type TitleContent = string | I18nData | ReactElement | TitleConfig; - -function isPlainObject(value: any): value is Record { - if (typeof value !== 'object') { - return false; - } - const proto = Object.getPrototypeOf(value); - return proto === Object.prototype || proto === null || Object.getPrototypeOf(proto) === null; -} - -export function isTitleConfig(obj: any): obj is TitleConfig { - return isPlainObject(obj) && !isI18nData(obj); -} +export type TitleContent = string | I18nData | ReactElement | TitleConfig; \ No newline at end of file diff --git a/packages/types/src/value-type.ts b/packages/types/src/value-type.ts index a266cb9f3..81358fda1 100644 --- a/packages/types/src/value-type.ts +++ b/packages/types/src/value-type.ts @@ -126,30 +126,4 @@ export type CompositeValue = export type CompositeArray = CompositeValue[]; export interface CompositeObject { [key: string]: CompositeValue; -} - -/** - * 为了避免把 { type: 'JSExpression', extType: 'function' } 误判为表达式，故增加如下逻辑。 - * - * 引擎中关于函数的表达： - * 开源版本：{ type: 'JSFunction', source: '', value: '' } - * 内部版本：{ type: 'JSExpression', source: '', value: '', extType: 'function' } - * 能力是对标的，不过开源的 react-renderer 只认识第一种，而内部只识别第二种（包括 Java 代码、RE）。 - * @param data - * @returns - */ -export function isJSExpression(data: any): data is JSExpression { - return data && data.type === 'JSExpression' && data.extType !== 'function'; -} - -export function isJSFunction(x: any): x is JSFunction { - return typeof x === 'object' && x && x.type === 'JSFunction'; -} - -export function isJSSlot(data: any): data is JSSlot { - return data && data.type === 'JSSlot'; -} - -export function isJSBlock(data: any): data is JSBlock { - return data && data.type === 'JSBlock'; -} +} \ No newline at end of file diff --git a/packages/utils/src/check-types/index.ts b/packages/utils/src/check-types/index.ts new file mode 100644 index 000000000..d4dfa6f32 --- /dev/null +++ b/packages/utils/src/check-types/index.ts @@ -0,0 +1,16 @@ +// 此模块存放 @alilc/lowcode-types 中类型相关判断工具 +export * from './is-action-content-object'; +export * from './is-custom-view'; +export * from './is-dom-text'; +export * from './is-dynamic-setter'; +export * from './is-i18n-data'; +export * from './is-jsblock'; +export * from './is-jsexpression'; +export * from './is-isfunction'; +export * from './is-jsslot'; +export * from './is-lowcode-component-type'; +export * from './is-node-schema'; +export * from './is-procode-component-type'; +export * from './is-project-schema'; +export * from './is-setter-config'; +export * from './is-title-config'; \ No newline at end of file diff --git a/packages/utils/src/check-types/is-action-content-object.ts b/packages/utils/src/check-types/is-action-content-object.ts new file mode 100644 index 000000000..917f11ee3 --- /dev/null +++ b/packages/utils/src/check-types/is-action-content-object.ts @@ -0,0 +1,6 @@ +import { ActionContentObject } from '@alilc/lowcode-types'; + + +export function isActionContentObject(obj: any): obj is ActionContentObject { + return obj && typeof obj === 'object'; +} diff --git a/packages/utils/src/check-types/is-custom-view.ts b/packages/utils/src/check-types/is-custom-view.ts new file mode 100644 index 000000000..6f098a921 --- /dev/null +++ b/packages/utils/src/check-types/is-custom-view.ts @@ -0,0 +1,8 @@ +import { isValidElement } from 'react'; +import { isReactComponent } from '../is-react'; +import { CustomView } from '@alilc/lowcode-types'; + + +export function isCustomView(obj: any): obj is CustomView { + return obj && (isValidElement(obj) || isReactComponent(obj)); +} diff --git a/packages/utils/src/check-types/is-dom-text.ts b/packages/utils/src/check-types/is-dom-text.ts new file mode 100644 index 000000000..b5c778517 --- /dev/null +++ b/packages/utils/src/check-types/is-dom-text.ts @@ -0,0 +1,5 @@ +import { DOMText } from '@alilc/lowcode-types'; + +export function isDOMText(data: any): data is DOMText { + return typeof data === 'string'; +} diff --git a/packages/utils/src/check-types/is-dynamic-setter.ts b/packages/utils/src/check-types/is-dynamic-setter.ts new file mode 100644 index 000000000..2e0ac63b9 --- /dev/null +++ b/packages/utils/src/check-types/is-dynamic-setter.ts @@ -0,0 +1,7 @@ +import { isReactClass } from '../is-react'; +import { DynamicSetter } from '@alilc/lowcode-types'; + + +export function isDynamicSetter(obj: any): obj is DynamicSetter { + return obj && typeof obj === 'function' && !isReactClass(obj); +} diff --git a/packages/utils/src/check-types/is-i18n-data.ts b/packages/utils/src/check-types/is-i18n-data.ts new file mode 100644 index 000000000..d315a77c4 --- /dev/null +++ b/packages/utils/src/check-types/is-i18n-data.ts @@ -0,0 +1,7 @@ +import { I18nData } from '@alilc/lowcode-types'; + +// type checks + +export function isI18nData(obj: any): obj is I18nData { + return obj && obj.type === 'i18n'; +} diff --git a/packages/utils/src/check-types/is-isfunction.ts b/packages/utils/src/check-types/is-isfunction.ts new file mode 100644 index 000000000..75506d1ff --- /dev/null +++ b/packages/utils/src/check-types/is-isfunction.ts @@ -0,0 +1,5 @@ +import { JSFunction } from '@alilc/lowcode-types'; + +export function isJSFunction(x: any): x is JSFunction { + return typeof x === 'object' && x && x.type === 'JSFunction'; +} diff --git a/packages/utils/src/check-types/is-jsblock.ts b/packages/utils/src/check-types/is-jsblock.ts new file mode 100644 index 000000000..b19fb9a60 --- /dev/null +++ b/packages/utils/src/check-types/is-jsblock.ts @@ -0,0 +1,5 @@ +import { JSBlock } from '@alilc/lowcode-types'; + +export function isJSBlock(data: any): data is JSBlock { + return data && data.type === 'JSBlock'; +} diff --git a/packages/utils/src/check-types/is-jsexpression.ts b/packages/utils/src/check-types/is-jsexpression.ts new file mode 100644 index 000000000..969b72cd4 --- /dev/null +++ b/packages/utils/src/check-types/is-jsexpression.ts @@ -0,0 +1,15 @@ +import { JSExpression } from '@alilc/lowcode-types'; + +/** + * 为了避免把 { type: 'JSExpression', extType: 'function' } 误判为表达式，故增加如下逻辑。 + * + * 引擎中关于函数的表达： + * 开源版本：{ type: 'JSFunction', source: '', value: '' } + * 内部版本：{ type: 'JSExpression', source: '', value: '', extType: 'function' } + * 能力是对标的，不过开源的 react-renderer 只认识第一种，而内部只识别第二种（包括 Java 代码、RE）。 + * @param data + * @returns + */ +export function isJSExpression(data: any): data is JSExpression { + return data && data.type === 'JSExpression' && data.extType !== 'function'; +} diff --git a/packages/utils/src/check-types/is-jsslot.ts b/packages/utils/src/check-types/is-jsslot.ts new file mode 100644 index 000000000..bc7c3576f --- /dev/null +++ b/packages/utils/src/check-types/is-jsslot.ts @@ -0,0 +1,5 @@ +import { JSSlot } from '@alilc/lowcode-types'; + +export function isJSSlot(data: any): data is JSSlot { + return data && data.type === 'JSSlot'; +} diff --git a/packages/utils/src/check-types/is-lowcode-component-type.ts b/packages/utils/src/check-types/is-lowcode-component-type.ts new file mode 100644 index 000000000..7c6978378 --- /dev/null +++ b/packages/utils/src/check-types/is-lowcode-component-type.ts @@ -0,0 +1,7 @@ +import { isProCodeComponentType } from './is-procode-component-type'; +import { ComponentMap, LowCodeComponentType } from '@alilc/lowcode-types'; + + +export function isLowCodeComponentType(desc: ComponentMap): desc is LowCodeComponentType { + return !isProCodeComponentType(desc); +} diff --git a/packages/utils/src/check-types/is-node-schema.ts b/packages/utils/src/check-types/is-node-schema.ts new file mode 100644 index 000000000..2552a920f --- /dev/null +++ b/packages/utils/src/check-types/is-node-schema.ts @@ -0,0 +1,5 @@ +import { NodeSchema } from '@alilc/lowcode-types'; + +export function isNodeSchema(data: any): data is NodeSchema { + return data && data.componentName; +} diff --git a/packages/utils/src/check-types/is-procode-component-type.ts b/packages/utils/src/check-types/is-procode-component-type.ts new file mode 100644 index 000000000..53c33c6c9 --- /dev/null +++ b/packages/utils/src/check-types/is-procode-component-type.ts @@ -0,0 +1,6 @@ +import { ComponentMap, ProCodeComponentType } from '@alilc/lowcode-types'; + + +export function isProCodeComponentType(desc: ComponentMap): desc is ProCodeComponentType { + return 'package' in desc; +} diff --git a/packages/utils/src/check-types/is-project-schema.ts b/packages/utils/src/check-types/is-project-schema.ts new file mode 100644 index 000000000..9dd6d4961 --- /dev/null +++ b/packages/utils/src/check-types/is-project-schema.ts @@ -0,0 +1,5 @@ +import { ProjectSchema } from '@alilc/lowcode-types'; + +export function isProjectSchema(data: any): data is ProjectSchema { + return data && data.componentsTree; +} diff --git a/packages/utils/src/check-types/is-setter-config.ts b/packages/utils/src/check-types/is-setter-config.ts new file mode 100644 index 000000000..7176a5968 --- /dev/null +++ b/packages/utils/src/check-types/is-setter-config.ts @@ -0,0 +1,7 @@ +import { SetterConfig } from '@alilc/lowcode-types'; +import { isCustomView } from './is-custom-view'; + + +export function isSetterConfig(obj: any): obj is SetterConfig { + return obj && typeof obj === 'object' && 'componentName' in obj && !isCustomView(obj); +} diff --git a/packages/utils/src/check-types/is-title-config.ts b/packages/utils/src/check-types/is-title-config.ts new file mode 100644 index 000000000..2d5088dc0 --- /dev/null +++ b/packages/utils/src/check-types/is-title-config.ts @@ -0,0 +1,8 @@ +import { isI18nData } from './is-i18n-data'; +import { isPlainObject } from '../is-plain-object'; +import { TitleConfig } from '@alilc/lowcode-types'; + + +export function isTitleConfig(obj: any): obj is TitleConfig { + return isPlainObject(obj) && !isI18nData(obj); +} diff --git a/packages/utils/src/index.ts b/packages/utils/src/index.ts index 4f47402a1..1dd7168fd 100644 --- a/packages/utils/src/index.ts +++ b/packages/utils/src/index.ts @@ -27,3 +27,4 @@ export * from './clone-enumerable-property'; export * from './logger'; export * as css from './css-helper'; export { transactionManager } from './transaction-manager'; +export * from './check-types'; diff --git a/packages/utils/src/schema.ts b/packages/utils/src/schema.ts index 1580003d2..0bb124852 100644 --- a/packages/utils/src/schema.ts +++ b/packages/utils/src/schema.ts @@ -1,4 +1,5 @@ -import { isJSBlock, isJSSlot, ActivityType, NodeSchema, PageSchema, RootSchema } from '@alilc/lowcode-types'; +import { ActivityType, NodeSchema, RootSchema } from '@alilc/lowcode-types'; +import { isJSBlock, isJSSlot } from './check-types'; import { isVariable } from './misc'; import { isPlainObject } from './is-plain-object';