@opentiny/vue-docs 2.1.8 → 2.1.9

package/demos/mobile-first/app/cell/webdoc/cell.js

@@ -6,11 +6,11 @@ export default {
       demoId: 'basic-usage',
       name: {
         'zh-CN': '基本用法',
-        'en-US': 'events'
+        'en-US': 'Basic Usage'
       },
       desc: {
-        'zh-CN': '<p><p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p></p>',
+        'en-US': '<p></p>'
       },
       codeFiles: ['basic-usage.vue']
     },
@@ -18,11 +18,11 @@ export default {
       demoId: 'with-date-picker',
       name: {
         'zh-CN': '结合日期选择一起使用',
-        'en-US': 'events'
+        'en-US': 'Used in conjunction with date selection'
       },
       desc: {
-        'zh-CN': '<p><p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p></p>',
+        'en-US': '<p></p>'
       },
       codeFiles: ['with-date-picker.vue']
     },
@@ -30,11 +30,11 @@ export default {
       demoId: 'placeholder',
       name: {
         'zh-CN': '占位文本',
-        'en-US': 'events'
+        'en-US': 'Placeholder Text'
       },
       desc: {
-        'zh-CN': '<p><p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p></p>',
+        'en-US': '<p></p>'
       },
       codeFiles: ['placeholder.vue']
     },
@@ -42,11 +42,11 @@ export default {
       demoId: 'disabled',
       name: {
         'zh-CN': '禁用',
-        'en-US': 'events'
+        'en-US': 'disabled'
       },
       desc: {
-        'zh-CN': '<p><p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p></p>',
+        'en-US': '<p></p>'
       },
       codeFiles: ['disabled.vue']
     },
@@ -54,14 +54,52 @@ export default {
       demoId: 'icon',
       name: {
         'zh-CN': 'icon 图标',
-        'en-US': 'events'
+        'en-US': 'icon'
       },
       desc: {
-        'zh-CN': '<p>可以传入一个 svg 对象替换默认的下拉图标<p>',
+        'zh-CN': '<p>可以传入一个 svg 对象替换默认的下拉图标</p>',
         'en-US': '<p>bbutton click</p>'
       },
       codeFiles: ['icon.vue']
     }
   ],
-  apis: []
+  apis: [
+    {
+      'name': 'Cell',
+      'type': 'component',
+      'props': [
+        {
+          'name': 'data',
+          'type': 'String',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '数据', 'en-US': 'data' },
+          'demoId': 'basic-usage'
+        },
+        {
+          'name': 'disabled',
+          'type': 'Boolean',
+          'defaultValue': 'true',
+          'desc': { 'zh-CN': '禁用', 'en-US': 'disabled' },
+          'demoId': 'disabled'
+        },
+        {
+          'name': 'icon',
+          'type': 'Object',
+          'defaultValue': '{}',
+          'desc': { 'zh-CN': '设置图标', 'en-US': 'Set icon' },
+          'demoId': 'icon'
+        },
+        {
+          'name': 'placeholder',
+          'type': 'String',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '占位文本',
+            'en-US': 'Placeholder Text'
+          },
+          'demoId': 'placeholder'
+        }
+      ]
+    }
+  ]
 }

package/demos/mobile-first/app/collapse/webdoc/collapse.js

@@ -6,11 +6,11 @@ export default {
       demoId: 'basic-usage',
       name: {
         'zh-CN': '基本用法',
-        'en-US': 'events'
+        'en-US': 'Basic Usage'
       },
       desc: {
-        'zh-CN': '<p><p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p></p>',
+        'en-US': '<p></p>'
       },
       codeFiles: ['basic-usage.vue']
     },
@@ -18,12 +18,13 @@ export default {
       demoId: 'accordion',
       name: {
         'zh-CN': '手风琴效果',
-        'en-US': 'events'
+        'en-US': 'accordion effect'
       },
       desc: {
         'zh-CN':
           '<p>配置 `accordion` 属性为 true 后，折叠面板将展示手风琴效果。配置 `v-model` 设置当前激活的面板(如果是手风琴模式，绑定值类型需要为 string ，否则为 array )；`change` 事件，在当前激活面板改变时触发，参数为当前的 value 值；配置 `name` 属性作为每个 collapse-item 的唯一标志符<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>If the `accordion` attribute is set to true, the collapse panel displays the accordion effect. Configure `v-model` Sets the currently active panel. (In accordion mode, the binding value type must be string. Otherwise, the binding value type is array.) `change` event, which is triggered when the current active panel changes. The parameter is the current value. Configure the `name` attribute as the unique identifier for each collapse-item</p>'
       },
       codeFiles: ['accordion.vue']
     },
@@ -31,11 +32,12 @@ export default {
       demoId: 'dynamic-disable',
       name: {
         'zh-CN': '禁用状态',
-        'en-US': 'events'
+        'en-US': 'disabled'
       },
       desc: {
         'zh-CN': '<p>在 `collapse-item` 元素上配置 `disabled` 属性为 true 后，将禁用指定的折叠面板项。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>When the `disabled` attribute is set to true on the `collapse-item` element, the specified collapse panel item is disabled.</p>'
       },
       codeFiles: ['dynamic-disable.vue']
     },
@@ -43,12 +45,13 @@ export default {
       demoId: 'custom-collapse-title',
       name: {
         'zh-CN': '自定义面板标题',
-        'en-US': 'events'
+        'en-US': 'Custom Panel Title'
       },
       desc: {
         'zh-CN':
           '<p>在 `collapse-item` 元素上配置 `title` 属性可以指定每个折叠面板项的标题。但同时也可以通过 `title` 插槽的方式自定义面板标题，比如在标题前增加图标。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>Configuring the `title` attribute on the `collapse-item` element specifies the title of each collapsed panel item. However, you can also customize the panel title by using the `title` slot, such as adding an icon before the title.</p>'
       },
       codeFiles: ['custom-collapse-title.vue']
     },
@@ -56,12 +59,13 @@ export default {
       demoId: 'custom-collapse-title-right',
       name: {
         'zh-CN': '自定义面板标题右侧内容',
-        'en-US': 'events'
+        'en-US': 'Customizing the Content on the Right of the Panel Title'
       },
       desc: {
         'zh-CN':
           '<p>在 `collapse-item` 元素上配置 `title-right` 属性可以指定每个折叠面板项标题的右侧内容。但同时也可以通过 `title-right` 插槽的方式自定义面板标题右侧内容，比如在标题右侧增加图标。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>在 `collapse-item` 元素上配置 `title-right` 属性可以指定每个折叠面板项标题的右侧内容。但同时也可以通过 `title-right` 插槽的方式自定义面板标题右侧内容，比如在标题右侧增加图标。</p>'
       },
       codeFiles: ['custom-collapse-title-right.vue']
     },
@@ -69,11 +73,11 @@ export default {
       demoId: 'collapse-events',
       name: {
         'zh-CN': '折叠面板事件',
-        'en-US': 'events'
+        'en-US': 'Collapse Panel Events'
       },
       desc: {
         'zh-CN': '<p>激活面板的值改变时将触发 `change` 事件。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>The `change` event is triggered when the value of the active panel changes.</p>'
       },
       codeFiles: ['collapse-events.vue']
     },
@@ -81,11 +85,12 @@ export default {
       demoId: 'block-close',
       name: {
         'zh-CN': '阻止折叠面板关闭事件',
-        'en-US': 'events'
+        'en-US': 'Prevent Collapse Panel Close Event'
       },
       desc: {
         'zh-CN': '<p>:before-close 折叠面板关闭前事件,方法里面 return true/false，表示是否可以关闭<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>:before-close: indicates the event before the folding panel is closed. In the method, return true or false indicates whether the folding panel can be closed.</p>'
       },
       codeFiles: ['block-close.vue']
     },
@@ -93,11 +98,11 @@ export default {
       demoId: 'nested-grid',
       name: {
         'zh-CN': '嵌套表格',
-        'en-US': 'events'
+        'en-US': 'Nested Tables'
       },
       desc: {
         'zh-CN': '<p>通过 `collapse-item` 元素的默认插槽嵌入表格。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>Embed the table through the default slot of the `collapse-item` element</p>'
       },
       codeFiles: ['nested-grid.vue']
     },
@@ -105,11 +110,11 @@ export default {
       demoId: 'nested-form',
       name: {
         'zh-CN': '嵌套表单',
-        'en-US': 'events'
+        'en-US': 'Nested Forms'
       },
       desc: {
         'zh-CN': '<p>通过 `collapse-item` 元素的默认插槽嵌入表单。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>Embed the form through the default slot of the `collapse-item` element.</p>'
       },
       codeFiles: ['nested-form.vue']
     },
@@ -117,11 +122,11 @@ export default {
       demoId: 'slot-title',
       name: {
         'zh-CN': '自定义 Title 展示',
-        'en-US': 'events'
+        'en-US': 'Customized title display'
       },
       desc: {
         'zh-CN': '<p>通过配置 Collapse 内置的 title 插槽实现自定义标题展示<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>Configure the built-in title slot of Collapse to customize the title display.</p>'
       },
       codeFiles: ['slot-title.vue']
     },
@@ -129,11 +134,12 @@ export default {
       demoId: 'slot-title-right',
       name: {
         'zh-CN': '自定义 Title 右侧内容展示',
-        'en-US': 'events'
+        'en-US': 'Customize the content displayed on the right of the title.'
       },
       desc: {
         'zh-CN': '<p>通过配置 Collapse 内置的 title-right 插槽实现自定义标题右侧内容展示<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US':
+          '<p>Configure the built-in title-right slot of Collapse to display the content on the right of a customized title.</p>'
       },
       codeFiles: ['slot-title-right.vue']
     },
@@ -141,14 +147,31 @@ export default {
       demoId: 'slot-icon',
       name: {
         'zh-CN': '自定义 icon 图标',
-        'en-US': 'events'
+        'en-US': 'Custom Icons'
       },
       desc: {
         'zh-CN': '<p>通过配置 Collapse 内置的 icon 插槽实现图标<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>Icons are implemented by configuring the built-in icon slot of Collapse.</p>'
       },
       codeFiles: ['slot-icon.vue']
     }
   ],
-  apis: []
+  apis: [
+    {
+      'name': 'Collapse',
+      'type': 'component',
+      'slots': [
+        {
+          'name': 'icon',
+          'type': '',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '展开收起icon插槽',
+            'en-US': 'Expand and collapse icon slot'
+          },
+          'demoId': 'slot-icon'
+        }
+      ]
+    }
+  ]
 }

package/demos/mobile-first/app/column-list-item/webdoc/column-list-item.js

@@ -10,7 +10,7 @@ export default {
       },
       desc: {
         'zh-CN': '<p></p>',
-        'en-US': '<p>button type</p>'
+        'en-US': '<p></p>'
       },
       codeFiles: ['basic-usage.vue']
     },
@@ -19,11 +19,11 @@ export default {
       demoId: 'size',
       name: {
         'zh-CN': '设置尺寸',
-        'en-US': 'events'
+        'en-US': 'Set Size'
       },
       desc: {
-        'zh-CN': '<p>通过 `size` 属性可以设置分区列表项的大小，支持 small 和 medium 两种尺寸。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>通过 `size` 属性可以设置分区列表项的大小，支持 small 和 medium 两种尺寸。</p>',
+        'en-US': '<p>You can use the `size` attribute to set the size of the partition list item. The size can be small or medium.</p>'
       },
       codeFiles: ['size.vue']
     },
@@ -31,11 +31,11 @@ export default {
       demoId: 'content-slot',
       name: {
         'zh-CN': '内容区插槽',
-        'en-US': 'events'
+        'en-US': 'Content Area Slot'
       },
       desc: {
         'zh-CN': '<p>通过 `#column1、#column2、#column3、#column4` 可以设置内容区插槽，最多支持 4 个内容插槽。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'en-US': '<p>You can use `#column1, #column2, #column3, and #column4` to set the content area slots. A maximum of four content slots are supported.</p>'
       },
       codeFiles: ['content-slot.vue']
     },
@@ -43,12 +43,12 @@ export default {
       demoId: 'custom-width',
       name: {
         'zh-CN': '自定义内容插槽宽度',
-        'en-US': 'events'
+        'en-US': 'Custom Content Slot Width'
       },
       desc: {
         'zh-CN':
-          '<p>通过 `flex-basis` 属性可以设置内容插槽的宽度，flex-basis 类型为数组，最多能传入 4 个值，支持百分比，固定宽度及固有的尺寸关键词，默认为 auto，详情见 flex 的 flex-basis 属性。<br />通过设置`flex-grow`属性可以设置每一项在 flex 容器中分配剩余空间的相对比例，默认为 1。如果不想自动撑满主容器，可以设为 0，详情见 flex 的 flex-grow 属性。<br />flex-grow 举例：`:flex-grow="[0, 0]" :flex-grow="[2, 1]" :flex-grow="[2, 1,1,1]"` <br />flex-basis 举例：`:flex-basis="["200px", "100px","300px"]" :flex-basis="["75%", "25%"]" :flex-basis="["40%", "20%", "20%", "20%"]"`<p>',
-        'en-US': '<p>bbutton click</p>'
+          '<p>通过 `flex-basis` 属性可以设置内容插槽的宽度，flex-basis 类型为数组，最多能传入 4 个值，支持百分比，固定宽度及固有的尺寸关键词，默认为 auto，详情见 flex 的 flex-basis 属性。<br />通过设置`flex-grow`属性可以设置每一项在 flex 容器中分配剩余空间的相对比例，默认为 1。如果不想自动撑满主容器，可以设为 0，详情见 flex 的 flex-grow 属性。<br />flex-grow 举例：`:flex-grow="[0, 0]" :flex-grow="[2, 1]" :flex-grow="[2, 1,1,1]"` <br />flex-basis 举例：`:flex-basis="["200px", "100px","300px"]" :flex-basis="["75%", "25%"]" :flex-basis="["40%", "20%", "20%", "20%"]"`</p>',
+        'en-US': '<p>You can use the `flex-basis` attribute to set the width of the content slot. The flex-basis type is an array. A maximum of four values can be transferred. The percentage, fixed width, and inherent size keywords are supported. The default value is auto. For details, see the flex-basis attribute of Flex.<br />By setting the `flex-grow` property, you can set the relative proportion of the remaining space allocated to each item in the flex container. The default value is 1. If you do not want to automatically fill the main container, set this parameter to 0. For details, see the flex-grow attribute of flex.<br />flex-grow举例：`:flex-grow="[0, 0]":flex-grow="[2, 1]":flex-grow="[2,1,1]"`<br />flex-basis例如：`:flex-basis="["200px","100px","300px"]":flex-basis="["75%","25%"]":flex-basis="["40%","20%","20%"]"`</p>'
       },
       codeFiles: ['custom-width.vue']
     },
@@ -56,11 +56,11 @@ export default {
       demoId: 'icon-click-event',
       name: {
         'zh-CN': '操作列按钮点击事件',
-        'en-US': 'events'
+        'en-US': 'Clicking a button in the operation column'
       },
       desc: {
-        'zh-CN': '<p>通过 `icon-click` 给按钮加点击事件。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>通过 `icon-click` 给按钮加点击事件。</p>',
+        'en-US': '<p>Add a click event to a button through `icon-click`.</p>'
       },
       codeFiles: ['icon-click-event.vue']
     },
@@ -68,11 +68,11 @@ export default {
       demoId: 'icon-disabled',
       name: {
         'zh-CN': '操作列按钮隐藏与禁用',
-        'en-US': 'events'
+        'en-US': 'Hide or Disable Buttons in the Operation Column'
       },
       desc: {
-        'zh-CN': '<p>操作列配置项 options 中添加属性 hidden 可以隐藏按钮，可以通过 disabled 属性禁用操作按钮。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>操作列配置项 options 中添加属性 hidden 可以隐藏按钮，可以通过 disabled 属性禁用操作按钮。</p>',
+        'en-US': '<p>The hidden attribute is added to the options configuration item in the Operation column to hide the button. The disabled attribute can be used to disable the operation button.</p>'
       },
       codeFiles: ['icon-disabled.vue']
     },
@@ -80,11 +80,11 @@ export default {
       demoId: 'image-operate-slot',
       name: {
         'zh-CN': '图片和操作列插槽',
-        'en-US': 'events'
+        'en-US': 'Picture and Action Column Slots'
       },
       desc: {
-        'zh-CN': '<p>通过 `#image` 可以设置图片插槽，通过 `#operate` 可以设置操作列插槽。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>通过 `#image` 可以设置图片插槽，通过 `#operate` 可以设置操作列插槽。</p>',
+        'en-US': '<p>You can use `#image` to set the picture slot and `#operate` to set the operation column slot.</p>'
       },
       codeFiles: ['image-operate-slot.vue']
     },
@@ -92,11 +92,11 @@ export default {
       demoId: 'show-radio',
       name: {
         'zh-CN': '单选',
-        'en-US': 'events'
+        'en-US': 'Single-choice'
       },
       desc: {
-        'zh-CN': '<p>通过属性`show-radio`设置卡片单选，需同时设置 label，`disabled` 属性可以禁用单选按钮 。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>通过属性`show-radio`设置卡片单选，需同时设置 label，`disabled` 属性可以禁用单选按钮 。</p>',
+        'en-US': '<p>Use the `show-radio` attribute to set the card radio option. You need to set the label and `disabled` attribute to disable the radio option button.</p>'
       },
       codeFiles: ['show-radio.vue']
     },
@@ -104,11 +104,11 @@ export default {
       demoId: 'show-checkbox',
       name: {
         'zh-CN': '多选',
-        'en-US': 'events'
+        'en-US': 'Multiple Choices'
       },
       desc: {
-        'zh-CN': '<p>通过属性`show-checkbox`设置卡片多选，需同时设置 label，`disabled` 属性可以禁用复选按钮 。<p>',
-        'en-US': '<p>bbutton click</p>'
+        'zh-CN': '<p>通过属性`show-checkbox`设置卡片多选，需同时设置 label，`disabled` 属性可以禁用复选按钮 。</p>',
+        'en-US': '<p>Use the `show-checkbox` attribute to set multiple card selections. You need to set the label at the same time. The `disabled` attribute can disable the check button.</p>'
       },
       codeFiles: ['show-checkbox.vue']
     },
@@ -116,15 +116,208 @@ export default {
       demoId: 'list-group',
       name: {
         'zh-CN': '列表组',
-        'en-US': 'events'
+        'en-US': 'List Group'
       },
       desc: {
         'zh-CN':
-          '<p>通过引入`column-list-group`组件来对列表进行分组，使用列表组结合复选功能时，需要给 item 设置 label，以此来记录选中的列表项。<p>',
-        'en-US': '<p>bbutton click</p>'
+          '<p>通过引入`column-list-group`组件来对列表进行分组，使用列表组结合复选功能时，需要给 item 设置 label，以此来记录选中的列表项。</p>',
+        'en-US': '<p>The `column-list-group` component is introduced to group lists. When the list group and check function are used, you need to set labels for items to record the selected list items.</p>'
       },
       codeFiles: ['list-group.vue']
     }
   ],
-  apis: []
+  apis: [
+    {
+      'name': 'ColumnListItem',
+      'type': 'component',
+      'props': [
+        {
+          'name': 'auto-width',
+          'type': 'Boolean',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '卡片的宽度是否自动撑开，设置后将不再给卡片设置固定宽度',
+            'en-US': 'Indicates whether the card width is automatically expanded. After the setting, the card width is not fixed.'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'disabled',
+          'type': 'Boolean',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '卡片禁用勾选',
+            'en-US': 'Card Disable Check'
+          },
+          'demoId': 'icon-disabled'
+        },
+        {
+          'name': 'round',
+          'type': 'String',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '通过 round 设置是否展示圆形',
+            'en-US': 'Use round to set whether to display a circle.'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'flex-basis',
+          'type': 'Array',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '设置内容插槽的宽度，最多能传入 4 个值，支持百分比，固定宽度及固有的尺寸关键词，默认为 auto。',
+            'en-US': 'Set the width of the content slot. A maximum of four values can be transferred. The percentage, fixed width, and inherent size keywords are supported. The default value is auto.'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'flex-grow',
+          'type': 'Array',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '设置每一项在 flex 容器中分配剩余空间的相对比例，默认为 [1, 1, 1, 1]。',
+            'en-US': 'Indicates the relative proportion of the remaining space allocated to each item in the flex container. The default value is [1, 1, 1, 1].'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'icon-more',
+          'type': 'Object',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '更多按钮图标，可传入一个svg图标对象进行替换',
+            'en-US': 'More button icons can be replaced by a svg icon object.'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'image',
+          'type': 'String',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '图片地址',
+            'en-US': 'Picture Address'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'label',
+          'type': 'String / Number',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': 'checkbox或radio的label',
+            'en-US': 'Checkbox or radio label'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'options',
+          'type': 'Array',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '操作按钮配置',
+            'en-US': 'Operation Button Configuration'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'show-checkbox',
+          'type': 'Boolean',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '显示checkbox按钮',
+            'en-US': 'Show the checkbox button'
+          },
+          'demoId': 'show-checkbox'
+        },
+        {
+          'name': 'show-radio',
+          'type': 'Boolean',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '显示radio按钮',
+            'en-US': 'Show radio button'
+          },
+          'demoId': 'show-radio'
+        },
+        {
+          'name': 'size',
+          'type': 'String',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '尺寸，支持medium、small 2个尺寸，默认值为medium',
+            'en-US': 'Indicates the size. The options are medium and small. The default value is medium.'
+          },
+          'demoId': 'size'
+        }
+      ],
+      'events': [
+        {
+          'name': 'change',
+          'type': 'Function()',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '组件选中/取消选中事件',
+            'en-US': 'Component check/uncheck event'
+          },
+          'demoId': ''
+        },
+        {
+          'name': 'icon-click',
+          'type': 'Function()',
+          'defaultValue': '',
+          'desc': {
+            'zh-CN': '操作栏按钮点击事件',
+            'en-US': 'Operation bar button click event'
+          },
+          'demoId': 'icon-click-event'
+        }
+      ],
+      'slots': [
+        {
+          'name': 'column1',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '内容插槽1', 'en-US': 'Content Slot 1' },
+          'demoId': 'content-slot'
+        },
+        {
+          'name': 'column2',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '内容插槽2', 'en-US': 'Content Slot 2' },
+          'demoId': 'content-slot'
+        },
+        {
+          'name': 'column3',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '内容插槽3', 'en-US': 'Content Slot 3' },
+          'demoId': 'content-slot'
+        },
+        {
+          'name': 'column4',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '内容插槽4', 'en-US': 'Content Slot 4' },
+          'demoId': 'content-slot'
+        },
+        {
+          'name': 'image',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '图片插槽', 'en-US': 'Picture Slot' },
+          'demoId': 'image-operate-slot'
+        },
+        {
+          'name': 'operate',
+          'type': '',
+          'defaultValue': '',
+          'desc': { 'zh-CN': '操作栏插槽', 'en-US': 'Action Bar Slots' },
+          'demoId': 'image-operate-slot'
+        }
+      ]
+    },
+  ]
 }