"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var theme_1 = require("../theme");
var react_1 = tslib_1.__importDefault(require("react"));
var uncontrollable_1 = tslib_1.__importDefault(require("uncontrollable"));
var icons_1 = require("./icons");
var Input_1 = tslib_1.__importDefault(require("./Input"));
var helper_1 = require("../utils/helper");
var ResultBox = /** @class */ (function (_super) {
    tslib_1.__extends(ResultBox, _super);
    function ResultBox() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.state = {
            isFocused: false
        };
        return _this;
    }
    ResultBox.prototype.clearValue = function () {
        var onResultChange = this.props.onResultChange;
        onResultChange && onResultChange([]);
    };
    ResultBox.prototype.handleFocus = function (e) {
        var onFocus = this.props.onFocus;
        onFocus && onFocus(e);
        this.setState({
            isFocused: true
        });
    };
    ResultBox.prototype.handleBlur = function (e) {
        var onBlur = this.props.onBlur;
        onBlur && onBlur(e);
        this.setState({
            isFocused: false
        });
    };
    ResultBox.prototype.removeItem = function (e) {
        e.stopPropagation();
        e.preventDefault();
        var _a = this.props, result = _a.result, onResultChange = _a.onResultChange;
        var index = parseInt(e.currentTarget.getAttribute('data-index'), 10);
        var newResult = Array.isArray(result) ? result.concat() : [];
        newResult.splice(index, 1);
        onResultChange && onResultChange(newResult);
    };
    ResultBox.prototype.render = function () {
        var _this = this;
        var _a = this.props, className = _a.className, cx = _a.classnames, classPrefix = _a.classPrefix, clearable = _a.clearable, disabled = _a.disabled, hasError = _a.hasError, result = _a.result, value = _a.value, placeholder = _a.placeholder, children = _a.children, itemRender = _a.itemRender, allowInput = _a.allowInput, inputPlaceholder = _a.inputPlaceholder, onResultChange = _a.onResultChange, onChange = _a.onChange, rest = tslib_1.__rest(_a, ["className", "classnames", "classPrefix", "clearable", "disabled", "hasError", "result", "value", "placeholder", "children", "itemRender", "allowInput", "inputPlaceholder", "onResultChange", "onChange"]);
        var isFocused = this.state.isFocused;
        return (react_1.default.createElement("div", { className: cx('ResultBox', className, isFocused ? 'is-focused' : '', disabled ? 'is-disabled' : '', hasError ? 'is-error' : '') },
            Array.isArray(result) && result.length ? (result.map(function (item, index) { return (react_1.default.createElement("div", { className: cx('ResultBox-value'), key: index },
                react_1.default.createElement("span", { className: cx('ResultBox-valueLabel') }, itemRender(item)),
                react_1.default.createElement("a", { "data-index": index, onClick: _this.removeItem },
                    react_1.default.createElement(icons_1.Icon, { icon: "close" })))); })) : allowInput ? null : (react_1.default.createElement("span", { className: cx('ResultBox-placeholder') }, placeholder || '无')),
            allowInput ? (react_1.default.createElement(Input_1.default, tslib_1.__assign({}, rest, { value: value || '', onChange: onChange, placeholder: Array.isArray(result) && result.length
                    ? inputPlaceholder
                    : placeholder, onFocus: this.handleFocus, onBlur: this.handleBlur }))) : (react_1.default.createElement("span", { className: cx('ResultBox-mid') })),
            clearable && !disabled && Array.isArray(result) && result.length ? (react_1.default.createElement("a", { 
                // data-tooltip="清空"
                // data-position="bottom"
                onClick: this.clearValue, className: cx('ResultBox-clear') },
                react_1.default.createElement(icons_1.Icon, { icon: "close", className: "icon" }))) : null,
            children));
    };
    var _a;
    ResultBox.defaultProps = {
        clearable: false,
        placeholder: '暂无结果',
        inputPlaceholder: '手动输入内容',
        itemRender: function (option) { return react_1.default.createElement("span", null, String(option.label)); }
    };
    tslib_1.__decorate([
        helper_1.autobind,
        tslib_1.__metadata("design:type", Function),
        tslib_1.__metadata("design:paramtypes", []),
        tslib_1.__metadata("design:returntype", void 0)
    ], ResultBox.prototype, "clearValue", null);
    tslib_1.__decorate([
        helper_1.autobind,
        tslib_1.__metadata("design:type", Function),
        tslib_1.__metadata("design:paramtypes", [Object]),
        tslib_1.__metadata("design:returntype", void 0)
    ], ResultBox.prototype, "handleFocus", null);
    tslib_1.__decorate([
        helper_1.autobind,
        tslib_1.__metadata("design:type", Function),
        tslib_1.__metadata("design:paramtypes", [Object]),
        tslib_1.__metadata("design:returntype", void 0)
    ], ResultBox.prototype, "handleBlur", null);
    tslib_1.__decorate([
        helper_1.autobind,
        tslib_1.__metadata("design:type", Function),
        tslib_1.__metadata("design:paramtypes", [typeof (_a = typeof react_1.default !== "undefined" && react_1.default.MouseEvent) === "function" ? _a : Object]),
        tslib_1.__metadata("design:returntype", void 0)
    ], ResultBox.prototype, "removeItem", null);
    return ResultBox;
}(react_1.default.Component));
exports.ResultBox = ResultBox;
exports.default = theme_1.themeable(uncontrollable_1.default(ResultBox, {
    value: 'onChange',
    result: 'onResultChange'
}));
//# sourceMappingURL=./components/ResultBox.js.map
