chore: 🤖 update demo

This commit is contained in:
kangwei 2020-03-27 15:09:45 +08:00
parent cd7c7257d7
commit 2f21a0d4d5
28 changed files with 81 additions and 3517 deletions

View File

@ -1,12 +0,0 @@
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false

View File

@ -1,11 +0,0 @@
# 忽略目录
build/
tests/
demo/
# node 覆盖率文件
coverage/
# 忽略文件
**/*-min.js
**/*.min.js

View File

@ -1,16 +0,0 @@
const { tslint, deepmerge } = require('@ice/spec');
module.exports = deepmerge(tslint, {
rules: {
"global-require": 0,
"comma-dangle": 0,
"no-unused-expressions": 0,
"object-shorthand": 0,
"jsx-a11y/anchor-has-content": 0,
"react/sort-comp": 0,
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx", ".tsx", "ts"] }],
"@typescript-eslint/interface-name-prefix": 0,
"@typescript-eslint/no-explicit-any": 0,
"@typescript-eslint/explicit-member-accessibility": 0
},
});

View File

@ -1,20 +0,0 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# production
/build
/dist
# misc
.idea/
.happypack
.DS_Store
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# ignore d.ts auto generated by css-modules-typescript-loader
*.module.scss.d.ts

View File

@ -1,4 +0,0 @@
{
"printWidth": 120,
"singleQuote": true
}

View File

@ -1,7 +0,0 @@
# 忽略目录
build/
tests/
demo/
# node 覆盖率文件
coverage/

View File

@ -1,3 +0,0 @@
const { stylelint } = require('@ice/spec');
module.exports = stylelint;

View File

@ -3,13 +3,10 @@ const path = require('path');
module.exports = { module.exports = {
entry: { entry: {
'index': 'src/index.tsx', 'index': 'src/index.tsx',
'simulator-renderer': '../designer/src/builtins/simulator/renderer/index.ts' 'simulator-renderer': '../react-simulator-renderer/src/index.ts'
}, },
"vendor": false, "vendor": false,
publicPath: './', publicPath: './',
alias: {
'@': path.resolve(__dirname, './src'),
},
plugins: [ plugins: [
['ice-plugin-fusion', { ['ice-plugin-fusion', {
themePackage: '@alife/theme-lowcode-light', themePackage: '@alife/theme-lowcode-light',

View File

@ -1,9 +0,0 @@
{
"compilerOptions": {
"baseUrl": ".",
"jsx": "react",
"paths": {
"@/*": ["./src/*"]
}
}
}

View File

@ -27,31 +27,19 @@
"store": "^2.0.12" "store": "^2.0.12"
}, },
"devDependencies": { "devDependencies": {
"@ice/spec": "^1.0.1",
"@types/debug": "^4.1.5", "@types/debug": "^4.1.5",
"@types/events": "^3.0.0", "@types/events": "^3.0.0",
"@types/react": "^16.8.3", "@types/react": "^16.8.3",
"@types/react-dom": "^16.8.2", "@types/react-dom": "^16.8.2",
"@types/store": "^2.0.2", "@types/store": "^2.0.2",
"css-modules-typescript-loader": "^2.0.4", "css-modules-typescript-loader": "^2.0.4",
"eslint": "^6.0.1",
"husky": "^4.2.3",
"ice-plugin-fusion": "^0.1.4", "ice-plugin-fusion": "^0.1.4",
"ice-plugin-moment-locales": "^0.1.0", "ice-plugin-moment-locales": "^0.1.0",
"ice-scripts": "^2.0.0", "ice-scripts": "^2.0.0"
"prettier": "^1.19.1",
"stylelint": "^10.1.0"
}, },
"scripts": { "scripts": {
"start": "ice-scripts dev", "start": "ice-scripts dev",
"build": "ice-scripts build", "build": "ice-scripts build"
"lint": "npm run eslint && npm run stylelint",
"eslint": "eslint --cache --ext .js,.jsx ./",
"stylelint": "stylelint ./**/*.scss",
"prettier": "prettier --write \"./src/**/*.{ts,tsx,js,jsx,ejs,less,css,scss,json}\" "
},
"engines": {
"node": ">=8.0.0"
}, },
"iceworks": { "iceworks": {
"type": "react", "type": "react",
@ -59,9 +47,5 @@
}, },
"ideMode": { "ideMode": {
"name": "ice-react" "name": "ice-react"
},
"repository": {
"type": "git",
"url": "https://github.com/ice-lab/react-materials/tree/master/scaffolds/ice-ts"
} }
} }

View File

@ -16,6 +16,6 @@
</head> </head>
<body class="dark"> <body class="dark">
<div id="ice-container"></div> <div id="lce-container"></div>
</body> </body>
</html> </html>

File diff suppressed because it is too large Load Diff

View File

@ -1,19 +1,18 @@
import componentsPane from '@ali/lowcode-plugin-components-pane';
import Settings from '../../../plugin-settings';
import undoRedo from '@ali/lowcode-plugin-undo-redo'; import undoRedo from '@ali/lowcode-plugin-undo-redo';
import Designer from '../plugins/designer';
import logo from '@ali/lowcode-plugin-logo'; import logo from '@ali/lowcode-plugin-logo';
import save from '@ali/lowcode-plugin-save'; import save from '@ali/lowcode-plugin-save';
import OutlineTree from '../../../plugin-outline-tree'; import Designer from '@ali/lowcode-plugin-designer';
import SettingsPane from '@ali/lowcode-plugin-settings-pane';
import componentsPane from '@ali/lowcode-plugin-components-pane';
import OutlinePane from '@ali/lowcode-plugin-outline-pane';
import { PluginFactory } from '@ali/lowcode-editor-core'; import { PluginFactory } from '@ali/lowcode-editor-core';
export default { export default {
logo: PluginFactory(logo), logo: PluginFactory(logo),
save: PluginFactory(save), save: PluginFactory(save),
designer: PluginFactory(Designer),
settings: PluginFactory(Settings),
outlineTree: PluginFactory(OutlineTree),
undoRedo: PluginFactory(undoRedo), undoRedo: PluginFactory(undoRedo),
componentsPane: PluginFactory(componentsPane) designer: PluginFactory(Designer),
componentsPane: PluginFactory(componentsPane),
settingsPane: PluginFactory(SettingsPane),
OutlinePane: PluginFactory(OutlinePane),
}; };

View File

@ -1 +0,0 @@
export default {};

View File

@ -1,10 +0,0 @@
import en_us from './en-US';
import zh_cn from './zh-CN';
import zh_tw from './zh-TW';
import ja_jp from './ja-JP';
export default {
'en-US': en_us,
'zh-CN': zh_cn,
'zh-TW': zh_tw,
'ja-JP': ja_jp
};

View File

@ -1 +0,0 @@
export default {};

View File

@ -1 +0,0 @@
export default {};

View File

@ -1 +0,0 @@
export default {};

View File

@ -79,7 +79,7 @@ export default {
} }
}, },
{ {
pluginKey: 'outlineTree', pluginKey: 'outlinePane',
type: 'PanelIcon', type: 'PanelIcon',
props: { props: {
align: 'top', align: 'top',
@ -87,6 +87,7 @@ export default {
title: '大纲树' title: '大纲树'
}, },
config: { config: {
package: '@ali/lowcode-plugin-outline-pane',
version: '^1.0.0' version: '^1.0.0'
}, },
pluginProps: {} pluginProps: {}
@ -94,7 +95,7 @@ export default {
], ],
rightArea: [ rightArea: [
{ {
pluginKey: 'settings', pluginKey: 'settingsPane',
type: 'Panel', type: 'Panel',
props: {}, props: {},
config: { config: {

View File

@ -4,16 +4,16 @@ import Skeleton from '@ali/lowcode-editor-skeleton';
import config from './config/skeleton'; import config from './config/skeleton';
import components from './config/components'; import components from './config/components';
import utils from './config/utils'; import utils from './config/utils';
import '@ali/lowcode-setters';
import './config/locale'; import './config/locale';
import '../../plugin-setters';
import './global.scss'; import './global.scss';
import './config/theme.scss'; import './config/theme.scss';
const ICE_CONTAINER = document.getElementById('ice-container'); const LCE_CONTAINER = document.getElementById('lce-container');
if (!ICE_CONTAINER) { if (!LCE_CONTAINER) {
throw new Error('当前页面不存在 <div id="ice-container"></div> 节点.'); throw new Error('当前页面不存在 <div id="lce-container"></div> 节点.');
} }
ReactDOM.render(<Skeleton config={config} utils={utils} components={components} />, ICE_CONTAINER); ReactDOM.render(<Skeleton config={config} utils={utils} components={components} />, LCE_CONTAINER);

View File

@ -1,4 +0,0 @@
.lowcode-plugin-designer {
width: 100%;
height: 100%;
}

View File

@ -1,213 +0,0 @@
import React, { PureComponent } from 'react';
import Editor from '@ali/lowcode-editor-core';
import { PluginConfig } from '@ali/lowcode-editor-core/lib/definitions';
import assets from '../../config/assets';
// @ts-ignore
import Designer from '../../../../designer';
import './index.scss';
export interface PluginProps {
editor: Editor;
config: PluginConfig;
}
const SCHEMA = {
version: '1.0',
componentsMap: [],
componentsTree: [
{
componentName: 'Page',
fileName: 'test',
dataSource: {
list: []
},
state: {
text: 'outter'
},
props: {
ref: 'outterView',
autoLoading: true,
style: {
padding: 20
}
},
children: [
{
componentName: 'Form',
props: {
labelCol: 3,
style: {},
ref: 'testForm'
},
children: [
{
componentName: 'Form.Item',
props: {
label: '姓名:',
name: 'name',
initValue: '李雷'
},
children: [
{
componentName: 'Input',
props: {
placeholder: '请输入',
size: 'medium',
style: {
width: 320
}
}
}
]
},
{
componentName: 'Form.Item',
props: {
label: '年龄:',
name: 'age',
initValue: '22'
},
children: [
{
componentName: 'NumberPicker',
props: {
size: 'medium',
type: 'normal'
}
}
]
},
{
componentName: 'Form.Item',
props: {
label: {
type: 'JSSlot',
value: {
componentName: 'Div',
children: '职业:',
}
},
name: 'profession'
},
children: [
{
componentName: 'Select',
props: {
dataSource: [
{
label: '教师',
value: 't'
},
{
label: '医生',
value: 'd'
},
{
label: '歌手',
value: 's'
}
]
}
}
]
},
{
componentName: 'Div',
props: {
style: {
textAlign: 'center'
}
},
children: [
{
componentName: 'Button.Group',
props: {},
children: [
{
componentName: 'Button',
props: {
type: 'primary',
style: {
margin: '0 5px 0 5px'
},
htmlType: 'submit'
},
children: '提交',
condition: true,
loop: [1,2,3],
conditionGroup: '1'
},
{
componentName: 'Button',
props: {
type: 'normal',
style: {
margin: '0 5px 0 5px'
},
htmlType: 'reset'
},
children: '重置',
condition: false,
conditionGroup: '1'
}
]
}
]
}
]
}
]
}
]
};
export default class DesignerPlugin extends PureComponent<PluginProps> {
displayName: 'LowcodePluginDesigner';
componentDidMount(): void {
const { editor } = this.props;
editor.on('schema.reset', this.handleSchemaReset);
}
componentWillUmount(): void {
const { editor } = this.props;
editor.off('schema.reset', this.handleSchemaReset);
}
handleSchemaReset = (schema: object): void => {
// const {editor} = this.props;
// if (this.designer) {
// this.designer.setSchema(schema);
// } else {
// editor.once('designer.ready', (designer): void => {
// designer.setSchema(schema);
// });
// }
};
handleDesignerMount = (designer): void => {
const { editor } = this.props;
this.designer = designer;
editor.set('designer', designer);
editor.emit('designer.ready', designer);
};
render(): React.ReactNode {
const { editor } = this.props;
// const assets = editor.get('assets') || {};
return (
<Designer
onMount={this.handleDesignerMount}
className="lowcode-plugin-designer"
defaultSchema={SCHEMA as any}
eventPipe={editor as any}
componentMetadatas={Object.values(assets.components) as any}
simulatorProps={{
library: Object.values(assets.packages || {})
}}
/>
);
}
}

File diff suppressed because it is too large Load Diff

View File

@ -1 +0,0 @@
// test file

View File

@ -1,30 +1,9 @@
{ {
"compileOnSave": false, "extends": "../../tsconfig.json",
"buildOnSave": false,
"compilerOptions": { "compilerOptions": {
"baseUrl": ".",
"outDir": "build", "outDir": "build",
"module": "esnext",
"target": "es6", "target": "es6",
"jsx": "react", "jsx": "react"
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"lib": ["es6", "dom"],
"sourceMap": true,
"allowJs": true,
"rootDir": "src",
"forceConsistentCasingInFileNames": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": false,
"importHelpers": true,
"strictNullChecks": true,
"suppressImplicitAnyIndexErrors": true,
"noUnusedLocals": true,
"skipLibCheck": true,
"paths": {
"@/*": ["./src/*"]
}
}, },
"include": ["src/*"], "include": ["src/*"],
"exclude": ["node_modules", "build", "public"] "exclude": ["node_modules", "build", "public"]

View File

@ -1,7 +1,7 @@
import Editor from './editor'; import Editor from './editor';
import * as utils from './utils'; import * as utils from './utils';
import * as definitions from './definitions'; export * from './definitions';
export { default as PluginFactory } from './pluginFactory'; export { default as PluginFactory } from './pluginFactory';
export { default as EditorContext } from './context'; export { default as EditorContext } from './context';
@ -9,4 +9,4 @@ export { default as AreaManager } from './areaManager';
export default Editor; export default Editor;
export { utils, definitions }; export { Editor, utils };

View File

@ -1,11 +1,6 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Editor, PluginConfig } from '@ali/lowcode-editor-core';
import Editor from '@ali/lowcode-editor-core'; import { DesignerView, Designer } from '@ali/lowcode-designer';
import { PluginConfig } from '@ali/lowcode-editor-core/lib/definitions';
// @ts-ignore
import Designer from '../../designer';
import './index.scss'; import './index.scss';
export interface PluginProps { export interface PluginProps {
@ -21,17 +16,17 @@ const SCHEMA = {
componentName: 'Page', componentName: 'Page',
fileName: 'test', fileName: 'test',
dataSource: { dataSource: {
list: [] list: [],
}, },
state: { state: {
text: 'outter' text: 'outter',
}, },
props: { props: {
ref: 'outterView', ref: 'outterView',
autoLoading: true, autoLoading: true,
style: { style: {
padding: 20 padding: 20,
} },
}, },
children: [ children: [
{ {
@ -39,7 +34,7 @@ const SCHEMA = {
props: { props: {
labelCol: 3, labelCol: 3,
style: {}, style: {},
ref: 'testForm' ref: 'testForm',
}, },
children: [ children: [
{ {
@ -47,7 +42,7 @@ const SCHEMA = {
props: { props: {
label: '姓名:', label: '姓名:',
name: 'name', name: 'name',
initValue: '李雷' initValue: '李雷',
}, },
children: [ children: [
{ {
@ -56,34 +51,34 @@ const SCHEMA = {
placeholder: '请输入', placeholder: '请输入',
size: 'medium', size: 'medium',
style: { style: {
width: 320 width: 320,
} },
} },
} },
] ],
}, },
{ {
componentName: 'Form.Item', componentName: 'Form.Item',
props: { props: {
label: '年龄:', label: '年龄:',
name: 'age', name: 'age',
initValue: '22' initValue: '22',
}, },
children: [ children: [
{ {
componentName: 'NumberPicker', componentName: 'NumberPicker',
props: { props: {
size: 'medium', size: 'medium',
type: 'normal' type: 'normal',
} },
} },
] ],
}, },
{ {
componentName: 'Form.Item', componentName: 'Form.Item',
props: { props: {
label: '职业:', label: '职业:',
name: 'profession' name: 'profession',
}, },
children: [ children: [
{ {
@ -92,27 +87,27 @@ const SCHEMA = {
dataSource: [ dataSource: [
{ {
label: '教师', label: '教师',
value: 't' value: 't',
}, },
{ {
label: '医生', label: '医生',
value: 'd' value: 'd',
}, },
{ {
label: '歌手', label: '歌手',
value: 's' value: 's',
} },
] ],
} },
} },
] ],
}, },
{ {
componentName: 'Div', componentName: 'Div',
props: { props: {
style: { style: {
textAlign: 'center' textAlign: 'center',
} },
}, },
children: [ children: [
{ {
@ -124,59 +119,60 @@ const SCHEMA = {
props: { props: {
type: 'primary', type: 'primary',
style: { style: {
margin: '0 5px 0 5px' margin: '0 5px 0 5px',
}, },
htmlType: 'submit' htmlType: 'submit',
}, },
children: '提交' children: '提交',
}, },
{ {
componentName: 'Button', componentName: 'Button',
props: { props: {
type: 'normal', type: 'normal',
style: { style: {
margin: '0 5px 0 5px' margin: '0 5px 0 5px',
}, },
htmlType: 'reset' htmlType: 'reset',
}, },
children: '重置' children: '重置',
} },
] ],
} },
] ],
} },
] ],
} },
] ],
} },
] ],
}; };
export default class DesignerPlugin extends PureComponent<PluginProps> { export default class DesignerPlugin extends PureComponent<PluginProps> {
displayName: 'LowcodePluginDesigner'; static displayName: 'LowcodePluginDesigner';
componentDidMount(): void { componentDidMount(): void {
const {editor} = this.props; const { editor } = this.props;
editor.on('schema.reset', this.handleSchemaReset); editor.on('schema.reset', this.handleSchemaReset);
} }
componentWillUmount(): void { componentWillUmount(): void {
const {editor} = this.props; const { editor } = this.props;
editor.off('schema.reset', this.handleSchemaReset); editor.off('schema.reset', this.handleSchemaReset);
} }
handleSchemaReset = (schema: object): void => { private designer?: Designer;
const {editor} = this.props; handleSchemaReset = (schema: any): void => {
const { editor } = this.props;
if (this.designer) { if (this.designer) {
this.designer.setSchema(schema); this.designer.setSchema(schema);
} else { } else {
editor.once('designer.ready', (designer): void => { editor.once('designer.ready', (designer: Designer): void => {
designer.setSchema(schema); designer.setSchema(schema);
}); });
} }
} };
handleDesignerMount = (designer): void => { handleDesignerMount = (designer: Designer): void => {
const { editor } = this.props; const { editor } = this.props;
this.designer = designer; this.designer = designer;
editor.set('designer', designer); editor.set('designer', designer);
@ -187,7 +183,7 @@ export default class DesignerPlugin extends PureComponent<PluginProps> {
const { editor } = this.props; const { editor } = this.props;
const assets = editor.get('assets') || {}; const assets = editor.get('assets') || {};
return ( return (
<Designer <DesignerView
onMount={this.handleDesignerMount} onMount={this.handleDesignerMount}
className="lowcode-plugin-designer" className="lowcode-plugin-designer"
defaultSchema={SCHEMA as any} defaultSchema={SCHEMA as any}

View File

@ -1,20 +1,9 @@
{ {
"compileOnSave": false, "extends": "../../tsconfig.json",
"buildOnSave": false,
"compilerOptions": { "compilerOptions": {
"outDir": "build", "outDir": "lib",
"module": "esnext",
"target": "es6", "target": "es6",
"jsx": "react", "jsx": "react",
"moduleResolution": "node",
"lib": ["es6", "dom"],
"sourceMap": true,
"allowJs": true,
"noUnusedLocals": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": true,
"skipLibCheck": true
}, },
"include": ["src/*.ts", "src/*.tsx"], "include": ["src/*.ts", "src/*.tsx"],
"exclude": ["node_modules", "build", "public"] "exclude": ["node_modules", "build", "public"]