github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2025-12-12 03:01:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: convert devMode to standard spec format using metadataTransducer

Browse Source 
fix: https://github.com/alibaba/lowcode-engine/issues/283
This commit is contained in:
fxxjdedd 2022-04-13 22:50:21 +08:00 committed by LeoYuan 袁力皓
parent 0c6bca339a
commit 3d176cb534
18 changed files with 112 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
packages/designer/src/component-meta.ts
View File

@ -16,7 +16,7 @@ import {
import { deprecate } from '@alilc/lowcode-utils';
import { computed, engineConfig } from '@alilc/lowcode-editor-core';
import EventEmitter from 'events';
import { componentDefaults, legacyIssues } from './transducers';
import { isNode, Node, ParentalNode } from './document';
import { Designer } from './designer';
import { intlNode } from './locale';
@ -397,47 +397,6 @@ export function getRegisteredMetadataTransducers(): MetadataTransducer[] {
return metadataTransducers;
}
registerMetadataTransducer((metadata) => {
const { configure, componentName } = metadata;
const { component = {} } = configure;
if (!component.nestingRule) {
let m;
// uri match xx.Group set subcontrolling: true, childWhiteList
// eslint-disable-next-line no-cond-assign
if ((m = /^(.+)\.Group$/.exec(componentName))) {
// component.subControlling = true;
if (!component.nestingRule) {
component.nestingRule = {
childWhitelist: [`${m[1]}`],
};
}
// eslint-disable-next-line no-cond-assign
} else if ((m = /^(.+)\.Node$/.exec(componentName))) {
// uri match xx.Node set selfControlled: false, parentWhiteList
// component.selfControlled = false;
component.nestingRule = {
parentWhitelist: [`${m[1]}`, componentName],
};
// eslint-disable-next-line no-cond-assign
} else if ((m = /^(.+)\.(Item|Node|Option)$/.exec(componentName))) {
// uri match .Item .Node .Option set parentWhiteList
component.nestingRule = {
parentWhitelist: [`${m[1]}`],
};
}
}
// if (component.isModal == null && /Dialog/.test(componentName)) {
// component.isModal = true;
// }
return {
...metadata,
configure: {
...configure,
component,
},
};
});
const builtinComponentActions: ComponentAction[] = [
{
name: 'remove',
@ -544,3 +503,6 @@ export function modifyBuiltinComponentAction(
handle(builtinAction);
}
}
registerMetadataTransducer(legacyIssues, 2, 'legacy-issues'); // should use a high level priority, eg: 2
registerMetadataTransducer(componentDefaults, 100, 'component-defaults');

2
packages/designer/src/designer/designer.ts
View File

@ -521,7 +521,7 @@ export class Designer {
const designer = this;
designer._componentMetasMap.forEach((config, key) => {
const metaData = config.getMetadata();
if (metaData.devMode === 'lowcode') {
if (metaData.devMode === 'lowCode') {
maps[key] = metaData.schema;
} else {
const view = metaData.configure.advanced?.view;

4
packages/designer/src/document/document-model.ts
View File

@ -26,7 +26,7 @@ export interface ComponentMap {
destructuring?: boolean;
exportName?: string;
subName?: string;
devMode?: 'lowcode' | 'procode';
devMode?: 'lowCode' | 'proCode';
}
export class DocumentModel {
@ -667,7 +667,7 @@ export class DocumentModel {
});
} else {
componentsMap.push({
devMode: 'lowcode',
devMode: 'lowCode',
componentName,
});
}

2
packages/designer/src/document/node/node.ts
View File

@ -1189,7 +1189,7 @@ export function isRootNode(node: Node): node is RootNode {
}
export function isLowCodeComponent(node: Node): boolean {
return node.componentMeta?.getMetadata().devMode === 'lowcode';
return node.componentMeta?.getMetadata().devMode === 'lowCode';
}
export function getZLevelTop(child: Node, zLevel: number): Node | null {

48
packages/designer/src/transducers/index.ts Normal file
View File

@ -0,0 +1,48 @@
import { TransformedComponentMetadata as Metadata } from '@alilc/lowcode-types';
export function legacyIssues(metadata: Metadata): Metadata {
const { devMode } = metadata;
return {
...metadata,
devMode: devMode?.replace(/(low|pro)code/, '$1Code') as Metadata['devMode'],
};
}
export function componentDefaults(metadata: Metadata): Metadata {
const { configure, componentName } = metadata;
const { component = {} } = configure;
if (!component.nestingRule) {
let m;
// uri match xx.Group set subcontrolling: true, childWhiteList
// eslint-disable-next-line no-cond-assign
if ((m = /^(.+)\.Group$/.exec(componentName))) {
// component.subControlling = true;
component.nestingRule = {
childWhitelist: [`${m[1]}`],
};
// eslint-disable-next-line no-cond-assign
} else if ((m = /^(.+)\.Node$/.exec(componentName))) {
// uri match xx.Node set selfControlled: false, parentWhiteList
// component.selfControlled = false;
component.nestingRule = {
parentWhitelist: [`${m[1]}`, componentName],
};
// eslint-disable-next-line no-cond-assign
} else if ((m = /^(.+)\.(Item|Node|Option)$/.exec(componentName))) {
// uri match .Item .Node .Option set parentWhiteList
component.nestingRule = {
parentWhitelist: [`${m[1]}`],
};
}
}
// if (component.isModal == null && /Dialog/.test(componentName)) {
// component.isModal = true;
// }
return {
...metadata,
configure: {
...configure,
component,
},
};
}

28
packages/designer/tests/document/document-model/__snapshots__/document-model.test.ts.snap
View File

@ -5,59 +5,59 @@ Object {
"componentsMap": Array [
Object {
"componentName": "PageHeader",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "RootHeader",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "TextField",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Column",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "SelectField",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "ColumnsLayout",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "CardContent",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Card",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Button",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Div",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Form",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "RootContent",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "RootFooter",
"devMode": "lowcode",
"devMode": "lowCode",
},
Object {
"componentName": "Page",
"devMode": "lowcode",
"devMode": "lowCode",
},
],
"componentsTree": Array [

2
packages/designer/tests/document/document-model/document-model.test.ts
View File

@ -175,7 +175,7 @@ describe('document-model 测试', () => {
{ componentName: 'Other', package: '@ali/vc-other' }
);
expect(comps.find(comp => comp.componentName === 'Page')).toEqual(
{ componentName: 'Page', devMode: 'lowcode' }
{ componentName: 'Page', devMode: 'lowCode' }
);
});

5
packages/designer/tests/fixtures/component-metadata/button.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Button',
npm: {
@ -6,7 +7,7 @@ export default {
},
title: '按钮',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -304,4 +305,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/dialog.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Dialog',
npm: {
@ -6,7 +7,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -273,4 +274,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/div.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Div',
npm: {
@ -6,7 +7,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -279,4 +280,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/form.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Form',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '表单',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/other.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Other',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/page.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'Page',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/root-content.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'RootContent',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/root-footer.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'RootFooter',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

5
packages/designer/tests/fixtures/component-metadata/root-header.ts vendored
View File

@ -1,3 +1,4 @@
import { ComponentMetadata } from "@alilc/lowcode-types";
export default {
componentName: 'RootHeader',
npm: {
@ -5,7 +6,7 @@ export default {
},
title: '容器',
docUrl: 'https://github.com/alibaba/lowcode-materials/tree/main/docs',
devMode: 'procode',
devMode: 'proCode',
tags: ['布局'],
configure: {
props: [
@ -275,4 +276,4 @@ export default {
],
autoruns: [],
},
};
} as ComponentMetadata;

15
packages/designer/tests/main/meta/component-meta.test.ts
View File

@ -1,4 +1,3 @@
// @ts-ignore
import '../../fixtures/window';
import { Node } from '../../../src/document/node/node';
import { Designer } from '../../../src/designer/designer';
@ -18,7 +17,7 @@ jest.mock('../../../src/designer/designer', () => {
let designer = null;
beforeAll(() => {
designer = new Designer({});
designer = new Designer({} as any);
});
describe('组件元数据处理', () => {
@ -66,3 +65,15 @@ describe('组件元数据处理', () => {
expect(meta.availableActions[4].name).toBe('new');
});
});
describe('组件元数据transducers', () => {
it('legacyIssues', () => {
const legacyMeta: any = {
...divMeta,
devMode: 'procode'
}
const meta = new ComponentMeta(designer, legacyMeta);
const metadata = meta.getMetadata();
expect(metadata.devMode).toBe('proCode');
})
})

2
packages/types/src/metadata.ts
View File

@ -379,7 +379,7 @@ export interface ComponentMetadata {
/**
* 组件研发模式
*/
devMode?: 'procode' | 'lowcode';
devMode?: 'proCode' | 'lowCode';
/**
* npm 源引入完整描述对象
*/