mirror/sunmao-ui
2
0
Fork 0
mirror of https://github.com/smartxworks/sunmao-ui.git synced 2024-11-27 08:39:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

update examples

Browse Source
This commit is contained in:
Bowen Tan 2022-01-13 18:14:39 +08:00
parent dff5ba60c9
commit 504cdc69e7
6 changed files with 60 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
examples/dialog/dialogInList.json
View File

@ -20,7 +20,7 @@
},
"impl": [
{
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"type": "chakra_ui/v1/hstack",
"properties": {
"spacing": "24px"
@ -28,7 +28,7 @@
"traits": []
},
{
"id": "name",
"id": "{{ $moduleId }}__nameText",
"type": "core/v1/text",
"properties": {
"value": {
@ -41,7 +41,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -49,7 +49,7 @@
]
},
{
"id": "email",
"id": "{{ $moduleId }}__emailText",
"type": "core/v1/text",
"properties": {
"value": {
@ -62,7 +62,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -70,7 +70,7 @@
]
},
{
"id": "deleteButton",
"id": "{{ $moduleId }}__deleteButton",
"type": "chakra_ui/v1/button",
"properties": {
"text": {
@ -106,7 +106,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -114,7 +114,7 @@
]
},
{
"id": "editButton",
"id": "{{ $moduleId }}__editButton",
"type": "chakra_ui/v1/button",
"properties": {
"text": {
@ -150,7 +150,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}

22
examples/list/listModule.json
View File

@ -13,18 +13,18 @@
"properties": {},
"events": ["onEdit"],
"stateMap": {
"value": "input.value"
"value": "{{ $moduleId }}__input.value"
}
},
"impl": [
{
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"type": "chakra_ui/v1/hstack",
"properties": {},
"traits": []
},
{
"id": "text",
"id": "{{ $moduleId }}__text",
"type": "core/v1/text",
"properties": {
"value": {
@ -37,7 +37,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -45,11 +45,11 @@
]
},
{
"id": "inputValueText",
"id": "{{ $moduleId }}__inputValueText",
"type": "core/v1/text",
"properties": {
"value": {
"raw": "**{{ input.value }}**",
"raw": "**{{ {{ $moduleId }}__input.value }}**",
"format": "md"
}
},
@ -58,7 +58,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -66,7 +66,7 @@
]
},
{
"id": "input",
"id": "{{ $moduleId }}__input",
"type": "chakra_ui/v1/input",
"properties": {},
"traits": [
@ -74,7 +74,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -82,7 +82,7 @@
]
},
{
"id": "button",
"id": "{{ $moduleId }}__button",
"type": "chakra_ui/v1/button",
"properties": {
"text": {
@ -114,7 +114,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}

14
examples/module/index.json
View File

@ -18,18 +18,18 @@
},
"events": ["onSubmit"],
"stateMap": {
"value": "input.value"
"value": "{{ $moduleId }}__input.value"
}
},
"impl": [
{
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"type": "chakra_ui/v1/hstack",
"properties": {},
"traits": []
},
{
"id": "input",
"id": "{{ $moduleId }}__input",
"type": "chakra_ui/v1/input",
"properties": {},
"traits": [
@ -37,7 +37,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}
@ -45,11 +45,11 @@
]
},
{
"id": "button",
"id": "{{ $moduleId }}__button",
"type": "chakra_ui/v1/button",
"properties": {
"text": {
"raw": "{{input.value}}",
"raw": "{{{{ $moduleId }}__input.value}}",
"format": "md"
}
},
@ -77,7 +77,7 @@
"type": "core/v1/slot",
"properties": {
"container": {
"id": "hstack",
"id": "{{ $moduleId }}__hstack",
"slot": "content"
}
}

4
packages/editor/__tests__/addModuleId.spec.ts
View File

@ -31,7 +31,7 @@ describe('format to module schema', () => {
type: 'test/v1/child',
properties: {
test: '{{ value.BE_CAREFUL.toFixed(2) }}',
replace: '{{ input1.value }} / {{ BE_CAREFUL.value }}'
add: '{{ input1.value }} / {{ BE_CAREFUL.value }}'
},
traits: [],
@ -49,7 +49,7 @@ describe('format to module schema', () => {
Object {
"id": "{{ $moduleId }}__BE_CAREFUL",
"properties": Object {
"replace": "{{ {{ $moduleId }}__input1.value }} / {{ {{ $moduleId }}__BE_CAREFUL.value }}",
"add": "{{ {{ $moduleId }}__input1.value }} / {{ {{ $moduleId }}__BE_CAREFUL.value }}",
"test": "{{ value.BE_CAREFUL.toFixed(2) }}",
},
"traits": Array [],

1
packages/editor/src/AppStorage.ts
View File

@ -13,7 +13,6 @@ export class AppStorage {
static ModulesLSKey = 'modules';
constructor() {
console.log(this.modules)
makeObservable(this, {
app: observable.shallow,
modules: observable.shallow,

60
packages/editor/src/utils/addModuleId.ts
View File

@ -31,7 +31,7 @@ export function addModuleId(module: Module): Module {
if (ids.includes(val)) {
tree[key] = `${ModuleIdPrefix}${val}`;
} else {
const newField = replaceProperty(val, ids);
const newField = replaceIdsInProperty(val, ids);
tree[key] = newField;
}
} else if (typeof val === 'object') {
@ -45,7 +45,7 @@ export function addModuleId(module: Module): Module {
return module;
}
// remove {{$moduleId}} in moduleSchema
// remove '{{$moduleId}}__' in moduleSchema
export function removeModuleId(module: Module): Module {
function traverse(tree: Record<string, any>) {
for (const key in tree) {
@ -63,7 +63,34 @@ export function removeModuleId(module: Module): Module {
return module;
}
function replaceExp(exp: string, ids: string[]): string | void {
// example: replaceIdsInExp('{{input1.value}} + {{input2.value}}', ids: ['input1']])
function replaceIdsInProperty(property: string, ids: string[]): string {
const expRegExp = new RegExp('{{(.*?)}}', 'g');
const matches = [...property.matchAll(expRegExp)];
if (matches.length === 0) return property;
const expPos: StringPos[] = [];
matches.forEach(match => {
const newExp = replaceIdsInExp(match[1], ids);
if (newExp) {
expPos.push({
// + 2 because of '{{' length is 2
start: match.index! + 2,
end: match.index! + 2 + match[1].length,
replaceStr: newExp,
});
}
});
if (expPos.length === 0) return property;
return expPos.reverse().reduce((result, { start, end, replaceStr }) => {
return result.slice(0, start) + `${replaceStr}` + result.slice(end);
}, property);
}
// example: replaceIdsInExp('input1.value', ids: ['input1']])
function replaceIdsInExp(exp: string, ids: string[]): string | void {
const identifierPos: StringPos[] = [];
simpleWalk((acornLoose as typeof acorn).parse(exp, { ecmaVersion: 2020 }), {
Identifier: node => {
@ -86,29 +113,4 @@ function replaceExp(exp: string, ids: string[]): string | void {
}, exp);
return newExp;
}
function replaceProperty(property: string, ids: string[]): string {
const expRegExp = new RegExp('{{(.*?)}}', 'g');
const matches = [...property.matchAll(expRegExp)];
if (matches.length === 0) return property;
const expPos: StringPos[] = [];
matches.forEach(match => {
const newExp = replaceExp(match[1], ids);
if (newExp) {
expPos.push({
// + 2 because of '{{' length is 2
start: match.index! + 2,
end: match.index! + 2 + match[1].length,
replaceStr: newExp,
});
}
});
if (expPos.length === 0) return property;
return expPos.reverse().reduce((result, { start, end, replaceStr }) => {
return result.slice(0, start) + `${replaceStr}` + result.slice(end);
}, property);
}
}