import { v as i18n$1, w as appContext, i as __read, aC as Select, s as __assign } from './MapEditView-24782753.js';
import * as React from 'react';
import { observer } from 'mobx-react';
import { map } from 'lodash';
import { M as MapDrawerHeader } from './MapDrawerHeader-7a75b579.js';
import { T as Transfer, a as TransferMode } from './Transfer-f55a5877.js';
import 'maptalks';
import 'uuid';
import 'mobx';
import 'lz-string';
import 'dayjs';
import 'react-dom';
import 'classnames';
import 'react-is';
import '@loadable/component';
import 'js-beautify';
import 'axios';
import 'superstruct';
import '@tanem/react-nprogress';
import 'jquery';
import 'chroma-js';
import 'js-cookie';
import 'is-email';
import 'is-uuid';
import 'is-url';
import 'anymatch';
import 'perf-request';
import '@syncpoint/wkx';
import 'buffer';
import '@turf/turf';
import '@mapbox/polylabel';
import 'turf-multipolygon';
import 'turf-polygon';
import 'gcoord';
import 'eventemitter2';
import 'geobuf';
import 'localforage';
import 'rc-menu';
import 'perfect-scrollbar';
import 'ahooks';
import 'jszip';
import 'file-saver';
import 'screenfull';
import 'sql-formatter-fork';
import 'array-move';
import 'turf-multilinestring';
import 'copy-to-clipboard';
import 'maptalks.three';
import 'ajv';
import 'spark-md5';
import 'react-draggable';
import 'react-virtualized';
import 'turf-point';
import 'decamelize';
import 'rbush';
import 'qs';
import 'maptalks.snap';
import 'react-use';
import 'react-rnd';
import 'react-beautiful-dnd';

var useState = React.useState, useMemo = React.useMemo;
var prefixCls = 'info-window-settings';
var i18n = i18n$1.mapEdit.infoWindowSetting;
var i18nSettingPanel = i18n$1.mapEdit.settingsPanel;
var selectOptions = [
    { label: i18nSettingPanel.none, value: -1, key: -1 },
    { label: i18nSettingPanel.noDigit, value: 0, key: 0 },
    { label: '1', value: 1, key: 1 },
    { label: '2', value: 2, key: 2 },
    { label: '4', value: 4, key: 4 },
];
var InfoWindowSetting = observer(function (props) {
    var routeStore = React.useContext(appContext.getContext()).routeStore;
    var CardsStore = routeStore.CardsStore, SuppFiltersStore = routeStore.SuppFiltersStore;
    var getCard = CardsStore.getCard;
    var getColList = SuppFiltersStore.getColList, getCol = SuppFiltersStore.getCol, getColUuid = SuppFiltersStore.getColUuid, getColClassification = SuppFiltersStore.getColClassification;
    var cardId = props.cardId, onCancel = props.onCancel;
    var card = getCard(cardId);
    var _a = card || {}, infoVisual = _a.infoVisual, updateInfoVisual = _a.updateInfoVisual, uuid = _a.uuid;
    var _b = infoVisual || {}, fieldIds = _b.fieldIds, showPicSet = _b.showPicSet;
    var _list = useMemo(function () {
        var noBottomList = (getColList({ uuid: uuid }) || {}).noBottomList;
        return noBottomList;
    }, [getColList, uuid]);
    var _values = useMemo(function () {
        return map(fieldIds, function (f) {
            return getCol({ uuid: uuid, fieldId: f });
        });
    }, [fieldIds, uuid, getCol]);
    var _c = __read(useState((infoVisual === null || infoVisual === void 0 ? void 0 : infoVisual.decimalSetting) || -1), 2), decimals = _c[0], setDecimals = _c[1];
    var _d = __read(useState(_values), 2), values = _d[0], setValues = _d[1];
    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    var _e = __read(useState(showPicSet), 2), _showPicSet = _e[0]; _e[1];
    var ref = React.useRef(null);
    var _ok = function () {
        var fieldIds = map(values, function (v) {
            return getColUuid({ uuid: uuid, col: v });
        });
        var visual = __assign(__assign({}, infoVisual), { fieldIds: fieldIds, showPicSet: _showPicSet, decimalSetting: decimals });
        updateInfoVisual && updateInfoVisual(visual);
        onCancel && onCancel();
    };
    // const suppFilter = getCurrentSuppFilter();
    // const columns = suppFilter.allColumns.filter(HIDE_COLS).map(({ uuid, column }) => ({
    //   title: column,
    //   key: uuid,
    // }));
    var columns = _list.map(function (column) { return ({
        title: column,
        key: column,
        type: getColClassification({ uuid: uuid, col: column }),
    }); });
    var handleCheckChange = function (selected) {
        setValues(selected);
    };
    var handleOrderChange = function (newOrder) {
        setValues(newOrder);
    };
    var handleDecimalChange = function (value) {
        setDecimals(Number.parseInt(value));
    };
    var getPopupContainer = function () { return ref.current; };
    return (React.createElement("div", { className: prefixCls, ref: ref },
        React.createElement(MapDrawerHeader, { title: i18n$1.mapEdit.settingsPanel.infoWindowSetting, okText: i18n$1.mapEdit.okText, cancelText: i18n$1.mapEdit.cancelText, onOk: _ok, onCancel: onCancel }),
        React.createElement("div", { className: "".concat(prefixCls, "-list-setting") },
            React.createElement("div", { className: "fields-to-display", "data-test": "map-info-window-setting-panel-transfer" },
                React.createElement(Transfer, { showCount: false, allowClear: true, allSelectLabel: i18n$1.mapEdit.selectAll, mode: TransferMode.plain, value: values, options: columns, sortable: true, sortListDescriptionText: i18nSettingPanel.fieldsSelected, checkListDescriptionText: i18n.displayFieldsHint, onChange: handleCheckChange, onRemove: handleOrderChange, checkListDynamicRowHeight: true })),
            React.createElement("div", { className: "property-settings" },
                React.createElement("span", { className: "title" }, i18nSettingPanel.propertiesSettings),
                React.createElement("div", { className: "property-sets" },
                    React.createElement("span", { className: "sub-title" }, i18n$1.mapEdit.settingsPanel.fontFraction),
                    React.createElement(Select, { createAble: true, size: "compact", value: decimals !== null && decimals !== void 0 ? decimals : -1, placeholder: i18nSettingPanel.none, options: selectOptions, onSelect: handleDecimalChange, className: "select", getPopupContainer: getPopupContainer }),
                    React.createElement("div", { className: "hint" }, i18nSettingPanel.decimalSettingHint))))));
});
var InfoWindowSetting$1 = InfoWindowSetting;

export { InfoWindowSetting$1 as default };
