/**
 * amis-ui v6.14.0-beta.1
 * Copyright 2018-2025 fex
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib = require('tslib');
var React = require('react');
var ReactDOM = require('react-dom');
var amisCore = require('amis-core');
var matchSorter = require('match-sorter');
var PopOverContainer = require('./PopOverContainer.js');
var SearchBox = require('./SearchBox.js');
var GroupedSelection = require('./GroupedSelection.js');
var InputBox = require('./InputBox.js');
var icons = require('./icons.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

var __react_jsx__ = require('react');
var _J$X_ = (__react_jsx__["default"] || __react_jsx__).createElement;
(__react_jsx__["default"] || __react_jsx__).Fragment;
var option2value = function (item) { return item.value; };
var InputBoxWithSuggestion = /** @class */ (function (_super) {
    tslib.__extends(InputBoxWithSuggestion, _super);
    function InputBoxWithSuggestion(props) {
        var _this = _super.call(this, props) || this;
        _this.state = {
            searchText: ''
        };
        _this.onSearch = _this.onSearch.bind(_this);
        _this.filterOptions = _this.filterOptions.bind(_this);
        return _this;
    }
    InputBoxWithSuggestion.prototype.onSearch = function (text) {
        var txt = text.toLowerCase();
        this.setState({ searchText: txt });
    };
    InputBoxWithSuggestion.prototype.filterOptions = function (options) {
        var _this = this;
        return this.props.value
            ? matchSorter.matchSorter(options, this.props.value, {
                keys: ['label', 'value'],
                threshold: matchSorter.matchSorter.rankings.CONTAINS
            }).filter(function (item) { return item.value !== _this.props.value; })
            : options;
    };
    // 选了值，还原options
    InputBoxWithSuggestion.prototype.onPopClose = function (e, onClose) {
        this.setState({ searchText: '' });
        onClose();
    };
    InputBoxWithSuggestion.prototype.render = function () {
        var _this = this;
        var _a = this.props, placeholder = _a.placeholder, onChange = _a.onChange, value = _a.value, cx = _a.classnames, disabled = _a.disabled; _a.translate; var searchable = _a.searchable, popOverContainer = _a.popOverContainer, clearable = _a.clearable, hasError = _a.hasError, mobileUI = _a.mobileUI, className = _a.className;
        var options = this.filterOptions(Array.isArray(this.props.options) ? this.props.options : []);
        return (_J$X_(PopOverContainer.PopOverContainer, { show: !!options.length, popOverContainer: popOverContainer || (function () { return ReactDOM.findDOMNode(_this); }), popOverRender: function (_a) {
                var onClose = _a.onClose;
                return (_J$X_(React__default["default"].Fragment, null,
                    searchable ? (_J$X_(SearchBox["default"], { mini: false, onSearch: _this.onSearch })) : null,
                    _J$X_(GroupedSelection["default"], { multiple: false, onClick: function (e) { return _this.onPopClose(e, onClose); }, options: options, value: [value], option2value: option2value, onChange: function (value) {
                            onChange === null || onChange === void 0 ? void 0 : onChange(value);
                        } })));
            } }, function (_a) {
            var _b;
            var onClick = _a.onClick, ref = _a.ref, isOpened = _a.isOpened;
            return (_J$X_(InputBox["default"], { className: cx('InputBox--sug', className, isOpened ? 'is-active' : ''), ref: ref, placeholder: placeholder, disabled: disabled, value: value, blurValue: (_b = (Array.isArray(_this.props.options)
                    ? _this.props.options
                    : []).find(function (o) { return o.value === value; })) === null || _b === void 0 ? void 0 : _b.label, onChange: onChange, clearable: clearable, onClick: onClick, hasError: hasError, mobileUI: mobileUI }, options.length ? (_J$X_("span", { className: cx('InputBox-caret') },
                _J$X_(icons.Icon, { icon: "right-arrow-bold", className: "icon" }))) : null));
        }));
    };
    return InputBoxWithSuggestion;
}(React__default["default"].Component));
var InputBoxWithSuggestion$1 = amisCore.themeable(amisCore.localeable(InputBoxWithSuggestion));

exports.InputBoxWithSuggestion = InputBoxWithSuggestion;
exports["default"] = InputBoxWithSuggestion$1;
