diff --git a/designer-demo/public/mock/bundle.json b/designer-demo/public/mock/bundle.json
index 2a1d74cc1..6b6620849 100644
--- a/designer-demo/public/mock/bundle.json
+++ b/designer-demo/public/mock/bundle.json
@@ -13010,170 +13010,96 @@
"blocks": [],
"snippets": [
{
- "group": "element-plus",
+ "group": "layout",
+ "label": {
+ "zh_CN": "布局与容器"
+ },
"children": [
{
"name": {
- "zh_CN": "输入框"
- },
- "icon": "input",
- "screenshot": "",
- "snippetName": "ElInput",
- "schema": {}
- },
- {
- "name": {
- "zh_CN": "按钮"
- },
- "icon": "button",
- "screenshot": "",
- "snippetName": "ElButton",
- "schema": {
- "children": [
- {
- "componentName": "Text",
- "props": {
- "text": "按钮文本"
- }
- }
- ]
- }
- },
- {
- "name": {
- "zh_CN": "表单"
+ "zh_CN": "栅格布局"
},
- "icon": "form",
+ "icon": "row",
"screenshot": "",
- "snippetName": "ElForm",
+ "snippetName": "TinyLayout",
"schema": {
+ "componentName": "TinyLayout",
+ "props": {},
"children": [
{
- "componentName": "ElFormItem",
+ "componentName": "TinyRow",
"props": {
- "label": "账号",
- "prop": "account"
+ "style": "padding: 10px;"
},
"children": [
{
- "componentName": "ElInput",
+ "componentName": "TinyCol",
"props": {
- "modelValue": "",
- "placeholder": "请输入账号"
+ "span": 3
+ }
+ },
+ {
+ "componentName": "TinyCol",
+ "props": {
+ "span": 3
+ }
+ },
+ {
+ "componentName": "TinyCol",
+ "props": {
+ "span": 3
+ }
+ },
+ {
+ "componentName": "TinyCol",
+ "props": {
+ "span": 3
}
}
]
},
{
- "componentName": "ElFormItem",
+ "componentName": "TinyRow",
"props": {
- "label": "密码",
- "prop": "password"
+ "style": "padding: 10px;"
},
"children": [
{
- "componentName": "ElInput",
+ "componentName": "TinyCol",
"props": {
- "modelValue": "",
- "placeholder": "请输入密码",
- "type": "password"
+ "span": 3
}
- }
- ]
- },
- {
- "componentName": "ElFormItem",
- "props": {},
- "children": [
+ },
{
- "componentName": "ElButton",
+ "componentName": "TinyCol",
"props": {
- "type": "primary",
- "style": "margin-right: 10px"
- },
- "children": [
- {
- "componentName": "Text",
- "props": {
- "text": "提交"
- }
- }
- ]
+ "span": 3
+ }
},
{
- "componentName": "ElButton",
+ "componentName": "TinyCol",
"props": {
- "type": "primary"
- },
- "children": [
- {
- "componentName": "Text",
- "props": {
- "text": "重置"
- }
- }
- ]
+ "span": 3
+ }
+ },
+ {
+ "componentName": "TinyCol",
+ "props": {
+ "span": 3
+ }
}
]
}
]
}
- },
- {
- "name": {
- "zh_CN": "表格"
- },
- "icon": "grid",
- "screenshot": "",
- "snippetName": "ElTable",
- "schema": {
- "props": {
- "data": [
- {
- "date": "2016-05-03",
- "name": "Tom",
- "address": "No. 189, Grove St, Los Angeles"
- },
- {
- "date": "2016-05-02",
- "name": "Tom",
- "address": "No. 189, Grove St, Los Angeles"
- },
- {
- "date": "2016-05-04",
- "name": "Tom",
- "address": "No. 189, Grove St, Los Angeles"
- },
- {
- "date": "2016-05-01",
- "name": "Tom",
- "address": "No. 189, Grove St, Los Angeles"
- }
- ],
- "columns": [
- {
- "type": "index"
- },
- {
- "label": "Date",
- "prop": "date"
- },
- {
- "label": "Name",
- "prop": "name"
- },
- {
- "label": "Address",
- "prop": "address"
- }
- ]
- }
- }
}
]
},
{
- "group": "html",
+ "group": "basic",
+ "label": {
+ "zh_CN": "基础元素"
+ },
"children": [
{
"name": {
@@ -13221,21 +13147,6 @@
"children": "Heading"
}
},
- {
- "name": {
- "zh_CN": "输入框"
- },
- "icon": "input",
- "screenshot": "",
- "snippetName": "input",
- "schema": {
- "componentName": "input",
- "props": {
- "type": "text",
- "placeholder": "请输入"
- }
- }
- },
{
"name": {
"zh_CN": "视频"
@@ -13255,170 +13166,111 @@
},
{
"name": {
- "zh_CN": "图片"
+ "zh_CN": "按钮"
},
- "icon": "Image",
+ "icon": "button",
"screenshot": "",
- "snippetName": "img",
+ "snippetName": "TinyButton",
"schema": {
- "componentName": "img",
+ "componentName": "TinyButton",
"props": {
- "src": "img/webNova.jpg",
- "width": "200",
- "height": "100"
+ "text": "按钮文案"
}
}
},
{
"name": {
- "zh_CN": "按钮"
+ "zh_CN": "按钮组"
},
- "icon": "button",
+ "icon": "buttons",
+ "snippetName": "TinyButtons",
"screenshot": "",
- "snippetName": "button",
"schema": {
- "componentName": "button",
+ "componentName": "div",
"props": {},
"children": [
{
- "componentName": "Text",
+ "componentName": "TinyButton",
"props": {
- "text": "按钮文案"
+ "text": "提交",
+ "type": "primary",
+ "style": {
+ "margin": "0 5px 0 5px"
+ }
}
- }
- ]
- }
- },
- {
- "name": {
- "zh_CN": "表格"
- },
- "icon": "table",
- "screenshot": "",
- "snippetName": "table",
- "schema": {
- "componentName": "table",
- "props": {
- "border": "1"
- },
- "children": [
+ },
{
- "componentName": "tr",
- "children": [
- {
- "componentName": "td",
- "children": "Month"
- },
- {
- "componentName": "td",
- "children": "Savings"
+ "componentName": "TinyButton",
+ "props": {
+ "text": "重置",
+ "style": {
+ "margin": "0 5px 0 5px"
}
- ]
+ }
},
{
- "componentName": "tr",
- "children": [
- {
- "componentName": "td",
- "children": "January"
- },
- {
- "componentName": "td",
- "children": "100"
- }
- ]
+ "componentName": "TinyButton",
+ "props": {
+ "text": "取消"
+ }
}
]
+ },
+ "configure": {
+ "isContainer": true
}
},
{
"name": {
- "zh_CN": "表单"
+ "zh_CN": "互斥按钮组"
},
- "icon": "form",
+ "icon": "buttons",
+ "snippetName": "TinyButtonGroup",
"screenshot": "",
- "snippetName": "form",
"schema": {
- "componentName": "form",
+ "componentName": "TinyButtonGroup",
"props": {
- "action": "action"
- },
- "children": [
- {
- "componentName": "label",
- "props": {
- "for": "male"
+ "data": [
+ {
+ "text": "Button1",
+ "value": "1"
},
- "children": "male"
- },
- {
- "componentName": "input",
- "props": {
- "type": "text"
- }
- },
- {
- "componentName": "br"
- },
- {
- "componentName": "label",
- "props": {
- "for": "Female"
+ {
+ "text": "Button2",
+ "value": "2"
},
- "children": "Female"
- },
- {
- "componentName": "input",
- "props": {
- "type": "text"
+ {
+ "text": "Button3",
+ "value": "3"
}
- }
- ]
+ ],
+ "modelValue": "1"
+ }
}
- }
- ]
- },
- {
- "group": "content",
- "children": [
+ },
{
"name": {
- "zh_CN": "走马灯"
+ "zh_CN": "搜索框"
},
+ "icon": "search",
"screenshot": "",
- "snippetName": "tiny-carousel",
- "icon": "carousel",
+ "snippetName": "TinySearch",
"schema": {
- "componentName": "TinyCarousel",
+ "componentName": "TinySearch",
"props": {
- "height": "180px"
- },
- "children": [
- {
- "componentName": "TinyCarouselItem",
- "children": [
- {
- "componentName": "div",
- "props": {
- "style": "margin:10px 0 0 30px"
- }
- }
- ]
- },
- {
- "componentName": "TinyCarouselItem",
- "children": [
- {
- "componentName": "div",
- "props": {
- "style": "margin:10px 0 0 30px"
- }
- }
- ]
- }
- ]
+ "modelValue": "",
+ "placeholder": "输入关键词"
+ }
}
- },
+ }
+ ]
+ },
+ {
+ "group": "form",
+ "label": {
+ "zh_CN": "表单类型"
+ },
+ "children": [
{
"name": {
"zh_CN": "表单"
@@ -13584,124 +13436,88 @@
},
{
"name": {
- "zh_CN": "对话框"
+ "zh_CN": "输入框"
},
+ "icon": "input",
"screenshot": "",
- "snippetName": "TinyDialogBox",
- "icon": "dialogbox",
+ "snippetName": "TinyInput",
"schema": {
- "componentName": "TinyDialogBox",
+ "componentName": "TinyInput",
"props": {
- "visible": true,
- "show-close": true,
- "title": "dialogBox title"
- },
- "children": [
- {
- "componentName": "div"
- }
- ]
+ "placeholder": "请输入",
+ "modelValue": ""
+ }
}
},
{
"name": {
- "zh_CN": "标签页"
+ "zh_CN": "单选"
},
- "icon": "tabs",
+ "icon": "radio",
"screenshot": "",
- "group": true,
- "snippetName": "TinyTabs",
+ "snippetName": "TinyRadio",
"schema": {
- "componentName": "TinyTabs",
+ "componentName": "TinyRadio",
"props": {
- "modelValue": "first"
- },
- "children": [
- {
- "componentName": "TinyTabItem",
- "props": {
- "title": "标签页1",
- "name": "first"
- },
- "children": [
- {
- "componentName": "div",
- "props": {
- "style": "margin:10px 0 0 30px"
- }
- }
- ]
- },
- {
- "componentName": "TinyTabItem",
- "props": {
- "title": "标签页2",
- "name": "second"
- },
- "children": [
- {
- "componentName": "div",
- "props": {
- "style": "margin:10px 0 0 30px"
- }
- }
- ]
- }
- ]
+ "label": "1",
+ "text": "单选文本"
+ }
}
},
{
"name": {
- "zh_CN": "折叠面板"
+ "zh_CN": "复选框"
},
+ "icon": "checkbox",
"screenshot": "",
- "snippetName": "TinyCollapse",
- "icon": "collapse",
+ "snippetName": "TinyCheckbox",
"schema": {
- "componentName": "TinyCollapse",
+ "componentName": "TinyCheckbox",
"props": {
- "modelValue": "collapse1"
- },
- "children": [
- {
- "componentName": "TinyCollapseItem",
- "props": {
- "name": "collapse1",
- "title": "折叠项1"
- },
- "children": [
- {
- "componentName": "div"
- }
- ]
- },
- {
- "componentName": "TinyCollapseItem",
- "props": {
- "name": "collapse2",
- "title": "折叠项2"
- },
- "children": [
- {
- "componentName": "div"
- }
- ]
- },
- {
- "componentName": "TinyCollapseItem",
- "props": {
- "name": "collapse3",
- "title": "折叠项3"
- },
- "children": [
- {
- "componentName": "div"
- }
- ]
- }
- ]
+ "text": "复选框文案"
+ }
+ }
+ },
+ {
+ "name": {
+ "zh_CN": "日期选择"
+ },
+ "icon": "datepick",
+ "screenshot": "",
+ "snippetName": "TinyDatePicker",
+ "schema": {
+ "componentName": "TinyDatePicker",
+ "props": {
+ "placeholder": "请输入",
+ "modelValue": ""
+ }
}
},
+ {
+ "name": {
+ "zh_CN": "数字输入框"
+ },
+ "icon": "numeric",
+ "screenshot": "",
+ "snippetName": "TinyNumeric",
+ "schema": {
+ "componentName": "TinyNumeric",
+ "props": {
+ "allow-empty": true,
+ "placeholder": "请输入",
+ "controlsPosition": "right",
+ "step": 1
+ }
+ }
+ }
+ ]
+ },
+ {
+ "group": "table",
+ "label": {
+ "zh_CN": "表格类型"
+ },
+ "children": [
{
"name": {
"zh_CN": "表格"
@@ -13762,25 +13578,161 @@
},
{
"name": {
- "zh_CN": "弹出编辑"
+ "zh_CN": "分页"
},
- "icon": "popeditor",
+ "icon": "pager",
"screenshot": "",
- "snippetName": "TinyPopeditor",
+ "snippetName": "TinyPager",
"schema": {
- "componentName": "TinyPopeditor",
+ "componentName": "TinyPager",
"props": {
- "modelValue": "",
- "placeholder": "请选择",
- "gridOp": {
- "columns": [
+ "layout": "total, sizes, prev, pager, next",
+ "total": 100,
+ "pageSize": 10,
+ "currentPage": 1
+ }
+ }
+ }
+ ]
+ },
+ {
+ "group": "data-display",
+ "label": {
+ "zh_CN": "数据展示类"
+ },
+ "children": [
+ {
+ "name": {
+ "zh_CN": "走马灯"
+ },
+ "screenshot": "",
+ "snippetName": "tiny-carousel",
+ "icon": "carousel",
+ "schema": {
+ "componentName": "TinyCarousel",
+ "props": {
+ "height": "180px"
+ },
+ "children": [
+ {
+ "componentName": "TinyCarouselItem",
+ "children": [
{
- "field": "id",
- "title": "ID",
- "width": 40
- },
+ "componentName": "div",
+ "props": {
+ "style": "margin:10px 0 0 30px"
+ }
+ }
+ ]
+ },
+ {
+ "componentName": "TinyCarouselItem",
+ "children": [
{
- "field": "name",
+ "componentName": "div",
+ "props": {
+ "style": "margin:10px 0 0 30px"
+ }
+ }
+ ]
+ }
+ ]
+ }
+ },
+ {
+ "name": {
+ "zh_CN": "对话框"
+ },
+ "screenshot": "",
+ "snippetName": "TinyDialogBox",
+ "icon": "dialogbox",
+ "schema": {
+ "componentName": "TinyDialogBox",
+ "props": {
+ "visible": true,
+ "show-close": true,
+ "title": "dialogBox title"
+ },
+ "children": [
+ {
+ "componentName": "div"
+ }
+ ]
+ }
+ },
+ {
+ "name": {
+ "zh_CN": "折叠面板"
+ },
+ "screenshot": "",
+ "snippetName": "TinyCollapse",
+ "icon": "collapse",
+ "schema": {
+ "componentName": "TinyCollapse",
+ "props": {
+ "modelValue": "collapse1"
+ },
+ "children": [
+ {
+ "componentName": "TinyCollapseItem",
+ "props": {
+ "name": "collapse1",
+ "title": "折叠项1"
+ },
+ "children": [
+ {
+ "componentName": "div"
+ }
+ ]
+ },
+ {
+ "componentName": "TinyCollapseItem",
+ "props": {
+ "name": "collapse2",
+ "title": "折叠项2"
+ },
+ "children": [
+ {
+ "componentName": "div"
+ }
+ ]
+ },
+ {
+ "componentName": "TinyCollapseItem",
+ "props": {
+ "name": "collapse3",
+ "title": "折叠项3"
+ },
+ "children": [
+ {
+ "componentName": "div"
+ }
+ ]
+ }
+ ]
+ }
+ },
+ {
+ "name": {
+ "zh_CN": "弹出编辑"
+ },
+ "icon": "popeditor",
+ "screenshot": "",
+ "snippetName": "TinyPopeditor",
+ "schema": {
+ "componentName": "TinyPopeditor",
+ "props": {
+ "modelValue": "",
+ "placeholder": "请选择",
+ "gridOp": {
+ "columns": [
+ {
+ "field": "id",
+ "title": "ID",
+ "width": 40
+ },
+ {
+ "field": "name",
"title": "名称",
"showOverflow": "tooltip"
},
@@ -13979,21 +13931,37 @@
}
]
}
- },
+ }
+ ]
+ },
+ {
+ "group": "navigation",
+ "label": {
+ "zh_CN": "导航类型"
+ },
+ "children": [
{
"name": {
- "zh_CN": "分页"
+ "zh_CN": "时间线"
},
- "icon": "pager",
+ "icon": "timeline",
"screenshot": "",
- "snippetName": "TinyPager",
+ "snippetName": "TinyTimeLine",
"schema": {
- "componentName": "TinyPager",
+ "componentName": "TinyTimeLine",
"props": {
- "layout": "total, sizes, prev, pager, next",
- "total": 100,
- "pageSize": 10,
- "currentPage": 1
+ "active": "2",
+ "data": [
+ {
+ "name": "已下单"
+ },
+ {
+ "name": "运输中"
+ },
+ {
+ "name": "已签收"
+ }
+ ]
}
}
},
@@ -14026,96 +13994,67 @@
},
{
"name": {
- "zh_CN": "日期选择"
- },
- "icon": "datepick",
- "screenshot": "",
- "snippetName": "TinyDatePicker",
- "schema": {
- "componentName": "TinyDatePicker",
- "props": {
- "placeholder": "请输入",
- "modelValue": ""
- }
- }
- },
- {
- "name": {
- "zh_CN": "数字输入框"
+ "zh_CN": "标签页"
},
- "icon": "numeric",
+ "icon": "tabs",
"screenshot": "",
- "snippetName": "TinyNumeric",
+ "group": true,
+ "snippetName": "TinyTabs",
"schema": {
- "componentName": "TinyNumeric",
+ "componentName": "TinyTabs",
"props": {
- "allow-empty": true,
- "placeholder": "请输入",
- "controlsPosition": "right",
- "step": 1
- }
- }
- }
- ]
- },
- {
- "group": "general",
- "children": [
- {
- "name": {
- "zh_CN": "Row"
- },
- "icon": "row",
- "screenshot": "",
- "snippetName": "TinyRow",
- "schema": {
- "componentName": "TinyRow",
- "props": {},
+ "modelValue": "first"
+ },
"children": [
{
- "componentName": "TinyCol",
- "props": {
- "span": 3
- }
- },
- {
- "componentName": "TinyCol",
- "props": {
- "span": 3
- }
- },
- {
- "componentName": "TinyCol",
+ "componentName": "TinyTabItem",
"props": {
- "span": 3
- }
+ "title": "标签页1",
+ "name": "first"
+ },
+ "children": [
+ {
+ "componentName": "div",
+ "props": {
+ "style": "margin:10px 0 0 30px"
+ }
+ }
+ ]
},
{
- "componentName": "TinyCol",
+ "componentName": "TinyTabItem",
"props": {
- "span": 3
- }
+ "title": "标签页2",
+ "name": "second"
+ },
+ "children": [
+ {
+ "componentName": "div",
+ "props": {
+ "style": "margin:10px 0 0 30px"
+ }
+ }
+ ]
}
]
}
- },
+ }
+ ]
+ },
+ {
+ "group": "element-plus",
+ "label": {
+ "zh_CN": "Element Plus组件"
+ },
+ "children": [
{
"name": {
- "zh_CN": "Col"
+ "zh_CN": "输入框"
},
- "icon": "col",
+ "icon": "input",
"screenshot": "",
- "snippetName": "TinyCol",
- "schema": {
- "componentName": "TinyCol",
- "props": {
- "span": 12,
- "style": {
- "height": "30px",
- "border": "1px solid #ccc"
- }
- }
- }
+ "snippetName": "ElInput",
+ "schema": {}
},
{
"name": {
@@ -14123,168 +14062,144 @@
},
"icon": "button",
"screenshot": "",
- "snippetName": "TinyButton",
+ "snippetName": "ElButton",
"schema": {
- "componentName": "TinyButton",
- "props": {
- "text": "按钮文案"
- }
+ "children": [
+ {
+ "componentName": "Text",
+ "props": {
+ "text": "按钮文本"
+ }
+ }
+ ]
}
},
{
"name": {
- "zh_CN": "按钮组"
+ "zh_CN": "表单"
},
- "icon": "buttons",
- "snippetName": "TinyButtons",
+ "icon": "form",
"screenshot": "",
+ "snippetName": "ElForm",
"schema": {
- "componentName": "div",
- "props": {},
"children": [
{
- "componentName": "TinyButton",
+ "componentName": "ElFormItem",
"props": {
- "text": "提交",
- "type": "primary",
- "style": {
- "margin": "0 5px 0 5px"
+ "label": "账号",
+ "prop": "account"
+ },
+ "children": [
+ {
+ "componentName": "ElInput",
+ "props": {
+ "modelValue": "",
+ "placeholder": "请输入账号"
+ }
}
- }
+ ]
},
{
- "componentName": "TinyButton",
+ "componentName": "ElFormItem",
"props": {
- "text": "重置",
- "style": {
- "margin": "0 5px 0 5px"
+ "label": "密码",
+ "prop": "password"
+ },
+ "children": [
+ {
+ "componentName": "ElInput",
+ "props": {
+ "modelValue": "",
+ "placeholder": "请输入密码",
+ "type": "password"
+ }
}
- }
+ ]
},
{
- "componentName": "TinyButton",
- "props": {
- "text": "取消"
- }
+ "componentName": "ElFormItem",
+ "props": {},
+ "children": [
+ {
+ "componentName": "ElButton",
+ "props": {
+ "type": "primary",
+ "style": "margin-right: 10px"
+ },
+ "children": [
+ {
+ "componentName": "Text",
+ "props": {
+ "text": "提交"
+ }
+ }
+ ]
+ },
+ {
+ "componentName": "ElButton",
+ "props": {
+ "type": "primary"
+ },
+ "children": [
+ {
+ "componentName": "Text",
+ "props": {
+ "text": "重置"
+ }
+ }
+ ]
+ }
+ ]
}
]
- },
- "configure": {
- "isContainer": true
}
},
{
"name": {
- "zh_CN": "互斥按钮组"
+ "zh_CN": "表格"
},
- "icon": "buttons",
- "snippetName": "TinyButtonGroup",
+ "icon": "grid",
"screenshot": "",
+ "snippetName": "ElTable",
"schema": {
- "componentName": "TinyButtonGroup",
"props": {
"data": [
{
- "text": "Button1",
- "value": "1"
+ "date": "2016-05-03",
+ "name": "Tom",
+ "address": "No. 189, Grove St, Los Angeles"
},
{
- "text": "Button2",
- "value": "2"
+ "date": "2016-05-02",
+ "name": "Tom",
+ "address": "No. 189, Grove St, Los Angeles"
},
{
- "text": "Button3",
- "value": "3"
+ "date": "2016-05-04",
+ "name": "Tom",
+ "address": "No. 189, Grove St, Los Angeles"
+ },
+ {
+ "date": "2016-05-01",
+ "name": "Tom",
+ "address": "No. 189, Grove St, Los Angeles"
}
],
- "modelValue": "1"
- }
- }
- },
- {
- "name": {
- "zh_CN": "输入框"
- },
- "icon": "input",
- "screenshot": "",
- "snippetName": "TinyInput",
- "schema": {
- "componentName": "TinyInput",
- "props": {
- "placeholder": "请输入",
- "modelValue": ""
- }
- }
- },
- {
- "name": {
- "zh_CN": "单选"
- },
- "icon": "radio",
- "screenshot": "",
- "snippetName": "TinyRadio",
- "schema": {
- "componentName": "TinyRadio",
- "props": {
- "label": "1",
- "text": "单选文本"
- }
- }
- },
- {
- "name": {
- "zh_CN": "复选框"
- },
- "icon": "checkbox",
- "screenshot": "",
- "snippetName": "TinyCheckbox",
- "schema": {
- "componentName": "TinyCheckbox",
- "props": {
- "text": "复选框文案"
- }
- }
- }
- ]
- },
- {
- "group": "navigation",
- "children": [
- {
- "name": {
- "zh_CN": "搜索框"
- },
- "icon": "search",
- "screenshot": "",
- "snippetName": "TinySearch",
- "schema": {
- "componentName": "TinySearch",
- "props": {
- "modelValue": "",
- "placeholder": "输入关键词"
- }
- }
- },
- {
- "name": {
- "zh_CN": "时间线"
- },
- "icon": "timeline",
- "screenshot": "",
- "snippetName": "TinyTimeLine",
- "schema": {
- "componentName": "TinyTimeLine",
- "props": {
- "active": "2",
- "data": [
+ "columns": [
{
- "name": "已下单"
+ "type": "index"
},
{
- "name": "运输中"
+ "label": "Date",
+ "prop": "date"
},
{
- "name": "已签收"
+ "label": "Name",
+ "prop": "name"
+ },
+ {
+ "label": "Address",
+ "prop": "address"
}
]
}
diff --git a/packages/builtinComponent/src/meta/CanvasCol.json b/packages/builtinComponent/src/meta/CanvasCol.json
index 090feda23..8e03bd5ab 100644
--- a/packages/builtinComponent/src/meta/CanvasCol.json
+++ b/packages/builtinComponent/src/meta/CanvasCol.json
@@ -1,5 +1,5 @@
{
- "components": {
+ "component": {
"icon": "Box",
"name": {
"zh_CN": "CanvasCol"
diff --git a/packages/builtinComponent/src/meta/CanvasRow.json b/packages/builtinComponent/src/meta/CanvasRow.json
index 0ee26acbf..4ca0ea73b 100644
--- a/packages/builtinComponent/src/meta/CanvasRow.json
+++ b/packages/builtinComponent/src/meta/CanvasRow.json
@@ -1,5 +1,5 @@
{
- "components": {
+ "component": {
"icon": "Box",
"name": {
"zh_CN": "CanvasRow"
diff --git a/packages/builtinComponent/src/meta/CanvasRowColContainer.json b/packages/builtinComponent/src/meta/CanvasRowColContainer.json
index 5ee884cdf..3281b14a0 100644
--- a/packages/builtinComponent/src/meta/CanvasRowColContainer.json
+++ b/packages/builtinComponent/src/meta/CanvasRowColContainer.json
@@ -1,5 +1,5 @@
{
- "components": {
+ "component": {
"icon": "Box",
"name": {
"zh_CN": "行列容器"
@@ -58,7 +58,7 @@
}
}
},
- "snippets": {
+ "snippet": {
"name": {
"zh_CN": "行列容器"
},
diff --git a/packages/builtinComponent/src/meta/index.js b/packages/builtinComponent/src/meta/index.js
index fa2fca60d..2480e7051 100644
--- a/packages/builtinComponent/src/meta/index.js
+++ b/packages/builtinComponent/src/meta/index.js
@@ -3,16 +3,14 @@ import CanvasRow from './CanvasRow.json'
import CanvasRowColContainer from './CanvasRowColContainer.json'
export default {
- components: [
- {
- group: '内置组件',
- children: [{ ...CanvasCol.components }, { ...CanvasRow.components }, { ...CanvasRowColContainer.components }]
- }
- ],
+ components: [CanvasCol.component, CanvasRow.component, CanvasRowColContainer.component],
snippets: [
{
- group: '内置组件',
- children: [{ ...CanvasRowColContainer.snippets }]
+ group: 'layout',
+ label: {
+ zh_CN: '布局与容器'
+ },
+ children: [CanvasRowColContainer.snippet]
}
]
}
diff --git a/packages/canvas/render/src/builtin/builtin.json b/packages/canvas/render/src/builtin/builtin.json
index 57510cc4e..ad56e67ab 100644
--- a/packages/canvas/render/src/builtin/builtin.json
+++ b/packages/canvas/render/src/builtin/builtin.json
@@ -3,446 +3,444 @@
"materials": {
"components": [
{
- "group": "内置组件",
- "children": [
- {
- "icon": "Box",
- "name": {
- "zh_CN": "Box"
- },
- "component": "div",
- "schema": {
- "slots": {},
- "properties": [
- {
- "label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
- },
- "collapse": {
- "number": 6,
- "text": {
- "zh_CN": "显示更多"
- }
- },
- "content": []
- }
- ],
- "events": {
- "onClick": {
- "label": {
- "zh_CN": "点击事件"
- },
- "description": {
- "zh_CN": "点击时触发的回调函数"
- },
- "type": "event",
- "functionInfo": {
- "params": [],
- "returns": {}
- },
- "defaultValue": ""
+ "icon": "Box",
+ "name": {
+ "zh_CN": "Box"
+ },
+ "component": "div",
+ "schema": {
+ "slots": {},
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
}
},
- "shortcuts": {
- "properties": []
+ "content": []
+ }
+ ],
+ "events": {
+ "onClick": {
+ "label": {
+ "zh_CN": "点击事件"
},
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "loop": true,
- "isContainer": true,
- "nestingRule": {
- "childWhitelist": [],
- "descendantBlacklist": []
- }
+ "description": {
+ "zh_CN": "点击时触发的回调函数"
+ },
+ "type": "event",
+ "functionInfo": {
+ "params": [],
+ "returns": {}
+ },
+ "defaultValue": ""
}
},
- {
- "icon": "slot",
- "name": {
- "zh_CN": "Slot"
- },
- "component": "Slot",
- "schema": {
- "properties": [
+ "shortcuts": {
+ "properties": []
+ },
+ "contentMenu": {
+ "actions": []
+ }
+ },
+ "configure": {
+ "loop": true,
+ "isContainer": true,
+ "nestingRule": {
+ "childWhitelist": [],
+ "descendantBlacklist": []
+ }
+ }
+ },
+ {
+ "icon": "slot",
+ "name": {
+ "zh_CN": "Slot"
+ },
+ "component": "Slot",
+ "schema": {
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
+ }
+ },
+ "content": [
{
+ "property": "name",
+ "type": "String",
"label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
+ "text": {
+ "zh_CN": "插槽名称"
+ }
},
- "collapse": {
- "number": 6,
+ "cols": 12,
+ "widget": {
+ "component": "InputConfigurator",
+ "props": {}
+ }
+ },
+ {
+ "property": "params",
+ "type": "String",
+ "defaultValue": "",
+ "label": {
"text": {
- "zh_CN": "显示更多"
+ "zh_CN": "作用域参数"
}
},
- "content": [
- {
- "property": "name",
- "type": "String",
- "label": {
- "text": {
- "zh_CN": "插槽名称"
- }
- },
- "cols": 12,
- "widget": {
- "component": "InputConfigurator",
- "props": {}
- }
- },
- {
- "property": "params",
- "type": "String",
- "defaultValue": "",
- "label": {
- "text": {
- "zh_CN": "作用域参数"
- }
- },
- "widget": {
- "component": "CodeConfigurator",
- "props": {
- "language": "json",
- "tips": {
- "title": { "zh_CN": "提示：数据为数组类型" },
- "demo": {
- "zh_CN": "示例：\n[\n {\n \"name\": \"text\",\n \"value\": {\n \"type\": \"JSExpression\",\n \"value\": \"this.state.greetingMessage\"\n }\n },\n {\n \"name\": \"count\",\n \"value\": 1\n }\n]"
- }
- }
+ "widget": {
+ "component": "CodeConfigurator",
+ "props": {
+ "language": "json",
+ "tips": {
+ "title": { "zh_CN": "提示：数据为数组类型" },
+ "demo": {
+ "zh_CN": "示例：\n[\n {\n \"name\": \"text\",\n \"value\": {\n \"type\": \"JSExpression\",\n \"value\": \"this.state.greetingMessage\"\n }\n },\n {\n \"name\": \"count\",\n \"value\": 1\n }\n]"
}
}
}
- ]
+ }
}
- ],
- "events": {},
- "shortcuts": {
- "properties": []
- },
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "isContainer": true
+ ]
}
+ ],
+ "events": {},
+ "shortcuts": {
+ "properties": []
},
- {
- "icon": "Collection",
- "name": {
- "zh_CN": "Collection"
- },
- "component": "Collection",
- "schema": {
- "slots": {},
- "properties": [
+ "contentMenu": {
+ "actions": []
+ }
+ },
+ "configure": {
+ "isContainer": true
+ }
+ },
+ {
+ "icon": "Collection",
+ "name": {
+ "zh_CN": "Collection"
+ },
+ "component": "Collection",
+ "schema": {
+ "slots": {},
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
+ }
+ },
+ "content": [
{
+ "property": "condition",
+ "type": "Boolean",
+ "defaultValue": true,
"label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
+ "text": {
+ "zh_CN": "是否渲染"
+ }
},
- "collapse": {
- "number": 6,
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "SwitchConfigurator",
+ "props": {}
+ }
+ },
+ {
+ "property": "style",
+ "type": "String",
+ "defaultValue": "",
+ "label": {
"text": {
- "zh_CN": "显示更多"
+ "zh_CN": "样式"
}
},
- "content": [
- {
- "property": "condition",
- "type": "Boolean",
- "defaultValue": true,
- "label": {
- "text": {
- "zh_CN": "是否渲染"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "SwitchConfigurator",
- "props": {}
- }
- },
- {
- "property": "style",
- "type": "String",
- "defaultValue": "",
- "label": {
- "text": {
- "zh_CN": "样式"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "CodeConfigurator",
- "props": {}
- }
- },
- {
- "property": "dataSource",
- "type": "String",
- "defaultValue": "",
- "bindState": false,
- "label": {
- "text": {
- "zh_CN": "数据源"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "CollectionConfigurator",
- "props": {}
- }
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "CodeConfigurator",
+ "props": {}
+ }
+ },
+ {
+ "property": "dataSource",
+ "type": "String",
+ "defaultValue": "",
+ "bindState": false,
+ "label": {
+ "text": {
+ "zh_CN": "数据源"
}
- ]
+ },
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "CollectionConfigurator",
+ "props": {}
+ }
}
- ],
- "events": {},
- "shortcuts": {
- "properties": []
- },
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "isContainer": true
+ ]
}
+ ],
+ "events": {},
+ "shortcuts": {
+ "properties": []
},
- {
- "icon": "Text",
- "name": {
- "zh_CN": "Text"
- },
- "component": "Text",
- "schema": {
- "properties": [
+ "contentMenu": {
+ "actions": []
+ }
+ },
+ "configure": {
+ "isContainer": true
+ }
+ },
+ {
+ "icon": "Text",
+ "name": {
+ "zh_CN": "Text"
+ },
+ "component": "Text",
+ "schema": {
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
+ }
+ },
+ "content": [
{
+ "property": "text",
+ "type": "String",
+ "defaultValue": "TinyEngine 前端可视化设计器，为设计器开发者提供定制服务，在线构建出自己专属的设计器。",
"label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
- },
- "collapse": {
- "number": 6,
"text": {
- "zh_CN": "显示更多"
+ "zh_CN": "文本内容"
}
},
- "content": [
- {
- "property": "text",
- "type": "String",
- "defaultValue": "TinyEngine 前端可视化设计器，为设计器开发者提供定制服务，在线构建出自己专属的设计器。",
- "label": {
- "text": {
- "zh_CN": "文本内容"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "InputConfigurator",
- "props": {
- "type": "textarea",
- "autosize": true
- }
- }
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "InputConfigurator",
+ "props": {
+ "type": "textarea",
+ "autosize": true
}
- ]
- }
- ],
- "events": {
- "onClick": {
- "label": {
- "zh_CN": "点击事件"
- },
- "description": {
- "zh_CN": "点击时触发的回调函数"
- },
- "type": "event",
- "functionInfo": {
- "params": [],
- "returns": {}
- },
- "defaultValue": ""
+ }
}
+ ]
+ }
+ ],
+ "events": {
+ "onClick": {
+ "label": {
+ "zh_CN": "点击事件"
},
- "shortcuts": {
- "properties": ["text"]
+ "description": {
+ "zh_CN": "点击时触发的回调函数"
},
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "loop": true
+ "type": "event",
+ "functionInfo": {
+ "params": [],
+ "returns": {}
+ },
+ "defaultValue": ""
}
},
- {
- "icon": "icon",
- "name": {
- "zh_CN": "Icon"
- },
- "component": "Icon",
- "container": false,
- "schema": {
- "properties": [
+ "shortcuts": {
+ "properties": ["text"]
+ },
+ "contentMenu": {
+ "actions": []
+ }
+ },
+ "configure": {
+ "loop": true
+ }
+ },
+ {
+ "icon": "icon",
+ "name": {
+ "zh_CN": "Icon"
+ },
+ "component": "Icon",
+ "container": false,
+ "schema": {
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
+ }
+ },
+ "content": [
{
+ "property": "name",
+ "type": "String",
+ "defaultValue": "IconDel",
+ "bindState": true,
"label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
- },
- "collapse": {
- "number": 6,
"text": {
- "zh_CN": "显示更多"
+ "zh_CN": "图标类型"
}
},
- "content": [
- {
- "property": "name",
- "type": "String",
- "defaultValue": "IconDel",
- "bindState": true,
- "label": {
- "text": {
- "zh_CN": "图标类型"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "SelectIconConfigurator",
- "props": {}
- }
- }
- ]
- }
- ],
- "events": {
- "onClick": {
- "label": {
- "zh_CN": "点击事件"
- },
- "description": {
- "zh_CN": "点击时触发的回调函数"
- },
- "type": "event",
- "functionInfo": {
- "params": [],
- "returns": {}
- },
- "defaultValue": ""
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "SelectIconConfigurator",
+ "props": {}
+ }
}
+ ]
+ }
+ ],
+ "events": {
+ "onClick": {
+ "label": {
+ "zh_CN": "点击事件"
},
- "shortcuts": {
- "properties": ["name"]
+ "description": {
+ "zh_CN": "点击时触发的回调函数"
},
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "loop": true
+ "type": "event",
+ "functionInfo": {
+ "params": [],
+ "returns": {}
+ },
+ "defaultValue": ""
}
},
- {
- "icon": "Image",
- "name": {
- "zh_CN": "Img"
- },
- "component": "Img",
- "container": false,
- "schema": {
- "properties": [
+ "shortcuts": {
+ "properties": ["name"]
+ },
+ "contentMenu": {
+ "actions": []
+ }
+ },
+ "configure": {
+ "loop": true
+ }
+ },
+ {
+ "icon": "Image",
+ "name": {
+ "zh_CN": "Img"
+ },
+ "component": "Img",
+ "container": false,
+ "schema": {
+ "properties": [
+ {
+ "label": {
+ "zh_CN": "基础信息"
+ },
+ "description": {
+ "zh_CN": "基础信息"
+ },
+ "collapse": {
+ "number": 6,
+ "text": {
+ "zh_CN": "显示更多"
+ }
+ },
+ "content": [
{
+ "property": "src",
+ "type": "String",
+ "defaultValue": "",
+ "bindState": true,
"label": {
- "zh_CN": "基础信息"
- },
- "description": {
- "zh_CN": "基础信息"
- },
- "collapse": {
- "number": 6,
"text": {
- "zh_CN": "显示更多"
- }
- },
- "content": [
- {
- "property": "src",
- "type": "String",
- "defaultValue": "",
- "bindState": true,
- "label": {
- "text": {
- "zh_CN": "src路径"
- }
- },
- "cols": 12,
- "rules": [],
- "widget": {
- "component": "InputConfigurator",
- "props": {}
- }
+ "zh_CN": "src路径"
}
- ]
- }
- ],
- "events": {
- "onClick": {
- "label": {
- "zh_CN": "点击事件"
},
- "description": {
- "zh_CN": "点击时触发的回调函数"
- },
- "type": "event",
- "functionInfo": {
- "params": [],
- "returns": {}
- },
- "defaultValue": ""
+ "cols": 12,
+ "rules": [],
+ "widget": {
+ "component": "InputConfigurator",
+ "props": {}
+ }
}
+ ]
+ }
+ ],
+ "events": {
+ "onClick": {
+ "label": {
+ "zh_CN": "点击事件"
},
- "shortcuts": {
- "properties": ["src"]
+ "description": {
+ "zh_CN": "点击时触发的回调函数"
},
- "contentMenu": {
- "actions": []
- }
- },
- "configure": {
- "loop": true
+ "type": "event",
+ "functionInfo": {
+ "params": [],
+ "returns": {}
+ },
+ "defaultValue": ""
}
+ },
+ "shortcuts": {
+ "properties": ["src"]
+ },
+ "contentMenu": {
+ "actions": []
}
- ]
+ },
+ "configure": {
+ "loop": true
+ }
}
],
"snippets": [
{
- "group": "内置组件",
+ "group": "layout",
+ "label": {
+ "zh_CN": "布局与容器"
+ },
"children": [
{
"name": {
- "zh_CN": "Box"
+ "zh_CN": "盒子容器"
},
"screenshot": "",
"snippetName": "Box",
@@ -451,34 +449,18 @@
"componentName": "div",
"props": {}
}
- },
- {
- "name": {
- "zh_CN": "Slot"
- },
- "screenshot": "",
- "snippetName": "Slot",
- "icon": "slot",
- "schema": {
- "componentName": "Slot",
- "props": {}
- }
- },
- {
- "name": {
- "zh_CN": "Collection"
- },
- "screenshot": "",
- "snippetName": "Collection",
- "icon": "Collection",
- "schema": {
- "componentName": "Collection",
- "props": {}
- }
- },
+ }
+ ]
+ },
+ {
+ "group": "basic",
+ "label": {
+ "zh_CN": "基础元素"
+ },
+ "children": [
{
"name": {
- "zh_CN": "Text"
+ "zh_CN": "文本"
},
"screenshot": "",
"snippetName": "Text",
@@ -492,7 +474,7 @@
},
{
"name": {
- "zh_CN": "Icon"
+ "zh_CN": "图标"
},
"screenshot": "",
"snippetName": "Icon",
@@ -506,7 +488,7 @@
},
{
"name": {
- "zh_CN": "Img"
+ "zh_CN": "图片"
},
"screenshot": "",
"snippetName": "Img",
@@ -519,6 +501,38 @@
}
}
]
+ },
+ {
+ "group": "advanced",
+ "label": {
+ "zh_CN": "高级元素"
+ },
+ "children": [
+ {
+ "name": {
+ "zh_CN": "插槽"
+ },
+ "screenshot": "",
+ "snippetName": "Slot",
+ "icon": "slot",
+ "schema": {
+ "componentName": "Slot",
+ "props": {}
+ }
+ },
+ {
+ "name": {
+ "zh_CN": "数据源容器"
+ },
+ "screenshot": "",
+ "snippetName": "Collection",
+ "icon": "Collection",
+ "schema": {
+ "componentName": "Collection",
+ "props": {}
+ }
+ }
+ ]
}
]
}
diff --git a/packages/plugins/materials/src/composable/useMaterial.js b/packages/plugins/materials/src/composable/useMaterial.js
index 91786e620..37d36b1d3 100644
--- a/packages/plugins/materials/src/composable/useMaterial.js
+++ b/packages/plugins/materials/src/composable/useMaterial.js
@@ -248,15 +248,51 @@ const setThirdPartyDeps = (components) => {
}
/**
- * 获取到符合物料协议的bundle.json之后，对其进行处理的函数
- * @param {*} materials
+ * 添加组件snippets(分组相同则合并)
+ * @param {*} componentsSnippets 待添加的组件snippets
+ * @param {*} snippetsData 当前snippets
+ * @returns {*} snippetsData 合并后的snippets
*/
-const addMaterials = (materials = {}) => {
- setThirdPartyDeps(materials.components)
- materialState.components.push(...materials.snippets)
- materials.components.forEach(registerComponentToResource)
+const addComponentSnippets = (componentSnippets, snippetsData) => {
+ if (!componentSnippets) return
+
+ const snippetsMap = new Map()
+ snippetsData.forEach((snippetGroup) => snippetsMap.set(snippetGroup.group, snippetGroup))
+ componentSnippets.forEach((snippetGroup) => {
+ if (snippetsMap.has(snippetGroup.group)) {
+ snippetsMap.get(snippetGroup.group).children.push(...snippetGroup.children)
+ } else {
+ snippetsData.push(snippetGroup)
+ }
+ })
+
+ return snippetsData
+}
+
+/**
+ * 添加物料Bundle文件中的组件类型物料
+ * @param {*} materialBundle 物料包Bundle.json文件对象
+ * @returns null
+ */
+const addComponents = (materialBundle) => {
+ const { snippets, components } = materialBundle
+ // 解析组件三方依赖
+ setThirdPartyDeps(components)
+ // 注册组件到map中
+ components.forEach(registerComponentToResource)
+ // 添加组件snippets
+ addComponentSnippets(snippets, materialState.components)
+}
- const promises = materials?.blocks?.map((item) => registerBlock(item, true))
+/**
+ * 添加物料Bundle文件中的区块类型物料
+ * @param {*} blocks 物料包Bundle.json文件中blocks对象
+ */
+const addBlocks = (blocks) => {
+ if (!Array.isArray(blocks) || !blocks.length) {
+ return
+ }
+ const promises = blocks?.map((item) => registerBlock(item, true))
Promise.allSettled(promises).then((blocks) => {
if (!blocks?.length) {
@@ -276,6 +312,15 @@ const addMaterials = (materials = {}) => {
})
}
+/**
+ * 获取到符合物料协议的bundle.json之后，处理组件与区块物料
+ * @param {*} materials
+ */
+const addMaterials = (materials = {}) => {
+ addComponents(materials)
+ addBlocks(materials.blocks)
+}
+
const getMaterial = (name) => {
if (name) {
// 先读取组件缓存，再读取区块缓存
@@ -355,15 +400,10 @@ const updateCanvasDependencies = (blocks) => {
const initBuiltinMaterial = () => {
const { Builtin } = useCanvas().canvasApi.value
- Builtin.data.materials.components[0].children.forEach(registerComponentToResource)
- BuiltinComponentMaterials.components[0].children.forEach(registerComponentToResource)
-
- const builtinSnippets = {
- group: '内置组件',
- children: [...Builtin.data.materials.snippets[0].children, ...BuiltinComponentMaterials.snippets[0].children]
- }
-
- materialState.components.push(builtinSnippets)
+ // 添加画布物料
+ addMaterials(Builtin.data.materials)
+ // 添加builtin-component NPM包物料
+ addMaterials(BuiltinComponentMaterials)
}
const initMaterial = ({ isInit = true, appData = {} } = {}) => {
diff --git a/packages/plugins/materials/src/meta/component/src/Main.vue b/packages/plugins/materials/src/meta/component/src/Main.vue
index 9ff75f76f..bf9b374ec 100644
--- a/packages/plugins/materials/src/meta/component/src/Main.vue
+++ b/packages/plugins/materials/src/meta/component/src/Main.vue
@@ -4,11 +4,16 @@
-
+
@@ -16,8 +21,8 @@
- {{
- child.name?.zh_CN || child.name
+ {{
+ child.name?.[locale] || child.name
}}
@@ -33,6 +38,7 @@
import { inject, onMounted, reactive, ref } from 'vue'
import { Collapse, CollapseItem, Search } from '@opentiny/vue'
import { SearchEmpty, CanvasDragItem } from '@opentiny/tiny-engine-common'
+import i18n from '@opentiny/tiny-engine-common/js/i18n'
import { iconSearch } from '@opentiny/vue-icon'
import { useMaterial, useCanvas } from '@opentiny/tiny-engine-meta-register'
@@ -52,6 +58,7 @@ export default {
const gridTemplateColumns = ref(COMPONENT_PANEL_COLUMNS)
const panelState = inject('panelState', {})
const { components } = materialState
+ const { locale } = i18n.global
const fetchComponents = (components, name) => {
if (!name) {
@@ -63,7 +70,7 @@ export default {
const children = []
component.children.forEach((child) => {
- if (child.name?.zh_CN?.toLowerCase().indexOf(name.toLowerCase()) > -1) {
+ if (child.name?.[locale.value]?.toLowerCase().indexOf(name.toLowerCase()) > -1) {
children.push(child)
}
})
@@ -108,6 +115,7 @@ export default {
})
return {
+ locale,
gridTemplateColumns,
state,
change,