"use strict";

var _balloon = _interopRequireDefault(require("../../balloon"));

var _react = _interopRequireDefault(require("react"));

var _reactDom = _interopRequireDefault(require("react-dom"));

var _ = _interopRequireDefault(require(".."));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var Tooltip = _balloon["default"].Tooltip;
var dataSource = [{
  value: '10001',
  label: 'Lucy King'
}, {
  value: 10002,
  label: 'Lily King'
}, {
  value: 10003,
  label: 'Tom Cat',
  disabled: true
}, {
  label: 'Special Group',
  children: [{
    value: -1,
    label: 'FALSE'
  }, {
    value: 0,
    label: 'ZERO'
  }]
}];

function handleChange(value) {
  console.log(value);
}

var maxTagPlaceholder = function maxTagPlaceholder(selectedValues, totalValues) {
  var trigger = /*#__PURE__*/_react["default"].createElement("span", null, "".concat(selectedValues.length, "/").concat(totalValues.length));

  var labels = selectedValues.map(function (obj) {
    return obj.label;
  });
  return /*#__PURE__*/_react["default"].createElement(Tooltip, {
    trigger: trigger
  }, labels.join(', '));
};

var style = {
  width: 200,
  marginRight: 8
};

_reactDom["default"].render( /*#__PURE__*/_react["default"].createElement("div", {
  style: {
    display: 'flex',
    alignItems: 'flex-start'
  }
}, /*#__PURE__*/_react["default"].createElement(_["default"], {
  placeholder: "select all",
  hasSelectAll: true,
  mode: "multiple",
  onChange: handleChange,
  dataSource: dataSource,
  style: style
}), /*#__PURE__*/_react["default"].createElement(_["default"], {
  maxTagCount: 2,
  defaultValue: ['10001', '10002', '-1'],
  mode: "multiple",
  onChange: handleChange,
  dataSource: dataSource,
  style: style
}), /*#__PURE__*/_react["default"].createElement(_["default"], {
  maxTagCount: 2,
  maxTagPlaceholder: maxTagPlaceholder,
  defaultValue: ['10001', '10002', '-1'],
  mode: "multiple",
  onChange: handleChange,
  dataSource: dataSource,
  style: style
}), /*#__PURE__*/_react["default"].createElement(_["default"], {
  maxTagCount: 2,
  tagInline: true,
  mode: "multiple",
  defaultValue: ['10001', '10002', '-1'],
  onChange: handleChange,
  dataSource: dataSource,
  style: style
}), /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null)), document.getElementById('select-demo-4'));