diff --git a/designer-demo/public/mock/bundle.json b/designer-demo/public/mock/bundle.json
index 3e7e49562..51222e8d8 100644
--- a/designer-demo/public/mock/bundle.json
+++ b/designer-demo/public/mock/bundle.json
@@ -5679,6 +5679,95 @@
             }
           }
         },
+        {
+          "icon": "layout",
+          "name": {
+            "zh_CN": "layout"
+          },
+          "component": "TinyLayout",
+          "description": "栅格布局",
+          "docUrl": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "devMode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "Layout",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "priority": 5,
+          "schema": {
+            "properties": [
+              {
+                "label": {
+                  "zh_CN": "基础信息"
+                },
+                "description": {
+                  "zh_CN": "基础信息"
+                },
+                "collapse": {
+                  "number": 6,
+                  "text": {
+                    "zh_CN": "显示更多"
+                  }
+                },
+                "content": [
+                  {
+                    "property": "cols",
+                    "label": {
+                      "text": {
+                        "zh_CN": "总栅格数"
+                      }
+                    },
+                    "cols": 12,
+                    "defaultValue": 12,
+                    "widget": {
+                      "component": "RadioGroupConfigurator",
+                      "props": {
+                        "options": [
+                          { "label": "12", "text": 12 },
+                          { "label": "24", "text": 24 }
+                        ],
+                        "type": "button"
+                      }
+                    },
+                    "description": {
+                      "zh_CN": "总栅格数，该属性的可选值为 12/24"
+                    }
+                  }
+                ]
+              }
+            ]
+          },
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "nestingRule": {
+              "childWhitelist": [],
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": {
+              "properties": ["cols"]
+            },
+            "contextMenu": {
+              "actions": ["create symbol"],
+              "disable": ["copy", "remove"]
+            }
+          }
+        },
         {
           "name": {
             "zh_CN": "按钮"
@@ -13069,104 +13158,926 @@
               "disable": ["copy", "remove"]
             }
           }
-        }
-      ],
-      "blocks": [],
-      "snippets": [
+        },
         {
-          "group": "layout",
-          "label": {
-            "zh_CN": "布局与容器"
+          "name": { "zh_CN": "饼图" },
+          "component": "TinyChartPie",
+          "icon": "pie",
+          "description": "基于 eCharts 封装的折线图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartPie",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
           },
-          "children": [
-            {
-              "name": {
-                "zh_CN": "栅格布局"
-              },
-              "icon": "row",
-              "screenshot": "",
-              "snippetName": "TinyLayout",
-              "schema": {
-                "componentName": "TinyLayout",
-                "props": {},
-                "children": [
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
                   {
-                    "componentName": "TinyRow",
-                    "props": {
-                      "style": "padding: 10px;"
-                    },
-                    "children": [
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      }
-                    ]
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
                   },
                   {
-                    "componentName": "TinyRow",
-                    "props": {
-                      "style": "padding: 10px;"
-                    },
-                    "children": [
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      },
-                      {
-                        "componentName": "TinyCol",
-                        "props": {
-                          "span": 3
-                        }
-                      }
-                    ]
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eCharts" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
                   }
-                ]
+                ],
+                "description": { "zh_CN": "" }
               }
-            }
-          ]
+            ],
+            "events": []
+          }
         },
         {
-          "group": "basic",
-          "label": {
-            "zh_CN": "基础元素"
-          },
-          "children": [
-            {
-              "name": {
+          "name": { "zh_CN": "折线图" },
+          "component": "TinyChartLine",
+          "icon": "line",
+          "description": "基于 eCharts 封装的折线图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartLine",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
+                  {
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eCharts" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  }
+                ],
+                "description": { "zh_CN": "" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": { "zh_CN": "柱状图" },
+          "component": "TinyChartHistogram",
+          "icon": "histogram ",
+          "description": "基于 eCharts 封装的柱状图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartHistogram",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
+                  {
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eChart" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  }
+                ],
+                "description": { "zh_CN": "" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": { "zh_CN": "条形图" },
+          "component": "TinyChartBar",
+          "icon": "bar",
+          "description": "基于 eCharts 封装的条形图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartBar",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
+                  {
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eCharts" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  }
+                ],
+                "description": { "zh_CN": "" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": { "zh_CN": "雷达图" },
+          "component": "TinyChartRadar",
+          "icon": "radar",
+          "description": "基于 eCharts 封装的雷达图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartRadar",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
+                  {
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eCharts" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  }
+                ],
+                "description": { "zh_CN": "" }
+              }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": { "zh_CN": "环图" },
+          "component": "TinyChartRing",
+          "icon": "ring",
+          "description": "基于 eCharts 封装的环图",
+          "doc_url": "",
+          "screenshot": "",
+          "tags": "",
+          "keywords": "",
+          "dev_mode": "proCode",
+          "npm": {
+            "package": "@opentiny/vue",
+            "exportName": "ChartRing",
+            "version": "3.14.0",
+            "destructuring": true,
+            "script": "https://unpkg.com/@opentiny/vue@~3.14/runtime/tiny-vue.mjs",
+            "css": "https://unpkg.com/@opentiny/vue-theme@~3.14/index.css"
+          },
+          "group": "component",
+          "configure": {
+            "loop": true,
+            "condition": true,
+            "styles": true,
+            "isContainer": false,
+            "isModal": false,
+            "isPopper": false,
+            "nestingRule": {
+              "childWhitelist": "",
+              "parentWhitelist": "",
+              "descendantBlacklist": "",
+              "ancestorWhitelist": ""
+            },
+            "isNullNode": false,
+            "isLayout": false,
+            "rootSelector": "",
+            "shortcuts": { "properties": [""] },
+            "contextMenu": {
+              "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"],
+              "disable": []
+            },
+            "invalidity": [""],
+            "clickCapture": true,
+            "framework": "Vue"
+          },
+          "schema": {
+            "properties": [
+              {
+                "name": "0",
+                "label": { "zh_CN": "基础信息" },
+                "content": [
+                  {
+                    "property": "data",
+                    "label": { "text": { "zh_CN": "图表数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "settings",
+                    "label": { "text": { "zh_CN": "图表配置" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "width",
+                    "label": { "text": { "zh_CN": "图表容器的宽度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "height",
+                    "label": { "text": { "zh_CN": "图表容器的高度" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "InputConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "extend",
+                    "label": { "text": { "zh_CN": "图表扩展配置，参考eCharts" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "events",
+                    "label": { "text": { "zh_CN": "事件绑定" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "CodeConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "loading",
+                    "label": { "text": { "zh_CN": "显示loading" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  },
+                  {
+                    "property": "data-empty",
+                    "label": { "text": { "zh_CN": "暂无数据" } },
+                    "required": true,
+                    "readOnly": false,
+                    "disabled": false,
+                    "cols": 12,
+                    "widget": { "component": "SwitchConfigurator", "props": {} },
+                    "description": { "zh_CN": "" }
+                  }
+                ],
+                "description": { "zh_CN": "" }
+              }
+            ],
+            "events": []
+          }
+        }
+      ],
+      "blocks": [],
+      "snippets": [
+        {
+          "group": "layout",
+          "label": {
+            "zh_CN": "布局与容器"
+          },
+          "children": [
+            {
+              "name": {
+                "zh_CN": "栅格布局"
+              },
+              "icon": "row",
+              "screenshot": "",
+              "snippetName": "TinyLayout",
+              "schema": {
+                "componentName": "TinyLayout",
+                "props": {},
+                "children": [
+                  {
+                    "componentName": "TinyRow",
+                    "props": {
+                      "style": "padding: 10px;"
+                    },
+                    "children": [
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      }
+                    ]
+                  },
+                  {
+                    "componentName": "TinyRow",
+                    "props": {
+                      "style": "padding: 10px;"
+                    },
+                    "children": [
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      },
+                      {
+                        "componentName": "TinyCol",
+                        "props": {
+                          "span": 3
+                        }
+                      }
+                    ]
+                  }
+                ]
+              }
+            }
+          ]
+        },
+        {
+          "group": "basic",
+          "label": {
+            "zh_CN": "基础元素"
+          },
+          "children": [
+            {
+              "name": {
                 "zh_CN": "段落"
               },
               "icon": "paragraph",
@@ -14105,6 +15016,146 @@
             }
           ]
         },
+        {
+          "group": "Charts",
+          "label": {
+            "zh_CN": "图表"
+          },
+          "children": [
+            {
+              "name": { "zh_CN": "饼图" },
+              "icon": "pie",
+              "screenshot": "",
+              "snippetName": "TinyChartPie",
+              "schema": {
+                "componentName": "TinyChartPie",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393 },
+                      { "日期": "1/2", "访问用户": 3530 },
+                      { "日期": "1/3", "访问用户": 2923 },
+                      { "日期": "1/4", "访问用户": 1723 },
+                      { "日期": "1/5", "访问用户": 3792 },
+                      { "日期": "1/6", "访问用户": 4593 }
+                    ]
+                  }
+                }
+              }
+            },
+            {
+              "name": { "zh_CN": "折线图" },
+              "icon": "line",
+              "screenshot": "",
+              "snippetName": "TinyChartLine",
+              "schema": {
+                "componentName": "TinyChartLine",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户", "下单用户", "下单率"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393, "下单用户": 1093, "下单率": 0.32 },
+                      { "日期": "1/2", "访问用户": 3530, "下单用户": 3230, "下单率": 0.26 },
+                      { "日期": "1/3", "访问用户": 2923, "下单用户": 2623, "下单率": 0.76 },
+                      { "日期": "1/4", "访问用户": 1723, "下单用户": 1423, "下单率": 0.49 },
+                      { "日期": "1/5", "访问用户": 3792, "下单用户": 3492, "下单率": 0.323 },
+                      { "日期": "1/6", "访问用户": 4593, "下单用户": 4293, "下单率": 0.78 }
+                    ]
+                  }
+                }
+              }
+            },
+            {
+              "name": { "zh_CN": "柱状图" },
+              "icon": "histogram ",
+              "screenshot": "",
+              "snippetName": "TinyChartHistogram",
+              "schema": {
+                "componentName": "TinyChartHistogram",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户", "下单用户", "下单率"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393, "下单用户": 1093, "下单率": 0.32 },
+                      { "日期": "1/2", "访问用户": 3530, "下单用户": 3230, "下单率": 0.26 },
+                      { "日期": "1/3", "访问用户": 2923, "下单用户": 2623, "下单率": 0.76 },
+                      { "日期": "1/4", "访问用户": 1723, "下单用户": 1423, "下单率": 0.49 },
+                      { "日期": "1/5", "访问用户": 3792, "下单用户": 3492, "下单率": 0.323 },
+                      { "日期": "1/6", "访问用户": 4593, "下单用户": 4293, "下单率": 0.78 }
+                    ]
+                  }
+                }
+              }
+            },
+            {
+              "name": { "zh_CN": "条形图" },
+              "icon": "bar",
+              "screenshot": "",
+              "snippetName": "TinyChartBar",
+              "schema": {
+                "componentName": "TinyChartBar",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户", "下单用户", "下单率"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393, "下单用户": 1093, "下单率": 0.32 },
+                      { "日期": "1/2", "访问用户": 3530, "下单用户": 3230, "下单率": 0.26 },
+                      { "日期": "1/3", "访问用户": 2923, "下单用户": 2623, "下单率": 0.76 },
+                      { "日期": "1/4", "访问用户": 1723, "下单用户": 1423, "下单率": 0.49 },
+                      { "日期": "1/5", "访问用户": 3792, "下单用户": 3492, "下单率": 0.323 },
+                      { "日期": "1/6", "访问用户": 4593, "下单用户": 4293, "下单率": 0.78 }
+                    ]
+                  }
+                }
+              }
+            },
+            {
+              "name": { "zh_CN": "雷达图" },
+              "icon": "radar",
+              "screenshot": "",
+              "snippetName": "TinyChartRadar",
+              "schema": {
+                "componentName": "TinyChartRadar",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户", "下单用户", "下单率"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393, "下单用户": 1093, "下单率": 0.32 },
+                      { "日期": "1/2", "访问用户": 3530, "下单用户": 3230, "下单率": 0.26 },
+                      { "日期": "1/3", "访问用户": 2923, "下单用户": 2623, "下单率": 0.76 },
+                      { "日期": "1/4", "访问用户": 1723, "下单用户": 1423, "下单率": 0.49 },
+                      { "日期": "1/5", "访问用户": 3792, "下单用户": 3492, "下单率": 0.323 },
+                      { "日期": "1/6", "访问用户": 4593, "下单用户": 4293, "下单率": 0.78 }
+                    ]
+                  }
+                }
+              }
+            },
+            {
+              "name": { "zh_CN": "环图" },
+              "icon": "ring",
+              "screenshot": "",
+              "snippetName": "TinyChartRing",
+              "schema": {
+                "componentName": "TinyChartRing",
+                "props": {
+                  "data": {
+                    "columns": ["日期", "访问用户"],
+                    "rows": [
+                      { "日期": "1/1", "访问用户": 1393 },
+                      { "日期": "1/2", "访问用户": 3530 },
+                      { "日期": "1/3", "访问用户": 2923 },
+                      { "日期": "1/4", "访问用户": 1723 },
+                      { "日期": "1/5", "访问用户": 3792 },
+                      { "日期": "1/6", "访问用户": 4593 }
+                    ]
+                  }
+                }
+              }
+            }
+          ]
+        },
         {
           "group": "element-plus",
           "label": {