export default [{
  name: 'items',
  title: '标签项',
  setter: {
    componentName: 'ArraySetter',
    props: {
      itemSetter: {
        componentName: 'ObjectSetter',
        props: {
          config: {
            items: [{
              name: 'tab',
              title: '名称',
              defaultValue: '标签项',
              important: true,
              setter: 'StringSetter'
            }, {
              name: 'key',
              title: '项目编号',
              condition: function condition() {
                return false;
              },
              setter: 'StringSetter'
            }, {
              name: 'closeable',
              title: '可关闭',
              initialValue: false,
              setter: 'BoolSetter'
            }, {
              name: 'disabled',
              title: '是否禁用',
              initialValue: false,
              setter: 'BoolSetter'
            }]
          }
        },
        initialValue: function initialValue() {
          return {
            key: String(Math.floor(Math.random() * 10000)),
            tab: '标签项',
            closeable: false,
            disabled: false
          };
        }
      }
    }
  },
  extraProps: {
    getValue: function getValue(target) {
      var map = target.node.children.map(function (child) {
        var primaryKey = child.getPropValue('key') ? String(child.getPropValue('key')) : child.id;
        return {
          key: primaryKey,
          tab: child.getPropValue('tab') || '标签项',
          closeable: child.getPropValue('closeable'),
          disabled: child.getPropValue('disabled')
        };
      });
      return map;
    },
    setValue: function setValue(target, value) {
      var node = target.node;
      var map = {};
      if (!Array.isArray(value)) {
        value = [];
      }
      value.forEach(function (item) {
        var tabitem = Object.assign({}, item);
        map[item.key] = tabitem;
      });
      node.children.mergeChildren(function (child) {
        var primaryKey = String(child.getPropValue('key'));
        if (Object.hasOwnProperty.call(map, primaryKey)) {
          child.setPropValue('tab', map[primaryKey].tab);
          child.setPropValue('closeable', map[primaryKey].closeable);
          child.setPropValue('disabled', map[primaryKey].disabled);
          delete map[primaryKey];
          return false;
        }
        return true;
      }, function () {
        var items = [];
        for (var primaryKey in map) {
          if (Object.hasOwnProperty.call(map, primaryKey)) {
            items.push({
              componentName: 'TabContainerItem',
              props: map[primaryKey]
            });
          }
        }
        return items;
      }, function (child1, child2) {
        var a = value.findIndex(function (item) {
          return String(item.key) === String(child1.getPropValue('key'));
        });
        var b = value.findIndex(function (item) {
          return String(item.key) === String(child2.getPropValue('key'));
        });
        return a - b;
      });
    }
  }
}, {
  name: 'shape',
  title: '形态',
  defaultValue: 'pure',
  setter: {
    componentName: 'RadioGroupSetter',
    props: {
      options: [{
        title: '普通型',
        value: 'pure'
      }, {
        title: '包裹型',
        value: 'wrapped'
      }, {
        title: '文本型',
        value: 'text'
      }, {
        title: '胶囊型',
        value: 'capsule'
      }]
    }
  }
}, {
  name: 'size',
  title: '尺寸',
  defaultValue: 'medium',
  setter: {
    componentName: 'RadioGroupSetter',
    props: {
      options: [{
        title: '小',
        value: 'small'
      }, {
        title: '中',
        value: 'medium'
      }]
    }
  }
}, {
  name: 'excessMode',
  title: '选项卡过多时的滑动模式',
  defaultValue: 'slide',
  setter: {
    componentName: 'RadioGroupSetter',
    props: {
      options: [{
        title: '滑动',
        value: 'slide'
      }, {
        title: '下拉',
        value: 'dropdown'
      }]
    }
  }
}, {
  name: 'tabPosition',
  title: {
    label: '导航选项卡的位置',
    tip: '只适用于包裹型（wrapped）选项卡'
  },
  condition: function condition(target) {
    var shape = target.getProps().getPropValue('shape');
    return shape === 'wrapped';
  },
  defaultValue: 'top',
  setter: {
    componentName: 'RadioGroupSetter',
    props: {
      options: [{
        title: '顶部',
        value: 'top'
      }, {
        title: '底部',
        value: 'bottom'
      }, {
        title: '左边',
        value: 'left'
      }, {
        title: '右边',
        value: 'right'
      }]
    }
  }
}];