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

import { __extends, __assign } from 'tslib';
import React__default from 'react';
import { flattenTree, themeable, localeable, uncontrollable } from 'amis-core';
import { BaseSelection } from './Selection.js';
import Checkbox from './Checkbox.js';
import VirtualList from './virtual-list/index.js';
import AutoSizer from './virtual-list/AutoSizer.js';

var GroupedSelection = /** @class */ (function (_super) {
    __extends(GroupedSelection, _super);
    function GroupedSelection() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    GroupedSelection.prototype.renderOption = function (option, index, key, styles, testIdBuilder) {
        var _this = this;
        if (key === void 0) { key = "".concat(index); }
        if (styles === void 0) { styles = {}; }
        var _a = this.props, disabled = _a.disabled, cx = _a.classnames, itemRender = _a.itemRender, multiple = _a.multiple, _b = _a.labelField, labelField = _b === void 0 ? 'label' : _b;
        var tBuilder = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild(index);
        if (Array.isArray(option.children)) {
            if (!option[labelField]) {
                return (React__default.createElement(React__default.Fragment, null, option.children.map(function (child, index) {
                    return _this.renderOption(child, index, "".concat(index), {}, tBuilder);
                })));
            }
            return (React__default.createElement("div", { key: index, className: cx('GroupedSelection-group', option.className) },
                React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
                    index: index,
                    multiple: multiple,
                    checked: false,
                    onChange: function () { return undefined; },
                    disabled: disabled || option.disabled,
                    labelField: labelField,
                    classnames: cx,
                    testIdBuilder: tBuilder === null || tBuilder === void 0 ? void 0 : tBuilder.getChild('label')
                })),
                React__default.createElement("div", { className: cx('GroupedSelection-items', option.className) }, option.children.map(function (child, index) {
                    return _this.renderOption(child, index, "".concat(index), {}, tBuilder);
                }))));
        }
        return this.renderPureOption(option, index, key, styles, tBuilder);
    };
    GroupedSelection.prototype.renderOptionOrLabel = function (option, index, hasParent, styles) {
        if (hasParent === void 0) { hasParent = false; }
        if (styles === void 0) { styles = {}; }
        var _a = this.props, disabled = _a.disabled, cx = _a.classnames, itemRender = _a.itemRender, multiple = _a.multiple, labelField = _a.labelField;
        if (option.children) {
            return (React__default.createElement("div", { key: index, style: styles, className: cx('GroupedSelection-group', option.className) },
                React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
                    index: index,
                    multiple: multiple,
                    checked: false,
                    onChange: function () { return undefined; },
                    disabled: disabled || option.disabled,
                    labelField: labelField,
                    classnames: cx
                }))));
        }
        return hasParent ? (React__default.createElement("div", { key: 'group' + index, style: styles, className: cx('GroupedSelection-group', option.className) },
            React__default.createElement("div", { className: cx('GroupedSelection-items', option.className) }, this.renderPureOption(option, index)))) : (this.renderPureOption(option, index, undefined, styles));
    };
    GroupedSelection.prototype.renderPureOption = function (option, index, key, styles, testIdBuilder) {
        var _this = this;
        if (styles === void 0) { styles = {}; }
        var _a = this.props, labelClassName = _a.labelClassName, disabled = _a.disabled, cx = _a.classnames, itemClassName = _a.itemClassName, itemRender = _a.itemRender, multiple = _a.multiple, labelField = _a.labelField;
        var valueArray = this.valueArray;
        var itemTIB = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("item-".concat(index));
        return (React__default.createElement("div", __assign({ key: index, style: styles, className: cx('GroupedSelection-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : '', !!~valueArray.indexOf(option) ? 'is-active' : ''), onClick: function () { return _this.toggleOption(option); } }, itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getTestId()),
            multiple ? (React__default.createElement(Checkbox, { size: "sm", checked: !!~valueArray.indexOf(option), disabled: disabled || option.disabled, labelClassName: labelClassName, description: option.description, testIdBuilder: itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getChild('checkbox') })) : null,
            React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
                index: index,
                multiple: multiple,
                checked: !!~valueArray.indexOf(option),
                onChange: function () { return _this.toggleOption(option); },
                disabled: disabled || option.disabled,
                labelField: labelField,
                classnames: cx,
                testIdBuilder: itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getChild('label')
            }))));
    };
    GroupedSelection.prototype.renderCheckAll = function () {
        var _a = this.props, multiple = _a.multiple, checkAll = _a.checkAll, checkAllLabel = _a.checkAllLabel, cx = _a.classnames, __ = _a.translate, labelClassName = _a.labelClassName, itemClassName = _a.itemClassName;
        if (!multiple || !checkAll) {
            return null;
        }
        var availableOptions = this.getAvailableOptions();
        var valueArray = this.valueArray;
        var checkedAll = availableOptions.every(function (option) { return valueArray.indexOf(option) > -1; });
        var checkedPartial = availableOptions.some(function (option) { return valueArray.indexOf(option) > -1; });
        return (React__default.createElement("div", { className: cx('GroupedSelection-item', itemClassName), onClick: this.toggleAll },
            React__default.createElement(Checkbox, { checked: checkedPartial, partial: checkedPartial && !checkedAll, size: "sm", labelClassName: labelClassName }),
            React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, __(checkAllLabel))));
    };
    GroupedSelection.prototype.render = function () {
        var _this = this;
        var _a;
        var _b = this.props, value = _b.value, options = _b.options, className = _b.className, placeholder = _b.placeholder, cx = _b.classnames, option2value = _b.option2value, onClick = _b.onClick, placeholderRender = _b.placeholderRender, _c = _b.virtualThreshold, virtualThreshold = _c === void 0 ? 1000 : _c, _d = _b.itemHeight, itemHeight = _d === void 0 ? 32 : _d, virtualListHeight = _b.virtualListHeight, testIdBuilder = _b.testIdBuilder;
        var __ = this.props.translate;
        this.valueArray = BaseSelection.value2array(value, options, option2value);
        var body = null;
        if (Array.isArray(options) && options.length) {
            var flattendOptions_1 = flattenTree(options, function (item, index, level) {
                return {
                    option: item,
                    hasParent: level > 1
                };
            });
            body =
                flattendOptions_1.length > virtualThreshold ? (React__default.createElement(AutoSizer, { minHeight: virtualListHeight }, function (_a) {
                    var height = _a.height;
                    return (React__default.createElement(VirtualList, { height: height, itemCount: flattendOptions_1.length, itemSize: itemHeight, prefix: _this.renderCheckAll(), renderItem: function (_a) {
                            var index = _a.index, style = _a.style;
                            var _b = flattendOptions_1[index] || {}, option = _b.option, hasParent = _b.hasParent;
                            if (!option) {
                                return null;
                            }
                            return _this.renderOptionOrLabel(option, index, hasParent, __assign(__assign({}, style), { width: '100%' }));
                        } }));
                })) : (React__default.createElement(React__default.Fragment, null,
                    this.renderCheckAll(),
                    options.map(function (option, key) {
                        return _this.renderOption(option, key, "".concat(key), {}, testIdBuilder);
                    })));
        }
        return (React__default.createElement("div", { className: cx('GroupedSelection', className), onClick: onClick }, body ? (body) : (React__default.createElement("div", { className: cx('GroupedSelection-placeholder') }, (_a = placeholderRender === null || placeholderRender === void 0 ? void 0 : placeholderRender(this.props)) !== null && _a !== void 0 ? _a : __(placeholder)))));
    };
    return GroupedSelection;
}(BaseSelection));
var GroupedSelection$1 = themeable(localeable(uncontrollable(GroupedSelection, {
    value: 'onChange'
})));

export { GroupedSelection, GroupedSelection$1 as default };
