1.0.0发布准备

This commit is contained in:
荣彬 2020-08-11 16:48:55 +08:00
commit 628cbf6b70
169 changed files with 6307 additions and 888 deletions

3
.gitignore vendored
View File

@ -4,6 +4,7 @@ dist
packages/*/lib/
packages/*/es/
packages/*/dist/
packages/*/output/
package-lock.json
yarn.lock
deploy-space/packages
@ -102,4 +103,4 @@ typings/
.DS_Store
# codealike
codealike.json
codealike.json

View File

@ -3,6 +3,24 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.10"></a>
## [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)
### Bug Fixes
* 修复 condition 代码导出错误 ([57b30cf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/57b30cf))
* 新增自定义模式 demo & 导出自定义需要的信息 ([07e2759](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/07e2759))
### Features
* add zip publisher ([31156ed](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/31156ed))
* prepare publish for code-generator ([93ff5c2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/93ff5c2))
<a name="0.8.9"></a>
## [0.8.9](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-code-generator@0.8.7...@ali/lowcode-code-generator@0.8.9) (2020-07-12)

View File

@ -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,9 +160,7 @@ function exportProject() {
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;
});
}

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-code-generator",
"version": "0.8.9",
"version": "0.8.10",
"description": "出码引擎 for LowCode Engine",
"main": "lib/index.js",
"files": [

View File

@ -3,6 +3,89 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.47"></a>
## [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)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.46"></a>
## [0.8.46](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.44...@ali/lowcode-demo@0.8.46) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.45"></a>
## [0.8.45](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.44...@ali/lowcode-demo@0.8.45) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.44"></a>
## [0.8.44](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.43...@ali/lowcode-demo@0.8.44) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.43"></a>
## [0.8.43](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.42...@ali/lowcode-demo@0.8.43) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.42"></a>
## [0.8.42](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.41...@ali/lowcode-demo@0.8.42) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.41"></a>
## [0.8.41](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.40...@ali/lowcode-demo@0.8.41) (2020-07-22)
### Features
* rax render ([95bf331](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/95bf331))
<a name="0.8.40"></a>
## [0.8.40](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.39...@ali/lowcode-demo@0.8.40) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.39"></a>
## [0.8.39](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.38...@ali/lowcode-demo@0.8.39) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.38"></a>
## [0.8.38](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.37...@ali/lowcode-demo@0.8.38) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-demo
<a name="0.8.37"></a>
## [0.8.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-demo@0.8.36...@ali/lowcode-demo@0.8.37) (2020-07-14)

View File

@ -2,7 +2,8 @@
"entry": {
"index": "src/index",
"editor-preset-vision": "../editor-preset-vision/src/index.ts",
"react-simulator-renderer": "../react-simulator-renderer/src/index.ts"
"react-simulator-renderer": "../react-simulator-renderer/src/index.ts",
"rax-simulator-renderer": "../rax-simulator-renderer/src/index.ts"
},
"vendor": false,
"devServer": {
@ -15,7 +16,8 @@
"prop-types": "var window.PropTypes",
"@alifd/next": "var window.Next",
"@ali/visualengine": "var window.VisualEngine",
"@ali/visualengine-utils": "var window.VisualEngineUtils"
"@ali/visualengine-utils": "var window.VisualEngineUtils",
"rax": "var window.Rax"
},
"plugins": [
[

View File

@ -10,12 +10,15 @@ module.exports = ({ onGetWebpackConfig }) => {
]);
config
// 定义插件名称
.plugin('MonacoWebpackPlugin')
// 第一项为具体插件,第二项为插件参数
.use(new MonacoWebpackPlugin({
languages:["typescript","css","json"]
}), []);
// 定义插件名称
.plugin('MonacoWebpackPlugin')
// 第一项为具体插件,第二项为插件参数
.use(
new MonacoWebpackPlugin({
languages: ['typescript', 'css', 'json'],
}),
[],
);
config.plugins.delete('hot');
config.devServer.hot(false);

View File

@ -12,9 +12,9 @@
"@ali/lowcode-editor-preset-general": "window.LowcodeEditor",
"@ali/lowcode-editor-core": "window.LowcodeEditor",
"@ali/lowcode-editor-skeleton": "window.LowcodeEditor",
"@ali/lowcode-designer": "window.LowcodeEditor"
"@ali/lowcode-designer": "window.LowcodeEditor",
"rax": "var window.Rax"
},
"minify": false,
"sourcemap": true,
"outputAssetsPath": {
"js": "", "css": ""

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-demo",
"version": "0.8.37",
"version": "0.8.47",
"private": true,
"description": "低代码引擎 DEMO",
"scripts": {
@ -9,21 +9,21 @@
},
"config": {},
"dependencies": {
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-editor-skeleton": "^0.8.33",
"@ali/lowcode-plugin-components-pane": "^0.8.29",
"@ali/lowcode-plugin-designer": "^0.9.27",
"@ali/lowcode-plugin-event-bind-dialog": "^0.8.20",
"@ali/lowcode-plugin-outline-pane": "^0.8.33",
"@ali/lowcode-plugin-sample-logo": "^0.8.19",
"@ali/lowcode-plugin-sample-preview": "^0.8.31",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-editor-skeleton": "^0.8.43",
"@ali/lowcode-plugin-components-pane": "^0.8.39",
"@ali/lowcode-plugin-designer": "^0.9.37",
"@ali/lowcode-plugin-event-bind-dialog": "^0.8.27",
"@ali/lowcode-plugin-outline-pane": "^0.8.43",
"@ali/lowcode-plugin-sample-logo": "^0.8.26",
"@ali/lowcode-plugin-sample-preview": "^0.8.41",
"@ali/lowcode-plugin-settings-pane": "^0.8.8",
"@ali/lowcode-plugin-undo-redo": "^0.8.31",
"@ali/lowcode-plugin-variable-bind-dialog": "^0.8.18",
"@ali/lowcode-plugin-zh-en": "^0.8.22",
"@ali/lowcode-react-renderer": "^0.8.13",
"@ali/lowcode-plugin-undo-redo": "^0.8.41",
"@ali/lowcode-plugin-variable-bind-dialog": "^0.8.25",
"@ali/lowcode-plugin-zh-en": "^0.8.29",
"@ali/lowcode-react-renderer": "^0.8.17",
"@ali/lowcode-runtime": "^0.8.16",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-utils": "^0.8.16",
"@ali/ve-action-pane": "^4.7.0-beta.0",
"@ali/ve-datapool-pane": "^6.4.3",
"@ali/ve-history-pane": "4.0.0",

View File

@ -16,6 +16,7 @@
<script src="https://g.alicdn.com/mylib/moment/2.24.0/min/moment.min.js"></script>
<link rel="stylesheet" href="https://unpkg.alibaba-inc.com/@alifd/next@1.20.25/dist/next.min.css" />
<script src="https://unpkg.alibaba-inc.com/@alifd/next@1.20.25/dist/next.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/rax@1.1.3/dist/rax.js"></script>
<link rel="stylesheet" href="/css/editor-preset-vision.css" />
<script>
window.pageConfig = {

View File

@ -0,0 +1,20 @@
{
"componentName": "Page",
"fileName": "home",
"props": {},
"children": [
{
"componentName": "Container",
"props": {},
"children": [
{
"componentName": "Text",
"props": {
"type": "primary"
},
"children": ["Welcome to Your Rax App!"]
}
]
}
]
}

View File

@ -0,0 +1,384 @@
{
"externals": [
{
"urls": ["//g.alicdn.com/platform/c/react/16.5.2/react.min.js"],
"library": "React",
"name": "react",
"version": "16.5.2"
},
{
"urls": ["//g.alicdn.com/platform/c/react-dom/16.5.2/react-dom.min.js"],
"library": "ReactDOM",
"name": "react-dom",
"version": "16.12.0"
},
{
"urls": ["//g.alicdn.com/platform/c/prop-types/15.6.2/prop-types.js"],
"library": "PropTypes",
"name": "prop-types",
"version": "15.6.2"
},
{ "library": "ReactRouter", "name": "react-router" },
{ "library": "ReactRouterDOM", "name": "react-router-dom" },
{ "library": "Babel", "name": "babel-standalone" },
{ "library": "Recore", "name": "@ali/recore" },
{
"urls": ["https://g.alicdn.com/code/lib/moment.js/2.24.0/moment-with-locales.min.js"],
"library": "moment",
"name": "moment",
"version": "2.24.0"
},
{ "library": "VisualEngine", "name": "engine" },
{ "library": "VisualEngine", "name": "visualengine" },
{ "library": "VisualEngine", "name": "@ali/visualengine" },
{ "library": "VisualEngineUtils", "name": "engine-utils" },
{ "library": "VisualEngineUtils", "name": "@ali/visualengine-utils" },
{ "library": "VisualEngine.ui.Popup", "name": "@ali/ve-popups" },
{ "library": "VisualEngineUtils.FieldControl", "name": "@ali/ve-field" },
{ "library": "VisualEngineUtils.BoolControl", "name": "@ali/ve-bool-control" },
{ "library": "VisualEngineUtils.ChoiceControl", "name": "@ali/ve-choice-control" },
{ "library": "VisualEngineUtils.ColorControl", "name": "@ali/ve-color-control" },
{ "library": "VisualEngineUtils.DateControl", "name": "@ali/ve-date-control" },
{ "library": "VisualEngineUtils.I18nControl", "name": "@ali/ve-i18n-control" },
{ "library": "VisualEngineUtils.NumberControl", "name": "@ali/ve-number-control" },
{ "library": "VisualEngineUtils.SelectControl", "name": "@ali/ve-select-control" },
{ "library": "VisualEngineUtils.SortableControl", "name": "@ali/ve-sortable" },
{ "library": "VisualEngineUtils.TextControl", "name": "@ali/ve-text-control" },
{ "library": "VisualEngineUtils.ImageControl", "name": "@ali/ve-image-control" },
{ "library": "VisualEngineUtils.SearchControl", "name": "@ali/ve-search-control" },
{ "library": "VisualEngineUtils.BoolSetter", "name": "@ali/vs-bool" },
{ "library": "VisualEngineUtils.ChoiceSetter", "name": "@ali/vs-choice" },
{ "library": "VisualEngineUtils.CodeSetter", "name": "@ali/vs-code" },
{ "library": "VisualEngineUtils.ColorSetter", "name": "@ali/vs-color" },
{ "library": "VisualEngineUtils.DateSetter", "name": "@ali/vs-date" },
{ "library": "VisualEngineUtils.I18nSetter", "name": "@ali/vs-i18n" },
{ "library": "VisualEngineUtils.JsonSetter", "name": "@ali/vs-json" },
{ "library": "VisualEngineUtils.ListSetter", "name": "@ali/vs-list" },
{ "library": "VisualEngineUtils.NumberSetter", "name": "@ali/vs-number" },
{ "library": "VisualEngineUtils.OptionsSetter", "name": "@ali/vs-options" },
{ "library": "VisualEngineUtils.SelectSetter", "name": "@ali/vs-select" },
{ "library": "VisualEngineUtils.TextSetter", "name": "@ali/vs-text"},
{ "library": "VisualEngineUtils.ValidationSetter", "name": "@ali/vs-validation" },
{ "library": "VisualEngineUtils.ImageSetter", "name": "@ali/vs-image" },
{ "library": "VisualEngineUtils.StyleSetter", "name": "@ali/vs-style" },
{ "library": "VisualEngineUtils.EventSetter", "name": "@ali/vs-event" },
{ "library": "RenderEngine", "name": "@ali/render-engine" },
{ "library": "Highcharts", "name": "highcharts" },
{ "library": "Object", "name": "highcharts-more" },
{ "library": "Highcharts && window.Highcharts.map", "name": "highcharts/highmaps" },
{ "library": "jQuery", "name": "$" },
{ "library": "jQuery", "name": "jquery" },
{ "library": "_", "name": "lodash" },
{ "library": "nattyFetch", "name": "natty-fetch" },
{ "library": "nattyFetch", "name": "natty-fetch/dist/natty-fetch.pc" },
{ "library": "nattyFetch", "name": "natty-fetch/dist/natty-fetch" },
{ "library": "nattyStorage", "name": "natty-storage" },
{ "library": "Rax", "name": "rax" },
{
"urls": ["https://g.alicdn.com/ib-fe/ib-vendor/mx/gl.js"],
"library": "mapboxgl",
"name": "@ali/ib-mapbox",
"version": "1.0.0"
}
],
"appKey": "template_deep_mobile",
"systemType": "",
"componentDependencies": [
{
"packageName": "@alife/service-hall-base-space",
"library": "alifeServiceHallBaseSpace",
"version": "0.1.0",
"components": null,
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://dev.g.alicdn.com/service-hall-components/base-space/0.1.0/designer.js"
]
},
"alias": "",
"prototypeConfigsUrl": [
"https://dev.g.alicdn.com/service-hall-components/base-space/0.1.0/designer.js"
],
"urls": ["https://dev.g.alicdn.com/service-hall-components/base-space/0.1.0/view.js"]
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.c94ee38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.bf61331.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.c94ee38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.bf61331.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/view.5030228.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/view.6186d2f.js"
],
"library": "AliVcRaxPage",
"components": null,
"packageName": "@ali/vc-rax-page",
"version": "4.0.4"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.798dd4e.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.78c100c.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.798dd4e.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.78c100c.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/view.23d106a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/view.314cec4.js"
],
"library": "AliVcDeepMobileOpenButton",
"components": null,
"packageName": "@ali/vc-deep-mobile-open-button",
"version": "1.0.5"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.bb4ec38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.ed31eab.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.bb4ec38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.ed31eab.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.f2b6dde.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.46f546f.js",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.mobile.f2b6dde.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.mobile.6b901e9.js"
],
"library": "AliVcDeepMobile",
"components": null,
"packageName": "@ali/vc-deep-mobile",
"version": "2.0.1-beta.5"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/proto.55a6360.js"]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/proto.55a6360.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/view.0e43387.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/view.4ea485d.js"
],
"library": "AliVcComponent",
"components": null,
"packageName": "@ali/vc-component",
"version": "1.1.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.1cca36a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.a3ca779.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.1cca36a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.a3ca779.js"
],
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/view.54ba1c5.js"],
"library": "AliVcBlockWrapper",
"components": null,
"packageName": "@ali/vc-block-wrapper",
"version": "1.0.6"
}
],
"utilsDependencies": [
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-toolkit/1.0.8/main.e3b517b.js"],
"library": "AliVuToolkit",
"components": null,
"packageName": "@ali/vu-toolkit",
"version": "1.0.8"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-fusion-miniapp/2.0.0/main.a9303b0.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-fusion-miniapp/2.0.0/main.0a9dcbf.js"
],
"library": "AliVuFusionMiniapp",
"components": null,
"packageName": "@ali/vu-fusion-miniapp",
"version": "2.0.0"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-legao-builtin/1.4.0-beta.5/main.ce04344.js"],
"library": "AliVuLegaoBuiltin",
"components": null,
"packageName": "@ali/vu-legao-builtin",
"version": "1.4.0-beta.5"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-dataSource/1.0.4/main.f11b596.js"],
"library": "AliVuDataSource",
"components": null,
"packageName": "@ali/vu-dataSource",
"version": "1.0.4"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-formatter/2.0.0/main.60e759a.js"],
"library": "AliVuFormatter",
"components": null,
"packageName": "@ali/vu-formatter",
"version": "2.0.0"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-miniapp/0.1.1/main.3d126aa.js"],
"library": "AliVuRouterMiniapp",
"components": null,
"packageName": "@ali/vu-router-miniapp",
"version": "0.1.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "universal",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/deep-mobile-universal-api/1.1.2/main.0cfe8ef.js"],
"library": "AliDeepMobileUniversalApi",
"components": null,
"packageName": "@ali/deep-mobile-universal-api",
"version": "1.1.2"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router/1.2.1/main.5a856a4.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router/1.2.1/main.e896278.js"
],
"library": "AliVuRouter",
"components": null,
"packageName": "@ali/vu-router",
"version": "1.2.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-spa/1.3.13/main.bc8c738.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-spa/1.3.13/main.1cff595.js"
],
"library": "AliVuRouterSpa",
"components": null,
"packageName": "@ali/vu-router-spa",
"version": "1.3.13"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-spm/1.1.11/main.2f6a6e1.js"],
"library": "AliVuSpm",
"components": null,
"packageName": "@ali/vu-spm",
"version": "1.1.11"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-switch-schema/1.0.7/main.1d9ec8c.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-switch-schema/1.0.7/main.0e44788.js"
],
"library": "AliVuSwitchSchema",
"components": null,
"packageName": "@ali/vu-switch-schema",
"version": "1.0.7"
}
],
"otherDependencies": [
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vp-rax-vision-page/2.0.3/main.a344c97.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vp-rax-vision-page/2.0.3/main.1b46312.js"
],
"library": "AliVpRaxVisionPage",
"components": null,
"packageName": "@ali/vp-rax-vision-page",
"version": "2.0.3"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vm-router/1.0.8/main.fd43d18.js"],
"library": "AliVmRouter",
"components": null,
"packageName": "@ali/vm-router",
"version": "1.0.8"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vm-schema-nav/1.0.0/main.427ff0d.js"],
"library": "AliVmSchemaNav",
"components": null,
"packageName": "@ali/vm-schema-nav",
"version": "1.0.0"
}
],
"lowCodeDependencies": []
}

View File

@ -0,0 +1,52 @@
{
{
"packageName": "@alife/knowledge-detail",
"version": "0.1.0",
"library": "ServiceHallKnowledgeDetail",
"ext": {
"project": "knowledge-detail",
"group": "service-hall-components"
},
"urls": ["https://dev.g.alicdn.com/service-hall-components/knowledge-detail/0.1.0/designer.js"]
},
{
"packageName": "@alife/benefits-list",
"version": "0.1.1",
"library": "ServiceHallBenefitsList",
"ext": {
"project": "benefits-list",
"group": "service-hall-components"
},
"urls": ["https://dev.g.alicdn.com/service-hall-components/benefits-list/0.1.1/designer.js"]
},
{
"packageName": "@alife/todo-list",
"version": "0.1.1",
"library": "ServiceHallTodoList",
"ext": {
"project": "todo-list",
"group": "service-hall-components"
},
"urls": ["https://dev.g.alicdn.com/service-hall-components/todo-list/0.1.1/designer.js"]
},
{
"packageName": "@alife/todo-list-detail",
"version": "0.1.1",
"library": "ServiceHallTodoListDetail",
"ext": {
"project": "todo-list-detail",
"group": "service-hall-components"
},
"urls": ["https://dev.g.alicdn.com/service-hall-components/todo-list-detail/0.1.1/designer.js"]
},
{
"packageName": "@alife/service-hall-tabs",
"library": "ServiceHallTabs",
"version": "0.1.0",
"ext": {
"project": "tabs",
"group": "service-hall-components"
},
"urls": ["https://dev.g.alicdn.com/service-hall-components/tabs/0.1.0/designer.js"]
}
}

View File

@ -1,7 +1,7 @@
/* eslint-disable */
import { createElement } from 'react';
import { Button } from '@alifd/next';
import Engine, { Panes, Prototype } from '@ali/visualengine';
import Engine, { Panes, Prototype, Editor } from '@ali/visualengine';
import { ActionUtil as actionUtil } from '@ali/visualengine-utils';
import getTrunkPane from '@ali/ve-trunk-pane';
import DatapoolPane from '@ali/ve-datapool-pane';
@ -102,6 +102,7 @@ context.use(HOOKS.VE_SETTING_FIELD_VARIABLE_SETTER, VariableSetter);
const externals = ['react', 'react-dom', 'prop-types', 'react-router', 'react-router-dom', '@ali/recore'];
async function loadAssets() {
// const legaoAssets = await editor.utils.get('./raxAssets.json');
const legaoAssets = await editor.utils.get('./legao-assets.json');
const assets = upgradeAssetsBundle(legaoAssets);
@ -144,8 +145,12 @@ async function loadAssets() {
}
async function loadSchema() {
// const schema = await editor.utils.get('./rax.json');
const schema = await editor.utils.get('./schema.json');
editor.set('schema', schema);
// editor.set('renderEnv', 'rax');
// editor.set('clientTypes', ['mobile']);
}
// demo
@ -513,5 +518,7 @@ async function init() {
initDemoPanes();
// initHistoryPane();
Engine.init();
// Engine.Env.set('renderEnv', 'rax');
}
init();

View File

@ -3,6 +3,135 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.9.37"></a>
## [0.9.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.36...@ali/lowcode-designer@0.9.37) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-designer
<a name="0.9.36"></a>
## [0.9.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.34...@ali/lowcode-designer@0.9.36) (2020-08-04)
### Bug Fixes
* 修复js面板引用计数问题 ([fcc1a6f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fcc1a6f))
* 灵犀vc组件中调用config, 补充进去 ([7171aa2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7171aa2))
<a name="0.9.35"></a>
## [0.9.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.34...@ali/lowcode-designer@0.9.35) (2020-08-04)
### Bug Fixes
* 修复js面板引用计数问题 ([fcc1a6f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fcc1a6f))
* 灵犀vc组件中调用config, 补充进去 ([7171aa2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7171aa2))
<a name="0.9.34"></a>
## [0.9.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.33...@ali/lowcode-designer@0.9.34) (2020-07-29)
### Bug Fixes
* getSuitablePlace ([03e7c57](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/03e7c57))
* slot 兼容问题 + loop key bug fix ([bc64017](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/bc64017))
<a name="0.9.33"></a>
## [0.9.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.32...@ali/lowcode-designer@0.9.33) (2020-07-28)
### Bug Fixes
* props.getNode 防死循环 ([444e25c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/444e25c))
* vc-filter bug fix ([31ea5d5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/31ea5d5))
* VC-Filter组件的适配问题 ([1f581b8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1f581b8))
* 增加 getNode 兼容接口 ([5b6792f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/5b6792f))
* 补充documnet-model中addonData 相关方法 ([cbc70ea](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/cbc70ea))
* 调整visionNode修改未知 ([da59235](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/da59235))
<a name="0.9.32"></a>
## [0.9.32](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.31...@ali/lowcode-designer@0.9.32) (2020-07-23)
### Bug Fixes
* prop type=UNSET 时返回 undefined ([f437f30](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f437f30))
<a name="0.9.31"></a>
## [0.9.31](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.30...@ali/lowcode-designer@0.9.31) (2020-07-22)
### Features
* rax simulator ([05b262d](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/05b262d))
<a name="0.9.30"></a>
## [0.9.30](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.29...@ali/lowcode-designer@0.9.30) (2020-07-21)
### Bug Fixes
* settingField items is empty when type is not 'group' ([582c41a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/582c41a))
* updateProps before init ([760e6a6](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/760e6a6))
* 低代码组件修改之后渲染为空 ([ef71632](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/ef71632))
* 修复导入的组件拖入画布报错 ([caf9915](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/caf9915))
* 调整 upgrade 和 init 的流程 ([09fc1a0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/09fc1a0))
### Features
* support subtreeModified ([7eeb51c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7eeb51c))
<a name="0.9.29"></a>
## [0.9.29](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.28...@ali/lowcode-designer@0.9.29) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-designer
<a name="0.9.28"></a>
## [0.9.28](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.27...@ali/lowcode-designer@0.9.28) (2020-07-21)
### Bug Fixes
* modal node locate ([9a72dd7](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/9a72dd7))
* 修复取不到值的情况 ([5e7e488](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/5e7e488))
* 可以降级到历史的 JSBlock 格式 ([af1746b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af1746b))
* 画布BorderAction埋点数据 ([d813b50](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d813b50))
### Features
* 大纲树支持模态视图 ([3785e1c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3785e1c))
<a name="0.9.27"></a>
## [0.9.27](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-designer@0.9.26...@ali/lowcode-designer@0.9.27) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-designer",
"version": "0.9.27",
"version": "0.9.37",
"description": "Designer for Ali LowCode Engine",
"main": "lib/index.js",
"module": "es/index.js",
@ -15,9 +15,9 @@
},
"license": "MIT",
"dependencies": {
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-types": "^0.8.14",
"@ali/lowcode-utils": "^0.8.16",
"classnames": "^2.2.6",
"event": "^1.0.0",
"react": "^16",

View File

@ -126,13 +126,13 @@ function createAction(content: ReactNode | ComponentType<any> | ActionContentObj
action && action(node);
const editor = globalContext.get(Editor);
const npm = node?.componentMeta?.npm;
const target =
const selected =
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') ||
node?.componentMeta?.componentName ||
'';
editor?.emit('designer.border.action', {
name: key,
target,
selected,
});
}}
>

View File

@ -1,6 +1,14 @@
// NOTE: 仅用作类型标注,切勿作为实体使用
import { BuiltinSimulatorHost } from './host';
import { AssetLevel, AssetLevels, AssetList, isAssetBundle, isAssetItem, AssetType, assetItem } from '@ali/lowcode-utils';
import {
AssetLevel,
AssetLevels,
AssetList,
isAssetBundle,
isAssetItem,
AssetType,
assetItem,
} from '@ali/lowcode-utils';
import { isCSSUrl } from '@ali/lowcode-utils';
import { BuiltinSimulatorRenderer } from './renderer';
@ -16,7 +24,7 @@ export function createSimulator(
const styles: any = {};
const scripts: any = {};
AssetLevels.forEach(lv => {
AssetLevels.forEach((lv) => {
styles[lv] = [];
scripts[lv] = [];
});
@ -56,12 +64,12 @@ export function createSimulator(
parseAssetList(vendors);
const styleFrags = Object.keys(styles)
.map(key => {
.map((key) => {
return styles[key].join('\n') + `<meta level="${key}" />`;
})
.join('');
const scriptFrags = Object.keys(scripts)
.map(key => {
.map((key) => {
return scripts[key].join('\n');
})
.join('');
@ -72,7 +80,7 @@ export function createSimulator(
</head><body>${scriptFrags}</body></html>`);
doc.close();
return new Promise(resolve => {
return new Promise((resolve) => {
if (win.SimulatorRenderer || host.renderer) {
return resolve(win.SimulatorRenderer || host.renderer);
}

View File

@ -4,7 +4,16 @@ import Viewport from './viewport';
import { createSimulator } from './create-simulator';
import { Node, ParentalNode, DocumentModel, isNode, contains, isRootNode } from '../document';
import ResourceConsumer from './resource-consumer';
import { AssetLevel, Asset, AssetList, assetBundle, assetItem, AssetType, isElement, isFormEvent } from '@ali/lowcode-utils';
import {
AssetLevel,
Asset,
AssetList,
assetBundle,
assetItem,
AssetType,
isElement,
isFormEvent,
} from '@ali/lowcode-utils';
import {
DragObjectType,
isShaken,
@ -62,6 +71,20 @@ const defaultSimulatorUrl = (() => {
return urls;
})();
const defaultRaxSimulatorUrl = (() => {
const publicPath = getPublicPath();
let urls;
const [_, prefix = '', dev] = /^(.+?)(\/js)?\/?$/.exec(publicPath) || [];
if (dev) {
urls = [`${prefix}/css/rax-simulator-renderer.css`, `${prefix}/js/rax-simulator-renderer.js`];
} else if (process.env.NODE_ENV === 'production') {
urls = [`${prefix}/rax-simulator-renderer.css`, `${prefix}/rax-simulator-renderer.js`];
} else {
urls = [`${prefix}/rax-simulator-renderer.css`, `${prefix}/rax-simulator-renderer.js`];
}
return urls;
})();
const defaultEnvironment = [
// https://g.alicdn.com/mylib/??react/16.11.0/umd/react.production.min.js,react-dom/16.8.6/umd/react-dom.production.min.js,prop-types/15.7.2/prop-types.min.js
assetItem(AssetType.JSText, 'window.React=parent.React;window.ReactDOM=parent.ReactDOM;', undefined, 'react'),
@ -71,6 +94,17 @@ const defaultEnvironment = [
),
];
const defaultRaxEnvironment = [
assetItem(
AssetType.JSText,
'window.Rax=parent.Rax;window.React=parent.React;window.ReactDOM=parent.ReactDOM;window.VisualEngineUtils=parent.VisualEngineUtils;window.VisualEngine=parent.VisualEngine',
),
assetItem(
AssetType.JSText,
'window.PropTypes=parent.PropTypes;React.PropTypes=parent.PropTypes; window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;',
),
];
export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProps> {
readonly isSimulator = true;
@ -78,6 +112,10 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
readonly designer = this.document.designer;
@computed get renderEnv(): string {
return this.get('renderEnv') || 'default';
}
@computed get device(): string {
return this.get('device') || 'default';
}
@ -186,7 +224,10 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
const vendors = [
// required & use once
assetBundle(this.get('environment') || defaultEnvironment, AssetLevel.Environment),
assetBundle(
this.get('environment') || this.renderEnv === 'rax' ? defaultRaxEnvironment : defaultEnvironment,
AssetLevel.Environment,
),
// required & use once
assetBundle(this.get('extraEnvironment'), AssetLevel.Environment),
// required & use once
@ -194,7 +235,10 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
// required & TODO: think of update
assetBundle(this.theme, AssetLevel.Theme),
// required & use once
assetBundle(this.get('simulatorUrl') || defaultSimulatorUrl, AssetLevel.Runtime),
assetBundle(
this.get('simulatorUrl') || this.renderEnv === 'rax' ? defaultRaxSimulatorUrl : defaultSimulatorUrl,
AssetLevel.Runtime,
),
];
// wait 准备 iframe 内容、依赖库注入
@ -326,7 +370,12 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
x.initEvent('click', true);
this._iframe?.dispatchEvent(x);
const target = e.target as HTMLElement;
if (isFormEvent(e) || target?.closest('.next-input-group,.next-checkbox-group,.next-date-picker,.next-input,.next-month-picker,.next-number-picker,.next-radio-group,.next-range,.next-range-picker,.next-rating,.next-select,.next-switch,.next-time-picker,.next-upload,.next-year-picker,.next-breadcrumb-item,.next-calendar-header,.next-calendar-table')) {
if (
isFormEvent(e) ||
target?.closest(
'.next-input-group,.next-checkbox-group,.next-date-picker,.next-input,.next-month-picker,.next-number-picker,.next-radio-group,.next-range,.next-range-picker,.next-rating,.next-select,.next-switch,.next-time-picker,.next-upload,.next-year-picker,.next-breadcrumb-item,.next-calendar-header,.next-calendar-table',
)
) {
e.preventDefault();
e.stopPropagation();
}
@ -392,7 +441,11 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
}
const node = nodeInst.node || this.document.rootNode;
const rootElement = this.findDOMNodes(nodeInst.instance, node.componentMeta.rootSelector)?.find(item => item.contains(targetElement)) as HTMLElement;
const rootElement = this.findDOMNodes(nodeInst.instance, node.componentMeta.rootSelector)?.find(
(item) =>
// 可能是 [null];
item && item.contains(targetElement),
) as HTMLElement;
if (!rootElement) {
return;
}
@ -405,7 +458,6 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
},
true,
);
}
/**
@ -792,10 +844,12 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
this.sensing = true;
this.scroller.scrolling(e);
const dropContainer = this.getDropContainer(e);
if (!dropContainer ||
// too dirty
(typeof dropContainer.container?.componentMeta?.prototype?.options?.canDropIn === 'function' &&
!dropContainer.container?.componentMeta?.prototype?.options?.canDropIn(e.dragObject.nodes[0]))) {
if (
!dropContainer ||
// too dirty
(typeof dropContainer.container?.componentMeta?.prototype?.options?.canDropIn === 'function' &&
!dropContainer.container?.componentMeta?.prototype?.options?.canDropIn(e.dragObject.nodes[0]))
) {
return null;
}
@ -826,10 +880,20 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
event: e,
};
if (e.dragObject && e.dragObject.nodes && e.dragObject.nodes.length && e.dragObject.nodes[0].getPrototype()?.isModal()) {
// if (e.dragObject.type === 'node' && e.dragObject.nodes[0]?.getPrototype()?.isModal()) {
if (
e.dragObject &&
e.dragObject.nodes &&
e.dragObject.nodes.length &&
e.dragObject.nodes[0].getPrototype()?.isModal()
) {
return this.designer.createLocation({
target: this.document.rootNode,
detail,
detail: {
type: LocationDetailType.Children,
index: 0,
valid: true,
},
source: 'simulator' + this.document.id,
event: e,
});

View File

@ -150,18 +150,19 @@ export class ComponentMeta {
this._title =
typeof title === 'string'
? {
type: 'i18n',
'en-US': this.componentName,
'zh-CN': title,
}
type: 'i18n',
'en-US': this.componentName,
'zh-CN': title,
}
: title;
}
const liveTextEditing = this._transformedMetadata.experimental?.liveTextEditing || [];
function collectLiveTextEditing(items: FieldConfig[]) {
items.forEach(config => {
if (config.items) {
debugger;
items.forEach((config) => {
if (config?.items) {
collectLiveTextEditing(config.items);
} else {
const liveConfig = config.liveTextEditing || config.extraProps?.liveTextEditing;
@ -277,7 +278,6 @@ function preprocessMetadata(metadata: ComponentMetadata): TransformedComponentMe
};
}
export interface MetadataTransducer {
(prev: TransformedComponentMetadata): TransformedComponentMetadata;
/**
@ -293,7 +293,7 @@ export interface MetadataTransducer {
}
const metadataTransducers: MetadataTransducer[] = [];
export function registerMetadataTransducer(transducer: MetadataTransducer, level: number = 100, id?: string) {
export function registerMetadataTransducer(transducer: MetadataTransducer, level = 100, id?: string) {
transducer.level = level;
transducer.id = id;
const i = metadataTransducers.findIndex((item) => item.level != null && item.level > level);
@ -308,7 +308,6 @@ export function getRegisteredMetadataTransducers(): MetadataTransducer[] {
return metadataTransducers;
}
registerMetadataTransducer((metadata) => {
const { configure, componentName } = metadata;
const { component = {} } = configure;

View File

@ -386,6 +386,8 @@ export class Designer {
let meta = this._componentMetasMap.get(key);
if (meta) {
meta.setMetadata(data);
this._componentMetasMap.set(key, meta);
} else {
meta = this._lostComponentMetasMap.get(key);
@ -426,10 +428,11 @@ export class Designer {
@computed get componentsMap(): { [key: string]: NpmInfo | Component } {
const maps: any = {};
this._componentMetasMap.forEach((config, key) => {
const designer = this;
designer._componentMetasMap.forEach((config, key) => {
const metaData = config.getMetadata();
if (metaData.devMode === 'lowcode') {
maps[key] = this.currentDocument?.simulator?.createComponent(metaData.schema!);
maps[key] = metaData.schema;
} else {
const view = metaData.experimental?.view;
if (view) {

View File

@ -5,10 +5,23 @@ import { SettingEntry } from './setting-entry';
import { computed, obx } from '@ali/lowcode-editor-core';
import { cloneDeep } from '@ali/lowcode-utils';
function getSettingFieldCollectorKey(parent: SettingEntry, config: FieldConfig) {
let top = parent;
const path = [config.name];
while (top !== parent.top) {
if (top instanceof SettingField && top.type !== 'group') {
path.unshift(top.name);
}
top = top.parent;
}
return path.join('.');
}
export class SettingField extends SettingPropEntry implements SettingEntry {
readonly isSettingField = true;
readonly isRequired: boolean;
readonly transducer: Transducer;
private _config: FieldConfig;
extraProps: FieldExtraProps;
// ==== dynamic properties ====
@ -41,6 +54,7 @@ export class SettingField extends SettingPropEntry implements SettingEntry {
super(parent, config.name, config.type);
const { title, items, setter, extraProps, ...rest } = config;
this._config = config;
this._title = title;
this._setter = setter;
this.extraProps = {
@ -51,10 +65,11 @@ export class SettingField extends SettingPropEntry implements SettingEntry {
this._expanded = extraProps?.defaultCollapsed ? false : true;
// initial items
if (this.type === 'group' && items) {
if (items && items.length > 0) {
this.initItems(items, settingFieldCollector);
} else if (settingFieldCollector && config.name) {
settingFieldCollector(config.name, this);
}
if (this.type !== 'group' && settingFieldCollector && config.name) {
settingFieldCollector(getSettingFieldCollectorKey(parent, config), this);
}
// compatiable old config
@ -67,6 +82,10 @@ export class SettingField extends SettingPropEntry implements SettingEntry {
return this._items;
}
get config(): FieldConfig {
return this._config;
}
private initItems(items: Array<FieldConfig | CustomView>, settingFieldCollector?: { (name: string | number, field: SettingField): void; (name: string, field: SettingField): void; }) {
this._items = items.map((item) => {
if (isCustomView(item)) {

View File

@ -224,6 +224,13 @@ export class SettingTopEntry implements SettingEntry {
getPage() {
return this.first.document;
}
/**
* @deprecated
*/
getNode() {
return this.nodes[0];
}
}
interface Purgeable {

View File

@ -9,10 +9,13 @@ function getHotterFromSetter(setter) {
}
function getTransducerFromSetter(setter) {
return setter && (
setter.transducer || setter.Transducer
|| (setter.type && (setter.type.transducer || setter.type.Transducer))
) || null; // eslint-disable-line
return (
(setter &&
(setter.transducer ||
setter.Transducer ||
(setter.type && (setter.type.transducer || setter.type.Transducer)))) ||
null
); // eslint-disable-line
}
function combineTransducer(transducer, arr, context) {
@ -37,9 +40,10 @@ export class Transducer {
if (Array.isArray(setter)) {
setter = setter[0];
} else if (isValidElement(setter) && setter.type.displayName === 'MixedSetter') {
setter = setter.props.setters[0];
setter = setter.props?.setters?.[0];
} else if (typeof setter === 'object' && setter.componentName === 'MixedSetter') {
setter = setter && setter.props && setter.props.setters && Array.isArray(setter.props.setters) && setter.props.setters[0];
setter = setter;
setter.props && setter.props.setters && Array.isArray(setter.props.setters) && setter.props.setters[0];
}
if (isSetterConfig(setter)) {
@ -49,11 +53,7 @@ export class Transducer {
setter = getSetter(setter)?.component;
}
this.setterTransducer = combineTransducer(
getTransducerFromSetter(setter),
getHotterFromSetter(setter),
context,
);
this.setterTransducer = combineTransducer(getTransducerFromSetter(setter), getHotterFromSetter(setter), context);
this.context = context;
}

View File

@ -10,7 +10,7 @@ import { Selection } from './selection';
import { History } from './history';
import { TransformStage } from './node';
import { uniqueId } from '@ali/lowcode-utils';
import ModalNodesManager from './node/modalNodesManager';
import { ModalNodesManager } from './node';
export type GetDataType<T, NodeType> = T extends undefined
? NodeType extends {
@ -37,6 +37,10 @@ export class DocumentModel {
*
*/
readonly history: History;
/**
*
*/
readonly modalNodesManager: ModalNodesManager;
private nodesMap = new Map<string, Node>();
@obx.val private nodes = new Set<Node>();
@ -44,7 +48,11 @@ export class DocumentModel {
private _simulator?: ISimulatorHost;
private emitter: EventEmitter;
private rootNodeVisitorMap: { [visitorName: string]: any } = {};
private modalNodesManager: ModalNodesManager;
/**
* @deprecated
*/
private _addons: { [key: string]: { exportData: () => any; isProp: boolean;} } = {};
/**
*
@ -170,7 +178,7 @@ export class DocumentModel {
node = this.getNode(schema.id);
if (node && node.componentName === schema.componentName) {
if (node.parent) {
node.internalSetParent(null);
node.internalSetParent(null, false);
// will move to another position
// todo: this.activeNodes?.push(node);
}
@ -509,6 +517,32 @@ export class DocumentModel {
this.emitter.emit('lowcode_engine_renderer_ready', renderer);
}
/**
* @deprecated
*/
getAddonData(name: string) {
const addon = this._addons[name];
return addon?.exportData();
}
/**
* @deprecated
*/
registerAddon(name: string, exportData: any) {
if (['id', 'params', 'layout'].indexOf(name) > -1) {
throw new Error('addon name cannot be id, params, layout');
}
const i = this._addons?.findIndex((item) => item.name === name);
if (i > -1) {
this._addons?.splice(i, 1);
}
this._addons?.push({
exportData,
name,
});
}
acceptRootNodeVisitor(
visitorName: string = 'default',
visitorFn: (node: RootNode) => any ) {
@ -543,6 +577,13 @@ export class DocumentModel {
this.emitter.removeListener('nodedestroy', func);
};
}
/**
* @deprecated
*/
refresh() {
console.warn('refresh method is deprecated');
}
}
export function isDocumentModel(obj: any): obj is DocumentModel {

View File

@ -5,3 +5,4 @@ export * from './props/prop';
export * from './props/prop-stash';
export * from './props/props';
export * from './transform-stage';
export * from './modal-nodes-manager';

View File

@ -17,11 +17,11 @@ function getModalNodes(node: Node) {
return nodes;
}
export default class ModalNodesManager {
export class ModalNodesManager {
public willDestroy: any;
private page: DocumentModel;
private modalNodes: [Node];
private modalNodes: Node[];
private nodeRemoveEvents: any;
private emitter: EventEmitter;
@ -44,7 +44,7 @@ export default class ModalNodesManager {
public getVisibleModalNode() {
const visibleNode = this.modalNodes
? this.modalNodes.find((node: Node) => {
return !node.getExtraProp('hidden');
return node.getVisible();
})
: null;
return visibleNode;
@ -53,18 +53,18 @@ export default class ModalNodesManager {
public hideModalNodes() {
if (this.modalNodes) {
this.modalNodes.forEach((node: Node) => {
node.getExtraProp('hidden')?.setValue(true);
node.setVisible(false);
});
}
}
public setVisible(node: Node) {
this.hideModalNodes();
node.getExtraProp('hidden')?.setValue(false);
node.setVisible(true);
}
public setInvisible(node: Node) {
node.getExtraProp('hidden')?.setValue(true);
node.setVisible(false);
}
public onVisibleChange(func: () => any) {
@ -101,26 +101,24 @@ export default class ModalNodesManager {
}
this.removeNodeEvent(node);
this.emitter.emit('modalNodesChange');
if (!node.getExtraProp('hidden')) {
if (node.getVisible()) {
this.emitter.emit('visibleChange');
}
}
}
private addNodeEvent(node: Node) {
// this.nodeRemoveEvents[node.getId()] =
// node.onStatusChange((status: any, field: any) => {
// if (field === 'visibility') {
// this.emitter.emit('visibleChange');
// }
// });
this.nodeRemoveEvents[node.getId()] =
node.onVisibleChange((flag) => {
this.emitter.emit('visibleChange');
});
}
private removeNodeEvent(node: Node) {
// if (this.nodeRemoveEvents[node.getId()]) {
// this.nodeRemoveEvents[node.getId()]();
// delete this.nodeRemoveEvents[node.getId()];
// }
if (this.nodeRemoveEvents[node.getId()]) {
this.nodeRemoveEvents[node.getId()]();
delete this.nodeRemoveEvents[node.getId()];
}
}
private setNodes() {

View File

@ -61,6 +61,14 @@ export class NodeChildren {
}
}
/**
* @deprecated
* @param nodes
*/
concat(nodes: Node[]) {
return this.children.concat(nodes);
}
/**
*
*/
@ -79,10 +87,14 @@ export class NodeChildren {
return this.size > 0;
}
@computed length() {
return this.children.length;
}
/**
*
*/
delete(node: Node, purge = false): boolean {
delete(node: Node, purge = false, useMutator = true): boolean {
const i = this.children.indexOf(node);
if (i < 0) {
return false;
@ -90,17 +102,20 @@ export class NodeChildren {
const deleted = this.children.splice(i, 1)[0];
if (purge) {
// should set parent null
deleted.internalSetParent(null);
deleted.purge();
deleted.internalSetParent(null, useMutator);
deleted.purge(useMutator);
}
this.emitter.emit('change');
if (useMutator) {
this.reportModified(node, this.owner, {type: 'remove', removeIndex: i, removeNode: node});
}
return false;
}
/**
*
*/
insert(node: Node, at?: number | null): void {
insert(node: Node, at?: number | null, useMutator = true): void {
const children = this.children;
let index = at == null || at === -1 ? children.length : at;
@ -112,7 +127,7 @@ export class NodeChildren {
} else {
children.push(node);
}
node.internalSetParent(this.owner);
node.internalSetParent(this.owner, useMutator);
} else {
if (index > i) {
index -= 1;
@ -127,6 +142,7 @@ export class NodeChildren {
}
this.emitter.emit('change');
// this.reportModified(node, this.owner, { type: 'insert' });
// check condition group
if (node.conditionGroup) {
@ -228,7 +244,7 @@ export class NodeChildren {
return this.children.some((child, index) => fn(child, index));
}
filter(fn: (item: Node, index: number) => item is Node) {
filter(fn: (item: Node, index: number) => any) {
return this.children.filter(fn);
}
@ -241,7 +257,7 @@ export class NodeChildren {
const i = this.children.indexOf(node);
if (i > -1) {
this.children.splice(i, 1);
node.remove();
node.remove(false);
}
});
changed = true;
@ -278,16 +294,45 @@ export class NodeChildren {
/**
*
*/
purge() {
purge(useMutator = true) {
if (this.purged) {
return;
}
this.purged = true;
this.children.forEach(child => child.purge());
this.children.forEach((child) => child.purge(useMutator));
}
get [Symbol.toStringTag]() {
// 保证向前兼容性
return "Array";
return 'Array';
}
// /**
// * @deprecated
// * 为了兼容vision体系存量api
// */
// getChildrenArray() {
// return this.children;
// }
private reportModified(node: Node, owner: Node, options = {}) {
if (!node) {
return;
}
if (node.isRoot()) {
return;
}
const callbacks = owner.componentMeta.getMetadata().experimental?.callbacks;
if (callbacks?.onSubtreeModified) {
try {
callbacks?.onSubtreeModified.call(node, owner, options);
} catch (e) {
console.error('error when excute experimental.callbacks.onNodeAdd', e);
}
}
if (owner.parent && !owner.parent.isRoot()) {
this.reportModified(node, owner.parent, options);
}
}
}

View File

@ -22,6 +22,7 @@ import { ExclusiveGroup, isExclusiveGroup } from './exclusive-group';
import { TransformStage } from './transform-stage';
import { ReactElement } from 'react';
import { SettingTopEntry } from 'designer/src/designer';
import { EventEmitter } from 'events';
/**
*
@ -72,6 +73,7 @@ import { SettingTopEntry } from 'designer/src/designer';
* hidden
*/
export class Node<Schema extends NodeSchema = NodeSchema> {
private emitter: EventEmitter;
/**
*
*/
@ -96,7 +98,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
/**
*
*/
readonly props: Props;
props: Props;
protected _children?: NodeChildren;
/**
* @deprecated
@ -162,6 +164,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
}
this.settingEntry = this.document.designer.createSettingEntry([ this ]);
this.emitter = new EventEmitter();
}
private initProps(props: any): any {
@ -236,10 +239,22 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
this.internalSetParent(null);
this.document.addWillPurge(this);
}
private didDropIn(dragment: Node) {
const callbacks = this.componentMeta.getMetadata().experimental?.callbacks;
if (callbacks?.onNodeAdd) {
callbacks?.onNodeAdd.call(this, dragment, this);
}
if (this._parent) {
this._parent.didDropIn(dragment);
}
}
/**
* 使
* @param useMutator
*/
internalSetParent(parent: ParentalNode | null) {
internalSetParent(parent: ParentalNode | null, useMutator = false) {
if (this._parent === parent) {
return;
}
@ -248,7 +263,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
if (this.isSlot()) {
this._parent.removeSlot(this, false);
} else {
this._parent.children.delete(this);
this._parent.children.delete(this, false, useMutator);
}
}
@ -262,6 +277,10 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
this.setConditionGroup(grp);
}
}
if (useMutator) {
parent.didDropIn(this);
}
}
}
@ -280,12 +299,12 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
/**
*
*/
remove() {
remove(useMutator = true) {
if (this.parent) {
if (this.isSlot()) {
this.parent.removeSlot(this, true);
} else {
this.parent.children.delete(this, true);
this.parent.children.delete(this, true, useMutator);
}
}
}
@ -405,8 +424,8 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
delete data.id;
const newNode = this.document.createNode(data);
this.insertBefore(newNode, node);
node.remove();
this.insertBefore(newNode, node, false);
node.remove(false);
if (selected) {
this.document.selection.select(newNode.id);
@ -415,6 +434,22 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
return node;
}
setVisible(flag: boolean): void {
this.getExtraProp('hidden')?.setValue(!flag);
this.emitter.emit('visibleChange', flag);
}
getVisible(): boolean {
return !this.getExtraProp('hidden', false)?.getValue();
}
onVisibleChange(func: (flag: boolean) => any) {
this.emitter.on('visibleChange', func);
return () => {
this.emitter.removeListener('visibleChange', func);
};
}
getProp(path: string, stash = true): Prop | null {
return this.props.query(path, stash as any) || null;
}
@ -454,7 +489,11 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
/**
*
*/
setProps(props?: PropsMap | PropsList | null) {
setProps(props?: PropsMap | PropsList | Props | null) {
if(props instanceof Props) {
this.props = props;
return;
}
this.props.import(props);
}
@ -611,10 +650,18 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
}
addSlot(slotNode: Node) {
slotNode.internalSetParent(this as ParentalNode);
slotNode.internalSetParent(this as ParentalNode, true);
this._slots.push(slotNode);
}
/**
*
* @param node
*/
removeChild(node: Node) {
this.children?.delete(node);
}
private purged = false;
/**
*
@ -625,18 +672,18 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
/**
*
*/
purge() {
purge(useMutator = true) {
if (this.purged) {
return;
}
if (this._parent) {
// should remove thisNode before purge
this.remove();
this.remove(useMutator);
return;
}
this.purged = true;
if (this.isParental()) {
this.children.purge();
this.children.purge(useMutator);
}
this.autoruns?.forEach((dispose) => dispose());
this.props.purge();
@ -655,10 +702,10 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
getComponentName() {
return this.componentName;
}
insertBefore(node: Node, ref?: Node) {
this.children?.insert(node, ref ? ref.index : null);
insertBefore(node: Node, ref?: Node, useMutator = true) {
this.children?.insert(node, ref ? ref.index : null, useMutator);
}
insertAfter(node: any, ref?: Node) {
insertAfter(node: any, ref?: Node, useMutator = true) {
if (!isNode(node)) {
if (node.getComponentName) {
node = this.document.createNode({
@ -668,7 +715,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
node = this.document.createNode(node);
}
}
this.children?.insert(node, ref ? ref.index + 1 : null);
this.children?.insert(node, ref ? ref.index + 1 : null, useMutator);
}
getParent() {
return this.parent;
@ -746,11 +793,39 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
* @deprecated
*/
getSuitablePlace(node: Node, ref: any): any {
// TODO:
if (this.isRoot()) {
if (this.isRoot() && this.children) {
const dropElement = this.children.filter((c: Node) => {
if (!c.isContainer()) {
return false;
}
const canDropIn = c.componentMeta?.prototype?.options?.canDropIn;
if (typeof canDropIn === 'function') {
return canDropIn(node);
} else if (typeof canDropIn === 'boolean'){
return canDropIn;
}
return true;
})[0];
if (dropElement) {
return { container: dropElement, ref };
}
return { container: this, ref };
}
return { container: this.parent, ref: this };
const canDropIn = this.componentMeta?.prototype?.options?.canDropIn;
if (this.isContainer()) {
if (canDropIn === undefined ||
(typeof canDropIn === 'boolean' && canDropIn) ||
(typeof canDropIn === 'function' && canDropIn(node))){
return { container: this, ref };
}
}
if (this.parent) {
return this.parent.getSuitablePlace(node, ref);
}
return null;
}
/**
* @deprecated
@ -766,9 +841,9 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
* @deprecated
*/
registerAddon(key: string, exportData: () => any, isProp: boolean = false) {
if (this._addons[key]) {
throw new Error(`node addon ${key} exist`);
}
// if (this._addons[key]) {
// throw new Error(`node addon ${key} exist`);
// }
this._addons[key] = { exportData, isProp };
}

View File

@ -66,7 +66,8 @@ export class Prop implements IPropParent {
const type = this._type;
if (type === 'unset') {
return UNSET;
// return UNSET; @康为 之后 review 下这块改造
return undefined;
}
if (type === 'literal' || type === 'expression') {
@ -86,6 +87,8 @@ export class Prop implements IPropParent {
type: 'JSSlot',
params: schema.params,
value: schema.children,
title: schema.title,
name: schema.name,
};
}
@ -96,9 +99,11 @@ export class Prop implements IPropParent {
const maps: any = {};
this.items!.forEach((prop, key) => {
const v = prop.export(stage);
if (v !== UNSET) {
maps[prop.key == null ? key : prop.key] = v;
}
// if (v !== UNSET) {
// maps[prop.key == null ? key : prop.key] = v;
// }
// @康为 之后 review 下这块改造
maps[prop.key == null ? key : prop.key] = v;
});
return maps;
}
@ -235,6 +240,7 @@ export class Prop implements IPropParent {
const slotSchema: SlotSchema = {
componentName: 'Slot',
title: data.title,
name: data.name,
params: data.params,
children: data.value,
};

View File

@ -329,4 +329,19 @@ export class Props implements IPropParent {
setPropValue(path: string, value: any) {
this.getProp(path, true)!.setValue(value);
}
/**
* props node
*/
getNode() {
return this.owner;
}
/**
* @deprecated
* props node
*/
toData() {
return this.export()?.props;
}
}

View File

@ -102,7 +102,7 @@ export class Project {
| string,
): any {}
open(doc?: string | DocumentModel | RootSchema): void {
open(doc?: string | DocumentModel | RootSchema): DocumentModel {
if (!doc) {
const got = this.documents.find((item) => item.isBlank());
if (got) {

View File

@ -142,7 +142,7 @@ export interface ISimulatorHost<P = object> extends ISensor {
computeComponentInstanceRect(instance: ComponentInstance, selector?: string): DOMRect | null;
findDOMNodes(instance: ComponentInstance, selector?: string): Array<Element | Text> | null;
/**
*
*/

View File

@ -3,6 +3,65 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.28"></a>
## [0.8.28](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.27...@ali/lowcode-editor-core@0.8.28) (2020-08-04)
### Bug Fixes
* 增加try catch ([6f5d11c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6f5d11c))
<a name="0.8.27"></a>
## [0.8.27](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.25...@ali/lowcode-editor-core@0.8.27) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.26"></a>
## [0.8.26](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.25...@ali/lowcode-editor-core@0.8.26) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.25"></a>
## [0.8.25](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.24...@ali/lowcode-editor-core@0.8.25) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.24"></a>
## [0.8.24](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.23...@ali/lowcode-editor-core@0.8.24) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.23"></a>
## [0.8.23](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.22...@ali/lowcode-editor-core@0.8.23) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.22"></a>
## [0.8.22](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.21...@ali/lowcode-editor-core@0.8.22) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-core
<a name="0.8.21"></a>
## [0.8.21](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-core@0.8.20...@ali/lowcode-editor-core@0.8.21) (2020-07-13)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-editor-core",
"version": "0.8.21",
"version": "0.8.28",
"description": "Core Api for Ali lowCode engine",
"license": "MIT",
"main": "lib/index.js",
@ -15,8 +15,8 @@
"cloud-build": "build-scripts build --skip-demo"
},
"dependencies": {
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-types": "^0.8.14",
"@ali/lowcode-utils": "^0.8.16",
"@alifd/next": "^1.19.16",
"@recore/obx": "^1.0.9",
"@recore/obx-react": "^1.0.8",

View File

@ -328,23 +328,27 @@ function getKeyInfo(combination: string, action?: string): KeyInfo {
* convention - prevent default and stop propogation on the event
*/
function fireCallback(callback: HotkeyCallback, e: KeyboardEvent, combo?: string, sequence?: string): void {
const editor = globalContext.get(Editor);
const designer = editor.get('designer');
const node = designer?.currentSelection?.getNodes()?.[0];
const npm = node?.componentMeta?.npm;
const selected =
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') || node?.componentMeta?.componentName || '';
if (callback(e, combo) === false) {
e.preventDefault();
e.stopPropagation();
try {
const editor = globalContext.get(Editor);
const designer = editor.get('designer');
const node = designer?.currentSelection?.getNodes()?.[0];
const npm = node?.componentMeta?.npm;
const selected =
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') || node?.componentMeta?.componentName || '';
if (callback(e, combo) === false) {
e.preventDefault();
e.stopPropagation();
}
editor?.emit('hotkey.callback.call', {
callback,
e,
combo,
sequence,
selected,
});
} catch(err) {
console.error(err.message);
}
editor?.emit('hotkey.callback.call', {
callback,
e,
combo,
sequence,
selected,
});
}
export class Hotkey {

View File

@ -3,6 +3,86 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.9.22"></a>
## [0.9.22](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.21...@ali/lowcode-editor-preset-general@0.9.22) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.21"></a>
## [0.9.21](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.19...@ali/lowcode-editor-preset-general@0.9.21) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.20"></a>
## [0.9.20](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.19...@ali/lowcode-editor-preset-general@0.9.20) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.19"></a>
## [0.9.19](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.18...@ali/lowcode-editor-preset-general@0.9.19) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.18"></a>
## [0.9.18](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.17...@ali/lowcode-editor-preset-general@0.9.18) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.17"></a>
## [0.9.17](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.16...@ali/lowcode-editor-preset-general@0.9.17) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.16"></a>
## [0.9.16](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.15...@ali/lowcode-editor-preset-general@0.9.16) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.15"></a>
## [0.9.15](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.14...@ali/lowcode-editor-preset-general@0.9.15) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.14"></a>
## [0.9.14](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.13...@ali/lowcode-editor-preset-general@0.9.14) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.13"></a>
## [0.9.13](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.12...@ali/lowcode-editor-preset-general@0.9.13) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-preset-general
<a name="0.9.12"></a>
## [0.9.12](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-general@0.9.11...@ali/lowcode-editor-preset-general@0.9.12) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-editor-preset-general",
"version": "0.9.12",
"version": "0.9.22",
"private": true,
"description": "Ali General Editor Preset",
"main": "lib/index.js",
@ -15,12 +15,12 @@
},
"license": "MIT",
"dependencies": {
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-editor-skeleton": "^0.8.33",
"@ali/lowcode-plugin-designer": "^0.9.27",
"@ali/lowcode-plugin-outline-pane": "^0.8.33",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-editor-skeleton": "^0.8.43",
"@ali/lowcode-plugin-designer": "^0.9.37",
"@ali/lowcode-plugin-outline-pane": "^0.8.43",
"@ali/lowcode-types": "^0.8.14",
"@ali/lowcode-utils": "^0.8.16",
"@alifd/next": "^1.19.12",
"@alife/theme-lowcode-dark": "^0.1.0",
"@alife/theme-lowcode-light": "^0.1.0",
@ -28,7 +28,7 @@
"react-dom": "^16.8.1"
},
"devDependencies": {
"@ali/lowcode-editor-setters": "^0.9.7",
"@ali/lowcode-editor-setters": "^0.9.14",
"@alib/build-scripts": "^0.1.18",
"@types/events": "^3.0.0",
"@types/react": "^16.8.3",

View File

@ -3,6 +3,137 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.38"></a>
## [0.8.38](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.37...@ali/lowcode-editor-preset-vision@0.8.38) (2020-08-04)
### Bug Fixes
* 🐛 解决点击组件时无法聚焦到点中的组件上的问题 ([852d882](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/852d882))
<a name="0.8.37"></a>
## [0.8.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.35...@ali/lowcode-editor-preset-vision@0.8.37) (2020-08-04)
### Bug Fixes
* 修复 slot 获取初始值异常的 bug ([63b19f1](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/63b19f1))
* 兼容 listSetter 内部变量,修复回退 fieldId 重置问题 ([c95e618](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/c95e618))
<a name="0.8.36"></a>
## [0.8.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.35...@ali/lowcode-editor-preset-vision@0.8.36) (2020-08-04)
### Bug Fixes
* 修复 slot 获取初始值异常的 bug ([63b19f1](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/63b19f1))
* 兼容 listSetter 内部变量,修复回退 fieldId 重置问题 ([c95e618](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/c95e618))
<a name="0.8.35"></a>
## [0.8.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.34...@ali/lowcode-editor-preset-vision@0.8.35) (2020-07-29)
### Bug Fixes
* slot 兼容问题 + loop key bug fix ([bc64017](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/bc64017))
<a name="0.8.34"></a>
## [0.8.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.33...@ali/lowcode-editor-preset-vision@0.8.34) (2020-07-28)
### Bug Fixes
* vc-filter bug fix ([31ea5d5](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/31ea5d5))
### Features
* 支持 entry 模式 ([fe1f6f1](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fe1f6f1))
<a name="0.8.33"></a>
## [0.8.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.32...@ali/lowcode-editor-preset-vision@0.8.33) (2020-07-23)
### Bug Fixes
* vision prop 初始化时有依赖已初始化的 prop需要实时添加 ([1feb46f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/1feb46f))
<a name="0.8.32"></a>
## [0.8.32](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.31...@ali/lowcode-editor-preset-vision@0.8.32) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-editor-preset-vision
<a name="0.8.31"></a>
## [0.8.31](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.30...@ali/lowcode-editor-preset-vision@0.8.31) (2020-07-21)
### Bug Fixes
* settingField items is empty when type is not 'group' ([582c41a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/582c41a))
* 修复 initial 重复、type = 'composite' 时 items 为空 ([bf79e63](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/bf79e63))
* 修复组件面板详情加载不了的 bug ([cca3309](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/cca3309))
* 兼容 variable 历史数据格式 ([d666317](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d666317))
* 兼容事件绑定 ([f4c07af](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f4c07af))
* 调整 upgrade 和 init 的流程 ([09fc1a0](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/09fc1a0))
### Features
* support subtreeModified ([7eeb51c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/7eeb51c))
<a name="0.8.30"></a>
## [0.8.30](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.29...@ali/lowcode-editor-preset-vision@0.8.30) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-preset-vision
<a name="0.8.29"></a>
## [0.8.29](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.28...@ali/lowcode-editor-preset-vision@0.8.29) (2020-07-21)
### Bug Fixes
* 🐛 eslint ([e3ca0bd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e3ca0bd))
* 🐛 eslint ([14803dd](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/14803dd))
* 🐛 use intl ([a22e66a](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/a22e66a))
* 🐛 用 isI18nData 判断 meta title ([732bccf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/732bccf))
* 🐛 逻辑简化 ([710f3ba](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/710f3ba))
* 可以降级到历史的 JSBlock 格式 ([af1746b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/af1746b))
### Features
* 🎸 prototype getTitle 支持 i18n ([18807ab](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/18807ab))
<a name="0.8.28"></a>
## [0.8.28](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-preset-vision@0.8.27...@ali/lowcode-editor-preset-vision@0.8.28) (2020-07-14)

View File

@ -9,7 +9,8 @@
"externals": {
"react": "var window.React",
"react-dom": "var window.ReactDOM",
"prop-types": "var window.PropTypes"
"prop-types": "var window.PropTypes",
"rax": "var window.Rax"
}
}
],

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-editor-preset-vision",
"version": "0.8.28",
"version": "0.8.38",
"private": true,
"description": "Vision Polyfill for Ali lowCode engine",
"main": "lib/index.js",
@ -15,11 +15,11 @@
},
"license": "MIT",
"dependencies": {
"@ali/lowcode-designer": "^0.9.27",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-editor-skeleton": "^0.8.33",
"@ali/lowcode-plugin-designer": "^0.9.27",
"@ali/lowcode-plugin-outline-pane": "^0.8.33",
"@ali/lowcode-designer": "^0.9.37",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-editor-skeleton": "^0.8.43",
"@ali/lowcode-plugin-designer": "^0.9.37",
"@ali/lowcode-plugin-outline-pane": "^0.8.43",
"@ali/ve-i18n-util": "^2.0.0",
"@ali/ve-icons": "^4.1.9",
"@ali/ve-less-variables": "2.0.3",

View File

@ -1,5 +1,5 @@
import { ComponentType, ReactElement } from 'react';
import { ComponentMetadata, FieldConfig, InitialItem, FilterItem, AutorunItem } from '@ali/lowcode-types';
import { ComponentMetadata, FieldConfig, InitialItem, FilterItem, AutorunItem, isI18nData } from '@ali/lowcode-types';
import {
ComponentMeta,
addBuiltinComponentAction,
@ -15,6 +15,7 @@ import {
upgradePropConfig,
upgradeConfigure,
} from './upgrade-metadata';
import { intl } from '@ali/lowcode-editor-core';
import { designer } from '../editor';
import { uniqueId } from '@ali/lowcode-utils';
@ -23,7 +24,7 @@ const GlobalPropsConfigure: Array<{
initials?: InitialItem[];
filters?: FilterItem[];
autoruns?: AutorunItem[];
config: FieldConfig
config: FieldConfig;
}> = [];
const Overrides: {
[componentName: string]: {
@ -53,7 +54,7 @@ function addGlobalPropsConfigure(config: OldGlobalPropConfig) {
addAutorun: (item) => {
autoruns.push(item);
},
})
}),
});
}
function removeGlobalPropsConfigure(name: string) {
@ -82,7 +83,7 @@ function overridePropsConfigure(componentName: string, config: { [name: string]:
override = upgradeConfigure(config, { addInitial, addFilter, addAutorun });
} else {
override = {};
Object.keys(config).forEach(key => {
Object.keys(config).forEach((key) => {
override[key] = upgradePropConfig(config[key], { addInitial, addFilter, addAutorun });
});
}
@ -219,6 +220,9 @@ class Prototype {
readonly isPrototype = true;
readonly meta: ComponentMeta;
readonly options: OldPrototypeConfig | ComponentMetadata;
get packageName() {
return this.meta.npm?.package;
}
constructor(input: OldPrototypeConfig | ComponentMetadata | ComponentMeta, lookup: boolean = false) {
if (lookup) {
@ -250,7 +254,7 @@ class Prototype {
}
getPackageName() {
return this.meta.npm?.package;
return this.packageName;
}
getContextInfo(name: string): any {
@ -258,7 +262,7 @@ class Prototype {
}
getTitle() {
return this.meta.title;
return intl(this.meta.title);
}
getComponentName() {

View File

@ -1,8 +1,9 @@
import { ComponentType, ReactElement, isValidElement, ComponentClass } from 'react';
import { isPlainObject } from '@ali/lowcode-utils';
import { isI18nData, SettingTarget, InitialItem, FilterItem, isJSSlot, ProjectSchema, AutorunItem } from '@ali/lowcode-types';
import { isPlainObject, uniqueId } from '@ali/lowcode-utils';
import { isI18nData, SettingTarget, InitialItem, FilterItem, isJSSlot, ProjectSchema, AutorunItem, isJSBlock } from '@ali/lowcode-types';
import { untracked } from '@ali/lowcode-editor-core';
import { editor, designer } from '../editor';
import { SettingField } from '@ali/lowcode-designer';
type Field = SettingTarget;
@ -218,7 +219,7 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
};
const newConfig: any = {
type: type === 'group' ? 'group' : 'field',
name,
name: type === 'group' && !name ? uniqueId('group') : name,
title,
extraProps,
};
@ -281,16 +282,14 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
let initialFn = (slotName ? null : initial) || initialValue;
if (slotName && initialValue === true) {
initialFn = (field: any, value: any) => {
if (isJSSlot(value)) {
return {
title: slotTitle || title,
...value,
};
initialFn = (value: any, defaultValue: any) => {
if (isJSBlock(value)) {
return value;
}
return {
type: 'JSSlot',
title: slotTitle || title,
name: slotName,
value: initialChildren,
};
};
@ -325,6 +324,10 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
if (mutator) {
extraProps.setValue = (field: Field, value: any) => {
// TODO: 兼容代码,不触发查询组件的 Mutator
if (field instanceof SettingField && field.componentMeta?.componentName === 'Filter') {
return;
}
mutator.call(field, value, value);
};
}
@ -332,26 +335,28 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
const setterInitial = getInitialFromSetter(setter);
collector.addInitial({
// FIXME! name could be "xxx.xxx"
name: slotName || name,
initial: (field: Field, currentValue: any) => {
// FIXME! read from prototype.defaultProps
const defaults = extraProps.defaultValue;
if (type !== 'composite') {
collector.addInitial({
// FIXME! name could be "xxx.xxx"
name: slotName || name,
initial: (field: Field, currentValue: any) => {
// FIXME! read from prototype.defaultProps
const defaults = extraProps.defaultValue;
if (typeof initialFn !== 'function') {
initialFn = defaultInitial;
}
if (typeof initialFn !== 'function') {
initialFn = defaultInitial;
}
const v = initialFn.call(field, currentValue, defaults);
const v = initialFn.call(field, currentValue, defaults);
if (setterInitial) {
return setterInitial.call(field, v, defaults);
}
if (setterInitial) {
return setterInitial.call(field, v, defaults);
}
return v;
},
});
return v;
},
});
}
if (ignore != null || disabled != null) {
collector.addFilter({
@ -394,6 +399,7 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
return {
type: 'JSSlot',
title: slotTitle || title,
name: slotName,
value: value == null ? initialChildren : value,
};
},
@ -431,9 +437,11 @@ export function upgradePropConfig(config: OldPropConfig, collector: ConfigCollec
autorun: item.autorun,
});
},
}
},
)
: [];
newConfig.items = objItems;
const initial = (target: SettingTarget, value?: any) => {
// TODO:
const defaults = extraProps.defaultValue;
@ -749,10 +757,7 @@ export function upgradeMetadata(oldConfig: OldPrototypeConfig) {
callbacks.onNodeRemove = didDropOut;
}
if (subtreeModified) {
callbacks.onSubtreeModified = (...args: any[]) => {
// FIXME! args not correct
subtreeModified.apply(args[0], args as any);
};
callbacks.onSubtreeModified = subtreeModified;
}
if (onResize) {
callbacks.onResize = (e: any, currentNode: any) => {

View File

@ -3,11 +3,19 @@ import { isJSSlot, isI18nData, isJSExpression } from '@ali/lowcode-types';
import { isPlainObject } from '@ali/lowcode-utils';
import i18nUtil from './i18n-util';
function isVariable(obj: any) {
return obj && obj.type === 'variable';
}
// FIXME: 表达式使用 mock 值未来live 模式直接使用原始值
export function deepValueParser(obj?: any): any {
if (isJSExpression(obj)) {
obj = obj.mock;
}
// 兼容 ListSetter 中的变量结构
if (isVariable(obj)) {
obj = obj.value;
}
if (!obj) {
return obj;
}

View File

@ -55,7 +55,8 @@ function upgradePropsReducer(props: any) {
val = {
type: 'JSSlot',
title: (val.value.props as any)?.slotTitle,
value: val.value.children
name: (val.value.props as any)?.slotName,
value: val.value.children,
};
} else {
val = val.value;
@ -84,30 +85,51 @@ designer.addPropsReducer((props, node) => {
const newProps: any = {
...props,
};
const getRealValue = (propValue: any) => {
if (isVariable(propValue)) {
return propValue.value;
}
if (isJSExpression(propValue)) {
return propValue.mock;
}
return propValue;
};
initials.forEach((item) => {
// FIXME! this implements SettingTarget
try {
// FIXME! item.name could be 'xxx.xxx'
const ov = props[item.name];
const v = item.initial(node as any, isJSExpression(ov) ? ov.mock : ov);
if (v !== undefined) {
newProps[item.name] = isJSExpression(ov) ? {
...ov,
mock: v,
} : v;
const v = item.initial(node as any, getRealValue(ov));
if (!ov && v !== undefined) {
if (isVariable(ov)) {
newProps[item.name] = {
...ov,
value: v,
};
} else if (isJSExpression(ov)) {
newProps[item.name] = {
...ov,
mock: v,
};
} else {
newProps[item.name] = v;
}
}
} catch (e) {
if (hasOwnProperty(props, item.name)) {
newProps[item.name] = props[item.name];
}
}
if (newProps[item.name] && !node.props.has(item.name)) {
node.props.add(newProps[item.name], item.name);
}
});
return newProps;
}
return props;
}, TransformStage.Init);
function filterReducer(props: any, node: Node): any {
const filters = node.componentMeta.getMetadata().experimental?.filters;
if (filters && filters.length) {
@ -140,7 +162,6 @@ function compatiableReducer(props: any) {
const newProps: any = {};
Object.entries<any>(props).forEach(([key, val]) => {
if (isJSSlot(val)) {
val.value
val = {
type: 'JSBlock',
value: {
@ -148,8 +169,17 @@ function compatiableReducer(props: any) {
children: val.value,
props: {
slotTitle: val.title,
slotName: val.name,
},
},
};
}
// 为了能降级到老版本,建议在后期版本去掉以下代码
if (isJSExpression(val) && !val.events) {
val = {
type: 'variable',
value: val.mock,
variable: val.value,
}
}
newProps[key] = val;
@ -237,7 +267,7 @@ skeleton.add({
props: {
condition: () => {
return designer.dragon.dragging && !getTreeMaster(designer).hasVisibleTreeBoard();
}
},
},
content: OutlineBackupPane,
});

View File

@ -41,19 +41,21 @@ const pages = Object.assign(project, {
if (componentsTree[0]) {
componentsTree[0].componentName = componentsTree[0].componentName || 'Page';
// FIXME
if (componentsTree[0].componentName === 'Page' ||
componentsTree[0].componentName === 'Component') {
if (componentsTree[0].componentName === 'Page' || componentsTree[0].componentName === 'Component') {
componentsTree[0].lifeCycles = {};
componentsTree[0].methods = {};
}
}
}
project.load({
version: '1.0.0',
componentsMap: [],
componentsTree,
}, true);
project.load(
{
version: '1.0.0',
componentsMap: [],
componentsTree,
},
true,
);
},
addPage(data: OldPageData | RootSchema) {
if (isPageDataV1(data)) {
@ -90,18 +92,20 @@ const pages = Object.assign(project, {
return project.onCurrentDocumentChange(fn);
},
toData() {
return project.documents.map(doc => doc.toData());
}
return project.documents.map((doc) => doc.toData());
},
});
Object.defineProperty(pages, 'currentPage', {
get() {
return project.currentDocument;
}
})
},
});
pages.onCurrentPageChange((page: DocumentModel) => {
if (!page) { return; }
if (!page) {
return;
}
page.acceptRootNodeVisitor('NodeCache', (rootNode) => {
const visitor: NodeCacheVisitor = page.getRootNodeVisitor('NodeCache');
if (visitor) {

View File

@ -3,6 +3,65 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.9.14"></a>
## [0.9.14](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.13...@ali/lowcode-editor-setters@0.9.14) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.13"></a>
## [0.9.13](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.11...@ali/lowcode-editor-setters@0.9.13) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.12"></a>
## [0.9.12](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.11...@ali/lowcode-editor-setters@0.9.12) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.11"></a>
## [0.9.11](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.10...@ali/lowcode-editor-setters@0.9.11) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.10"></a>
## [0.9.10](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.9...@ali/lowcode-editor-setters@0.9.10) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.9"></a>
## [0.9.9](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.8...@ali/lowcode-editor-setters@0.9.9) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-setters
<a name="0.9.8"></a>
## [0.9.8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.7...@ali/lowcode-editor-setters@0.9.8) (2020-07-21)
### Bug Fixes
* rename MixinSetter to MixedSetter ([0e9a740](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/0e9a740))
<a name="0.9.7"></a>
## [0.9.7](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-setters@0.9.6...@ali/lowcode-editor-setters@0.9.7) (2020-07-13)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-editor-setters",
"version": "0.9.7",
"version": "0.9.14",
"description": "Builtin setters for Ali lowCode engine",
"files": [
"es",
@ -22,7 +22,7 @@
"@ali/iceluna-comp-react-node": "^1.0.5",
"@ali/iceluna-sdk": "^1.0.5-beta.24",
"@ali/lc-style-setter": "^0.0.1",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-editor-core": "^0.8.28",
"@alifd/next": "^1.19.16",
"acorn": "^6.4.1",
"classnames": "^2.2.6",

View File

@ -8,6 +8,7 @@ import JsonSetter from './json-setter';
import EventsSetter from './events-setter';
import StyleSetter from './style-setter';
import IconSetter from './icon-setter';
import MixedSetter from './mixed-setter';
export const StringSetter = {
component: Input,
@ -43,7 +44,7 @@ export const DateYearSetter = DatePicker.YearPicker;
export const DateMonthSetter = DatePicker.MonthPicker;
export const DateRangeSetter = DatePicker.RangePicker;
export { ExpressionSetter, EventsSetter };
export { ExpressionSetter, EventsSetter, JsonSetter, MixedSetter };
class StringDateSetter extends Component {
render() {
@ -97,6 +98,7 @@ const builtinSetters: any = {
JsonSetter,
StyleSetter,
IconSetter,
MixedSetter,
};
registerSetter(builtinSetters);

View File

@ -0,0 +1,13 @@
// mixed
.lowcode-setter-mixed > * {
vertical-align: middle;
}
.lowcode-setter-mixed {
width: 86%;
}
.lowcode-setter-mixed .next-input {
width: 100%;
}
.lowcode-setter-mixed .next-select-trigger {
width: 100%;
}

View File

@ -8,8 +8,8 @@ import { generateI18n } from './locale/utils';
import zhCN from './locale/zh-CN';
import './index.scss';
export default class Mixin extends PureComponent {
static displayName = 'Mixin';
export default class Mixed extends PureComponent {
static displayName = 'Mixed';
static propTypes = {
locale: PropTypes.string,
messages: PropTypes.object,

View File

@ -1,13 +0,0 @@
// mixin
.lowcode-setter-mixin > * {
vertical-align: middle;
}
.lowcode-setter-mixin {
width: 86%;
}
.lowcode-setter-mixin .next-input {
width: 100%;
}
.lowcode-setter-mixin .next-select-trigger {
width: 100%;
}

View File

@ -3,6 +3,121 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.43"></a>
## [0.8.43](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.42...@ali/lowcode-editor-skeleton@0.8.43) (2020-08-04)
### Bug Fixes
* 🐛 mainArea 画布切换MainArea 重新初始化导致 iframe 初始化报错 ([5054d06](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/5054d06))
<a name="0.8.42"></a>
## [0.8.42](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.40...@ali/lowcode-editor-skeleton@0.8.42) (2020-08-04)
### Bug Fixes
* condition增加异常保护 ([8324368](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8324368))
* CR 问题修复 ([f054cbf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f054cbf))
* remove console ([6c703d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6c703d8))
* 兼容vision体系代码面板中引用计数功能 ([8ade6d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8ade6d8))
* 导入的组件默认怎么变量绑定 ([fc398c2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fc398c2))
* 导入的组件默认怎么变量绑定 ([194d8d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/194d8d8))
<a name="0.8.41"></a>
## [0.8.41](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.40...@ali/lowcode-editor-skeleton@0.8.41) (2020-08-04)
### Bug Fixes
* condition增加异常保护 ([8324368](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8324368))
* CR 问题修复 ([f054cbf](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/f054cbf))
* remove console ([6c703d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6c703d8))
* 兼容vision体系代码面板中引用计数功能 ([8ade6d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/8ade6d8))
* 导入的组件默认怎么变量绑定 ([fc398c2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fc398c2))
* 导入的组件默认怎么变量绑定 ([194d8d8](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/194d8d8))
<a name="0.8.40"></a>
## [0.8.40](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.39...@ali/lowcode-editor-skeleton@0.8.40) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-editor-skeleton
<a name="0.8.39"></a>
## [0.8.39](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.38...@ali/lowcode-editor-skeleton@0.8.39) (2020-07-28)
### Bug Fixes
* setting 面板样式调整 ([922b361](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/922b361))
### Features
* 支持 entry 模式 ([fe1f6f1](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/fe1f6f1))
<a name="0.8.38"></a>
## [0.8.38](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.37...@ali/lowcode-editor-skeleton@0.8.38) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-editor-skeleton
<a name="0.8.37"></a>
## [0.8.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.36...@ali/lowcode-editor-skeleton@0.8.37) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-editor-skeleton
<a name="0.8.36"></a>
## [0.8.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.35...@ali/lowcode-editor-skeleton@0.8.36) (2020-07-21)
### Features
* support float pane fixed ([40d8260](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/40d8260))
<a name="0.8.35"></a>
## [0.8.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.34...@ali/lowcode-editor-skeleton@0.8.35) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-editor-skeleton
<a name="0.8.34"></a>
## [0.8.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.33...@ali/lowcode-editor-skeleton@0.8.34) (2020-07-21)
### Bug Fixes
* left-fixed-pane 设置宽度不生效 ([a5f0d5e](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/a5f0d5e))
* skeleton.topArea.hide() 不生效的问题 ([6d2b955](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/6d2b955))
* typeName 为 any 时转换出的 MixedSetter 缺少 props 的问题 ([4b9084f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/4b9084f))
<a name="0.8.33"></a>
## [0.8.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-editor-skeleton@0.8.32...@ali/lowcode-editor-skeleton@0.8.33) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-editor-skeleton",
"version": "0.8.33",
"version": "0.8.43",
"description": "alibaba lowcode editor skeleton",
"main": "lib/index.js",
"module": "es/index.js",
@ -19,14 +19,17 @@
"editor"
],
"dependencies": {
"@ali/lowcode-designer": "^0.9.27",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-designer": "^0.9.37",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-types": "^0.8.14",
"@ali/lowcode-utils": "^0.8.16",
"@alifd/next": "^1.20.12",
"classnames": "^2.2.6",
"react": "^16.8.1",
"react-dom": "^16.8.1"
"react-dom": "^16.8.1",
"events": "^3.2.0",
"@ali/ve-icons": "latest",
"@ali/ve-less-variables": "^2.0.0"
},
"devDependencies": {
"@alib/build-scripts": "^0.1.3",

View File

@ -31,9 +31,17 @@ export default class Area<C extends IWidgetBaseConfig = any, T extends IWidget =
}
add(config: T | C): T {
const item = this.container.get(config.name);
if (item) {
return item;
}
return this.container.add(config);
}
remove(config: T | string): number {
return this.container.remove(config);
}
private lastCurrent: T | null = null;
setVisible(flag: boolean) {
if (this.exclusive) {

View File

@ -2,19 +2,17 @@ import { Component } from 'react';
import { isObject } from 'lodash';
import classNames from 'classnames';
import { Icon } from '@alifd/next';
import { Title, Tip } from '@ali/lowcode-editor-core';
import { Title } from '@ali/lowcode-editor-core';
import { TitleContent } from '@ali/lowcode-types';
import { PopupPipe, PopupContext } from '../popup';
import { intlNode } from '../../locale';
import './index.less';
import { IconClear } from '../../icons/clear';
import InlineTip from './inlinetip';
export interface FieldProps {
className?: string;
meta?: { package: string; componentName: string } | string;
title?: TitleContent | null;
defaultDisplay?: 'accordion' | 'inline' | 'block';
defaultDisplay?: 'accordion' | 'inline' | 'block' | 'plain' | 'popup' | 'entry';
collapsed?: boolean;
valueState?: number;
name?: string;
@ -134,14 +132,18 @@ export class Field extends Component<FieldProps> {
})}
id={id}
>
<div className="lc-field-head" onClick={isAccordion ? this.toggleExpand : undefined}>
<div className="lc-field-title">
{createValueState(valueState, this.handleClear)}
<Title title={title || ''} />
<InlineTip position="top">{tipContent}</InlineTip>
</div>
{isAccordion && <Icon className="lc-field-icon" type="arrow-up" size="xs" />}
</div>
{
display !== 'plain' && (
<div className="lc-field-head" onClick={isAccordion ? this.toggleExpand : undefined}>
<div className="lc-field-title">
{createValueState(valueState, this.handleClear)}
<Title title={title || ''} />
<InlineTip position="top">{tipContent}</InlineTip>
</div>
{isAccordion && <Icon className="lc-field-icon" type="arrow-up" size="xs" />}
</div>
)
}
<div key="body" ref={(shell) => (this.body = shell)} className="lc-field-body">
{children}
</div>
@ -250,21 +252,17 @@ export interface EntryFieldProps extends FieldProps {
export class EntryField extends Component<EntryFieldProps> {
render() {
const { stageName, title, className } = this.props;
const classNameList = classNames('engine-setting-field', 'engine-entry-field', className);
const fieldProps: any = {};
if (stageName) {
// 为 stage 切换奠定基础
fieldProps['data-stage-target'] = stageName;
}
const { title, className, stageName } = this.props;
const classNameList = classNames('lc-field', 'lc-entry-field', className);
return (
<div className={classNameList} {...fieldProps}>
<div className="lc-field-title">
<Title title={title || ''} />
<div className={classNameList}>
<div className="lc-field-head" data-stage-target={stageName}>
<div className="lc-field-title">
<Title title={title || ''} />
</div>
<Icon className="lc-field-icon" type="arrow-right" size="xs" />
</div>
<Icon className="lc-field-icon" type="arrow-left" size="xs" />
</div>
);
}

View File

@ -1,6 +1,10 @@
@x-gap: 12px;
@y-gap: 8px;
.lc-settings-content > .lc-field:first-child > .lc-field-head{
border-top: none !important;
}
.lc-field {
.lc-field-head {
display: flex;
@ -68,17 +72,7 @@
&.lc-inline-field {
display: flex;
align-items: center;
// for top-level style
padding: 16px;
&:first-child{
padding-top: 16px;
}
&:last-child{
padding-bottom: 16px;
}
&+.lc-inline-field{
padding-top: 0;
}
margin: 12px;
> .lc-field-head {
width: 70px;
@ -96,11 +90,11 @@
}
}
&.lc-block-field, &.lc-accordion-field {
&.lc-block-field, &.lc-accordion-field, &.lc-entry-field {
display: block;
&:first-child {
> .lc-field-head {
border-top: none;
// border-top: none;
}
}
> .lc-field-head {
@ -112,7 +106,7 @@
border-top: 1px solid var(--color-line-normal,rgba(31,56,88,.1));
border-bottom: 1px solid var(--color-line-normal,rgba(31,56,88,.1));
color: var(--color-title);
padding: 0 16px;
padding: 0 12px;
user-select: none;
> .lc-field-icon {
@ -121,18 +115,30 @@
}
> .lc-field-body {
// padding: @y-gap @x-gap/2;
padding: 12px;
.lc-inline-field{
margin-bottom: 12px;
&:last-child{
.lc-inline-field {
margin: 12px 0;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
}
+ .lc-inline-field {
border-top: 1px solid var(--color-line-normal);
// + .lc-inline-field {
// border-top: 1px solid var(--color-line-normal);
// }
}
&.lc-entry-field {
margin-bottom: 6px;
> .lc-field-head {
cursor: pointer;
}
}
@ -153,6 +159,10 @@
&.lc-accordion-field {
position: relative;
> .lc-field-head {
cursor: pointer;
}
&.lc-field-is-collapsed {
margin-bottom: 6px;
@ -179,37 +189,35 @@
// 2rd level reset
.lc-field-body {
.lc-inline-field {
// padding: @y-gap @x-gap/2 0 @x-gap/2;
padding: 0;
&:first-child {
padding-top: 0;
}
+ .lc-accordion-field, +.lc-block-field {
margin-top: @y-gap;
}
}
// .lc-inline-field {
// &:first-child {
// padding-top: 0;
// }
// + .lc-accordion-field, +.lc-block-field {
// margin-top: @y-gap;
// }
// }
.lc-field {
border-top: none !important;
}
// .lc-field {
// border-top: none !important;
// }
.lc-accordion-field, .lc-block-field {
> .lc-field-head {
padding-left: @x-gap;
background: var(--color-block-background-light);
border-bottom: none;
border-top: none;
> .lc-field-icon {
// margin-right: @x-gap/2;
margin-right: 0;
}
}
// .lc-accordion-field, .lc-block-field {
// > .lc-field-head {
// padding-left: @x-gap;
// background: var(--color-block-background-light);
// border-bottom: none;
// border-top: none;
// > .lc-field-icon {
// // margin-right: @x-gap/2;
// margin-right: 0;
// }
// }
> .lc-field-body {
padding: 8px;
}
}
// > .lc-field-body {
// padding: 8px;
// }
// }
// 3rd level field title width should short
// .lc-field-body .lc-inline-field {
@ -220,8 +228,8 @@
// }
// }
// }
>.lc-block-setter {
flex: 1;
}
// >.lc-block-setter {
// flex: 1;
// }
}
}

View File

@ -1,24 +1,36 @@
import { Component, MouseEvent } from 'react';
import { shallowIntl, createSetterContent, observer } from '@ali/lowcode-editor-core';
import { Component, MouseEvent, Fragment } from 'react';
import { shallowIntl, createSetterContent, observer, obx, Title } from '@ali/lowcode-editor-core';
import { createContent } from '@ali/lowcode-utils';
import { Field, createField } from '../field';
import PopupService, { PopupPipe } from '../popup';
import { createField } from '../field';
import { SkeletonContext } from '../../context';
import { SettingField, isSettingField, SettingTopEntry, SettingEntry } from '@ali/lowcode-designer';
import { Icon } from '@alifd/next';
import { isSetterConfig, CustomView } from '@ali/lowcode-types';
import { intl } from '../../locale';
import { Skeleton } from 'editor-skeleton/src/skeleton';
import { Skeleton } from '../../skeleton';
import { Stage } from '../../widget/stage';
function transformStringToFunction(str) {
if (typeof str !== 'string') return str;
return new Function(`"use strict"; return ${str}`)();
}
@observer
class SettingFieldView extends Component<{ field: SettingField }> {
static contextType = SkeletonContext;
render() {
const { field } = this.props;
const { extraProps } = field;
const { condition, defaultValue } = extraProps;
const visible = field.isSingle && typeof condition === 'function' ? condition(field) !== false : true;
const { extraProps, componentMeta } = field;
const { condition, defaultValue, display } = extraProps;
const { prototype } = componentMeta;
let visible;
try {
visible = field.isSingle && typeof condition === 'function' ? condition(field) !== false : true;
} catch (error) {
console.error('exception when condition (hidden) is excuted', error);
}
if (!visible) {
return null;
}
@ -27,6 +39,8 @@ class SettingFieldView extends Component<{ field: SettingField }> {
let setterProps: any = {};
let setterType: any;
let initialValue: any = null;
const isReactComponent = prototype === null || prototype === undefined;
if (Array.isArray(setter)) {
setterType = 'MixedSetter';
setterProps = {
@ -43,9 +57,15 @@ class SettingFieldView extends Component<{ field: SettingField }> {
if (setter.initialValue != null) {
initialValue = setter.initialValue;
}
} else if (isReactComponent) {
setterType = 'MixedSetter';
setterProps = {
setters: [setter, 'VariableSetter'],
};
} else if (setter) {
setterType = setter;
}
let value = null;
if (defaultValue != null && !('defaultValue' in setterProps)) {
setterProps.defaultValue = defaultValue;
@ -62,11 +82,27 @@ class SettingFieldView extends Component<{ field: SettingField }> {
value = field.getValue();
}
const skeleton = this.context as Skeleton;
const { stages } = skeleton;
// todo: error handling
let _onChange = extraProps?.onChange?.value;
if (extraProps && extraProps.onChange && extraProps.onChange.type === 'JSFunction') {
_onChange = transformStringToFunction(extraProps.onChange.value);
}
let stageName;
if (display === 'entry') {
const stage = stages.add({
type: 'Widget',
name: field.getNode().id + '_' + field.name.toString(),
content: <Fragment>{field.items.map((item, index) => createSettingFieldView(item, field, index))}</Fragment>,
props: {
title: field.title,
},
});
stageName = stage.name;
}
return createField(
{
meta: field?.componentMeta?.npm || field?.componentMeta?.componentName || '',
@ -75,35 +111,39 @@ class SettingFieldView extends Component<{ field: SettingField }> {
valueState: field.isRequired ? 10 : field.valueState,
onExpandChange: (expandState) => field.setExpanded(expandState),
onClear: () => field.clearValue(),
// field: field,
// stages,
stageName,
...extraProps,
},
createSetterContent(setterType, {
...shallowIntl(setterProps),
forceInline: extraProps.forceInline,
key: field.id,
// === injection
prop: field, // for compatible vision
field,
// === IO
value, // reaction point
onChange: (value: any) => {
this.setState({
value,
});
field.setValue(value);
if(_onChange) _onChange(value, field);
},
onInitial: () => {
if (initialValue == null) {
return;
}
const value = typeof initialValue === 'function' ? initialValue(field) : initialValue;
this.setState({
value,
});
field.setValue(value);
},
}),
!stageName &&
createSetterContent(setterType, {
...shallowIntl(setterProps),
forceInline: extraProps.forceInline,
key: field.id,
// === injection
prop: field, // for compatible vision
field,
// === IO
value, // reaction point
onChange: (value: any) => {
this.setState({
value,
});
field.setValue(value);
if (_onChange) _onChange(value, field);
},
onInitial: () => {
if (initialValue == null) {
return;
}
const value = typeof initialValue === 'function' ? initialValue(field) : initialValue;
this.setState({
value,
});
field.setValue(value);
},
}),
extraProps.forceInline ? 'plain' : extraProps.display,
);
}
@ -111,6 +151,8 @@ class SettingFieldView extends Component<{ field: SettingField }> {
@observer
class SettingGroupView extends Component<{ field: SettingField }> {
static contextType = SkeletonContext;
shouldComponentUpdate() {
return false;
}
@ -118,26 +160,42 @@ class SettingGroupView extends Component<{ field: SettingField }> {
render() {
const { field } = this.props;
const { extraProps } = field;
const { condition } = extraProps;
const { condition, display } = extraProps;
const visible = field.isSingle && typeof condition === 'function' ? condition(field) !== false : true;
if (!visible) {
return null;
}
const skeleton = this.context as Skeleton;
const { stages } = skeleton;
let stageName;
if (display === 'entry') {
const stage = stages.add({
type: 'Widget',
name: field.getNode().id + '_' + field.name.toString(),
content: <Fragment>{field.items.map((item, index) => createSettingFieldView(item, field, index))}</Fragment>,
props: {
title: field.title,
},
});
stageName = stage.name;
}
// todo: split collapsed state | field.items for optimize
return (
<Field
defaultDisplay="accordion"
meta={field?.componentMeta?.npm || field?.componentMeta?.componentName || ''}
title={field.title}
collapsed={!field.expanded}
onExpandChange={(expandState) => {
field.setExpanded(expandState);
}}
>
{field.items.map((item, index) => createSettingFieldView(item, field, index))}
</Field>
return createField(
{
meta: field.componentMeta?.npm || field.componentMeta?.componentName || '',
title: field.title,
collapsed: !field.expanded,
onExpandChange: (expandState) => field.setExpanded(expandState),
// field: field,
// stages,
stageName,
},
field.items.map((item, index) => createSettingFieldView(item, field, index)),
display,
);
}
}
@ -154,21 +212,27 @@ export function createSettingFieldView(item: SettingField | CustomView, field: S
}
}
export type SettingsPaneProps = {
target: SettingTopEntry | SettingField;
usePopup?: boolean;
};
@observer
export class SettingsPane extends Component<{ target: SettingTopEntry | SettingField }> {
export class SettingsPane extends Component<SettingsPaneProps> {
static contextType = SkeletonContext;
@obx
private currentStage?: Stage;
shouldComponentUpdate() {
return false;
}
private popupPipe = new PopupPipe();
private pipe = this.popupPipe.create();
private handleClick = (e: MouseEvent) => {
// compatiable vision stageBox
// TODO: optimize these codes
const { usePopup = true } = this.props;
if (!usePopup) return;
const pane = e.currentTarget as HTMLDivElement;
let entry: any;
function getTarget(node: any): any {
if (!pane.contains(node) || (node.nodeName === 'A' && node.getAttribute('href'))) {
return null;
@ -176,7 +240,6 @@ export class SettingsPane extends Component<{ target: SettingTopEntry | SettingF
const target = node.dataset ? node.dataset.stageTarget : null;
if (target) {
entry = node;
return target;
}
return getTarget(node.parentNode);
@ -192,22 +255,38 @@ export class SettingsPane extends Component<{ target: SettingTopEntry | SettingF
}
const stage = skeleton.stages.container.get(target);
if (stage) {
this.pipe.send(stage.content, stage.title);
this.pipe.show(entry);
if (this.currentStage) {
stage.setPrevious(this.currentStage);
}
this.currentStage = stage;
}
};
private popStage() {
this.currentStage = this.currentStage?.getPrevious();
}
render() {
const { target } = this.props;
const items = target.items;
return (
<div className="lc-settings-pane" onClick={this.handleClick}>
{/* todo: add head for single use */}
<PopupService popupPipe={this.popupPipe}>
<div className="lc-settings-content">
{items.map((item, index) => createSettingFieldView(item, target, index))}
{this.currentStage && (
<div className="lc-setting-stage-back">
<Icon
className="lc-setting-stage-back-icon"
type="arrow-left"
size="xs"
onClick={this.popStage.bind(this)}
/>
<Title title={this.currentStage.title} />
</div>
</PopupService>
)}
<div className="lc-settings-content">
{this.currentStage
? this.currentStage.content
: target.items.map((item, index) => createSettingFieldView(item, target, index))}
</div>
</div>
);
}

View File

@ -4,6 +4,8 @@ import { Title, observer, Editor, obx, globalContext } from '@ali/lowcode-editor
import { Node, isSettingField, SettingField, Designer } from '@ali/lowcode-designer';
import { SettingsMain } from './main';
import { SettingsPane } from './settings-pane';
import { StageBox } from '../stage-box';
import { SkeletonContext } from '../../context';
import { createIcon } from '@ali/lowcode-utils';
@observer
@ -114,7 +116,18 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor }> {
<div className="lc-settings-main">
{this.renderBreadcrumb()}
<div className="lc-settings-body">
<SettingsPane target={settings} />
<SkeletonContext.Consumer>
{(skeleton) => {
if (skeleton) {
return (
<StageBox skeleton={skeleton} target={settings}>
<SettingsPane target={settings} usePopup={false} />
</StageBox>
);
}
return null;
}}
</SkeletonContext.Consumer>
</div>
</div>
);
@ -127,7 +140,18 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor }> {
}
return (
<Tab.Item className="lc-settings-tab-item" title={<Title title={field.title} />} key={field.name}>
<SettingsPane target={field} key={field.id} />
<SkeletonContext.Consumer>
{(skeleton) => {
if (skeleton) {
return (
<StageBox skeleton={skeleton} target={field} key={field.id}>
<SettingsPane target={field} key={field.id} usePopup={false} />
</StageBox>
);
}
return null;
}}
</SkeletonContext.Consumer>
</Tab.Item>
);
});

View File

@ -3,6 +3,42 @@
height: 100%;
overflow: hidden;
.lc-settings-content {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
overflow-y: auto;
}
.lc-setting-stage-back + .lc-settings-content {
top: 38px;
}
.lc-setting-stage-back {
height: 32px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
background: var(--color-block-background-shallow, rgba(31,56,88,.06));
color: var(--color-title);
padding: 0 16px;
user-select: none;
position: relative;
margin-bottom: 4px;
position: absolute;
.lc-setting-stage-back-icon {
position: absolute;
left: 8px;
top: 8px;
color: #8F9BB3;
cursor: pointer;
}
}
.lc-settings-notice {
text-align: center;
font-size: 12px;

View File

@ -0,0 +1,78 @@
@import "~@ali/ve-less-variables/index.less";
.skeleton-stagebox {
overflow-x: hidden;
overflow-y: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
.skeleton-stagebox-stage {
height: auto;
overflow: hidden;
transition: transform 0.2s;
&.skeleton-stagebox-refer {
position: absolute;
top: 0;
left: 0;
right: 0;
height: auto;
}
&.skeleton-stagebox-stageout-left, &.skeleton-stagebox-stagein-right {
transform: translateX(-100%);
}
&.skeleton-stagebox-stageout-right, &.skeleton-stagebox-stagein-left {
transform: translateX(100%);
}
.skeleton-stagebox-stagebacker {
cursor: pointer;
height: 30px;
display: flex;
align-items: center;
background: var(--color-block-background-light, @normal-alpha-9);
justify-content: center;
position: relative;
.skeleton-stagebox-stage-arrow {
position: absolute;
left: 3px;
top: 50%;
transform: translateY(-50%) rotate(90deg);
opacity: 0.6;
}
.skeleton-stagebox-stage-title {
font-weight: bold;
}
&:hover {
background: var(--color-block-background-dark, @normal-alpha-7);
.skeleton-stagebox-stage-arrow {
opacity: 1;
}
}
.skeleton-stagebox-stage-exit {
position: absolute;
right: 3px;
top: 50%;
transform: translateY(-50%);
opacity: 0.6;
}
}
.skeleton-stagebox-stage-content {
overflow: hidden;
box-sizing: border-box;
}
&.skeleton-stagebox-has-backer {
.skeleton-stagebox-stage-content {
padding-top: 30px;
}
}
}
}

View File

@ -0,0 +1,4 @@
import StageBox from './stage-box';
import './index.less';
export { StageBox };

View File

@ -0,0 +1,120 @@
import React, { Component } from 'react';
import classNames from 'classnames';
import { observer } from '@ali/lowcode-editor-core';
import { SettingTopEntry, SettingField } from '@ali/lowcode-designer';
import StageChain from './stage-chain';
import Stage from './stage';
import { Skeleton } from '../../skeleton';
import { Stage as StageWidget } from '../../widget/stage';
export const StageBoxDefaultProps = {};
export type StageBoxProps = typeof StageBoxDefaultProps & {
stageChain?: StageChain;
className?: string;
children: React.ReactNode;
skeleton: Skeleton;
// @todo to remove
target?: SettingTopEntry | SettingField;
};
type WillDetachMember = () => void;
@observer
export default class StageBox extends Component<StageBoxProps> {
static defaultProps = StageBoxDefaultProps;
static displayName = 'StageBox';
private stageChain: StageChain;
private willDetach: WillDetachMember[] = [];
private shell: HTMLElement | null;
constructor(props: StageBoxProps) {
super(props);
const { stageChain, children, skeleton } = this.props;
if (stageChain) {
this.stageChain = stageChain;
} else {
const stateName = skeleton.createStage({
content: children,
});
this.stageChain = new StageChain(skeleton.getStage(stateName as string) as StageWidget);
}
this.willDetach.push(this.stageChain.onStageChange(() => this.forceUpdate()));
}
componentDidMount() {
const shell = this.shell;
/**
* target
* @param node
* @returns dataset.stageTarget
*/
const getTarget = (node: HTMLElement | null): null | string => {
if (!node || !shell?.contains(node) || (node.nodeName === 'A' && node.getAttribute('href'))) {
return null;
}
const target = node.dataset ? node.dataset.stageTarget : null;
if (target) {
return target;
}
return getTarget(node.parentNode as HTMLElement);
};
const click = (e: MouseEvent) => {
const target = getTarget(e.target as HTMLElement);
if (!target) {
return;
}
if (target === 'stageback') {
this.stageChain.stageBack();
} else if (target === 'stageexit') {
this.stageChain.stageBackToRoot();
} else {
const { skeleton } = this.props;
this.stageChain.stagePush(skeleton.getStage(target));
}
};
shell?.addEventListener('click', click, false);
this.willDetach.push(() => shell?.removeEventListener('click', click, false));
}
componentWillUnmount() {
if (this.willDetach) {
this.willDetach.forEach((off: () => void) => off());
}
}
render() {
const className = classNames('skeleton-stagebox', this.props.className);
const stage = this.stageChain.getCurrentStage();
const refer = stage?.getRefer();
let contentCurrent = null;
let contentRefer = null;
if (refer) {
contentCurrent = <Stage key={stage.getId()} stage={stage} direction={refer.direction} current />;
contentRefer = <Stage key={refer?.stage?.getId()} stage={refer?.stage} direction={refer.direction} />;
} else {
contentCurrent = <Stage key={stage.getId()} stage={stage} current />;
}
return (
<div
ref={(ref) => {
this.shell = ref;
}}
className={className}
>
{contentRefer}
{contentCurrent}
</div>
);
}
}

View File

@ -0,0 +1,53 @@
import { EventEmitter } from 'events';
import { Stage as StageWidget } from '../../widget/stage';
export default class StageChain {
private emitter: EventEmitter;
private stage: StageWidget;
constructor(stage: StageWidget) {
this.emitter = new EventEmitter();
this.stage = stage;
}
stagePush(stage: StageWidget | null) {
if (!stage) return;
stage.setPrevious(this.stage);
stage.setReferLeft(this.stage);
this.stage = stage;
this.emitter.emit('stagechange');
}
stageBack() {
const stage = this.stage.getPrevious();
if (!stage) return;
stage.setReferRight(this.stage);
this.stage = stage;
this.emitter.emit('stagechange');
}
/**
*
*/
stageBackToRoot() {
let rootStage = this.stage.getPrevious();
while (rootStage && !rootStage.isRoot) {
rootStage = rootStage.getPrevious();
}
if (!rootStage) return;
rootStage.setReferRight(this.stage);
this.stage = rootStage;
this.emitter.emit('stagechange');
}
getCurrentStage() {
return this.stage;
}
onStageChange(func: () => void) {
this.emitter.on('stagechange', func);
return () => {
this.emitter.removeListener('stagechange', func);
};
}
}

View File

@ -0,0 +1,93 @@
// @todo 改成 hooks
import React, { Component } from 'react';
import classNames from 'classnames';
import Icons from '@ali/ve-icons';
import { Stage as StageWidget } from '../../widget/stage';
export const StageDefaultProps = {
current: false,
};
export type StageProps = typeof StageDefaultProps & {
stage?: StageWidget;
current: boolean;
direction?: string;
};
export default class Stage extends Component<StageProps> {
static defaultProps = StageDefaultProps;
private timer: number;
private additionClassName: string | null;
private shell: any;
componentDidMount() {
this.doSkate();
}
componentDidUpdate() {
this.doSkate();
}
componentWillUnmount() {
window.clearTimeout(this.timer);
}
doSkate() {
window.clearTimeout(this.timer);
if (this.additionClassName) {
this.timer = window.setTimeout(() => {
const elem = this.shell;
if (elem) {
if (this.props.current) {
elem.classList.remove(this.additionClassName);
} else {
elem.classList.add(this.additionClassName);
}
this.additionClassName = null;
}
}, 15);
}
}
render() {
const { stage, current, direction } = this.props;
const content = stage?.getContent();
if (current) {
if (direction) {
this.additionClassName = `skeleton-stagebox-stagein-${direction}`;
}
} else if (direction) {
this.additionClassName = `skeleton-stagebox-stageout-${direction}`;
}
const className = classNames(
'skeleton-stagebox-stage',
{
'skeleton-stagebox-refer': !current,
},
this.additionClassName,
);
const stageBacker = stage?.hasBack() ? (
<div className="skeleton-stagebox-stagebacker">
<Icons name="arrow" className="skeleton-stagebox-stage-arrow" size="medium" data-stage-target="stageback" />
<span className="skeleton-stagebox-stage-title">{stage.title}</span>
<Icons name="exit" className="skeleton-stagebox-stage-exit" size="medium" data-stage-target="stageexit" />
</div>
) : null;
return (
<div
ref={(ref) => {
this.shell = ref;
}}
className={className}
>
{stageBacker}
<div className="skeleton-stagebox-stage-content">{content}</div>
</div>
);
}
}

View File

@ -0,0 +1,8 @@
.lc-widget-view-container {
height: 100%;
width: 100%;
&.hidden {
display: none;
}
}

View File

@ -2,13 +2,15 @@ import { Component, ReactElement } from 'react';
import { Icon } from '@alifd/next';
import classNames from 'classnames';
import { Title, observer, Tip, globalContext, Editor } from '@ali/lowcode-editor-core';
import { DockProps } from '../types';
import PanelDock from '../widget/panel-dock';
import { composeTitle } from '../widget/utils';
import WidgetContainer from '../widget/widget-container';
import Panel from '../widget/panel';
import { IWidget } from '../widget/widget';
import { SkeletonEvents } from '../skeleton';
import { DockProps } from '../../types';
import PanelDock from '../../widget/panel-dock';
import { composeTitle } from '../../widget/utils';
import WidgetContainer from '../../widget/widget-container';
import Panel from '../../widget/panel';
import { IWidget } from '../../widget/widget';
import { SkeletonEvents } from '../../skeleton';
import './index.less';
export function DockView({ title, icon, description, size, className, onClick }: DockProps) {
return (

View File

@ -0,0 +1,11 @@
import { SVGIcon, IconProps } from "@ali/lowcode-utils";
export function IconFix(props: IconProps) {
return (
<SVGIcon viewBox="0 0 1024 1024" {...props}>
<path d="M750.848 28.928l245.248 242.944a66.048 66.048 0 1 1-93.184 93.184l-25.6-19.456-249.6 353.792 78.336 78.336a66.048 66.048 0 0 1-93.184 92.672l-460.8-464.64a66.048 66.048 0 0 1 93.184-93.184l76.8 78.336 354.048-249.856-18.176-18.944a66.048 66.048 0 1 1 93.184-93.184zM380.672 732.416l-91.904-90.88c-74.24 89.6-191.488 219.904-212.736 247.04a419.84 419.84 0 0 0-70.656 128 419.84 419.84 0 0 0 128-70.144c27.136-21.248 157.44-138.496 246.528-214.016z"></path>
</SVGIcon>
);
}
IconFix.displayName = 'Fix';

View File

@ -0,0 +1,12 @@
import { SVGIcon, IconProps } from "@ali/lowcode-utils";
export function IconFloat(props: IconProps) {
return (
<SVGIcon viewBox="0 0 1024 1024" {...props}>
<path d="M160.256 816.64C116.224 872.448 102.4 921.6 102.4 921.6s49.152-13.824 104.96-57.856c22.016-17.408 128-112.64 200.704-174.08l-73.728-73.728c-61.44 72.704-157.184 178.688-174.08 200.704zM648.704 209.408L442.368 355.328l226.304 226.304 145.92-206.336 15.872 15.872c20.992 20.992 54.784 20.992 75.776 0s20.992-54.784 0-75.776l-197.12-197.12c-20.992-20.992-54.784-20.992-75.776 0-20.992 20.992-20.992 54.784 0 75.776l15.36 15.36zM247.808 334.848c-9.728 2.048-18.944 6.656-26.624 14.336-20.992 20.992-20.992 54.784 0 75.776l377.856 377.856c20.992 20.992 54.784 20.992 75.776 0 7.68-7.68 12.288-16.896 14.336-26.624L247.808 334.848z"></path>
<path d="M840.704 879.104c-9.728 0-19.456-3.584-27.136-11.264L155.648 210.432c-14.848-14.848-14.848-39.424 0-54.272 14.848-14.848 39.424-14.848 54.272 0L867.84 814.08c14.848 14.848 14.848 39.424 0 54.272-7.168 7.168-16.896 10.752-27.136 10.752z"></path>
</SVGIcon>
);
}
IconFloat.displayName = 'Float';

View File

@ -4,5 +4,3 @@ export * from './types';
export * from './components/settings';
export * from './components/field';
export * from './context';
import './register-defaults';

View File

@ -6,35 +6,67 @@ import Area from '../area';
import { PanelConfig } from '../types';
import Panel from '../widget/panel';
import { Designer } from '@ali/lowcode-designer';
import { IconFloat } from '../icons/float';
@observer
export default class LeftFixedPane extends Component<{ area: Area<PanelConfig, Panel> }> {
shouldComponentUpdate() {
return false;
}
componentDidUpdate() {
// FIXME: dirty fix, need deep think
this.props.area.skeleton.editor.get(Designer)?.touchOffsetObserver();
}
// 取消固定
setFloat() {
const { area } = this.props;
const { current } = area;
if (!current) {
return;
}
area.skeleton.leftFixedArea.remove(current);
area.skeleton.leftFloatArea.add(current);
area.skeleton.leftFloatArea.container.active(current);
}
render() {
const { area } = this.props;
const hideTitleBar = area.current?.config.props?.hideTitleBar;
const width = area.current?.config.props?.width;
const style = width
? {
width,
}
: undefined;
return (
<div
className={classNames('lc-left-fixed-pane', {
'lc-area-visible': area.visible,
})}
style={style}
>
{!hideTitleBar && (
<Button
text
className="lc-pane-close"
onClick={() => {
area.setVisible(false);
}}
>
<Icon type="close" />
</Button>
<Fragment>
<Button
text
className="lc-pane-icon-float"
onClick={this.setFloat.bind(this)}
>
<IconFloat />
</Button>
<Button
text
className="lc-pane-icon-close"
onClick={() => {
area.setVisible(false);
}}
>
<Icon type="close" />
</Button>
</Fragment>
)}
<Contents area={area} />
</div>

View File

@ -2,6 +2,7 @@ import { Component, Fragment } from 'react';
import classNames from 'classnames';
import { observer, Focusable, focusTracker } from '@ali/lowcode-editor-core';
import { Button, Icon } from '@alifd/next';
import { IconFix } from '../icons/fix';
import Area from '../area';
import Panel from '../widget/panel';
@ -76,6 +77,18 @@ export default class LeftFloatPane extends Component<{ area: Area<any, Panel> }>
this.dispose?.();
}
// 固定
setFixed() {
const { area } = this.props;
const { current } = area;
if (!current) {
return;
}
area.skeleton.leftFloatArea.remove(current);
area.skeleton.leftFixedArea.add(current);
area.skeleton.leftFixedArea.container.active(current);
}
render() {
const { area } = this.props;
const width = area.current?.config.props?.width;
@ -93,15 +106,24 @@ export default class LeftFloatPane extends Component<{ area: Area<any, Panel> }>
>
{
!hideTitleBar && (
<Button
text
className="lc-pane-close"
onClick={() => {
area.setVisible(false);
}}
>
<Icon type="close" />
</Button>
<Fragment>
<Button
text
className="lc-pane-icon-fix"
onClick={this.setFixed.bind(this)}
>
<IconFix />
</Button>
<Button
text
className="lc-pane-icon-close"
onClick={() => {
area.setVisible(false);
}}
>
<Icon type="close" />
</Button>
</Fragment>
)
}
<Contents area={area} />

View File

@ -139,10 +139,14 @@ body {
height: var(--top-area-height);
background-color: var(--color-pane-background);
width: 100%;
display: flex;
display: none;
margin-bottom: 2px;
padding: 8px 12px 8px 16px;
&.lc-area-visible {
display: flex;
}
.lc-top-area-left {
display: flex;
align-items: center;
@ -171,6 +175,65 @@ body {
display: flex;
min-height: 0;
position: relative;
.lc-tabs-title {
width: 100%;
height: 32px;
position: relative;
display: center;
display: flex;
justify-content: center;
align-items: center;
// background: rgba(31,56,88,0.04);
border-bottom: 1px solid #EDEFF3;
.lc-tab-title{
flex: 1;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 2px solid transparent;
cursor: pointer;
font-size: 12px;
&.actived {
color: #0079F2;
border-bottom-color: #0079F2;
}
}
}
.lc-tabs-content {
position: absolute;
top: 32px;
bottom: 0;
left: 0;
right: 0;
}
.lc-pane-icon-close {
position: absolute;
right: 16px;
top: 14px;
height: auto;
z-index: 2;
.next-icon{
line-height: 1;
color: rgba(0,0,0,0.6);
}
}
.lc-pane-icon-fix, .lc-pane-icon-float{
position: absolute;
right: 38px;
top: 14px;
height: auto;
z-index: 2;
svg {
vertical-align: middle;
color: rgba(0,0,0,0.6);
}
}
.lc-left-float-pane {
position: absolute;
top: 0;
@ -186,48 +249,6 @@ body {
&.lc-area-visible {
display: block;
}
.lc-pane-close{
position: absolute;
right: 16px;
top: 16px;
height: auto;
z-index: 2;
.next-icon{
line-height: 1;
}
}
.lc-tabs-title {
width: 100%;
height: 32px;
position: relative;
display: center;
display: flex;
justify-content: center;
align-items: center;
// background: rgba(31,56,88,0.04);
border-bottom: 1px solid #EDEFF3;
.lc-tab-title{
flex: 1;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 2px solid transparent;
cursor: pointer;
font-size: 12px;
&.actived {
color: #0079F2;
border-bottom-color: #0079F2;
}
}
}
.lc-tabs-content {
position: absolute;
top: 32px;
bottom: 0;
left: 0;
right: 0;
}
}
.lc-left-area {
height: 100%;
@ -289,16 +310,6 @@ body {
&.lc-area-visible {
display: block;
}
.lc-pane-close {
position: absolute;
right: 16px;
top: 16px;
height: auto;
z-index: 2;
.next-icon {
line-height: 1;
}
}
}
.lc-left-area.lc-area-visible ~ .lc-left-fixed-pane {
margin-left: 1px;

View File

@ -20,7 +20,7 @@ import PanelDock from './widget/panel-dock';
import Dock from './widget/dock';
import { Stage, StageConfig } from './widget/stage';
import { isValidElement } from 'react';
import { isPlainObject } from '@ali/lowcode-utils';
import { isPlainObject, uniqueId } from '@ali/lowcode-utils';
import { Divider } from '@alifd/next';
import { EditorConfig, PluginClassSet } from '@ali/lowcode-types';
@ -248,6 +248,19 @@ export class Skeleton {
return this.panels.get(name);
}
getStage(name: string) {
return this.stages.container.get(name);
}
createStage(config: any) {
const stage = this.add({
name: uniqueId('stage'),
area: 'stages',
...config,
});
return stage?.getName();
}
createContainer(
name: string,
handle: (item: any) => any,

View File

@ -136,15 +136,21 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
});
*/
const stylesGroup: FieldConfig[] = [];
let advanceGroup: FieldConfig[] = [];
const advanceGroup: FieldConfig[] = [];
if (propsGroup) {
let l = propsGroup.length;
while (l-- > 0) {
const item = propsGroup[l];
if (item.type === 'group' && (item.title === '高级' || item.title?.label === '高级')) {
advanceGroup = item.items || [];
propsGroup.splice(l, 1);
} else if (item.name === '__style__' || item.name === 'containerStyle' || item.name === 'pageStyle') {
// if (item.type === 'group' && (item.title === '高级' || item.title?.label === '高级')) {
// advanceGroup = item.items || [];
// propsGroup.splice(l, 1);
// }
if (
item.name === '__style__' ||
item.name === 'style' ||
item.name === 'containerStyle' ||
item.name === 'pageStyle'
) {
propsGroup.splice(l, 1);
stylesGroup.push(item);
if (item.extraProps?.defaultCollapsed && item.name !== 'containerStyle') {
@ -229,6 +235,9 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
componentName: 'VariableSetter',
},
],
extraProps: {
display: 'block',
},
});
}
if (supports.loop !== false) {
@ -285,8 +294,30 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
],
},
],
extraProps: {
display: 'accordion',
},
});
}
advanceGroup.push({
name: 'key',
title: {
label: '渲染唯一标识key',
tip: '搭配「条件渲染」或「循环渲染」时使用,和 react 组件中的 key 原理相同,点击查看帮助',
docUrl: 'https://yuque.antfin-inc.com/legao/help3.0/ca5in7',
},
setter: [
{
componentName: 'StringSetter',
},
{
componentName: 'VariableSetter',
},
],
extraProps: {
display: 'block',
},
});
}
if (advanceGroup.length > 0) {
combined.push({

View File

@ -39,6 +39,7 @@ function propTypeToSetter(propType: PropType): SetterType {
} else {
typeName = 'string';
}
debugger;
// TODO: use mixinSetter wrapper
switch (typeName) {
case 'string':
@ -178,6 +179,7 @@ function propTypeToSetter(propType: PropType): SetterType {
return {
componentName: 'MixedSetter',
isRequired,
props: {},
};
}

View File

@ -1,3 +1,4 @@
import { uniqueId } from '@ali/lowcode-utils';
import Widget from './widget';
import { Skeleton } from '../skeleton';
import { WidgetConfig } from '../types';

View File

@ -3,6 +3,86 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.39"></a>
## [0.8.39](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.38...@ali/lowcode-plugin-components-pane@0.8.39) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.38"></a>
## [0.8.38](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.36...@ali/lowcode-plugin-components-pane@0.8.38) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.37"></a>
## [0.8.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.36...@ali/lowcode-plugin-components-pane@0.8.37) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.36"></a>
## [0.8.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.35...@ali/lowcode-plugin-components-pane@0.8.36) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.35"></a>
## [0.8.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.34...@ali/lowcode-plugin-components-pane@0.8.35) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.34"></a>
## [0.8.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.33...@ali/lowcode-plugin-components-pane@0.8.34) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.33"></a>
## [0.8.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.32...@ali/lowcode-plugin-components-pane@0.8.33) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.32"></a>
## [0.8.32](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.31...@ali/lowcode-plugin-components-pane@0.8.32) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.31"></a>
## [0.8.31](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.30...@ali/lowcode-plugin-components-pane@0.8.31) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.30"></a>
## [0.8.30](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.29...@ali/lowcode-plugin-components-pane@0.8.30) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-components-pane
<a name="0.8.29"></a>
## [0.8.29](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-components-pane@0.8.28...@ali/lowcode-plugin-components-pane@0.8.29) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-plugin-components-pane",
"version": "0.8.29",
"version": "0.8.39",
"description": "alibaba lowcode editor component-list plugin",
"files": [
"es/",
@ -20,9 +20,9 @@
],
"author": "xiayang.xy",
"dependencies": {
"@ali/lowcode-designer": "^0.9.27",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-designer": "^0.9.37",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-types": "^0.8.14",
"@ali/ve-component-list": "^1.1.1",
"@alifd/next": "^1.19.19",
"react": "^16.8.1"

View File

@ -3,6 +3,92 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.9.37"></a>
## [0.9.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.36...@ali/lowcode-plugin-designer@0.9.37) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.36"></a>
## [0.9.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.34...@ali/lowcode-plugin-designer@0.9.36) (2020-08-04)
### Bug Fixes
* plugin-desiger 支持从 editor 获取 device 参数 ([43bc29b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/43bc29b))
<a name="0.9.35"></a>
## [0.9.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.34...@ali/lowcode-plugin-designer@0.9.35) (2020-08-04)
### Bug Fixes
* plugin-desiger 支持从 editor 获取 device 参数 ([43bc29b](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/43bc29b))
<a name="0.9.34"></a>
## [0.9.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.33...@ali/lowcode-plugin-designer@0.9.34) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.33"></a>
## [0.9.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.32...@ali/lowcode-plugin-designer@0.9.33) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.32"></a>
## [0.9.32](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.31...@ali/lowcode-plugin-designer@0.9.32) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.31"></a>
## [0.9.31](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.30...@ali/lowcode-plugin-designer@0.9.31) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.30"></a>
## [0.9.30](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.29...@ali/lowcode-plugin-designer@0.9.30) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.29"></a>
## [0.9.29](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.28...@ali/lowcode-plugin-designer@0.9.29) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.28"></a>
## [0.9.28](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.27...@ali/lowcode-plugin-designer@0.9.28) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-designer
<a name="0.9.27"></a>
## [0.9.27](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-designer@0.9.26...@ali/lowcode-plugin-designer@0.9.27) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-plugin-designer",
"version": "0.9.27",
"version": "0.9.37",
"description": "alibaba lowcode editor designer plugin",
"files": [
"es",
@ -20,8 +20,8 @@
],
"author": "xiayang.xy",
"dependencies": {
"@ali/lowcode-designer": "^0.9.27",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-designer": "^0.9.37",
"@ali/lowcode-editor-core": "^0.8.28",
"react": "^16.8.1",
"react-dom": "^16.8.1"
},

View File

@ -11,6 +11,8 @@ interface DesignerPluginState {
componentMetadatas?: any[] | null;
library?: any[] | null;
extraEnvironment?: any[] | null;
renderEnv?: string;
device?: string;
}
export default class DesignerPlugin extends PureComponent<PluginProps, DesignerPluginState> {
@ -20,6 +22,8 @@ export default class DesignerPlugin extends PureComponent<PluginProps, DesignerP
componentMetadatas: null,
library: null,
extraEnvironment: null,
renderEnv: 'default',
device: 'default',
};
private _mounted = true;
@ -31,18 +35,26 @@ export default class DesignerPlugin extends PureComponent<PluginProps, DesignerP
private async setupAssets() {
const { editor } = this.props;
const assets = await editor.onceGot('assets');
if (!this._mounted) {
return;
try {
const assets = await editor.onceGot('assets');
const renderEnv = await editor.get('renderEnv');
const device = await editor.get('device');
if (!this._mounted) {
return;
}
const { components, packages, extraEnvironment } = assets;
const state = {
componentMetadatas: components || [],
library: packages || [],
extraEnvironment,
renderEnv,
device,
};
this.setState(state);
} catch (e) {
console.log(e);
}
const { components, packages, extraEnvironment } = assets;
const state = {
componentMetadatas: components || [],
library: packages || [],
extraEnvironment,
};
this.setState(state);
};
}
componentWillUnmount() {
this._mounted = false;
@ -59,7 +71,7 @@ export default class DesignerPlugin extends PureComponent<PluginProps, DesignerP
render(): React.ReactNode {
const { editor } = this.props;
const { componentMetadatas, library, extraEnvironment } = this.state;
const { componentMetadatas, library, extraEnvironment, renderEnv, device } = this.state;
if (!library || !componentMetadatas) {
// TODO: use a Loading
@ -76,6 +88,8 @@ export default class DesignerPlugin extends PureComponent<PluginProps, DesignerP
simulatorProps={{
library,
extraEnvironment,
renderEnv,
device,
}}
/>
);

View File

@ -3,6 +3,62 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.27"></a>
## [0.8.27](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.26...@ali/lowcode-plugin-event-bind-dialog@0.8.27) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.26"></a>
## [0.8.26](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.24...@ali/lowcode-plugin-event-bind-dialog@0.8.26) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.25"></a>
## [0.8.25](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.24...@ali/lowcode-plugin-event-bind-dialog@0.8.25) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.24"></a>
## [0.8.24](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.23...@ali/lowcode-plugin-event-bind-dialog@0.8.24) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.23"></a>
## [0.8.23](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.22...@ali/lowcode-plugin-event-bind-dialog@0.8.23) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.22"></a>
## [0.8.22](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.21...@ali/lowcode-plugin-event-bind-dialog@0.8.22) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.21"></a>
## [0.8.21](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.20...@ali/lowcode-plugin-event-bind-dialog@0.8.21) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-event-bind-dialog
<a name="0.8.20"></a>
## [0.8.20](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-event-bind-dialog@0.8.19...@ali/lowcode-plugin-event-bind-dialog@0.8.20) (2020-07-13)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-plugin-event-bind-dialog",
"version": "0.8.20",
"version": "0.8.27",
"description": "alibaba lowcode editor event bind dialog plugin",
"files": [
"es",
@ -19,8 +19,8 @@
],
"author": "zude.hzd",
"dependencies": {
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-types": "^0.8.14",
"@alifd/next": "^1.19.16",
"react": "^16.8.1",
"react-dom": "^16.8.1"

View File

@ -3,6 +3,103 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.43"></a>
## [0.8.43](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.42...@ali/lowcode-plugin-outline-pane@0.8.43) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.42"></a>
## [0.8.42](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.40...@ali/lowcode-plugin-outline-pane@0.8.42) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.41"></a>
## [0.8.41](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.40...@ali/lowcode-plugin-outline-pane@0.8.41) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.40"></a>
## [0.8.40](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.39...@ali/lowcode-plugin-outline-pane@0.8.40) (2020-07-29)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.39"></a>
## [0.8.39](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.38...@ali/lowcode-plugin-outline-pane@0.8.39) (2020-07-28)
### Bug Fixes
* 🐛 getPrototype is undefined ([95b3409](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/95b3409))
<a name="0.8.38"></a>
## [0.8.38](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.37...@ali/lowcode-plugin-outline-pane@0.8.38) (2020-07-23)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.37"></a>
## [0.8.37](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.36...@ali/lowcode-plugin-outline-pane@0.8.37) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.36"></a>
## [0.8.36](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.35...@ali/lowcode-plugin-outline-pane@0.8.36) (2020-07-21)
### Bug Fixes
* 修复导入的组件拖入画布报错 ([caf9915](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/caf9915))
<a name="0.8.35"></a>
## [0.8.35](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.34...@ali/lowcode-plugin-outline-pane@0.8.35) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-outline-pane
<a name="0.8.34"></a>
## [0.8.34](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.33...@ali/lowcode-plugin-outline-pane@0.8.34) (2020-07-21)
### Bug Fixes
* modal node locate ([9a72dd7](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/9a72dd7))
* 大纲树节点显示隐藏埋点 ([e91ab1f](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/e91ab1f))
* 没有 modal node 时不显示模态视图 ([555824c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/555824c))
### Features
* 大纲树展开折叠埋点 ([d9828f2](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/d9828f2))
* 大纲树支持模态视图 ([3785e1c](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/commit/3785e1c))
<a name="0.8.33"></a>
## [0.8.33](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-outline-pane@0.8.32...@ali/lowcode-plugin-outline-pane@0.8.33) (2020-07-14)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-plugin-outline-pane",
"version": "0.8.33",
"version": "0.8.43",
"description": "Outline pane for Ali lowCode engine",
"files": [
"es",
@ -14,10 +14,10 @@
"test:snapshot": "ava --update-snapshots"
},
"dependencies": {
"@ali/lowcode-designer": "^0.9.27",
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12",
"@ali/lowcode-designer": "^0.9.37",
"@ali/lowcode-editor-core": "^0.8.28",
"@ali/lowcode-types": "^0.8.14",
"@ali/lowcode-utils": "^0.8.16",
"@alifd/next": "^1.19.16",
"classnames": "^2.2.6",
"react": "^16",

View File

@ -0,0 +1,14 @@
import { SVGIcon, IconProps } from '@ali/lowcode-utils';
export function IconRadioActive(props: IconProps) {
return (
<SVGIcon viewBox="0 0 1024 1024" {...props}>
<path d="M512 1024A512 512 0 1 1 512 0a512 512 0 0 1 0 1024z m0-256a256 256 0 1 0 0-512 256 256 0 0 0 0 512z"></path>
</SVGIcon>
);
}
IconRadioActive.displayName = 'IconRadioActive';

View File

@ -0,0 +1,14 @@
import { SVGIcon, IconProps } from '@ali/lowcode-utils';
export function IconRadio(props: IconProps) {
return (
<SVGIcon viewBox="0 0 1024 1024" {...props}>
<path d="M512 1024A512 512 0 1 1 512 0a512 512 0 0 1 0 1024z m0-64A448 448 0 1 0 512 64a448 448 0 0 0 0 896z"></path>
</SVGIcon>
);
}
IconRadio.displayName = 'IconRadio';

View File

@ -134,6 +134,20 @@ export class OutlineMain implements ISensor, ITreeBoard, IScrollable {
const pos = getPosFromEvent(e, this._shell);
const irect = this.getInsertionRect();
const originLoc = document.dropLocation;
if (e.dragObject.type === 'node' && e.dragObject.nodes[0].getPrototype().isModal()) {
return designer.createLocation({
target: document.rootNode,
detail: {
type: LocationDetailType.Children,
index: 0,
valid: true,
},
source: this.id,
event: e,
});
}
if (originLoc && ((pos && pos === 'unchanged') || (irect && globalY >= irect.top && globalY <= irect.bottom))) {
const loc = originLoc.clone(e);
const indented = this.indentTrack.getIndentParent(originLoc, loc);

View File

@ -72,7 +72,7 @@ export default class TreeNode {
@computed get hidden(): boolean {
const cv = this.node.isConditionalVisible();
if (cv == null) {
return this.node.getExtraProp('hidden', false)?.getValue() === true;
return !this.node.getVisible();
}
return !cv;
}
@ -81,11 +81,7 @@ export default class TreeNode {
if (this.node.conditionGroup) {
return;
}
if (flag) {
this.node.getExtraProp('hidden', true)?.setValue(true);
} else {
this.node.getExtraProp('hidden', false)?.remove();
}
this.node.setVisible(!flag);
}
@computed get locked(): boolean {

View File

@ -0,0 +1,92 @@
import { Component } from 'react';
import classNames from 'classnames';
import { observer } from '@ali/lowcode-editor-core';
import TreeNode from '../tree-node';
import TreeTitle from './tree-title';
import TreeBranches from './tree-branches';
import { ModalNodesManager } from '@ali/lowcode-designer';
import { IconEyeClose } from '../icons/eye-close';
@observer
class ModalTreeNodeView extends Component<{ treeNode: TreeNode }> {
private modalNodesManager: ModalNodesManager;
constructor(props: any) {
super(props);
// 模态管理对象
this.modalNodesManager = props.treeNode.document.modalNodesManager;
}
shouldComponentUpdate() {
return false;
}
hideAllNodes() {
this.modalNodesManager.hideModalNodes();
}
render() {
const { treeNode } = this.props;
const modalNodes = treeNode.children?.filter((item) => {
return item.node.getPrototype()?.isModal();
});
if (!modalNodes || modalNodes.length === 0) {
return null;
}
const hasVisibleModalNode = !!this.modalNodesManager.getVisibleModalNode();
return (
<div className="tree-node-modal">
<div className="tree-node-modal-title">
<span></span>
<div className="tree-node-modal-title-visible-icon"
onClick={this.hideAllNodes.bind(this)}>
{hasVisibleModalNode ? <IconEyeClose /> : null}
</div>
</div>
<div className="tree-pane-modal-content">
<TreeBranches treeNode={treeNode} isModal={true}/>
</div>
</div>
);
}
}
@observer
export default class RootTreeNodeView extends Component<{ treeNode: TreeNode }> {
shouldComponentUpdate() {
return false;
}
render() {
const { treeNode } = this.props;
const className = classNames('tree-node', {
// 是否展开
expanded: treeNode.expanded,
// 是否悬停中
detecting: treeNode.detecting,
// 是否选中的
selected: treeNode.selected,
// 是否隐藏的
hidden: treeNode.hidden,
// 是否忽略的
// ignored: treeNode.ignored,
// 是否锁定的
locked: treeNode.locked,
// 是否投放响应
dropping: treeNode.dropDetail?.index != null,
'is-root': treeNode.isRoot(),
'condition-flow': treeNode.node.conditionGroup != null,
highlight: treeNode.isFocusingNode(),
});
return (
<div className={className} data-id={treeNode.id}>
<TreeTitle treeNode={treeNode} />
<ModalTreeNodeView treeNode={treeNode} />
<TreeBranches treeNode={treeNode}/>
</div>
);
}
}

View File

@ -21,6 +21,46 @@
margin-bottom: @treeNodeHeight;
user-select: none;
.tree-node-modal {
margin: 5px;
border: 1px solid rgba(31, 56, 88, 0.2);
border-radius: 3px;
box-shadow: 0 1px 4px 0 rgba(31, 56, 88, 0.15);
.tree-node-modal-title {
position: relative;
background: rgba(31, 56, 88, 0.04);
padding: 0 10px;
height: 32px;
line-height: 32px;
border-bottom: 1px solid rgba(31, 56, 88, 0.2);
.tree-node-modal-title-visible-icon {
position: absolute;
top: 4px;
right: 12px;
cursor: pointer;
}
}
.tree-pane-modal-content {
& > .tree-node-branches::before {
display: none;
}
}
.tree-node-modal-radio, .tree-node-modal-radio-active {
margin-right: 4px;
opacity: 0.8;
position: absolute;
top: 7px;
left: 6px;
}
.tree-node-modal-radio-active {
color: #006cff;
}
}
.tree-node-branches::before {
position: absolute;
display: block;

View File

@ -9,13 +9,14 @@ import { intlNode } from '../locale';
@observer
export default class TreeBranches extends Component<{
treeNode: TreeNode;
isModal?: boolean;
}> {
shouldComponentUpdate() {
return false;
}
render() {
const treeNode = this.props.treeNode;
const { treeNode, isModal } = this.props;
const { expanded } = treeNode;
if (!expanded) {
@ -24,8 +25,10 @@ export default class TreeBranches extends Component<{
return (
<div className="tree-node-branches">
<TreeNodeSlots treeNode={treeNode} />
<TreeNodeChildren treeNode={treeNode} />
{
!isModal && <TreeNodeSlots treeNode={treeNode}/>
}
<TreeNodeChildren treeNode={treeNode} isModal={isModal || false}/>
</div>
);
}
@ -34,12 +37,13 @@ export default class TreeBranches extends Component<{
@observer
class TreeNodeChildren extends Component<{
treeNode: TreeNode;
isModal?: boolean;
}> {
shouldComponentUpdate() {
return false;
}
render() {
const { treeNode } = this.props;
const { treeNode, isModal } = this.props;
let children: any = [];
let groupContents: any[] = [];
let currentGrp: ExclusiveGroup;
@ -67,6 +71,10 @@ class TreeNodeChildren extends Component<{
/>
);
treeNode.children?.forEach((child, index) => {
const childIsModal = child.node.getPrototype()?.isModal() || false;
if (isModal != childIsModal) {
return;
}
const { conditionGroup } = child.node;
if (conditionGroup !== currentGrp) {
endGroup();
@ -81,12 +89,12 @@ class TreeNodeChildren extends Component<{
children.push(insertion);
}
}
groupContents.push(<TreeNodeView key={child.id} treeNode={child} />);
groupContents.push(<TreeNodeView key={child.id} treeNode={child} isModal={isModal}/>);
} else {
if (index === dropIndex) {
children.push(insertion);
}
children.push(<TreeNodeView key={child.id} treeNode={child} />);
children.push(<TreeNodeView key={child.id} treeNode={child} isModal={isModal}/>);
}
});
endGroup();

View File

@ -6,13 +6,16 @@ import TreeTitle from './tree-title';
import TreeBranches from './tree-branches';
@observer
export default class TreeNodeView extends Component<{ treeNode: TreeNode }> {
export default class TreeNodeView extends Component<{
treeNode: TreeNode;
isModal?: boolean;
}> {
shouldComponentUpdate() {
return false;
}
render() {
const { treeNode } = this.props;
const { treeNode, isModal } = this.props;
const className = classNames('tree-node', {
// 是否展开
expanded: treeNode.expanded,
@ -35,8 +38,8 @@ export default class TreeNodeView extends Component<{ treeNode: TreeNode }> {
return (
<div className={className} data-id={treeNode.id}>
<TreeTitle treeNode={treeNode} />
<TreeBranches treeNode={treeNode} />
<TreeTitle treeNode={treeNode} isModal={isModal}/>
<TreeBranches treeNode={treeNode} isModal={false}/>
</div>
);
}

View File

@ -10,11 +10,26 @@ import TreeNode from '../tree-node';
import { IconEye } from '../icons/eye';
import { IconCond } from '../icons/cond';
import { IconLoop } from '../icons/loop';
import { IconRadioActive } from '../icons/radio-active';
import { IconRadio } from '../icons/radio';
import { createIcon } from '@ali/lowcode-utils';
function emitOutlineEvent(type: string, treeNode: TreeNode, rest?: object) {
const editor = globalContext.get(Editor);
const node = treeNode?.node;
const npm = node?.componentMeta?.npm;
const selected =
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') || node?.componentMeta?.componentName || '';
editor?.emit(`outlinePane.${type}`, {
selected,
...rest,
});
}
@observer
export default class TreeTitle extends Component<{
treeNode: TreeNode;
isModal?: boolean;
}> {
state: {
editing: boolean;
@ -37,7 +52,9 @@ export default class TreeTitle extends Component<{
private saveEdit = (e: FocusEvent<HTMLInputElement> | KeyboardEvent<HTMLInputElement>) => {
const { treeNode } = this.props;
treeNode.setTitleLabel((e.target as HTMLInputElement).value || '');
const value = (e.target as HTMLInputElement).value || '';
treeNode.setTitleLabel(value);
emitOutlineEvent('rename', treeNode, { value });
this.cancelEdit();
};
@ -62,7 +79,7 @@ export default class TreeTitle extends Component<{
};
render() {
const { treeNode } = this.props;
const { treeNode, isModal } = this.props;
const { editing } = this.state;
const isCNode = !treeNode.isRoot();
const { node } = treeNode;
@ -72,7 +89,7 @@ export default class TreeTitle extends Component<{
const depth = treeNode.depth;
const indent = depth * 12;
style = {
paddingLeft: indent,
paddingLeft: indent + (isModal ? 12 : 0),
marginLeft: -indent,
};
}
@ -84,8 +101,31 @@ export default class TreeTitle extends Component<{
})}
style={style}
data-id={treeNode.id}
onClick={node.conditionGroup ? () => node.setConditionalVisible() : undefined}
onClick={() => {
if (isModal) {
node.document.modalNodesManager.setVisible(node);
return;
}
if (node.conditionGroup) {
node.setConditionalVisible();
return;
}
}}
>
{isModal && node.getVisible() && (
<div onClick={() => {
node.document.modalNodesManager.setInvisible(node);
}}>
<IconRadioActive className="tree-node-modal-radio-active"/>
</div>
)}
{isModal && !node.getVisible() && (
<div onClick={() => {
node.document.modalNodesManager.setVisible(node);
}}>
<IconRadio className="tree-node-modal-radio"/>
</div>
)}
{isCNode && <ExpandBtn treeNode={treeNode} />}
<div className="tree-node-icon">{createIcon(treeNode.icon)}</div>
<div className="tree-node-title-label" onDoubleClick={isNodeParent ? this.enableEdit : undefined}>
@ -123,7 +163,7 @@ export default class TreeTitle extends Component<{
</Fragment>
)}
</div>
{isCNode && isNodeParent && <HideBtn treeNode={treeNode} />}
{isCNode && isNodeParent && !isModal && <HideBtn treeNode={treeNode} />}
{/*isCNode && isNodeParent && <LockBtn treeNode={treeNode} />*/}
</div>
);
@ -164,17 +204,8 @@ class HideBtn extends Component<{ treeNode: TreeNode }> {
className="tree-node-hide-btn"
onClick={(e) => {
e.stopPropagation();
emitOutlineEvent(treeNode.hidden ? 'show' : 'hide', treeNode);
treeNode.setHidden(!treeNode.hidden);
const editor = globalContext.get(Editor);
const node = treeNode?.node;
const npm = node?.componentMeta?.npm;
const selected =
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') ||
node?.componentMeta?.componentName ||
'';
editor?.emit('outlinePane.hide', {
selected,
});
}}
>
{treeNode.hidden ? <IconEyeClose /> : <IconEye />}
@ -201,6 +232,7 @@ class ExpandBtn extends Component<{ treeNode: TreeNode }> {
if (treeNode.expanded) {
e.stopPropagation();
}
emitOutlineEvent(treeNode.expanded ? 'collapse' : 'expand', treeNode);
treeNode.setExpanded(!treeNode.expanded);
}}
>

View File

@ -3,7 +3,7 @@ import { observer, Editor, globalContext } from '@ali/lowcode-editor-core';
import { isRootNode, Node, DragObjectType, isShaken } from '@ali/lowcode-designer';
import { isFormEvent } from '@ali/lowcode-utils';
import { Tree } from '../tree';
import TreeNodeView from './tree-node';
import RootTreeNodeView from './root-tree-node';
function getTreeNodeIdByEvent(e: ReactMouseEvent, stop: Element): null | string {
let target: Element | null = e.target as Element;
@ -155,7 +155,7 @@ export default class TreeView extends Component<{ tree: Tree }> {
onClick={this.onClick}
onMouseLeave={this.onMouseLeave}
>
<TreeNodeView key={root.id} treeNode={root} />
<RootTreeNodeView key={root.id} treeNode={root} />
</div>
);
}

View File

@ -3,6 +3,62 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
<a name="0.8.26"></a>
## [0.8.26](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.25...@ali/lowcode-plugin-sample-logo@0.8.26) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.25"></a>
## [0.8.25](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.23...@ali/lowcode-plugin-sample-logo@0.8.25) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.24"></a>
## [0.8.24](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.23...@ali/lowcode-plugin-sample-logo@0.8.24) (2020-08-04)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.23"></a>
## [0.8.23](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.22...@ali/lowcode-plugin-sample-logo@0.8.23) (2020-07-28)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.22"></a>
## [0.8.22](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.21...@ali/lowcode-plugin-sample-logo@0.8.22) (2020-07-22)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.21"></a>
## [0.8.21](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.20...@ali/lowcode-plugin-sample-logo@0.8.21) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.20"></a>
## [0.8.20](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.19...@ali/lowcode-plugin-sample-logo@0.8.20) (2020-07-21)
**Note:** Version bump only for package @ali/lowcode-plugin-sample-logo
<a name="0.8.19"></a>
## [0.8.19](https://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/compare/@ali/lowcode-plugin-sample-logo@0.8.18...@ali/lowcode-plugin-sample-logo@0.8.19) (2020-07-13)

View File

@ -1,6 +1,6 @@
{
"name": "@ali/lowcode-plugin-sample-logo",
"version": "0.8.19",
"version": "0.8.26",
"description": "alibaba lowcode editor logo plugin",
"files": [
"es/",
@ -20,7 +20,7 @@
],
"author": "xiayang.xy",
"dependencies": {
"@ali/lowcode-editor-core": "^0.8.21",
"@ali/lowcode-editor-core": "^0.8.28",
"react": "^16.8.1"
},
"devDependencies": {

Some files were not shown because too many files have changed in this diff Show More