"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _snippets = _interopRequireDefault(require("./snippets"));
var _default = {
  group: '原子组件',
  componentName: 'Tab',
  title: '选项卡',
  docUrl: '',
  screenshot: '',
  npm: {
    "package": '@alilc/lowcode-materials',
    version: '{{version}}',
    exportName: 'Tab',
    main: '',
    destructuring: true,
    subName: ''
  },
  props: [{
    name: 'rtl',
    propType: 'bool'
  }, {
    name: 'device',
    propType: {
      type: 'oneOf',
      value: ['tablet', 'desktop', 'phone']
    }
  }, {
    name: 'shape',
    propType: {
      type: 'oneOf',
      value: ['pure', 'wrapped', 'text', 'capsule']
    },
    description: '外观形态',
    defaultValue: 'pure'
  }, {
    name: 'animation',
    propType: 'bool',
    description: '是否开启动效',
    defaultValue: true
  }, {
    name: 'excessMode',
    propType: {
      type: 'oneOf',
      value: ['slide', 'dropdown']
    },
    description: '选项卡过多时的滑动模式',
    defaultValue: 'slide'
  }, {
    name: 'tabPosition',
    propType: {
      type: 'oneOf',
      value: ['top', 'bottom', 'left', 'right']
    },
    description: '导航选项卡的位置，只适用于包裹型（wrapped）选项卡',
    defaultValue: 'top'
  }, {
    name: 'size',
    propType: {
      type: 'oneOf',
      value: ['small', 'medium']
    },
    description: '尺寸',
    defaultValue: 'medium'
  }, {
    name: 'triggerType',
    propType: {
      type: 'oneOf',
      value: ['hover', 'click']
    },
    description: '激活选项卡的触发方式',
    defaultValue: 'click'
  }, {
    name: 'lazyLoad',
    propType: 'bool',
    description: '是否延迟加载 TabPane 的内容, 默认开启, 即不提前渲染',
    defaultValue: true
  }, {
    name: 'unmountInactiveTabs',
    propType: 'bool',
    description: '是否自动卸载未处于激活状态的选项卡',
    defaultValue: false
  }, {
    name: 'navClassName',
    propType: 'string',
    description: '导航条的自定义样式类'
  }, {
    name: 'contentClassName',
    propType: 'string',
    description: '内容区容器的自定义样式类'
  }, {
    name: 'extra',
    propType: {
      type: 'instanceOf',
      value: 'node'
    },
    description: '导航栏附加内容'
  }, {
    name: 'onClick',
    propType: 'func',
    description: '点击单个选项卡时触发的回调'
  }, {
    name: 'onChange',
    propType: 'func',
    description: '选项卡发生切换时的事件回调\n@param {String|Number} key 改变后的 key'
  }, {
    name: 'onClose',
    propType: 'func',
    description: '选项卡被关闭时的事件回调\n@param {String|Number} key   关闭的选项卡的 key'
  }, {
    name: 'className',
    propType: 'string'
  }, {
    name: 'style',
    propType: 'object'
  }],
  configure: {
    component: {
      isContainer: true
    },
    props: [{
      name: 'items',
      title: '标签项',
      setter: {
        componentName: 'ArraySetter',
        props: {
          itemSetter: {
            componentName: 'ObjectSetter',
            props: {
              config: {
                items: [{
                  name: 'title',
                  title: '名称',
                  initialValue: '标签项',
                  setter: 'StringSetter',
                  important: true,
                  supportVariable: true
                }, {
                  name: 'primaryKey',
                  title: '项目编号',
                  condition: function condition() {
                    return false;
                  },
                  initialValue: function initialValue(val) {
                    if (val) return val;
                    return String(Math.floor(Math.random() * 10000));
                  },
                  setter: 'StringSetter',
                  supportVariable: true
                }, {
                  name: 'closeable',
                  title: '可关闭',
                  initialValue: false,
                  important: true,
                  setter: 'BoolSetter',
                  supportVariable: true
                }, {
                  name: 'disabled',
                  title: '是否禁用',
                  initialValue: false,
                  important: true,
                  setter: 'BoolSetter',
                  supportVariable: true
                }]
              }
            },
            initialValue: function initialValue() {
              return {
                primaryKey: String(Math.floor(Math.random() * 10000)),
                title: '标签项',
                closeable: false,
                disabled: false
              };
            }
          }
        }
      },
      extraProps: {
        getValue: function getValue(target, fieldValue) {
          // const node = target.node;
          // const children = node.children;
          var map = target.node.children.map(function (child) {
            var primaryKey = child.getPropValue('primaryKey') ? String(child.getPropValue('primaryKey')) : child.id;
            return {
              primaryKey: primaryKey,
              title: child.getPropValue('title'),
              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.primaryKey] = tabitem;
          });
          node.children.mergeChildren(function (child) {
            var primaryKey = String(child.getPropValue('primaryKey'));
            if (Object.hasOwnProperty.call(map, primaryKey)) {
              child.setPropValue('title', map[primaryKey].title);
              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: 'Tab.Item',
                  props: map[primaryKey]
                });
              }
            }
            return items;
          }, function (child1, child2) {
            var a = value.findIndex(function (item) {
              return String(item.primaryKey) === String(child1.getPropValue('primaryKey'));
            });
            var b = value.findIndex(function (item) {
              return String(item.primaryKey) === String(child2.getPropValue('primaryKey'));
            });
            return a - b;
          });
        }
      }
    }, {
      name: 'shape',
      title: '形态',
      defaultValue: 'pure',
      setter: {
        componentName: 'SelectSetter',
        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: {
        label: '模式',
        tip: '选项卡过多时的查看模式'
      },
      condition: function condition() {
        return false;
      },
      defaultValue: 'slide',
      setter: {
        componentName: 'RadioGroupSetter',
        props: {
          options: [{
            title: '滑动',
            value: 'slide'
          }, {
            title: '下拉',
            value: 'dropdown'
          }]
        }
      }
    }, {
      name: 'advance',
      title: '高级',
      type: 'group',
      extraProps: {
        display: 'accordion'
      },
      items: [{
        name: 'unmountInactiveTabs',
        title: '切换销毁',
        defaultValue: false,
        setter: {
          componentName: 'BoolSetter'
        }
      }, {
        name: 'needBadge',
        title: '开启徽标',
        defaultValue: false,
        setter: {
          componentName: 'BoolSetter'
        }
      }, {
        name: 'renderBadge',
        title: '徽标渲染',
        display: 'block',
        setter: {
          componentName: 'FunctionSetter'
          // props: {
          //   defaultActionName="renderBadge",
          //   defaultCode=`function renderBadge(tabItem) {
          //     //支持返回jsx，返回false或者null时不显示内容，返回字符串"dot"显示红点
          //     return 'dot';
          //   }`,
          // }
        },
        condition: function condition(target) {
          return target.parent.getPropValue('needBadge') || false;
        }
      }, {
        name: 'tabRender',
        title: '自定义渲染选项卡',
        display: 'block',
        setter: {
          componentName: 'FunctionSetter'
          // props: {
          //   defaultActionName="renderBadge",
          //   defaultCode=`function renderTabItem(key, props) {
          //     return props.title;
          //   }`,
          // }
        }
      }, {
        name: 'extraRender',
        title: '渲染导航栏附加内容',
        display: 'block',
        setter: {
          componentName: 'FunctionSetter'
          // props: {
          //   defaultActionName="renderBadge",
          //   defaultCode=`function renderTabExtra() {
          //     return 'Extra';
          //   }`,
          // }
        }
      }]
    }, {
      name: 'style',
      setter: {
        componentName: 'StyleSetter'
      }
    }],
    supports: {
      events: ['onClick', 'onChange', 'onClose']
    },
    advanced: {
      initialChildren: [{
        componentName: 'Tab.Item',
        props: {
          primaryKey: 'item1'
        }
      }, {
        componentName: 'Tab.Item',
        props: {
          primaryKey: 'item2'
        }
      }]
    }
  },
  icon: '',
  category: '信息输入',
  snippets: _snippets["default"]
};
exports["default"] = _default;