@next-bricks/advanced 0.33.0 → 0.33.2

package/dist/examples.json

@@ -1,10 +1,4 @@
 {
-  "eo-cascader": {
-    "doc": "级联选择器\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-cascader\n  properties:\n    placeholder: 请选择城市\n    options:\n      - children:\n          - children:\n              - label: West Lake\n                value: xihu\n            label: Hangzhou\n            value: hangzhou\n        label: Zhejiang\n        value: zhejiang\n      - children:\n          - children:\n              - label: Zhong Hua Men\n                value: zhonghuamen\n            label: Nanjing\n            value: nanjing\n        label: Jiangsu\n        value: jiangsu\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-cascader placeholder=\"请选择城市\" id=\"brick-1\"></eo-cascader>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"West Lake\",\n#               value: \"xihu\",\n#             },\n#           ],\n#           label: \"Hangzhou\",\n#           value: \"hangzhou\",\n#         },\n#       ],\n#       label: \"Zhejiang\",\n#       value: \"zhejiang\",\n#     },\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"Zhong Hua Men\",\n#               value: \"zhonghuamen\",\n#             },\n#           ],\n#           label: \"Nanjing\",\n#           value: \"nanjing\",\n#         },\n#       ],\n#       label: \"Jiangsu\",\n#       value: \"jiangsu\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-cascader\n      properties:\n        label: 城市选择\n        name: city\n        placeholder: 请选择城市\n        required: true\n        options:\n          - children:\n              - children:\n                  - label: West Lake\n                    value: xihu\n                label: Hangzhou\n                value: hangzhou\n            label: Zhejiang\n            value: zhejiang\n          - children:\n              - children:\n                  - label: Zhong Hua Men\n                    value: zhonghuamen\n                label: Nanjing\n                value: nanjing\n            label: Jiangsu\n            value: jiangsu\n      events:\n        cascader.change:\n          - action: console.log\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-cascader\n#     label=\"城市选择\"\n#     name=\"city\"\n#     placeholder=\"请选择城市\"\n#     required\n#     id=\"brick-2\"\n#   ></eo-cascader>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"West Lake\",\n#               value: \"xihu\",\n#             },\n#           ],\n#           label: \"Hangzhou\",\n#           value: \"hangzhou\",\n#         },\n#       ],\n#       label: \"Zhejiang\",\n#       value: \"zhejiang\",\n#     },\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"Zhong Hua Men\",\n#               value: \"zhonghuamen\",\n#             },\n#           ],\n#           label: \"Nanjing\",\n#           value: \"nanjing\",\n#         },\n#       ],\n#       label: \"Jiangsu\",\n#       value: \"jiangsu\",\n#     },\n#   ];\n#   brick_2.addEventListener(\"cascader.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
-  },
-  "eo-next-table": {
-    "doc": "大型表格\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n  properties:\n    scrollConfig:\n      x: false\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n      - dataIndex: remarks\n        key: remarks\n        title: Long Column Long Column Long Column Long Column\n        width: 200\n        ellipsis: true\n      - dataIndex: operator\n        key: operator\n        title: 操作\n        width: 200\n        useBrick:\n          - brick: div\n            properties:\n              style:\n                display: flex\n                gap: 4px\n            children:\n              - brick: eo-button\n                properties:\n                  type: link\n                  icon:\n                    lib: antd\n                    icon: edit\n                events:\n                  click:\n                    - action: message.info\n                      args:\n                        - <% DATA.rowData.name %>\n              - brick: eo-button\n                properties:\n                  type: link\n                  danger: true\n                  icon:\n                    lib: antd\n                    icon: delete\n                events:\n                  click:\n                    - action: message.error\n                      args:\n                        - <% JSON.stringify(DATA) %>\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          remarks: Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n          remarks: Long text Long text\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n          remarks: Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.scrollConfig = {\n#     x: false,\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#     {\n#       dataIndex: \"remarks\",\n#       key: \"remarks\",\n#       title: \"Long Column Long Column Long Column Long Column\",\n#       width: 200,\n#       ellipsis: true,\n#     },\n#     {\n#       dataIndex: \"operator\",\n#       key: \"operator\",\n#       title: \"操作\",\n#       width: 200,\n#       useBrick: [\n#         {\n#           brick: \"div\",\n#           properties: {\n#             style: {\n#               display: \"flex\",\n#               gap: \"4px\",\n#             },\n#           },\n#           children: [\n#             {\n#               brick: \"eo-button\",\n#               properties: {\n#                 type: \"link\",\n#                 icon: {\n#                   lib: \"antd\",\n#                   icon: \"edit\",\n#                 },\n#               },\n#               events: {\n#                 click: [\n#                   {\n#                     action: \"message.info\",\n#                     args: [\"<% DATA.rowData.name %>\"],\n#                   },\n#                 ],\n#               },\n#             },\n#             {\n#               brick: \"eo-button\",\n#               properties: {\n#                 type: \"link\",\n#                 danger: true,\n#                 icon: {\n#                   lib: \"antd\",\n#                   icon: \"delete\",\n#                 },\n#               },\n#               events: {\n#                 click: [\n#                   {\n#                     action: \"message.error\",\n#                     args: [\"<% JSON.stringify(DATA) %>\"],\n#                   },\n#                 ],\n#               },\n#             },\n#           ],\n#         },\n#       ],\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         remarks:\n#           \"Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#         remarks: \"Long text Long text\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#         remarks:\n#           \"Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Fixed & Scroll & useBrick\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n  properties:\n    scrollConfig:\n      x: max-content\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n        width: 100\n        fixed: true\n        headerBrick:\n          useBrick:\n            brick: span\n            properties:\n              style:\n                color: red\n              textContent: <% DATA.title %>\n        useBrick:\n          - brick: span\n            properties:\n              style:\n                color: pink\n              textContent: <% DATA.cellData %>\n      - dataIndex: address\n        key: column1\n        title: column1\n      - dataIndex: address\n        key: column2\n        title: column2\n      - dataIndex: address\n        key: column3\n        title: column3\n      - dataIndex: address\n        key: column4\n        title: column4\n      - dataIndex: address\n        key: column5\n        title: column5\n      - dataIndex: address\n        key: column6\n        title: column6\n      - dataIndex: address\n        key: column7\n        title: column7\n      - dataIndex: address\n        key: column8\n        title: column8\n      - dataIndex: address\n        key: column9\n        title: column9\n      - dataIndex: address\n        key: column10\n        title: column10\n      - dataIndex: age\n        key: age\n        title: Age\n        width: 100\n        fixed: right\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.scrollConfig = {\n#     x: \"max-content\",\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#       width: 100,\n#       fixed: true,\n#       headerBrick: {\n#         useBrick: {\n#           brick: \"span\",\n#           properties: {\n#             style: {\n#               color: \"red\",\n#             },\n#             textContent: \"<% DATA.title %>\",\n#           },\n#         },\n#       },\n#       useBrick: [\n#         {\n#           brick: \"span\",\n#           properties: {\n#             style: {\n#               color: \"pink\",\n#             },\n#             textContent: \"<% DATA.cellData %>\",\n#           },\n#         },\n#       ],\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column1\",\n#       title: \"column1\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column2\",\n#       title: \"column2\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column3\",\n#       title: \"column3\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column4\",\n#       title: \"column4\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column5\",\n#       title: \"column5\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column6\",\n#       title: \"column6\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column7\",\n#       title: \"column7\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column8\",\n#       title: \"column8\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column9\",\n#       title: \"column9\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column10\",\n#       title: \"column10\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       width: 100,\n#       fixed: \"right\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Front Search\n\n```yaml preview\n- brick: eo-search-bar\n  children:\n    - brick: eo-search\n      slot: start\n      properties:\n        placeholder: Enter keyword\n      events:\n        search:\n          target: \"#table\"\n          method: search\n          args:\n            - q: <% EVENT.detail %>\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n    sort.change:\n      - action: console.log\n  properties:\n    id: table\n    frontSearch: true\n    searchFields:\n      - address\n    sort:\n      columnKey: age\n      order: descend\n    multiSort: true\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n        sortable: true\n        sortPriority: 1\n      - dataIndex: address\n        key: address\n        title: Address\n        sortable: true\n        sortPriority: 2\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-search-bar>\n#   <eo-search slot=\"start\" placeholder=\"Enter keyword\" id=\"brick-1\"></eo-search>\n# </eo-search-bar>\n# <eo-next-table front-search multi-sort id=\"table\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"search\", (e) => {\n#     const brick = document.querySelector(\"#table\");\n#     brick.search({ q: \"<% EVENT.detail %>\" });\n#   });\n# \n#   const table = document.getElementById(\"table\");\n#   table.searchFields = [\"address\"];\n#   table.sort = {\n#     columnKey: \"age\",\n#     order: \"descend\",\n#   };\n#   table.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   table.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       sortable: true,\n#       sortPriority: 1,\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#       sortable: true,\n#       sortPriority: 2,\n#     },\n#   ];\n#   table.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   table.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   table.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   table.addEventListener(\"sort.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Row Selection\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.select:\n      - action: console.log\n  properties:\n    rowSelection: true\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n        useBrick:\n          - brick: eo-tag\n            properties:\n              color: |\n                <% DATA.cellData > 18 ? \"green\" : \"red\" %>\n              textContent: <% DATA.cellData %>\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.rowSelection = true;\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       useBrick: [\n#         {\n#           brick: \"eo-tag\",\n#           properties: {\n#             color: '<% DATA.cellData > 18 ? \"green\" : \"red\" %>\\n',\n#             textContent: \"<% DATA.cellData %>\",\n#           },\n#         },\n#       ],\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.select\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Expandable\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.expand:\n      - action: console.log\n    expanded.rows.change:\n      - action: console.log\n  properties:\n    expandable:\n      columnWidth: 100px\n      rowExpandable: <% DATA.rowData.key % 2 === 0 %>\n      expandIconBrick:\n        useBrick:\n          brick: eo-link\n          properties:\n            disabled: \"<% !DATA.expandable %>\"\n            textContent: \"<% DATA.expanded ? '点击收起' : '点击展开' %>\"\n      expandedRowBrick:\n        useBrick:\n          brick: eo-next-table\n          properties:\n            pagination: false\n            bordered: true\n            columns:\n              - dataIndex: title\n                key: title\n                title: 标题\n              - dataIndex: description\n                key: description\n                title: 描述\n              - dataIndex: operator\n                key: operator\n                title: 操作\n                useBrick:\n                  - brick: div\n                    properties:\n                      style:\n                        display: flex\n                        gap: 4px\n                    children:\n                      - brick: eo-button\n                        properties:\n                          type: link\n                          textContent: 操作\n                        events:\n                          click:\n                            - action: message.info\n                              args:\n                                - <% `id:${DATA.rowData.id}` %>\n            dataSource:\n              list: <% DATA.rowData.info %>\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          info:\n            - title: 测试1\n              description: 这是一串描述\n              id: 1\n            - title: 测试2\n              description: 这是一串描述\n              id: 2\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n          info:\n            - title: 测试3\n              description: 这是一串描述\n              id: 3\n            - title: 测试4\n              description: 这是一串描述\n              id: 4\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.expandable = {\n#     columnWidth: \"100px\",\n#     rowExpandable: \"<% DATA.rowData.key % 2 === 0 %>\",\n#     expandIconBrick: {\n#       useBrick: {\n#         brick: \"eo-link\",\n#         properties: {\n#           disabled: \"<% !DATA.expandable %>\",\n#           textContent: \"<% DATA.expanded ? '点击收起' : '点击展开' %>\",\n#         },\n#       },\n#     },\n#     expandedRowBrick: {\n#       useBrick: {\n#         brick: \"eo-next-table\",\n#         properties: {\n#           pagination: false,\n#           bordered: true,\n#           columns: [\n#             {\n#               dataIndex: \"title\",\n#               key: \"title\",\n#               title: \"标题\",\n#             },\n#             {\n#               dataIndex: \"description\",\n#               key: \"description\",\n#               title: \"描述\",\n#             },\n#             {\n#               dataIndex: \"operator\",\n#               key: \"operator\",\n#               title: \"操作\",\n#               useBrick: [\n#                 {\n#                   brick: \"div\",\n#                   properties: {\n#                     style: {\n#                       display: \"flex\",\n#                       gap: \"4px\",\n#                     },\n#                   },\n#                   children: [\n#                     {\n#                       brick: \"eo-button\",\n#                       properties: {\n#                         type: \"link\",\n#                         textContent: \"操作\",\n#                       },\n#                       events: {\n#                         click: [\n#                           {\n#                             action: \"message.info\",\n#                             args: [\"<% `id:${DATA.rowData.id}` %>\"],\n#                           },\n#                         ],\n#                       },\n#                     },\n#                   ],\n#                 },\n#               ],\n#             },\n#           ],\n#           dataSource: {\n#             list: \"<% DATA.rowData.info %>\",\n#           },\n#         },\n#       },\n#     },\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         info: [\n#           {\n#             title: \"测试1\",\n#             description: \"这是一串描述\",\n#             id: 1,\n#           },\n#           {\n#             title: \"测试2\",\n#             description: \"这是一串描述\",\n#             id: 2,\n#           },\n#         ],\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#         info: [\n#           {\n#             title: \"测试3\",\n#             description: \"这是一串描述\",\n#             id: 3,\n#           },\n#           {\n#             title: \"测试4\",\n#             description: \"这是一串描述\",\n#             id: 4,\n#           },\n#         ],\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.expand\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"expanded.rows.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Draggable\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.drag:\n      - action: console.log\n  properties:\n    rowKey: name\n    rowDraggable: true\n    pagination: false\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table row-key=\"name\" row-draggable id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.drag\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### RowSpan & ColSpan\n\n```yaml preview\n- brick: eo-next-table\n  properties:\n    pagination: false\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: mobile\n        key: mobile\n        title: phone\n        colSpan: 2\n        cellColSpanKey: mobileColSpan\n        cellRowSpanKey: mobileRowSpan\n      - dataIndex: landlines\n        key: landlines\n        colSpan: 0\n        cellColSpanKey: landlinesColSpan\n        cellRowSpanKey: landlinesRowSpan\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          mobile: 18900010222\n          landlines: 0571-22098909\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n          mobile: 18900010333\n          mobileColSpan: 2\n          landlinesColSpan: 0\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n          mobile: 18900010444\n          landlines: 0571-22098707\n          landlinesRowSpan: 2\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n          mobile: 18900010555\n          landlines: 0571-22098707\n          landlinesRowSpan: 0\n          mobileRowSpan: 2\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n          mobile: 18900010555\n          landlines: 0571-22098606\n          mobileRowSpan: 0\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"mobile\",\n#       key: \"mobile\",\n#       title: \"phone\",\n#       colSpan: 2,\n#       cellColSpanKey: \"mobileColSpan\",\n#       cellRowSpanKey: \"mobileRowSpan\",\n#     },\n#     {\n#       dataIndex: \"landlines\",\n#       key: \"landlines\",\n#       colSpan: 0,\n#       cellColSpanKey: \"landlinesColSpan\",\n#       cellRowSpanKey: \"landlinesRowSpan\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         mobile: 18900010222,\n#         landlines: \"0571-22098909\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#         mobile: 18900010333,\n#         mobileColSpan: 2,\n#         landlinesColSpan: 0,\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#         mobile: 18900010444,\n#         landlines: \"0571-22098707\",\n#         landlinesRowSpan: 2,\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#         mobile: 18900010555,\n#         landlines: \"0571-22098707\",\n#         landlinesRowSpan: 0,\n#         mobileRowSpan: 2,\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#         mobile: 18900010555,\n#         landlines: \"0571-22098606\",\n#         mobileRowSpan: 0,\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n\n### Tree\n\n设置 childrenColumnName 来指定树形结构的列名，展开功能的配置可以使用 expandable。目前树形结构暂不支持拖拽。\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.expand:\n      - action: console.log\n    expanded.rows.change:\n      - action: console.log\n  properties:\n    pagination: false\n    childrenColumnName: student\n    expandable:\n      defaultExpandAllRows: true\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 28\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 35\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 33\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table children-column-name=\"student\" id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.expandable = {\n#     defaultExpandAllRows: true,\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 28,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 33,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.expand\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"expanded.rows.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n#### With Row Selection\n\n设置 rowSelection.checkStrictly 来控制父子数据选中状态是否关联。注意，关联的时候，节点勾选传导策略为【只勾选可触达的可勾选节点】\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.select:\n      - action: console.log\n  properties:\n    pagination: false\n    childrenColumnName: student\n    rowSelection:\n      checkStrictly: false\n      indentSize: 50\n      rowDisabled: <% DATA.rowData.age > 30 %>\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 34\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 27\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 35\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table children-column-name=\"student\" id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.rowSelection = {\n#     checkStrictly: false,\n#     indentSize: 50,\n#     rowDisabled: \"<% DATA.rowData.age > 30 %>\",\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 34,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 27,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 35,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.select\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n#### With Front Search\n\n```yaml preview\n- brick: eo-search-bar\n  children:\n    - brick: eo-search\n      slot: start\n      properties:\n        placeholder: Enter keyword\n      events:\n        search:\n          target: \"#table\"\n          method: search\n          args:\n            - q: <% EVENT.detail %>\n- brick: eo-next-table\n  properties:\n    id: table\n    searchFields:\n      - name\n      - age\n      - address\n    pagination: false\n    childrenColumnName: student\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 34\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 27\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 35\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-search-bar>\n#   <eo-search slot=\"start\" placeholder=\"Enter keyword\" id=\"brick-1\"></eo-search>\n# </eo-search-bar>\n# <eo-next-table children-column-name=\"student\" id=\"table\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"search\", (e) => {\n#     const brick = document.querySelector(\"#table\");\n#     brick.search({ q: \"<% EVENT.detail %>\" });\n#   });\n# \n#   const table = document.getElementById(\"table\");\n#   table.searchFields = [\"name\", \"age\", \"address\"];\n#   table.pagination = false;\n#   table.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   table.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 34,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 27,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 35,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n\n### Dynamic Columns\n\n```yaml preview\nbrick: eo-next-table\nproperties:\n  cell:\n    useBrick:\n      - if: <% DATA.columnKey !== '01-13' %>\n        brick: em\n        properties:\n          textContent: <% DATA.cellData %>\n      - if: <% DATA.columnKey === '01-13' %>\n        brick: del\n        properties:\n          textContent: <% DATA.cellData %>\n    header:\n      useBrick:\n        brick: em\n        properties:\n          textContent: <% DATA.title %>\n  # Dynamic columns, such as by dates\n  columns: <% CTX.dates %>\n  dataSource:\n    list:\n      - \"01-11\": \"abc\"\n        \"01-12\": \"def\"\n        \"01-13\": \"ghi\"\n        \"01-14\": \"jkl\"\n      - \"01-11\": \"123\"\n        \"01-12\": \"345\"\n        \"01-13\": \"789\"\n        \"01-14\": \"-\"\ncontext:\n  - name: dates\n    value: |\n      <%\n        new Array(4).fill(null).map(\n          (d, i) => moment('2023-01-11').add(i, 'days').format('MM-DD')\n        ).map((key) => ({\n          dataIndex: key,\n          key,\n          title: key,\n        }))\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.cell = {\n#     useBrick: [\n#       {\n#         if: \"<% DATA.columnKey !== '01-13' %>\",\n#         brick: \"em\",\n#         properties: {\n#           textContent: \"<% DATA.cellData %>\",\n#         },\n#       },\n#       {\n#         if: \"<% DATA.columnKey === '01-13' %>\",\n#         brick: \"del\",\n#         properties: {\n#           textContent: \"<% DATA.cellData %>\",\n#         },\n#       },\n#     ],\n#     header: {\n#       useBrick: {\n#         brick: \"em\",\n#         properties: {\n#           textContent: \"<% DATA.title %>\",\n#         },\n#       },\n#     },\n#   };\n#   brick_1.columns = \"<% CTX.dates %>\";\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         \"01-11\": \"abc\",\n#         \"01-12\": \"def\",\n#         \"01-13\": \"ghi\",\n#         \"01-14\": \"jkl\",\n#       },\n#       {\n#         \"01-11\": \"123\",\n#         \"01-12\": \"345\",\n#         \"01-13\": \"789\",\n#         \"01-14\": \"-\",\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n"
-  },
   "eo-workbench-layout": {
     "doc": "工作台布局\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-workbench-layout\n  properties:\n    layouts:\n      - i: hello\n        x: 0\n        y: 0\n        w: 2\n        h: 1\n      - i: world\n        x: 0\n        y: 1\n        w: 2\n        h: 1\n      - i: small\n        x: 2\n        y: 0\n        w: 1\n        h: 1\n    componentList:\n      - title: 基础布局\n        useBrick:\n          brick: eo-card\n          properties:\n            fillVertical: true\n          children:\n            - brick: div\n              properties:\n                textContent: Hello\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: hello\n          x: 0\n          y: 0\n          w: 2\n          h: 1\n        key: hello\n      - title: world\n        useBrick:\n          brick: eo-card\n          properties:\n            fillVertical: true\n          children:\n            - brick: div\n              properties:\n                textContent: World\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: world\n          x: 0\n          y: 2\n          w: 2\n          h: 1\n        key: world\n      - title: small\n        useBrick:\n          brick: div\n          properties:\n            style:\n              height: 100%\n              background: \"#fff\"\n          children:\n            - brick: div\n              properties:\n                textContent: small\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: small\n          x: 2\n          y: 0\n          w: 1\n          h: 2\n        key: small\n      - title: custom\n        useBrick:\n          brick: div\n          properties:\n            style:\n              background: \"#6ad26a\"\n              width: 100%\n              height: 100%\n        position:\n          i: custom\n          x: 1\n          y: 3\n          w: 1\n          h: 1\n        key: custom\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-workbench-layout id=\"brick-1\"></eo-workbench-layout>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.layouts = [\n#     {\n#       i: \"hello\",\n#       x: 0,\n#       y: 0,\n#       w: 2,\n#       h: 1,\n#     },\n#     {\n#       i: \"world\",\n#       x: 0,\n#       y: 1,\n#       w: 2,\n#       h: 1,\n#     },\n#     {\n#       i: \"small\",\n#       x: 2,\n#       y: 0,\n#       w: 1,\n#       h: 1,\n#     },\n#   ];\n#   brick_1.componentList = [\n#     {\n#       title: \"基础布局\",\n#       useBrick: {\n#         brick: \"eo-card\",\n#         properties: {\n#           fillVertical: true,\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"Hello\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"hello\",\n#         x: 0,\n#         y: 0,\n#         w: 2,\n#         h: 1,\n#       },\n#       key: \"hello\",\n#     },\n#     {\n#       title: \"world\",\n#       useBrick: {\n#         brick: \"eo-card\",\n#         properties: {\n#           fillVertical: true,\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"World\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"world\",\n#         x: 0,\n#         y: 2,\n#         w: 2,\n#         h: 1,\n#       },\n#       key: \"world\",\n#     },\n#     {\n#       title: \"small\",\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style: {\n#             height: \"100%\",\n#             background: \"#fff\",\n#           },\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"small\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"small\",\n#         x: 2,\n#         y: 0,\n#         w: 1,\n#         h: 2,\n#       },\n#       key: \"small\",\n#     },\n#     {\n#       title: \"custom\",\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style: {\n#             background: \"#6ad26a\",\n#             width: \"100%\",\n#             height: \"100%\",\n#           },\n#         },\n#       },\n#       position: {\n#         i: \"custom\",\n#         x: 1,\n#         y: 3,\n#         w: 1,\n#         h: 1,\n#       },\n#       key: \"custom\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### Edit & Event\n\n```yaml preview\n- brick: eo-workbench-layout\n  events:\n    save.layout:\n      - action: console.log\n  properties:\n    isEdit: true\n    layouts:\n      - i: hello\n        x: 0\n        y: 0\n        w: 2\n        h: 1\n      - i: world\n        x: 0\n        y: 1\n        w: 2\n        h: 1\n      - i: small\n        x: 2\n        y: 0\n        w: 1\n        h: 1\n    componentList:\n      - title: 基础布局\n        useBrick:\n          brick: eo-card\n          properties:\n            fillVertical: true\n          children:\n            - brick: div\n              properties:\n                textContent: Hello\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: hello\n          x: 0\n          y: 0\n          w: 2\n          h: 1\n        key: hello\n      - title: world\n        useBrick:\n          brick: eo-card\n          properties:\n            fillVertical: true\n          children:\n            - brick: div\n              properties:\n                textContent: World\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: world\n          x: 0\n          y: 2\n          w: 2\n          h: 1\n        key: world\n      - title: small\n        useBrick:\n          brick: div\n          properties:\n            style:\n              height: 100%\n              background: \"#fff\"\n          children:\n            - brick: div\n              properties:\n                textContent: small\n                style:\n                  textAlign: center\n                  fontSize: 20px\n        position:\n          i: small\n          x: 2\n          y: 0\n          w: 1\n          h: 2\n        key: small\n      - title: custom\n        useBrick:\n          brick: div\n          properties:\n            style:\n              background: \"#6ad26a\"\n              width: 100%\n              height: 100%\n        position:\n          i: custom\n          x: 1\n          y: 3\n          w: 1\n          h: 1\n        key: custom\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-workbench-layout is-edit id=\"brick-1\"></eo-workbench-layout>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.layouts = [\n#     {\n#       i: \"hello\",\n#       x: 0,\n#       y: 0,\n#       w: 2,\n#       h: 1,\n#     },\n#     {\n#       i: \"world\",\n#       x: 0,\n#       y: 1,\n#       w: 2,\n#       h: 1,\n#     },\n#     {\n#       i: \"small\",\n#       x: 2,\n#       y: 0,\n#       w: 1,\n#       h: 1,\n#     },\n#   ];\n#   brick_1.componentList = [\n#     {\n#       title: \"基础布局\",\n#       useBrick: {\n#         brick: \"eo-card\",\n#         properties: {\n#           fillVertical: true,\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"Hello\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"hello\",\n#         x: 0,\n#         y: 0,\n#         w: 2,\n#         h: 1,\n#       },\n#       key: \"hello\",\n#     },\n#     {\n#       title: \"world\",\n#       useBrick: {\n#         brick: \"eo-card\",\n#         properties: {\n#           fillVertical: true,\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"World\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"world\",\n#         x: 0,\n#         y: 2,\n#         w: 2,\n#         h: 1,\n#       },\n#       key: \"world\",\n#     },\n#     {\n#       title: \"small\",\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style: {\n#             height: \"100%\",\n#             background: \"#fff\",\n#           },\n#         },\n#         children: [\n#           {\n#             brick: \"div\",\n#             properties: {\n#               textContent: \"small\",\n#               style: {\n#                 textAlign: \"center\",\n#                 fontSize: \"20px\",\n#               },\n#             },\n#           },\n#         ],\n#       },\n#       position: {\n#         i: \"small\",\n#         x: 2,\n#         y: 0,\n#         w: 1,\n#         h: 2,\n#       },\n#       key: \"small\",\n#     },\n#     {\n#       title: \"custom\",\n#       useBrick: {\n#         brick: \"div\",\n#         properties: {\n#           style: {\n#             background: \"#6ad26a\",\n#             width: \"100%\",\n#             height: \"100%\",\n#           },\n#         },\n#       },\n#       position: {\n#         i: \"custom\",\n#         x: 1,\n#         y: 3,\n#         w: 1,\n#         h: 1,\n#       },\n#       key: \"custom\",\n#     },\n#   ];\n#   brick_1.addEventListener(\"save.layout\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
@@ -14,6 +8,12 @@
   "eo-tree-select": {
     "doc": "构件 `eo-tree-select`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"500px\"\n- brick: eo-tree-select\n  properties:\n    treeData:\n      - title: Node1\n        value: 0\n        key: 0\n        children:\n          - title: Node1-1\n            value: 0-1\n          - title: Node1-2\n            value: 0-2\n          - title: Node1-3\n            value: 0-3\n      - title: Node2\n        value: 1\n        key: 1\n        children:\n          - title: Node2-1\n            value: 1-1\n          - title: Node2-2\n            value: 1-2\n          - title: Node2-3\n            value: 1-3\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-tree-select id=\"brick-1\"></eo-tree-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.treeData = [\n#     {\n#       title: \"Node1\",\n#       value: 0,\n#       key: 0,\n#       children: [\n#         {\n#           title: \"Node1-1\",\n#           value: \"0-1\",\n#         },\n#         {\n#           title: \"Node1-2\",\n#           value: \"0-2\",\n#         },\n#         {\n#           title: \"Node1-3\",\n#           value: \"0-3\",\n#         },\n#       ],\n#     },\n#     {\n#       title: \"Node2\",\n#       value: 1,\n#       key: 1,\n#       children: [\n#         {\n#           title: \"Node2-1\",\n#           value: \"1-1\",\n#         },\n#         {\n#           title: \"Node2-2\",\n#           value: \"1-2\",\n#         },\n#         {\n#           title: \"Node2-3\",\n#           value: \"1-3\",\n#         },\n#       ],\n#     },\n#   ];\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"500px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    validate.error:\n      - action: console.log\n  children:\n    - brick: eo-tree-select\n      properties:\n        label: tree\n        name: tree\n        required: true\n        treeData:\n          - title: \"Node1\"\n            value: \"Node1\"\n            key: \"0-0\"\n            children:\n              - title: \"Child Node1-1\"\n                value: \"Child Node1-1\"\n                key: \"0-0-0\"\n              - title: \"Child Node1-2\"\n                value: \"Child Node1-2\"\n                key: \"0-0-1\"\n          - title: \"Node2\"\n            value: \"0-1\"\n            key: \"0-1\"\n            children:\n              - title: \"Child Node2-1\"\n                value: \"Child Node2-1\"\n                key: \"0-1-0\"\n              - title: \"Child Node2-2\"\n                value: \"Child Node2-2\"\n                key: \"0-1-1\"\n                children:\n                  - title: Child Node2-2-1\n                    value: Child Node2-2-1\n                    key: \"0-1-1-0\"\n        multiple: true\n        checkable: true\n        placeholder: 请选择树节点\n      events:\n        change:\n          - action: console.log\n        select:\n          - action: console.log\n        expand:\n          - action: console.log\n        search:\n          - action: console.log\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-tree-select\n#     label=\"tree\"\n#     name=\"tree\"\n#     required\n#     multiple\n#     checkable\n#     placeholder=\"请选择树节点\"\n#     id=\"brick-2\"\n#   ></eo-tree-select>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"validate.error\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.treeData = [\n#     {\n#       title: \"Node1\",\n#       value: \"Node1\",\n#       key: \"0-0\",\n#       children: [\n#         {\n#           title: \"Child Node1-1\",\n#           value: \"Child Node1-1\",\n#           key: \"0-0-0\",\n#         },\n#         {\n#           title: \"Child Node1-2\",\n#           value: \"Child Node1-2\",\n#           key: \"0-0-1\",\n#         },\n#       ],\n#     },\n#     {\n#       title: \"Node2\",\n#       value: \"0-1\",\n#       key: \"0-1\",\n#       children: [\n#         {\n#           title: \"Child Node2-1\",\n#           value: \"Child Node2-1\",\n#           key: \"0-1-0\",\n#         },\n#         {\n#           title: \"Child Node2-2\",\n#           value: \"Child Node2-2\",\n#           key: \"0-1-1\",\n#           children: [\n#             {\n#               title: \"Child Node2-2-1\",\n#               value: \"Child Node2-2-1\",\n#               key: \"0-1-1-0\",\n#             },\n#           ],\n#         },\n#       ],\n#     },\n#   ];\n#   brick_2.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_2.addEventListener(\"select\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_2.addEventListener(\"expand\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_2.addEventListener(\"search\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
+  "eo-cascader": {
+    "doc": "级联选择器\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-cascader\n  properties:\n    placeholder: 请选择城市\n    options:\n      - children:\n          - children:\n              - label: West Lake\n                value: xihu\n            label: Hangzhou\n            value: hangzhou\n        label: Zhejiang\n        value: zhejiang\n      - children:\n          - children:\n              - label: Zhong Hua Men\n                value: zhonghuamen\n            label: Nanjing\n            value: nanjing\n        label: Jiangsu\n        value: jiangsu\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-cascader placeholder=\"请选择城市\" id=\"brick-1\"></eo-cascader>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"West Lake\",\n#               value: \"xihu\",\n#             },\n#           ],\n#           label: \"Hangzhou\",\n#           value: \"hangzhou\",\n#         },\n#       ],\n#       label: \"Zhejiang\",\n#       value: \"zhejiang\",\n#     },\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"Zhong Hua Men\",\n#               value: \"zhonghuamen\",\n#             },\n#           ],\n#           label: \"Nanjing\",\n#           value: \"nanjing\",\n#         },\n#       ],\n#       label: \"Jiangsu\",\n#       value: \"jiangsu\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-cascader\n      properties:\n        label: 城市选择\n        name: city\n        placeholder: 请选择城市\n        required: true\n        options:\n          - children:\n              - children:\n                  - label: West Lake\n                    value: xihu\n                label: Hangzhou\n                value: hangzhou\n            label: Zhejiang\n            value: zhejiang\n          - children:\n              - children:\n                  - label: Zhong Hua Men\n                    value: zhonghuamen\n                label: Nanjing\n                value: nanjing\n            label: Jiangsu\n            value: jiangsu\n      events:\n        cascader.change:\n          - action: console.log\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-cascader\n#     label=\"城市选择\"\n#     name=\"city\"\n#     placeholder=\"请选择城市\"\n#     required\n#     id=\"brick-2\"\n#   ></eo-cascader>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"West Lake\",\n#               value: \"xihu\",\n#             },\n#           ],\n#           label: \"Hangzhou\",\n#           value: \"hangzhou\",\n#         },\n#       ],\n#       label: \"Zhejiang\",\n#       value: \"zhejiang\",\n#     },\n#     {\n#       children: [\n#         {\n#           children: [\n#             {\n#               label: \"Zhong Hua Men\",\n#               value: \"zhonghuamen\",\n#             },\n#           ],\n#           label: \"Nanjing\",\n#           value: \"nanjing\",\n#         },\n#       ],\n#       label: \"Jiangsu\",\n#       value: \"jiangsu\",\n#     },\n#   ];\n#   brick_2.addEventListener(\"cascader.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
+  },
+  "eo-next-table": {
+    "doc": "大型表格\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n  properties:\n    scrollConfig:\n      x: false\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n      - dataIndex: remarks\n        key: remarks\n        title: Long Column Long Column Long Column Long Column\n        width: 200\n        ellipsis: true\n      - dataIndex: operator\n        key: operator\n        title: 操作\n        width: 200\n        useBrick:\n          - brick: div\n            properties:\n              style:\n                display: flex\n                gap: 4px\n            children:\n              - brick: eo-button\n                properties:\n                  type: link\n                  icon:\n                    lib: antd\n                    icon: edit\n                events:\n                  click:\n                    - action: message.info\n                      args:\n                        - <% DATA.rowData.name %>\n              - brick: eo-button\n                properties:\n                  type: link\n                  danger: true\n                  icon:\n                    lib: antd\n                    icon: delete\n                events:\n                  click:\n                    - action: message.error\n                      args:\n                        - <% JSON.stringify(DATA) %>\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          remarks: Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n          remarks: Long text Long text\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n          remarks: Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.scrollConfig = {\n#     x: false,\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#     {\n#       dataIndex: \"remarks\",\n#       key: \"remarks\",\n#       title: \"Long Column Long Column Long Column Long Column\",\n#       width: 200,\n#       ellipsis: true,\n#     },\n#     {\n#       dataIndex: \"operator\",\n#       key: \"operator\",\n#       title: \"操作\",\n#       width: 200,\n#       useBrick: [\n#         {\n#           brick: \"div\",\n#           properties: {\n#             style: {\n#               display: \"flex\",\n#               gap: \"4px\",\n#             },\n#           },\n#           children: [\n#             {\n#               brick: \"eo-button\",\n#               properties: {\n#                 type: \"link\",\n#                 icon: {\n#                   lib: \"antd\",\n#                   icon: \"edit\",\n#                 },\n#               },\n#               events: {\n#                 click: [\n#                   {\n#                     action: \"message.info\",\n#                     args: [\"<% DATA.rowData.name %>\"],\n#                   },\n#                 ],\n#               },\n#             },\n#             {\n#               brick: \"eo-button\",\n#               properties: {\n#                 type: \"link\",\n#                 danger: true,\n#                 icon: {\n#                   lib: \"antd\",\n#                   icon: \"delete\",\n#                 },\n#               },\n#               events: {\n#                 click: [\n#                   {\n#                     action: \"message.error\",\n#                     args: [\"<% JSON.stringify(DATA) %>\"],\n#                   },\n#                 ],\n#               },\n#             },\n#           ],\n#         },\n#       ],\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         remarks:\n#           \"Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#         remarks: \"Long text Long text\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#         remarks:\n#           \"Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text Long text\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Fixed & Scroll & useBrick\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n  properties:\n    scrollConfig:\n      x: max-content\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n        width: 100\n        fixed: true\n        headerBrick:\n          useBrick:\n            brick: span\n            properties:\n              style:\n                color: red\n              textContent: <% DATA.title %>\n        useBrick:\n          - brick: span\n            properties:\n              style:\n                color: pink\n              textContent: <% DATA.cellData %>\n      - dataIndex: address\n        key: column1\n        title: column1\n      - dataIndex: address\n        key: column2\n        title: column2\n      - dataIndex: address\n        key: column3\n        title: column3\n      - dataIndex: address\n        key: column4\n        title: column4\n      - dataIndex: address\n        key: column5\n        title: column5\n      - dataIndex: address\n        key: column6\n        title: column6\n      - dataIndex: address\n        key: column7\n        title: column7\n      - dataIndex: address\n        key: column8\n        title: column8\n      - dataIndex: address\n        key: column9\n        title: column9\n      - dataIndex: address\n        key: column10\n        title: column10\n      - dataIndex: age\n        key: age\n        title: Age\n        width: 100\n        fixed: right\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.scrollConfig = {\n#     x: \"max-content\",\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#       width: 100,\n#       fixed: true,\n#       headerBrick: {\n#         useBrick: {\n#           brick: \"span\",\n#           properties: {\n#             style: {\n#               color: \"red\",\n#             },\n#             textContent: \"<% DATA.title %>\",\n#           },\n#         },\n#       },\n#       useBrick: [\n#         {\n#           brick: \"span\",\n#           properties: {\n#             style: {\n#               color: \"pink\",\n#             },\n#             textContent: \"<% DATA.cellData %>\",\n#           },\n#         },\n#       ],\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column1\",\n#       title: \"column1\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column2\",\n#       title: \"column2\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column3\",\n#       title: \"column3\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column4\",\n#       title: \"column4\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column5\",\n#       title: \"column5\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column6\",\n#       title: \"column6\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column7\",\n#       title: \"column7\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column8\",\n#       title: \"column8\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column9\",\n#       title: \"column9\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"column10\",\n#       title: \"column10\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       width: 100,\n#       fixed: \"right\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Front Search\n\n```yaml preview\n- brick: eo-search-bar\n  children:\n    - brick: eo-search\n      slot: start\n      properties:\n        placeholder: Enter keyword\n      events:\n        search:\n          target: \"#table\"\n          method: search\n          args:\n            - q: <% EVENT.detail %>\n- brick: eo-next-table\n  events:\n    page.change:\n      - action: console.log\n    page.size.change:\n      - action: console.log\n    sort.change:\n      - action: console.log\n  properties:\n    id: table\n    frontSearch: true\n    searchFields:\n      - address\n    sort:\n      columnKey: age\n      order: descend\n    multiSort: true\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n        sortable: true\n        sortPriority: 1\n      - dataIndex: address\n        key: address\n        title: Address\n        sortable: true\n        sortPriority: 2\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-search-bar>\n#   <eo-search slot=\"start\" placeholder=\"Enter keyword\" id=\"brick-1\"></eo-search>\n# </eo-search-bar>\n# <eo-next-table front-search multi-sort id=\"table\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"search\", (e) => {\n#     const brick = document.querySelector(\"#table\");\n#     brick.search({ q: \"<% EVENT.detail %>\" });\n#   });\n# \n#   const table = document.getElementById(\"table\");\n#   table.searchFields = [\"address\"];\n#   table.sort = {\n#     columnKey: \"age\",\n#     order: \"descend\",\n#   };\n#   table.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   table.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       sortable: true,\n#       sortPriority: 1,\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#       sortable: true,\n#       sortPriority: 2,\n#     },\n#   ];\n#   table.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   table.addEventListener(\"page.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   table.addEventListener(\"page.size.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   table.addEventListener(\"sort.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Row Selection\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.select:\n      - action: console.log\n  properties:\n    rowSelection: true\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n        useBrick:\n          - brick: eo-tag\n            properties:\n              color: |\n                <% DATA.cellData > 18 ? \"green\" : \"red\" %>\n              textContent: <% DATA.cellData %>\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.rowSelection = true;\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#       useBrick: [\n#         {\n#           brick: \"eo-tag\",\n#           properties: {\n#             color: '<% DATA.cellData > 18 ? \"green\" : \"red\" %>\\n',\n#             textContent: \"<% DATA.cellData %>\",\n#           },\n#         },\n#       ],\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.select\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Expandable\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.expand:\n      - action: console.log\n    expanded.rows.change:\n      - action: console.log\n  properties:\n    expandable:\n      columnWidth: 100px\n      rowExpandable: <% DATA.rowData.key % 2 === 0 %>\n      expandIconBrick:\n        useBrick:\n          brick: eo-link\n          properties:\n            disabled: \"<% !DATA.expandable %>\"\n            textContent: \"<% DATA.expanded ? '点击收起' : '点击展开' %>\"\n      expandedRowBrick:\n        useBrick:\n          brick: eo-next-table\n          properties:\n            pagination: false\n            bordered: true\n            columns:\n              - dataIndex: title\n                key: title\n                title: 标题\n              - dataIndex: description\n                key: description\n                title: 描述\n              - dataIndex: operator\n                key: operator\n                title: 操作\n                useBrick:\n                  - brick: div\n                    properties:\n                      style:\n                        display: flex\n                        gap: 4px\n                    children:\n                      - brick: eo-button\n                        properties:\n                          type: link\n                          textContent: 操作\n                        events:\n                          click:\n                            - action: message.info\n                              args:\n                                - <% `id:${DATA.rowData.id}` %>\n            dataSource:\n              list: <% DATA.rowData.info %>\n    pagination:\n      pageSizeOptions:\n        - 5\n        - 10\n        - 20\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      pageSize: 5\n      page: 1\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          info:\n            - title: 测试1\n              description: 这是一串描述\n              id: 1\n            - title: 测试2\n              description: 这是一串描述\n              id: 2\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n          info:\n            - title: 测试3\n              description: 这是一串描述\n              id: 3\n            - title: 测试4\n              description: 这是一串描述\n              id: 4\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.expandable = {\n#     columnWidth: \"100px\",\n#     rowExpandable: \"<% DATA.rowData.key % 2 === 0 %>\",\n#     expandIconBrick: {\n#       useBrick: {\n#         brick: \"eo-link\",\n#         properties: {\n#           disabled: \"<% !DATA.expandable %>\",\n#           textContent: \"<% DATA.expanded ? '点击收起' : '点击展开' %>\",\n#         },\n#       },\n#     },\n#     expandedRowBrick: {\n#       useBrick: {\n#         brick: \"eo-next-table\",\n#         properties: {\n#           pagination: false,\n#           bordered: true,\n#           columns: [\n#             {\n#               dataIndex: \"title\",\n#               key: \"title\",\n#               title: \"标题\",\n#             },\n#             {\n#               dataIndex: \"description\",\n#               key: \"description\",\n#               title: \"描述\",\n#             },\n#             {\n#               dataIndex: \"operator\",\n#               key: \"operator\",\n#               title: \"操作\",\n#               useBrick: [\n#                 {\n#                   brick: \"div\",\n#                   properties: {\n#                     style: {\n#                       display: \"flex\",\n#                       gap: \"4px\",\n#                     },\n#                   },\n#                   children: [\n#                     {\n#                       brick: \"eo-button\",\n#                       properties: {\n#                         type: \"link\",\n#                         textContent: \"操作\",\n#                       },\n#                       events: {\n#                         click: [\n#                           {\n#                             action: \"message.info\",\n#                             args: [\"<% `id:${DATA.rowData.id}` %>\"],\n#                           },\n#                         ],\n#                       },\n#                     },\n#                   ],\n#                 },\n#               ],\n#             },\n#           ],\n#           dataSource: {\n#             list: \"<% DATA.rowData.info %>\",\n#           },\n#         },\n#       },\n#     },\n#   };\n#   brick_1.pagination = {\n#     pageSizeOptions: [5, 10, 20],\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     pageSize: 5,\n#     page: 1,\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         info: [\n#           {\n#             title: \"测试1\",\n#             description: \"这是一串描述\",\n#             id: 1,\n#           },\n#           {\n#             title: \"测试2\",\n#             description: \"这是一串描述\",\n#             id: 2,\n#           },\n#         ],\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#         info: [\n#           {\n#             title: \"测试3\",\n#             description: \"这是一串描述\",\n#             id: 3,\n#           },\n#           {\n#             title: \"测试4\",\n#             description: \"这是一串描述\",\n#             id: 4,\n#           },\n#         ],\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.expand\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"expanded.rows.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Draggable\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.drag:\n      - action: console.log\n  properties:\n    rowKey: name\n    rowDraggable: true\n    pagination: false\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n        - key: 5\n          name: Ava\n          age: 23\n          address: Beijing\n        - key: 6\n          name: Sophia\n          age: 20\n          address: Shanghai\n        - key: 7\n          name: Charlotte\n          age: 33\n          address: Chongqing\n        - key: 8\n          name: Mia\n          age: 18\n          address: Chengdu\n        - key: 9\n          name: Noah\n          age: 38\n          address: Hainan\n        - key: 10\n          name: William\n          age: 16\n          address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table row-key=\"name\" row-draggable id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 5,\n#         name: \"Ava\",\n#         age: 23,\n#         address: \"Beijing\",\n#       },\n#       {\n#         key: 6,\n#         name: \"Sophia\",\n#         age: 20,\n#         address: \"Shanghai\",\n#       },\n#       {\n#         key: 7,\n#         name: \"Charlotte\",\n#         age: 33,\n#         address: \"Chongqing\",\n#       },\n#       {\n#         key: 8,\n#         name: \"Mia\",\n#         age: 18,\n#         address: \"Chengdu\",\n#       },\n#       {\n#         key: 9,\n#         name: \"Noah\",\n#         age: 38,\n#         address: \"Hainan\",\n#       },\n#       {\n#         key: 10,\n#         name: \"William\",\n#         age: 16,\n#         address: \"Taiwan\",\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.drag\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### RowSpan & ColSpan\n\n```yaml preview\n- brick: eo-next-table\n  properties:\n    pagination: false\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: mobile\n        key: mobile\n        title: phone\n        colSpan: 2\n        cellColSpanKey: mobileColSpan\n        cellRowSpanKey: mobileRowSpan\n      - dataIndex: landlines\n        key: landlines\n        colSpan: 0\n        cellColSpanKey: landlinesColSpan\n        cellRowSpanKey: landlinesRowSpan\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: 0\n          name: Jack\n          age: 18\n          address: Guangzhou\n          mobile: 18900010222\n          landlines: 0571-22098909\n        - key: 1\n          name: Alex\n          age: 20\n          address: Shanghai\n          mobile: 18900010333\n          mobileColSpan: 2\n          landlinesColSpan: 0\n        - key: 2\n          name: Lucy\n          age: 16\n          address: Yunnan\n          mobile: 18900010444\n          landlines: 0571-22098707\n          landlinesRowSpan: 2\n        - key: 3\n          name: Sam\n          age: 28\n          address: Guangzhou\n          mobile: 18900010555\n          landlines: 0571-22098707\n          landlinesRowSpan: 0\n          mobileRowSpan: 2\n        - key: 4\n          name: Bob\n          age: 35\n          address: Hainan\n          mobile: 18900010555\n          landlines: 0571-22098606\n          mobileRowSpan: 0\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"mobile\",\n#       key: \"mobile\",\n#       title: \"phone\",\n#       colSpan: 2,\n#       cellColSpanKey: \"mobileColSpan\",\n#       cellRowSpanKey: \"mobileRowSpan\",\n#     },\n#     {\n#       dataIndex: \"landlines\",\n#       key: \"landlines\",\n#       colSpan: 0,\n#       cellColSpanKey: \"landlinesColSpan\",\n#       cellRowSpanKey: \"landlinesRowSpan\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: 0,\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         mobile: 18900010222,\n#         landlines: \"0571-22098909\",\n#       },\n#       {\n#         key: 1,\n#         name: \"Alex\",\n#         age: 20,\n#         address: \"Shanghai\",\n#         mobile: 18900010333,\n#         mobileColSpan: 2,\n#         landlinesColSpan: 0,\n#       },\n#       {\n#         key: 2,\n#         name: \"Lucy\",\n#         age: 16,\n#         address: \"Yunnan\",\n#         mobile: 18900010444,\n#         landlines: \"0571-22098707\",\n#         landlinesRowSpan: 2,\n#       },\n#       {\n#         key: 3,\n#         name: \"Sam\",\n#         age: 28,\n#         address: \"Guangzhou\",\n#         mobile: 18900010555,\n#         landlines: \"0571-22098707\",\n#         landlinesRowSpan: 0,\n#         mobileRowSpan: 2,\n#       },\n#       {\n#         key: 4,\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#         mobile: 18900010555,\n#         landlines: \"0571-22098606\",\n#         mobileRowSpan: 0,\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n\n### Tree\n\n设置 childrenColumnName 来指定树形结构的列名，展开功能的配置可以使用 expandable。目前树形结构暂不支持拖拽。\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.expand:\n      - action: console.log\n    expanded.rows.change:\n      - action: console.log\n  properties:\n    pagination: false\n    childrenColumnName: student\n    expandable:\n      defaultExpandAllRows: true\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 28\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 35\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 33\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table children-column-name=\"student\" id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.expandable = {\n#     defaultExpandAllRows: true,\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 28,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 35,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 33,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.expand\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"expanded.rows.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n#### With Row Selection\n\n设置 rowSelection.checkStrictly 来控制父子数据选中状态是否关联。注意，关联的时候，节点勾选传导策略为【只勾选可触达的可勾选节点】\n\n```yaml preview\n- brick: eo-next-table\n  events:\n    row.select:\n      - action: console.log\n  properties:\n    pagination: false\n    childrenColumnName: student\n    rowSelection:\n      checkStrictly: false\n      indentSize: 50\n      rowDisabled: <% DATA.rowData.age > 30 %>\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 34\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 27\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 35\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table children-column-name=\"student\" id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.pagination = false;\n#   brick_1.rowSelection = {\n#     checkStrictly: false,\n#     indentSize: 50,\n#     rowDisabled: \"<% DATA.rowData.age > 30 %>\",\n#   };\n#   brick_1.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 34,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 27,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 35,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n#   brick_1.addEventListener(\"row.select\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n#### With Front Search\n\n```yaml preview\n- brick: eo-search-bar\n  children:\n    - brick: eo-search\n      slot: start\n      properties:\n        placeholder: Enter keyword\n      events:\n        search:\n          target: \"#table\"\n          method: search\n          args:\n            - q: <% EVENT.detail %>\n- brick: eo-next-table\n  properties:\n    id: table\n    searchFields:\n      - name\n      - age\n      - address\n    pagination: false\n    childrenColumnName: student\n    columns:\n      - dataIndex: name\n        key: name\n        title: Name\n      - dataIndex: age\n        key: age\n        title: Age\n      - dataIndex: address\n        key: address\n        title: Address\n    dataSource:\n      list:\n        - key: \"1\"\n          name: Jack\n          age: 18\n          address: Guangzhou\n          student:\n            - key: \"11\"\n              name: Alex\n              age: 20\n              address: Shanghai\n            - key: \"12\"\n              name: Lucy\n              age: 16\n              address: Yunnan\n            - key: \"13\"\n              name: Sam\n              age: 34\n              address: Guangzhou\n        - key: \"2\"\n          name: Bob\n          age: 27\n          address: Hainan\n          student:\n            - key: \"21\"\n              name: Ava\n              age: 23\n              address: Beijing\n            - key: \"22\"\n              name: Sophia\n              age: 20\n              address: Shanghai\n            - key: \"23\"\n              name: Charlotte\n              age: 35\n              address: Chongqing\n              student:\n                - key: \"231\"\n                  name: Mia\n                  age: 18\n                  address: Chengdu\n                - key: \"232\"\n                  name: Noah\n                  age: 38\n                  address: Hainan\n                - key: \"233\"\n                  name: William\n                  age: 16\n                  address: Taiwan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-search-bar>\n#   <eo-search slot=\"start\" placeholder=\"Enter keyword\" id=\"brick-1\"></eo-search>\n# </eo-search-bar>\n# <eo-next-table children-column-name=\"student\" id=\"table\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"search\", (e) => {\n#     const brick = document.querySelector(\"#table\");\n#     brick.search({ q: \"<% EVENT.detail %>\" });\n#   });\n# \n#   const table = document.getElementById(\"table\");\n#   table.searchFields = [\"name\", \"age\", \"address\"];\n#   table.pagination = false;\n#   table.columns = [\n#     {\n#       dataIndex: \"name\",\n#       key: \"name\",\n#       title: \"Name\",\n#     },\n#     {\n#       dataIndex: \"age\",\n#       key: \"age\",\n#       title: \"Age\",\n#     },\n#     {\n#       dataIndex: \"address\",\n#       key: \"address\",\n#       title: \"Address\",\n#     },\n#   ];\n#   table.dataSource = {\n#     list: [\n#       {\n#         key: \"1\",\n#         name: \"Jack\",\n#         age: 18,\n#         address: \"Guangzhou\",\n#         student: [\n#           {\n#             key: \"11\",\n#             name: \"Alex\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"12\",\n#             name: \"Lucy\",\n#             age: 16,\n#             address: \"Yunnan\",\n#           },\n#           {\n#             key: \"13\",\n#             name: \"Sam\",\n#             age: 34,\n#             address: \"Guangzhou\",\n#           },\n#         ],\n#       },\n#       {\n#         key: \"2\",\n#         name: \"Bob\",\n#         age: 27,\n#         address: \"Hainan\",\n#         student: [\n#           {\n#             key: \"21\",\n#             name: \"Ava\",\n#             age: 23,\n#             address: \"Beijing\",\n#           },\n#           {\n#             key: \"22\",\n#             name: \"Sophia\",\n#             age: 20,\n#             address: \"Shanghai\",\n#           },\n#           {\n#             key: \"23\",\n#             name: \"Charlotte\",\n#             age: 35,\n#             address: \"Chongqing\",\n#             student: [\n#               {\n#                 key: \"231\",\n#                 name: \"Mia\",\n#                 age: 18,\n#                 address: \"Chengdu\",\n#               },\n#               {\n#                 key: \"232\",\n#                 name: \"Noah\",\n#                 age: 38,\n#                 address: \"Hainan\",\n#               },\n#               {\n#                 key: \"233\",\n#                 name: \"William\",\n#                 age: 16,\n#                 address: \"Taiwan\",\n#               },\n#             ],\n#           },\n#         ],\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n\n### Dynamic Columns\n\n```yaml preview\nbrick: eo-next-table\nproperties:\n  cell:\n    useBrick:\n      - if: <% DATA.columnKey !== '01-13' %>\n        brick: em\n        properties:\n          textContent: <% DATA.cellData %>\n      - if: <% DATA.columnKey === '01-13' %>\n        brick: del\n        properties:\n          textContent: <% DATA.cellData %>\n    header:\n      useBrick:\n        brick: em\n        properties:\n          textContent: <% DATA.title %>\n  # Dynamic columns, such as by dates\n  columns: <% CTX.dates %>\n  dataSource:\n    list:\n      - \"01-11\": \"abc\"\n        \"01-12\": \"def\"\n        \"01-13\": \"ghi\"\n        \"01-14\": \"jkl\"\n      - \"01-11\": \"123\"\n        \"01-12\": \"345\"\n        \"01-13\": \"789\"\n        \"01-14\": \"-\"\ncontext:\n  - name: dates\n    value: |\n      <%\n        new Array(4).fill(null).map(\n          (d, i) => moment('2023-01-11').add(i, 'days').format('MM-DD')\n        ).map((key) => ({\n          dataIndex: key,\n          key,\n          title: key,\n        }))\n      %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-next-table id=\"brick-1\"></eo-next-table>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.cell = {\n#     useBrick: [\n#       {\n#         if: \"<% DATA.columnKey !== '01-13' %>\",\n#         brick: \"em\",\n#         properties: {\n#           textContent: \"<% DATA.cellData %>\",\n#         },\n#       },\n#       {\n#         if: \"<% DATA.columnKey === '01-13' %>\",\n#         brick: \"del\",\n#         properties: {\n#           textContent: \"<% DATA.cellData %>\",\n#         },\n#       },\n#     ],\n#     header: {\n#       useBrick: {\n#         brick: \"em\",\n#         properties: {\n#           textContent: \"<% DATA.title %>\",\n#         },\n#       },\n#     },\n#   };\n#   brick_1.columns = \"<% CTX.dates %>\";\n#   brick_1.dataSource = {\n#     list: [\n#       {\n#         \"01-11\": \"abc\",\n#         \"01-12\": \"def\",\n#         \"01-13\": \"ghi\",\n#         \"01-14\": \"jkl\",\n#       },\n#       {\n#         \"01-11\": \"123\",\n#         \"01-12\": \"345\",\n#         \"01-13\": \"789\",\n#         \"01-14\": \"-\",\n#       },\n#     ],\n#   };\n# </script>\n# \n```\n"
+  },
   "advanced.capture-snapshot": {
     "doc": "构件 `advanced.capture-snapshot`\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-button\n  properties:\n    textContent: Save As Image\n    style:\n      margin-right: 10px\n  events:\n    click:\n      - useProvider: advanced.capture-snapshot\n        args:\n          - fileType: image\n            name: image\n        callback:\n          success:\n            - action: console.log\n          error:\n            - action: console.error\n- brick: eo-button\n  properties:\n    textContent: Save As PDF\n    style:\n      margin-right: 10px\n  events:\n    click:\n      - useProvider: advanced.capture-snapshot\n        args:\n          - fileType: pdf\n            name: pdf\n        callback:\n          success:\n            - action: console.log\n          error:\n            - action: console.error\n- brick: eo-button\n  properties:\n    textContent: Capture And Upload\n  events:\n    click:\n      - useProvider: advanced.capture-snapshot\n        args:\n          - fileType: image\n            name: upload\n            bucketName: examples\n            selector: \"#uploadImage\"\n        callback:\n          success:\n            - action: console.log\n          error:\n            - action: console.error\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-button style=\"margin-right: 10px\" id=\"brick-1\">Save As Image</eo-button>\n# <eo-button style=\"margin-right: 10px\" id=\"brick-2\">Save As PDF</eo-button>\n# <eo-button id=\"brick-3\">Capture And Upload</eo-button>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"advanced.capture-snapshot\");\n#     const promise = Promise.resolve(\n#       provider.resolve({ fileType: \"image\", name: \"image\" })\n#     );\n#     promise.then((r) => {\n#       console.log(r);\n#     });\n#     promise.catch((r) => {\n#       console.error(r);\n#     });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"advanced.capture-snapshot\");\n#     const promise = Promise.resolve(\n#       provider.resolve({ fileType: \"pdf\", name: \"pdf\" })\n#     );\n#     promise.then((r) => {\n#       console.log(r);\n#     });\n#     promise.catch((r) => {\n#       console.error(r);\n#     });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"advanced.capture-snapshot\");\n#     const promise = Promise.resolve(\n#       provider.resolve({\n#         fileType: \"image\",\n#         name: \"upload\",\n#         bucketName: \"examples\",\n#         selector: \"#uploadImage\",\n#       })\n#     );\n#     promise.then((r) => {\n#       console.log(r);\n#     });\n#     promise.catch((r) => {\n#       console.error(r);\n#     });\n#   });\n# </script>\n# \n```\n"
   }

package/dist/index.91ec0c58.js

@@ -0,0 +1,2 @@
+(()=>{"use strict";var e,t,r,n,a,o,l,i,c,f,d,s,u,h,p,b,m,v,x,g,P,y,w,k={80513:(e,t,r)=>{var n={"./eo-table":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(5368),r.e(489),r.e(9655),r.e(8769),r.e(6210),r.e(1030),r.e(5049),r.e(5657),r.e(369),r.e(8799),r.e(5502),r.e(572)]).then((()=>()=>r(72643))),"./general-table":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(5368),r.e(489),r.e(9655),r.e(8769),r.e(6210),r.e(1030),r.e(5049),r.e(5657),r.e(369),r.e(8799),r.e(5502),r.e(572)]).then((()=>()=>r(72643))),"./eo-workbench-layout":()=>Promise.all([r.e(3020),r.e(5541),r.e(8769),r.e(6210),r.e(5049),r.e(5657),r.e(9326)]).then((()=>()=>r(55319))),"./capture-snapshot":()=>Promise.all([r.e(8317),r.e(369),r.e(2681),r.e(7067),r.e(944)]).then((()=>()=>r(31007))),"./eo-tree":()=>Promise.all([r.e(3020),r.e(1436),r.e(5368),r.e(8769),r.e(6210),r.e(5049),r.e(5657),r.e(5032)]).then((()=>()=>r(60821))),"./eo-tree-select":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(5368),r.e(9484),r.e(8769),r.e(6210),r.e(5049),r.e(5657),r.e(5677)]).then((()=>()=>r(94018))),"./eo-cascader":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(6070),r.e(8769),r.e(6210),r.e(5049),r.e(5657),r.e(5008)]).then((()=>()=>r(58381))),"./general-cascader":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(6070),r.e(8769),r.e(6210),r.e(5049),r.e(5657),r.e(5008)]).then((()=>()=>r(58381))),"./eo-next-table":()=>Promise.all([r.e(3020),r.e(1436),r.e(1300),r.e(5368),r.e(489),r.e(5683),r.e(8769),r.e(6210),r.e(1030),r.e(5049),r.e(5657),r.e(369),r.e(8799),r.e(5502),r.e(5479),r.e(6184)]).then((()=>()=>r(65481)))},a=(e,t)=>(r.R=t,t=r.o(n,e)?n[e]():Promise.resolve().then((()=>{throw new Error('Module "'+e+'" does not exist in container.')})),r.R=void 0,t),o=(e,t)=>{if(r.S){var n="default",a=r.S[n];if(a&&a!==e)throw new Error("Container initialization failed as it has already been initialized with a different share scope");return r.S[n]=e,r.I(n,t)}};r.d(t,{get:()=>a,init:()=>o})}},j={};function O(e){var t=j[e];if(void 0!==t)return t.exports;var r=j[e]={id:e,loaded:!1,exports:{}};return k[e].call(r.exports,r,r.exports,O),r.loaded=!0,r.exports}O.m=k,O.c=j,O.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return O.d(t,{a:t}),t},t=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,O.t=function(r,n){if(1&n&&(r=this(r)),8&n)return r;if("object"==typeof r&&r){if(4&n&&r.__esModule)return r;if(16&n&&"function"==typeof r.then)return r}var a=Object.create(null);O.r(a);var o={};e=e||[null,t({}),t([]),t(t)];for(var l=2&n&&r;"object"==typeof l&&!~e.indexOf(l);l=t(l))Object.getOwnPropertyNames(l).forEach((e=>o[e]=()=>r[e]));return o.default=()=>r,O.d(a,o),a},O.d=(e,t)=>{for(var r in t)O.o(t,r)&&!O.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},O.f={},O.e=e=>Promise.all(Object.keys(O.f).reduce(((t,r)=>(O.f[r](e,t),t)),[])),O.u=e=>"chunks/"+({572:"eo-table",944:"capture-snapshot",5008:"eo-cascader",5032:"eo-tree",5677:"eo-tree-select",6184:"eo-next-table",9326:"eo-workbench-layout"}[e]||e)+"."+{114:"ad735971",369:"b3bb485d",478:"71d1e246",489:"5ebb95a0",572:"1c25fdb6",726:"919fac3e",729:"0dad2138",790:"31a7a92b",871:"35a2b661",944:"85710dd2",1030:"fbb01e0d",1045:"58461394",1122:"2f11298f",1300:"2ab69ac3",1302:"1f00cafd",1436:"d77b8801",1576:"f0fdd344",1651:"995950c9",1889:"8bfae9a9",1940:"df03fc7e",2052:"c35b0234",2073:"2758f224",2277:"74e11794",2681:"a39c12b9",3020:"96d2d197",3144:"6685c74b",3171:"b2d7ff51",3426:"a803d333",3933:"9491bca4",4041:"65ea4b97",4534:"fea8f57c",4658:"d68baaa8",4741:"ab2c8ebc",4984:"facf8724",5008:"ca254747",5032:"36b56e93",5049:"6120d42d",5053:"739ba196",5250:"55bc8a24",5368:"d258996c",5384:"2dc078c6",5399:"3b2d9352",5479:"469d3551",5502:"a7ebf920",5541:"e0452612",5552:"fd0eb0c7",5657:"b0b3a514",5677:"28238ed0",5683:"7b312ccc",6070:"d752daab",6184:"0fe7a71d",6210:"90cea8bf",6314:"2b50694f",6519:"f212da84",6667:"4c4a37f0",6688:"abb3a1b4",6773:"8c631bdb",7067:"8c97389a",7115:"b514cdd4",7304:"d6adda9f",7389:"8f7253b0",7434:"8fc102a2",7721:"3a15407f",7733:"8647a0f7",7825:"98180d5d",8097:"35291a18",8113:"cefc2380",8317:"e09841ca",8769:"b2959043",8799:"0e54bca9",8989:"22a5d4e9",9326:"e0322990",9484:"887c54ff",9496:"b5000225",9515:"13864880",9559:"ccb8bcda",9655:"9481d820",9755:"a0550860",9844:"9cb901e3"}[e]+".js",O.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),O.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r={},n="@next-bricks/advanced:",O.l=(e,t,a,o)=>{if(r[e])r[e].push(t);else{var l,i;if(void 0!==a)for(var c=document.getElementsByTagName("script"),f=0;f<c.length;f++){var d=c[f];if(d.getAttribute("src")==e||d.getAttribute("data-webpack")==n+a){l=d;break}}l||(i=!0,(l=document.createElement("script")).charset="utf-8",l.timeout=120,O.nc&&l.setAttribute("nonce",O.nc),l.setAttribute("data-webpack",n+a),l.src=e),r[e]=[t];var s=(t,n)=>{l.onerror=l.onload=null,clearTimeout(u);var a=r[e];if(delete r[e],l.parentNode&&l.parentNode.removeChild(l),a&&a.forEach((e=>e(n))),t)return t(n)},u=setTimeout(s.bind(null,void 0,{type:"timeout",target:l}),12e4);l.onerror=s.bind(null,l.onerror),l.onload=s.bind(null,l.onload),i&&document.head.appendChild(l)}},O.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},O.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),(()=>{O.S={};var e={},t={};O.I=(r,n)=>{n||(n=[]);var a=t[r];if(a||(a=t[r]={}),!(n.indexOf(a)>=0)){if(n.push(a),e[r])return e[r];O.o(O.S,r)||(O.S[r]={});var o=O.S[r],l="@next-bricks/advanced",i=(e,t,r,n)=>{var a=o[e]=o[e]||{},i=a[t];(!i||!i.loaded&&(!n!=!i.eager?n:l>i.from))&&(a[t]={get:r,from:l,eager:!!n})},c=[];return"default"===r&&(i("@babel/parser","7.24.4",(()=>O.e(6773).then((()=>()=>O(46773))))),i("@easyops-cn/brick-next-pipes","0.6.0",(()=>Promise.all([O.e(4741),O.e(1030),O.e(6688)]).then((()=>()=>O(24741))))),i("@next-core/cook","2.2.17",(()=>Promise.all([O.e(1122),O.e(6667)]).then((()=>()=>O(61122))))),i("@next-core/element","1.2.8",(()=>O.e(1045).then((()=>()=>O(21045))))),i("@next-core/http","1.2.3",(()=>O.e(8989).then((()=>()=>O(48989))))),i("@next-core/i18n/react","1.0.48",(()=>Promise.all([O.e(8799),O.e(7825),O.e(8097)]).then((()=>()=>O(88097))))),i("@next-core/i18n","1.0.48",(()=>Promise.all([O.e(8799),O.e(9755),O.e(729),O.e(5552)]).then((()=>()=>O(75552))))),i("@next-core/inject","1.0.36",(()=>Promise.all([O.e(1030),O.e(4534),O.e(2277)]).then((()=>()=>O(72277))))),i("@next-core/loader","1.5.9",(()=>O.e(5399).then((()=>()=>O(35399))))),i("@next-core/pipes","2.0.21",(()=>O.e(6519).then((()=>()=>O(76519))))),i("@next-core/react-element","1.0.27",(()=>Promise.all([O.e(8769),O.e(6210),O.e(114)]).then((()=>()=>O(20114))))),i("@next-core/react-runtime","1.5.3",(()=>Promise.all([O.e(8769),O.e(1030),O.e(5049),O.e(369),O.e(7115)]).then((()=>()=>O(97115))))),i("@next-core/runtime","1.44.3",(()=>Promise.all([O.e(4984),O.e(1030),O.e(729),O.e(7067),O.e(1302),O.e(7389),O.e(8113)]).then((()=>()=>O(44984))))),i("@next-core/supply","2.1.16",(()=>Promise.all([O.e(1030),O.e(4534),O.e(1302),O.e(9559)]).then((()=>()=>O(49559))))),i("@next-core/theme","1.5.1",(()=>Promise.all([O.e(1889),O.e(2052)]).then((()=>()=>O(51889))))),i("@next-core/utils/general","1.7.6",(()=>O.e(871).then((()=>()=>O(40871))))),i("@next-core/utils/storyboard","1.7.6",(()=>Promise.all([O.e(2681),O.e(7389),O.e(3933)]).then((()=>()=>O(13933))))),i("history","4.10.1",(()=>O.e(5384).then((()=>()=>O(65384))))),i("i18next-browser-languagedetector","7.2.1",(()=>O.e(726).then((()=>()=>O(50726))))),i("i18next","22.5.1",(()=>O.e(7304).then((()=>()=>O(47304))))),i("js-yaml","3.14.1",(()=>O.e(9515).then((()=>()=>O(19515))))),i("lodash","4.17.21",(()=>O.e(5250).then((()=>()=>O(45250))))),i("moment/locale/zh-cn.js","2.30.1",(()=>Promise.all([O.e(7721),O.e(9844)]).then((()=>()=>O(61329))))),i("moment","2.30.1",(()=>Promise.all([O.e(7721),O.e(9844)]).then((()=>()=>O(99420))))),i("react-dom","0.0.0-experimental-ee8509801-20230117",(()=>Promise.all([O.e(3144),O.e(8769)]).then((()=>()=>O(43144))))),i("react-i18next","12.3.1",(()=>Promise.all([O.e(8769),O.e(7434)]).then((()=>()=>O(97434))))),i("react","0.0.0-experimental-ee8509801-20230117",(()=>O.e(4041).then((()=>()=>O(14041)))))),e[r]=c.length?Promise.all(c).then((()=>e[r]=1)):1}}})(),(()=>{var e;O.g.importScripts&&(e=O.g.location+"");var t=O.g.document;if(!e&&t&&(t.currentScript&&(e=t.currentScript.src),!e)){var r=t.getElementsByTagName("script");if(r.length)for(var n=r.length-1;n>-1&&(!e||!/^http(s?):/.test(e));)e=r[n--].src}if(!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),O.p=e})(),a=e=>{var t=e=>e.split(".").map((e=>+e==e?+e:e)),r=/^([^-+]+)?(?:-([^+]+))?(?:\+(.+))?$/.exec(e),n=r[1]?t(r[1]):[];return r[2]&&(n.length++,n.push.apply(n,t(r[2]))),r[3]&&(n.push([]),n.push.apply(n,t(r[3]))),n},o=(e,t)=>{e=a(e),t=a(t);for(var r=0;;){if(r>=e.length)return r<t.length&&"u"!=(typeof t[r])[0];var n=e[r],o=(typeof n)[0];if(r>=t.length)return"u"==o;var l=t[r],i=(typeof l)[0];if(o!=i)return"o"==o&&"n"==i||"s"==i||"u"==o;if("o"!=o&&"u"!=o&&n!=l)return n<l;r++}},l=e=>{var t=e[0],r="";if(1===e.length)return"*";if(t+.5){r+=0==t?">=":-1==t?"<":1==t?"^":2==t?"~":t>0?"=":"!=";for(var n=1,a=1;a<e.length;a++)n--,r+="u"==(typeof(i=e[a]))[0]?"-":(n>0?".":"")+(n=2,i);return r}var o=[];for(a=1;a<e.length;a++){var i=e[a];o.push(0===i?"not("+c()+")":1===i?"("+c()+" || "+c()+")":2===i?o.pop()+" "+o.pop():l(i))}return c();function c(){return o.pop().replace(/^\((.+)\)$/,"$1")}},i=(e,t)=>{if(0 in e){t=a(t);var r=e[0],n=r<0;n&&(r=-r-1);for(var o=0,l=1,c=!0;;l++,o++){var f,d,s=l<e.length?(typeof e[l])[0]:"";if(o>=t.length||"o"==(d=(typeof(f=t[o]))[0]))return!c||("u"==s?l>r&&!n:""==s!=n);if("u"==d){if(!c||"u"!=s)return!1}else if(c)if(s==d)if(l<=r){if(f!=e[l])return!1}else{if(n?f>e[l]:f<e[l])return!1;f!=e[l]&&(c=!1)}else if("s"!=s&&"n"!=s){if(n||l<=r)return!1;c=!1,l--}else{if(l<=r||d<s!=n)return!1;c=!1}else"s"!=s&&"n"!=s&&(c=!1,l--)}}var u=[],h=u.pop.bind(u);for(o=1;o<e.length;o++){var p=e[o];u.push(1==p?h()|h():2==p?h()&h():p?i(p,t):!h())}return!!h()},c=(e,t)=>{var r=e[t];return Object.keys(r).reduce(((e,t)=>!e||!r[e].loaded&&o(e,t)?t:e),0)},f=(e,t,r,n)=>"Unsatisfied version "+r+" from "+(r&&e[t][r].from)+" of shared singleton module "+t+" (required "+l(n)+")",d=(e,t,r,n)=>{var a=c(e,r);return p(e[r][a])},s=(e,t,r,n)=>{var a=c(e,r);return i(n,a)||h(f(e,r,a,n)),p(e[r][a])},u=(e,t,r)=>{var n=e[t];return(t=Object.keys(n).reduce(((e,t)=>!i(r,t)||e&&!o(e,t)?e:t),0))&&n[t]},h=e=>{"undefined"!=typeof console&&console.warn&&console.warn(e)},p=e=>(e.loaded=1,e.get()),m=(b=e=>function(t,r,n,a){var o=O.I(t);return o&&o.then?o.then(e.bind(e,t,O.S[t],r,n,a)):e(t,O.S[t],r,n,a)})(((e,t,r,n)=>t&&O.o(t,r)?d(t,0,r):n())),v=b(((e,t,r,n,a)=>t&&O.o(t,r)?s(t,0,r,n):a())),x=b(((e,t,r,n,a)=>{var o=t&&O.o(t,r)&&u(t,r,n);return o?p(o):a()})),g={},P={41030:()=>v("default","lodash",[1,4,17,21],(()=>O.e(5250).then((()=>()=>O(45250))))),28297:()=>v("default","moment",[1,2,27,0],(()=>Promise.all([O.e(7721),O.e(9844)]).then((()=>()=>O(99420))))),91204:()=>v("default","js-yaml",[1,3,14,0],(()=>O.e(9515).then((()=>()=>O(19515))))),56667:()=>v("default","@babel/parser",[1,7,24,6],(()=>O.e(6773).then((()=>()=>O(46773))))),18799:()=>m("default","@next-core/i18n",(()=>Promise.all([O.e(9755),O.e(729),O.e(3171)]).then((()=>()=>O(75552))))),47825:()=>v("default","react-i18next",[1,12,3,1],(()=>Promise.all([O.e(8769),O.e(7434)]).then((()=>()=>O(97434))))),2350:()=>v("default","i18next",[1,22,5,1],(()=>O.e(7304).then((()=>()=>O(47304))))),27072:()=>v("default","i18next-browser-languagedetector",[1,7,2,1],(()=>O.e(726).then((()=>()=>O(50726))))),70729:()=>v("default","@next-core/utils/general",[1,1,7,6],(()=>O.e(871).then((()=>()=>O(40871))))),74534:()=>v("default","@next-core/pipes",[1,2,0,21],(()=>O.e(6519).then((()=>()=>O(76519))))),161:()=>v("default","@easyops-cn/brick-next-pipes",[2,0,6,0],(()=>Promise.all([O.e(4741),O.e(1030),O.e(6688)]).then((()=>()=>O(24741))))),18769:()=>x("default","react",[6,0,0,0,,"experimental-ee8509801-20230117"],(()=>O.e(4041).then((()=>()=>O(14041))))),3412:()=>x("default","@next-core/element",[1,1,2,8],(()=>O.e(3426).then((()=>()=>O(21045))))),59435:()=>x("default","react-dom",[6,0,0,0,,"experimental-ee8509801-20230117"],(()=>O.e(3144).then((()=>()=>O(43144))))),35049:()=>x("default","@next-core/react-element",[1,1,0,27],(()=>Promise.all([O.e(6210),O.e(7733)]).then((()=>()=>O(20114))))),80369:()=>v("default","@next-core/runtime",[1,1,44,3],(()=>Promise.all([O.e(4984),O.e(1030),O.e(729),O.e(7067),O.e(1302),O.e(7389),O.e(8113)]).then((()=>()=>O(44984))))),97067:()=>v("default","@next-core/http",[1,1,2,3],(()=>O.e(8989).then((()=>()=>O(48989))))),21302:()=>v("default","moment",[1,2,30,1],(()=>Promise.all([O.e(7721),O.e(9844)]).then((()=>()=>O(99420))))),7389:()=>v("default","@next-core/cook",[1,2,2,17],(()=>Promise.all([O.e(1122),O.e(6667)]).then((()=>()=>O(61122))))),6639:()=>v("default","@next-core/supply",[1,2,1,16],(()=>Promise.all([O.e(4534),O.e(1940)]).then((()=>()=>O(49559))))),14871:()=>v("default","@next-core/inject",[1,1,0,36],(()=>Promise.all([O.e(4534),O.e(4658)]).then((()=>()=>O(72277))))),18701:()=>v("default","@next-core/utils/storyboard",[1,1,7,6],(()=>Promise.all([O.e(2681),O.e(6314)]).then((()=>()=>O(13933))))),26036:()=>v("default","moment/locale/zh-cn.js",[1,2,30,1],(()=>Promise.all([O.e(7721),O.e(9844)]).then((()=>()=>O(61329))))),31586:()=>v("default","@next-core/i18n",[1,1,0,48],(()=>Promise.all([O.e(8799),O.e(9755),O.e(790)]).then((()=>()=>O(75552))))),32890:()=>v("default","history",[1,4,10,1],(()=>O.e(5384).then((()=>()=>O(65384))))),78958:()=>v("default","@next-core/loader",[1,1,5,9],(()=>O.e(5399).then((()=>()=>O(35399))))),52681:()=>m("default","@next-core/utils/general",(()=>O.e(871).then((()=>()=>O(40871))))),5664:()=>x("default","@next-core/react-runtime",[1,1,5,3],(()=>Promise.all([O.e(1030),O.e(369),O.e(9496)]).then((()=>()=>O(97115))))),74766:()=>v("default","@next-core/theme",[1,1,5,1],(()=>O.e(1889).then((()=>()=>O(51889))))),85502:()=>m("default","@next-core/i18n/react",(()=>Promise.all([O.e(7825),O.e(478)]).then((()=>()=>O(88097))))),36538:()=>m("default","react-i18next",(()=>O.e(5053).then((()=>()=>O(97434)))))},y={369:[80369],729:[70729],1030:[41030],1302:[21302],2681:[52681],4534:[74534],5049:[35049],5479:[36538],5502:[85502],5657:[5664,74766],6210:[3412,59435],6519:[161],6667:[56667],6688:[28297,91204],7067:[97067],7389:[7389],7825:[47825],8113:[6639,14871,18701,26036,31586,32890,78958],8769:[18769],8799:[18799],9755:[2350,27072]},w={},O.f.consumes=(e,t)=>{O.o(y,e)&&y[e].forEach((e=>{if(O.o(g,e))return t.push(g[e]);if(!w[e]){var r=t=>{g[e]=0,O.m[e]=r=>{delete O.c[e],r.exports=t()}};w[e]=!0;var n=t=>{delete g[e],O.m[e]=r=>{throw delete O.c[e],t}};try{var a=P[e]();a.then?t.push(g[e]=a.then(r).catch(n)):r(a)}catch(e){n(e)}}}))},(()=>{O.b=document.baseURI||self.location.href;var e={8978:0};O.f.j=(t,r)=>{var n=O.o(e,t)?e[t]:void 0;if(0!==n)if(n)r.push(n[2]);else if(/^(5(049|502|657)|6(210|667|688)|7(067|29|389|825)|8(113|769|799)|1030|1302|2681|369|4534|9755)$/.test(t))e[t]=0;else{var a=new Promise(((r,a)=>n=e[t]=[r,a]));r.push(n[2]=a);var o=O.p+O.u(t),l=new Error;O.l(o,(r=>{if(O.o(e,t)&&(0!==(n=e[t])&&(e[t]=void 0),n)){var a=r&&("load"===r.type?"missing":r.type),o=r&&r.target&&r.target.src;l.message="Loading chunk "+t+" failed.\n("+a+": "+o+")",l.name="ChunkLoadError",l.type=a,l.request=o,n[1](l)}}),"chunk-"+t,t)}};var t=(t,r)=>{var n,a,[o,l,i]=r,c=0;if(o.some((t=>0!==e[t]))){for(n in l)O.o(l,n)&&(O.m[n]=l[n]);i&&i(O)}for(t&&t(r);c<o.length;c++)a=o[c],O.o(e,a)&&e[a]&&e[a][0](),e[a]=0},r=globalThis.webpackChunk_next_bricks_advanced=globalThis.webpackChunk_next_bricks_advanced||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})(),O.nc=void 0;var S=O(80513);window["bricks/advanced"]=S})();
+//# sourceMappingURL=index.91ec0c58.js.map