import { aK as createI18n, aL as LANGUAGE, d as __rest, ap as Checkbox, ah as LazyLoad, lj as ColorPanel, a as __awaiter, lk as initFavoriteColorPref, ll as getFavoriteColorPref, lm as setFavorColorsPref } from './MapEditView-f6381866.js';
import * as React from 'react';
import React__default from 'react';
import 'maptalks';
import 'lodash';
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 '@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 'mobx-react';
import 'decamelize';
import 'rbush';
import 'qs';
import 'maptalks.snap';
import 'react-use';
import 'react-rnd';
import 'react-beautiful-dnd';

const cn = {
    themeColorPicker: {
        themeLabel: '跟随主题色',
    },
};

const en = {
    themeColorPicker: {
        themeLabel: 'Follow theme',
    },
};

const localeMap = {
    'zh-CN': cn,
    'en-US': en,
};
const locale = localeMap[LANGUAGE];
const i18n = createI18n({
    defaultLocale: { key: LANGUAGE, values: locale },
    // loader: (name) => import(`../../languages/${name}`),
});
i18n._.locale(LANGUAGE);

/** Custom Theme Footer */
const Footer = (props) => {
    const { prefixCls } = props, restProps = __rest(props, ["prefixCls"]);
    return (React__default.createElement(React__default.Fragment, null,
        React__default.createElement("div", { className: `${prefixCls}-divider` }),
        React__default.createElement(Checkbox, Object.assign({}, restProps, { className: `${prefixCls}-checkbox`, title: i18n.themeColorPicker.themeLabel }))));
};

const ColorPicker = LazyLoad(() => import('./index-505236e6.js'));
const prefixCls = 'dm-theme-color-picker';
const ThemeColorPicker = (props) => {
    const { color, showfollowTheme = false, defaultFollowThemeValue = false, followThemeValue, onFollowThemeChange } = props, restProps = __rest(props, ["color", "showfollowTheme", "defaultFollowThemeValue", "followThemeValue", "onFollowThemeChange"]);
    const [_ftv, _setFtv] = React__default.useState(defaultFollowThemeValue);
    const _onFtvChange = React__default.useCallback((checked) => {
        const isControlled = typeof followThemeValue === 'undefined';
        if (isControlled) {
            _setFtv(checked);
        }
        if (onFollowThemeChange) {
            onFollowThemeChange(isControlled ? checked : !checked, color);
        }
    }, [color, onFollowThemeChange, followThemeValue]);
    return (React__default.createElement(ColorPicker, Object.assign({}, restProps, { color: color, footer: () => showfollowTheme ? (React__default.createElement(Footer, { prefixCls: prefixCls, checked: _ftv, onChange: _onFtvChange })) : null, disabledPanel: showfollowTheme && _ftv })));
};

const useFavors = (onChangeColors) => {
    const [favors, setFavors] = React.useState([]);
    // Init Favor from apis
    const _getFavorColorsPref = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
        initFavoriteColorPref();
        const res = yield getFavoriteColorPref();
        setFavors(res);
    }), []);
    // set Favor to apis
    const _onChangeColors = React.useCallback((colors) => {
        setFavorColorsPref(colors).then(() => {
            setFavors(colors);
        });
        onChangeColors && onChangeColors(colors);
    }, [onChangeColors]);
    React.useEffect(() => {
        _getFavorColorsPref();
    }, [_getFavorColorsPref]);
    return {
        favors,
        onChangeColors: _onChangeColors,
    };
};
const ColorPickerWrapper = (props) => {
    const { onChangeColors: onChangeColorsProps } = props, colorPickerProps = __rest(props, ["onChangeColors"]);
    const { favors, onChangeColors } = useFavors(onChangeColorsProps);
    return React.createElement(ThemeColorPicker, Object.assign({}, colorPickerProps, { favors: favors, onChangeColors: onChangeColors }));
};
const ColorPanelWrapper = (props) => {
    const { onChangeColors: onChangeColorsProps } = props, colorPanelProps = __rest(props, ["onChangeColors"]);
    const { favors, onChangeColors } = useFavors(onChangeColorsProps);
    return React.createElement(ColorPanel, Object.assign({}, colorPanelProps, { favors: favors, onChangeColors: onChangeColors }));
};

export { ColorPanelWrapper, ColorPickerWrapper as default };
