import { ChevronDown } from "@sofa-design/icons";
import { Button, ConfigProvider, Dropdown, Segmented } from "antd";
import classNames from "classnames";
import React, { useContext } from "react";
import { I18nContext } from "../../../../I18n";
import { useStyle } from "./style";
var ChartFilter = function(param) {
    var filterOptions = param.filterOptions, selectedFilter = param.selectedFilter, onFilterChange = param.onFilterChange, customOptions = param.customOptions, selectedCustomSelection = param.selectedCustomSelection, onSelectionChange = param.onSelectionChange, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, _param_theme = param.theme, theme = _param_theme === void 0 ? 'light' : _param_theme, _param_variant = param.variant, variant = _param_variant === void 0 ? 'default' : _param_variant;
    var _customOptions_find, _i18n_locale;
    var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
    var i18n = useContext(I18nContext);
    var prefixCls = getPrefixCls('chart-filter');
    var _useStyle = useStyle(prefixCls), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
    var handleRegionChange = function(region) {
        if (onSelectionChange) {
            onSelectionChange(region);
        }
    };
    var hasMain = Array.isArray(filterOptions) && filterOptions.length > 1;
    var hasSecondary = Array.isArray(customOptions) && customOptions.length > 1;
    if (!hasMain && !hasSecondary) {
        return null;
    }
    if (!filterOptions || filterOptions.length < 2) {
        return null;
    }
    return wrapSSR(/*#__PURE__*/ React.createElement("div", {
        className: classNames(prefixCls, "".concat(prefixCls, "-").concat(theme), "".concat(prefixCls, "-").concat(variant), hashId, className)
    }, customOptions && customOptions.length > 1 && /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-region-filter"), hashId)
    }, /*#__PURE__*/ React.createElement(Dropdown, {
        menu: {
            items: customOptions.map(function(item) {
                return {
                    key: item.key,
                    label: item.label,
                    disabled: item.key === selectedCustomSelection
                };
            }),
            onClick: function(param) {
                var key = param.key;
                return handleRegionChange(key);
            }
        },
        trigger: [
            'click'
        ],
        getPopupContainer: function() {
            return document.body;
        }
    }, /*#__PURE__*/ React.createElement(Button, {
        type: "default",
        size: "small",
        className: classNames("".concat(prefixCls, "-region-dropdown-btn"), hashId)
    }, /*#__PURE__*/ React.createElement("span", null, ((_customOptions_find = customOptions.find(function(r) {
        return r.key === selectedCustomSelection;
    })) === null || _customOptions_find === void 0 ? void 0 : _customOptions_find.label) || (i18n === null || i18n === void 0 ? void 0 : (_i18n_locale = i18n.locale) === null || _i18n_locale === void 0 ? void 0 : _i18n_locale.all) || '全部'), /*#__PURE__*/ React.createElement(ChevronDown, {
        className: classNames("".concat(prefixCls, "-dropdown-icon"), hashId)
    })))), filterOptions && filterOptions.length > 1 && /*#__PURE__*/ React.createElement(Segmented, {
        options: filterOptions || [],
        value: selectedFilter,
        size: "small",
        className: classNames("".concat(prefixCls, "-segmented-filter"), 'custom-segmented', hashId),
        onChange: function(value) {
            return onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange(value);
        }
    })));
};
export default ChartFilter;
