diff --git a/package.json b/package.json index b3c803aea..ac1ca5168 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,10 @@ "build": "./scripts/build.sh", "clean": "rm -rf ./packages/*/lib ./packages/*/es ./packages/*/dist ./packages/*/build", "commit": "git-cz", - "pub": "lerna publish --cd-version patch", + "pub": "lerna publish --force-publish --cd-version prepatch", "setup": "./scripts/setup.sh", "start": "./scripts/start.sh", + "start:server": "./scripts/start-server.sh", "test": "lerna run test --stream", "test:snapshot": "lerna run test:snapshot" }, diff --git a/packages/code-generator/CHANGELOG.md b/packages/code-generator/CHANGELOG.md index 88f773416..dfdf6a9b8 100644 --- a/packages/code-generator/CHANGELOG.md +++ b/packages/code-generator/CHANGELOG.md @@ -3,6 +3,134 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [1.0.8-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.7-0...@ali/lowcode-code-generator@1.0.8-0) (2020-09-09) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.7-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.6-0...@ali/lowcode-code-generator@1.0.7-0) (2020-09-02) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.6-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.5-0...@ali/lowcode-code-generator@1.0.6-0) (2020-09-02) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.5-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.4-0...@ali/lowcode-code-generator@1.0.5-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.4-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.3-0...@ali/lowcode-code-generator@1.0.4-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.3-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.2-0...@ali/lowcode-code-generator@1.0.3-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.2-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.1-0...@ali/lowcode-code-generator@1.0.2-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +## [1.0.1-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@1.0.0...@ali/lowcode-code-generator@1.0.1-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [1.0.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.13.0...@ali/lowcode-code-generator@1.0.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [0.13.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.12.0...@ali/lowcode-code-generator@0.13.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [0.12.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.10.0...@ali/lowcode-code-generator@0.12.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [0.11.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.10.0...@ali/lowcode-code-generator@0.11.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [0.10.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.9.0...@ali/lowcode-code-generator@0.10.0) (2020-08-16) + + + + +**Note:** Version bump only for package @ali/lowcode-code-generator + + +# [0.9.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.8.10...@ali/lowcode-code-generator@0.9.0) (2020-08-14) + + +### Bug Fixes + +* 🐛 bugs about deps ([1eabd50](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1eabd50)) +* 🐛 children in props ([fe0ace8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fe0ace8)) +* 🐛 get deps info from slot ([6c3ae36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6c3ae36)) +* 🐛 group chunks by filetype family ([db144a9](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/db144a9)) +* 🐛 loop bug ([8f53910](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8f53910)) +* 🐛 repair children before deps analyze ([737d06e](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/737d06e)) +* 🐛 support JSFunction type ([9061e4b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/9061e4b)) +* 🐛 更改复杂类型生成工具的接口形式,减少调用复杂度 ([ce616b5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce616b5)) + + +### Features + +* 🎸 add node type mapping config for jsx plugin ([19a51b8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/19a51b8)) +* 🎸 code generator fix slot support ([e51b9cb](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e51b9cb)) + + + + ## [0.8.10](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.8.9...@ali/lowcode-code-generator@0.8.10) (2020-07-21) @@ -118,14 +246,11 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline ### Features -<<<<<<< HEAD * code generator main process ([021d6e0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/021d6e0)) * demo schema & complex children type ([a5ee6bd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/a5ee6bd)) * fix gaps ([32af3d3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/32af3d3)) * project builder fix & publish demo to disk ([26983b3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/26983b3)) -======= * code generator main process ([021d6e0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/021d6e0fe9fb29a8b6c1c5d5f4d06ec71896faa5)) * demo schema & complex children type ([a5ee6bd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/a5ee6bd55806fc9aea695096ccd4c7f50b8e31c4)) * fix gaps ([32af3d3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/32af3d3a3ca4d5aca15be25e05c840c8ea0cb6ae)) * project builder fix & publish demo to disk ([26983b3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/26983b38c2b0f1d39d79964eb54d8ce60250dd82)) ->>>>>>> df955e1db90ff104cd11160def80113cfd6faccc diff --git a/packages/code-generator/demo/demo.js b/packages/code-generator/demo/demo.js index 4d36348b0..a3ca9ca46 100644 --- a/packages/code-generator/demo/demo.js +++ b/packages/code-generator/demo/demo.js @@ -59,9 +59,7 @@ function main() { builder.generateProject(schemaJson).then((result) => { displayResultInConsole(result); - writeResultToDisk(result, 'output/lowcodeDemo').then((response) => - console.log('Write to disk: ', JSON.stringify(response)), - ); + writeResultToDisk(result, 'output/lowcodeDemo').then((response) => console.log('Write to disk: ', JSON.stringify(response)),); return result; }); } @@ -162,111 +160,12 @@ function exportProject() { builder.generateProject(schemaJson).then((result) => { displayResultInConsole(result); - writeResultToDisk(result, 'output/lowcodeDemo').then((response) => - console.log('Write to disk: ', JSON.stringify(response)), - ); - return result; - }); -} - -function exportModule() { - const schemaJson = fs.readFileSync('./demo/shenmaSample.json', { encoding: 'utf8' }); - const moduleBuilder = CodeGenerator.createModuleBuilder({ - plugins: [ - CodeGenerator.plugins.react.reactCommonDeps(), - CodeGenerator.plugins.common.esmodule({ - fileType: 'jsx', - }), - CodeGenerator.plugins.react.containerClass(), - CodeGenerator.plugins.react.containerInitState(), - CodeGenerator.plugins.react.containerLifeCycle(), - CodeGenerator.plugins.react.containerMethod(), - CodeGenerator.plugins.react.jsx(), - CodeGenerator.plugins.style.css(), - ], - postProcessors: [ - CodeGenerator.postprocessor.prettier(), - ], - mainFileName: 'index', - }); - - moduleBuilder.generateModuleCode(schemaJson).then(result => { - displayResultInConsole(result); - return result; - }); -} - -function exportProject() { - const schemaJson = fs.readFileSync('./demo/sampleSchema.json', { encoding: 'utf8' }); - - const builder = CodeGenerator.createProjectBuilder({ - template: CodeGenerator.solutionParts.icejs.template, - plugins: { - components: [ - CodeGenerator.plugins.react.reactCommonDeps(), - CodeGenerator.plugins.common.esmodule({ - fileType: 'jsx', - }), - CodeGenerator.plugins.react.containerClass(), - CodeGenerator.plugins.react.containerInitState(), - CodeGenerator.plugins.react.containerLifeCycle(), - CodeGenerator.plugins.react.containerMethod(), - CodeGenerator.plugins.react.jsx(), - CodeGenerator.plugins.style.css(), - ], - pages: [ - CodeGenerator.plugins.react.reactCommonDeps(), - CodeGenerator.plugins.common.esmodule({ - fileType: 'jsx', - }), - CodeGenerator.plugins.react.containerClass(), - CodeGenerator.plugins.react.containerInitState(), - CodeGenerator.plugins.react.containerLifeCycle(), - CodeGenerator.plugins.react.containerMethod(), - CodeGenerator.plugins.react.jsx(), - CodeGenerator.plugins.style.css(), - ], - router: [ - CodeGenerator.plugins.common.esmodule(), - CodeGenerator.solutionParts.icejs.plugins.router(), - ], - entry: [ - CodeGenerator.solutionParts.icejs.plugins.entry(), - ], - constants: [ - CodeGenerator.plugins.project.constants(), - ], - utils: [ - CodeGenerator.plugins.common.esmodule(), - CodeGenerator.plugins.project.utils(), - ], - i18n: [ - CodeGenerator.plugins.project.i18n(), - ], - globalStyle: [ - CodeGenerator.solutionParts.icejs.plugins.globalStyle(), - ], - htmlEntry: [ - CodeGenerator.solutionParts.icejs.plugins.entryHtml(), - ], - packageJSON: [ - CodeGenerator.solutionParts.icejs.plugins.packageJSON(), - ], - }, - postProcessors: [ - CodeGenerator.postprocessor.prettier(), - ], - }); - - builder.generateProject(schemaJson).then(result => { - displayResultInConsole(result); - writeResultToDisk(result, 'output/lowcodeDemo').then(response => - console.log('Write to disk: ', JSON.stringify(response)), - ); + writeResultToDisk(result, 'output/lowcodeDemo').then((response) => console.log('Write to disk: ', JSON.stringify(response)),); return result; }); } // main(); // exportModule(); -exportProject(); +// exportProject(); +demo(); diff --git a/packages/code-generator/package.json b/packages/code-generator/package.json index 4f3b87d88..3d9840d6a 100644 --- a/packages/code-generator/package.json +++ b/packages/code-generator/package.json @@ -1,6 +1,6 @@ { "name": "@ali/lowcode-code-generator", - "version": "0.8.10", + "version": "1.0.8-0", "description": "出码引擎 for LowCode Engine", "main": "lib/index.js", "files": [ diff --git a/packages/code-generator/src/const/file.ts b/packages/code-generator/src/const/file.ts new file mode 100644 index 000000000..d29ea43a3 --- /dev/null +++ b/packages/code-generator/src/const/file.ts @@ -0,0 +1,3 @@ +import { FileType } from '../types/core'; + +export const FILE_TYPE_FAMILY = [[FileType.TSX, FileType.TS, FileType.JSX, FileType.JS]]; diff --git a/packages/code-generator/src/generator/ChunkBuilder.ts b/packages/code-generator/src/generator/ChunkBuilder.ts index 18ff63991..67ecd504e 100644 --- a/packages/code-generator/src/generator/ChunkBuilder.ts +++ b/packages/code-generator/src/generator/ChunkBuilder.ts @@ -1,28 +1,72 @@ -import { - BuilderComponentPlugin, - IChunkBuilder, - ICodeChunk, - ICodeStruct, -} from '../types'; +import { BuilderComponentPlugin, IChunkBuilder, ICodeChunk, ICodeStruct, FileType } from '../types'; import { COMMON_SUB_MODULE_NAME } from '../const/generator'; +import { FILE_TYPE_FAMILY } from '../const/file'; + +type ChunkGroupInfo = { + chunk: ICodeChunk; + familyIdx?: number; +}; + +function whichFamily(type: FileType): [number, FileType[]] | undefined { + const idx = FILE_TYPE_FAMILY.findIndex((family) => family.indexOf(type) >= 0); + if (idx < 0) { + return undefined; + } + return [idx, FILE_TYPE_FAMILY[idx]]; +} export const groupChunks = (chunks: ICodeChunk[]): ICodeChunk[][] => { - const col = chunks.reduce( - (chunksSet: Record, chunk) => { - const fileKey = `${chunk.subModule || COMMON_SUB_MODULE_NAME}.${ - chunk.fileType - }`; - if (!chunksSet[fileKey]) { - chunksSet[fileKey] = []; + const tmp: Record> = {}; + const col = chunks.reduce((chunksSet: Record, chunk) => { + const fileKey = chunk.subModule || COMMON_SUB_MODULE_NAME; + if (!chunksSet[fileKey]) { + chunksSet[fileKey] = []; + } + const res = whichFamily(chunk.fileType as FileType); + const info: ChunkGroupInfo = { + chunk, + }; + if (res) { + const [familyIdx, family] = res; + const rank = family.indexOf(chunk.fileType as FileType); + if (tmp[fileKey]) { + if (tmp[fileKey][familyIdx] !== undefined) { + if (tmp[fileKey][familyIdx] > rank) { + tmp[fileKey][familyIdx] = rank; + } + } else { + tmp[fileKey][familyIdx] = rank; + } + } else { + tmp[fileKey] = {}; + tmp[fileKey][familyIdx] = rank; } - chunksSet[fileKey].push(chunk); - return chunksSet; - }, - {}, - ); + info.familyIdx = familyIdx; + } - return Object.keys(col).map(key => col[key]); + chunksSet[fileKey].push(info); + return chunksSet; + }, {}); + + const result: ICodeChunk[][] = []; + Object.keys(col).forEach((key) => { + const byType: Record = {}; + col[key].forEach((info) => { + let t: string = info.chunk.fileType; + if (info.familyIdx !== undefined) { + t = FILE_TYPE_FAMILY[info.familyIdx][tmp[key][info.familyIdx]]; + info.chunk.fileType = t; + } + if (!byType[t]) { + byType[t] = []; + } + byType[t].push(info.chunk); + }); + result.push(...Object.keys(byType).map((t) => byType[t])); + }); + + return result; }; /** @@ -39,7 +83,7 @@ export default class ChunkBuilder implements IChunkBuilder { this.plugins = plugins; } - public async run( + async run( ir: unknown, initialStructure: ICodeStruct = { ir, @@ -64,11 +108,11 @@ export default class ChunkBuilder implements IChunkBuilder { }; } - public getPlugins() { + getPlugins() { return this.plugins; } - public addPlugin(plugin: BuilderComponentPlugin) { + addPlugin(plugin: BuilderComponentPlugin) { this.plugins.push(plugin); } } diff --git a/packages/code-generator/src/generator/ModuleBuilder.ts b/packages/code-generator/src/generator/ModuleBuilder.ts index 991ffedec..063434cb4 100644 --- a/packages/code-generator/src/generator/ModuleBuilder.ts +++ b/packages/code-generator/src/generator/ModuleBuilder.ts @@ -37,29 +37,23 @@ export function createModuleBuilder( const generateModule = async (input: unknown): Promise => { const moduleMainName = options.mainFileName || COMMON_SUB_MODULE_NAME; if (chunkGenerator.getPlugins().length <= 0) { - throw new CodeGeneratorError( - 'No plugins found. Component generation cannot work without any plugins!', - ); + throw new CodeGeneratorError('No plugins found. Component generation cannot work without any plugins!'); } let files: IResultFile[] = []; const { chunks } = await chunkGenerator.run(input); - chunks.forEach(fileChunkList => { + chunks.forEach((fileChunkList) => { const content = linker.link(fileChunkList); - const file = new ResultFile( - fileChunkList[0].subModule || moduleMainName, - fileChunkList[0].fileType, - content, - ); + const file = new ResultFile(fileChunkList[0].subModule || moduleMainName, fileChunkList[0].fileType, content); files.push(file); }); if (options.postProcessors.length > 0) { - files = files.map(file => { + files = files.map((file) => { let content = file.content; const type = file.ext; - options.postProcessors.forEach(processer => { + options.postProcessors.forEach((processer) => { content = processer(content, type); }); @@ -81,25 +75,18 @@ export function createModuleBuilder( const { files } = await generateModule(containerInfo); const dir = new ResultDir(containerInfo.moduleName); - files.forEach(file => dir.addFile(file)); + files.forEach((file) => dir.addFile(file)); return dir; - } + }; - const linkCodeChunks = ( - chunks: Record, - fileName: string, - ) => { + const linkCodeChunks = (chunks: Record, fileName: string) => { const files: IResultFile[] = []; - Object.keys(chunks).forEach(fileKey => { + Object.keys(chunks).forEach((fileKey) => { const fileChunkList = chunks[fileKey]; const content = linker.link(fileChunkList); - const file = new ResultFile( - fileChunkList[0].subModule || fileName, - fileChunkList[0].fileType, - content, - ); + const file = new ResultFile(fileChunkList[0].subModule || fileName, fileChunkList[0].fileType, content); files.push(file); }); diff --git a/packages/code-generator/src/parser/SchemaParser.ts b/packages/code-generator/src/parser/SchemaParser.ts index d4ea59ead..ddb9e4c1c 100644 --- a/packages/code-generator/src/parser/SchemaParser.ts +++ b/packages/code-generator/src/parser/SchemaParser.ts @@ -124,17 +124,6 @@ class SchemaParser implements ISchemaParser { internalDeps[dep.moduleName] = dep; }); - // 分析容器内部组件依赖 - containers.forEach((container) => { - if (container.children) { - const depNames = this.getComponentNames(container.children); - container.deps = uniqueArray(depNames, (i: string) => i) - .map((depName) => internalDeps[depName] || compDeps[depName]) - .filter((dep) => !!dep); - // container.deps = Object.keys(compDeps).map((depName) => compDeps[depName]); - } - }); - // TODO: 不应该在出码部分解决? // 处理 children 写在了 props 里的情况 containers.forEach((container) => { @@ -156,6 +145,17 @@ class SchemaParser implements ISchemaParser { } }); + // 分析容器内部组件依赖 + containers.forEach((container) => { + if (container.children) { + const depNames = this.getComponentNames(container.children); + container.deps = uniqueArray(depNames, (i: string) => i) + .map((depName) => internalDeps[depName] || compDeps[depName]) + .filter((dep) => !!dep); + // container.deps = Object.keys(compDeps).map((depName) => compDeps[depName]); + } + }); + // 分析路由配置 const routes = containers .filter((container) => container.containerType === 'Page') diff --git a/packages/code-generator/src/plugins/component/react/containerDataSource.ts b/packages/code-generator/src/plugins/component/react/containerDataSource.ts index 72d7efd6b..b60cb9539 100644 --- a/packages/code-generator/src/plugins/component/react/containerDataSource.ts +++ b/packages/code-generator/src/plugins/component/react/containerDataSource.ts @@ -13,7 +13,7 @@ import { type PluginConfig = { fileType: string; -} +}; const pluginFactory: BuilderComponentPluginFactory = (config?) => { const cfg: PluginConfig = { @@ -30,9 +30,9 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => if (ir.state) { const state = ir.state; - const fields = Object.keys(state).map(stateName => { - const [isString, value] = generateCompositeType(state[stateName]); - return `${stateName}: ${isString ? `'${value}'` : value},`; + const fields = Object.keys(state).map((stateName) => { + const value = generateCompositeType(state[stateName]); + return `${stateName}: ${value},`; }); next.chunks.push({ diff --git a/packages/code-generator/src/plugins/component/react/containerInitState.ts b/packages/code-generator/src/plugins/component/react/containerInitState.ts index 50984c961..9550244f1 100644 --- a/packages/code-generator/src/plugins/component/react/containerInitState.ts +++ b/packages/code-generator/src/plugins/component/react/containerInitState.ts @@ -14,7 +14,7 @@ import { type PluginConfig = { fileType: string; implementType: 'inConstructor' | 'insMember' | 'hooks'; -} +}; const pluginFactory: BuilderComponentPluginFactory = (config?) => { const cfg: PluginConfig = { @@ -32,9 +32,9 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => if (ir.state) { const state = ir.state; - const fields = Object.keys(state).map(stateName => { - const [isString, value] = generateCompositeType(state[stateName]); - return `${stateName}: ${isString ? `'${value}'` : value},`; + const fields = Object.keys(state).map((stateName) => { + const value = generateCompositeType(state[stateName]); + return `${stateName}: ${value},`; }); if (cfg.implementType === 'inConstructor') { diff --git a/packages/code-generator/src/plugins/component/recore/pageDataSource.ts b/packages/code-generator/src/plugins/component/recore/pageDataSource.ts index 2c580e72f..8464ff180 100644 --- a/packages/code-generator/src/plugins/component/recore/pageDataSource.ts +++ b/packages/code-generator/src/plugins/component/recore/pageDataSource.ts @@ -11,7 +11,7 @@ import { CompositeValue, } from '../../../types'; -import { generateCompositeType, handleStringValueDefault } from '../../../utils/compositeType'; +import { generateCompositeType } from '../../../utils/compositeType'; import { generateExpression } from '../../../utils/jsExpression'; function packJsExpression(exp: unknown): string { @@ -35,19 +35,17 @@ const pluginFactory: BuilderComponentPluginFactory = () => { const extConfigs = Object.keys(rest).map((extConfigName) => { const value = (rest as Record)[extConfigName]; - const [isString, valueStr] = generateCompositeType(value); - return `${extConfigName}: ${isString ? `'${valueStr}'` : valueStr}`; + const valueStr = generateCompositeType(value); + return `${extConfigName}: ${valueStr}`; }); attrs = [...attrs, ...extConfigs]; - const listProp = handleStringValueDefault( - generateCompositeType((list as unknown) as CompositeValue, { - handlers: { - expression: packJsExpression, - }, - }), - ); + const listProp = generateCompositeType((list as unknown) as CompositeValue, { + handlers: { + expression: packJsExpression, + }, + }); attrs.push(`list: ${listProp}`); diff --git a/packages/code-generator/src/plugins/component/recore/pageVmBody.ts b/packages/code-generator/src/plugins/component/recore/pageVmBody.ts index ce09d5e50..9f5a33d7c 100644 --- a/packages/code-generator/src/plugins/component/recore/pageVmBody.ts +++ b/packages/code-generator/src/plugins/component/recore/pageVmBody.ts @@ -13,7 +13,7 @@ import { COMMON_CHUNK_NAME } from '../../../const/generator'; import { createNodeGenerator, generateString } from '../../../utils/nodeToJSX'; import { generateExpression } from '../../../utils/jsExpression'; -import { generateCompositeType, handleStringValueDefault } from '../../../utils/compositeType'; +import { generateCompositeType } from '../../../utils/compositeType'; const generateGlobalProps = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeItem): CodePiece[] => { return [ @@ -28,7 +28,7 @@ const generateCtrlLine = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeIt const pieces: CodePiece[] = []; if (nodeItem.loop && nodeItem.loopArgs) { - const loopDataExp = handleStringValueDefault(generateCompositeType(nodeItem.loop)); + const loopDataExp = generateCompositeType(nodeItem.loop); pieces.push({ type: PIECE_TYPE.ATTR, value: `x-for={${loopDataExp}}`, @@ -41,7 +41,7 @@ const generateCtrlLine = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeIt } if (nodeItem.condition) { - const conditionExp = handleStringValueDefault(generateCompositeType(nodeItem.condition)); + const conditionExp = generateCompositeType(nodeItem.condition); pieces.push({ type: PIECE_TYPE.ATTR, value: `x-if={${conditionExp}}`, diff --git a/packages/code-generator/src/plugins/project/constants.ts b/packages/code-generator/src/plugins/project/constants.ts index 392a0b96d..d274499b4 100644 --- a/packages/code-generator/src/plugins/project/constants.ts +++ b/packages/code-generator/src/plugins/project/constants.ts @@ -17,7 +17,7 @@ const pluginFactory: BuilderComponentPluginFactory = () => { const ir = next.ir as IProjectInfo; if (ir.constants) { - const [, constantStr] = generateCompositeType(ir.constants); + const constantStr = generateCompositeType(ir.constants); next.chunks.push({ type: ChunkType.STRING, diff --git a/packages/code-generator/src/plugins/project/i18n.ts b/packages/code-generator/src/plugins/project/i18n.ts index cada1fd96..4e4675a04 100644 --- a/packages/code-generator/src/plugins/project/i18n.ts +++ b/packages/code-generator/src/plugins/project/i18n.ts @@ -17,7 +17,7 @@ const pluginFactory: BuilderComponentPluginFactory = () => { const ir = next.ir as IProjectInfo; if (ir.i18n) { - const [, i18nStr] = generateCompositeType(ir.i18n); + const i18nStr = generateCompositeType(ir.i18n); next.chunks.push({ type: ChunkType.STRING, diff --git a/packages/code-generator/src/types/core.ts b/packages/code-generator/src/types/core.ts index 489bf17d9..c50d8cd61 100644 --- a/packages/code-generator/src/types/core.ts +++ b/packages/code-generator/src/types/core.ts @@ -179,6 +179,7 @@ export interface INodeGeneratorContext { // } export type CompositeValueCustomHandler = (data: unknown) => string; +export type CompositeTypeContainerHandler = (value: string) => string; export interface CompositeValueCustomHandlerSet { boolean?: CompositeValueCustomHandler; number?: CompositeValueCustomHandler; @@ -188,7 +189,13 @@ export interface CompositeValueCustomHandlerSet { expression?: CompositeValueCustomHandler; } +export interface CompositeTypeContainerHandlerSet { + default?: CompositeTypeContainerHandler; + string?: CompositeValueCustomHandler; +} + export interface CompositeValueGeneratorOptions { handlers?: CompositeValueCustomHandlerSet; + containerHandlers?: CompositeTypeContainerHandlerSet; nodeGenerator?: NodeGenerator; } diff --git a/packages/code-generator/src/utils/compositeType.ts b/packages/code-generator/src/utils/compositeType.ts index 0bb6891b8..edab55873 100644 --- a/packages/code-generator/src/utils/compositeType.ts +++ b/packages/code-generator/src/utils/compositeType.ts @@ -3,10 +3,18 @@ import { CompositeValue, ICompositeObject, CompositeValueGeneratorOptions, + CompositeTypeContainerHandlerSet, CodeGeneratorError, } from '../types'; import { generateExpression, generateFunction, isJsExpression, isJsFunction } from './jsExpression'; import { isJsSlot, generateJsSlot } from './jsSlot'; +import { isValidIdentifier } from './validate'; +import { camelize } from './common'; + +const defaultContainerHandlers: CompositeTypeContainerHandlerSet = { + default: (v) => v, + string: (v) => `'${v}'`, +}; function generateArray(value: CompositeArray, options: CompositeValueGeneratorOptions = {}): string { const body = value.map((v) => generateUnknownType(v, options)).join(','); @@ -34,8 +42,25 @@ function generateObject(value: ICompositeObject, options: CompositeValueGenerato const body = Object.keys(value) .map((key) => { + let propName = key; + + // TODO: 可以增加更多智能修复的方法 + const fixMethods: Array<(v: string) => string> = [camelize]; + // Try to fix propName + while (!isValidIdentifier(propName)) { + const fixMethod = fixMethods.pop(); + if (fixMethod) { + try { + propName = fixMethod(propName); + } catch (error) { + throw new CodeGeneratorError(error.message); + } + } else { + throw new CodeGeneratorError(`Propname: ${key} is not a valid identifier.`); + } + } const v = generateUnknownType(value[key], options); - return `${key}: ${v}`; + return `${propName}: ${v}`; }) .join(',\n'); @@ -66,22 +91,16 @@ export function generateUnknownType(value: CompositeValue, options: CompositeVal return `${value}`; } -export function generateCompositeType( - value: CompositeValue, - options: CompositeValueGeneratorOptions = {}, -): [boolean, string] { +export function generateCompositeType(value: CompositeValue, options: CompositeValueGeneratorOptions = {}): string { const result = generateUnknownType(value, options); + const containerHandlers = { + ...defaultContainerHandlers, + ...(options.containerHandlers || {}), + }; - if (result.substr(0, 1) === "'" && result.substr(-1, 1) === "'") { - return [true, result.substring(1, result.length - 1)]; + const isStringType = result.substr(0, 1) === "'" && result.substr(-1, 1) === "'"; + if (isStringType) { + return (containerHandlers.string && containerHandlers.string(result.substring(1, result.length - 1))) || ''; } - - return [false, result]; -} - -export function handleStringValueDefault([isString, result]: [boolean, string]) { - if (isString) { - return `'${result}'`; - } - return result; + return (containerHandlers.default && containerHandlers.default(result)) || ''; } diff --git a/packages/code-generator/src/utils/nodeToJSX.ts b/packages/code-generator/src/utils/nodeToJSX.ts index 428a9aed9..39791d7cd 100644 --- a/packages/code-generator/src/utils/nodeToJSX.ts +++ b/packages/code-generator/src/utils/nodeToJSX.ts @@ -104,12 +104,16 @@ export function generateAttr(ctx: INodeGeneratorContext, attrName: string, attrV if (attrName === 'initValue') { return []; } - const [isString, valueStr] = generateCompositeType(attrValue, { + const valueStr = generateCompositeType(attrValue, { + containerHandlers: { + default: (v) => `{${v}}`, + string: (v) => `"${v}"`, + }, nodeGenerator: ctx.generator, }); return [ { - value: `${attrName}=${isString ? `"${valueStr}"` : `{${valueStr}}`}`, + value: `${attrName}=${valueStr}`, type: PIECE_TYPE.ATTR, }, ]; @@ -162,15 +166,13 @@ export function generateBasicNode( export function generateReactCtrlLine(ctx: INodeGeneratorContext, nodeItem: IComponentNodeItem): CodePiece[] { const pieces: CodePiece[] = []; - if (nodeItem.loop && nodeItem.loopArgs) { - let loopDataExp; - if (isJsExpression(nodeItem.loop)) { - loopDataExp = `(${generateExpression(nodeItem.loop)})`; - } else { - loopDataExp = JSON.stringify(nodeItem.loop); - } + if (nodeItem.loop) { + const args: [string, string] = nodeItem.loopArgs || ['item', 'index']; + const loopData = generateCompositeType(nodeItem.loop, { + nodeGenerator: ctx.generator, + }); pieces.unshift({ - value: `${loopDataExp}.map((${nodeItem.loopArgs[0]}, ${nodeItem.loopArgs[1]}) => (`, + value: `(${loopData}).map((${args[0]}, ${args[1]}) => (`, type: PIECE_TYPE.BEFORE, }); pieces.push({ @@ -180,12 +182,12 @@ export function generateReactCtrlLine(ctx: INodeGeneratorContext, nodeItem: ICom } if (nodeItem.condition) { - const [isString, value] = generateCompositeType(nodeItem.condition, { + const value = generateCompositeType(nodeItem.condition, { nodeGenerator: ctx.generator, }); pieces.unshift({ - value: `(${isString ? `'${value}'` : value}) && (`, + value: `(${value}) && (`, type: PIECE_TYPE.BEFORE, }); pieces.push({ @@ -194,7 +196,7 @@ export function generateReactCtrlLine(ctx: INodeGeneratorContext, nodeItem: ICom }); } - if (nodeItem.condition || (nodeItem.loop && nodeItem.loopArgs)) { + if (nodeItem.condition || nodeItem.loop) { pieces.unshift({ value: '{', type: PIECE_TYPE.BEFORE, diff --git a/packages/demo-server/.eslintrc.js b/packages/demo-server/.eslintrc.js new file mode 100644 index 000000000..0ae17cac2 --- /dev/null +++ b/packages/demo-server/.eslintrc.js @@ -0,0 +1,24 @@ +module.exports = { + parser: '@typescript-eslint/parser', + parserOptions: { + project: 'tsconfig.json', + sourceType: 'module', + }, + plugins: ['@typescript-eslint/eslint-plugin'], + extends: [ + 'plugin:@typescript-eslint/eslint-recommended', + 'plugin:@typescript-eslint/recommended', + 'prettier', + 'prettier/@typescript-eslint', + ], + root: true, + env: { + node: true, + jest: true, + }, + rules: { + '@typescript-eslint/interface-name-prefix': 'off', + '@typescript-eslint/explicit-function-return-type': 'off', + '@typescript-eslint/no-explicit-any': 'off', + }, +}; diff --git a/packages/demo-server/.prettierrc b/packages/demo-server/.prettierrc new file mode 100644 index 000000000..dcb72794f --- /dev/null +++ b/packages/demo-server/.prettierrc @@ -0,0 +1,4 @@ +{ + "singleQuote": true, + "trailingComma": "all" +} \ No newline at end of file diff --git a/packages/demo-server/CHANGELOG.md b/packages/demo-server/CHANGELOG.md new file mode 100644 index 000000000..c62096d70 --- /dev/null +++ b/packages/demo-server/CHANGELOG.md @@ -0,0 +1,124 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + + +## [1.0.8-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.7-0...@ali/lowcode-demo-server@1.0.8-0) (2020-09-09) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.7-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.6-0...@ali/lowcode-demo-server@1.0.7-0) (2020-09-02) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.6-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.5-0...@ali/lowcode-demo-server@1.0.6-0) (2020-09-02) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.5-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.4-0...@ali/lowcode-demo-server@1.0.5-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.4-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.3-0...@ali/lowcode-demo-server@1.0.4-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.3-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.2-0...@ali/lowcode-demo-server@1.0.3-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.2-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.1-0...@ali/lowcode-demo-server@1.0.2-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +## [1.0.1-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@1.0.0...@ali/lowcode-demo-server@1.0.1-0) (2020-08-20) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [1.0.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.14.0...@ali/lowcode-demo-server@1.0.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [0.14.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.13.0...@ali/lowcode-demo-server@0.14.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [0.13.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.11.0...@ali/lowcode-demo-server@0.13.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [0.12.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.11.0...@ali/lowcode-demo-server@0.12.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [0.11.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.10.0...@ali/lowcode-demo-server@0.11.0) (2020-08-16) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# [0.10.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo-server@0.9.0...@ali/lowcode-demo-server@0.10.0) (2020-08-14) + + + + +**Note:** Version bump only for package @ali/lowcode-demo-server + + +# 0.9.0 (2020-08-14) + + +### Features + +* 🎸 add demo-server ([df35c6a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/df35c6a)) diff --git a/packages/demo-server/README.md b/packages/demo-server/README.md new file mode 100644 index 000000000..a59ef9241 --- /dev/null +++ b/packages/demo-server/README.md @@ -0,0 +1,75 @@ +

+ Nest Logo +

+ +[travis-image]: https://api.travis-ci.org/nestjs/nest.svg?branch=master +[travis-url]: https://travis-ci.org/nestjs/nest +[linux-image]: https://img.shields.io/travis/nestjs/nest/master.svg?label=linux +[linux-url]: https://travis-ci.org/nestjs/nest + +

A progressive Node.js framework for building efficient and scalable server-side applications, heavily inspired by Angular.

+

+NPM Version +Package License +NPM Downloads +Travis +Linux +Coverage +Gitter +Backers on Open Collective +Sponsors on Open Collective + + +

+ + +## Description + +[Nest](https://github.com/nestjs/nest) framework TypeScript starter repository. + +## Installation + +```bash +$ npm install +``` + +## Running the app + +```bash +# development +$ npm run start + +# watch mode +$ npm run start:dev + +# production mode +$ npm run start:prod +``` + +## Test + +```bash +# unit tests +$ npm run test + +# e2e tests +$ npm run test:e2e + +# test coverage +$ npm run test:cov +``` + +## Support + +Nest is an MIT-licensed open source project. It can grow thanks to the sponsors and support by the amazing backers. If you'd like to join them, please [read more here](https://docs.nestjs.com/support). + +## Stay in touch + +- Author - [Kamil Myśliwiec](https://kamilmysliwiec.com) +- Website - [https://nestjs.com](https://nestjs.com/) +- Twitter - [@nestframework](https://twitter.com/nestframework) + +## License + + Nest is [MIT licensed](LICENSE). diff --git a/packages/demo-server/nest-cli.json b/packages/demo-server/nest-cli.json new file mode 100644 index 000000000..56167b36a --- /dev/null +++ b/packages/demo-server/nest-cli.json @@ -0,0 +1,4 @@ +{ + "collection": "@nestjs/schematics", + "sourceRoot": "src" +} diff --git a/packages/demo-server/package.json b/packages/demo-server/package.json new file mode 100644 index 000000000..4a61251f7 --- /dev/null +++ b/packages/demo-server/package.json @@ -0,0 +1,66 @@ +{ + "name": "@ali/lowcode-demo-server", + "version": "1.0.8-0", + "private": true, + "description": "低代码引擎 DEMO Server 端", + "scripts": { + "prebuild": "rimraf dist", + "format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"", + "lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix", + "start": "nest start", + "start:debug": "nest start --debug --watch", + "start:dev": "nest start --watch", + "start:prod": "node dist/main", + "test": "jest", + "test:cov": "jest --coverage", + "test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand", + "test:e2e": "jest --config ./test/jest-e2e.json", + "test:watch": "jest --watch" + }, + "jest": { + "coverageDirectory": "../coverage", + "moduleFileExtensions": [ + "js", + "json", + "ts" + ], + "rootDir": "src", + "testEnvironment": "node", + "testRegex": ".spec.ts$", + "transform": { + "^.+\\.(t|j)s$": "ts-jest" + } + }, + "dependencies": { + "@ali/lowcode-code-generator": "0.8.8", + "@nestjs/common": "^7.0.0", + "@nestjs/core": "^7.0.0", + "@nestjs/platform-express": "^7.0.0", + "jszip": "^3.5.0", + "reflect-metadata": "^0.1.13", + "rimraf": "^3.0.2", + "rxjs": "^6.5.4" + }, + "devDependencies": { + "@nestjs/cli": "^7.0.0", + "@nestjs/schematics": "^7.0.0", + "@nestjs/testing": "^7.0.0", + "@types/express": "^4.17.3", + "@types/jest": "25.2.3", + "@types/node": "^13.9.1", + "@types/supertest": "^2.0.8", + "@typescript-eslint/eslint-plugin": "3.0.2", + "@typescript-eslint/parser": "3.0.2", + "eslint": "7.1.0", + "eslint-config-prettier": "^6.10.0", + "eslint-plugin-import": "^2.20.1", + "jest": "26.0.1", + "prettier": "^1.19.1", + "supertest": "^4.0.2", + "ts-jest": "26.1.0", + "ts-loader": "^6.2.1", + "ts-node": "^8.6.2", + "tsconfig-paths": "^3.9.0", + "typescript": "^3.7.4" + } +} diff --git a/packages/demo-server/src/api/api.controller.spec.ts b/packages/demo-server/src/api/api.controller.spec.ts new file mode 100644 index 000000000..2103b3840 --- /dev/null +++ b/packages/demo-server/src/api/api.controller.spec.ts @@ -0,0 +1,18 @@ +import { Test, TestingModule } from '@nestjs/testing'; +import { ApiController } from './api.controller'; + +describe('Api Controller', () => { + let controller: ApiController; + + beforeEach(async () => { + const module: TestingModule = await Test.createTestingModule({ + controllers: [ApiController], + }).compile(); + + controller = module.get(ApiController); + }); + + it('should be defined', () => { + expect(controller).toBeDefined(); + }); +}); diff --git a/packages/demo-server/src/api/api.controller.ts b/packages/demo-server/src/api/api.controller.ts new file mode 100644 index 000000000..c7a23ec5c --- /dev/null +++ b/packages/demo-server/src/api/api.controller.ts @@ -0,0 +1,21 @@ +import { Controller, Res, Get, Post, Body, Header } from '@nestjs/common'; +import { Response } from 'express'; +import { ApiService } from './api.service'; +import { GenerateProjectDto } from '../dto/generate-project.dto'; + +@Controller('api') +export class ApiController { + constructor(private readonly apiService: ApiService) {} + + @Get('generate/test') + generateTest() { + return 'generate test'; + } + + @Post('generate/project') + @Header('Content-Type', 'application/zip') + async generateProject(@Res() res: Response, @Body() dto: GenerateProjectDto) { + const file = await this.apiService.generateProject(dto.schema); + file.pipe(res); + } +} diff --git a/packages/demo-server/src/api/api.service.spec.ts b/packages/demo-server/src/api/api.service.spec.ts new file mode 100644 index 000000000..fae6fe722 --- /dev/null +++ b/packages/demo-server/src/api/api.service.spec.ts @@ -0,0 +1,18 @@ +import { Test, TestingModule } from '@nestjs/testing'; +import { ApiService } from './api.service'; + +describe('ApiService', () => { + let service: ApiService; + + beforeEach(async () => { + const module: TestingModule = await Test.createTestingModule({ + providers: [ApiService], + }).compile(); + + service = module.get(ApiService); + }); + + it('should be defined', () => { + expect(service).toBeDefined(); + }); +}); diff --git a/packages/demo-server/src/api/api.service.ts b/packages/demo-server/src/api/api.service.ts new file mode 100644 index 000000000..47af7af3d --- /dev/null +++ b/packages/demo-server/src/api/api.service.ts @@ -0,0 +1,30 @@ +import * as os from 'os'; +import * as path from 'path'; +import * as fs from 'fs'; +import { Injectable } from '@nestjs/common'; +import CodeGenerator from '@ali/lowcode-code-generator'; +import { createZipPublisher } from '../publisher'; + +@Injectable() +export class ApiService { + async generateProject(schema: string) { + const tmpDir = os.tmpdir(); + const createIceJsProjectBuilder = CodeGenerator.solutions.icejs; + const builder = createIceJsProjectBuilder(); + const publisher = createZipPublisher({ + outputPath: tmpDir, + projectSlug: 'demo-project', + }); + const filePath = path.join(tmpDir, 'demo-project.zip'); + + const result = await builder.generateProject(schema); + publisher.setProject(result); + const response = await publisher.publish(); + if (!response.success) { + throw new Error('generateProject failed'); + } + return fs.createReadStream(filePath); + + // return filePath; + } +} diff --git a/packages/demo-server/src/app.controller.spec.ts b/packages/demo-server/src/app.controller.spec.ts new file mode 100644 index 000000000..d22f3890a --- /dev/null +++ b/packages/demo-server/src/app.controller.spec.ts @@ -0,0 +1,22 @@ +import { Test, TestingModule } from '@nestjs/testing'; +import { AppController } from './app.controller'; +import { AppService } from './app.service'; + +describe('AppController', () => { + let appController: AppController; + + beforeEach(async () => { + const app: TestingModule = await Test.createTestingModule({ + controllers: [AppController], + providers: [AppService], + }).compile(); + + appController = app.get(AppController); + }); + + describe('root', () => { + it('should return "Hello World!"', () => { + expect(appController.getHello()).toBe('Hello World!'); + }); + }); +}); diff --git a/packages/demo-server/src/app.controller.ts b/packages/demo-server/src/app.controller.ts new file mode 100644 index 000000000..cce879ee6 --- /dev/null +++ b/packages/demo-server/src/app.controller.ts @@ -0,0 +1,12 @@ +import { Controller, Get } from '@nestjs/common'; +import { AppService } from './app.service'; + +@Controller() +export class AppController { + constructor(private readonly appService: AppService) {} + + @Get() + getHello(): string { + return this.appService.getHello(); + } +} diff --git a/packages/demo-server/src/app.module.ts b/packages/demo-server/src/app.module.ts new file mode 100644 index 000000000..4b3b55608 --- /dev/null +++ b/packages/demo-server/src/app.module.ts @@ -0,0 +1,12 @@ +import { Module } from '@nestjs/common'; +import { AppController } from './app.controller'; +import { AppService } from './app.service'; +import { ApiController } from './api/api.controller'; +import { ApiService } from './api/api.service'; + +@Module({ + imports: [], + controllers: [AppController, ApiController], + providers: [AppService, ApiService], +}) +export class AppModule {} diff --git a/packages/demo-server/src/app.service.ts b/packages/demo-server/src/app.service.ts new file mode 100644 index 000000000..927d7cca0 --- /dev/null +++ b/packages/demo-server/src/app.service.ts @@ -0,0 +1,8 @@ +import { Injectable } from '@nestjs/common'; + +@Injectable() +export class AppService { + getHello(): string { + return 'Hello World!'; + } +} diff --git a/packages/demo-server/src/dto/generate-project.dto.spec.ts b/packages/demo-server/src/dto/generate-project.dto.spec.ts new file mode 100644 index 000000000..fb4b92f3a --- /dev/null +++ b/packages/demo-server/src/dto/generate-project.dto.spec.ts @@ -0,0 +1,7 @@ +import { GenerateProjectDto } from './generate-project.dto'; + +describe('GenerateProjectDto', () => { + it('should be defined', () => { + expect(new GenerateProjectDto()).toBeDefined(); + }); +}); diff --git a/packages/demo-server/src/dto/generate-project.dto.ts b/packages/demo-server/src/dto/generate-project.dto.ts new file mode 100644 index 000000000..70c1ba297 --- /dev/null +++ b/packages/demo-server/src/dto/generate-project.dto.ts @@ -0,0 +1,3 @@ +export class GenerateProjectDto { + schema: string; +} diff --git a/packages/demo-server/src/main.ts b/packages/demo-server/src/main.ts new file mode 100644 index 000000000..1b1812cdb --- /dev/null +++ b/packages/demo-server/src/main.ts @@ -0,0 +1,9 @@ +import { NestFactory } from '@nestjs/core'; +import { AppModule } from './app.module'; + +async function bootstrap() { + const app = await NestFactory.create(AppModule); + app.enableCors(); + await app.listen(7002); +} +bootstrap(); diff --git a/packages/demo-server/src/publisher/index.ts b/packages/demo-server/src/publisher/index.ts new file mode 100644 index 000000000..3bd62d4eb --- /dev/null +++ b/packages/demo-server/src/publisher/index.ts @@ -0,0 +1,76 @@ +import { IResultDir } from '@ali/lowcode-code-generator'; +import { isNodeProcess, writeZipToDisk, generateProjectZip } from './utils' + +export type PublisherFactory = (configuration?: Partial) => U; + +export interface IPublisher { + publish: (options?: T) => Promise>; + getProject: () => IResultDir | void; + setProject: (project: IResultDir) => void; +} + +export interface IPublisherFactoryParams { + project?: IResultDir; +} +export interface IPublisherResponse { + success: boolean; + payload?: T; +} + +declare type ZipPublisherResponse = string | Buffer | Blob + +export interface ZipFactoryParams extends IPublisherFactoryParams { + outputPath?: string + projectSlug?: string +} + +export interface ZipPublisher extends IPublisher { + getOutputPath: () => string + setOutputPath: (path: string) => void +} + +export const createZipPublisher: PublisherFactory = ( + params: ZipFactoryParams = {} +): ZipPublisher => { + let { project, outputPath } = params + + const getProject = () => project + const setProject = (projectToSet: IResultDir) => { + project = projectToSet + } + + const getOutputPath = () => outputPath + const setOutputPath = (path: string) => { + outputPath = path + } + + const publish = async (options: ZipFactoryParams = {}) => { + const projectToPublish = options.project || project + if (!projectToPublish) { + throw new Error('MissingProject'); + } + + const zipName = options.projectSlug || params.projectSlug || projectToPublish.name + + try { + const zipContent = await generateProjectZip(projectToPublish) + + // If not output path is provided, zip is not written to disk + const projectOutputPath = options.outputPath || outputPath + if (projectOutputPath && isNodeProcess()) { + await writeZipToDisk(projectOutputPath, zipContent, zipName) + } + return { success: true, payload: zipContent } + } catch (error) { + throw new Error('ZipUnexpected'); + } + } + + return { + publish, + getProject, + setProject, + getOutputPath, + setOutputPath, + } +} diff --git a/packages/demo-server/src/publisher/utils.ts b/packages/demo-server/src/publisher/utils.ts new file mode 100644 index 000000000..0b7b205ff --- /dev/null +++ b/packages/demo-server/src/publisher/utils.ts @@ -0,0 +1,57 @@ +import * as JSZip from 'jszip'; +import { IResultFile, IResultDir } from '@ali/lowcode-code-generator'; + +export const isNodeProcess = (): boolean => { + return ( + typeof process === 'object' && + typeof process.versions === 'object' && + typeof process.versions.node !== 'undefined' + ) +} + +export const writeZipToDisk = ( + zipFolderPath: string, + content: Buffer | Blob, + zipName: string +): void => { + const fs = require('fs') + const path = require('path') + + if (!fs.existsSync(zipFolderPath)) { + fs.mkdirSync(zipFolderPath, { recursive: true }) + } + + const zipPath = path.join(zipFolderPath, `${zipName}.zip`) + + const writeStream = fs.createWriteStream(zipPath) + writeStream.write(content) + writeStream.end() +} + +export const generateProjectZip = async (project: IResultDir): Promise => { + let zip = new JSZip() + zip = writeFolderToZip(project, zip, true) + const zipType = isNodeProcess() ? 'nodebuffer' : 'blob' + return zip.generateAsync({ type: zipType }) +} + +const writeFolderToZip = ( + folder: IResultDir, + parentFolder: JSZip, + ignoreFolder: boolean = false +) => { + const zipFolder = ignoreFolder ? parentFolder : parentFolder.folder(folder.name) + + folder.files.forEach((file: IResultFile) => { + // const options = file.contentEncoding === 'base64' ? { base64: true } : {} + const options = {}; + const fileName = file.ext ? `${file.name}.${file.ext}` : file.name + zipFolder.file(fileName, file.content, options) + }) + + folder.dirs.forEach((subFolder: IResultDir) => { + writeFolderToZip(subFolder, zipFolder) + }) + + return parentFolder +} diff --git a/packages/demo-server/test/app.e2e-spec.ts b/packages/demo-server/test/app.e2e-spec.ts new file mode 100644 index 000000000..50cda6233 --- /dev/null +++ b/packages/demo-server/test/app.e2e-spec.ts @@ -0,0 +1,24 @@ +import { Test, TestingModule } from '@nestjs/testing'; +import { INestApplication } from '@nestjs/common'; +import * as request from 'supertest'; +import { AppModule } from './../src/app.module'; + +describe('AppController (e2e)', () => { + let app: INestApplication; + + beforeEach(async () => { + const moduleFixture: TestingModule = await Test.createTestingModule({ + imports: [AppModule], + }).compile(); + + app = moduleFixture.createNestApplication(); + await app.init(); + }); + + it('/ (GET)', () => { + return request(app.getHttpServer()) + .get('/') + .expect(200) + .expect('Hello World!'); + }); +}); diff --git a/packages/demo-server/test/jest-e2e.json b/packages/demo-server/test/jest-e2e.json new file mode 100644 index 000000000..e9d912f3e --- /dev/null +++ b/packages/demo-server/test/jest-e2e.json @@ -0,0 +1,9 @@ +{ + "moduleFileExtensions": ["js", "json", "ts"], + "rootDir": ".", + "testEnvironment": "node", + "testRegex": ".e2e-spec.ts$", + "transform": { + "^.+\\.(t|j)s$": "ts-jest" + } +} diff --git a/packages/demo-server/tsconfig.build.json b/packages/demo-server/tsconfig.build.json new file mode 100644 index 000000000..64f86c6bd --- /dev/null +++ b/packages/demo-server/tsconfig.build.json @@ -0,0 +1,4 @@ +{ + "extends": "./tsconfig.json", + "exclude": ["node_modules", "test", "dist", "**/*spec.ts"] +} diff --git a/packages/demo-server/tsconfig.json b/packages/demo-server/tsconfig.json new file mode 100644 index 000000000..bf10a2398 --- /dev/null +++ b/packages/demo-server/tsconfig.json @@ -0,0 +1,15 @@ +{ + "compilerOptions": { + "module": "commonjs", + "declaration": true, + "removeComments": true, + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "allowSyntheticDefaultImports": true, + "target": "es2017", + "sourceMap": true, + "outDir": "./dist", + "baseUrl": "./", + "incremental": true + } +} diff --git a/packages/demo/CHANGELOG.md b/packages/demo/CHANGELOG.md index 0255f6927..c6b31221b 100644 --- a/packages/demo/CHANGELOG.md +++ b/packages/demo/CHANGELOG.md @@ -3,46 +3,289 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. - -## [0.8.52](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.51...@ali/lowcode-demo@0.8.52) (2020-08-14) + +## [1.0.8-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.65...@ali/lowcode-demo@1.0.8-0) (2020-09-09) + + +### Bug Fixes + +* 🐛 更改复杂类型生成工具的接口形式,减少调用复杂度 ([ce616b5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce616b5)) +* 🐛 after event name & TabItem parent limitation ([76fb0b3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/76fb0b3)) +* 🐛 Card component's settings ([f44e7ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f44e7ab)) +* 🐛 Cascader init status ([e4a28c4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e4a28c4)) +* 🐛 codeout btn fix ([afda7d4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/afda7d4)) +* 🐛 Collapse render error ([6fed968](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6fed968)) +* 🐛 fix Menu & MenuButton assets cfg ([3d40aa2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3d40aa2)) +* 🐛 Menu Items ([5ecacef](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/5ecacef)) +* 🐛 save and generator last page ([3e4254c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3e4254c)) +* 🐛 Tab & TabItem assets config ([0cc08fb](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0cc08fb)) +* 🐛 Tag assets ([b460dcf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b460dcf)) +* 🐛 Tag components setting ([de941da](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/de941da)) +* 🐛 Timeline asset config ([436dadd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/436dadd)) +* 🐛 use JsonSetter as dataSource Setter ([553f924](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/553f924)) +* 😈 table 无法选中问题 ([34825f8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/34825f8)) +* 适配Nav组件 ([7e9829f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7e9829f)) +* 修改插件面板配置 ([f9ceda5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f9ceda5)) +* 修改js面板的保存schema问题 ([0ee8892](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0ee8892)) +* demo 中引入locode-editor-general ([1f03857](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1f03857)) +* dropdown and menu schema ([ae1d125](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ae1d125)) +* fix mixsetter style ([0ecce83](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0ecce83)) +* fix NextTable callback function ([ce77375](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce77375)) +* fix source edit bug ([047247c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/047247c)) + + +### Features + +* 🎸 add demo-server ([df35c6a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/df35c6a)) +* 🎸 Box config edit ([49b49ee](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/49b49ee)) +* 🎸 Button update ([7969273](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7969273)) +* 🎸 Collapse component update ([c682cc5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/c682cc5)) +* 🎸 Collapse.panel has drop in Collapse ([d4d41e4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d4d41e4)) +* 🎸 pagination update ([f13b3ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f13b3ab)) +* 🎸 saveload btn for demo ([f91da66](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f91da66)) +* 🎸 update upload component ([10abef5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/10abef5)) +* 🎸 upload update ([f81932b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f81932b)) +* 适配TreeNode节点 ([8c36928](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8c36928)) +* 新增分隔符物料配置 ([af39c17](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af39c17)) +* 新增simulatorurl,可以设置cdn使用simulator ([1f45b05](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1f45b05)) +* 增加出码按钮 ([6f7b066](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6f7b066)) +* 主设置面板里深层次界面通过 stagebox 进行过渡 ([783e945](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/783e945)) +* demo 构造 componentsMap ([f445ffe](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f445ffe)) +* tree 组件修改 ([7efa52f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7efa52f)) + + + + + +## [1.0.7-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@1.0.6-0...@ali/lowcode-demo@1.0.7-0) (2020-09-02) + + + +## [0.8.65](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.64...@ali/lowcode-demo@0.8.65) (2020-09-08) + + +**Note:** Version bump only for package @ali/lowcode-demo + + +## [0.8.64](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.63...@ali/lowcode-demo@0.8.64) (2020-09-03) **Note:** Version bump only for package @ali/lowcode-demo - -## [0.8.51](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.50...@ali/lowcode-demo@0.8.51) (2020-08-07) + +## [0.8.63](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.62...@ali/lowcode-demo@0.8.63) (2020-09-03) **Note:** Version bump only for package @ali/lowcode-demo - -## [0.8.50](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.49...@ali/lowcode-demo@0.8.50) (2020-08-06) + +## [0.8.62](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.61...@ali/lowcode-demo@0.8.62) (2020-08-27) + + +**Note:** Version bump only for package @ali/lowcode-demo + + +## [1.0.6-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.62...@ali/lowcode-demo@1.0.6-0) (2020-09-02) + + +### Bug Fixes + +* 🐛 更改复杂类型生成工具的接口形式,减少调用复杂度 ([ce616b5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce616b5)) +* 🐛 after event name & TabItem parent limitation ([76fb0b3](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/76fb0b3)) +* 🐛 Card component's settings ([f44e7ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f44e7ab)) +* 🐛 Cascader init status ([e4a28c4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e4a28c4)) +* 🐛 codeout btn fix ([afda7d4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/afda7d4)) +* 🐛 Collapse render error ([6fed968](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6fed968)) +* 🐛 fix Menu & MenuButton assets cfg ([3d40aa2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3d40aa2)) +* 🐛 Menu Items ([5ecacef](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/5ecacef)) +* 🐛 save and generator last page ([3e4254c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3e4254c)) +* 🐛 Tab & TabItem assets config ([0cc08fb](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0cc08fb)) +* 🐛 Tag assets ([b460dcf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b460dcf)) +* 🐛 Tag components setting ([de941da](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/de941da)) +* 🐛 Timeline asset config ([436dadd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/436dadd)) +* 🐛 use JsonSetter as dataSource Setter ([553f924](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/553f924)) +* 😈 table 无法选中问题 ([34825f8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/34825f8)) +* 适配Nav组件 ([7e9829f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7e9829f)) +* 修改插件面板配置 ([f9ceda5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f9ceda5)) +* 修改js面板的保存schema问题 ([0ee8892](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0ee8892)) +* dropdown and menu schema ([ae1d125](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ae1d125)) +* fix mixsetter style ([0ecce83](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0ecce83)) +* fix NextTable callback function ([ce77375](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce77375)) +* fix source edit bug ([047247c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/047247c)) + + +### Features + +* 🎸 add demo-server ([df35c6a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/df35c6a)) +* 🎸 Box config edit ([49b49ee](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/49b49ee)) +* 🎸 Button update ([7969273](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7969273)) +* 🎸 Collapse component update ([c682cc5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/c682cc5)) +* 🎸 Collapse.panel has drop in Collapse ([d4d41e4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d4d41e4)) +* 🎸 pagination update ([f13b3ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f13b3ab)) +* 🎸 saveload btn for demo ([f91da66](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f91da66)) +* 🎸 update upload component ([10abef5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/10abef5)) +* 🎸 upload update ([f81932b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f81932b)) +* 适配TreeNode节点 ([8c36928](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8c36928)) +* 新增分隔符物料配置 ([af39c17](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af39c17)) +* 新增simulatorurl,可以设置cdn使用simulator ([1f45b05](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1f45b05)) +* 增加出码按钮 ([6f7b066](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6f7b066)) +* 主设置面板里深层次界面通过 stagebox 进行过渡 ([783e945](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/783e945)) +* demo 构造 componentsMap ([f445ffe](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f445ffe)) +* tree 组件修改 ([7efa52f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7efa52f)) + + + + + +## [1.0.3-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@1.0.2-0...@ali/lowcode-demo@1.0.3-0) (2020-08-20) **Note:** Version bump only for package @ali/lowcode-demo - -## [0.8.49](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.48...@ali/lowcode-demo@0.8.49) (2020-08-06) + +## [1.0.2-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@1.0.1-0...@ali/lowcode-demo@1.0.2-0) (2020-08-20) **Note:** Version bump only for package @ali/lowcode-demo - -## [0.8.48](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.47...@ali/lowcode-demo@0.8.48) (2020-08-06) + +## [1.0.1-0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.57...@ali/lowcode-demo@1.0.1-0) (2020-08-20) + + +### Bug Fixes + +* 🐛 Card component's settings ([f44e7ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f44e7ab)) +* 🐛 Cascader init status ([e4a28c4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e4a28c4)) +* 🐛 codeout btn fix ([afda7d4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/afda7d4)) +* 🐛 Collapse render error ([6fed968](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6fed968)) +* 🐛 save and generator last page ([3e4254c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3e4254c)) +* 🐛 Tab & TabItem assets config ([0cc08fb](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0cc08fb)) +* 🐛 Tag assets ([b460dcf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b460dcf)) +* 🐛 Tag components setting ([de941da](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/de941da)) +* 🐛 use JsonSetter as dataSource Setter ([553f924](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/553f924)) +* 🐛 更改复杂类型生成工具的接口形式,减少调用复杂度 ([ce616b5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce616b5)) +* 😈 table 无法选中问题 ([34825f8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/34825f8)) +* dropdown and menu schema ([ae1d125](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ae1d125)) +* fix source edit bug ([047247c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/047247c)) + + +### Features + +* 🎸 add demo-server ([df35c6a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/df35c6a)) +* 🎸 Box config edit ([49b49ee](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/49b49ee)) +* 🎸 Button update ([7969273](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7969273)) +* 🎸 Collapse component update ([c682cc5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/c682cc5)) +* 🎸 Collapse.panel has drop in Collapse ([d4d41e4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d4d41e4)) +* 🎸 saveload btn for demo ([f91da66](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f91da66)) +* demo 构造 componentsMap ([f445ffe](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f445ffe)) +* 主设置面板里深层次界面通过 stagebox 进行过渡 ([783e945](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/783e945)) +* 增加出码按钮 ([6f7b066](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6f7b066)) +* 新增分隔符物料配置 ([af39c17](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af39c17)) + + + + + +# [1.0.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.15.0...@ali/lowcode-demo@1.0.0) (2020-08-17) **Note:** Version bump only for package @ali/lowcode-demo + +# [0.15.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.14.0...@ali/lowcode-demo@0.15.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo + + +# [0.14.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.12.0...@ali/lowcode-demo@0.14.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo + + +# [0.13.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.12.0...@ali/lowcode-demo@0.13.0) (2020-08-17) + + + + +**Note:** Version bump only for package @ali/lowcode-demo + + +# [0.12.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.11.0...@ali/lowcode-demo@0.12.0) (2020-08-16) + + + + +**Note:** Version bump only for package @ali/lowcode-demo + + +# [0.11.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.10.0...@ali/lowcode-demo@0.11.0) (2020-08-14) + + +### Bug Fixes + +* 🐛 Tab & TabItem assets config ([0cc08fb](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0cc08fb)) + + + + + +# [0.10.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.9.0...@ali/lowcode-demo@0.10.0) (2020-08-14) + + + + +**Note:** Version bump only for package @ali/lowcode-demo + + +# [0.9.0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.47...@ali/lowcode-demo@0.9.0) (2020-08-14) + + +### Bug Fixes + +* 🐛 Card component's settings ([f44e7ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f44e7ab)) +* 🐛 Cascader init status ([e4a28c4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e4a28c4)) +* 🐛 codeout btn fix ([afda7d4](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/afda7d4)) +* 🐛 Collapse render error ([6fed968](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6fed968)) +* 🐛 save and generator last page ([3e4254c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3e4254c)) +* 🐛 Tag assets ([b460dcf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b460dcf)) +* 🐛 Tag components setting ([de941da](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/de941da)) +* 🐛 use JsonSetter as dataSource Setter ([553f924](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/553f924)) +* 🐛 更改复杂类型生成工具的接口形式,减少调用复杂度 ([ce616b5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ce616b5)) +* 😈 table 无法选中问题 ([34825f8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/34825f8)) +* dropdown and menu schema ([ae1d125](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ae1d125)) +* fix source edit bug ([047247c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/047247c)) + + +### Features + +* 🎸 add demo-server ([df35c6a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/df35c6a)) +* 🎸 Box config edit ([49b49ee](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/49b49ee)) +* 🎸 Button update ([7969273](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7969273)) +* 🎸 saveload btn for demo ([f91da66](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f91da66)) +* demo 构造 componentsMap ([f445ffe](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f445ffe)) +* 主设置面板里深层次界面通过 stagebox 进行过渡 ([783e945](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/783e945)) +* 增加出码按钮 ([6f7b066](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6f7b066)) +* 新增分隔符物料配置 ([af39c17](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af39c17)) + + + + ## [0.8.47](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.46...@ali/lowcode-demo@0.8.47) (2020-08-04) @@ -440,10 +683,5 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline ### Features -<<<<<<< HEAD * complet preview ([56c16ff](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/56c16ff)) * double outline & ZH_EN support ([b379bd7](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b379bd7)) -======= -* complet preview ([56c16ff](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/56c16ffa5c39c2d01abd9cfa90fea49a4539da1d)) -* double outline & ZH_EN support ([b379bd7](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/b379bd7c0c488ef24f825760750a13d3fa083c96)) ->>>>>>> df955e1db90ff104cd11160def80113cfd6faccc diff --git a/packages/demo/package.json b/packages/demo/package.json index 2f7d352d7..27c8194ed 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -1,6 +1,6 @@ { "name": "@ali/lowcode-demo", - "version": "0.8.52", + "version": "1.0.8-0", "private": true, "description": "低代码引擎 DEMO", "scripts": { @@ -9,21 +9,21 @@ }, "config": {}, "dependencies": { - "@ali/lowcode-editor-core": "^0.8.28", - "@ali/lowcode-editor-skeleton": "^0.8.48", - "@ali/lowcode-plugin-components-pane": "^0.8.44", - "@ali/lowcode-plugin-designer": "^0.9.42", - "@ali/lowcode-plugin-event-bind-dialog": "^0.8.27", - "@ali/lowcode-plugin-outline-pane": "^0.8.48", - "@ali/lowcode-plugin-sample-logo": "^0.8.26", - "@ali/lowcode-plugin-sample-preview": "^0.8.46", + "@ali/lowcode-editor-core": "^1.0.8-0", + "@ali/lowcode-editor-skeleton": "^1.0.8-0", + "@ali/lowcode-plugin-components-pane": "^1.0.8-0", + "@ali/lowcode-plugin-designer": "^1.0.8-0", + "@ali/lowcode-plugin-event-bind-dialog": "^1.0.8-0", + "@ali/lowcode-plugin-outline-pane": "^1.0.8-0", + "@ali/lowcode-plugin-sample-logo": "^1.0.8-0", + "@ali/lowcode-plugin-sample-preview": "^1.0.8-0", "@ali/lowcode-plugin-settings-pane": "^0.8.8", - "@ali/lowcode-plugin-undo-redo": "^0.8.46", - "@ali/lowcode-plugin-variable-bind-dialog": "^0.8.25", - "@ali/lowcode-plugin-zh-en": "^0.8.29", - "@ali/lowcode-react-renderer": "^0.8.18", - "@ali/lowcode-runtime": "^0.8.16", - "@ali/lowcode-utils": "^0.8.16", + "@ali/lowcode-plugin-undo-redo": "^1.0.8-0", + "@ali/lowcode-plugin-variable-bind-dialog": "^1.0.8-0", + "@ali/lowcode-plugin-zh-en": "^1.0.8-0", + "@ali/lowcode-react-renderer": "^1.0.8-0", + "@ali/lowcode-runtime": "^1.0.8-0", + "@ali/lowcode-utils": "^1.0.8-0", "@ali/ve-action-pane": "^4.7.0-beta.0", "@ali/ve-datapool-pane": "^6.4.3", "@ali/ve-history-pane": "4.0.0", diff --git a/packages/demo/public/assets.json b/packages/demo/public/assets.json index 0aaf570e0..24b3061c6 100644 --- a/packages/demo/public/assets.json +++ b/packages/demo/public/assets.json @@ -13,6 +13,13 @@ "urls": ["https://unpkg.antfin-inc.com/@alifd/next@1.20.0/dist/next.js", "https://unpkg.antfin-inc.com/@alifd/next@1.20.0/dist/next.css"], "library": "Next" }, + { + "title": "NextTable", + "package": "NextTable", + "version": "1.0.0", + "urls": ["http://alifd.alibabausercontent.com/materials/NextTable.js", "http://alifd.alibabausercontent.com/materials/NextTable.css"], + "library": "NextTable" + }, { "title": "MCBreadcrumb", "package": "mc-breadcrumb", @@ -28,7 +35,10 @@ "props": [ { "name": "style", - "propType": "object" + "propType": "object", + "defaultValue": { + "padding": 12 + } } ], "configure": { @@ -57,6 +67,99 @@ } } }, + { + "componentName": "a", + "title": "Link", + "npm": { + "exportName": "a" + }, + "props": [ + { + "name": "href", + "title": "链接", + "propType": "string", + "defaultValue": "https://fusion.design" + }, + { + "name": "children", + "title": "内容", + "propType": { + "type": "oneOfType", + "value": [ + "string", + "node" + ] + }, + "defaultValue": "这是一个超链接" + }, + { + "name": "style", + "propType": "object" + }, + { + "name": "target", + "title": "新开页面", + "propType": { + "type": "oneOf", + "value": [ + "_blank", + "_self" + ] + } + } + ] + }, + { + "componentName": "img", + "title": "Image", + "npm": { + "exportName": "img" + }, + "props": [ + { + "name": "src", + "title": "图片链接", + "propType": "string", + "defaultValue": "https://img.alicdn.com/tps/TB16TQvOXXXXXbiaFXXXXXXXXXX-120-120.svg" + }, + { + "name": "title", + "title": { + "label": "标题", + "tip": "HTML 原生 title 属性" + }, + "propType": "string" + }, + { + "name": "alt", + "title": { + "label": "代替文本", + "tip": "HTML 原生 alt 属性" + }, + "propType": "string" + }, + { + "name": "width", + "title": { + "label": "宽度", + "tip": "HTML 原生 width 属性" + }, + "propType": "number" + }, + { + "name": "height", + "title": { + "label": "高度", + "tip": "HTML 原生 height 属性" + }, + "propType": "number" + }, + { + "name": "style", + "propType": "object" + } + ] + }, { "componentName": "Div", "title": "Div", @@ -66,6 +169,72 @@ } } }, + { + "componentName": "Divider", + "title": "Divider", + "docUrl": "", + "screenshot": "", + "npm": { + "package": "@alifd/next", + "version": "1.19.18", + "exportName": "Divider", + "main": "src/index.js", + "destructuring": true, + "subName": "" + }, + "props": [ + { + "name": "children", + "propType": "string", + "description": "文案", + "defaultValue": "分隔符" + }, + + { + "name": "dashed", + "propType": { + "type": "bool" + }, + "description": "是否为虚线", + "defaultValue": false + }, + + { + "name": "direction", + "propType": { + "type": "oneOf", + "value": [ + "hoz", + "ver" + ] + }, + "description": "线是水平还是垂直类型", + "defaultValue": "hoz" + }, + { + "name": "orientation", + "propType": { + "type": "oneOf", + "value": [ + "left", + "right", + "center" + ] + }, + "description": "分割线标题的位置", + "defaultValue": "center" + } + ], + "experimental": { + "filters": [{ + "name": "", + "filter": { + "type": "JSFunction", + "value": "filters" + } + }] + } + }, { "componentName": "Drawer", "title": "抽屉", @@ -97,28 +266,6 @@ "name": "rtl", "propType": "bool" }, - { - "name": "trigger", - "propType": { - "type": "instanceOf", - "value": "element" - }, - "defaultValue": null - }, - { - "name": "triggerType", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "defaultValue": "click" - }, { "name": "width", "propType": { @@ -225,10 +372,20 @@ "propType": "any" } ],"configure": { - "component": { - "isContainer": true, - "isModel": true - } + "component": { + "isContainer": true, + "isModel": true + }, + "props": [ + { + "name": "prefix", + "title": { + "type": "i18n", + "zh_CN": "前缀", + "en_US": "prefix" + } + } + ] } }, { @@ -245,11 +402,6 @@ "subName": "Inner" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, { "name": "className", "propType": "string" @@ -322,6 +474,687 @@ } ] }, + { + "componentName": "NextTable", + "title": "NextTable", + "docUrl": "", + "screenshot": "", + "npm": { + "package": "NextTable", + "version": "1.19.18", + "exportName": "NextTable", + "main": "lib/index.js", + "subName": "" + }, + "props": [ + { + "name": "columns", + "title": "数据列", + "propType": { + "type": "arrayOf", + "value": { + "type": "shape", + "value": [ + { + "name": "title", + "description": "列标题", + "propType": "string", + "defaultValue": "Title" + }, + { + "name": "dataKey", + "description": "列索引", + "propType": "string", + "defaultValue": "Key" + }, + { + "name": "dataType", + "description": "数据类型", + "propType": { + "type": "oneOf", + "value": [ + "text", + "timestamp", + "cascadeTimestamp", + "employee", + "money", + "moneyRange" + ] + }, + "defaultValue": "Key" + }, + { + "name": "editType", + "description": "编辑类型", + "propType": { + "type": "oneOf", + "value": [ + "select", + "text", + "radio", + "date", + "employee" + ] + }, + "defaultValue": "Key" + } + ] + } + } + }, + { + "name": "data", + "title": "数据源", + "propType": { + "type": "oneOfType", + "value": [ + "Json", + "JSExpression" + ] + } + }, + { + "name": "actionTitle", + "title": "操作列标题", + "propType": "string" + }, + { + "name": "actionColumn", + "title": "操作列", + "propType": { + "type": "arrayOf", + "value": { + "type": "shape", + "value": [{ + "name": "title", + "description": "列标题", + "propType": "string", + "defaultValue": "Title" + },{ + "name": "callback", + "description": "callback", + "propType": "func", + "defaultValue": { + "type": "JSFunction", + "value": "(rowData, action, table) => {\n return table.editRow(rowData).then((row) => {\n console.log(row);\n })}" + } + }] + } + } + } + ], + "configure": { + "props": [ + { + "name": "StyleAndTheme", + "title": "风格和样式", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "theme", + "title": "主题", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "zebra", + "value": "zebra" + },{ + "label": "split", + "value": "split" + },{ + "label": "border", + "value": "border" + } + ] + } + } + }, + { + "name": "hasHeader", + "title": "是否显示表头", + "setter": "BoolSetter" + }, + { + "name": "fixedHeader", + "title": "是否固定表头", + "setter": "BoolSetter" + }, + { + "name": "stickyHeader", + "title": "表头是否是sticky", + "setter": "BoolSetter" + } + ] + }, + { + "name": "Selector", + "title": "行选择器", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "rowSelector", + "title": "选择器模式", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "checkboxSelector", + "value": "checkboxSelector" + },{ + "label": "radioSelector", + "value": "radioSelector" + } + ] + } + } + }, + { + "name": "showRowSelector", + "title": "是否启用选择模式", + "setter": "BoolSetter" + } + ] + }, + { + "name": "Pagination", + "title": "分页设置", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "isPagination", + "title": "是否显示分页", + "setter": "BoolSetter", + "initialValue": true + }, + { + "name": "pagination", + "title": "分页设置", + "setter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [ + { + "name": "paginationPosition", + "title": "翻页器显示位置", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "left", + "value": "left" + },{ + "label": "right", + "value": "right" + } + ] + } + } + }, + { + "name": "size", + "title": "分页组件大小", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "small", + "value": "small" + },{ + "label": "medium", + "value": "medium" + },{ + "label": "large", + "value": "large" + } + ] + } + } + }, + { + "name": "type", + "title": "分页组件类型", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "normal", + "value": "normal" + },{ + "label": "simple", + "value": "simple" + },{ + "label": "mini", + "value": "mini" + } + ] + } + } + }, + { + "name": "shape", + "title": "前进后退按钮样式", + "setter": { + "componentName": "SelectSetter", + "props": { + "dataSource": [ + { + "label": "normal", + "value": "normal" + },{ + "label": "arrow-only", + "value": "arrow-only" + },{ + "label": "arrow-prev-only", + "value": "arrow-prev-only" + },{ + "label": "no-border", + "value": "no-border" + } + ] + } + } + }, + { + "name": "pageSizeSelector", + "title": "每页显示选择器类型", + "setter": "BoolSetter" + }, + { + "name": "pageSizeList", + "title": "每页显示选择器可选值", + "setter": "StringSetter" + }, + { + "name": "pageSizePosition", + "title": "每页显示选择器在组件中的位置", + "setter": { + "componentName": "SelectSetter", + "props": { + "dataSource": [ + { + "label": "start", + "value": "start" + },{ + "label": "end", + "value": "end" + } + ] + } + } + }, + { + "name": "hideOnlyOnePage", + "title": "hideOnlyOnePage", + "setter": "BoolSetter" + }, + { + "name": "showJump", + "title": "showJump", + "setter": "BoolSetter" + }, + { + "name": "pageShowCount", + "title": "页码显示的数量", + "setter": "NumberSetter" + } + ] + } + }, + "initialValue": { + "type" : "normal", + "shape" : "arrow-only", + "pageSize" : 10, + "pageSizeSelector" : false, + "pageSizeList" : "5,10,20", + "pageSizePosition" : "end", + "paginationPosition" : "right", + "hideOnlyOnePage" : false, + "showJump" : true + } + } + } + ] + }, + { + "name": "ExpandAndTree", + "title": "可折叠/树形表格", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "hasExpandedRowCtrl", + "title": "启用折叠", + "setter": "BoolSetter" + }, + { + "name": "isTree", + "title": "启用树形", + "setter": "BoolSetter" + } + ] + }, + { + "name": "TopAction", + "title": "顶部操作选项", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "showActionBar", + "title": "显示操作条", + "setter": "BoolSetter" + }, + { + "name": "showLinkBar", + "title": "显示外链条", + "setter": "BoolSetter" + }, + { + "name": "showSearch", + "title": "显示搜索", + "setter": "BoolSetter" + }, + { + "name": "searchBarPlaceholder", + "title": "搜索 placeholder", + "setter": "StringSetter" + }, + { + "name": "showCustomColumn", + "title": "显示筛选器", + "setter": "BoolSetter" + } + ] + }, + { + "name": "actionBar", + "title": "操作条", + "setter": { + "componentName": "ArraySetter", + "props": { + "itemSetter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [{ + "name": "title", + "description": "标题", + "setter": "StringSetter", + "defaultValue": "Title" + },{ + "name": "callback", + "description": "callback", + "setter": "FunctionSetter" + }] + } + }, + "initialValue": { + "title": "Title", + "callback": { + "type": "JSFunction", + "value": "function(){}" + } + } + } + } + } + }, + { + "name": "linkBar", + "title": "外链操作条", + "setter": { + "componentName": "ArraySetter", + "props": { + "itemSetter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [{ + "name": "title", + "description": "标题", + "setter": "StringSetter", + "defaultValue": "Title" + },{ + "name": "callback", + "description": "callback", + "propType": "JsonSetter", + "defaultValue": { + "type": "JSFunction", + "value": "(rowData, action, table) => {\n return table.editRow(rowData).then((row) => {\n console.log(row);\n })}" + } + }] + } + }, + "initialValue": { + "title": "Title", + "callback": { + "type": "JSFunction", + "value": "(rowData, action, table) => {\n return table.editRow(rowData).then((row) => {\n console.log(row);\n })}" + } + } + } + } + } + }, + { + "name": "columns", + "title": "数据列", + "setter": { + "componentName": "ArraySetter", + "props": { + "itemSetter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [ + { + "name": "title", + "description": "列标题", + "setter": "StringSetter" + }, + { + "name": "dataKey", + "description": "列索引", + "setter": "StringSetter" + }, + { + "name": "dataType", + "description": "数据类型", + "setter": { + "componentName": "SelectSetter", + "props": { + "dataSource": [ + { + "label": "text", + "value": "text" + },{ + "label": "timestamp", + "value": "timestamp" + },{ + "label": "cascadeTimestamp", + "value": "cascadeTimestamp" + },{ + "label": "employee", + "value": "employee" + },{ + "label": "money", + "value": "money" + },{ + "label": "moneyRange", + "value": "moneyRange" + } + ] + } + } + }, + { + "name": "editType", + "description": "编辑类型", + "setter": { + "componentName": "SelectSetter", + "props": { + "dataSource": [ + { + "label": "select", + "value": "select" + },{ + "label": "text", + "value": "text" + },{ + "label": "radio", + "value": "radio" + },{ + "label": "date", + "value": "date" + },{ + "label": "employee", + "value": "employee" + } + ] + } + } + } + ] + } + }, + "initialValue": { + "title": "Title", + "dataKey": "Key", + "dataType": "text", + "editType": "text" + } + } + } + } + }, + { + "name": "data", + "title": "数据源", + "setter": { + "componentName": "MixedSetter", + "props": { + "setters": [ + "JsonSetter", + "ExpressionSetter" + ] + } + } + }, + { + "name": "action", + "title": "操作列选项", + "type": "group", + "extraProps": { + "display": "entry" + }, + "items": [ + { + "name": "actionTitle", + "title": "操作列标题", + "setter": "StringSetter" + }, + { + "name": "actionWidth", + "title": "操作列宽度", + "setter": "NumberSetter" + }, + { + "name": "actionType", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "link", + "value": "link" + },{ + "label": "button", + "value": "button" + } + ] + } + } + }, + { + "name": "actionFixed", + "setter": { + "componentName": "RadioGroupSetter", + "props": { + "dataSource": [ + { + "label": "right", + "value": "right" + },{ + "label": "none", + "value": "none" + } + ] + } + } + }, + { + "name": "actionHidden", + "setter": "BoolSetter", + "initialValue": false + } + ] + }, + { + "name": "actionColumn", + "title": "操作列", + "setter": { + "componentName": "ArraySetter", + "props": { + "itemSetter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [{ + "name": "title", + "description": "列标题", + "setter": "StringSetter", + "defaultValue": "Title" + },{ + "name": "callback", + "description": "callback", + "setter": "FunctionSetter" + }] + } + }, + "initialValue": { + "title": "Title", + "callback": { + "type": "JSFunction", + "value": "function(){}" + } + } + } + } + } + } + ] + } + }, { "componentName": "Table", "title": "Table", @@ -340,6 +1173,10 @@ "name": "prefix", "propType": "string" }, + { + "name": "children", + "propType": "string" + }, { "name": "pure", "propType": "bool" @@ -568,15 +1405,71 @@ } ], "configure": { - "component": { - "isContainer": true - }, "props": { "isExtends": true, - "override": [{ - "name": "dataSource", - "setter": "JsonSetter" - }] + "override": [ + { + "name": "dataSource", + "setter": "JsonSetter" + }, + { + "name": "children", + "setter": { + "componentName": "ArraySetter", + "props": { + "itemSetter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [ + { + "name": "componentName", + "title": "子组件", + "defaultValue": "Table.Column", + "setter": { + "componentName": "StringSetter" + } + }, + { + "name": "props", + "title": "props", + "setter": { + "componentName": "ObjectSetter", + "props": { + "config": { + "items": [ + { + "name": "title", + "setter": { + "componentName": "StringSetter" + } + }, + { + "name": "dataIndex", + "setter": { + "componentName": "StringSetter" + } + } + ] + } + } + } + } + ] + } + } + } + } + }, + "extraProps": { + "defaultValue": "", + "onChange": { + "type": "JSFunction", + "value": "(val, field, editor) => {\n debugger;\n console.log('val', val);//field.nodes[0].children.import(val && {\"componentName\": \"Table.Column\", \"props\": {\"type\": val, \"style\": {\"marginRight\": 5}}}, true); //field.top.setPropValue('children', [{\"componentName\": \"Icon\", \"props\": {\"type\": val}}, (field.top.getPropValue('children') || []).slice(-1)]);\n}" + } + } + } + ] } } }, @@ -599,8 +1492,29 @@ { "name": "dataIndex", "propType": "string" + }, + { + "name": "cell", + "propType": "func" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [{ + "name": "cell", + "setter": { + "componentName": "SlotSetter", + "props": { + "supportParams": true + } + }, + "extraProps": { + "display": "block" + } + }] + } + } }, { "componentName": "Badge", @@ -616,15 +1530,6 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "rtl", - "propType": "bool" - }, { "name": "className", "propType": "string" @@ -643,18 +1548,14 @@ }, { "name": "count", - "propType": { - "type": "oneOfType", - "value": [ - "number", - "string" - ] - }, + "title": "count", + "propType": "string", "description": "展示的数字,大于 overflowCount 时显示为 ${overflowCount}+,为 0 时默认隐藏", "defaultValue": 0 }, { "name": "showZero", + "title": "showZero", "propType": "bool", "description": "当count为0时,是否显示count", "defaultValue": true @@ -725,16 +1626,6 @@ "propType": "object", "description": "自定义内敛样式" }, - { - "name": "children", - "propType": "any", - "description": "浮层的内容" - }, - { - "name": "size", - "propType": "string", - "defaultValue": "medium" - }, { "name": "type", "propType": { @@ -800,8 +1691,8 @@ { "name": "offset", "propType": { - "type": "instanceOf", - "value": "array" + "type": "arrayOf", + "value": "number" }, "description": "弹层相对于trigger的定位的微调, 接收数组[hoz, ver], 表示弹层在 left / top 上的增量\ne.g. [100, 100] 表示往右(RTL 模式下是往左) 、下分布偏移100px", "defaultValue": [ @@ -811,19 +1702,17 @@ }, { "name": "trigger", - "propType": "any", + "propType": "node", "description": "触发元素" }, { "name": "triggerType", + "title": "触发行为", "propType": { - "type": "oneOfType", + "type": "oneOf", "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } + "hover", + "click" ] }, "description": "触发行为\n鼠标悬浮, 鼠标点击('hover','click')或者它们组成的数组,如 ['hover', 'click'], 强烈不建议使用'focus',若弹窗内容有复杂交互请使用click", @@ -869,70 +1758,17 @@ "description": "弹层出现后是否自动focus到内部第一个元素", "defaultValue": true }, - { - "name": "safeNode", - "propType": "string", - "description": "安全节点:对于triggetType为click的浮层,会在点击除了浮层外的其它区域时关闭浮层.safeNode用于添加不触发关闭的节点, 值可以是dom节点的id或者是节点的dom对象" - }, - { - "name": "safeId", - "propType": "string", - "description": "用来指定safeNode节点的id,和safeNode配合使用", - "defaultValue": null - }, - { - "name": "animation", - "propType": { - "type": "oneOfType", - "value": [ - "object", - "bool" - ] - }, - "description": "配置动画的播放方式\n@param {String} in 进场动画\n@param {String} out 出场动画" - }, - { - "name": "cache", - "propType": "bool", - "description": "弹层的dom节点关闭时是否删除", - "defaultValue": false - }, - { - "name": "popupContainer", - "propType": "any", - "description": "指定浮层渲染的父节点, 可以为节点id的字符串,也可以返回节点的函数。" - }, - { - "name": "container", - "propType": "any" - }, - { - "name": "popupStyle", - "propType": "object", - "description": "弹层组件style,透传给Popup" - }, - { - "name": "popupClassName", - "propType": "string", - "description": "弹层组件className,透传给Popup", - "defaultValue": "" - }, - { - "name": "popupProps", - "propType": "object", - "description": "弹层组件属性,透传给Popup" - }, { "name": "followTrigger", "propType": "bool", "description": "是否跟随滚动" - }, - { - "name": "id", - "propType": "string", - "description": "弹层id, 传入值才会支持无障碍" } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "Tooltip", @@ -966,7 +1802,7 @@ }, { "name": "children", - "propType": "any", + "propType": "node", "description": "tooltip的内容" }, { @@ -993,19 +1829,16 @@ }, { "name": "trigger", - "propType": "any", + "propType": "node", "description": "触发元素" }, { "name": "triggerType", "propType": { - "type": "oneOfType", + "type": "oneOf", "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } + "hover", + "click" ] }, "description": "触发行为\n鼠标悬浮, 鼠标点击('hover', 'click')或者它们组成的数组,如 ['hover', 'click'], 强烈不建议使用'focus',若有复杂交互,推荐使用triggerType为click的Balloon组件", @@ -1033,7 +1866,7 @@ }, { "name": "popupContainer", - "propType": "any", + "propType": "string", "description": "指定浮层渲染的父节点, 可以为节点id的字符串,也可以返回节点的函数。" }, { @@ -1126,7 +1959,12 @@ "propType": "bool", "defaultValue": false } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "Breadcrumb", @@ -1209,7 +2047,22 @@ "configure": { "component": { "isContainer": true - } + }, + "props": [ + { + "name": "maxNode", + "title": { + "label": "最大节点数", + "tip": "默认 100" + }, + "setter": "NumberSetter" + }, + { + "name": "separator", + "title": "分隔符", + "setter": "StringSetter" + } + ] } }, { @@ -1298,7 +2151,9 @@ ], "configure": { "component": { - "isContainer": true + "isContainer": true, + "isModel": true, + "rootSelector": "div.MCBreadcrumb" } } }, @@ -1325,6 +2180,11 @@ "name": "rtl", "propType": "bool" }, + { + "name": "children", + "description": "内容", + "propType": "string" + }, { "name": "link", "propType": "string", @@ -1345,25 +2205,23 @@ "name": "className", "propType": "any" }, - { - "name": "children", - "description": "内容", - "propType": "array" - }, { "name": "style", "propType": "object" } ], "configure": { - "component": { - "isContainer": true - } + "props": [{ + "name": "children", + "title": "文本内容", + "setter": "StringSetter" + }] } }, { "componentName": "Button", "title": "Button", + "icon": "https://img.alicdn.com/tfs/TB1rT0gPQL0gK0jSZFAXXcA9pXa-200-200.svg", "docUrl": "", "screenshot": "", "npm": { @@ -1376,16 +2234,18 @@ }, "props": [ { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" + "name": "children", + "title": "内容", + "propType": "string" }, { - "name": "rtl", - "propType": "bool" + "name": "icon", + "propType": "string", + "description": "自定义内联样式" }, { "name": "type", + "title": "类型", "propType": { "type": "oneOf", "value": [ @@ -1399,6 +2259,7 @@ }, { "name": "size", + "title": "尺寸", "propType": { "type": "oneOf", "value": [ @@ -1412,6 +2273,7 @@ }, { "name": "iconSize", + "title": "Icon 尺寸", "propType": { "type": "oneOf", "value": [ @@ -1425,43 +2287,19 @@ "xxxl" ] }, + "defaultValue": "small", "description": "按钮中 Icon 的尺寸,用于替代 Icon 的默认大小" }, - { - "name": "htmlType", - "propType": { - "type": "oneOf", - "value": [ - "submit", - "reset", - "button" - ] - }, - "description": "当 component = 'button' 时,设置 button 标签的 type 值", - "defaultValue": "button" - }, - { - "name": "component", - "propType": { - "type": "oneOf", - "value": [ - "button", - "a", - "div", - "span" - ] - }, - "description": "设置标签类型", - "defaultValue": "button" - }, { "name": "loading", + "title": "loading", "propType": "bool", "description": "设置按钮的载入状态", "defaultValue": false }, { "name": "ghost", + "title": "ghost", "propType": { "type": "oneOf", "value": [ @@ -1476,24 +2314,28 @@ }, { "name": "text", + "title": "text", "propType": "bool", "description": "是否为文本按钮", "defaultValue": false }, { "name": "warning", + "title": "warning", "propType": "bool", "description": "是否为警告按钮", "defaultValue": false }, { "name": "disabled", + "title": "disabled", "propType": "bool", "description": "是否禁用", "defaultValue": false }, { "name": "onClick", + "title": "onClick", "propType": "func", "description": "点击按钮的回调\n@param {Object} e Event Object" }, @@ -1505,10 +2347,6 @@ "name": "onMouseUp", "propType": "func" }, - { - "name": "children", - "propType": "array" - }, { "name": "style", "propType": "object", @@ -1516,8 +2354,41 @@ } ], "configure": { - "component": { - "isContainer": true + "props": { + "isExtends": true, + "override": [ + { + "name": "icon", + "setter": "IconSetter", + "extraProps": { + "defaultValue": "", + "onChange": { + "type": "JSFunction", + "value": "(val, field, editor) => {\n field.nodes[0].children.import(val && {\"componentName\": \"Icon\", \"props\": {\"type\": val, \"style\": {\"marginRight\": 5}}}, true); //field.top.setPropValue('children', [{\"componentName\": \"Icon\", \"props\": {\"type\": val}}, (field.top.getPropValue('children') || []).slice(-1)]);\n}" + } + } + }, + { + "name": "children", + "title": { + "label": { + "type": "i18n", + "zh_CN": "文本内容", + "en_US": "content" + }, + "tip": "按钮文本内容" + }, + "setter": { + "componentName": "MixedSetter", + "props": { + "setters": [ + "StringSetter", + "ExpressionSetter" + ] + } + } + } + ] } } }, @@ -1823,7 +2694,30 @@ "name": "style", "propType": "object" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [ + { + "name": "startValue", + "setter": "DateSetter" + }, + { + "name": "defaultStartValue", + "setter": "DateSetter" + }, + { + "name": "defaultEndValue", + "setter": "DateSetter" + }, + { + "name": "endValue", + "setter": "DateSetter" + } + ] + } + } }, { "componentName": "Card", @@ -1839,57 +2733,49 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "media", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "卡片的上的图片 / 视频" - }, { "name": "title", "propType": { - "type": "instanceOf", - "value": "node" + "type": "oneOfType", + "value": [ + "node", + "string" + ] }, - "description": "卡片的标题" + "description": "标题" }, { "name": "subTitle", "propType": { - "type": "instanceOf", - "value": "node" + "type": "oneOfType", + "value": [ + "node", + "string" + ] }, - "description": "卡片的副标题" + "description": "副标题" }, { - "name": "actions", + "name": "extra", "propType": { - "type": "instanceOf", - "value": "node" + "type": "oneOfType", + "value": [ + "node", + "string" + ] }, - "description": "卡片操作组,位置在卡片底部" + "description": "标题栏用户自定义内容" }, { "name": "showTitleBullet", "propType": "bool", - "description": "是否显示标题的项目符号", + "description": "标题的项目符号", "defaultValue": true }, { "name": "showHeadDivider", "propType": "bool", - "description": "是否展示头部的分隔线", + "description": "头部分隔线", "defaultValue": true }, { @@ -1904,36 +2790,25 @@ "description": "内容区域的固定高度", "defaultValue": 120 }, - { - "name": "extra", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "标题区域的用户自定义内容" - }, - { - "name": "free", - "propType": "bool", - "description": "是否开启自由模式,开启后card 将使用子组件配合使用, 设置此项后 title, subtitle, 等等属性都将失效", - "defaultValue": false - }, { "name": "className", "propType": "string" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - } - }, { "name": "style", "propType": "object" + }, + { + "name": "rtl", + "propType": "bool", + "description": "文本方向是从右向左" } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "CardHeader", @@ -2402,6 +3277,14 @@ { "name": "style", "propType": "object" + }, + { + "name": "dataSource", + "propType": { + "type": "arrayOf", + "value": "object" + }, + "setter": "JsonSetter" } ] }, @@ -2665,6 +3548,14 @@ { "name": "style", "propType": "object" + }, + { + "name": "dataSource", + "propType": { + "type": "arrayOf", + "value": "object" + }, + "setter": "JsonSetter" } ] }, @@ -2682,15 +3573,6 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "rtl", - "propType": "bool" - }, { "name": "className", "propType": "string", @@ -2699,7 +3581,7 @@ { "name": "id", "propType": "string", - "description": "checkbox id, 挂载在input上" + "description": "ID" }, { "name": "style", @@ -2724,64 +3606,34 @@ }, { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "通过属性配置label," + "propType": "string", + "description": "label" }, { "name": "indeterminate", "propType": "bool", - "description": "Checkbox 的中间状态,只会影响到 Checkbox 的样式,并不影响其 checked 属性" + "description": "中间状态" }, { "name": "defaultIndeterminate", "propType": "bool", - "description": "Checkbox 的默认中间态,只会影响到 Checkbox 的样式,并不影响其 checked 属性", + "description": "默认中间态", "defaultValue": false }, - { - "name": "onChange", - "propType": "func", - "description": "状态变化时触发的事件\n@param {Boolean} checked 是否选中\n@param {Event} e Dom 事件对象" - }, - { - "name": "onMouseEnter", - "propType": "func", - "description": "鼠标进入enter事件\n@param {Event} e Dom 事件对象" - }, - { - "name": "onMouseLeave", - "propType": "func", - "description": "鼠标离开Leave事件\n@param {Event} e Dom 事件对象" - }, { "name": "value", "propType": { "type": "oneOfType", "value": [ - "string", - "number" + "string" ] }, - "description": "checkbox 的value" + "description": "value" }, { "name": "name", "propType": "string", "description": "name" - }, - { - "name": "isPreview", - "propType": "bool", - "description": "是否为预览态", - "defaultValue": false - }, - { - "name": "renderPreview", - "propType": "func", - "description": "预览态模式下渲染的内容\n@param {number} value 评分值" } ] }, @@ -2897,38 +3749,24 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "description": "样式前缀", - "defaultValue": "next-" - }, - { - "name": "style", - "propType": "object", - "description": "组件接受行内样式" - }, { "name": "dataSource", - "propType": { - "type": "instanceOf", - "value": "array" - }, + "propType": "Json", "description": "使用数据模型构建" }, { "name": "defaultExpandedKeys", "propType": { - "type": "instanceOf", - "value": "array" + "type": "arrayOf", + "value": "string" }, "description": "默认展开keys" }, { "name": "expandedKeys", "propType": { - "type": "instanceOf", - "value": "array" + "type": "arrayOf", + "value": "string" }, "description": "受控展开keys" }, @@ -2947,32 +3785,31 @@ "propType": "string", "description": "扩展class" }, + { + "name": "style", + "propType": "object", + "description": "组件接受行内样式" + }, { "name": "accordion", "propType": "bool", "description": "手风琴模式,一次只能打开一个", "defaultValue": false }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - } - }, - { - "name": "id", - "propType": "string" - }, { "name": "rtl", "propType": "bool" } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { - "componentName": "Panel", - "title": "Panel", + "componentName": "Collapse.Panel", + "title": "Collapse.Panel", "docUrl": "", "screenshot": "", "npm": { @@ -2985,25 +3822,14 @@ }, "props": [ { - "name": "prefix", - "propType": "string", - "description": "样式类名的品牌前缀", - "defaultValue": "next-" + "name": "children", + "propType": "any" }, { "name": "style", "propType": "object", "description": "子组件接受行内样式" }, - { - "name": "children", - "propType": "any" - }, - { - "name": "isExpanded", - "propType": "bool", - "defaultValue": false - }, { "name": "disabled", "propType": "bool", @@ -3016,21 +3842,15 @@ "value": "node" }, "description": "标题" - }, - { - "name": "className", - "propType": "string", - "description": "扩展class" - }, - { - "name": "onClick", - "propType": "func" - }, - { - "name": "id", - "propType": "string" } - ] + ], + "configure": { + "component": { + "nestingRule": { + "parentWhitelist": ["Collapse"] + } + } + } }, { "componentName": "ErrorBoundary", @@ -3343,7 +4163,18 @@ "name": "style", "propType": "object" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [ + { + "name": "value", + "setter": "DateSetter" + } + ] + } + } }, { "componentName": "RangePicker", @@ -4355,35 +5186,26 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "pure", - "propType": "bool", - "defaultValue": false - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "className", - "propType": "string" - }, { "name": "visible", - "propType": "oneOfType", + "propType": { + "type": "oneOfType", + "value": [ + "JSExpression", + "bool" + ] + }, "description": "是否显示", "defaultValue": false }, { "name": "title", "propType": { - "type": "instanceOf", - "value": "node" + "type": "oneOfType", + "value": [ + "string", + "node" + ] }, "description": "标题" }, @@ -4406,14 +5228,10 @@ "propType": { "type": "oneOfType", "value": [ - "bool", - { - "type": "instanceOf", - "value": "node" - } + "bool" ] }, - "description": "底部内容,设置为 false,则不进行显示\n@default [, ]" + "description": "底部按钮" }, { "name": "footerAlign", @@ -4425,51 +5243,22 @@ "right" ] }, - "description": "底部按钮的对齐方式", + "description": "操作对齐方式", "defaultValue": "right" }, - { - "name": "footerActions", - "propType": { - "type": "instanceOf", - "value": "array" - }, - "description": "指定确定按钮和取消按钮是否存在以及如何排列,

**可选值**:\n['ok', 'cancel'](确认取消按钮同时存在,确认按钮在左)\n['cancel', 'ok'](确认取消按钮同时存在,确认按钮在右)\n['ok'](只存在确认按钮)\n['cancel'](只存在取消按钮)", - "defaultValue": [ - "ok", - "cancel" - ] - }, - { - "name": "onOk", - "propType": "func", - "description": "在点击确定按钮时触发的回调函数\n@param {Object} event 点击事件对象" - }, - { - "name": "onCancel", - "propType": "func", - "description": "在点击取消按钮时触发的回调函数\n@param {Object} event 点击事件对象" - }, - { - "name": "okProps", - "propType": "object", - "description": "应用于确定按钮的属性对象" - }, - { - "name": "cancelProps", - "propType": "object", - "description": "应用于取消按钮的属性对象" - }, { "name": "closeable", "propType": { - "type": "oneOfType", + "type": "oneOf", "value": [ - "string", - "bool" + "close", + "mask", + "esc,close", + "close,esc,mask", + "esc" ] }, - "description": "控制对话框关闭的方式,值可以为字符串或者布尔值,其中字符串是由以下值组成:\n**close** 表示点击关闭按钮可以关闭对话框\n**mask** 表示点击遮罩区域可以关闭对话框\n**esc** 表示按下 esc 键可以关闭对话框\n如 'close' 或 'close,esc,mask'\n如果设置为 true,则以上关闭方式全部生效\n如果设置为 false,则以上关闭方式全部失效", + "description": "关闭方式", "defaultValue": "esc,close" }, { @@ -4477,11 +5266,6 @@ "propType": "func", "description": "对话框关闭时触发的回调函数\n@param {String} trigger 关闭触发行为的描述字符串\n@param {Object} event 关闭时事件对象" }, - { - "name": "afterClose", - "propType": "func", - "description": "对话框关闭后触发的回调函数, 如果有动画,则在动画结束后触发" - }, { "name": "hasMask", "propType": "bool", @@ -4502,58 +5286,15 @@ { "name": "autoFocus", "propType": "bool", - "description": "对话框弹出时是否自动获得焦点", + "description": "是否获得焦点", "defaultValue": false }, - { - "name": "align", - "propType": { - "type": "oneOfType", - "value": [ - "string", - "bool" - ] - }, - "description": "对话框对齐方式, 具体见Overlay文档", - "defaultValue": "cc cc" - }, { "name": "isFullScreen", "propType": "bool", - "description": "当对话框高度超过浏览器视口高度时,是否显示所有内容而不是出现滚动条以保证对话框完整显示在浏览器视口内,该属性仅在对话框垂直水平居中时生效,即 align 被设置为 'cc cc' 时", + "description": "是否全屏", "defaultValue": false }, - { - "name": "shouldUpdatePosition", - "propType": "bool", - "description": "是否在对话框重新渲染时及时更新对话框位置,一般用于对话框高度变化后依然能保证原来的对齐方式", - "defaultValue": false - }, - { - "name": "minMargin", - "propType": "number", - "description": "对话框距离浏览器顶部和底部的最小间距,align 被设置为 'cc cc' 并且 isFullScreen 被设置为 true 时不生效", - "defaultValue": 40 - }, - { - "name": "overlayProps", - "propType": "object", - "description": "透传到弹层组件的属性对象" - }, - { - "name": "locale", - "propType": "object", - "description": "自定义国际化文案对象\n@property {String} ok 确认按钮文案\n@property {String} cancel 取消按钮文案" - }, - { - "name": "height", - "propType": "string", - "description": "对话框的高度样式属性" - }, - { - "name": "popupContainer", - "propType": "any" - }, { "name": "style", "propType": "object" @@ -4562,7 +5303,8 @@ "configure": { "component": { "isContainer": true, - "isModel": true + "isModel": true, + "rootSelector": "div.next-dialog" } } }, @@ -4844,12 +5586,6 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "description": "样式前缀", - "defaultValue": "next-" - }, { "name": "inline", "propType": "bool", @@ -4857,6 +5593,10 @@ }, { "name": "size", + "title": { + "label": "Size", + "tip": "单个 Item 的 size 自定义,优先级高于 Form 的 size, 并且当组件与 Item 一起使用时,组件自身设置 size 属性无效。\n@enumdesc 大, 中, 小" + }, "propType": { "type": "oneOf", "value": [ @@ -4875,6 +5615,10 @@ }, { "name": "labelAlign", + "title": { + "label": "标签的位置", + "tip": "上, 左, 内" + }, "propType": { "type": "oneOf", "value": [ @@ -4897,36 +5641,11 @@ }, "description": "标签的左右对齐方式\n@enumdesc 左, 右" }, - { - "name": "field", - "propType": "any", - "description": "field 实例, 传 false 会禁用 field" - }, - { - "name": "saveField", - "propType": "func", - "description": "保存 Form 自动生成的 field 对象" - }, - { - "name": "labelCol", - "propType": "object", - "description": "控制第一级 Item 的 labelCol" - }, - { - "name": "wrapperCol", - "propType": "object", - "description": "控制第一级 Item 的 wrapperCol" - }, { "name": "onSubmit", "propType": "func", "description": "form内有 `htmlType=\"submit\"` 的元素的时候会触发" }, - { - "name": "children", - "propType": "any", - "description": "子元素" - }, { "name": "className", "propType": "string", @@ -4939,7 +5658,13 @@ }, { "name": "value", - "propType": "object", + "propType": { + "type": "oneOfType", + "value": [ + "Json", + "JSExpression" + ] + }, "description": "表单数值" }, { @@ -4947,22 +5672,6 @@ "propType": "func", "description": "表单变化回调\n@param {Object} values 表单数据\n@param {Object} item 详细\n@param {String} item.name 变化的组件名\n@param {String} item.value 变化的数据\n@param {Object} item.field field 实例" }, - { - "name": "component", - "propType": { - "type": "oneOfType", - "value": [ - "string", - "func" - ] - }, - "description": "设置标签类型", - "defaultValue": "form" - }, - { - "name": "fieldOptions", - "propType": "object" - }, { "name": "rtl", "propType": "bool" @@ -4990,7 +5699,12 @@ "propType": "bool", "description": "是否开启预览态" } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "Form.Item", @@ -5007,10 +5721,8 @@ }, "props": [ { - "name": "prefix", - "propType": "string", - "description": "样式前缀", - "defaultValue": "next-" + "name": "id", + "propType": "string" }, { "name": "rtl", @@ -5018,40 +5730,65 @@ }, { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "label 标签的文本" + "propType": "string", + "description": "标签" }, { "name": "labelCol", - "propType": "object", + "propType": { + "type": "shape", + "value": [{ + "name": "span", + "description": "span", + "propType": "number" + },{ + "name": "offset", + "description": "offset", + "propType": "number" + }] + }, "description": "label 标签布局,通 `` 组件,设置 span offset 值,如 {span: 8, offset: 16},该项仅在垂直表单有效" }, { "name": "wrapperCol", - "propType": "object", + "propType": { + "type": "shape", + "value": [{ + "name": "span", + "description": "span", + "propType": "number" + },{ + "name": "offset", + "description": "offset", + "propType": "number" + }] + }, "description": "需要为输入控件设置布局样式时,使用该属性,用法同 labelCol" }, { "name": "help", - "propType": { - "type": "instanceOf", - "value": "node" + "title": { + "label": "自定义提示信息", + "tip": "如不设置,则会根据校验规则自动生成." }, + "propType": "string", "description": "自定义提示信息,如不设置,则会根据校验规则自动生成." }, { "name": "extra", - "propType": { - "type": "instanceOf", - "value": "node" + "title": { + "label": "额外的提示信息", + "tip": "和 help 类似,当需要错误信息和提示文案同时出现时,可以使用这个。 位于错误信息后面" }, + "propType": "string", "description": "额外的提示信息,和 help 类似,当需要错误信息和提示文案同时出现时,可以使用这个。 位于错误信息后面" }, { "name": "validateState", + "title": { + "label": "校验状态", + "tip": "如不设置,则会根据校验规则自动生成\n@enumdesc 失败, 成功, 校验中, 警告" + }, "propType": { "type": "oneOf", "value": [ @@ -5063,37 +5800,17 @@ }, "description": "校验状态,如不设置,则会根据校验规则自动生成\n@enumdesc 失败, 成功, 校验中, 警告" }, - { - "name": "hasFeedback", - "propType": "bool", - "description": "配合 validateState 属性使用,是否展示 success/loading 的校验状态图标, 目前只有Input支持", - "defaultValue": false - }, { "name": "style", "propType": "object", "description": "自定义内联样式" }, - { - "name": "id", - "propType": "string" - }, - { - "name": "children", - "propType": { - "type": "oneOfType", - "value": [ - { - "type": "instanceOf", - "value": "node" - }, - "func" - ] - }, - "description": "node 或者 function(values)" - }, { "name": "size", + "title": { + "label": "Size", + "tip": "单个 Item 的 size 自定义,优先级高于 Form 的 size, 并且当组件与 Item 一起使用时,组件自身设置 size 属性无效。" + }, "propType": { "type": "oneOf", "value": [ @@ -5106,11 +5823,19 @@ }, { "name": "fullWidth", + "title": { + "label": "fullWidth", + "tip": "单个 Item 中表单类组件宽度是否是100%" + }, "propType": "bool", "description": "单个 Item 中表单类组件宽度是否是100%" }, { "name": "labelAlign", + "title": { + "label": "标签的位置", + "tip": "上, 左, 内" + }, "propType": { "type": "oneOf", "value": [ @@ -5123,6 +5848,10 @@ }, { "name": "labelTextAlign", + "title": { + "label": "标签的左右对齐方式", + "tip": "左, 右" + }, "propType": { "type": "oneOf", "value": [ @@ -5139,141 +5868,118 @@ }, { "name": "required", + "title": { + "label": "不能为空", + "tip": "[表单校验] 不能为空" + }, "propType": "bool", "description": "[表单校验] 不能为空" }, - { - "name": "asterisk", - "propType": "bool", - "description": "required 的星号是否显示" - }, { "name": "requiredMessage", + "title": { + "label": "自定义错误信息", + "tip": "[表单校验]为空时自定义错误信息" + }, "propType": "string", "description": "required 自定义错误信息" }, - { - "name": "requiredTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "required 自定义触发方式" - }, { "name": "min", + "title": { + "label": "最小值", + "tip": "[表单校验] 最小值" + }, "propType": "number", "description": "[表单校验] 最小值" }, { "name": "max", + "title": { + "label": "最大值", + "tip": "[表单校验] 最大值" + }, "propType": "number", "description": "[表单校验] 最大值" }, { "name": "minmaxMessage", + "title": { + "label": "min/max message", + "tip": "[表单校验] min/max 自定义错误信息" + }, "propType": "string", "description": "min/max 自定义错误信息" }, - { - "name": "minmaxTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "min/max 自定义触发方式" - }, { "name": "minLength", + "title": { + "label": "最小长度", + "tip": "[表单校验] 字符串最小长度 / 数组最小个数" + }, "propType": "number", "description": "[表单校验] 字符串最小长度 / 数组最小个数" }, { "name": "maxLength", + "title": { + "label": "最大长度", + "tip": "[表单校验] 字符串最大长度 / 数组最大个数" + }, "propType": "number", "description": "[表单校验] 字符串最大长度 / 数组最大个数" }, { "name": "minmaxLengthMessage", + "title": { + "label": "max|min length error message", + "tip": "[表单校验] minLength/maxLength 自定义错误信息" + }, "propType": "string", "description": "minLength/maxLength 自定义错误信息" }, - { - "name": "minmaxLengthTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "minLength/maxLength 自定义触发方式" - }, { "name": "length", + "title": { + "label": "长度", + "tip": "[表单校验] 字符串精确长度 / 数组精确个数" + }, "propType": "number", "description": "[表单校验] 字符串精确长度 / 数组精确个数" }, { "name": "lengthMessage", + "title": { + "label": "length error message", + "tip": "[表单校验] minLength/maxLength 自定义错误信息" + }, "propType": "string", "description": "length 自定义错误信息" }, - { - "name": "lengthTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "length 自定义触发方式" - }, { "name": "pattern", - "propType": "any", + "title": { + "label": "正则", + "tip": "[表单校验] 正则校验" + }, + "propType": "string", "description": "正则校验" }, { "name": "patternMessage", + "title": { + "label": "pattern error message", + "tip": "[表单校验] pattern 自定义错误信息" + }, "propType": "string", "description": "pattern 自定义错误信息" }, - { - "name": "patternTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "pattern 自定义触发方式" - }, { "name": "format", + "title": { + "label": "format", + "tip": "[表单校验] 四种常用的 pattern" + }, "propType": { "type": "oneOf", "value": [ @@ -5287,42 +5993,18 @@ }, { "name": "formatMessage", + "title": { + "label": "format error message", + "tip": "[表单校验] format 自定义错误信息" + }, "propType": "string", "description": "format 自定义错误信息" }, - { - "name": "formatTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "format 自定义触发方式" - }, { "name": "validator", "propType": "func", "description": "[表单校验] 自定义校验函数" }, - { - "name": "validatorTrigger", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "validator 自定义触发方式" - }, { "name": "autoValidate", "propType": "bool", @@ -5365,11 +6047,6 @@ "name": "isPreview", "propType": "bool", "description": "是否开启预览态" - }, - { - "name": "renderPreview", - "propType": "func", - "description": "预览态模式下渲染的内容\n@param {any} value 根据包裹的组件的 value 类型而决定" } ], "configure": { @@ -5412,22 +6089,161 @@ "description": "是否校验/需要校验的 name 数组" }, { - "name": "field", - "propType": "object", - "description": "自定义 field (在 Form 内不需要设置)" + "name": "style", + "propType": "object" }, { "name": "children", + "title": "内容", + "propType": "string" + }, + { + "name": "icon", + "propType": "string", + "description": "自定义内联样式" + }, + { + "name": "type", + "title": "类型", "propType": { - "type": "instanceOf", - "value": "node" - } + "type": "oneOf", + "value": [ + "primary", + "secondary", + "normal" + ] + }, + "description": "按钮的类型", + "defaultValue": "normal" + }, + { + "name": "size", + "title": "尺寸", + "propType": { + "type": "oneOf", + "value": [ + "small", + "medium", + "large" + ] + }, + "description": "按钮的尺寸", + "defaultValue": "medium" + }, + { + "name": "iconSize", + "title": "Icon 尺寸", + "propType": { + "type": "oneOf", + "value": [ + "xxs", + "xs", + "small", + "medium", + "large", + "xl", + "xxl", + "xxxl" + ] + }, + "defaultValue": "small", + "description": "按钮中 Icon 的尺寸,用于替代 Icon 的默认大小" + }, + { + "name": "loading", + "title": "loading", + "propType": "bool", + "description": "设置按钮的载入状态", + "defaultValue": false + }, + { + "name": "ghost", + "title": "ghost", + "propType": { + "type": "oneOf", + "value": [ + true, + false, + "light", + "dark" + ] + }, + "description": "是否为幽灵按钮", + "defaultValue": false + }, + { + "name": "text", + "title": "text", + "propType": "bool", + "description": "是否为文本按钮", + "defaultValue": false + }, + { + "name": "warning", + "title": "warning", + "propType": "bool", + "description": "是否为警告按钮", + "defaultValue": false + }, + { + "name": "disabled", + "title": "disabled", + "propType": "bool", + "description": "是否禁用", + "defaultValue": false + }, + { + "name": "className", + "propType": "string" + }, + { + "name": "onMouseUp", + "propType": "func" }, { "name": "style", - "propType": "object" + "propType": "object", + "description": "自定义内联样式" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [ + { + "name": "icon", + "setter": "IconSetter", + "extraProps": { + "defaultValue": "", + "onChange": { + "type": "JSFunction", + "value": "(val, field, editor) => {\n field.nodes[0].children.import(val && {\"componentName\": \"Icon\", \"props\": {\"type\": val, \"style\": {\"marginRight\": 5}}}, true); //field.top.setPropValue('children', [{\"componentName\": \"Icon\", \"props\": {\"type\": val}}, (field.top.getPropValue('children') || []).slice(-1)]);\n}" + } + } + }, + { + "name": "children", + "title": { + "label": { + "type": "i18n", + "zh_CN": "文本内容", + "en_US": "content" + }, + "tip": "按钮文本内容" + }, + "setter": { + "componentName": "MixedSetter", + "props": { + "setters": [ + "StringSetter", + "ExpressionSetter" + ] + } + } + } + ] + } + } }, { "componentName": "Form.Reset", @@ -5443,14 +6259,6 @@ "subName": "Reset" }, "props": [ - { - "name": "names", - "propType": { - "type": "instanceOf", - "value": "array" - }, - "description": "自定义重置的字段" - }, { "name": "onClick", "propType": "func", @@ -5462,22 +6270,161 @@ "description": "返回默认值" }, { - "name": "field", - "propType": "object", - "description": "自定义 field (在 Form 内不需要设置)" + "name": "style", + "propType": "object" }, { "name": "children", + "title": "内容", + "propType": "string" + }, + { + "name": "icon", + "propType": "string", + "description": "自定义内联样式" + }, + { + "name": "type", + "title": "类型", "propType": { - "type": "instanceOf", - "value": "node" - } + "type": "oneOf", + "value": [ + "primary", + "secondary", + "normal" + ] + }, + "description": "按钮的类型", + "defaultValue": "normal" + }, + { + "name": "size", + "title": "尺寸", + "propType": { + "type": "oneOf", + "value": [ + "small", + "medium", + "large" + ] + }, + "description": "按钮的尺寸", + "defaultValue": "medium" + }, + { + "name": "iconSize", + "title": "Icon 尺寸", + "propType": { + "type": "oneOf", + "value": [ + "xxs", + "xs", + "small", + "medium", + "large", + "xl", + "xxl", + "xxxl" + ] + }, + "defaultValue": "small", + "description": "按钮中 Icon 的尺寸,用于替代 Icon 的默认大小" + }, + { + "name": "loading", + "title": "loading", + "propType": "bool", + "description": "设置按钮的载入状态", + "defaultValue": false + }, + { + "name": "ghost", + "title": "ghost", + "propType": { + "type": "oneOf", + "value": [ + true, + false, + "light", + "dark" + ] + }, + "description": "是否为幽灵按钮", + "defaultValue": false + }, + { + "name": "text", + "title": "text", + "propType": "bool", + "description": "是否为文本按钮", + "defaultValue": false + }, + { + "name": "warning", + "title": "warning", + "propType": "bool", + "description": "是否为警告按钮", + "defaultValue": false + }, + { + "name": "disabled", + "title": "disabled", + "propType": "bool", + "description": "是否禁用", + "defaultValue": false + }, + { + "name": "className", + "propType": "string" + }, + { + "name": "onMouseUp", + "propType": "func" }, { "name": "style", - "propType": "object" + "propType": "object", + "description": "自定义内联样式" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [ + { + "name": "icon", + "setter": "IconSetter", + "extraProps": { + "defaultValue": "", + "onChange": { + "type": "JSFunction", + "value": "(val, field, editor) => {\n field.nodes[0].children.import(val && {\"componentName\": \"Icon\", \"props\": {\"type\": val, \"style\": {\"marginRight\": 5}}}, true); //field.top.setPropValue('children', [{\"componentName\": \"Icon\", \"props\": {\"type\": val}}, (field.top.getPropValue('children') || []).slice(-1)]);\n}" + } + } + }, + { + "name": "children", + "title": { + "label": { + "type": "i18n", + "zh_CN": "文本内容", + "en_US": "content" + }, + "tip": "按钮文本内容" + }, + "setter": { + "componentName": "MixedSetter", + "props": { + "setters": [ + "StringSetter", + "ExpressionSetter" + ] + } + } + } + ] + } + } }, { "componentName": "Form.Error", @@ -5557,16 +6504,9 @@ "props": [ { "name": "type", - "propType": "string", + "propType": "icon", "description": "指定显示哪种图标" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - } - }, { "name": "size", "propType": { @@ -5589,7 +6529,7 @@ "number" ] }, - "description": "指定图标大小\n
**可选值**
xxs, xs, small, medium, large, xl, xxl, xxxl, inherit", + "description": "指定图标大小", "defaultValue": "medium" }, { @@ -5599,12 +6539,24 @@ { "name": "style", "propType": "object" - }, - { - "name": "prefix", - "defaultValue": "next-" } - ] + ], + "configure": { + "props": { + "isExtends": true, + "override": [ + { + "name": "type", + "setter": { + "componentName": "IconSetter", + "props": { + "hasClear": false + } + } + } + ] + } + } }, { "componentName": "Input", @@ -5622,25 +6574,22 @@ "props": [ { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", + "title":"标签文案", "description": "label" }, + { + "name": "name", + "propType": "string" + }, { "name": "hasClear", "propType": "bool", - "description": "是否出现clear按钮" - }, - { - "name": "hasBorder", - "propType": "bool", - "description": "是否有边框", - "defaultValue": true + "description": "是否出现清除按钮" }, { "name": "state", + "title": "状态", "propType": { "type": "oneOf", "value": [ @@ -5654,6 +6603,7 @@ }, { "name": "size", + "title": "尺寸", "propType": { "type": "oneOf", "value": [ @@ -5665,6 +6615,47 @@ "description": "尺寸\n@enumdesc 小, 中, 大", "defaultValue": "medium" }, + { + "name": "disabled", + "propType": "bool", + "description": "是否禁用" + }, + { + "name": "maxLength", + "propType": "number", + "description": "最大长度" + }, + { + "name": "hasLimitHint", + "propType": "bool", + "description": "是否展现最大长度样式" + }, + { + "name": "cutString", + "propType": "bool", + "description": "是否截断超出字符串" + }, + { + "name": "readOnly", + "propType": "bool", + "description": "是否只读" + }, + { + "name": "trim", + "propType": "bool", + "description": "onChange返回会自动去除头尾空字符" + }, + { + "name": "placeholder", + "propType": "string", + "description": "输入提示" + }, + { + "name": "hasBorder", + "propType": "bool", + "description": "是否有边框" + }, + { "name": "onPressEnter", "propType": "func", @@ -5674,108 +6665,46 @@ "name": "onClear", "propType": "func" }, - { - "name": "htmlType", - "propType": "string", - "description": "原生type" - }, - { - "name": "htmlSize", - "propType": "string" - }, { "name": "hint", - "propType": "string", + "title": "Icon 水印", + "propType": "icon", "description": "水印 (Icon的type类型,和hasClear占用一个地方)" }, { "name": "innerBefore", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "文字前附加内容" }, { "name": "innerAfter", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "文字后附加内容" }, { "name": "addonBefore", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "输入框前附加内容" }, { "name": "addonAfter", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "输入框后附加内容" }, { "name": "addonTextBefore", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "输入框前附加文字" }, { "name": "addonTextAfter", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "输入框后附加文字" - }, - { - "name": "autoComplete", "propType": "string", - "description": "(原生input支持)", - "defaultValue": "off" + "description": "输入框后附加文字" }, { "name": "autoFocus", "propType": "bool", - "description": "自动聚焦(原生input支持)" - }, - { - "name": "inputRender", - "propType": "func" - }, - { - "name": "extra", - "propType": { - "type": "instanceOf", - "value": "node" - } - }, - { - "name": "innerBeforeClassName", - "propType": "string" - }, - { - "name": "innerAfterClassName", - "propType": "string" - }, - { - "name": "isPreview", - "propType": "bool", - "description": "是否为预览态", - "defaultValue": false - }, - { - "name": "renderPreview", - "propType": "func", - "description": "预览态模式下渲染的内容\n@param {number} value 评分值" + "description": "自动聚焦" }, { "name": "style", @@ -5803,6 +6732,136 @@ "description": "是否展示切换按钮", "defaultValue": true }, + { + "name": "label", + "propType": "string", + "title":"标签文案", + "description": "label" + }, + { + "name": "hasClear", + "propType": "bool", + "description": "是否出现清除按钮" + }, + { + "name": "state", + "title": "状态", + "propType": { + "type": "oneOf", + "value": [ + "error", + "loading", + "success", + "warning" + ] + }, + "description": "状态\n@enumdesc 错误, 校验中, 成功, 警告" + }, + { + "name": "size", + "title": "尺寸", + "propType": { + "type": "oneOf", + "value": [ + "small", + "medium", + "large" + ] + }, + "description": "尺寸\n@enumdesc 小, 中, 大", + "defaultValue": "medium" + }, + { + "name": "disabled", + "propType": "bool", + "description": "是否禁用" + }, + { + "name": "maxLength", + "propType": "number", + "description": "最大长度" + }, + { + "name": "hasLimitHint", + "propType": "bool", + "description": "是否展现最大长度样式" + }, + { + "name": "cutString", + "propType": "bool", + "description": "是否截断超出字符串" + }, + { + "name": "readOnly", + "propType": "bool", + "description": "是否只读" + }, + { + "name": "trim", + "propType": "bool", + "description": "onChange返回会自动去除头尾空字符" + }, + { + "name": "placeholder", + "propType": "string", + "description": "输入提示" + }, + { + "name": "hasBorder", + "propType": "bool", + "description": "是否有边框" + }, + + { + "name": "onPressEnter", + "propType": "func", + "description": "按下回车的回调" + }, + { + "name": "onClear", + "propType": "func" + }, + { + "name": "hint", + "title": "Icon 水印", + "propType": "string", + "description": "水印 (Icon的type类型,和hasClear占用一个地方)" + }, + { + "name": "innerBefore", + "propType": "string", + "description": "文字前附加内容" + }, + { + "name": "innerAfter", + "propType": "string", + "description": "文字后附加内容" + }, + { + "name": "addonBefore", + "propType": "string", + "description": "输入框前附加内容" + }, + { + "name": "addonAfter", + "propType": "string", + "description": "输入框后附加内容" + }, + { + "name": "addonTextBefore", + "propType": "string", + "description": "输入框前附加文字" + }, + { + "name": "addonTextAfter", + "propType": "string", + "description": "输入框后附加文字" + }, + { + "name": "autoFocus", + "propType": "bool", + "description": "自动聚焦" + }, { "name": "style", "propType": "object" @@ -5842,13 +6901,7 @@ }, { "name": "autoHeight", - "propType": { - "type": "oneOfType", - "value": [ - "bool", - "object" - ] - }, + "propType": "bool", "description": "自动高度 true / {minRows: 2, maxRows: 4}", "defaultValue": false }, @@ -5864,11 +6917,6 @@ "description": "是否为预览态", "defaultValue": false }, - { - "name": "renderPreview", - "propType": "func", - "description": "预览态模式下渲染的内容\n@param {number} value 评分值" - }, { "name": "style", "propType": "object" @@ -5957,15 +7005,9 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "description": "样式前缀", - "defaultValue": "next-" - }, { "name": "tip", - "propType": "any", + "propType": "string", "description": "自定义内容" }, { @@ -5977,7 +7019,7 @@ "bottom" ] }, - "description": "自定义内容位置\n@enumdesc 出现在动画右边, 出现在动画下面", + "description": "自定义内容位置", "defaultValue": "bottom" }, { @@ -6012,14 +7054,9 @@ "description": "设置动画尺寸\n@description 仅仅对默认动画效果起作用\n@enumdesc 大号, 中号", "defaultValue": "large" }, - { - "name": "indicator", - "propType": "any", - "description": "自定义动画" - }, { "name": "color", - "propType": "string", + "propType": "color", "description": "动画颜色" }, { @@ -6027,26 +7064,19 @@ "propType": "bool", "description": "全屏展示" }, - { - "name": "children", - "propType": "any", - "description": "子元素" - }, { "name": "inline", + "title": "inline", "propType": "bool", "description": "should loader be displayed inline", "defaultValue": true - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "animate", - "defaultValue": null } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "Menu", @@ -6062,66 +7092,11 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "pure", - "propType": "bool", - "defaultValue": false - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "className", - "propType": "string" - }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "菜单项和子菜单" - }, { "name": "onItemClick", "propType": "func", "description": "点击菜单项触发的回调函数\n@param {String} key 点击的菜单项的 key 值\n@param {Object} item 点击的菜单项对象\n@param {Object} event 点击的事件对象" }, - { - "name": "openKeys", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "当前打开的子菜单的 key 值" - }, - { - "name": "defaultOpenKeys", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "初始打开的子菜单的 key 值", - "defaultValue": [] - }, { "name": "defaultOpenAll", "propType": "bool", @@ -6204,56 +7179,11 @@ "description": "弹层的对齐方式", "defaultValue": "follow" }, - { - "name": "popupProps", - "propType": { - "type": "oneOfType", - "value": [ - "object", - "func" - ] - }, - "description": "弹层自定义 props" - }, { "name": "popupClassName", "propType": "string", "description": "弹出子菜单自定义 className" }, - { - "name": "popupStyle", - "propType": "object", - "description": "弹出子菜单自定义 style" - }, - { - "name": "selectedKeys", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "当前选中菜单项的 key 值" - }, - { - "name": "defaultSelectedKeys", - "propType": { - "type": "oneOfType", - "value": [ - "string", - { - "type": "instanceOf", - "value": "array" - } - ] - }, - "description": "初始选中菜单项的 key 值", - "defaultValue": [] - }, { "name": "onSelect", "propType": "func", @@ -6323,24 +7253,14 @@ "description": "横向菜单模式下,是否维持在一行,即超出一行折叠成 SubMenu 显示, 仅在 direction='hoz' mode='popup' 时生效", "defaultValue": false }, - { - "name": "renderMore", - "propType": "func" - }, { "name": "header", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "自定义菜单头部" }, { "name": "footer", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "自定义菜单尾部" }, { @@ -6389,6 +7309,64 @@ { "name": "style", "propType": "object" + }, + { + "name": "openKeys", + "propType": { + "type": "oneOfType", + "value": [ + "string", + { + "type": "arrayOf", + "value": "string" + } + ] + }, + "description": "当前打开的子菜单的 key 值" + }, + { + "name": "defaultOpenKeys", + "propType": { + "type": "oneOfType", + "value": [ + "string", + { + "type": "arrayOf", + "value": "string" + } + ] + }, + "description": "初始打开的子菜单的 key 值", + "defaultValue": [] + }, + { + "name": "selectedKeys", + "propType": { + "type": "oneOfType", + "value": [ + "string", + { + "type": "arrayOf", + "value": "string" + } + ] + }, + "description": "当前选中菜单项的 key 值" + }, + { + "name": "defaultSelectedKeys", + "propType": { + "type": "oneOfType", + "value": [ + "string", + { + "type": "arrayOf", + "value": "string" + } + ] + }, + "description": "初始选中菜单项的 key 值", + "defaultValue": [] } ], "configure": { @@ -6399,7 +7377,7 @@ }, { "componentName": "SubMenu", - "title": "SubMenu", + "title": "子菜单", "docUrl": "", "screenshot": "", "npm": { @@ -6412,37 +7390,13 @@ }, "props": [ { - "name": "_key", - "propType": "string" - }, - { - "name": "root", - "propType": "object" - }, - { - "name": "level", - "propType": "number" - }, - { - "name": "inlineLevel", - "propType": "number" - }, - { - "name": "groupIndent", - "propType": "number", - "defaultValue": 0 - }, - { - "name": "noIcon", - "propType": "bool", - "defaultValue": false + "name": "key", + "propType": "string", + "description": "子菜单标识符" }, { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "标签内容" }, { @@ -6462,65 +7416,23 @@ }, "description": "子菜单打开方式,如果设置会覆盖 Menu 上的同名属性\n@default Menu 的 mode 属性值" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "菜单项或下一级子菜单" - }, - { - "name": "onMouseEnter", - "propType": "func" - }, - { - "name": "onMouseLeave", - "propType": "func" - }, - { - "name": "subMenuContentClassName", - "propType": "string" - }, - { - "name": "triggerType", - "propType": { - "type": "oneOf", - "value": [ - "click", - "hover" - ] - } - }, - { - "name": "align", - "propType": { - "type": "oneOf", - "value": [ - "outside", - "follow" - ] - } - }, - { - "name": "parentMode", - "propType": { - "type": "oneOf", - "value": [ - "inline", - "popup" - ] - } - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { "componentName": "Menu.Item", - "title": "SelectableItem", + "title": "Menu.Item", "docUrl": "", "screenshot": "", "npm": { @@ -6533,24 +7445,9 @@ }, "props": [ { - "name": "_key", - "propType": "string" - }, - { - "name": "root", - "propType": "object" - }, - { - "name": "selected", - "propType": "bool" - }, - { - "name": "onSelect", - "propType": "func" - }, - { - "name": "inlineIndent", - "propType": "number" + "name": "key", + "propType": "string", + "description": "菜单项标识符" }, { "name": "disabled", @@ -6560,50 +7457,22 @@ }, { "name": "helper", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "帮助文本" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "菜单项标签内容" - }, - { - "name": "className", - "propType": "string" - }, - { - "name": "onKeyDown", - "propType": "func" - }, - { - "name": "onClick", - "propType": "func" - }, - { - "name": "needIndent", - "propType": "bool", - "defaultValue": true - }, - { - "name": "hasSelectedIcon", - "propType": "bool" - }, - { - "name": "isSelectIconRight", - "propType": "bool" - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { "componentName": "CheckboxItem", @@ -6644,30 +7513,22 @@ }, { "name": "helper", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "帮助文本" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "标签内容" - }, - { - "name": "checkboxDisabled", - "propType": "bool", - "defaultValue": false - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { "componentName": "RadioItem", @@ -6702,29 +7563,26 @@ }, { "name": "helper", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "帮助文本" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "标签内容" - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { - "componentName": "PopupItem", - "title": "PopupItem", + "componentName": "Menu.PopupItem", + "title": "Menu.PopupItem", "docUrl": "", "screenshot": "", "npm": { @@ -6737,84 +7595,33 @@ }, "props": [ { - "name": "_key", - "propType": "string" - }, - { - "name": "root", - "propType": "object" - }, - { - "name": "level", - "propType": "number" - }, - { - "name": "hasSubMenu", - "propType": "bool" - }, - { - "name": "noIcon", - "propType": "bool", - "defaultValue": false - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "selectable", - "propType": "bool", - "defaultValue": false + "name": "key", + "propType": "string", + "description": "菜单项标识符" }, { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "标签内容" }, { "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "自定义弹层内容" }, - { - "name": "className", - "propType": "string" - }, - { - "name": "triggerType", - "propType": { - "type": "oneOf", - "value": [ - "click", - "hover" - ] - } - }, - { - "name": "align", - "propType": { - "type": "oneOf", - "value": [ - "outside", - "follow" - ] - } - }, - { - "name": "autoWidth", - "propType": "bool" - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { "componentName": "Menu.Group", @@ -6830,14 +7637,6 @@ "subName": "Group" }, "props": [ - { - "name": "root", - "propType": "object" - }, - { - "name": "className", - "propType": "string" - }, { "name": "label", "propType": { @@ -6846,32 +7645,22 @@ }, "description": "标签内容" }, - { - "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "菜单项" - }, - { - "name": "parentMode", - "propType": { - "type": "oneOf", - "value": [ - "inline", - "popup" - ] - } - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": true, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { - "componentName": "Divider", + "componentName": "Menu.Divider", "title": "Divider", "docUrl": "", "screenshot": "", @@ -6884,19 +7673,19 @@ "subName": "Divider" }, "props": [ - { - "name": "root", - "propType": "object" - }, - { - "name": "className", - "propType": "string" - }, { "name": "style", "propType": "object" } - ] + ], + "configure": { + "component": { + "isContainer": false, + "nestingRule": { + "parentWhitelist": ["Menu", "SubMenu", "Menu.Group", "MenuButton"] + } + } + } }, { "componentName": "MenuButton", @@ -6912,17 +7701,9 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, { "name": "label", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "string", "description": "按钮上的文本内容" }, { @@ -6986,8 +7767,8 @@ { "name": "defaultSelectedKeys", "propType": { - "type": "instanceOf", - "value": "array" + "type": "arrayOf", + "value": "string" }, "description": "默认激活的菜单项(用法同 Menu 非受控)", "defaultValue": [] @@ -6995,8 +7776,8 @@ { "name": "selectedKeys", "propType": { - "type": "instanceOf", - "value": "array" + "type": "arrayOf", + "value": "string" }, "description": "激活的菜单项(用法同 Menu 受控)" }, @@ -7029,16 +7810,13 @@ { "name": "style", "propType": "object" - }, - { - "name": "className", - "propType": "string" - }, - { - "name": "children", - "propType": "any" } - ] + ], + "configure": { + "component": { + "isContainer": true + } + } }, { "componentName": "Message", @@ -7054,16 +7832,6 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "pure", - "propType": "bool", - "defaultValue": false - }, { "name": "className", "propType": "string" @@ -7072,6 +7840,12 @@ "name": "style", "propType": "object" }, + { + "name": "title", + "propType": "string", + "description": "标题", + "defaultValue": "标题" + }, { "name": "type", "propType": { @@ -7098,7 +7872,7 @@ "toast" ] }, - "description": "反馈外观", + "description": "外观", "defaultValue": "inline" }, { @@ -7110,31 +7884,20 @@ "large" ] }, - "description": "反馈大小", + "description": "尺寸", "defaultValue": "medium" }, - { - "name": "title", - "propType": { - "type": "instanceOf", - "value": "node" - }, - "description": "标题" - }, { "name": "children", "propType": { - "type": "instanceOf", - "value": "node" + "type": "oneOfType", + "value": [ + "string", + "node" + ] }, "description": "内容" }, - { - "name": "defaultVisible", - "propType": "bool", - "description": "默认是否显示", - "defaultValue": true - }, { "name": "visible", "propType": "bool", @@ -7142,7 +7905,7 @@ }, { "name": "iconType", - "propType": "string", + "propType": "icon", "description": "显示的图标类型,会覆盖内部设置的IconType" }, { @@ -7164,16 +7927,8 @@ { "name": "animation", "propType": "bool", - "description": "是否开启展开收起动画", + "description": "收起动画", "defaultValue": true - }, - { - "name": "locale", - "propType": "object" - }, - { - "name": "rtl", - "propType": "bool" } ] }, @@ -7191,34 +7946,13 @@ "subName": "" }, "props": [ - { - "name": "prefix", - "propType": "string", - "defaultValue": "next-" - }, - { - "name": "pure", - "propType": "bool", - "defaultValue": false - }, - { - "name": "rtl", - "propType": "bool" - }, - { - "name": "className", - "propType": "string" - }, { "name": "style", "propType": "object" }, { "name": "children", - "propType": { - "type": "instanceOf", - "value": "node" - }, + "propType": "node", "description": "导航项和子导航" }, { @@ -7232,7 +7966,7 @@ "line" ] }, - "description": "导航类型\n@enumdesc 普通, 主要, 次要, 线形", + "description": "导航类型", "defaultValue": "normal" }, { @@ -7244,7 +7978,7 @@ "ver" ] }, - "description": "导航布局\n@enumdesc 水平, 垂直", + "description": "导航布局", "defaultValue": "ver" }, { @@ -7256,7 +7990,7 @@ "right" ] }, - "description": "横向导航条 items 和 footer 的对齐方向,在 direction 设置为 'hoz' 并且 header 存在时生效", + "description": "对齐方向", "defaultValue": "left" }, { @@ -7271,7 +8005,7 @@ "right" ] }, - "description": "设置组件选中状态的 active 边方向\n@enumdesc 无, 上, 下, 左, 右\n@default 当 direction 为 'hoz' 时,默认值为 'bottom',当 direction 为 'ver' 时,默认值为 'left'" + "description": "选中条方向" }, { "name": "mode", @@ -7282,7 +8016,7 @@ "popup" ] }, - "description": "子导航打开的模式(水平导航只支持弹出)\n@eumdesc 行内, 弹出", + "description": "子导航打开的模式", "defaultValue": "inline" }, { @@ -7306,7 +8040,7 @@ { "name": "defaultOpenAll", "propType": "bool", - "description": "初始展开所有的子导航,只在 mode 设置为 'inline' 以及 openMode 设置为 'multiple' 下生效", + "description": "初始展开所有的子导航", "defaultValue": false }, { @@ -7318,7 +8052,7 @@ "multiple" ] }, - "description": "内联子导航的展开模式,同时可以展开一个同级子导航还是多个同级子导航,该属性仅在 mode 为 inline 时生效\n@eumdesc 一个, 多个", + "description": "内联子导航的展开模式", "defaultValue": "multiple" }, { @@ -7333,7 +8067,7 @@ } ] }, - "description": "当前选中导航项的 key 值" + "description": "当前选中导航key值" }, { "name": "defaultSelectedKeys", @@ -7347,8 +8081,7 @@ } ] }, - "description": "初始选中导航项的 key 值", - "defaultValue": [] + "description": "初始选中导航项的key值" }, { "name": "onSelect", @@ -7380,13 +8113,13 @@ { "name": "hasArrow", "propType": "bool", - "description": "是否显示右侧的箭头(仅在 iconOnly=true 时生效)", + "description": "是否显示右侧的箭头", "defaultValue": true }, { "name": "hasTooltip", "propType": "bool", - "description": "是否有 ToolTips (仅在 iconOnly=true 时生效)", + "description": "是否有ToolTips", "defaultValue": false }, { @@ -7408,18 +8141,19 @@ { "name": "embeddable", "propType": "bool", - "description": "是否开启嵌入式模式,一般用于Layout的布局中,开启后没有默认背景、外层border、box-shadow,可以配合`